:root{--paper:#fbfaf7;--ink:#20251f;--quiet:#4b544c;--line:#dbded4;--accent:#135b49;--panel:#fff;--on-accent:#fff;--display:Georgia,serif;--body:"DM Sans",system-ui,sans-serif;--radius:0px;color-scheme:light}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.58 var(--body)}
img{display:block;width:100%;height:auto;object-fit:cover}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{font-family:var(--display);line-height:1.02;letter-spacing:-.035em;margin-bottom:.35em;overflow-wrap:anywhere}
h1{font-size:clamp(3rem,7vw,7rem)}
h2{font-size:clamp(2rem,4vw,4.1rem)}
h3{font-size:clamp(1.3rem,2.5vw,2.25rem)}
p{margin-bottom:1em}
:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.shell{width:min(1220px,calc(100% - 64px));margin-inline:auto;min-width:0}
.skip-link{position:fixed;left:12px;top:12px;transform:translateY(-170%);z-index:10;padding:.65rem 1rem;background:var(--paper)}
.skip-link:focus{transform:none}
.site-header{border-bottom:1px solid var(--line);background:var(--paper)}
.header-row,.footer-row{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;min-height:76px}
.brand{display:inline-flex;align-items:center;gap:9px;text-decoration:none;font-weight:800;letter-spacing:-.055em;line-height:1.04;font-size:1.22rem;white-space:nowrap}
.brand img{width:34px;height:34px}
.brand small{display:block;font-size:.64rem;text-transform:uppercase;letter-spacing:.15em;margin-top:.3rem;color:var(--quiet)}
.desktop-nav,.site-footer nav{display:flex;gap:clamp(.8rem,2.25vw,2rem);align-items:center;flex-wrap:wrap;font-size:.9rem;font-weight:700}
.desktop-nav a,.site-footer nav a{text-decoration:none}
.desktop-nav a:hover,.desktop-nav a[aria-current],.site-footer nav a:hover{text-decoration:underline;text-underline-offset:5px}
.category-toggle{display:none;border:1px solid var(--line);background:var(--panel);border-radius:var(--radius);padding:.48rem .75rem}
.category-toggle span{margin-left:.25em}
dialog{width:min(440px,calc(100% - 32px));max-height:calc(100% - 32px);border:1px solid var(--line);padding:1.25rem;background:var(--paper);color:var(--ink);border-radius:var(--radius)}
dialog::backdrop{background:#080914ad}
.dialog-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}
.dialog-heading h2{font-size:1.8rem;margin:0}
.dialog-heading button{background:var(--panel);border:1px solid var(--line);font-size:1.3rem;width:2.3rem;height:2.3rem}
.mobile-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.mobile-nav a{padding:.7rem;border:1px solid var(--line);text-decoration:none;border-radius:var(--radius)}
.mobile-nav a[aria-current]{background:var(--accent);color:var(--on-accent)}
.site-footer{margin-top:clamp(3rem,7vw,7rem);border-top:1px solid var(--line)}
.footer-row{min-height:115px}
.footer-row>small{color:var(--quiet)}
#main{min-height:40vh}
.label,.reading-time,.eyebrow{font-size:.74rem;font-weight:750;text-transform:uppercase;letter-spacing:.11em;color:var(--quiet)}
.eyebrow{color:var(--accent);display:block;margin-bottom:1rem}
.button{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--accent);color:var(--on-accent);background:var(--accent);text-decoration:none;border-radius:var(--radius);padding:.65em 1.1em;font-weight:800;min-height:44px}
.button:hover{filter:brightness(.9)}
.stories-section,.game-section{margin-top:clamp(2.5rem,6vw,5.5rem)}
.section-heading{border-top:1px solid var(--line);padding-top:1.1rem;margin-bottom:1.3rem}
.section-heading h2{margin-bottom:0}
.story-grid,.game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.8rem,2.5vw,2rem)}
.story-card,.game-card{min-width:0}
.story-card a,.game-card a{display:block;text-decoration:none;height:100%}
.story-card a:hover h3,.game-card a:hover h3,.lead-story:hover h2{text-decoration:underline;text-underline-offset:.13em}
.story-card img,.game-card img{aspect-ratio:3/2;border-radius:var(--radius)}
.story-caption{padding:.75rem 0}
.story-caption h3,.game-card h3{margin:.36rem 0 .45rem}
.story-caption p{color:var(--quiet);margin:0 0 .5rem}
.story-card .reading-time{font-weight:500}
.page-intro{padding-block:clamp(2.6rem,7vw,6rem) 1.5rem}
.page-intro h1{font-size:clamp(2.7rem,6vw,5.7rem)}
.page-intro p{max-width:65ch;color:var(--quiet);font-size:1.15rem}
.article-heading{padding:clamp(2rem,6vw,5.5rem) 0 1.65rem}
.article-heading h1{max-width:22ch;font-size:clamp(2.55rem,6.7vw,6.3rem)}
.article-heading .deck{max-width:68ch;font-size:clamp(1.1rem,2vw,1.35rem);color:var(--quiet);margin-bottom:.85rem}
.article-photo{margin-block:0 2.8rem}
.article-photo img{width:100%;aspect-ratio:2.25;max-height:540px;border-radius:var(--radius)}
.article-photo figcaption{font-size:.79rem;color:var(--quiet);padding:.55rem 0;overflow-wrap:anywhere}
.article-grid-layout{display:grid;grid-template-columns:minmax(140px,205px) minmax(0,70ch);gap:clamp(1.4rem,5vw,5.5rem);justify-content:center;align-items:start}
.article-grid-layout.single{display:block}
.article-grid-layout.single .prose{margin-inline:auto}
.toc{border-top:1px solid var(--line);padding:1rem 0;position:sticky;top:1rem}
.toc h2{font:750 1rem var(--body);letter-spacing:0}
.toc ol{margin:.5rem 0 0;padding-left:1.3em;color:var(--quiet);font-size:.9rem}
.toc li{margin:.4rem 0}
.prose{width:min(100%,72ch);font-size:clamp(1.045rem,1.35vw,1.16rem);line-height:1.8;overflow-wrap:anywhere}
.prose h2{font-size:clamp(1.8rem,3.7vw,2.9rem);margin:1.15em 0 .45em;scroll-margin-top:1rem}
.prose h3{font-size:1.55rem;margin:.9em 0 .35em}
.prose p,.prose ul,.prose ol{margin-block:0 1.2em}
.prose li+li{margin-top:.45rem}
.prose img{border-radius:var(--radius)}
.prose pre,.prose table{max-width:100%;overflow:auto;display:block}
.prose a{color:var(--accent);text-underline-offset:3px}
.prose > section:first-child > h2:first-child{margin-top:0}
.static-copy{padding-block:clamp(2.5rem,7vw,5rem)}
.static-copy h1{font-size:clamp(2.65rem,6vw,5rem)}
.pagination{display:flex;gap:.6rem;margin:2rem 0}
.pagination a{padding:.5rem .8rem;border:1px solid var(--line)}
.pagination [aria-current]{color:var(--on-accent);background:var(--accent)}
.template-ad-slot:empty{display:none}
.game-card img{aspect-ratio:1.32}
.game-card h3{font-size:clamp(1rem,2vw,1.4rem)}
.game-card .caption{padding:.45rem 0}
.game-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
.game-hero,.blog-hero{display:grid;align-items:center;gap:clamp(1rem,4vw,4rem);grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding-top:clamp(1.6rem,5vw,4.5rem)}
.game-hero p,.blog-hero p{max-width:45ch;color:var(--quiet);font-size:1.12rem}
.lead-story{display:block;text-decoration:none}
.lead-story img{aspect-ratio:1.5;border-radius:var(--radius)}
.game-cover-link{display:block;min-width:0;text-decoration:none}
.game-cover-link img{aspect-ratio:1.45;border-radius:var(--radius)}
.game-detail{padding-top:clamp(1.65rem,5vw,4rem);display:grid;grid-template-columns:minmax(0,295px) minmax(0,650px);gap:clamp(1rem,5vw,4rem);align-items:start}
.game-detail img{max-height:290px;border-radius:var(--radius)}
.game-detail h1{font-size:clamp(2.25rem,5.8vw,5rem)}
.game-detail p{max-width:62ch}
.game-player{padding-top:2rem}
.game-player h1{font-size:clamp(2rem,5vw,4.5rem)}
.game-frame{margin-top:1rem;border:1px solid var(--line);min-height:45vh;background:var(--panel)}
.game-frame iframe{width:100%!important;height:min(75vh,720px)!important;min-height:340px;border:0}
@media(max-width:960px){.desktop-nav{display:none}.category-toggle{display:inline-flex;align-items:center}.game-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.footer-row{flex-wrap:wrap;padding-block:1.5rem}}
@media(max-width:690px){.shell{width:calc(100% - 32px)}.header-row{min-height:65px}.brand{font-size:1.09rem}.brand img{width:31px;height:31px}.game-hero,.blog-hero{grid-template-columns:1fr;gap:1rem}.story-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.article-grid-layout{grid-template-columns:1fr;gap:1.3rem}.toc{position:static;padding:.8rem 0}.article-photo{margin-bottom:1rem}.article-photo img{aspect-ratio:1.4}.game-detail{grid-template-columns:1fr}.game-detail>img{max-width:185px;aspect-ratio:1.25}.game-frame iframe{min-height:320px}.site-footer nav{gap:.55rem 1rem}}
@media(max-width:360px){.story-grid{grid-template-columns:1fr}.shell{width:calc(100% - 24px)}}
