:root{font-family:system-ui,"Microsoft YaHei",sans-serif;color:#173c47;background:#edf3ef;font-synthesis:none;--teal:#276e69;--line:#d7e3dc}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 20% 0%,#e0efed,transparent 65%)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:1px solid var(--line);border-radius:12px;background:#fffdf8;padding:11px 18px;color:inherit;font-weight:650}button:hover{border-color:#5b9b8c;background:#f0f8f2}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #e9b95f;outline-offset:3px}button:disabled{cursor:default;opacity:.55}a{color:inherit;text-decoration:none}.topbar{max-width:1640px;margin:auto;padding:22px 30px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:12px;font-size:23px;font-weight:800}.brand img{width:54px;height:54px;object-fit:contain}.brand small{display:block;font-size:12px;font-weight:450;color:#69827f;margin-top:3px}nav{display:flex;gap:9px;align-items:center}nav a{font-size:13px;padding:9px}.layout{max-width:1640px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:22px;padding:0 30px 30px}.game-panel{padding:18px;border:1px solid var(--line);background:#fffdf7;border-radius:24px;min-width:0;box-shadow:0 16px 40px #284b4220;align-self:start}.hud{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:0 6px 15px}.hud div{border-right:1px solid var(--line)}.hud div:last-child{border:0}.hud small{display:block;font-size:11px;color:#738780;letter-spacing:.06em}.hud strong{font-size:24px;line-height:1.6;font-variant-numeric:tabular-nums}.vitals{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:16px}.vitals span{display:block;font-size:11px;color:#648178;margin-bottom:6px}.meter{height:7px;background:#e5e9df;border-radius:20px;overflow:hidden}.meter i{display:block;height:100%;width:100%;background:#68a58c;border-radius:20px}.xp i{background:#dea94d;width:0}.stage{position:relative;width:100%;height:clamp(430px,65vh,760px);border-radius:16px;overflow:hidden;background:#153b45;isolation:isolate}canvas{display:block;width:100%;height:100%;touch-action:none;outline:none}.notice{position:absolute;pointer-events:none;top:16px;left:50%;transform:translateX(-50%);background:#fff9e4e8;color:#335752;border:1px solid #d4c89b;border-radius:30px;padding:8px 16px;font-size:13px;max-width:90%;text-align:center;opacity:0;transition:opacity .15s}.notice.visible{opacity:1}.overlay{position:absolute;inset:0;display:grid;place-items:center;padding:24px;background:#153b45ba;overflow:auto;backdrop-filter:blur(3px)}.overlay[hidden]{display:none}.overlay-content{width:100%;max-width:720px;background:#fffdf7;border:1px solid #e0e6d8;border-radius:22px;padding:28px;text-align:center;box-shadow:0 15px 50px #07272c55}.eyebrow{font-size:10px;letter-spacing:.15em;color:#7d8b70;font-weight:700}.overlay h1{margin:12px 0;font-size:30px;letter-spacing:-.035em}.overlay p{font-size:14px;line-height:1.8;color:#667e77;margin:12px 0 22px}.choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.choice{text-align:left;padding:17px 13px;min-width:0;background:#f3f6ed;border-color:#d9e2d2;border-radius:14px}.choice .symbol{font-size:24px;display:block;margin-bottom:13px}.choice strong{display:block;font-size:16px;margin-bottom:9px}.choice small{display:block;font-size:12px;line-height:1.65;color:#647c70;font-weight:400}.choices.single{display:flex;justify-content:center}.choices.single button{min-width:180px;background:#276e69;color:#fff;padding:14px 24px}.controlbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:14px}.controlbar>span{font-size:11px;color:#71867c}.controlbar button{background:#eaf1e3;border-color:#b6cfb1;min-width:160px;touch-action:none;user-select:none}.controlbar small{font-size:10px;margin-left:10px;color:#637e66}kbd{font:inherit;background:#eef2e9;border-radius:4px;padding:2px 4px}aside{display:flex;flex-direction:column;gap:16px;min-width:0}.card{padding:23px;background:#fdfcf6;border:1px solid var(--line);border-radius:20px}.card h2{font-size:21px;letter-spacing:-.03em;margin:12px 0}.card p{font-size:13px;line-height:1.8;color:#698077}.character{background:linear-gradient(150deg,#fbfbef,#deeeea)}.character img{width:120px;height:120px;object-fit:contain;display:block;margin:16px auto 0;filter:drop-shadow(0 9px 5px #27574922)}.tags{display:flex;gap:6px;flex-wrap:wrap}.tags span{font-size:10px;border:1px solid #b8d2c5;border-radius:20px;padding:5px 9px;color:#44735d}.build p{margin:0}.build-line{font-size:12px;display:flex;justify-content:space-between;border-bottom:1px solid #e6ebdf;padding:9px 0;gap:8px}.round-dots{display:grid;grid-template-columns:repeat(10,1fr);gap:5px;margin-top:18px}.round-dots i{height:8px;background:#e2e9dd;border-radius:3px}.round-dots i.done{background:#a9c4a2}.round-dots i.current{background:#d8aa53}.footnote{font-size:11px;line-height:1.8;color:#819188;margin:0 8px}.stick{position:absolute;width:88px;height:88px;border:2px solid #ffffff77;border-radius:50%;background:#123b4333;pointer-events:none}.stick[hidden]{display:none}.stick i{display:block;width:34px;height:34px;border-radius:50%;background:#d6eede99;position:absolute;left:25px;top:25px}@media(min-width:1700px){.layout{grid-template-columns:minmax(0,1fr) 340px}}@media(max-width:1000px){.layout{grid-template-columns:minmax(0,1fr) 260px;padding:0 18px 24px;gap:14px}.topbar{padding:16px 20px}.card{padding:18px}.choices{gap:8px}.choice{padding:12px 10px}}@media(max-width:740px){.topbar{padding:12px;gap:8px;align-items:start}.brand{font-size:18px;gap:5px}.brand img{width:38px;height:38px}.brand small{font-size:10px}nav{gap:5px;flex-wrap:wrap;justify-content:flex-end;max-width:160px}nav a{font-size:10px;padding:2px 5px}nav button{font-size:11px;padding:6px 9px}.layout{display:block;padding:0 8px 18px}.game-panel{padding:11px;border-radius:18px}.hud{padding:0 0 9px;gap:7px}.hud strong{font-size:18px}.hud small{font-size:9px}.vitals{margin-bottom:10px;gap:10px}.stage{height:clamp(390px,63svh,690px);border-radius:11px}.controlbar>span{max-width:170px;font-size:10px}.controlbar button{min-width:124px;padding:12px 9px}.controlbar small{display:block;margin:3px 0 0}.overlay{padding:12px}.overlay-content{padding:18px 13px}.overlay h1{font-size:25px}.overlay p{font-size:12px;margin:9px 0 15px}.choices{grid-template-columns:1fr;gap:7px}.choice{display:grid;grid-template-columns:34px 1fr;padding:11px;column-gap:9px}.choice .symbol{grid-row:1/3;margin:0;align-self:center}.choice strong{font-size:14px;margin-bottom:4px}.choice small{font-size:11px}.notice{font-size:11px;padding:7px 10px}aside{display:grid;grid-template-columns:1fr 1fr;margin-top:12px;gap:10px}.card{padding:15px}.card h2{font-size:17px}.card p{font-size:11px}.character{display:none}.footnote{grid-column:1/-1}.round-dots{gap:3px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.controlbar .item-slot{min-width:140px;background:#fff6df;border-color:#e6d2a0;display:grid;grid-template-columns:22px 1fr;text-align:left;gap:1px 6px;padding:9px 12px}.item-slot kbd{grid-row:1/3;align-self:center;text-align:center;background:#f0dfb8}.item-slot b{font-size:11px;font-weight:600}.controlbar .item-slot small{grid-column:2;font-size:10px;margin:0}.controlbar .item-slot:disabled{opacity:.65}@media(max-width:740px){.controlbar{flex-wrap:wrap}.controlbar>span{flex:0 0 100%;max-width:none}.controlbar .item-slot,.controlbar #skill{flex:1;min-width:0}.controlbar .item-slot small{display:block}}


.metabolic{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font-size:10px;color:#658278;margin:-4px 0 11px}.metabolic span:first-child{font-weight:750;color:#547f6c}.focus-tools{display:none;position:absolute;right:10px;top:10px;gap:6px;z-index:4;align-items:center}.focus-tools button,.focus-tools a{font-size:11px;padding:7px 10px;background:#fffcf1e8;border:1px solid #c9dacf;border-radius:10px;color:#265b53}.focus-mode{overflow:hidden}.focus-mode .topbar,.focus-mode aside{display:none}.focus-mode .layout{padding:0;display:block;max-width:none}.focus-mode .game-panel{position:fixed;inset:0;z-index:10;border:0;border-radius:0;height:100dvh;display:flex;flex-direction:column;padding: max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));box-shadow:none}.focus-mode .hud{flex:none;padding-bottom:6px}.focus-mode .hud strong{font-size:20px}.focus-mode .vitals{flex:none;margin-bottom:10px}.focus-mode .metabolic{flex:none;margin-bottom:8px}.focus-mode .stage{flex:1;min-height:130px;height:auto}.focus-mode .controlbar{flex:none;padding-top:8px}.focus-mode .focus-tools{display:flex}.focus-mode .notice{top:50px}.focus-mode .overlay{padding-top:50px}@media(max-width:740px){.metabolic{font-size:9px;gap:4px}.metabolic span:last-child{display:none}.focus-mode .game-panel{padding-left:max(7px,env(safe-area-inset-left));padding-right:max(7px,env(safe-area-inset-right))}.focus-mode .hud strong{font-size:17px}.focus-tools button,.focus-tools a{font-size:10px;padding:6px 8px}.focus-mode .overlay-content{max-height:100%;overflow:auto}.focus-mode .controlbar>span{display:none}.focus-mode .vitals span{font-size:10px}.focus-mode .controlbar button{padding:9px}.focus-mode .metabolic{margin-bottom:7px}}


.choice .loot-reward{width:44px;height:44px;background-image:url(./loot-sheet.png);background-size:300% 200%;background-position:100% 100%;background-repeat:no-repeat}@media(max-width:740px){.choice .loot-reward{width:32px;height:32px}}


.hero-resource{margin-bottom:12px}.hero-resource>span{display:block;font-size:11px;color:#8b7344;margin-bottom:5px}.resource i{background:#c4a35a;width:0}.hero-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:15px 0 20px}.hero-picker[hidden]{display:none}.hero-option{text-align:left;padding:12px 9px;border:1px solid #cfdbcc;background:#f4f6ee}.hero-option strong{display:block;font-size:13px}.hero-option small{display:block;font-weight:400;font-size:10px;line-height:1.5;margin-top:5px;color:#7c8976}.hero-option[aria-pressed=true]{border-color:#448b76;background:#e1eee2;box-shadow:inset 0 0 0 1px #448b76}.focus-mode .hero-resource{margin-bottom:8px;flex:none}.focus-mode .hero-resource>span{font-size:10px}.focus-mode .hero-resource .meter{height:5px}@media(max-width:740px){.hero-picker{grid-template-columns:1fr 1fr;gap:6px;margin:10px 0 14px}.hero-option{padding:9px}.hero-option small{font-size:9px}.hero-resource{margin-bottom:9px}}
.rarity-badge{display:block;grid-column:1/-1;font-size:11px;font-weight:800;margin-bottom:8px;text-shadow:0 0 1px #344}.choice[data-rarity=legendary]{background:#fff3d1}.choice[data-rarity=epic]{background:#f5eaff}.choice[data-rarity=rare]{background:#e9f6ff}.pause-stats{text-align:left}.pause-stats[hidden]{display:none}.pause-stats h2{font-size:17px;margin:12px 0}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0}.stats-grid>div{background:#edf3e9;padding:9px;border-radius:8px}.stats-grid dt{font-size:10px;color:#6b8076}.stats-grid dd{margin:5px 0 0;font-size:14px;font-weight:750}.pause-stats p{font-size:11px;line-height:1.8;margin:12px 0}.overlay-content{max-height:100%;overflow:auto}.build{max-height:340px;overflow:auto}@media(max-width:740px){.stats-grid{grid-template-columns:1fr 1fr}.stats-grid>div{padding:7px}.stats-grid dd{font-size:12px}.rarity-badge{margin:0}.focus-tools{gap:4px}.focus-tools button,.focus-tools a{padding:6px;font-size:9px}}
#difficulty-picker{display:block;font-size:13px;margin:10px}#difficulty-picker[hidden]{display:none}select{font:inherit;padding:7px;border-radius:8px;background:#f3f6ed;border:1px solid #b8cdbd}.cloud-save-dialog{max-width:min(680px,95vw);max-height:90dvh;overflow:auto;background:#fffdf7;border:1px solid #cbd9cc;border-radius:20px;padding:22px;color:#173c47}.cloud-save-dialog::backdrop{background:#12343aaa}.cloud-save-row{border-top:1px solid #dbe5d8;padding:13px 0}.cloud-save-row button{margin:4px;font-size:12px;padding:8px}.cloud-save-dialog p{font-size:12px;line-height:1.7}.focus-tools{max-width:calc(100% - 130px);flex-wrap:wrap;justify-content:flex-end}.topbar nav{flex-wrap:wrap;justify-content:flex-end}@media(max-width:740px){.focus-tools{max-width:calc(100% - 85px);gap:3px}.focus-tools button,.focus-tools a{padding:5px;font-size:9px}.topbar nav{max-width:200px}}
#secondary-skill{background:#e8edf8;border-color:#becbe3}#secondary-skill:disabled{opacity:.55}.hero-picker{grid-template-columns:repeat(4,minmax(0,1fr));max-height:32vh;overflow:auto;overscroll-behavior:contain;padding:2px}.hero-option{min-width:0}.hero-option strong,.hero-option small{overflow-wrap:anywhere}@media(max-width:740px){.hero-picker{grid-template-columns:repeat(2,minmax(0,1fr));max-height:30vh}.controlbar #secondary-skill{flex:1;min-width:0;padding:9px 6px}.controlbar #secondary-skill span,.controlbar #skill span{font-size:11px}.controlbar #secondary-skill small,.controlbar #skill small{font-size:9px}}
#shop-open,#focus-shop{background:#f8edcf;border-color:#ddc991}.survivor-shop-dialog{width:min(780px,96vw)}.shop-status{min-height:1.5em}.shop-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.shop-item,.shop-delivery{min-width:0;padding:14px;border:1px solid #d8e1d2;border-radius:13px;background:#f8f8ef}.shop-item h3,.shop-deliveries h3{margin:0 0 8px;font-size:15px}.shop-item p,.shop-delivery p{margin:6px 0;font-size:12px}.shop-item small,.shop-delivery small{display:block;font-size:11px;line-height:1.55;color:#718078;min-height:2.8em}.shop-item button,.shop-delivery button{margin-top:9px;font-size:12px;padding:8px 11px}.shop-item button:disabled,.shop-delivery button:disabled{opacity:.5}.shop-deliveries{margin:12px 0}.shop-delivery{margin:8px 0}.shop-deliveries>a{display:inline-block;margin:8px 0}.footnote a{text-decoration:underline;text-underline-offset:2px;color:#276e69}@media(max-width:740px){.survivor-shop-dialog{padding:15px 12px}.shop-items{grid-template-columns:1fr;gap:7px}.shop-item{padding:10px}.shop-item small{min-height:0}.shop-item button{width:100%}.focus-tools #focus-shop{font-size:9px}}
.map-strip{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 12px;color:#567d73;font-size:11px}.map-strip strong{color:#285d60;font-size:13px}.map-strip small{margin-left:auto;font-size:10px}.map-route{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:12px 0}.map-stop{border:1px solid #d6e1d6;border-radius:9px;padding:10px;background:#eff3e9;opacity:.65}.map-stop strong,.map-stop small{display:block;font-size:11px}.map-stop small{font-size:10px;margin-top:4px}.map-stop.current{opacity:1;border-color:#6da18c;background:#e0eee3}.scene-legend{font-size:11px!important;line-height:1.8}.round-dots{flex-wrap:wrap}.focus-mode .map-strip{flex:none;margin-bottom:6px}.focus-mode .map-strip small{display:none}@media(max-width:740px){.map-strip{gap:7px;margin-bottom:7px;font-size:10px}.map-strip strong{font-size:11px}.map-strip small{display:none}.map-stop{padding:8px}.map-stop strong{font-size:10px}}