/* Palette and cut-corner geometry from game/src/ui-system.css.
   Intro structure and approved Mincho headings stay in place. */
:root{color-scheme:dark;--ui-yellow:#f1c65a;--ui-red:#d65c46;--ui-ink:#181d20;--ui-panel:#292d2d;--ui-white:#f6f1e3;--ui-muted:#cbc7b8;--ui-rule:#f6f1e344;--paper:var(--ui-ink);--ink:var(--ui-white);--line:var(--ui-rule);--red:var(--ui-yellow);--site-cut:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)}
body{background:var(--ui-ink)!important;color:var(--ui-white)}
.paper{background:var(--ui-ink)!important}
h1,h2,h3{color:var(--ui-white)}
.how>h2,.cans-section>h2{color:var(--ui-yellow)}
p{color:var(--ui-muted)}
.wire-image{background:#343c3c!important;color:var(--ui-muted);border:0!important;clip-path:var(--site-cut)}
.opening-image{background:linear-gradient(145deg,#343f3c,#20292c)!important;clip-path:none;border-bottom:1px solid var(--ui-rule)!important}
#town-view .scene-headline,#town-view .scene-headline h1{color:var(--ui-white)}
#town-view .scene-copy p{color:var(--ui-white)}
.how-lead{color:var(--ui-muted)}
.how .steps article>span{color:var(--ui-yellow);font:italic 900 25px/1.2 Impact,"Arial Narrow",Arial,sans-serif;margin-bottom:14px}
.how .steps h3{color:var(--ui-white)}
.how .steps .step-icon{background:var(--ui-panel)!important;border:0!important;color:var(--ui-yellow);box-shadow:inset 0 -2px var(--ui-rule)!important;clip-path:var(--site-cut)}
.how .steps p{color:var(--ui-muted)}
.town-photo{background:linear-gradient(135deg,#35423c,#252e2c)!important;clip-path:none}
.story-panel{background:#181d20f5!important;color:var(--ui-white);border:0!important;clip-path:var(--site-cut);box-shadow:inset 0 -3px var(--ui-yellow)!important}
.story-panel h2{color:var(--ui-yellow);margin-top:0}
.story-panel p{color:var(--ui-white)}
.course-name-images{padding-top:22px;border-top:1px solid var(--ui-rule)}
.food-group{background:var(--ui-panel)!important}
.food-group>span{color:var(--ui-muted)}
.food-labels span{background:#f6f1e30d;color:var(--ui-white);border:0;box-shadow:inset 0 -2px var(--ui-yellow);clip-path:var(--site-cut)}
.wire-information{color:var(--ui-muted);border-color:var(--ui-rule)}
.closing{background:linear-gradient(145deg,#292d2d,#181d20)!important;border:0!important;border-top:1px solid var(--ui-rule)!important}
.closing p,.closing .closing-line{color:var(--ui-white)!important}
.closing a{display:inline-flex;align-items:center;justify-content:center;min-height:54px;min-width:220px;padding:14px 32px;background:linear-gradient(110deg,#ffe39b,#efbf4b)!important;color:#26251e!important;border:0;border-radius:0;clip-path:var(--site-cut);font-weight:700}
.closing a:hover{background:#ffe8ac!important}
a:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--ui-yellow)}
footer{background:#14191b!important;color:var(--ui-muted)!important;border-top:1px solid var(--ui-rule)}
footer nav a:hover{color:var(--ui-yellow)}
footer>a img{filter:brightness(0) invert(94%) sepia(15%) saturate(241%)!important}
@media(max-width:900px){.story-panel{width:100%;max-width:460px}.food-labels span{padding:20px 4px}}

/* Instruction image placeholders have no bottom rule. */
.how .steps .step-icon{box-shadow:none!important}

/* Match the instruction blocks: no decorative bottom rules. */
.story-panel,.food-labels span,.closing a{box-shadow:none!important;border-bottom:0!important}
.opening-image{border-bottom:0!important}
.course-name-images,.wire-information,.closing,footer{border-top:0!important}