/* Game values: src/pixel/pixel.css; docs/pixel-style-guide.md §§3–4.
   Editorial aliases and spacing extensions are specific to this changelog. */
:root {
  --surface-page: #171b2e;
  --surface-panel: #2b444b;
  --surface-panel-light: #43616a;
  --surface-panel-dark: #1d3037;
  --surface-well: #141829;
  --surface-callout: #3a4262;
  --surface-disabled: #3a4058;
  --action-fill: #e6d5ae;
  --action-light: #f5ead0;
  --action-dark: #a9987a;
  --action-selected: #ddb555;
  --action-selected-light: #f1d78d;
  --action-selected-dark: #99732e;
  --text-primary: #ece8dc;
  --text-secondary: #aab8d0;
  --text-on-action: #2e2a30;
  --text-on-action-secondary: #5d5358;
  --text-good: #9ccf98;
  --text-bad: #e8a096;
  --text-info: #8aa2d6;
  --focus-ring: #e8d488;
  --frame-outline: #0f1220;
  --chapter-forest: #284a3c;
  --chapter-desert: #51422a;
  --chapter-dungeon: #38345f;
  --chapter-mountain: #2c4a66;
  --chapter-temple: #4a4424;
  --chapter-inferno: #542c2e;
  --font-label: 'Silkscreen', ui-monospace, monospace;
  --font-body: 'Jersey 10', system-ui, sans-serif;
  --type-small: 12px;
  --type-label: 16px;
  --type-section: 48px;
  --type-section-phone: 32px;
  --type-title: 64px;
  --type-title-phone: 48px;
  --type-lead: 40px;
  --type-body: 20px;
  --line-body: 24px; /* Editorial breathing room; glyph size stays 20px. */
  --grid: 2px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-section: 48px;
  --content-width: 1280px;
  --reading-width: 560px;
  --frame-width: 2px;
  --frame-notch: polygon(2px 0,calc(100% - 2px) 0,calc(100% - 2px) 2px,100% 2px,100% calc(100% - 2px),calc(100% - 2px) calc(100% - 2px),calc(100% - 2px) 100%,2px 100%,2px calc(100% - 2px),0 calc(100% - 2px),0 2px,2px 2px);
  --shadow-panel: inset 2px 2px 0 var(--surface-panel-light),inset -2px -2px 0 var(--surface-panel-dark);
  --shadow-action: inset 2px 2px 0 var(--action-light),inset -2px -4px 0 var(--action-dark);
  --shadow-selected: inset 2px 2px 0 var(--action-selected-light),inset -2px -4px 0 var(--action-selected-dark);
  --shadow-text: 2px 2px 0 var(--frame-outline);
  --motion-press: 80ms;
  --motion-steps: steps(2,start);
  --motion-idle: 1400ms;
  --forest-light: #3f6654;
  --forest-dark: #1a3229;
  --desert-light: #6e5c3c;
  --desert-dark: #372c1b;
  --dungeon-light: #514c7e;
  --dungeon-dark: #262342;
  --mountain-light: #436585;
  --mountain-dark: #1d334a;
  --temple-light: #666037;
  --temple-dark: #322e17;
  --inferno-light: #733f40;
  --inferno-dark: #391d20;
}

