:root{color-scheme:dark;--ink:#f0e8d4;--muted:#b9bfac;--gold:#efc16b;--panel:#17261ff0;--edge:#4f6753}*{box-sizing:border-box}body{margin:0;background:#0a1510;color:var(--ink);font:16px/1.45 system-ui,'Microsoft YaHei',sans-serif}button,input,select{font:inherit}button{color:var(--ink);background:#284533;border:1px solid #64785a;border-radius:7px;padding:9px 12px;cursor:pointer;min-height:42px}button:hover{background:#3e6045}button:disabled{opacity:.5;cursor:default}button.chosen{outline:2px solid var(--gold);background:#455a31}button.danger{background:#683c31}h1,h2,h3,p{margin:.3em 0 .7em}h1{font-family:Georgia,serif;font-size:32px;letter-spacing:.1em}h2{font-size:23px}h3{font-size:18px}small,.muted{color:var(--muted)}header{padding:15px 24px;border-bottom:1px solid var(--edge);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.brand small{display:block;font-size:12px;letter-spacing:.16em;color:var(--gold)}.stats{display:flex;gap:16px;flex-wrap:wrap;align-items:center}.layout{max-width:1530px;margin:auto;padding:18px;display:grid;grid-template-columns:minmax(0,1fr) 315px;gap:16px}.panel{background:var(--panel);border:1px solid var(--edge);border-radius:12px;padding:16px}.scene-art{height:155px;background-position:center;background-size:cover;border-radius:9px;margin-bottom:12px;position:relative}.scene-art h2{position:absolute;bottom:0;left:0;right:0;padding:22px 15px 8px;background:linear-gradient(transparent,#101c14);margin:0}.story{font-size:18px;border-left:3px solid var(--gold);padding-left:12px;line-height:1.6}.board-wrap{overflow:auto;max-width:100%;background:#101f17;border:1px solid #526b4d;border-radius:9px;padding:8px}.board{position:relative;margin:auto;min-width:320px}.cell{position:absolute;padding:0;border-radius:0;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);border:0;background:#40563ce8;min-height:0;display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:11px;line-height:1.1;color:#f7f1da;transition:background .15s}.cell:hover{background:#738250}.cell.wall{background:#26352b;color:#778b82}.cell.water{background:#174e65;color:#9bd6e0}.cell.bridge{background:#a57c44}.cell.fog{filter:brightness(.4)}.cell.route{background:#75844f}.cell.selected{background:#998743}.cell.threat{background:#9e4437}.cell.range{box-shadow:inset 0 0 20px 8px #c68c4890;background:#635d36}.cell.hero{background:#467973}.cell.enemy{background:#704e35}.sprite{display:inline-block;background-repeat:no-repeat;flex-shrink:0;vertical-align:middle;width:44px;height:44px;background-size:500% 100%;background-position:calc(var(--i) * 25%) 0}.sprite.hero-sprite{background-image:url('assets/heroes.png');background-size:300% 100%;background-position:calc(var(--i) * 50%) 0}.sprite.enemy-sprite{background-image:url('assets/enemies.png')}.sprite.npc-sprite{background-image:url('assets/npc.png');background-size:300% 100%;background-position:calc(var(--i) * 50%) 0}.sprite.item-sprite{background-image:url('assets/items.png');background-size:500% 200%;background-position:calc(var(--col) * 25%) calc(var(--row) * 100%)}.sprite.skill-sprite{background-image:url('assets/skills.png');background-size:500% 300%;background-position:calc(var(--col) * 25%) calc(var(--row) * 50%)}.cell .sprite{width:35px;height:35px}.toolbar{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0}.notice{padding:10px;background:#343d26;border-radius:7px;color:#fff0bf}.actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.action{display:flex;gap:7px;align-items:center;text-align:left}.action small{display:block;font-size:12px}.log{font-size:14px;max-height:180px;overflow:auto;padding-left:18px}.log li{margin:5px 0}.health{height:5px;width:88%;background:#172318;margin-top:2px}.health span{display:block;height:100%;background:#aad080}.object-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}.object-list button{font-size:13px;padding:6px 9px}.objective{background:#2b3c29;padding:10px;border-left:3px solid #d2a959}.pill{color:#e4be75;font-size:12px}.tabs{display:flex;gap:6px;flex-wrap:wrap}.tabs button{padding:7px 10px;font-size:14px}.modal-backdrop{position:fixed;inset:0;background:#000b;display:grid;place-items:center;padding:20px;z-index:10}.modal{width:min(900px,100%);max-height:90dvh;overflow:auto;background:#17291e;border:1px solid var(--gold);padding:20px;border-radius:13px}.modal header{padding:0 0 10px;margin-bottom:12px}.item-row{display:flex;align-items:center;gap:9px;padding:10px;border-bottom:1px solid #43553e;flex-wrap:wrap}.item-row .description{flex:1;min-width:170px}.item-row .toolbar{margin:0}.quality-fine{color:#91ca99}.quality-rare{color:#97c8ef}.quality-feature{color:#e7b475}.columns{display:grid;grid-template-columns:1fr 1fr;gap:12px}.intro{max-width:950px;margin:40px auto;padding:25px}.intro .scene-art{height:280px}.class-card{padding:20px;flex:1;min-width:190px;display:grid;gap:12px;text-align:left}.class-card .sprite{width:110px;height:140px}.boot-error{padding:25px;color:#ffc89e}details{margin:8px 0}summary{cursor:pointer;color:#d6c58d}.toast{min-height:25px;color:#f1cf85}.ending{padding:22px;border:1px solid var(--gold);background:#283e24}.battle-info{display:grid;gap:7px}.enemy-row{display:flex;gap:7px;align-items:center;padding:5px;background:#273626}.enemy-row button{padding:4px 8px;font-size:12px;min-height:30px}.barrier{color:#99daef}@media(max-width:1050px){.layout{grid-template-columns:minmax(0,1fr) 275px;padding:10px}.panel{padding:10px}}@media(max-width:720px){header{padding:10px;font-size:14px}.layout{display:block}.layout>aside{margin-top:10px}.columns{grid-template-columns:1fr}.scene-art{height:130px}.modal-backdrop{padding:8px}.modal{padding:12px}.story{font-size:16px}h1{font-size:25px}.intro{margin:10px;padding:12px}.intro .scene-art{height:160px}.stats{gap:8px}.class-card{min-width:0;padding:12px}.class-card .sprite{width:65px;height:80px}}

:root .layout{max-width:1920px;padding:10px 14px;grid-template-columns:minmax(0,1fr) 266px;gap:12px}.layout>.stage-panel{padding:10px;min-width:0}.layout>.side-panel{padding:12px}.stage-title{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:32px;margin-bottom:7px}.stage-title h2{margin:0;font-size:20px}.stage-title>.muted{font-size:12px}.turn-status{display:flex;gap:10px;font-size:14px;flex-wrap:wrap}.board-wrap{padding:0;border:0;overflow:hidden;background:#142219;max-width:100%;border-radius:8px}.board{position:relative;isolation:isolate;background-size:100% 100%;background-position:center;border-radius:8px;width:min(100%,calc((100dvh - 285px)*var(--ratio)));aspect-ratio:var(--ratio);height:auto;min-width:0;margin:auto;overflow:hidden}.world-board{width:min(100%,calc((100dvh - 225px)*var(--ratio)))}.grid,.actor-layer,.fx-layer,.world-route{position:absolute;inset:0;width:100%;height:100%}.actor-layer,.fx-layer,.world-route{pointer-events:none}.fx-layer{z-index:2000}.world-route polyline{fill:none;stroke:#f2de9b;stroke-width:.45;stroke-dasharray:1.2 .8;opacity:.8}.cell{position:static;clip-path:none;fill:#31453122;stroke:#d5d5ac66;stroke-width:.9;vector-effect:non-scaling-stroke;cursor:pointer;filter:none;transition:fill .12s}.cell:hover,.cell:focus-visible{fill:#d8d99555;outline:none;stroke:#fff0b8;stroke-width:2}.cell.wall{fill:#10201620;stroke:#a9a18b88;stroke-dasharray:3 4}.cell.water{fill:#174e65bb;stroke:#8fc2cc77}.cell.bridge{fill:#a57c4444;stroke:#ffe7ab}.cell.fog{fill:#111c12aa}.cell.route{fill:#c4cf7255;stroke:#eaf1c1}.cell.selected{fill:#e1c75255}.cell.threat{fill:#a0363477;stroke:#ff9989;stroke-width:2;stroke-dasharray:5 3}.cell.reachable{fill:#dcbd3f33;stroke:#f4d581aa;stroke-width:1.2}.cell.range{fill:#ffca6755;stroke:#ffecad;stroke-width:2}.map-actor{position:absolute;transform:translate(-50%,0);width:140px;height:0;display:block;pointer-events:none;line-height:1.1}.map-actor .sprite{position:absolute;left:50%;bottom:-12px;width:130px;height:130px;transform:translateX(-50%);filter:drop-shadow(0 2px 2px #0009)}.map-actor .hero-body{width:174px;height:174px;bottom:-14px;left:calc(50% - 87px);transform:none;background-size:300% 200%;background-position:calc(mod(var(--frame),3) * 50%) calc(round(down, var(--frame) / 3) * 100%)}.hero-body[data-frame="0"]{background-position:0 0}.hero-body[data-frame="1"]{background-position:50% 0}.hero-body[data-frame="2"]{background-position:100% 0}.hero-body[data-frame="3"]{background-position:0 100%}.hero-body[data-frame="4"]{background-position:50% 100%}.hero-body[data-frame="5"]{background-position:100% 100%}.hero-warrior{background-image:url('assets/hero-warrior-ui2.png')!important}.hero-mage{background-image:url('assets/hero-mage-ui2.png')!important}.hero-ranger{background-image:url('assets/hero-ranger-ui2.png')!important}.world-board .hero-body{width:156px;height:156px;left:calc(50% - 78px);bottom:-13px}.ground-shadow{position:absolute;left:50%;bottom:-7px;transform:translateX(-50%);width:49px;height:15px;background:#09150988;border-radius:50%;box-shadow:0 0 5px #0004}.map-actor small,.object-pick{position:absolute;top:12px;left:50%;transform:translateX(-50%);background:#102016e8;padding:3px 6px;border-radius:4px;font-size:12px;color:#fff0d5;text-align:center;max-width:135px;min-width:40px;white-space:nowrap;box-shadow:0 1px 3px #0009;border:1px solid #76836a88}.map-actor.hero small{color:#dcfff3;outline:1px solid #a8e7c277}.map-actor.enemy small{color:#ffe0c5}.map-actor .health{position:absolute;left:50%;top:34px;transform:translateX(-50%);width:56px;height:5px;border:1px solid #17331b}.map-actor.object .sprite{width:114px;height:114px;bottom:-10px}.object-pick{pointer-events:auto;cursor:pointer;min-height:28px;padding:4px 7px;top:12px}.object-icon{position:absolute;left:50%;bottom:2px;transform:translateX(-50%);width:40px;height:40px;display:grid;place-items:center;font-size:25px;color:#ffdf92;text-shadow:0 2px 3px #000;background:#273926cc;border:1px solid #cbaa69;border-radius:50%}.nav-world{cursor:crosshair}.aim-info{font-size:13px;color:#f5d598;background:#202f22;padding:6px 10px;min-height:31px;margin:6px 0 0;border-radius:5px}.battle-footer{display:flex;align-items:center;gap:8px;margin-top:7px}.battle-footer>span{flex:1;color:#e6d197;font-size:13px}.actions{gap:7px}.action{padding:8px 7px;white-space:normal;word-break:keep-all;min-height:55px;font-size:14px;display:flex;align-items:center;gap:5px}.action .sprite{width:32px;height:32px}.action>span{display:block;min-width:0}.action small{display:block;font-size:11px}.skill-detail{font-size:13px;color:#d9cb9c;margin-top:12px}.side-panel details{font-size:14px;margin-top:14px}.attack-cue{width:100%;height:100%;position:absolute;inset:0}.attack-cue line{stroke:#ffe095;stroke-width:6;stroke-linecap:round;stroke-dasharray:18 10;filter:drop-shadow(0 0 5px #ffd887)}.attack-cue circle{fill:#fff0a135;stroke:#ffe3a0;stroke-width:4}.damage-cue{position:absolute;transform:translate(-50%,-230%);color:#fff4d9;font-size:18px;font-weight:700;padding:7px 10px;border:1px solid #edc787;background:#392315f2;border-radius:7px;white-space:nowrap;box-shadow:0 3px 12px #0009}.buff-cue{background:#183f42f2;color:#bdedf1}.hit-react .sprite{filter:drop-shadow(0 0 10px #ffe195) brightness(1.4)}header{padding:10px 16px;gap:8px}.brand h1{font-size:25px;margin:0}.brand small{font-size:10px}.stats{font-size:14px;gap:12px}.toast{margin:0;padding:2px 16px;min-height:24px;font-size:13px}.modal .toast{padding:8px 0}.modal header{padding:0 0 10px}.modal .sprite{width:44px;height:44px}.story-backdrop{position:fixed;inset:0;background:#08120b77;display:flex;align-items:flex-end;justify-content:center;padding:22px;z-index:30}.story-dialog{width:min(850px,95vw);max-height:65dvh;overflow:auto;border:1px solid #dac189;background:#15251cf7;padding:22px 28px;border-radius:10px;box-shadow:0 12px 50px #000b}.story-dialog>small{color:#d6b878}.story-dialog h2{margin:10px 0}.dialog-text{font-size:20px;line-height:1.75;white-space:pre-wrap}.story-dialog .toolbar{justify-content:flex-end}.journal-entry{border-bottom:1px solid #586149;padding:12px 0}.journal-entry p{line-height:1.7}.intro .class-card .sprite{width:110px;height:140px}@media(max-width:1100px){:root .layout{grid-template-columns:minmax(0,1fr) 236px;padding:8px;gap:8px}.stage-title{flex-wrap:wrap}.turn-status{gap:7px}.map-actor .hero-body{width:150px;height:150px;left:calc(50% - 75px)}.world-board .hero-body{width:136px;height:136px;left:calc(50% - 68px)}.map-actor .sprite{width:112px;height:112px}.map-actor small{font-size:11px}}@media(max-width:720px){:root .layout{display:flex;flex-direction:column;padding:6px}.board{width:100%}.map-actor{width:60px}.map-actor .sprite{width:65px;height:65px}.map-actor .hero-body,.world-board .hero-body{width:85px;height:85px;left:calc(50% - 42.5px);bottom:-7px}.map-actor small,.object-pick{font-size:9px;padding:2px;max-width:70px;white-space:normal}.object-icon{width:26px;height:26px;font-size:18px}.map-actor .health{width:34px}.stage-title h2{font-size:17px}.stage-title>.muted{font-size:10px}.turn-status{font-size:12px}.side-panel .actions{grid-template-columns:repeat(3,minmax(0,1fr))}.stats{font-size:12px}.tabs button{font-size:12px;padding:5px 7px}.dialog-text{font-size:16px}.story-dialog{padding:14px}.story-backdrop{padding:9px}.damage-cue{font-size:12px;padding:4px}}@media(prefers-reduced-motion:reduce){.cell{transition:none}}

.nav-world .npc-sprite{pointer-events:auto;cursor:pointer}

.intro .class-card .hero-body{width:140px;height:140px;background-size:300% 200%;background-position:0 0}

.unit-pick{position:absolute;left:50%;top:-12px;transform:translateX(-50%);width:43px;height:28px;min-height:0;background:transparent;border:0;border-radius:50%;padding:0;pointer-events:auto}.unit-pick:hover{background:#ffe29233;outline:1px solid #ffeab9}.map-actor.hero .hero-body{filter:drop-shadow(0 0 1px #efffe7) drop-shadow(0 3px 3px #0009)}

.map-actor .enemy-body{bottom:-3px;transform:scaleX(-1);background-image:url(assets/enemies-ui2.png)}.map-actor.object .npc-body{width:148px;height:148px;bottom:-3px;background-image:url(assets/npcs-ui2.png);background-size:300% 200%}.nav-world .npc-body{pointer-events:auto;cursor:pointer}@media(max-width:720px){.map-actor.object .npc-body{width:85px;height:85px;bottom:-2px}}
/* UI3 Owner feedback: central conversations, state-aware actions and local replies. */
.story-backdrop{align-items:center;padding:28px}.story-dialog{display:flex;align-items:center;gap:22px;width:min(1080px,94vw);max-height:82dvh;padding:28px 34px;overflow:auto;background:linear-gradient(130deg,#1e3327f7,#12221cfb);border:1px solid #dbb86b;box-shadow:0 18px 65px #000c}.dialog-copy{flex:1;min-width:0}.dialog-copy>small{color:#c4ac7c;font-size:13px}.speaker-name{display:inline-block;color:#ffd998!important;background:#304c38;border:1px solid #9d885c;border-radius:5px;padding:5px 18px;font-size:22px!important;letter-spacing:.08em;margin:10px 0!important}.narration .speaker-name{color:#b9d9cd!important;background:#1f3934;border-color:#647e73}.narration .dialog-text{color:#d5e0d4}.dialog-portrait{display:block;flex:0 0 245px;width:245px;height:245px;background-image:url('assets/portraits-ui3.png');background-size:500% 200%;background-position:calc(var(--col)*25%) calc(var(--row)*100%);background-repeat:no-repeat;border-radius:13px;filter:drop-shadow(0 8px 8px #0007)}.action-sprite{background-image:url('assets/actions-ui3.png');background-size:300% 300%;background-position:calc(var(--col)*50%) calc(var(--row)*50%);width:38px;height:38px}.action:disabled{opacity:1;background:#1b2923;border-color:#394a3e;color:#899486;filter:grayscale(1)}.action:disabled .sprite{opacity:.35}.action:disabled small{color:#9aab9c}.actions{grid-template-columns:repeat(2,minmax(0,1fr))}.actions .action{min-height:67px}.battle-footer button{display:flex;gap:5px;align-items:center}.battle-footer .action-sprite{width:26px;height:26px}.object-icon{padding:0;pointer-events:auto}.object-icon .action-sprite{width:36px;height:36px}.nav-world .npc-body{pointer-events:none}.npc-pick{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:64px;height:106px;min-height:0;padding:0;background:transparent;border:0;pointer-events:auto;border-radius:30%}.npc-pick:hover{background:#fff2ad15;box-shadow:0 0 10px #dfc575}.speech-bubble{position:absolute;z-index:2500;width:310px;max-width:45%;transform:translate(-50%,-100%);background:#eff0d7f2;border:1px solid #d3b375;color:#233224;border-radius:12px;padding:14px 18px;box-shadow:0 6px 18px #0008;pointer-events:none;font-size:15px}.speech-bubble:after{content:'';position:absolute;left:45%;bottom:-12px;border:6px solid transparent;border-top-color:#eff0d7}.speech-bubble p{margin:0;line-height:1.5}.speech-bubble>button{position:absolute;right:2px;top:1px;pointer-events:auto;min-height:22px;padding:0 5px;background:transparent;border:0;color:#344834}.speech-bubble .toolbar{pointer-events:auto;margin:9px 0 0}.speech-bubble .toolbar button{font-size:12px;min-height:30px;padding:4px 7px}.speech-bubble .toolbar .action-sprite{width:22px;height:22px}.world-fog{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.reward-batch{padding:15px;margin:15px 0;border:1px solid #6c7655;border-radius:9px;background:#203b28}.reward-batch h3{color:#efce8c}.reward-totals{padding:14px;background:#2d4933;border:1px solid #648559;border-radius:7px;color:#f6df99;font-size:18px}.victory-dialog{max-width:850px}.victory-dialog>h2{font-size:30px;color:#ffe4a8}.victory-dialog .toolbar{justify-content:flex-end}.reward-batch .item-row{padding:12px 0}.reward-batch .sprite{width:58px;height:58px}
@media(max-width:1100px){.dialog-portrait{flex-basis:180px;width:180px;height:180px}.story-dialog{padding:22px}.dialog-text{font-size:18px}.actions .action{min-height:63px}.speech-bubble{font-size:13px;width:270px}}
@media(max-width:720px){.story-dialog{display:block}.dialog-portrait{width:130px;height:130px;float:left;margin:0 15px 7px 0}.story-backdrop{padding:10px}.story-dialog{padding:16px}.speech-bubble{max-width:68%;font-size:12px}.action-sprite{width:25px;height:25px}}
.map-actor.object .object-icon .action-sprite{position:static;transform:none;width:34px;height:34px;pointer-events:none;filter:none}.map-actor.object .object-icon{display:grid;place-items:center;width:42px;height:42px}.speech-bubble{max-height:50%;overflow:auto}
.speech-bubble.below-object:after{top:-12px;bottom:auto;border-top-color:transparent;border-bottom-color:#eff0d7}.speech-bubble p{padding-right:8px}
.speech-bubble.left-object:after{left:auto;right:-12px;top:50%;bottom:auto;border-color:transparent;border-left-color:#eff0d7}.speech-bubble.right-object:after{left:-12px;right:auto;top:50%;bottom:auto;border-color:transparent;border-right-color:#eff0d7}
.npc-pick[data-object="rescue"]{width:56px}
.sunken-icon{background-image:url(assets/skills-gems-sb.png);background-size:300% 300%;background-position:calc(var(--col)*50%) calc(var(--row)*50%)}.sb-portrait{height:auto;aspect-ratio:5/7;background-image:url(assets/portraits-sb.png);background-size:600% auto;background-position:calc(var(--col)*20%) 0}.map-actor.object .sb-npc{width:102px;height:122px;background-image:url(assets/portraits-sb.png);background-size:600% 100%;background-position:calc(var(--col)*20%) 100%;border-radius:20px}.map-actor .sb-body{width:116px;height:148px;left:calc(50% - 58px);background-image:url(assets/enemies-sb.png);background-size:600% 100%;background-position:calc(var(--col)*20%) 100%}.module-walls{position:absolute;inset:0;z-index:2;width:100%;height:100%;pointer-events:none}.module-walls rect{fill:#5b5d50;stroke:#262e2a;stroke-width:1;filter:drop-shadow(0 1px 0 #151f1d)}.cell.low-bank{fill:#adc5ad20;stroke:#aecac075}.cell.bridge{fill:#c4a97655}.cell.shallow{fill:#3597c866;stroke:#93d5f0;stroke-width:2}.cell.trap-cell{fill:#f0c56877;stroke:#ffd987;stroke-width:3}.cell.threat{fill:#d2424260!important}.map-actor.enemy small{z-index:3;position:relative;background:#14241cf5;border:1px solid #847650;border-radius:3px;padding:2px 5px}.map-actor.enemy .health{z-index:3;position:relative}.module-walls rect{fill-opacity:.98}@media(max-width:1100px){.map-actor .sb-body{width:100px;height:128px;left:calc(50% - 50px)}}
.grid .cell.water{fill:url(#deep-water);stroke:#6f918f;stroke-width:5;stroke-dasharray:none}.grid .cell.bridge{fill:#aeb29b;stroke:#e6dec2;stroke-width:3}.grid .cell.low-bank{fill:#a9b09855;stroke:#c5caa285}.grid .cell.shallow{fill:#328cb69c;stroke:#c4e8f1;stroke-width:2}.grid .vault-wall{fill:url(#stone-wall);stroke:#283c30;stroke-width:5}.map-actor .sb-body{width:88px;height:154px;left:calc(50% - 44px);background-size:600% 115%;background-position:calc(var(--col)*20%) 0;bottom:-3px}.map-actor.enemy small,.map-actor.enemy .health{position:absolute;z-index:3}.module-walls rect{stroke-linejoin:round;stroke-width:.6}@media(max-width:1100px){.map-actor .sb-body{width:80px;height:140px;left:calc(50% - 40px)}}
.sb-enemy-icon{background-image:url(assets/enemies-sb.png);background-size:600% 115%;background-position:calc(var(--col)*20%) 0;height:64px;width:37px}

/* R1: material and local target readability; terrain geometry is unchanged. */
.grid .cell.water{stroke:#667c72;stroke-width:3;filter:drop-shadow(0 3px 2px #0c252baa)}.grid .cell.bridge{fill:url(#bridge-stone);stroke:#777e65;stroke-width:3;filter:drop-shadow(0 2px 2px #0a171d99)}.grid .cell.low-bank{fill:url(#bank-stone);stroke:#b4b99d88;stroke-width:1}.grid .cell.shallow{fill:#328cb69c;stroke:#c4e8f1;stroke-width:2}.module-walls .wall-ground{fill:#14241bb0;stroke:none;filter:blur(.45px)}.module-walls .wall-face{fill:url(#module-stone);stroke:#263c2d;stroke-width:.7;filter:drop-shadow(0 1px 0 #16231b)}.module-walls .wall-top{fill:none;stroke:#b0aa8b;stroke-width:.55;opacity:.8}.battle-board .map-actor[data-emphasis]{z-index:1900!important}.battle-board .map-actor[data-emphasis] small{outline:1px solid #ffdd91}.battle-board .map-actor[data-emphasis] .ground-shadow{outline:2px solid #ffdb87;background:#80733488}

.grid .vault-masonry{pointer-events:none;filter:drop-shadow(0 5px 3px #10241999)}.grid .vault-depth{fill:#364535;stroke:#223327;stroke-width:3}.grid .vault-wall{stroke:#89917a;stroke-width:3}

/* Repair1: cropped pixels from existing painted stone and water, with unchanged logical outlines. */
.grid .cell.low-bank{fill-opacity:.5}.grid .cell.bridge{stroke:#adb097;stroke-width:3}.module-walls .wall-face{filter:brightness(.8) drop-shadow(0 1px 0 #14261c);stroke:#374237}.module-walls .wall-top{stroke:#b4ae90}.grid .vault-wall{filter:brightness(.85);stroke:#837f67}

/* Furnace: measured atlas frames retain source aspect and align each foot baseline. */
.map-actor .fv-body,.fv-enemy-icon{background-image:url(assets/enemies-fv.png);background-repeat:no-repeat;bottom:0}.map-actor.object .fv-npc{background-image:url(assets/npcs-fv-v3.png);background-repeat:no-repeat;bottom:0}.fv-portrait{height:auto;aspect-ratio:2/3;background-image:url(assets/portraits-fv.png);background-size:400% 100%;background-position:calc(var(--col)*100%/3) 0;border-radius:10px}.furnace-icon{background-image:url(assets/skills-fv.png);background-size:300% 100%;background-position:calc(var(--col)*50%) 0}.cell.hot-slag{fill:#f2682459!important;stroke:#ffd16b!important;stroke-width:4}.cell.hot-slag:focus{stroke:#fff!important}.battle-board:has(.fv-body) .cell.wall{fill:transparent;stroke:#332a2470;stroke-width:2}.modal .item-row .toolbar{flex-wrap:wrap}.modal .item-row button{white-space:normal}.modal .item-row .description{min-width:160px}

/* Thunder Ridge atlases: measured frames retain source proportions and foot anchors. */
.map-actor.object .tr-npc{background-image:url(assets/npcs-tr.png);background-repeat:no-repeat;border-radius:0}
.tr-portrait{height:auto;aspect-ratio:2/3;background-image:url(assets/portraits-tr.png);background-size:300% 100%;background-position:calc(var(--col)*50%) 0;border-radius:10px}
.map-actor .tr-body,.tr-enemy-icon{background-image:url(assets/enemies-tr.png);background-repeat:no-repeat;bottom:0}

/* Keep the authored art, hex hit targets, actors, and effects on one plane. The
   battle-only apron contains full silhouettes at the legal upper rim. */
.battle-wrap{position:relative;overflow:visible;padding-top:80px;background:linear-gradient(#18251f,#27342a 80px)}
.battle-board{overflow:visible;width:min(100%,calc((100dvh - 365px)*var(--ratio)))}
@media(max-width:1500px){.battle-board .map-actor .sprite{scale:.8;transform-origin:center bottom}}
@media(max-width:1250px){.battle-board .map-actor .sprite{scale:.68}}
.grid .vault-masonry{filter:drop-shadow(0 9px 5px #101813cc)}
.grid .vault-side{fill:#293529;stroke:#a19b7f;stroke-width:2}
.grid .vault-depth{fill:#1c281f;stroke:#1c281f}
.grid .vault-wall{fill:url(#stone-wall);stroke:#d0c59e;stroke-width:3;filter:brightness(.8)}

.map-actor .rh-body,.rh-enemy-icon{background-image:url(assets/enemies-rh.png);background-repeat:no-repeat;bottom:0}
.map-actor.object .rh-npc{background-image:url(assets/npcs-rh.png);background-repeat:no-repeat;border-radius:0}
.rh-portrait{height:auto;aspect-ratio:3/4;background-image:url(assets/portraits-rh.png);background-size:200% 100%;background-position:calc(var(--col)*100%) 0}
.rh-king-portrait{height:auto;aspect-ratio:2/3;background-image:url(assets/portrait-rh-king.png);background-size:cover;background-position:center}
.rh-hero-portrait{background-size:600% auto;background-position:0 0;height:auto;aspect-ratio:2/3}
.rh-hero-portrait.hero-warrior{background-image:url(assets/hero-warrior-ui2.png)}
.rh-hero-portrait.hero-mage{background-image:url(assets/hero-mage-ui2.png)}
.rh-hero-portrait.hero-ranger{background-image:url(assets/hero-ranger-ui2.png)}

/* Journey UI1: each portrait displays one complete frame at its source ratio. */
.dialog-portrait{flex:0 0 auto;width:clamp(150px,17vw,230px);height:auto;aspect-ratio:1;background-color:#243a2c;border:1px solid #69785b;border-radius:12px;background-size:500% 200%;}
.dialog-portrait.rh-hero-portrait{aspect-ratio:1;background-size:300% 200%;background-position:0 0}
.dialog-portrait.sb-portrait{aspect-ratio:1/2;background-size:600% 100%;background-position:calc(var(--col)*100%/5) 0}
.dialog-portrait.fv-portrait{aspect-ratio:2/3;background-size:400% 100%}
.dialog-portrait.tr-portrait{aspect-ratio:1/2;background-size:300% 100%}
.dialog-portrait.rh-portrait{aspect-ratio:3/4;background-size:200% 100%}
.dialog-portrait.rh-king-portrait{aspect-ratio:2/3;background-size:contain;background-position:center}
.story-dialog{align-items:center;max-height:90dvh}.story-dialog .dialog-text{overflow-wrap:anywhere}
.object-state{display:block!important;position:static!important;transform:none!important;background:none!important;border:0!important;box-shadow:none!important;font-size:10px!important;color:#b7c9b4!important;padding:2px 0 0!important}
.state-done .object-icon{background:#20312abf;border-color:#6a8175;color:#bfd0c5}.state-locked .object-icon{background:#26312fc9;border-color:#718074;color:#a9b9ae}.state-pending .object-icon{border:2px solid #e6c575;color:#ffe0a1}.state-carrying .object-icon{border-color:#a7bfb3;color:#d1e4da}
.state-done .object-pick{border-color:#6a8175;color:#bfd0c5}.rest-status{line-height:1.6;color:#d6e5d2}.object-response{border-left:3px solid #d3bf84;padding:8px;background:#293b2a;line-height:1.6}.end-turn{width:100%;margin:0 0 10px;display:flex;align-items:center;justify-content:center;gap:8px;background:#4b5a32;border-color:#cbb16b;min-height:46px}.end-turn .sprite{width:30px;height:30px}
.grid .cell.move-reachable{fill:#a2c9b143;stroke:#b6dcc496;stroke-width:1.4}.grid .cell.move-reachable.threat{fill:#aa484e69;stroke:#d9edc2;stroke-width:2.5;stroke-dasharray:6 3}.grid .cell.move-reachable.route{fill:#baca7655;stroke:#f1edbe}.grid .cell.range.threat{stroke:#ff8e82;stroke-dasharray:6 3}
.journey-modal{width:min(1120px,95vw);max-width:1120px}.journey-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 18px}.journey-columns{display:grid;grid-template-columns:minmax(220px,32%) minmax(0,1fr);gap:22px}.task-list{border-right:1px solid #617158;padding-right:18px}.task-list h3{margin:10px 0}.task-choice{display:block;width:100%;text-align:left;margin:7px 0;white-space:normal;line-height:1.5}.task-choice small{display:block;color:#c8d5be;font-size:12px}.task-detail{min-width:0}.task-detail dl{display:grid;grid-template-columns:92px minmax(0,1fr);gap:12px}.task-detail dd{margin:0;line-height:1.7}.task-detail dt{color:#d7be86}.task-detail>button{margin:4px}.state-badge{display:inline-block;padding:4px 8px;border:1px solid #6c825e;border-radius:5px;color:#e6d69c}.known-evidence{margin-top:20px}.known-evidence article{border-top:1px solid #5e6d52;padding:10px 0}.map-nodes{display:flex;flex-wrap:wrap;gap:8px}.map-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.map-links p{border:1px solid #50654b;padding:10px;border-radius:6px}.map-links .locked{color:#c4c9bd;border-color:#7e8677}.story-directory{padding:10px 0;border-bottom:1px solid #50654b}.story-directory button{margin:5px;white-space:normal;text-align:left}.object.route-target .object-pick{outline:2px solid #f4da97}.object.route-target .object-icon{box-shadow:0 0 12px #f4da97}
@media(max-width:1100px){.dialog-portrait{width:165px}.journey-columns{grid-template-columns:240px minmax(0,1fr)}.story-dialog{padding:20px}}
@media(max-width:720px){.journey-columns{grid-template-columns:1fr}.task-list{border-right:0;border-bottom:1px solid #617158;padding:0 0 14px}.map-links{grid-template-columns:1fr}.dialog-portrait{width:130px}.task-detail dl{grid-template-columns:70px minmax(0,1fr)}}

.dialog-portrait.rh-hero-portrait.hero-ranger{aspect-ratio:512/468;background-size:300% 218.8034188%}

/* UX R1: one geometry for every story page; only the text region scrolls. */
.story-dialog .toolbar button:first-child{width:128px;flex:0 0 128px}.story-dialog .toolbar button:last-child{flex:1;min-width:0}
.story-backdrop{padding:12px}.story-dialog{display:grid;grid-template-columns:30% minmax(0,1fr);gap:24px;width:min(1040px,94vw);height:clamp(300px,44dvh,420px);max-height:calc(100dvh - 24px);padding:0;border:0;background:none;box-shadow:none;overflow:visible;align-items:stretch}
.portrait-region{min-width:0;position:relative;display:flex;align-items:flex-end;justify-content:center;height:100%}.story-dialog .dialog-portrait{border:0;border-radius:0;background-color:transparent;box-shadow:none;flex:none;max-width:100%;max-height:100%;margin:0}.story-dialog .ux-bust{background-image:url('assets/portraits-ui3.png');background-size:500% 200%;background-position:calc(var(--col)*25%) calc(var(--row)*100%);width:100%;height:auto;aspect-ratio:1}
.story-dialog .dialog-copy{min-width:0;min-height:0;display:grid;grid-template-rows:32px 24px minmax(0,1fr) 36px 44px;gap:4px;padding:20px 24px;background:#12271fec;border:1px solid #8b835b;border-radius:4px;overflow:hidden}.story-dialog .speaker-name{display:block;align-self:center;margin:0;padding:0;border:0;background:none;box-shadow:none;font-size:24px;line-height:32px}.story-title{font-size:14px;line-height:24px;color:#c7c2a5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.story-dialog .dialog-text{min-height:0;overflow:auto;margin:0;padding:4px 4px 4px 0;font-size:19px;line-height:1.65;overscroll-behavior:contain}.version-note{font-size:12px;line-height:18px;min-height:36px}.story-dialog .toolbar{margin:0;align-items:stretch;flex-wrap:nowrap;gap:10px}.story-dialog .toolbar button{margin:0;min-height:40px}.story-dialog.narration{grid-template-columns:30% minmax(0,1fr)}
@media(max-width:899px),(max-height:649px){.story-dialog,.story-dialog.narration{grid-template-columns:22% minmax(0,1fr);gap:12px;height:min(380px,calc(100dvh - 24px));width:94vw}.story-dialog .dialog-copy{padding:12px;grid-template-rows:28px 22px minmax(0,1fr) 36px 44px;gap:3px}.story-dialog .speaker-name{font-size:22px;line-height:28px}.story-dialog .dialog-text{font-size:18px}.story-dialog .toolbar{gap:6px}.story-dialog .toolbar button{padding:6px 8px;font-size:14px}}

/* Equipment panes scroll independently, preserving the close control. */
.story-dialog .ux-gardener{background:url('assets/portrait-gardener-bust-ux-r1.png') center bottom/contain no-repeat;width:92%;height:auto;aspect-ratio:1}
.story-dialog{grid-template-rows:minmax(0,1fr)}.portrait-region{min-height:0}.story-dialog .dialog-copy{height:100%;box-sizing:border-box}
/* Owner sample refinement: taller figures, shorter text panel, shared bottom edge. */
.story-dialog,.story-dialog.narration{grid-template-columns:34% minmax(0,1fr);gap:36px;height:clamp(340px,48dvh,460px)}.story-dialog .dialog-copy{height:clamp(240px,58%,270px);align-self:end;padding:16px 20px;grid-template-rows:28px 22px minmax(0,1fr) 36px 44px}.story-dialog .ux-bust{width:min(100%,clamp(340px,48dvh,460px));transform:scale(1.15);transform-origin:center bottom}.story-dialog .ux-gardener{width:min(92%,calc(clamp(340px,48dvh,460px)*.92));transform:scale(1.15);transform-origin:center bottom}
@media(max-width:899px),(max-height:649px){.story-dialog,.story-dialog.narration{grid-template-columns:22% minmax(0,1fr);gap:12px;height:min(380px,calc(100dvh - 24px))}.story-dialog .dialog-copy{height:100%;padding:12px;grid-template-rows:28px 22px minmax(0,1fr) 36px 44px}.story-dialog .ux-bust,.story-dialog .ux-gardener{transform:none}}
.story-dialog .ux-crop{width:min(100%,calc(clamp(340px,48dvh,460px)*var(--portrait-height)*var(--portrait-aspect)));height:auto;aspect-ratio:var(--portrait-aspect);transform:scale(1.15);transform-origin:center bottom;background-repeat:no-repeat}.story-dialog .ux-king{background:url('assets/portrait-king-ux-r1.png') center bottom/contain no-repeat;width:min(100%,calc(clamp(340px,48dvh,460px)*2/3));height:auto;aspect-ratio:2/3;transform:scale(1.08);transform-origin:center bottom}
@media(max-width:899px),(max-height:649px){.story-dialog .ux-crop,.story-dialog .ux-king{width:100%;transform:none}}
.equipment-modal{width:min(1280px,96vw);height:min(800px,94dvh);max-width:96vw;max-height:94dvh;display:flex;flex-direction:column;overflow:hidden;padding:18px;gap:10px}.equipment-modal>header{flex:none;padding:0}.equipment-modal>header h2{margin:0}.gear-summary{display:flex;align-items:center;justify-content:space-between;flex:none;gap:12px}.gear-summary .toolbar{margin:0}.gear-columns{display:grid;grid-template-columns:minmax(210px,.85fr) minmax(260px,1fr) minmax(330px,1.3fr);gap:16px;min-height:0;flex:1}.gear-columns>section{display:flex;flex-direction:column;min-width:0;min-height:0;border:1px solid #526044;padding:10px;border-radius:4px}.gear-columns h3{flex:none;margin:0 0 10px}.gear-scroll{overflow:auto;min-height:0;flex:1;overscroll-behavior:contain}.gear-card{display:flex;align-items:center;width:100%;text-align:left;gap:8px;margin:0 0 8px;padding:10px;min-height:72px;background:#162d22}.gear-card>span:last-child{min-width:0;display:block}.gear-card small{display:block}.gear-card.selected{border-color:#d8ba6b;background:#32452b;outline:1px solid #d8ba6b}.gear-slot{margin-bottom:8px}.gear-filters{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}.gear-filters label{font-size:13px;display:flex;flex-direction:column;min-width:75px}.gear-filters select{font:inherit;background:#142c20;color:#ece3c2;border:1px solid #647454;padding:6px;max-width:100%}.gear-compare{width:100%;border-collapse:collapse;font-size:14px;table-layout:fixed}.gear-compare th,.gear-compare td{border-bottom:1px solid #3d503c;text-align:right;padding:6px 2px;overflow-wrap:anywhere}.gear-compare th:first-child{text-align:left;width:35%}.gear-detail p{font-size:14px;line-height:1.6}.gear-action{margin:10px 0}.gear-action small{display:block;margin-top:4px}.equipment-modal>.toast{flex:none;margin:0;min-height:24px}
@media(max-width:1000px){.gear-columns{grid-template-columns:minmax(220px,1fr) minmax(280px,1.15fr);grid-template-rows:130px minmax(0,1fr)}.gear-columns>section:first-child{grid-column:1/-1}.gear-columns>section:first-child .gear-scroll{display:flex;gap:8px}.gear-slot{min-width:180px}.gear-summary{font-size:14px}.equipment-modal{padding:10px}}
@media(max-width:620px){.gear-columns{display:flex;flex-direction:column;overflow:auto}.gear-columns>section{flex:none;max-height:300px}.gear-columns>section:first-child{max-height:150px}.gear-detail{max-height:none!important}.gear-detail .gear-scroll{overflow:visible}.gear-summary{flex-wrap:wrap}.equipment-modal>header h2{font-size:20px}}

.grid .cell.support-cell{stroke:#63cfb8;stroke-width:2;stroke-dasharray:4 4}.grid .cell.settle-cell{stroke:#e5d185;stroke-width:4;stroke-dasharray:10 5}

/* UX2: local presentation, stable class-card baselines and reachable gear operations. */
.intro .class-card{grid-template-rows:140px 24px minmax(46px,1fr);align-content:start;align-items:start}
/* The next row's attack bow starts at source y=470, inside the 512px idle tile. */
.hero-ranger[data-frame="0"],.hero-ranger[data-frame="1"],.hero-ranger[data-frame="2"]{clip-path:inset(0 0 8.5% 0)}
.map-actor .unit-hp{position:absolute;top:43px;left:50%;transform:translateX(-50%);font-size:11px;background:#102016e8;color:#fff0d5;padding:0 4px;border-radius:2px;white-space:nowrap}
.recent-action{border-left:2px solid #d6b878;padding:6px 8px;margin:12px 0;background:#202f22;font-size:13px;overflow-wrap:anywhere}.recent-action p{margin:4px 0 0}.key-help{font-size:12px;color:#d9cb9c;margin-top:10px}
.gear-detail>.gear-scroll{display:flex;flex-direction:column;overflow:hidden}.gear-reading{overflow:auto;flex:1;min-height:0;overscroll-behavior:contain}.gear-operations{flex:none;display:flex;flex-wrap:wrap;gap:6px;border-top:1px solid #647454;padding-top:8px;background:#17291e}.gear-operations .gear-action{margin:0;flex:1;min-width:110px}.gear-operations button{width:100%}.gear-operations small{max-height:64px;overflow:auto}.gear-price{color:#efc16b!important}.gear-reading select{font:inherit;background:#142c20;color:#ece3c2;border:1px solid #647454;padding:6px;max-width:100%}
@media(max-width:620px){.gear-detail>.gear-scroll{overflow:visible}.gear-reading{overflow:visible}.gear-operations{position:sticky;bottom:0}}