:root{color-scheme:light;font-family:HarmonyOS Sans SC,Noto Sans SC,PingFang SC,Microsoft YaHei,sans-serif;--forest: #237a57;--leaf: #56b870;--teal: #0e8f8f;--amber: #f4a62a;--coral: #e85d4f;--sky: #e7f7ff;--mint: #e9faef;--cream: #fff8e8;--paper: #ffffff;--ink: #24302f;--muted: #66716f;--border: #dde7e3;--line: #9aa7a2;--shadow: 0 16px 40px rgba(36, 48, 47, .12);--soft-shadow: 0 8px 22px rgba(36, 48, 47, .1)}*{box-sizing:border-box}html{background:linear-gradient(180deg,#f7fcfb,#eef8f0 48%,#fff8e8)}body{margin:0;color:var(--ink);min-width:320px}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}img{display:block;max-width:100%}.app{min-height:100vh}.topbar{position:sticky;top:0;z-index:10;display:grid;grid-template-columns:minmax(220px,1fr) auto minmax(160px,1fr);align-items:center;gap:20px;padding:14px 28px;border-bottom:1px solid rgba(221,231,227,.9);background:#ffffffeb;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.brand{display:inline-flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none}.brand-mark{display:grid;width:42px;height:42px;place-items:center;color:#fff;background:var(--forest);border-radius:50%;box-shadow:inset 0 -3px #00000029}.brand strong{display:block;font-size:17px;line-height:1.2}.brand small{display:block;color:var(--muted);font-size:12px;line-height:1.5}.level-tabs{display:flex;gap:8px;padding:5px;border:1px solid var(--border);border-radius:999px;background:#f8fbfa}.tab{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:0 16px;color:var(--muted);border:0;border-radius:999px;background:transparent;font-size:14px;font-weight:700}.tab.is-active{color:#fff;background:var(--teal);box-shadow:inset 0 -2px #0000002e}.top-actions{display:inline-flex;align-items:center;justify-self:end;gap:10px}.progress-pill{display:inline-flex;align-items:center;min-height:34px;padding:0 14px;border:1px solid #d9ead1;border-radius:999px;background:var(--mint);color:var(--forest);font-size:13px;font-weight:800;white-space:nowrap}.icon-button{display:grid;width:38px;height:38px;place-items:center;color:var(--ink);border:1px solid var(--border);border-radius:50%;background:var(--paper)}main{width:min(1420px,calc(100% - 40px));margin:0 auto;padding:28px 0 56px}.level-grid{display:grid;grid-template-columns:minmax(330px,410px) minmax(0,1fr);gap:22px;align-items:start}.left-rail,.play-surface{display:grid;gap:16px}.mission-panel,.model-panel,.choice-panel,.feedback-panel,.charge-panel,.reference-image{border:1px solid var(--border);border-radius:8px;background:#fffffff0;box-shadow:var(--soft-shadow)}.mission-panel{padding:24px;background:linear-gradient(135deg,var(--paper),var(--sky))}.level-number{display:inline-flex;min-height:28px;align-items:center;padding:0 11px;border-radius:999px;background:var(--amber);color:#35250a;font-size:13px;font-weight:900}h1,h2,h3,p{margin:0}h1{margin-top:14px;font-size:34px;line-height:1.16}h2{font-size:21px;line-height:1.3}h3{font-size:17px;line-height:1.35}.subtitle{margin-top:8px;color:var(--teal);font-weight:800}.mission-panel p:last-child{margin-top:14px;color:var(--muted)}.model-panel,.choice-panel,.charge-panel{padding:18px}.model-panel h3{display:flex;align-items:center;gap:8px}.model-panel ul{display:grid;gap:9px;margin:14px 0 0;padding:0;list-style:none}.model-panel li{position:relative;padding-left:18px;color:#3d4947;font-size:14px;line-height:1.6}.model-panel li:before{position:absolute;top:.72em;left:0;width:7px;height:7px;border-radius:50%;background:var(--leaf);content:""}.choice-panel h2{margin-bottom:12px}.route-options{display:grid;gap:10px}.route-option{display:grid;gap:7px;width:100%;padding:14px;color:var(--ink);text-align:left;border:1px solid var(--border);border-radius:8px;background:#fff;transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease}.route-option:hover{transform:translateY(-1px);border-color:#0e8f8f80;box-shadow:0 10px 24px #0e8f8f1f}.route-option.is-selected{border-color:var(--teal);background:#effbfa}.route-option-title{display:inline-flex;align-items:center;gap:8px;color:var(--teal);font-weight:900}.route-path{color:var(--ink);font-size:14px;line-height:1.55}.route-meta{color:var(--muted);font-size:13px;line-height:1.45}.map-shell{position:relative;overflow:hidden;min-height:520px;border:1px solid var(--border);border-radius:8px;background:#f7fcfb;box-shadow:var(--shadow)}.map-shell-forest{background:radial-gradient(circle at 18% 20%,rgba(244,166,42,.18),transparent 22%),radial-gradient(circle at 75% 76%,rgba(232,93,79,.12),transparent 20%),linear-gradient(135deg,#edf9ed,#e6f7ff 52%,#fff8e8)}.map-shell-ev{background:linear-gradient(0deg,#0e8f8f0f,#0e8f8f0f),#fff}.map-shell svg{width:100%;height:520px;display:block}.map-edge{stroke:var(--line);stroke-width:.8;stroke-linecap:round}.map-edge.is-selected{stroke:var(--amber);stroke-width:2.5}.edge-label{fill:#4c5754;font-size:3px;font-weight:900;paint-order:stroke;stroke:#ffffffdb;stroke-width:.8px;text-anchor:middle}.edge-label.is-selected{fill:#6d4300}.map-hit-path{fill:none;stroke:transparent;stroke-width:8;stroke-linecap:round;cursor:pointer}.map-node circle{fill:#fff;stroke:var(--forest);stroke-width:.7}.map-node.is-start circle{fill:var(--cream);stroke:var(--amber)}.map-node.is-goal circle{fill:#ffefed;stroke:var(--coral)}.map-node.is-station circle{fill:#ddf8ef;stroke:var(--teal)}.map-node text{fill:var(--ink);font-size:2.5px;font-weight:900;text-anchor:middle;dominant-baseline:middle;pointer-events:none}.map-node .node-sub-label{fill:var(--muted);font-size:2px;font-weight:800}.map-help{position:absolute;right:16px;bottom:14px;padding:7px 10px;border-radius:999px;background:#ffffffdb;color:var(--muted);font-size:12px;font-weight:800}.feedback-panel{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(250px,.8fr) auto;gap:16px;align-items:center;padding:18px;border-left-width:6px}.feedback-panel p{margin-top:6px;color:var(--muted)}.tone-idle{border-left-color:var(--teal)}.tone-success{border-left-color:var(--forest);background:linear-gradient(90deg,#e9faefe6,#fffffff5)}.tone-warning{border-left-color:var(--amber);background:linear-gradient(90deg,#fff8e8f2,#fffffff5)}.tone-danger{border-left-color:var(--coral);background:linear-gradient(90deg,#ffefedf2,#fffffff5)}.calc-box{display:grid;gap:6px;min-width:0;padding:12px;border:1px solid var(--border);border-radius:8px;background:#fff}.calc-box strong{overflow-wrap:anywhere}.calc-label{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:13px;font-weight:900}.primary-action{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border:0;border-radius:999px;color:#fff;background:var(--forest);font-weight:900;white-space:nowrap;box-shadow:inset 0 -3px #0000002e}.charge-panel{display:grid;gap:16px;background:linear-gradient(135deg,#fff,#f1fbfa)}.charge-panel p{margin-top:6px;color:var(--muted)}.slider-row{display:grid;grid-template-columns:72px minmax(160px,1fr) 96px;gap:12px;align-items:center}.slider-row label,.slider-row output{font-weight:900}.slider-row output{text-align:right}input[type=range]{accent-color:var(--teal)}.quick-actions{display:flex;flex-wrap:wrap;gap:10px}.quick-actions button{min-height:38px;padding:0 14px;border:1px solid var(--border);border-radius:999px;background:#fff;color:var(--ink);font-size:14px;font-weight:900}.quick-actions button:hover{border-color:var(--teal)}.ev-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.metric{display:grid;gap:4px;min-height:74px;align-content:center;padding:10px;border:1px solid var(--border);border-radius:8px;background:#fff}.metric span{color:var(--muted);font-size:12px;font-weight:800}.metric strong{color:var(--ink);font-size:18px;line-height:1.15}.metric.is-strong{border-color:#f4a62a99;background:var(--cream)}.reference-image{padding:0;overflow:hidden}.reference-image summary{display:flex;align-items:center;gap:8px;min-height:48px;padding:0 16px;color:var(--teal);font-weight:900;cursor:pointer}.reference-image figure{margin:0;padding:0 16px 16px}.reference-image img{width:100%;max-height:520px;object-fit:contain;border:1px solid var(--border);border-radius:8px;background:#fff}.reference-image figcaption{margin-top:8px;color:var(--muted);font-size:13px}@media(max-width:1160px){.topbar{grid-template-columns:1fr;justify-items:stretch}.level-tabs,.top-actions{justify-self:start}.level-grid{grid-template-columns:1fr}.left-rail{grid-template-columns:1fr 1fr}.mission-panel{grid-column:1 / -1}}@media(max-width:760px){.topbar{padding:12px 14px;gap:12px}.brand small{display:none}.level-tabs{width:100%}.tab{flex:1;justify-content:center;padding:0 10px}main{width:min(100% - 24px,640px);padding-top:16px}h1{font-size:28px}.left-rail{grid-template-columns:1fr}.mission-panel,.model-panel,.choice-panel,.feedback-panel,.charge-panel{padding:15px}.map-shell{min-height:390px}.map-shell svg{height:390px}.map-help{position:static;margin:0 12px 12px;display:inline-flex}.feedback-panel,.slider-row{grid-template-columns:1fr}.slider-row output{text-align:left}.ev-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:460px){.brand-mark{width:38px;height:38px}.brand strong{font-size:15px}.progress-pill{font-size:12px}.route-option{padding:12px}.ev-stats{grid-template-columns:1fr}.map-node text{font-size:2.2px}.map-node .node-sub-label{font-size:1.8px}}