@font-face{font-family:Silkscreen;src:url('fonts/silkscreen.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Jersey 10';src:url('fonts/jersey-10.woff2') format('woff2');font-weight:400;font-display:swap}
*{box-sizing:border-box}html{background:var(--surface-page);scroll-padding-top:64px}body{margin:0;color:var(--text-primary);background:var(--surface-page);font:400 20px/24px var(--font-body);font-synthesis:none}
h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-weight:400}h1,h2,h3,.brand,.date,button,.button,.section-nav{font-family:var(--font-label)}h1{font-size:64px;line-height:72px}h2{font-size:48px;line-height:56px;max-width:1100px}h3{font-size:16px;line-height:24px}
a{color:inherit;text-underline-offset:4px}a:hover{color:var(--focus-ring)}img{display:block}[hidden]{display:none!important}.wrap{width:calc(100% - 64px);max-width:1280px;margin-inline:auto;min-width:0}
a,button{touch-action:manipulation}:focus-visible,.state-focus{outline:2px solid var(--focus-ring);outline-offset:4px}.skip{position:fixed;z-index:100;top:-120px;left:16px;background:var(--action-fill);color:var(--text-on-action);padding:12px}.skip:focus{top:16px}
.button,button{display:inline-flex;align-items:center;justify-content:center;position:relative;min-height:48px;padding:12px 20px;border:2px solid var(--frame-outline);background:var(--action-fill);color:var(--text-on-action);box-shadow:var(--shadow-action);font:400 16px/24px var(--font-label);cursor:pointer;text-decoration:none}
.button:hover,button:hover,.state-hover{background:var(--action-light);color:var(--text-on-action)}.primary,button[aria-selected=true],button[aria-pressed=true]{background:var(--action-selected);box-shadow:var(--shadow-selected)}.button:active,button:active,.state-pressed{top:2px;box-shadow:inset 2px 2px var(--action-dark)}button:disabled{background:var(--surface-disabled);color:var(--text-primary);box-shadow:none;cursor:not-allowed}
.pixel{image-rendering:pixelated}.capture.before,.crop.before{image-rendering:auto}.capture.now,.crop.now{image-rendering:auto}
.band{padding-block:48px;border-top:2px solid var(--frame-outline);scroll-margin-top:16px}.section-head{display:grid;gap:16px;margin-bottom:28px;text-align:center;justify-items:center}.section-head>p{font-size:40px;line-height:44px;max-width:880px}
.forest{--chapter:var(--chapter-forest);--hi:var(--forest-light);--lo:var(--forest-dark)}.desert{--chapter:var(--chapter-desert);--hi:var(--desert-light);--lo:var(--desert-dark)}.dungeon{--chapter:var(--chapter-dungeon);--hi:var(--dungeon-light);--lo:var(--dungeon-dark)}.mountain{--chapter:var(--chapter-mountain);--hi:var(--mountain-light);--lo:var(--mountain-dark)}.temple{--chapter:var(--chapter-temple);--hi:var(--temple-light);--lo:var(--temple-dark)}.inferno{--chapter:var(--chapter-inferno);--hi:var(--inferno-light);--lo:var(--inferno-dark)}.band.forest{background:var(--chapter)}.slate{background:var(--surface-callout)}.night{background:var(--surface-page)}
.opening{padding:24px 0 32px}.opening-layout{display:grid;gap:16px;justify-items:center}.opening-copy{display:grid;gap:12px;text-align:center;justify-items:center}.brand{font-size:16px;line-height:24px}.date{font-size:12px;line-height:20px;color:var(--text-secondary)}.lead{font-size:20px;line-height:24px}
.opening-action{grid-row:2}.opening-action .button{min-width:200px;min-height:56px}.opening-stage{position:relative;max-width:782px;width:100%}.opening-pair{display:grid;grid-template-columns:repeat(2,minmax(0,379px));gap:24px}
.phone{border:2px solid var(--frame-outline);background:var(--surface-well);box-shadow:inset 2px 2px var(--surface-panel-light);width:379px;max-width:100%;min-width:0;overflow:hidden}.phone figcaption{font:12px/20px var(--font-label);padding:6px 12px}.phone-shot{width:100%;container-type:inline-size}.capture{width:375px;max-width:100%;height:auto;aspect-ratio:750/1334}
@container(min-width:375px){.capture.now{image-rendering:pixelated}}
.opening-creature{position:absolute;bottom:12px;width:128px;padding:0 8px 16px;border-bottom:2px solid var(--forest-light);background:linear-gradient(transparent 70%,var(--forest-dark) 0)}.opening-creature .pixel{width:112px;height:112px}.opening-creature.left{left:-160px}.opening-creature.right{right:-160px}
.section-nav{position:sticky;top:0;z-index:30;display:flex;justify-content:center;gap:8px;flex-wrap:nowrap;background:var(--surface-well);padding:0 16px;border-block:2px solid var(--frame-outline)}.section-nav a{flex:0 0 auto;white-space:nowrap;display:flex;align-items:center;justify-content:center;min-height:44px;padding:8px 12px;font-size:12px;line-height:20px;text-decoration:none}.section-nav a[aria-current]{background:var(--action-selected);color:var(--text-on-action);text-decoration:underline}
.picker-controls{margin-bottom:24px}.screen-tabs,.era-buttons{display:flex;gap:4px;flex-wrap:wrap;justify-content:center}.screen-tabs button,.era-buttons button{font-size:12px;padding:10px 12px}.era-buttons{display:none;max-width:379px;margin-inline:auto}.screen-deck{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,782px),1fr));gap:32px;max-width:100%}.screen-choice{width:782px;max-width:100%;min-width:0;margin-inline:auto}.phone-pair{display:grid;grid-template-columns:repeat(2,minmax(0,379px));gap:24px}.screen-caption{margin:16px auto 0;max-width:750px;text-align:center}.screen-picker.enhanced .screen-deck{display:block}.screen-choice:focus-visible{outline-offset:6px}
/* Compact comparisons only before JavaScript enhances the picker. */
@media(min-width:601px){
.screen-picker:not(.enhanced) .screen-deck{grid-template-columns:repeat(2,minmax(0,1fr))}
.screen-picker:not(.enhanced) .screen-choice{width:394px}
.screen-picker:not(.enhanced) .phone-pair{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.screen-picker:not(.enhanced) .phone{width:191px}
.screen-picker:not(.enhanced) .capture{width:187px;image-rendering:auto}
}
@media(min-width:1200px){.screen-picker:not(.enhanced) .screen-deck{grid-template-columns:repeat(3,minmax(0,1fr))}}
.enemy-proof{display:grid;grid-template-columns:repeat(2,minmax(0,359px));gap:24px;max-width:742px;margin:0 auto 24px;align-items:center}.enemy-proof>figure{display:grid;justify-items:center;gap:12px;min-width:0;container-type:inline-size}.crop{width:var(--crop-width);max-width:100%;height:auto}.enemy-proof figcaption{padding:8px 0;font:12px/20px var(--font-label)}
@container(min-width:359px){.enemy-proof .crop.now{image-rendering:pixelated}}
.roster-intro{max-width:720px;margin:0 auto 24px;text-align:center}.chapter-roster{display:grid;gap:8px}.chapter-band{background:var(--chapter);border:2px solid var(--frame-outline);min-width:0}.chapter-band h3{padding:12px 20px;border-bottom:2px solid var(--hi);position:relative;z-index:2}.creature-line{display:grid;grid-template-columns:repeat(6,minmax(0,1fr))}.creature{min-width:0;text-align:center}
.creature-ground{height:180px;display:grid;place-items:end center;position:relative;padding-bottom:16px;background:linear-gradient(transparent 72%,var(--hi) 72%,var(--hi) calc(72% + 2px),var(--lo) calc(72% + 2px))}.actor{--px:4px;position:relative;display:flex;width:112px;height:112px}.actor-body{position:relative;width:112px;height:112px}.flies .actor-body{top:-28px}.shadow{position:absolute;bottom:calc(var(--px)*-1);background:rgba(8,9,12,.6)}.flies .shadow{background:rgba(8,9,12,.42)}.creature figcaption{padding:8px 4px 12px;min-height:60px}.boss-label{display:block;color:var(--text-secondary)}
.dice-gallery,.mod-gallery{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:24px 16px;max-width:1200px;margin-inline:auto;text-align:center}.dice-gallery{margin-bottom:48px}.die-art,.mod-art{display:grid;justify-items:center;align-content:start;gap:12px;min-width:0}.die-art .pixel{width:112px;height:112px}.die-art figcaption{font:12px/20px var(--font-label)}.mod-art .pixel{width:48px;height:48px}.mod-art figcaption{font:20px/24px var(--font-body)}
.feature-deck{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.feature-choice{width:395px;max-width:100%;min-width:0;margin-inline:auto}.feature-picker.enhanced .feature-deck{display:block}.small-card{display:grid;gap:12px;justify-items:center;align-content:start;min-width:0;padding:16px;background:var(--surface-well);border:2px solid var(--frame-outline);box-shadow:var(--shadow-panel)}.small-picture{display:grid;place-items:center;min-width:0;width:100%;height:220px;container-type:inline-size}.small-card figcaption{width:100%;max-width:359px;min-height:72px;text-align:center}.app-icon{width:192px;height:192px}
@container(min-width:355px){.small-picture .crop[src$="account.png"],.small-picture .crop[src$="faces.png"],.small-picture .crop[src$="font.png"]{image-rendering:pixelated}}
@container(min-width:359px){.small-picture .crop[src$="continue.png"],.small-picture .crop[src$="next-enemy.png"],.small-picture .crop[src$="shop-mods.png"]{image-rendering:pixelated}}
.fix-list{max-width:720px;margin:0 auto;padding:0;list-style:none;text-align:left}.fix-name{display:flex;align-items:center;gap:12px;margin-bottom:8px}.fix-name .pixel{width:24px;height:24px}.mod-fix p{margin-left:36px}.fix-list li{padding-block:8px}.ending{display:grid;gap:20px;justify-items:center;padding:32px 16px 48px;background:var(--surface-page)}.ending .button{font-size:24px;line-height:32px;min-height:72px;padding-inline:32px}.ending>div{display:flex;gap:24px}
.system-head{display:grid;gap:24px;padding-block:48px}.type-title{font:64px/72px var(--font-label)}.type-heading{font:48px/56px var(--font-label)}.type-lead{font:40px/44px var(--font-body)}.swatches,.control-states{display:flex;gap:12px;flex-wrap:wrap}.swatches span{padding:16px;border:2px solid var(--text-secondary)}
@media(max-width:1100px){.die-art .pixel{width:84px;height:84px}.feature-deck{grid-template-columns:repeat(2,minmax(0,1fr))}.mod-gallery{grid-template-columns:repeat(6,minmax(0,1fr));column-gap:8px}}
@media(max-width:1180px){.opening-creature{display:none}.actor,.actor-body{width:84px;height:84px}.actor{--px:3px}.flies .actor-body{top:-21px}.creature-ground{height:144px}}
@media(min-width:601px) and (max-width:900px){.dice-gallery{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:900px){.screen-picker.enhanced .era-buttons{display:flex;margin-top:12px}.era-buttons button{flex:1}.screen-picker.enhanced .screen-choice{width:379px}.screen-picker.enhanced .phone-pair{display:block}.screen-picker.enhanced[data-version=now] .phone[data-era=before],.screen-picker.enhanced[data-version=before] .phone[data-era=now]{display:none}.creature-line{grid-template-columns:repeat(3,minmax(0,1fr))}.actor,.actor-body{width:56px;height:56px}.actor{--px:2px}.flies .actor-body{top:-14px}.creature-ground{height:112px}.creature figcaption{min-height:52px}}
@media(max-width:600px){
html{scroll-padding-top:104px}.wrap{width:calc(100% - 32px)}h1{font-size:48px;line-height:56px}h2{font-size:32px;line-height:40px}
.opening{padding:16px 0 24px}.opening-copy{gap:8px}.brand{font-size:12px;line-height:20px}.date{line-height:20px}.opening-layout{gap:16px}.opening-action{grid-row:auto}.opening-pair{gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}.opening-pair .phone{width:100%}.phone figcaption{padding:4px 8px}.opening-pair .capture.now{image-rendering:auto!important}
.section-nav{gap:0;padding-inline:4px;flex-wrap:wrap}.section-nav a{padding:8px 4px;font-size:12px}
.band{padding-block:32px}.section-head{gap:12px;margin-bottom:20px}.section-head>p{font-size:20px;line-height:24px}
.screen-tabs button{flex:1 0 28%;padding-inline:8px}.screen-deck{display:flex;flex-wrap:nowrap;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 0 12px}.screen-choice{flex:0 0 80%;scroll-snap-align:start}.phone-pair{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.screen-picker.enhanced .screen-deck{overflow:visible;padding:0}.screen-picker.enhanced .screen-choice{width:100%;max-width:379px}.screen-picker.enhanced .phone{width:100%}
.enemy-proof{grid-template-columns:1fr;gap:12px;max-width:359px}.chapter-band h3{padding:8px 12px}.creature-ground{height:96px}.creature figcaption{font-size:20px;line-height:20px;padding:6px 4px 8px;min-height:52px}
.dice-gallery,.mod-gallery{grid-template-columns:repeat(4,minmax(0,1fr))}.mod-gallery{column-gap:4px}.die-art .pixel{width:56px;height:56px}.feature-deck{grid-template-columns:minmax(0,1fr)}.feature-picker .screen-tabs button{flex:1 0 40%}.small-card{padding:12px;gap:12px}
.ending{padding:24px 16px 32px}.ending .button{font-size:16px;line-height:24px;padding-inline:24px}.system-head h1{font-size:48px;line-height:56px}
}
img.now.pixel-resampled{image-rendering:auto}img.now.pixel-integral{image-rendering:pixelated}
@media(prefers-reduced-motion:no-preference){.button,button{transition:top 80ms steps(2,start)}.screen-choice.swapping,.feature-choice.swapping{animation:screen-cut 100ms steps(2,end)}}@keyframes screen-cut{from{opacity:.65}to{opacity:1}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important;scroll-snap-type:none!important}}
@media(forced-colors:active){.phone,.chapter-band,.small-card,button,.button{border:2px solid CanvasText}.section-nav a[aria-current],button[aria-selected=true],button[aria-pressed=true]{outline:2px solid Highlight}}