@font-face{font-family:'Outfit';src:url('fonts/outfit.woff2') format('woff2'),url('fonts/outfit.ttf') format('truetype');font-style:normal;font-weight:300 800;font-display:swap}
@font-face{font-family:'Cormorant Garamond';src:url('fonts/cormorantgaramond.woff2') format('woff2'),url('fonts/cormorantgaramond.ttf') format('truetype');font-style:normal;font-weight:400 700;font-display:swap}
:root{--bg:#060d26;--surface:#0d1a45;--ink:#f2f6ff;--muted:#b9c7e8;--accent:#fbc52c;--accent-ink:#0b1430;--line:color-mix(in srgb,#6fb1ff 24%,transparent);--accent-2:#18b4fc;--body:'Outfit';--display:'Cormorant Garamond';}

*{box-sizing:border-box}html{scroll-behavior:smooth;scrollbar-color:var(--accent) var(--bg)}body{margin:0;background:var(--bg);color:var(--ink);font:400 15px/1.65 var(--body),sans-serif}a{color:inherit;text-underline-offset:4px}button,input,textarea,select{font:inherit}button{cursor:pointer}img{display:block;max-width:100%;height:auto}h1,h2,h3{margin:0 0 .6em;line-height:1.12;letter-spacing:-.025em;text-wrap:balance;font-family:var(--display),sans-serif;font-weight:700}h1{font-size:clamp(2.1rem,4vw,3.8rem)}h2{font-size:1.6rem}h3{font-size:1.12rem}p{margin:0 0 1.2em}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}::selection{background:var(--accent);color:var(--accent-ink)}input,textarea{caret-color:var(--accent)}.wrap{width:min(1320px,calc(100% - 48px));margin-inline:auto}.skip{position:absolute;top:-80px;left:20px;z-index:100;background:var(--accent);color:var(--accent-ink);padding:12px}.skip:focus{top:8px}.site-header{position:sticky;top:0;z-index:30;background:var(--bg);border-bottom:1px solid var(--line)}.header-inner{display:flex;gap:25px;min-height:76px;align-items:center}.brand{display:inline-flex;gap:9px;align-items:center;font-size:1.2rem;font-weight:800;letter-spacing:-.025em;text-decoration:none;white-space:nowrap}.main-nav{margin-left:auto;display:flex;gap:26px;align-items:center}.main-nav a{font-size:.77rem;text-decoration:none;color:var(--muted)}.main-nav a:hover,.main-nav a[aria-current=page]{color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent)}.cta,.button{display:inline-flex;justify-content:center;align-items:center;gap:13px;padding:12px 22px;min-height:44px;font-size:.78rem;line-height:1.3;font-weight:700;border:1px solid var(--accent);background:var(--accent);color:var(--accent-ink);text-decoration:none;border-radius:8px;white-space:nowrap;transition:filter .2s}.cta:hover,.button:hover{filter:brightness(1.1)}.secondary{background:transparent;border-color:var(--line);color:var(--ink)}.icon{width:16px;height:16px;flex:none;vertical-align:middle;display:inline-block}.menu-toggle{display:none;background:transparent;border:1px solid var(--line);color:var(--ink);padding:10px 13px;min-height:44px;font-size:.75rem}.site-main{max-width:100%;min-height:450px}img.sprite{display:block;width:100%;height:auto;object-fit:cover}.provider-strip{display:flex;gap:28px;align-items:center;justify-content:space-around;padding:22px 0;border-bottom:1px solid var(--line);color:var(--muted);font-size:.7rem;font-weight:700;letter-spacing:.04em;flex-wrap:wrap}.lobby-section{padding-top:30px}.shelf-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}.shelf-head h2{font-size:1.35rem;margin:0}.text-link{display:inline-flex;gap:12px;align-items:center;font-size:.78rem;font-weight:600}.shelf-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:10px 0 15px;background:var(--bg);z-index:15;position:relative}.game-filter,.filter{font-size:.74rem;background:var(--surface);color:var(--ink);border:1px solid var(--line);padding:9px 14px;min-height:40px;border-radius:6px}.game-filter[aria-pressed=true],.filter[aria-pressed=true]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.game-search{margin-left:auto;min-width:180px;max-width:230px}.game-search input{margin:0;padding:9px 13px;min-height:40px;font-size:.75rem}.game-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:13px;grid-auto-flow:dense}.game-card{display:block;overflow:hidden;min-width:0;text-decoration:none;background:var(--surface);border-radius:9px;border:1px solid var(--line)}.game-cover{aspect-ratio:.86;position:relative;transition:transform .6s cubic-bezier(.16,1,.3,1)}.game-card:hover .game-cover{transform:scale(1.045)}.game-title{display:block;font-size:.8rem;font-weight:700;padding:12px 10px 2px;line-height:1.3}.game-subtitle{display:block;padding:0 10px 12px;font-size:.65rem;color:var(--muted)}.game-empty{padding:30px 0;color:var(--muted)}.hero-scene{position:relative;isolation:isolate;min-height:650px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden;padding:60px 24px}.hero-scene>.scene-art{position:absolute;inset:0;z-index:-2}.hero-scene:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(#060d2633,#060d2655 55%,#060d26)}.hero-scene h1{font-family:var(--display),serif;font-size:clamp(3rem,5.5vw,5.5rem);font-weight:500;max-width:850px;text-shadow:0 2px 24px #000}.hero-scene p{max-width:50ch;color:#f2f6ff;margin-top:160px;font-size:.86rem;text-shadow:0 1px 5px #000}.hero-scene .actions{display:flex;gap:12px;justify-content:center}.top-categories{display:flex;gap:24px;align-items:center;justify-content:center;padding:16px 24px;border-bottom:1px solid var(--line);font-size:.75rem;flex-wrap:wrap}.top-categories a{text-decoration:none;color:var(--muted)}.reading-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;padding:35px 0 55px}.reading-links article{border-top:1px solid var(--line);padding-top:24px}.reading-links p{font-size:.85rem;color:var(--muted)}.reading-links h3{font-size:1.3rem}.news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.news-card{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface)}.news-card>.sprite{aspect-ratio:1.5}.news-card .card-body{padding:24px}.news-card h3{font-size:1.4rem}.news-card p{color:var(--muted);font-size:.85rem}.research-row{display:grid;grid-template-columns:1.4fr 2fr auto;gap:45px;align-items:center;padding:30px 0;border-top:1px solid var(--line)}.research-row h3{font-family:var(--body);font-size:1.4rem;margin:0}.research-row p{font-size:.85rem;margin:0;color:var(--muted)}.page-head{padding:45px 0 30px;border-bottom:1px solid var(--line);margin-bottom:35px}.page-head h1{font-family:var(--body);font-size:clamp(2rem,3.5vw,3.5rem);max-width:1000px;font-weight:700}.breadcrumb{font-size:.72rem;color:var(--muted);margin-bottom:24px}.lede{max-width:70ch;color:var(--muted);font-size:.95rem;line-height:1.8}.reading-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(240px,1fr);gap:60px}.reading{max-width:70ch}.reading h2{font-family:var(--body);font-size:1.65rem;margin-top:36px}.reading p{font-size:.95rem;line-height:1.85}.reading li{margin-block:10px}.inner-content{padding-bottom:65px}.aside-note{border-top:1px solid var(--line);padding-top:22px;align-self:start}.aside-note h2{font-family:var(--body);font-size:1.4rem}.aside-note p{font-size:.82rem;color:var(--muted)}.aside-note a{display:block;font-size:.82rem;margin:10px 0}.aside-note>.sprite{aspect-ratio:1;margin-top:25px;border-radius:10px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:start}.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;grid-auto-flow:dense}.about-art{aspect-ratio:1;border-radius:12px;max-height:520px}.mini-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin-block:30px}.mini-grid strong{font-size:1.1rem;display:block;overflow-wrap:anywhere}.mini-grid span{font-size:.74rem;color:var(--muted)}.quote{font-size:1.6rem;line-height:1.4;margin:35px 0;padding:25px 0;border-block:1px solid var(--line)}.form-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:65px}.contact-form{padding:30px;border:1px solid var(--line);background:var(--surface);border-radius:12px}label{display:block;font-size:.8rem;font-weight:600;margin-bottom:8px}input,select,textarea{width:100%;border:1px solid var(--muted);background:var(--bg);color:var(--ink);padding:12px 14px;margin-bottom:20px;border-radius:6px}input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}textarea{min-height:145px;resize:vertical}.form-note{font-size:.76rem;color:var(--muted)}.status{font-size:.85rem;font-weight:600;margin-top:18px}.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:24px}.search{margin-left:auto;max-width:300px}.search input{margin:0}.search label{font-size:.72rem}.article-card{border:1px solid var(--line);background:var(--surface);border-radius:10px;overflow:hidden;min-width:0}.thumb-frame>.sprite{aspect-ratio:1.6;transition:transform .5s}.article-card:hover .sprite{transform:scale(1.04)}.card-body{padding:24px}.article-card h2{font-family:var(--body);font-size:1.4rem}.article-card h2 a{text-decoration:none}.article-card p{font-size:.85rem;color:var(--muted)}.article-card a{font-size:.8rem}.article-meta{font-size:.7rem;color:var(--muted);margin:16px 0}.post-image{margin:0 0 35px}.post-image>.sprite{aspect-ratio:2.5;border-radius:10px}.post-image figcaption{font-size:.73rem;color:var(--muted);margin-top:9px}.toc{padding:20px 0;border-block:1px solid var(--line)}.toc h2{font-size:1.15rem}.toc a{font-size:.8rem}.note-box{padding:24px;border-block:1px solid var(--line);background:var(--surface);margin-block:25px}.note-box p{margin-bottom:0}details{padding:20px 0;border-bottom:1px solid var(--line)}summary{cursor:pointer;font-weight:600;font-size:.9rem}details p{margin:18px 0 0}.closing-action{padding-block:45px;background:var(--surface);border-top:1px solid var(--line)}.action-inner{display:flex;align-items:center;justify-content:space-between;gap:45px}.closing-action h2{font-family:var(--body);font-size:1.8rem;max-width:700px;margin-bottom:10px}.closing-action p{color:var(--muted);font-size:.86rem;max-width:65ch;margin:0}.closing-action .button{flex:none}.site-footer{padding-block:32px;border-top:1px solid var(--line)}.footer-top{display:flex;justify-content:space-between;gap:25px;margin-bottom:22px}.footer-links{display:flex;gap:22px;flex-wrap:wrap;font-size:.75rem}.footer-note{font-size:.7rem;color:var(--muted);max-width:95ch}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.no-results{padding:25px;border:1px solid var(--line)}[hidden]{display:none!important}
@media(max-width:1100px){.main-nav{gap:17px}.header-inner{gap:20px}.game-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.reading-layout{gap:35px}}
@media(max-width:760px){.wrap{width:calc(100% - 32px)}.header-inner{min-height:72px;flex-wrap:wrap;gap:10px;padding-block:12px}.brand{font-size:1.02rem;margin-right:auto;gap:6px}.site-header .cta{font-size:.69rem;padding:10px 13px;gap:8px;order:1}.menu-toggle{display:block;order:2;font-size:.67rem;padding:10px}.main-nav{order:3;width:100%;margin:0;gap:17px;flex-wrap:wrap;padding-top:12px}.js .main-nav{display:none}.js .main-nav.is-open{display:flex}.main-nav a{font-size:.8rem;padding:7px 0}.provider-strip{gap:14px 22px;font-size:.61rem;justify-content:start;padding:18px 0}.game-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.game-title{font-size:.73rem;padding:10px 8px 3px}.game-subtitle{font-size:.59rem;padding:0 8px 10px}.game-cover{aspect-ratio:.85}.shelf-head h2{font-size:1.2rem}.shelf-head .text-link{font-size:.7rem}.shelf-tools{gap:7px}.game-filter,.filter{padding:9px 11px;font-size:.7rem}.game-search{max-width:none;width:100%;margin:4px 0 0}.top-categories{gap:15px;padding:13px 16px;font-size:.69rem;justify-content:start}.hero-scene{min-height:620px;padding-inline:18px}.hero-scene h1{font-size:3.1rem;max-width:12ch}.hero-scene p{margin-top:130px;font-size:.8rem}.hero-scene .actions{gap:9px}.hero-scene .button{padding:11px 17px;font-size:.72rem}.reading-links{grid-template-columns:1fr;gap:26px;padding-top:15px}.news-grid{grid-template-columns:1fr;gap:22px}.news-card>.sprite{aspect-ratio:1.5}.research-row{grid-template-columns:1fr;gap:16px;padding-block:27px}.research-row h3{font-size:1.3rem}.research-row a{justify-self:start}.reading-layout,.grid2,.form-grid,.grid3{grid-template-columns:1fr;gap:28px}.page-head{padding-block:35px 25px;margin-bottom:30px}.page-head h1{font-size:2.2rem}.breadcrumb{margin-bottom:20px}.lede{font-size:.88rem}.aside-note{margin-top:10px}.aside-note>.sprite{max-height:330px}.mini-grid{grid-template-columns:1fr;gap:20px}.contact-form{padding:23px}.post-image>.sprite{aspect-ratio:1.3}.closing-action{padding-block:35px}.action-inner{display:block}.closing-action h2{font-size:1.6rem}.closing-action .button{margin-top:23px}.footer-top{flex-direction:column;gap:20px}.footer-links{gap:16px;font-size:.72rem}.footer-note{font-size:.65rem}.search{max-width:none;width:100%;margin:12px 0 0}.filters{gap:8px}.article-card h2{font-size:1.4rem}.reading h2{font-size:1.5rem}.inner-content{padding-bottom:45px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.game-cover{transform:none!important}}

/* Reference confirmation: legibility and artwork aspect ratios. */
.menu-toggle{font-size:.75rem}.game-subtitle{font-size:.72rem}.provider-strip{font-size:.72rem}.footer-note{font-size:.72rem}
@media(max-width:760px){.menu-toggle{font-size:.75rem}.site-header .cta{font-size:.72rem}.game-subtitle{font-size:.7rem}.game-title{font-size:.76rem}.provider-strip{font-size:.72rem}.footer-note{font-size:.72rem}}

/* QRPAY44 layer: brand refinements on top of the template. Add new rules here. */
html{scroll-padding-top:96px}
h1,h2,h3,.quote{font-variant-numeric:lining-nums}
h1,h2,h3{font-weight:600}
.main-nav a{font-size:.875rem}
.cta,.button{font-size:.84rem}
.menu-toggle{border-radius:8px;font-size:.84rem}
.top-categories{font-size:.84rem;gap:8px 26px}
.top-categories a{padding:4px 0}
.top-categories a:hover{color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent)}
.button.secondary{background:#060d26b8;backdrop-filter:blur(3px);border-color:color-mix(in srgb,var(--ink) 38%,transparent)}
.brand{font-size:1.28rem;letter-spacing:-.01em}

/* Hero: same composition as the template, served as a real image for faster loading. */
.hero-scene{background:#08143a;min-height:clamp(600px,68vh,700px)}
.hero-scene>.scene-art{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.hero-scene:after{background:linear-gradient(#060d2640,#060d2630 30%,#060d2680 62%,#060d26e0 84%,#060d26)}
.hero-scene h1{font-weight:500;max-width:1040px;margin-bottom:0;letter-spacing:-.02em}
.hero-scene p{font-size:1rem;margin-top:150px;margin-bottom:22px;max-width:56ch}

/* Lower row keeps the reference strip, with links instead of provider logos. */
.provider-strip{font-size:.75rem;letter-spacing:.09em;padding:20px 0;gap:10px 28px}
.provider-strip a{color:inherit;text-decoration:none;padding:4px 0;text-transform:uppercase}
.provider-strip a:hover{color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent)}

/* Section headings and the template's ornamental divider. */
.shelf-head{align-items:end;margin-bottom:14px}
.shelf-head h2,.section-title{font-size:clamp(1.85rem,2.9vw,2.6rem);line-height:1.1;margin:0}
.ornament:after{content:'';display:block;width:96px;height:9px;margin-top:13px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 9'%3E%3Cpath d='M0 4.5h40M56 4.5h40' stroke='%23fbc52c'/%3E%3Cpath d='m48 0 4.5 4.5L48 9l-4.5-4.5z' fill='%23fbc52c'/%3E%3C/svg%3E") no-repeat}
.section-lede{color:var(--muted);max-width:62ch;margin:14px 0 0;font-size:.95rem}
.home-section{padding-top:68px}
.home-section:last-child{padding-bottom:72px}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:26px}
.text-link{font-size:.875rem;white-space:nowrap}

/* Game shelf: eight larger previews, so the art stays crisp. */
.game-filter,.filter{font-size:.84rem;transition:border-color .2s,background-color .2s}
.game-filter:hover,.filter:hover{border-color:var(--accent)}
.game-search input{font-size:.875rem}
.game-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.game-card{display:flex;flex-direction:column;border-radius:12px;transition:border-color .25s,box-shadow .25s}
.game-card:hover{border-color:var(--accent);box-shadow:0 14px 34px -18px #18b4fc80}
.game-cover-frame{display:block;overflow:hidden}
.game-cover{aspect-ratio:1.18}
.game-title{font-family:var(--display),serif;font-size:1.4rem;font-weight:600;line-height:1.15;letter-spacing:-.01em;padding:14px 16px 4px;font-variant-numeric:lining-nums}
.game-desc{display:block;padding:0 16px;font-size:.84rem;line-height:1.45;color:var(--muted)}
.game-subtitle{margin-top:auto;padding:10px 16px 14px;font-size:.75rem;letter-spacing:.02em;color:var(--accent)}

/* Home modules reuse the template's card and reading styles. */
.intro-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:56px;align-items:center}
.intro-grid p{color:var(--muted);font-size:1rem;line-height:1.8;max-width:62ch}
.intro-grid p:first-of-type{margin-top:22px}
.intro-art{aspect-ratio:1.5;border-radius:14px;border:1px solid var(--line)}
.reading-links{padding:0}
.reading-links article{padding-top:22px}
.reading-links h3{font-size:1.65rem;margin-bottom:.45em}
.reading-links p{font-size:.95rem;line-height:1.7}
.reading-links a{font-size:.875rem;font-weight:600}
.news-card{display:flex;flex-direction:column;transition:border-color .25s}
.news-card:hover{border-color:var(--accent)}
.news-card h3{font-size:1.6rem;margin-bottom:.4em}
.news-card h3 a{text-decoration:none}
.news-card h3 a:hover{text-decoration:underline;text-decoration-color:var(--accent)}
.news-card p{font-size:.92rem;line-height:1.65}
.news-card .article-meta{margin:0}
.faq-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:56px}
.faq-list details:first-child{padding-top:0}
summary{font-size:1rem}
summary::marker{color:var(--accent)}
details p{color:var(--muted);font-size:.95rem;line-height:1.75;max-width:70ch}
details a,.reading a:not(.button):not(.text-link),.intro-grid a:not(.button){text-decoration-color:var(--accent)}

/* Inner pages carry the ember scene into the header band. */
.inner .site-main{position:relative;isolation:isolate}
.inner .site-main:before{content:'';position:absolute;inset:0 0 auto;height:430px;z-index:-1;background:linear-gradient(#060d26a8,#060d26d9 58%,var(--bg)),url('img/sapphire-castle-banner-1280.webp') 50% 50%/cover no-repeat}
.page-head{padding:52px 0 34px}
.page-head h1{font-family:var(--display),serif;font-weight:600;font-size:clamp(2.7rem,5.2vw,4.6rem);line-height:1.04;margin-bottom:.32em}
.lede{font-size:1.02rem}
.breadcrumb{font-size:.84rem}
.breadcrumb ol{display:flex;flex-wrap:wrap;gap:0 8px;list-style:none;margin:0;padding:0}
.breadcrumb li+li:before{content:'/';margin-right:8px;color:var(--accent)}
.reading h2,.aside-note h2,.aside-note h3,.toc h2,.article-card h2,.closing-action h2,.grid2 h2{font-family:var(--display),serif;font-weight:600}
.reading h2{font-size:2rem;margin-top:40px}
.reading section:first-child h2,.reading>h2:first-child{margin-top:0}
.reading p{font-size:1rem}
.reading ul{padding-left:20px;font-size:1rem}
.reading li::marker{color:var(--accent)}
.aside-note h2{font-size:1.75rem}
.aside-note h3{font-size:1.5rem}
.aside-note a{font-size:.9rem}
.aside-note>.sprite{border:1px solid var(--line)}
.toc h2{font-size:1.5rem}
.toc a{font-size:.875rem}
.article-card{display:flex;flex-direction:column;transition:border-color .25s}
.article-card:hover{border-color:var(--accent)}
.article-card .card-body{display:flex;flex-direction:column;flex:1}
.article-card .card-body>a{margin-top:auto}
.article-card h2{font-size:1.7rem}
.article-card h2 a:hover{text-decoration:underline;text-decoration-color:var(--accent)}
.article-card p{font-size:.92rem}
.article-card a{font-size:.875rem}
.article-meta{font-size:.8rem}
.search label{font-size:.8rem}
.thumb-frame{overflow:hidden}
.mini-grid strong{font-family:var(--display),serif;font-size:1.45rem;font-weight:600}
.mini-grid span{font-size:.84rem}
.quote{font-family:var(--display),serif;font-size:2rem;line-height:1.25;font-weight:500}
.note-box{border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:10px}
.form-note{font-size:.84rem}
.post-image figcaption{font-size:.8rem}
.compare-table{width:100%;border-collapse:collapse;margin:18px 0 8px;font-size:.92rem;line-height:1.5}
.compare-table caption{text-align:left;font-size:.84rem;color:var(--muted);padding-bottom:10px}
.compare-table th,.compare-table td{padding:12px 12px 12px 0;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.compare-table thead th{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
.compare-table tbody th{font-weight:600;color:var(--ink)}
.compare-table td{color:var(--muted)}

/* Footer */
.closing-action h2{font-size:clamp(1.9rem,3vw,2.5rem)}
.closing-action p{font-size:.95rem}
.footer-links{font-size:.875rem}
.footer-links a{text-decoration:none;padding:2px 0}
.footer-links a:hover{text-decoration:underline;text-decoration-color:var(--accent)}
.footer-note{font-size:.8rem;line-height:1.7;max-width:110ch}
.footer-note .age{display:inline-block;margin-right:6px;padding:0 8px;border:1px solid var(--accent);border-radius:99px;color:var(--accent);font-weight:700;font-size:.75rem}
.copyright{font-size:.8rem;color:var(--muted);margin:0}

@media(max-width:1100px){
  .faq-grid,.intro-grid{gap:36px}
  .main-nav{gap:17px}
}
@media(max-width:900px){
  .intro-grid,.faq-grid{grid-template-columns:1fr}
  .reading-links,.news-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  html{scroll-padding-top:84px}
  .header-inner{min-height:64px;padding-block:10px;gap:8px}
  .brand{font-size:1.1rem}
  .site-header .cta{font-size:.8rem;padding:10px 12px;min-height:44px}
  .menu-toggle{font-size:.8rem;padding:10px 12px}
  .main-nav{padding-top:6px;gap:4px 20px}
  .main-nav a{font-size:.95rem;padding:10px 0}
  .top-categories{justify-content:center;gap:4px 18px;font-size:.84rem;padding:10px 16px}
  .top-categories a{padding:7px 0}
  .hero-scene{min-height:600px}
  .hero-scene>.scene-art{object-position:50% 50%}
  .hero-scene h1{font-size:clamp(2.7rem,13vw,3.3rem);line-height:1.04}
  .hero-scene p{font-size:.92rem;margin-top:120px}
  .hero-scene .button{font-size:.8rem}
  .provider-strip{justify-content:center;font-size:.72rem;padding:16px 0;gap:6px 20px}
  .provider-strip a{padding:7px 0}
  .shelf-head{flex-wrap:wrap}
  .game-filter,.filter{font-size:.84rem;min-height:44px}
  .game-search input{min-height:44px;font-size:1rem}
  .game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .game-title{font-size:1.22rem;padding:12px 12px 3px}
  .game-desc{padding:0 12px;font-size:.8rem}
  .game-subtitle{padding:8px 12px 12px;font-size:.72rem}
  .home-section{padding-top:48px}
  .home-section:last-child{padding-bottom:52px}
  .section-head{flex-wrap:wrap;margin-bottom:20px}
  .page-head h1{font-size:clamp(2.5rem,11vw,3rem)}
  .lede{font-size:.97rem}
  .reading h2{font-size:1.8rem}
  .search input{font-size:1rem}
  input,select,textarea{font-size:1rem}
  .quote{font-size:1.7rem}
  .closing-action h2{font-size:1.9rem}
  .footer-note{font-size:.8rem}
  .footer-links{font-size:.9rem;gap:6px 18px}
  .footer-links a{padding:6px 0}
  .inner .site-main:before{height:360px}
}
@media(max-width:374px){
  .wrap{width:calc(100% - 24px)}
  .brand{font-size:1rem;gap:5px}
  .site-header .cta{font-size:.75rem;padding:10px}
  .site-header .cta .icon{display:none}
  .menu-toggle{padding:10px}
  .hero-scene h1{font-size:2.55rem}
  .hero-scene .actions{flex-direction:column;align-items:center}
  .game-grid{gap:10px}
  .game-title{font-size:1.1rem}
  .page-head h1{font-size:2.3rem}
}

/* Review fixes */
.hero-scene:after{background:radial-gradient(ellipse 58% 24% at 50% 31%,#060d2675,transparent),linear-gradient(#060d2638,#060d2620 30%,#060d2670 60%,#060d26dd 84%,#060d26)}
.hero-scene p{text-wrap:balance}
.article-card h2 a{font-size:inherit}
.filters{align-items:flex-end}
.aside-note .toc{border-top:0;padding-top:0}
.contact-art{aspect-ratio:2.2;border-radius:12px;border:1px solid var(--line);margin-top:26px}
@media(min-width:1000px) and (min-height:760px){.reading-layout .aside-note{position:sticky;top:96px}}
@media(max-width:760px){.contact-art{display:none}}

.main-nav a{display:inline-block;padding:6px 0}

/* Performance: the hero starts at GSAP's first frame, and phones get the smaller banner. */
@media(min-width:761px) and (prefers-reduced-motion:no-preference){.motion-art{transform:scale(1.04)}}
@media(max-width:760px){.inner .site-main:before{background-image:linear-gradient(#060d26a8,#060d26d9 58%,var(--bg)),url('img/sapphire-castle-banner-800.webp')}}

/* Unofficial guide layer: disclosure, language switch and fact-status styling. */
.eyebrow{display:block;margin:0 0 12px;font-size:.75rem;font-weight:600;letter-spacing:.08em;line-height:1.5;text-transform:uppercase;color:var(--accent)}
.hero-scene p.eyebrow{margin:0 0 14px;font-size:.78rem;max-width:none;color:#ffe7a0;text-shadow:0 1px 8px #000}
.hero-scene p{margin-top:124px}
.main-nav .lang-switch{padding-left:17px;border-left:1px solid var(--line)}
.footer-links .lang-switch{color:var(--accent)}
.gallery-note{color:var(--muted);font-size:.92rem;margin:0 0 8px}
.intro-first{padding-top:44px}
.reading h3{font-family:var(--display),serif;font-size:1.5rem;font-weight:600;margin:26px 0 10px}
.compare-table .status-cell{color:var(--accent);font-weight:600}
.compare-table tbody th{padding-right:16px}
.form-lede{margin-top:18px}

.eyebrow span+span:before{content:' · '}
@media(max-width:760px){
  .eyebrow span{display:block}
  .eyebrow span+span:before{content:none}
  .main-nav .lang-switch{padding-left:0;border-left:0}
  .hero-scene p{margin-top:96px}
  .hero-scene p.eyebrow{font-size:.7rem;margin-bottom:12px}
  .eyebrow{font-size:.7rem}
  .compare-table{font-size:.86rem}
}

/* Tablet header: longer Bahasa Melayu labels must still fit on one row. */
@media(min-width:761px) and (max-width:1000px){
  .header-inner{gap:12px}
  .main-nav{gap:12px}
  .main-nav a{font-size:.8rem}
  .main-nav .lang-switch{padding-left:12px}
  .site-header .cta{font-size:.8rem;padding:10px 14px}
  .site-header .cta .icon{display:none}
}

/* Individual images replace the atlas; these keep each context's crop. */
.post-image>.sprite,.thumb-frame>.sprite,.news-card>.sprite{object-position:50% 0}
.game-cover-frame,.thumb-frame{line-height:0}

/* Home modules added for the full content brief. */
.definition-grid.reading-links article{padding-top:18px}
.definition-grid.reading-links h3{font-size:1.5rem}
.split-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.info-panel{padding:30px;background:var(--surface);border:1px solid var(--line);border-radius:14px}
.info-panel h2{font-size:clamp(1.65rem,2.3vw,2.1rem);line-height:1.15;margin:0}
.info-panel p,.info-panel li{color:var(--muted);font-size:.95rem;line-height:1.7}
.info-panel p:first-of-type{margin-top:18px}
.info-panel ul{padding-left:20px;margin:0 0 1.2em}
.info-panel li::marker{color:var(--accent)}
.info-panel a{font-size:.875rem;font-weight:600}
.support-band{padding:30px;background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:14px}
.support-band h2{margin-bottom:14px}
.support-band p{color:var(--muted);max-width:80ch;line-height:1.75;margin-bottom:.9em}
.support-band p:last-child{margin-bottom:0}
.reviewed-note{color:var(--muted);font-size:.84rem;margin:16px 0 0}

/* Author page */
.author-layout{display:grid;grid-template-columns:200px minmax(0,1fr);gap:48px;align-items:start}
.author-avatar{width:160px;height:160px;border-radius:50%;border:1px solid var(--accent)}

.footer-links{align-items:center}
.notice-link{background:none;border:0;padding:2px 0;color:inherit;font:inherit;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--accent);cursor:pointer}

/* Error page */
.error-page{padding-block:90px;text-align:center}
.error-page h1{font-family:var(--display),serif;font-weight:600;font-size:clamp(2.6rem,6vw,4.4rem)}
.error-page .lede{margin-inline:auto;margin-bottom:.4em}
.error-page .actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:26px}

@media(max-width:900px){
  .split-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  .author-layout{grid-template-columns:1fr;gap:24px}
  .author-avatar{width:120px;height:120px}
  .info-panel,.support-band{padding:22px}
  .footer-links .notice-link{padding:6px 0}
}

/* No layout shift: the phone menu is hidden in CSS, so it cannot show and then collapse while scripts load. noscript.css restores it without JavaScript. */
@media(max-width:760px){
  .main-nav{display:none}
  .main-nav.is-open{display:flex}
}

/* Logo lockup, cut from the owner's logo file. It stays small: this is a logo, not decoration. */
.brand{gap:8px}
.brand-icon{display:block;width:auto;height:48px;flex:none}
.brand-word{display:block;width:auto;height:24px;flex:none}
.site-footer .brand-icon{height:42px}
.site-footer .brand-word{height:21px}
.error-page .brand{justify-content:center;margin-bottom:28px}
@media(max-width:760px){
  .brand-icon{height:42px}
  .brand-word{height:21px}
}
@media(max-width:420px){
  .site-header .cta .icon{display:none}
}
@media(max-width:374px){
  .header-inner{gap:6px}
  .brand{gap:4px}
  .brand-icon{height:34px}
  .brand-word{height:16px}
}

/* Popup: a notice, shown after the first interaction and never during load. The script builds it from popup-config.js.
   The dialog has no padding, so the script can treat a click on the dialog itself as a click on the backdrop.
   The closing duration here must match closeMs in site.js. */
html.notice-open{overflow:hidden;scrollbar-gutter:stable}
.notice-dialog{width:min(520px,calc(100% - 32px));max-height:calc(100dvh - 32px);padding:0;overflow:hidden;border:1px solid color-mix(in srgb,var(--accent) 60%,transparent);border-radius:16px;background:radial-gradient(110% 80% at 100% 0,#18b4fc26,transparent 62%),linear-gradient(180deg,#12235a,var(--surface) 58%);color:var(--ink);box-shadow:0 30px 70px -24px #000,0 0 44px -16px #18b4fc66;opacity:0;transform:translateY(14px) scale(.98);transition:opacity .2s ease,transform .2s ease}
.notice-dialog.is-visible{opacity:1;transform:none;transition:opacity .28s ease,transform .38s cubic-bezier(.16,1,.3,1)}
.notice-dialog::backdrop{background:#02061ad9;backdrop-filter:blur(3px);opacity:0;transition:opacity .2s ease}
.notice-dialog.is-visible::backdrop{opacity:1;transition-duration:.28s}
.notice-body{position:relative;max-height:calc(100dvh - 34px);overflow:auto;overscroll-behavior:contain;padding:30px 30px 0}
.notice-brand{display:flex;align-items:center;gap:8px;padding-right:44px;margin-bottom:20px}
.notice-dialog .notice-eyebrow{margin:0 0 8px;font-size:.7rem;font-weight:600;line-height:1.4;letter-spacing:.09em;text-transform:uppercase;color:var(--accent)}
.notice-dialog h2{font-family:var(--display),serif;font-size:2.25rem;font-weight:600;line-height:1.08;margin:0 0 .5em;font-variant-numeric:lining-nums}
.notice-dialog p{color:var(--muted);font-size:.95rem;line-height:1.7}
/* Pinned to the panel's bottom edge, so on short screens the text scrolls and the buttons stay in view. */
.notice-actions{position:sticky;bottom:0;display:flex;flex-wrap:wrap;gap:10px;margin:8px -30px 0;padding:14px 30px 30px;background:linear-gradient(transparent,var(--surface) 12px)}
.notice-x{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid transparent;border-radius:8px;background:none;color:var(--muted);transition:color .2s,border-color .2s}
.notice-x:before,.notice-x:after{content:'';grid-area:1/1;width:18px;border-top:2px solid currentColor;transform:rotate(45deg)}
.notice-x:after{transform:rotate(-45deg)}
.notice-x:hover{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 50%,transparent)}
@media(max-width:760px){
  .notice-body{padding:22px 22px 0}
  .notice-brand{margin-bottom:16px}
  .notice-dialog h2{font-size:1.95rem}
  .notice-actions{margin-inline:-22px;padding:14px 22px 22px}
  .notice-x{top:8px;right:8px}
}
@media(max-width:480px){
  .notice-actions .button{flex:1 1 100%;white-space:normal;text-align:center}
}
@media(max-height:500px){
  .notice-brand{display:none}
  .notice-body{padding-top:16px}
  .notice-dialog .notice-eyebrow{padding-right:44px}
  .notice-actions{padding-bottom:14px}
}
@media(prefers-reduced-motion:reduce){
  .notice-dialog::backdrop,.notice-dialog.is-visible::backdrop{transition:none}
}
