/* Playroom — Figma-led arcade refresh. Keep the game engines independent. */
:root{--display:"Nunito",system-ui,sans-serif;--r:14px;--rail-w:210px;--top-h:76px;--rail-tile:236px;--gut:32px;--max:1600px;--lime:#c5ee78;--ease:cubic-bezier(.2,.7,.2,1)}
:root[data-theme=dark]{--bg:#111513;--bg-2:#111513;--surface:#1a201c;--surface-2:#242b25;--surface-3:#303a31;--ink:#f5f7f1;--ink-2:#bdc7bc;--ink-3:#9ca99b;--top-bg:#111513;--line:#ffffff0f;--line-2:#ffffff1c;--accent-ink:#c5ee78;--tile-shadow:none;--tile-shadow-h:0 12px 24px #0005;--card-shadow:none}
@media(prefers-color-scheme:dark){:root[data-theme=system]{--bg:#111513;--bg-2:#111513;--surface:#1a201c;--surface-2:#242b25;--surface-3:#303a31;--ink:#f5f7f1;--ink-2:#bdc7bc;--ink-3:#9ca99b;--top-bg:#111513;--line:#ffffff0f;--line-2:#ffffff1c}}
:root[data-accent=lime]{--accent-ink:#487010;--on-accent:#18210f}
:root[data-theme=dark][data-accent=lime]{--accent-ink:#c5ee78}
body{background:var(--bg)}
h1,h2,h3{font-weight:850;letter-spacing:-.035em}
.top{gap:16px;padding:0 28px;border-bottom:1px solid var(--line);backdrop-filter:none}
.brand{gap:10px}.brand .logo{width:37px;height:37px;filter:none}.brand .word{font-family:var(--sans);font-size:19px;font-weight:900;letter-spacing:-.7px}.brand .word small{font-size:8px;letter-spacing:1.7px;color:var(--ink-3);margin-top:6px}
.search{max-width:460px;border:1px solid var(--line-2);border-radius:12px;background:var(--surface);height:44px}.search input{font-weight:500;font-size:14px}.search kbd{border-width:1px;font-weight:500}
.pill{height:42px;border-radius:10px;box-shadow:none;font-size:13px}.ico{width:40px;height:40px}.tools{gap:6px}
.rail{padding:30px 14px 24px;border-right:1px solid var(--line)}.rail a{font-size:13px;font-weight:650;height:44px;padding:0 12px;gap:10px;margin-bottom:4px;border-radius:9px}.rail a .dot{width:23px;height:26px;background:none!important;color:var(--ink-3)!important}.rail a:hover .dot{transform:none}.rail a[aria-current=page]{background:var(--surface-2);box-shadow:none;color:var(--ink)}.rail a[aria-current=page] .dot{color:var(--accent-ink)!important}.rail a .n{font-size:10px;opacity:.8}.rail h4{font-size:9px;letter-spacing:1.5px;margin:22px 12px 14px}.rail hr{margin:20px 8px}.rail .mini{font-size:11px;line-height:1.7;margin-top:30px}
.main{padding:30px var(--gut) 56px}.welcome{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;color:var(--accent-ink);margin-bottom:8px}.welcome h1{font-size:clamp(28px,2.5vw,38px);line-height:1.18}.welcome p{font-size:14px;color:var(--ink-3);margin:8px 0 0}.library-count{font-size:12px;color:var(--ink-3);display:flex;align-items:center;gap:6px;padding:10px 0;white-space:nowrap}.library-count .i{width:14px}
.feature-layout{display:grid;grid-template-columns:minmax(0,2.3fr) minmax(230px,1fr);gap:16px}.feature-lead{position:relative;overflow:hidden;border-radius:18px;min-height:360px;background:#13281f;color:white;isolation:isolate}.feature-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:65% 50%;transition:transform .6s}.feature-lead::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0a1a14ed 0%,#0a1a1494 44%,#0a1a1410 100%)}.feature-image{z-index:-2}.feature-copy{padding:38px 32px;max-width:470px}.feature-kicker{font-size:9px;letter-spacing:1.9px;font-weight:900;color:#d4f3a5}.feature-copy h2{font-size:clamp(28px,3vw,43px);line-height:1.05;letter-spacing:-1.7px;margin:22px 0 14px}.feature-copy p{font-size:13px;line-height:1.7;color:#dde5d9;margin:0 0 25px}.feature-cta{display:inline-flex;align-items:center;gap:8px;padding:13px 19px;background:#c5ee78;border-radius:9px;color:#14200c;font-size:12px;font-weight:900}.feature-cta .i{width:17px;height:17px}.feature-index{position:absolute;bottom:22px;right:24px;font-size:10px;letter-spacing:2px;color:#fff9}.feature-lead:hover .feature-image{transform:scale(1.035)}
.feature-picks{display:grid;grid-template-rows:1fr 1fr;gap:16px}.feature-pick{position:relative;min-height:168px;overflow:hidden;border-radius:16px;background:#172322;color:white;isolation:isolate}.feature-pick img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .5s}.feature-pick::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0b151bea,#0b151b80 64%,#0b151b30);z-index:-1}.feature-pick>div{padding:24px 20px}.feature-pick small{font-size:8px;letter-spacing:1.8px;font-weight:800;color:#d9dedc}.feature-pick h3{font-size:22px;line-height:1.1;margin:13px 0}.feature-pick span{display:flex;align-items:center;gap:5px;font-size:10px;font-weight:800}.feature-pick .i{width:12px;height:12px}.feature-pick:hover img{transform:scale(1.04)}
.mood-nav{display:flex;align-items:center;gap:8px;margin:20px 0 32px;overflow-x:auto;padding:2px 0;scrollbar-width:none}.mood-nav a{display:flex;align-items:center;gap:8px;padding:11px 15px;border:1px solid var(--line-2);border-radius:9px;font-size:11px;font-weight:700;white-space:nowrap;color:var(--ink-2);transition:background .2s}.mood-nav .i{width:16px;height:16px;color:var(--ink-3)}.mood-nav a:hover{background:var(--surface-2);color:var(--ink)}
.sec{margin-top:34px}.sechead{margin-bottom:16px}.sechead h2{font-size:22px;gap:8px}.sechead .badge-ico{display:none!important}.sechead .more{font-size:11px;color:var(--ink-3);font-weight:700;padding:8px}.sechead .arrows button{box-shadow:none;border:1px solid var(--line-2);background:transparent;width:30px;height:30px}.sechead .sub{font-size:11px}.row{gap:18px;padding-bottom:14px}.grid{gap:26px 18px}
.tile.captioned>a,.tile.labeled>a{display:flex;flex-direction:column;gap:10px}.tile.captioned .art,.tile.labeled .art{height:auto;aspect-ratio:16/10;border-radius:12px}.tile.captioned .under,.tile.labeled .under{display:block!important;font:800 14px/1.4 var(--sans)!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 2px!important}.tile.captioned .under small,.tile.labeled .under small{display:block;font:500 11px/1.6 var(--sans)!important;color:var(--ink-3)}.tile.captioned .cap,.tile.labeled .cap{display:none}.tile .flag{font-size:8px;letter-spacing:1px;border-radius:5px;height:20px;padding:0 7px;box-shadow:none;background:#173b27;color:#c9f3d5}.tile .flag.hot{background:#202b22;color:#d1e5c1}.tile .fav{width:34px;height:34px}.tile:hover,.tile:focus-within{transform:translateY(-3px)}.tile:hover .art,.tile:focus-within .art{box-shadow:var(--tile-shadow-h),0 0 0 2px var(--accent)}
.phead{border:1px solid var(--line);box-shadow:none;padding:24px}.phead h1{font-size:30px}.phead .big-ico{border-radius:12px}.cats-grid{gap:12px}.catcard{border:1px solid var(--line-2);background:var(--surface);box-shadow:none;border-radius:12px;font-size:15px;min-height:88px}.catcard .i{color:var(--ink-3)}
.foot{background:var(--surface);border-top:1px solid var(--line)}.foot .in{max-width:1360px}.foot .brand{pointer-events:auto}.foot .fh{font-size:14px}.foot p,.foot li{font-size:12px}.foot .base{font-size:11px}.playbtn{box-shadow:none;background:var(--accent);color:var(--on-accent);border-radius:10px;font-family:var(--sans);font-weight:850}.game-grid .card,.gbar{box-shadow:none}.splash h1{font-weight:850}.splash .shot{box-shadow:0 16px 48px #0006;border-radius:12px}.btn{border-radius:9px}.dialog{border-radius:18px}
@media(min-width:761px) and (max-width:1100px){:root{--rail-w:76px;--gut:24px}.feature-layout{grid-template-columns:minmax(0,1.7fr) minmax(205px,1fr)}.feature-copy{padding:32px 24px}.feature-copy h2{font-size:34px}.feature-pick h3{font-size:20px}.library-count{display:none}.top{padding:0 16px;gap:12px}}
@media(max-width:760px){:root{--top-h:66px;--rail-w:0px;--rail-tile:190px;--gut:18px}.top{padding:0 16px;gap:8px}.brand .logo{width:32px;height:32px}.brand .word{font-size:17px;display:flex}.brand .word small{font-size:7px;letter-spacing:1.1px}.tools{gap:0}.tools .ico{width:36px;height:40px}#rnd{display:none}.main{padding:24px 18px 40px}.chips{display:flex;gap:8px;padding:8px 18px}.chips .chip{height:40px;font-size:12px;border-radius:9px}.welcome{margin-bottom:20px}.welcome h1{font-size:29px;letter-spacing:-1.2px}.welcome p{font-size:12px;line-height:1.6}.eyebrow{font-size:8px;margin-bottom:7px}.library-count{display:none}.feature-layout{grid-template-columns:1fr;gap:12px}.feature-lead{min-height:330px;border-radius:16px}.feature-copy{padding:29px 23px;max-width:100%}.feature-copy h2{font-size:31px;line-height:1.1;letter-spacing:-1px;margin:22px 0 13px}.feature-copy p{font-size:12px}.feature-kicker{font-size:8px;letter-spacing:1.5px}.feature-cta{padding:13px 16px;font-size:11px}.feature-picks{grid-template-columns:1fr 1fr;grid-template-rows:1fr;gap:12px}.feature-pick{min-height:145px;border-radius:12px}.feature-pick>div{padding:20px 14px}.feature-pick small{font-size:9px;letter-spacing:1px}.feature-pick h3{font-size:19px;margin:13px 0 12px}.feature-pick span{font-size:11px}.feature-index{font-size:8px;right:18px;bottom:16px}.mood-nav{margin:16px -18px 26px;padding:0 18px}.mood-nav a{font-size:11px;padding:11px 13px}.sec{margin-top:28px}.sechead h2{font-size:20px}.sechead .more{font-size:10px;padding:6px 0 6px 8px;white-space:nowrap}.row{gap:12px}.grid{gap:22px 12px}.tile.captioned .under{font-size:12px!important}.tile.captioned .under small{font-size:10px!important}.tile .fav{opacity:1;transform:none;width:32px;height:32px}.tile .flag{font-size:7px}.search{top:11px;left:16px;right:16px}.phead h1{font-size:25px}.player{--h:max(270px,min(56vw,420px))}.foot .in{padding:30px 20px}.foot .base{line-height:1.8}.cats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.catcard{font-size:13px;min-height:76px}.catcard small{font-size:10px}}
@media(prefers-reduced-motion:reduce){.feature-image,.feature-pick img{transition:none}.feature-lead:hover .feature-image,.feature-pick:hover img{transform:none}}

:root[data-labels="0"] .tile.captioned .under small{display:none!important}
