@font-face{font-family:Bungee;src:url('../assets/fonts/Bungee-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'Chakra Petch';src:url('../assets/fonts/ChakraPetch-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'Chakra Petch';src:url('../assets/fonts/ChakraPetch-Medium.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:'Chakra Petch';src:url('../assets/fonts/ChakraPetch-SemiBold.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:'Chakra Petch';src:url('../assets/fonts/ChakraPetch-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
:root{color-scheme:dark;--bg:#0c0f14;--panel:#12161d;--line:#ffffff12;--ink:#f4f2ed;--muted:#939ba7;--accent:#f5c86a;--gold:#f5c86a;font-family:'Chakra Petch',sans-serif;font-synthesis:none}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink)}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible,a:focus-visible{outline:0.125rem solid var(--accent);outline-offset:0.3125rem}
button{border:0}
button:disabled{cursor:default}
button,[role=button]{touch-action:manipulation}
[hidden]{display:none!important}
.sr-only{position:absolute;width:0.0625rem;height:0.0625rem;padding:0;margin:-0.0625rem;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.arcade{min-height:100svh;display:grid;grid-template-columns:17.625rem minmax(0,1fr);grid-template-rows:5.625rem minmax(0,1fr) 2.875rem}
.masthead{grid-column:1/-1;display:flex;align-items:center;padding:0 2.125rem 0 1.5625rem;border-bottom:0.0625rem solid var(--line);background:#0f131a;position:relative;z-index:2;gap:2.125rem}
.brand{width:14.25rem;display:block;line-height:0;flex:none}
.brand img{width:100%;height:auto}
.mast-caption{border-left:0.0625rem solid #ffffff1c;padding-left:1.875rem;display:grid;gap:0.4375rem}
.mast-caption>span{font-size:0.625rem;font-weight:700;letter-spacing:0.175rem}
.mast-caption small{font-size:0.75rem;color:var(--muted)}
.mast-actions{margin-left:auto;display:flex;align-items:center;gap:1.75rem}
.online{display:flex;align-items:center;gap:0.5625rem;font-size:0.5625rem;font-weight:700;letter-spacing:0.1rem;color:#bec5c7}
.online i{width:0.375rem;height:0.375rem;background:#89d9a9;border-radius:50%;box-shadow:0 0 0.625rem #89d9a944}
.icon-button{background:#1c222b;border:0.0625rem solid #ffffff0f;width:2.25rem;height:2.25rem;border-radius:0.375rem;font-size:1.4375rem}
.icon-button:hover{background:#2d3541}

.library{background:#13171e;border-right:0.0625rem solid #ffffff14;display:flex;flex-direction:column;padding:1.8125rem 0.9375rem 1.125rem;min-height:0;z-index:1}
.library-heading{display:flex;align-items:center;justify-content:space-between;margin:0 0.75rem 1.25rem;font-size:0.625rem;font-weight:700;letter-spacing:0.125rem;color:#aab0bb}
.count{border:0.0625rem solid #ffffff16;border-radius:0.25rem;color:#d5d9df;padding:0.25rem 0.375rem;font:0.625rem 'Chakra Petch',sans-serif;letter-spacing:0}
.filters{display:flex;gap:0.1875rem;margin:0 0.3125rem 1.25rem;border-bottom:0.0625rem solid var(--line);padding-bottom:0.8125rem}
.filters button{padding:0.5rem 0.5625rem;border-radius:0.25rem;background:none;color:#8f98a6;font-size:0.625rem;white-space:nowrap}
.filters button[aria-pressed=true]{background:#ffffff0b;color:#f1d594}
.filters button:hover{color:#fff}
.game-list{display:flex;flex-direction:column;gap:0.3125rem;flex:1;min-height:0}
.game-item{display:flex;position:relative;gap:0.75rem;align-items:center;text-align:left;width:100%;padding:0.625rem 0.6875rem;background:transparent;border:0.0625rem solid transparent;border-radius:0.375rem;min-height:4.0625rem;transition:background .18s,border-color .18s}
.game-item:hover{background:#ffffff05}
.game-item[aria-current=true]{background:linear-gradient(110deg,#f5c86a15,#f5c86a05);border-color:#f5c86a36}
.game-item[aria-current=true]:before{content:'';position:absolute;left:-1rem;top:18%;bottom:18%;width:0.1875rem;background:var(--gold);box-shadow:0 0 0.875rem #f5c86a55}
.game-thumb{width:2.3125rem;height:2.75rem;object-fit:cover;flex:none;border-radius:0.1875rem;box-shadow:0 0.1875rem 0.5rem #0006;background:#080b12}
.game-item.custom .game-thumb{object-fit:contain;padding:0.1875rem;background:radial-gradient(ellipse,#63559755,#080b12)}
.game-item-text{min-width:0;flex:1}
.game-item strong{font-size:0.75rem;font-weight:700;display:block;line-height:1.4;color:#d7dbe1}
.game-item[aria-current=true] strong{color:#f3d495}
.game-item small{display:block;color:#7f8997;font-size:0.5625rem;margin-top:0.3125rem;letter-spacing:0.021875rem}
.game-item .item-arrow{font-size:1.125rem;color:var(--gold);opacity:0}
.game-item[aria-current=true] .item-arrow{opacity:1}
.new-dot{display:inline-block;width:0.25rem;height:0.25rem;background:#a9caba;border-radius:50%;margin-left:0.3125rem;vertical-align:middle}

.showcase{position:relative;isolation:isolate;overflow:hidden;min-width:0;display:flex;align-items:center;background:#0c1016}
.backdrop{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:50% 40%;opacity:.28;transition:background-image .2s}
.showcase:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0c1016f0 0%,#0c1016b5 48%,#0c101655),linear-gradient(0deg,#0c1016 0%,transparent 55%,#0c1016aa 100%)}
.showcase:after{content:'';position:absolute;z-index:-1;inset:0;opacity:.16;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23999' filter='url(%23n)' opacity='.3' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.showcase-content{width:100%;max-width:92.5rem;margin:auto;padding:1.875rem 2.625rem 1.3125rem}
.collection-line{display:flex;align-items:center;justify-content:space-between;font:0.5625rem 'Chakra Petch',sans-serif;letter-spacing:0.0875rem;color:#acb1bb;margin-bottom:1.6875rem}
.collection-line>span:first-child{display:flex;align-items:center;gap:0.625rem}
.collection-line i{height:0.3125rem;width:0.3125rem;background:var(--accent);display:inline-block}
.collection-line b{font-weight:400;color:#626e7b;margin:0 0.125rem}
.edition{color:#808a99;font-size:0.5rem;letter-spacing:0.1125rem}
.title-row{display:flex;justify-content:space-between;align-items:center;gap:0.75rem;min-height:6.25rem;margin-bottom:1.625rem}
.eyebrow{font:0.5625rem 'Chakra Petch',sans-serif;letter-spacing:0.13125rem;color:var(--accent);margin:0 0 0.75rem;text-transform:uppercase}
h1{font-family:Bungee,sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:-0.14375rem;line-height:1.02;font-size:clamp(2rem,3.6vw,3.875rem);margin:0;text-wrap:balance;max-width:53.125rem;text-shadow:0 0.1875rem 1.25rem #0004}
.game-position{font-family:'Chakra Petch',sans-serif;display:flex;align-items:baseline;white-space:nowrap;gap:0.4375rem;align-self:flex-end;margin-bottom:0.4375rem}
.game-position>span{font-size:1.75rem;color:#e5e8ed;font-weight:300}
.game-position small{color:#75808e;font-size:0.6875rem}
.feature-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(8rem,22%);align-items:center;gap:1.75rem}
.monitor{padding:0 0.4375rem;background:linear-gradient(145deg,#242a32,#161b22);border:0.0625rem solid #56617266;border-bottom-color:#000;border-radius:0.6875rem;box-shadow:0 1.375rem 2.5rem #0008,0 0.0625rem 0 #ffffff16 inset;overflow:hidden;min-width:0}
.monitor-top{height:2rem;display:flex;align-items:center;padding:0 0.5625rem;gap:0.625rem;font:0.4375rem 'Chakra Petch',sans-serif;letter-spacing:0.0625rem;color:#b0bac7}
.monitor-top>span:first-child{display:flex;gap:0.375rem;align-items:center}
.monitor-top i{width:0.25rem;height:0.25rem;border-radius:50%;background:var(--accent)}
.monitor-top i.ready{background:#80d7a3;box-shadow:0 0 0.375rem #80d7a366}
.monitor-brand{margin-left:auto;color:#7b8796;font-size:0.375rem}
.preview-toggle{background:none;color:#aeb8c5;font-size:0.75rem;padding:0.1875rem 0.375rem;min-width:1.5625rem}
.preview-toggle:hover{color:white}
.preview-stage{aspect-ratio:16/9;position:relative;background:#06090f;overflow:hidden;border:0.0625rem solid #020306;border-radius:0.25rem;box-shadow:0 0 0 0.0625rem #ffffff06}
.preview-poster{position:absolute;width:100%;height:100%;object-fit:cover;opacity:.24;filter:blur(0.1875rem);transform:scale(1.04)}
.preview-surface{position:absolute;inset:0;overflow:hidden;pointer-events:none;opacity:0;transition:opacity .12s}
.preview-surface.ready{opacity:1}
.preview-surface iframe{position:absolute;width:1280px;height:720px;transform-origin:0 0;border:0;background:#000;pointer-events:none}
.screen-vignette{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 1.625rem #0005;z-index:2;border-radius:0.25rem}
.preview-badge{position:absolute;bottom:0.625rem;left:0.625rem;background:#0c101bd9;border:0.0625rem solid #ffffff21;border-radius:0.1875rem;font:0.375rem 'Chakra Petch',sans-serif;letter-spacing:0.0625rem;padding:0.3125rem 0.4375rem;color:#d4d9e2;z-index:3;display:flex;gap:0.375rem;align-items:center}
.preview-badge>span:first-child{color:#b3bacc}
.preview-message{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;font-size:0.625rem;color:#ddd;letter-spacing:0.03125rem;padding:1.25rem;text-align:center;background:#090d1655}
.retry-preview{padding:.6rem 1rem;border:.0625rem solid var(--accent);border-radius:.25rem;background:#141c28;color:var(--ink);font-size:1rem}
.loading-bars{display:flex;gap:0.25rem;height:1.25rem;align-items:center}
.loading-bars i{background:var(--accent);width:0.1875rem;height:0.625rem;animation:bar 1s ease-in-out infinite alternate}
.loading-bars i:nth-child(2){animation-delay:.2s}
.loading-bars i:nth-child(3){animation-delay:.4s}
.loading-bars i:nth-child(4){animation-delay:.6s}
@keyframes bar{to{height:1.25rem;opacity:.3}
}
.monitor-bottom{height:1.5625rem;display:flex;align-items:center;justify-content:space-between;padding:0 0.625rem}
.monitor-bottom>span:first-child{display:flex;gap:0.1875rem}
.monitor-bottom>span:first-child i{display:block;height:0.5rem;width:0.125rem;background:#080b10;border-radius:0.0625rem}
.monitor-bottom b{font:0.375rem 'Chakra Petch',sans-serif;letter-spacing:0.125rem;color:#5e6877}
.power-light{background:#90c7a5;width:0.25rem;height:0.25rem;border-radius:50%;box-shadow:0 0 0.375rem #89d9a955}
.box-art{perspective:56.25rem;max-width:14.375rem;margin:auto;width:100%;padding:0 0.1875rem}
.box-label{font:0.4375rem 'Chakra Petch',sans-serif;letter-spacing:0.10625rem;color:#abb1bb;margin-bottom:0.75rem}
.cover-card{position:relative;transform:rotateY(-9deg) rotateZ(2deg);border-radius:0.1875rem;border:0.0625rem solid #ffffff29;border-left:0.25rem solid #ffffff32;box-shadow:0.75rem 1.125rem 1.75rem #0008;aspect-ratio:736/911;background:#070c16;overflow:hidden}
.cover-card>img{display:block;width:100%;height:100%;object-fit:cover}
.cover-card.custom{background:radial-gradient(ellipse at 50% 48%,color-mix(in srgb,var(--accent),transparent 65%),#0d1120 75%)}
.cover-card.custom>img{position:absolute;top:21%;left:8%;width:84%;height:60%;object-fit:contain;filter:drop-shadow(0 0.75rem 0.9375rem #0008)}
.custom-cover{position:absolute;inset:0;padding:0.9375rem 0.625rem;display:flex;flex-direction:column;align-items:center;text-align:center}
.custom-cover>span{font-size:0.375rem;letter-spacing:0.10625rem;color:var(--accent)}
.custom-cover strong{font-family:Bungee,sans-serif;font-weight:400;text-transform:uppercase;font-size:1.375rem;line-height:1.05;max-width:95%;margin-top:0.625rem}
.custom-cover small{font:0.3125rem 'Chakra Petch',sans-serif;letter-spacing:0.08125rem;color:#cdd2e0;margin-top:auto}
.box-caption{display:flex;justify-content:space-between;margin-top:0.9375rem;font:0.375rem 'Chakra Petch',sans-serif;color:#9199a5;letter-spacing:0.0625rem}
.details-row{display:flex;align-items:center;gap:1.625rem;justify-content:space-between;margin-top:1.8125rem}
.game-details{max-width:38.125rem;min-width:0}
.tags{display:flex;gap:0.4375rem;align-items:center;flex-wrap:wrap}
.tags>span{font:0.4375rem 'Chakra Petch',sans-serif;letter-spacing:0.05rem;text-transform:uppercase;border:0.0625rem solid #ffffff1a;padding:0.3125rem 0.4375rem;border-radius:0.1875rem;color:#b4bdc9;background:#0d131b55}
.tags>span:first-child{color:var(--accent);border-color:color-mix(in srgb,var(--accent),transparent 80%)}
.tags>span.new-tag{color:#8bd5af;border-color:#8bd5af44}
.game-details p{font-size:0.75rem;line-height:1.85;color:#a8b1be;margin:0.75rem 0 0;max-width:31.875rem}
.play-button{background:var(--gold);color:#161915;display:flex;align-items:center;gap:1rem;padding:1.125rem 1.25rem;min-width:12.9375rem;flex:none;border-radius:0.3125rem;box-shadow:0 0.1875rem 0 #9d7f36,0 0.375rem 1.625rem #f5c86a12;text-align:left;transition:transform .15s,background .15s}
.play-button:hover{transform:translateY(-0.125rem);background:#ffdc8b;box-shadow:0 0.3125rem 0 #9d7f36,0 0.4375rem 2rem #f5c86a22}
.play-button:active{transform:translateY(0.0625rem);box-shadow:0 0.0625rem 0 #9d7f36}
.play-button>span:nth-child(2){font-size:0.9375rem;font-weight:900;letter-spacing:0.0625rem}
.play-button small{display:block;font:0.375rem 'Chakra Petch',sans-serif;letter-spacing:0.03125rem;margin-top:0.3125rem;max-width:9.0625rem}
.play-triangle{font-size:1.1875rem}
.play-arrow{margin-left:auto;font-size:1.375rem}
.showcase-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:2.1875rem;padding-top:1.125rem;border-top:0.0625rem solid #ffffff10;gap:0.625rem}
.selection-note{font:0.5rem 'Chakra Petch',sans-serif;letter-spacing:0.06875rem;color:#8692a1}
.selection-note>span{color:var(--accent);margin-right:0.5rem}
.browse-controls{display:flex;gap:0.75rem;align-items:center}
.browse-controls>span{font:0.4375rem 'Chakra Petch',sans-serif;color:#7f8b9b;letter-spacing:0.0625rem}
.browse-controls button{border:0.0625rem solid #ffffff1a;border-radius:0.25rem;background:#ffffff04;width:1.75rem;height:1.625rem;font-size:0.9375rem;color:#cad0d8}
.browse-controls button:hover{border-color:var(--accent);color:var(--accent)}

.control-bar{grid-column:1/-1;background:#0b0e13;border-top:0.0625rem solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 1.75rem;color:#6e7a8a;font:0.5rem 'Chakra Petch',sans-serif;letter-spacing:0.040625rem;gap:0.75rem}
.control-bar>span:first-child{display:flex;align-items:center;gap:0.4375rem;letter-spacing:0}
kbd{font:0.5rem 'Chakra Petch',sans-serif;border:0.0625rem solid #ffffff20;border-radius:0.1875rem;padding:0.1875rem 0.3125rem;color:#9da8b7;background:#ffffff04}
kbd:nth-of-type(3),kbd:nth-of-type(4){margin-left:0.75rem}
.footer-brand b{color:var(--gold);margin-left:0.5rem}
.runner{position:fixed;inset:0;background:#000;z-index:10}
.runner iframe{width:100%;height:100%;border:0}
.runner-bar{position:absolute;top:0.625rem;left:0.625rem;display:flex;align-items:center;gap:0.75rem;pointer-events:none;z-index:2}
.back-button{pointer-events:auto;background:#10161eea;color:#f5d180;border:0.0625rem solid #f5d18055;border-radius:0.3125rem;padding:0.625rem 0.75rem;font-size:0.625rem;font-weight:bold;box-shadow:0 0.1875rem 1.25rem #0007}
.back-button kbd{margin-left:0.625rem;font-size:0.5rem}
.runner-bar>span{font:0.5625rem 'Chakra Petch',sans-serif;letter-spacing:0.03125rem;background:#10161edc;padding:0.5625rem;border-radius:0.25rem;color:#d6dce4}
.game-loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.25rem;background:#0c1016;font-size:0.75rem;color:#aab5c4}


/* A 1600 × 900 desktop composition. Every UI dimension uses the same rem
   scale, so 1920 × 1080 and 3840 × 2160 have identical proportions.
   The embedded games keep their own 1280 × 720 preview coordinate system. */
:root{font-size:min(1vw,1.77777778svh);--muted:#b0bac9}
.arcade{height:100svh;min-height:0;grid-template-columns:24rem minmax(0,1fr);grid-template-rows:5.625rem minmax(0,1fr) 2.75rem}
.masthead{padding:0 2rem;gap:2rem}
.brand{width:19.5rem}
.mast-caption{gap:.3rem;padding-left:2rem}
.mast-caption>span{font-family:Bungee,sans-serif;font-size:.875rem;font-weight:400;letter-spacing:.08em}
.mast-caption small{font-size:1.125rem}
.online{font-size:1rem;letter-spacing:.06em;font-weight:500}
.icon-button{width:2.5rem;height:2.5rem}
.library{padding:1.25rem 1rem 1rem}
.library-heading{font-family:Bungee,sans-serif;font-size:1rem;font-weight:400;letter-spacing:.05em;margin:0 .5rem .65rem;color:#c4cbd6}
.count{font-size:1.125rem;padding:.15rem .4rem}
.filters{margin:0 0 .65rem;padding-bottom:.65rem;gap:.35rem}
.filters button{font-size:1.125rem;padding:.5rem .65rem;color:#aeb9ca}
.game-list{gap:.3rem;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#716344 transparent}
.game-item{flex:none;min-height:4rem;padding:.2rem .5rem;gap:.8rem}
.game-thumb{width:2.75rem;height:3.375rem}
.game-item strong{font-size:1.25rem;line-height:1.15;font-weight:600}
.game-item small{font-size:.9375rem;letter-spacing:0;margin-top:.3rem;line-height:1.2;color:#a6b2c3}
.game-item .item-arrow{font-size:1.5rem}
.game-item[aria-current=true]:before{left:-1.0625rem}
.showcase-content{--spotlight-width:15rem;height:100%;max-height:100%;max-width:72rem;display:flex;flex-direction:column;padding:1.25rem 2rem 1rem}
.collection-line{flex:none;font-size:.9375rem;letter-spacing:.06em;margin-bottom:.65rem;color:#c4cbd6}
.edition{font-size:.875rem;letter-spacing:.05em;color:#a4b1c3}
.title-row{display:grid;grid-template-columns:minmax(0,1fr) var(--spotlight-width);flex:none;min-height:5.5rem;margin-bottom:.75rem;gap:2rem}
.title-row>div:first-child{min-width:0}
.collection-index{display:grid;justify-items:center;align-content:center;gap:.25rem;text-align:center}
.eyebrow{font-size:1.0625rem;letter-spacing:.06em;margin-bottom:.6rem}
h1{font-size:2.75rem;line-height:1.12;letter-spacing:-.025em;max-width:55rem}
.game-position{gap:.45rem;align-self:auto;margin:0;font-variant-numeric:tabular-nums;line-height:1.1}
.game-position>span{font-size:2.5rem}
.game-position small{font-size:1.125rem;color:#a4b1c3}
.feature-row{container-type:size;flex:1;min-height:10rem;display:grid;grid-template-columns:minmax(0,1fr) var(--spotlight-width);gap:2rem;align-items:center}
.monitor{width:min(100%,calc((100cqh - 4.25rem)*16/9 + 1rem));flex:none;margin:auto;padding:0 .4375rem}
.monitor-top{height:2.5rem;font-size:.875rem;letter-spacing:.03em;padding:0 .5rem;gap:.5rem}
.monitor-brand{font-size:.75rem;color:#acb7c8;letter-spacing:0}
.preview-toggle{font-size:1.25rem;min-width:2rem;padding:.2rem .4rem}
.monitor-bottom{height:1.625rem}
.monitor-bottom b{font-size:.75rem;letter-spacing:.1em;color:#a3adbc}
.preview-badge{font-size:.8125rem;letter-spacing:.035em;padding:.3rem .5rem;bottom:.6rem;left:.6rem}
.preview-message{font-size:1.125rem}
.box-art{width:min(14.25rem,calc((100cqh - 3.5rem)*736/911));max-width:100%;flex:none;margin:auto;padding:0 .1875rem}
.box-label{font-size:.875rem;letter-spacing:.025em;margin-bottom:.65rem;text-align:center}
.box-caption{font-size:.8125rem;letter-spacing:0;margin-top:.75rem}
.custom-cover{padding:.9rem .5rem}
.custom-cover>span{font-size:.6875rem;letter-spacing:.03em}
.custom-cover strong{font-size:1.25rem;margin-top:.5rem;line-height:1.2}
.custom-cover small{font-size:.625rem;letter-spacing:0}
.details-row{display:grid;grid-template-columns:minmax(0,1fr) var(--spotlight-width);flex:none;margin-top:1rem;gap:2rem}
.game-details{flex:1;max-width:none}
.tags{gap:.4rem}
.tags>span{font-size:.875rem;letter-spacing:.025em;padding:.25rem .4rem;color:#c4cbd6}
.game-details p{font-size:1.125rem;line-height:1.4;margin:.6rem 0 0;max-width:none;color:#bbc5d3}
.play-button{width:100%;min-width:0;max-width:none;padding:1rem;gap:.8rem}
.play-button>span:nth-child(2){font-family:Bungee,sans-serif;font-size:1.125rem;font-weight:400;letter-spacing:0}
.play-button small{font-size:.8125rem;line-height:1.2;letter-spacing:0;max-width:11rem;margin-top:.4rem}
.showcase-bottom{flex:none;margin-top:.75rem;padding-top:.65rem;gap:1rem}
.selection-note{font-size:.9375rem;letter-spacing:.025em;color:#aab8cb}
.browse-controls{gap:.75rem}
.browse-controls>span{font-size:.875rem;letter-spacing:.025em;color:#aab8cb}
.browse-controls button{width:2.25rem;height:2rem;font-size:1.25rem}
.control-bar{font-size:.875rem;color:#aab8cb;letter-spacing:.025em;padding:0 1.5rem}
kbd{font-size:.9375rem;padding:.1rem .3rem;color:#c0cada}
.back-button{font-size:1rem}
.back-button kbd{font-size:.875rem}
.runner-bar>span{font-size:1rem}
.game-loading{font-size:1.25rem}

/* Taller displays and zoomed windows use readable text and document scrolling
   instead of shrinking the whole interface to fit a landscape composition. */
@media(max-aspect-ratio:4/3){
  :root{font-size:2.08333333vw}
  .arcade{height:auto;min-height:100svh;grid-template-columns:21rem minmax(0,1fr)}
  .brand{width:17rem}.mast-caption{display:none}
  .game-item strong{font-size:1.125rem}
  .showcase-content{height:auto;padding:1.5rem}
  .collection-index,.edition,.box-art,.game-position,.monitor-brand{display:none}
  .title-row{display:flex}
  .collection-line{font-size:.8125rem}.collection-line>span:first-child{gap:.4rem}
  h1{font-size:2.25rem}.eyebrow{font-size:1rem}
  .feature-row{container-type:normal;display:block;flex:none;min-height:0}
  .monitor{width:100%;margin:0}
  .details-row{display:flex;flex-direction:column;align-items:stretch;gap:1.25rem}
  .play-button{width:100%;max-width:none}
  .selection-note,.footer-brand{display:none}
  .browse-controls{margin-left:auto}
  .control-bar{min-height:2.75rem}
}
@media(max-width:700px){
  :root{font-size:16px}
  .arcade{height:auto;min-height:100svh;grid-template-columns:minmax(0,1fr);grid-template-rows:5rem auto 1fr 3rem}
  .masthead{padding:0 1rem;gap:.75rem;min-width:0}
  .brand{width:14rem}.mast-caption,.online{display:none}.mast-actions{gap:0}
  .library{min-width:0;padding:.65rem 0 0;border-right:0;border-bottom:1px solid var(--line)}
  .library-heading{display:none}
  .filters{margin:0 1rem .5rem;padding:0;border:0}
  .filters button{font-size:1rem;min-height:2.75rem}
  .game-list{flex-direction:row;overflow-x:auto;padding:0 1rem .75rem;gap:.5rem}
  .game-item{width:15rem;min-width:15rem;min-height:4.5rem;background:#ffffff03}
  .game-item strong{font-size:1.125rem}.game-item small{font-size:.875rem}
  .game-item[aria-current=true]:before{display:none}
  .game-thumb{width:2.75rem;height:3.375rem}
  .showcase{align-items:flex-start}
  .showcase-content{height:auto;padding:1.25rem 1rem}
  .collection-line{font-size:.8125rem;margin-bottom:1rem}
  .collection-line>span:first-child{gap:.4rem}
  .collection-index,.edition,.box-art,.game-position,.monitor-brand{display:none}
  .title-row{display:flex;min-height:0;margin-bottom:1.25rem}
  h1{font-size:clamp(1.75rem,7.5vw,2.75rem)}
  .eyebrow{font-size:.9375rem;line-height:1.4}
  .feature-row{container-type:normal;display:block;flex:none;min-height:0}
  .monitor{width:100%;margin:0}
  .monitor-top{font-size:.8125rem;letter-spacing:0}
  .preview-toggle{min-width:2.75rem;min-height:2.5rem;margin-left:auto}
  .preview-badge{font-size:.75rem}
  .details-row{display:flex;flex-direction:column;align-items:stretch;gap:1.25rem}
  .game-details p{font-size:1.125rem}
  .play-button{width:100%;max-width:none}
  .showcase-bottom{margin-top:1.25rem}
  .selection-note{display:none}.browse-controls{margin-left:auto}
  .browse-controls button{width:2.75rem;height:2.75rem}
  .control-bar{padding:0 1rem;font-size:.8125rem}
  .control-bar>span:nth-child(2),.footer-brand,.runner-bar>span{display:none}
  .control-bar>span:first-child{gap:.3rem}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}