/* Shared dungeon UI. Keep gameplay canvas and input behavior untouched. */
:root{--jade:#acd5ad;--gold:#e5bd7b;--text:#eee5d5;--muted:#b4abba;color-scheme:dark}
body{background-color:#10111b;background-image:linear-gradient(#ffffff03 2px,transparent 2px),linear-gradient(90deg,#ffffff03 2px,transparent 2px);background-size:32px 32px;background-attachment:fixed;color:var(--text)}
.site-language{display:inline-block;flex-shrink:0;padding:8px 10px;border:2px solid #6c6578;background:#191b28;color:#acd5ad;text-decoration:none;font:20px 'VT323',monospace;white-space:nowrap;box-shadow:3px 3px #080a11}.site-language:hover{border-color:#acd5ad;color:#e3f6d6}
@media(max-width:760px){.site-language{font-size:17px;padding:7px}.head-inner,body>main>header{gap:8px}.head-inner .brand,body>main>header .brand{font-size:22px}.head-inner .login-link{margin-left:auto}}
button,input,select,textarea,dialog,details,kbd{border-radius:0!important}
button,a,input,summary{touch-action:manipulation}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #f1d397;outline-offset:4px}
.site-head,body>main>header{background:#171823;border-bottom:4px solid #080a11;box-shadow:0 2px 0 #786674,0 6px 0 #080a11}
body>main>header{padding:16px;gap:14px}
.brand{font-family:'VT323',monospace;font-size:30px;letter-spacing:2px;color:#f3dfbd;text-shadow:2px 2px #080a11}
.main-nav a,.site-primary-nav a{border:2px solid transparent;color:#c1b7c6;font-size:22px;white-space:nowrap}
.main-nav a[aria-current=page],.site-primary-nav a[aria-current=page]{background:#302b32;border-color:#b3986a;color:#ffe2a5;box-shadow:inset 0 -3px #604b36,3px 3px #090b12}
.login-link,.top-login,.filter,button:not(.character-card):not([data-key]){border-radius:0!important}
.login-link,.top-login{background:#292432!important;color:#edce95!important;border:2px solid #8c7488!important;box-shadow:inset 0 2px #bca1a044,3px 3px #080a11!important;font-family:'VT323',monospace!important;font-size:21px!important}
.pixel-frame,.catalog-card,.character-card,.seo-guide,.game-shell,.character-panel,dialog{background-color:#1b1c2b;border:3px solid #080a11;outline:1px solid #746476;box-shadow:inset 0 2px #b4a3ab33,inset 0 -3px #0b0d17,6px 6px #080a11;border-radius:0!important}
.hero{background:linear-gradient(90deg,#171925f5 45%,#1719259c),url('assets/ash-ranger-portrait.png') right center/auto 100% no-repeat;padding:36px;min-height:220px}
.hero h1{font-size:clamp(44px,6vw,76px);line-height:1;letter-spacing:1px;max-width:850px}
.hero-copy{max-width:650px;color:#cbc2cb}.hero-stamp{transform:none;background:#171a26;border:4px double #9e855e;color:#edca87}
.eyebrow,.char-kicker{color:#e1bb7d}.crumbs{color:#b8aabc}
.toolbox{padding:18px;background:#171824;border:2px solid #5d5265;box-shadow:4px 4px #080a11}
.search{min-width:0;width:100%;flex-basis:280px;background:#0e111b;border-color:#675b70;color:#f0e6da}
.filter{background:#2a2735;border-color:#6b5d71;box-shadow:inset 0 2px #a191a833,3px 3px #080a11}
.filter[aria-pressed=true]{background:#354c43;color:#d8efcb;border-color:#93bb97}
.catalog-card{border-top:5px solid #92b59d;padding:20px;background:linear-gradient(180deg,#252837,#191c29)}
.catalog-card[data-kind=risk]{border-top-color:#c28a99}.catalog-card h2{font-size:32px}.card-id{color:#aaa0b1}.card-icon{background:#111622;color:#edc68d;border-color:#8a7467;box-shadow:inset 0 0 0 3px #262534,3px 3px #080a11}
.effect{color:#dddccf;font-size:14px}.tradeoff{color:#ecc2cc}.card-tag{font-size:20px}
.expansion-card{border:2px solid #66546c;background:#211f2d;box-shadow:inset 0 2px #93819833,3px 3px #080a11;padding:16px;color:#e0d4dd}
.character-strip{grid-auto-columns:minmax(170px,1fr);gap:18px;padding:6px 7px 20px}
.character-card{display:flex;flex-direction:column}.character-card img{height:240px;aspect-ratio:auto;object-position:center;border-bottom:4px solid #080a11}.character-card strong{font-size:27px;line-height:1.1}.character-card small{margin-top:auto;padding-top:14px}.character-card .char-kicker{min-height:38px;letter-spacing:1px}
.character-modal{max-height:90dvh}.character-body{background:#1b1c2b}.stat-box{border-color:#62566b;box-shadow:inset 0 2px #080a11}.stat-box small{color:#bab0be}
.game-shell .topbar,.game-shell .bottom{background:#212131;border-color:#796478}.character-panel h2,.held-heading h3,.seo-guide h2,.seo-guide h3{font-family:'VT323',monospace}.character-panel h2{font-size:30px}.character-panel dl>div{border-radius:0!important;background:#131621;border-bottom:2px solid #393444}
.primary,.about-cta a{background:#accfa7!important;color:#17261f!important;border:2px solid #d2e4b8!important;box-shadow:inset 0 -4px #71927c,4px 4px #080a11!important}
.seo-faq-item{border:2px solid #5b4e62!important;background:#151823}.section-note,.page-footer{color:#b4aaba}.page-footer{border-top:3px solid #625364}
@media(max-width:760px){.hero{padding:24px 20px;min-height:0}.hero h1{font-size:46px}.hero-stamp{display:none}.brand{font-size:25px}.main-nav a,.site-primary-nav a{font-size:18px;white-space:normal}.toolbox{padding:12px}.character-strip{grid-auto-columns:72%}.character-card img{height:260px}.seo-guide{padding:22px 18px}.character-modal{max-height:90dvh}.head-inner{padding:12px 14px}.hero-copy{font-size:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Coarse pixel scenes matched to the existing character portraits. */
body{background:#10111b url('assets/site/dungeon-background.png') center top/cover no-repeat fixed;background-blend-mode:soft-light}
.hero.hero-characters{--scene:url('assets/site/characters-banner.png')}
.hero.hero-cards{--scene:url('assets/site/cards-banner.png')}
.hero.hero-about{--scene:url('assets/site/about-banner.png')}
.hero{display:block;min-height:340px;padding:40px;background-image:linear-gradient(90deg,#141622ed 0%,#141622c9 38%,#14162200 65%),var(--scene);background-size:cover;background-position:center;background-repeat:no-repeat;image-rendering:pixelated}
.hero>div{max-width:52%}.hero h1{font-size:clamp(40px,4.2vw,62px);line-height:1.05}.hero-copy{font-size:15px;line-height:1.65;color:#ece5db}.hero .eyebrow{font-size:19px}
@media(max-width:760px){.hero{padding:24px 20px 210px;min-height:440px;background-image:linear-gradient(180deg,#141622f5 0%,#141622e8 40%,#14162200 65%),var(--scene);background-size:auto,auto 240px;background-position:center,right bottom}.hero>div{max-width:100%}.hero h1{font-size:42px}.hero-copy{font-size:14px}}