:root{color-scheme:dark;--ink:#f6f4e6;--muted:#c4d9d0;--gold:#ffce72;--night:#102e32;--line:#557974}*{box-sizing:border-box}body{margin:0;background:#081e23;color:var(--ink);font:17px/1.6 Arial,sans-serif}#app{max-width:1240px;margin:auto;padding:24px}a{color:var(--gold)}button,a.button{font:inherit;font-weight:700;border:2px solid var(--gold);border-radius:10px;padding:12px 20px;min-height:48px;color:#10292c;background:var(--gold);cursor:pointer;display:inline-block;text-decoration:none}button:disabled{cursor:default;background:#263e41;color:#b7c9c4;border-color:#59716e}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline:4px solid #fff;outline-offset:4px}h1,h2,h3{line-height:1.15;color:var(--ink);letter-spacing:normal}h1{font-size:clamp(28px,4vw,48px);margin:14px 0}h2{font-size:clamp(24px,3vw,34px)}p{margin:12px 0}.eyebrow{text-transform:uppercase;letter-spacing:.14em;color:var(--gold);font-size:13px;font-weight:bold}.breadcrumbs{font-size:14px;display:flex;flex-wrap:wrap;gap:14px}.lead{color:var(--muted);font-size:19px}.hero{display:grid;grid-template-columns:1fr 185px;gap:24px;align-items:center}.portrait{width:100%;max-width:185px;border-radius:16px;box-shadow:0 12px 35px #0006}.panel{padding:clamp(18px,3vw,34px);border:1px solid var(--line);border-radius:18px;background:linear-gradient(125deg,#173b3d,#0c272e);margin:22px 0}.story{max-width:78ch}.map{position:relative;width:100%;aspect-ratio:1672/941;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#173b3d}.map>img{width:100%;height:100%;object-fit:contain;display:block}.map svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.map polyline{fill:none;stroke:#102c31;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}.map polyline.top{stroke:#ffdb83;stroke-width:.45;stroke-dasharray:1 1}.node{position:absolute;transform:translate(-50%,-50%);min-width:40px;min-height:40px;padding:4px 8px;border-radius:50%;font-size:16px;box-shadow:0 2px 8px #000a}.node.current{outline:3px solid white;outline-offset:3px}.node.done{background:#daefce;color:#183e28;border-color:#daefce}.map-list{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:0;list-style:none;counter-reset:stops;margin:14px 0}.map-list li{background:#16383b;padding:12px;border-radius:10px;border:1px solid var(--line);font-size:14px}.map-list strong,.map-list small{display:block}.map-list .current{border:2px solid var(--gold)}.map-list .tag{font-size:12px;color:var(--gold)}.stagebar{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--gold);font-weight:700}.guide-note{border-left:4px solid var(--gold);padding-left:20px}.choices{display:grid;gap:12px;border:0;padding:0;margin:24px 0}.choices label{display:flex;gap:14px;align-items:center;border:2px solid #73938a;border-radius:12px;padding:16px;cursor:pointer;background:#102e32}.choices label:has(input:checked){border-color:var(--gold);background:#254847}.choices input{width:22px;height:22px;accent-color:#ffcc70;flex-shrink:0}.choices legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.feedback{padding:18px;border-radius:10px;border:2px solid var(--gold);margin:18px 0;background:#263f30}.feedback.wrong{background:#3f3422}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}.muted{color:var(--muted);font-size:14px}.progress{height:9px;background:#42605c;border-radius:10px;overflow:hidden;margin-top:15px}.progress span{display:block;height:100%;background:var(--gold)}.smallmap summary{cursor:pointer;color:var(--gold);font-weight:700;padding:10px 0}.teaching{display:grid;gap:14px}.teaching p{margin:0}.win{position:relative;border-color:var(--gold);background:radial-gradient(ellipse at top,#496135,#102e32 70%);animation:glow 1s ease-out}.win .eyebrow{font-size:16px}.footer{padding:24px 0;border-top:1px solid var(--line);margin-top:32px}.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card-grid article{padding:20px;border:1px solid var(--line);border-radius:16px;background:#143438}.card-grid img{width:100%;aspect-ratio:1672/941;object-fit:contain;border-radius:10px}.card-grid h2{font-size:23px}.storage{padding:10px 14px;background:#463b22;border-radius:8px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@keyframes glow{from{box-shadow:0 0 0 #ffce7200}50%{box-shadow:0 0 45px #ffce7255}to{box-shadow:0 0 0 #ffce7200}}@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}@media(max-width:700px){#app{padding:14px}.hero{grid-template-columns:1fr 95px;gap:12px}.map-list{grid-template-columns:1fr 1fr}.card-grid{grid-template-columns:1fr}.node{min-width:28px;min-height:28px;font-size:12px;padding:0;border-width:2px}.lead{font-size:16px}.panel{padding:18px}.map-list li{font-size:12px}.actions>*{width:100%;text-align:center}} 
.hero>div{min-width:0}h1{overflow-wrap:anywhere}
.player-toolbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:10px 0;background:#081e23;border-bottom:1px solid var(--line)}.player-toolbar button{padding:8px 14px;min-height:44px}.player-toolbar span{margin-left:auto;color:var(--muted);font-size:14px}.playing .hero{display:block}.playing .hero h1{font-size:20px;margin:10px 0}.playing .hero .portrait,.playing .hero .eyebrow,.playing .hero .lead,.playing .breadcrumbs{display:none}.playing .panel{margin:14px 0;padding:22px}.playing h2{font-size:26px;margin:12px 0}.playing .choices{margin:16px 0;gap:10px}.playing .choices label{padding:12px}.map-list li{padding:0}.map-list .destination{display:block;width:100%;height:100%;text-align:left;color:var(--ink);background:#16383b;border:0;font-size:14px;padding:12px}.map-list .destination small{font-weight:400}.checkmark{position:absolute;right:-6px;top:-10px;font-size:16px;background:#daefce;border-radius:50%;color:#183e28}.map-heading h2{margin-bottom:8px}.map-heading p{margin-top:0}.node{min-width:44px;min-height:44px}.hero>div{min-width:0}@media(max-width:700px){.hero{grid-template-columns:minmax(0,1fr) 72px}.hero h1{font-size:23px}.playing .hero h1{font-size:18px}.playing .panel{padding:16px}.playing h2{font-size:22px}.player-toolbar{gap:6px}.player-toolbar button{font-size:14px;padding:8px 10px}.player-toolbar span{font-size:12px}.node{min-width:32px;min-height:32px}.map-list .destination{font-size:12px}}html:fullscreen{overflow:auto;background:#081e23}html:fullscreen #app{min-height:100dvh}
.map-view .map{width:min(100%,calc((100dvh - 230px)*1.777));margin-inline:auto}.map-view .map-heading h2{font-size:24px;margin:12px 0 4px}.map-view .map-heading p{font-size:15px}
