:root{color-scheme:dark;--bg:#08182f;--panel:#102740;--text:#eff5fc;--muted:#a6bbd2;--accent:#c7f4a7;--line:#b7d9ff22}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;color:var(--text);font:15px/1.6 system-ui,-apple-system,sans-serif;background:radial-gradient(ellipse at 80% 5%,#16416a,transparent 55%),var(--bg);min-height:100vh}button,input,textarea,select{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:3px}header{max-width:1240px;margin:auto;padding:22px 28px;display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--line);flex-wrap:wrap}.brand{font-size:25px;letter-spacing:-1.5px;font-weight:900}.brand small{font-size:9px;letter-spacing:2px;margin-left:9px;font-weight:500;color:var(--muted)}header nav{display:flex;gap:20px;margin-right:auto;font-size:13px}header nav a:hover{color:var(--accent)}main{max-width:1184px;padding:40px 28px 80px;margin:auto}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(34px,4.4vw,58px);letter-spacing:-2.2px;line-height:1.06;margin-bottom:22px}h2{font-size:25px;letter-spacing:-.8px}h3{font-size:21px;letter-spacing:-.5px}p{color:var(--muted)}.kicker{display:block;font-size:10px;letter-spacing:2px;color:var(--accent);margin-bottom:15px}.lead{max-width:600px;margin-bottom:30px}.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.spread{justify-content:space-between}.button,button{border:1px solid var(--line);color:var(--text);background:#18344f;border-radius:11px;padding:11px 17px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;font-size:13px}.button.primary,button.primary{background:var(--accent);color:#15271f;border:0}.button:hover,button:hover{filter:brightness(1.12)}.muted{color:var(--muted);font-size:12px}.note{font-size:12px;line-height:1.6;color:var(--muted)}.status{min-height:24px;color:#e9c6a8;font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere}.panel{background:linear-gradient(145deg,#14304d,#0c2038);border:1px solid var(--line);padding:26px;border-radius:22px}.two{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}.studioPreview{position:sticky;top:24px}.canvasFrame{position:relative;overflow:hidden;border-radius:20px;background:#07172d;border:1px solid var(--line);isolation:isolate}.canvasFrame canvas{display:block;width:100%;aspect-ratio:480/520;touch-action:none}.demoLabel{position:absolute;top:18px;left:18px;font-size:9px;letter-spacing:2px;background:#07172dcc;border-radius:7px;padding:5px 8px;pointer-events:none}.previewCaption{position:absolute;bottom:18px;left:22px;right:22px;font-size:23px;font-weight:700;pointer-events:none}.fields{display:grid;gap:18px}label{display:block;font-size:12px;color:#c1d2e4}label span{display:block;margin-bottom:7px}input,textarea,select{width:100%;background:#081b30;border:1px solid #799cc64d;border-radius:10px;padding:12px;color:var(--text)}textarea{min-height:100px;resize:vertical}input[type=color]{padding:4px;height:44px}input[type=range]{padding:0;accent-color:var(--accent)}.formPair{display:grid;grid-template-columns:1fr 1fr;gap:18px}.catalog{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:24px}.creationCard{border:1px solid var(--line);border-radius:22px;overflow:hidden;background:linear-gradient(145deg,#14304d,#0c2038);transition:transform .18s,border-color .18s;min-width:0}.creationCard:hover{transform:translateY(-3px);border-color:#96b9da88}.creationCard canvas{display:block;width:100%;height:185px;object-fit:cover}.creationCard .body{padding:21px}.creationCard h3{margin:12px 0 8px;overflow-wrap:anywhere}.creationCard p{font-size:12px;min-height:38px}.creationCard .button{width:100%;margin-top:18px;justify-content:space-between}.person{display:inline-flex;align-items:center;gap:9px;font-size:12px;color:#bdd0e5}.avatar{width:30px;height:30px;border-radius:50%;object-fit:cover;flex-shrink:0}.avatar.large{width:110px;height:110px;border:2px solid #a5c8e54d}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:25px 0}.tabs [aria-pressed=true]{background:var(--accent);color:#14271d}.playLayout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.85fr);gap:32px;align-items:start}.playLayout .canvasFrame{max-width:540px;margin:auto}.gameHUD{position:absolute;top:18px;left:20px;right:20px;display:flex;justify-content:space-between;pointer-events:none;font-size:12px;color:#abc5df}.gameHUD b{display:block;font-size:27px;color:#eff7ff;font-variant-numeric:tabular-nums}.playOverlay{position:absolute;inset:0;background:#061327d9;display:flex;align-items:center;justify-content:center;text-align:center;padding:26px}.playOverlay>div{max-width:330px}.playOverlay h2{font-size:33px;margin:10px 0}.playOverlay p{font-size:13px}.playOverlay .button{width:100%}.gameControls{display:flex;gap:10px;margin-top:12px;justify-content:center}.gameControls button{min-width:70px;flex:1;min-height:58px;touch-action:none;user-select:none}.gameControls .pauseButton{flex:0;font-size:11px}.scoreTable{width:100%;border-collapse:collapse;font-size:13px}.scoreTable td,.scoreTable th{padding:12px 4px;text-align:left;border-bottom:1px solid var(--line)}.scoreTable td:last-child,.scoreTable th:last-child{text-align:right}.scoreTable th{font-size:10px;color:var(--muted)}.communitySection{margin-top:24px;padding-top:24px;border-top:1px solid var(--line)}.comment{padding:16px 0;border-bottom:1px solid var(--line)}.comment p{margin:10px 0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px}.comment time{font-size:10px;color:var(--muted)}.comment button{font-size:10px;padding:4px 8px}.empty{padding:25px 0;color:var(--muted);font-size:13px}.danger{color:#ffbac5;border-color:#d3819366;background:#3a2537}.shareField{margin-top:12px}.shareField input{font-size:12px}.draftNote{margin-top:10px;font-size:11px;color:#a6bbd2}.studioBanner{margin:38px 0 0;padding:30px;border:1px solid #adcdf233;background:linear-gradient(120deg,#153457,#10213c);border-radius:22px;display:flex;justify-content:space-between;align-items:center;gap:20px}.studioBanner h2{margin:0 0 8px}.studioBanner p{margin:0;max-width:630px}.homeNew{margin-top:48px}.homeNew .catalog{margin:20px 0}.homeNew .creationCard canvas{aspect-ratio:auto}.homeNew .creationCard h3{color:#edf5fc}.homeNew .creationCard .button{color:#15271f}.homeCommunity{margin-top:42px}.homeCommunity h2{color:#eff5fc}.homeNew a,.studioBanner a{text-decoration:none}.topSpacer{margin-bottom:25px}.photoPanel{max-width:600px}.photoPanel input[type=file]{margin:16px 0}.profileRow{display:flex;gap:24px;align-items:center;margin:20px 0}.profileRow h2{margin:0}.photoPreview{width:110px;height:110px;border-radius:50%;object-fit:cover}.browseLink{font-size:13px;color:var(--accent)}body[data-page=play] .gameHUD{top:18px!important;right:20px!important;bottom:auto!important;left:20px!important;height:auto!important;min-height:0!important;align-items:flex-start!important}body[data-page=play] .gameHUD>div{height:auto!important;min-height:0!important;align-self:flex-start!important}
@media(max-width:850px){.catalog{grid-template-columns:1fr 1fr}.two,.playLayout{gap:20px}.panel{padding:20px}header{gap:15px;padding:20px}.studioBanner{align-items:start;flex-direction:column}}
@media(max-width:650px){main{padding:30px 18px 60px}header{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:14px!important;padding:22px 18px 18px!important}.brand{align-self:flex-start!important;font-size:31px!important;line-height:1!important;letter-spacing:-1.8px!important}.brand small{display:none!important}header nav{order:initial!important;width:100%!important;margin:0!important;padding:0!important;border:0!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:6px!important}header nav a{min-width:0!important;min-height:42px!important;padding:6px 4px!important;border-radius:12px!important;border:1px solid #4c9fff72!important;background:#0a2542cc!important;color:#edf5fc!important;display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;font-size:9px!important;line-height:1.05!important;font-weight:850!important;white-space:nowrap!important;overflow:hidden!important}header nav a:hover{filter:brightness(1.1)!important}body[data-page="community"] header nav a[href*="community"],body[data-page="studio"] header nav a[href*="studio"],body[data-page="profile"] header nav a[href*="profile"],body[data-page="account"] header nav a[href*="profile"],body[data-page="play"] header nav a[href="/"],body[data-page="home"] header nav a[href="/"]{background:#c5f4a5!important;border-color:#c5f4a5!important;color:#102019!important;box-shadow:0 10px 26px #baf28b24!important}header .socialOpen{margin-left:auto}.two,.playLayout{grid-template-columns:1fr}.studioPreview{position:static;order:-1}.studioPreview .canvasFrame{max-height:280px}.studioPreview canvas{height:280px;object-fit:cover}.catalog{gap:14px}.creationCard .body{padding:16px}.creationCard canvas{height:160px}.creationCard h3{font-size:20px}.studioBanner{padding:24px}.playLayout .canvasFrame{width:100%;max-width:440px}.gameControls button{padding:12px 9px}.formPair{gap:12px}h1{letter-spacing:-1.4px}.profileRow{gap:18px}}
@media(max-width:420px){.catalog{grid-template-columns:1fr}.creationCard canvas{height:205px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
