*{box-sizing:border-box} :root{--nav:#11283e;--canvas:#f3f5f7;--surface:#fff;--ink:#1c2733;--muted:#687985;--accent:#0f4a8a;--border:#d2deea;--danger:#bd3941;--mint:#ccf4e4;--radius:16px} [data-theme=dark]{--canvas:#111b28;--surface:#1b2b3c;--ink:#e7f1fb;--muted:#b0c0ce;--border:#344a61;--accent:#79bcff}html{scroll-behavior:smooth}body{margin:0;background:var(--canvas);color:var(--ink);font-family:'Segoe UI','Malgun Gothic',sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,.button{cursor:pointer;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--ink);padding:9px 16px;display:inline-flex;align-items:center;justify-content:center;gap:8px}button:hover,.button:hover{filter:brightness(.95)}button:disabled{opacity:.55;cursor:wait}.primary{background:#0f4a8a;color:white;border-color:#0f4a8a}.danger{background:var(--danger);color:white;border-color:var(--danger)}:focus-visible{outline:3px solid #6ab0e9;outline-offset:3px}input,select,textarea{padding:10px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--ink);max-width:100%}input:not([type=checkbox]):not([type=radio]){width:100%}label{display:block;margin:14px 0}.topbar{background:var(--nav);color:white;display:flex;align-items:center;gap:36px;padding:12px 28px;position:relative;z-index:20;min-height:72px}.brand{font-size:21px;letter-spacing:1px;white-space:nowrap}.brand span{color:#b8f2d9}.topbar nav{display:flex;align-items:center;gap:26px;flex:1;font-size:14px}.topbar nav details{position:relative}.topbar summary{cursor:pointer;list-style:none}.topbar summary:after{content:'⌄';margin-left:9px}.dropdown{position:absolute;top:38px;left:0;min-width:235px;padding:8px;background:var(--surface);color:var(--ink);border:1px solid var(--border);border-radius:12px;box-shadow:0 14px 35px #0003;max-height:75vh;overflow:auto}.dropdown a{display:block;padding:8px;border-radius:8px}.dropdown a:hover{background:var(--canvas)}.account{display:flex;align-items:center;gap:12px;font-size:13px}.account form{margin:0}.account button{background:transparent;border-color:#ffffff40;color:white;padding:6px 10px}.text-button{background:none;border:0;color:var(--accent)}main{max-width:1480px;padding:24px 36px;margin:auto}h1,h2,h3,p{margin:0 0 12px}h1{font-size:clamp(34px,4vw,57px);line-height:1.15;letter-spacing:-2px}h2{font-size:24px;letter-spacing:-.6px}h3{font-size:18px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:800;color:var(--accent)}.hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:32px;padding:44px 48px;border-radius:22px;background:var(--surface);border:1px solid var(--border);min-height:360px;overflow:hidden}.hero h1 span{color:var(--accent)}.hero p:not(.eyebrow){color:var(--muted);font-size:16px;margin:20px 0}.hero-note{display:block;font-size:12px;color:var(--muted);margin-top:14px}.hero-art{height:290px;position:relative;background:radial-gradient(ellipse,#d2f5e5,transparent 68%)}.orbit{position:absolute;width:260px;height:260px;border:1px dashed #75b8a1;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-20deg)}.art-main{position:absolute;font-size:135px;left:50%;top:45%;transform:translate(-50%,-50%) rotate(-12deg);filter:drop-shadow(12px 20px 12px #17473725)}.art-egg{position:absolute;font-size:65px;left:12%;top:15%;transform:rotate(-15deg)}.art-burger{position:absolute;font-size:80px;right:8%;bottom:15%;transform:rotate(15deg)}.art-star{position:absolute;font-size:65px;right:14%;top:0;color:#dd9d38}.art-caption{position:absolute;left:50%;bottom:0;transform:translateX(-50%) rotate(-5deg);padding:7px 20px;border-radius:50px;background:#11283e;color:#d8f8ea;font-size:11px;letter-spacing:2px;white-space:nowrap}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:15px;margin:38px 0 16px}.section-heading h2{margin:0}.badge{font-size:11px;padding:6px 12px;border-radius:20px;border:1px solid var(--border);color:var(--muted)}.ranking-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.rank-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:17px 20px}.rank-title{display:flex;align-items:center;gap:10px;margin-bottom:12px}.rank-title h3{font-size:14px;flex:1;margin:0}.rank-title>span{font-size:22px}.leader{display:flex;gap:12px;align-items:center;font-size:12px;margin-top:8px}.leader>span{flex:1}.position{color:#91a8bc}.leader small{font-size:10px;color:var(--muted)}.empty{font-size:12px;color:var(--muted);padding:12px 0 0}.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.filters input{width:140px!important}.filters button{font-size:12px}.filters .active{background:var(--nav);color:white}.game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.game-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:transform .2s}.game-card:hover{transform:translateY(-4px)}.game-art{height:190px;background:#d8eee8;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.game-art:before,.game-art:after{content:'';position:absolute;border:1px solid #fff8;border-radius:50%;width:170px;height:170px;transform:rotate(-25deg);right:-30px;top:-60px}.game-art:after{left:-60px;bottom:-100px;top:auto;width:210px;height:210px}.game-art span{font-size:94px;filter:drop-shadow(0 15px 7px #0002);transform:rotate(-8deg)}.game-art i{position:absolute;right:16px;bottom:14px;font-size:10px;letter-spacing:2px;color:#203d40;font-style:normal;background:#fff9;border-radius:20px;padding:4px 12px}.art-gunarcade{background:linear-gradient(120deg,#cad5f2,#b9ddf2)}.art-burgerbuddies{background:linear-gradient(120deg,#fff0ce,#f1d6c3)}.art-unicornruns{background:linear-gradient(120deg,#edd5f8,#ceeaec)}.art-myegg{background:linear-gradient(120deg,#d4edc9,#d9eade)}.art-breakout{background:linear-gradient(120deg,#bcc4f0,#e4c3ef)}.art-racing{background:linear-gradient(120deg,#fadac3,#f0bcc3)}.art-BlueMarble{background:linear-gradient(120deg,#cde3f7,#c8eadc)}.art-ladder{background:linear-gradient(120deg,#f5e7b5,#e4dbbc)}.game-copy{padding:22px}.card-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;letter-spacing:.7px;margin-bottom:10px}.game-copy h3{font-size:22px}.game-copy p{font-size:13px;color:var(--muted);min-height:44px}.play-link{display:flex;justify-content:space-between;padding-top:16px;border-top:1px solid var(--border);font-size:13px;font-weight:700;color:var(--accent)}footer{text-align:center;font-size:12px;color:var(--muted);padding:42px}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px;margin-bottom:20px}.page-heading{padding:24px 0 28px}.page-heading h1{font-size:36px}.page-heading p{color:var(--muted)}dialog{border:1px solid var(--border);background:var(--surface);color:var(--ink);border-radius:18px;padding:28px;width:min(460px,calc(100vw - 28px));box-shadow:0 24px 100px #0005}dialog::backdrop{background:#11283ead;backdrop-filter:blur(5px)}#auth-dialog{position:fixed}.dialog-close{float:right;padding:4px 10px}#auth-error,#reset-error{color:var(--danger);font-size:13px}.notice{padding:14px;border:1px solid var(--border);background:var(--surface);border-radius:12px}.play-page{margin:-12px -20px}.play-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:12px;padding:8px 0 18px}.play-toolbar>div{display:flex;gap:10px;align-items:center}#game-frame{display:block;border:1px solid var(--border);border-radius:12px;width:100%;height:calc(100dvh - 158px);min-height:420px;background:#101625}.immersive .topbar{display:none}.immersive main{max-width:none;padding:0}.immersive .play-page{margin:0}.immersive .play-toolbar{padding:8px 12px}.immersive #game-frame{height:calc(100dvh - 54px);border:0;border-radius:0}.mypage-layout{display:grid;grid-template-columns:190px 1fr;gap:24px;min-width:0}.my-nav{display:flex;flex-direction:column;gap:10px;background:var(--nav);border-radius:14px;color:white;height:max-content;padding:18px}.my-nav a{padding:8px}.mypage-layout>div{min-width:0}.progress-row{display:flex;gap:16px;align-items:center;border-bottom:1px solid var(--border);padding:14px 0}.progress-row>div{flex:1}.progress-row h3{margin:0}.progress-row p{font-size:12px;color:var(--muted);margin:0}.progress-icon{font-size:32px}.muted{color:var(--muted);font-size:12px;margin-top:18px}.wallet-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-bottom:20px}.wallet{padding:18px;background:var(--canvas);border-radius:12px}.wallet h3{font-size:30px;margin:4px 0}.wallet p{font-size:11px;color:var(--muted);margin:0}.table-wrap{overflow:auto;margin:16px 0;border:1px solid var(--border);border-radius:12px}table{width:100%;border-collapse:collapse;font-size:13px}th,td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--border);white-space:nowrap}th{background:var(--canvas)}.avatar-choices{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.avatar-choices label{background:var(--canvas);padding:18px;border-radius:12px;font-size:20px}.shop-card{text-align:center}.shop-icon{font-size:65px}.panel code{overflow-wrap:anywhere;font-size:12px}section[id]{scroll-margin-top:20px}@media(max-width:1000px){.topbar{gap:20px;padding:12px 18px}.topbar nav{gap:14px}.game-grid,.ranking-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{padding:30px}.hero-art{height:240px}.avatar-choices{grid-template-columns:1fr 1fr}}@media(max-width:650px){main{padding:18px}.topbar{flex-wrap:wrap;gap:10px 18px}.topbar nav{order:3;flex-basis:100%;justify-content:space-between}.account{margin-left:auto}.hero{grid-template-columns:1fr;padding:26px;gap:10px}.hero-art{height:200px}.hero h1{font-size:40px}.game-grid,.ranking-grid{grid-template-columns:1fr}.section-heading{align-items:start;flex-direction:column}.mypage-layout{grid-template-columns:1fr}.my-nav{flex-direction:row;overflow:auto;padding:8px;font-size:12px}.progress-row{flex-wrap:wrap}.progress-row>div{min-width:65%}.play-page{margin:0}.play-toolbar{flex-wrap:wrap}#game-frame{height:calc(100dvh - 215px)}.play-toolbar>div{flex-wrap:wrap}.page-heading h1{font-size:28px}.panel{padding:18px}.hero-note{font-size:11px}.immersive #game-frame{height:calc(100dvh - 94px)}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.avatar-preview{background:var(--canvas);border-radius:16px;padding:22px;display:flex;gap:8px;align-items:center;width:max-content;max-width:100%}.avatar-preview>span{font-size:74px}.avatar-preview i{font-size:32px;font-style:normal}

/* Only /play/: size the iframe from actual flex space, including wrapped mobile menus. */
body.game-play{height:100dvh;min-height:0;overflow:hidden;display:flex;flex-direction:column}
body.game-play>.topbar{flex:0 0 auto}
body.game-play>main{flex:1 1 0;min-height:0;width:100%;padding:10px 14px;display:flex;flex-direction:column;overflow:hidden}
body.game-play .play-page{flex:1 1 0;min-height:0;margin:0;display:flex;flex-direction:column;overflow:hidden}
body.game-play .play-toolbar{flex:0 0 auto;padding:0 0 8px;gap:8px}
body.game-play #game-frame{flex:1 1 0;min-height:0;height:0;width:100%;display:block}
body.game-play .play-toolbar button{padding:6px 10px;font-size:12px}
body.game-play #play-notice{position:fixed;left:14px;bottom:14px;right:14px;z-index:25;margin:0;max-height:25dvh;overflow:auto}
body.game-play.immersive>main{padding:0}
body.game-play.immersive .play-toolbar{padding:6px 10px}
@media(max-width:650px){body.game-play>main{padding:6px}body.game-play .play-toolbar{font-size:11px}body.game-play .play-toolbar>div{gap:6px}body.game-play #save-status{font-size:10px}}