:root{color-scheme:dark;font-family:system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0;background:#0a0f1a;color:#e5e7eb}#app{margin:0 auto;padding:8px;height:100vh;height:100dvh;display:flex;gap:8px;overflow:hidden}#map-wrap{position:relative;flex:1 1 auto;min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden}#sidebar{display:flex;flex-direction:column;gap:8px;min-height:0}@media(orientation:portrait){#app{flex-direction:column-reverse;max-width:1100px}#sidebar{flex:0 0 auto}#scoreboard{max-height:14vh;overflow-y:auto}}@media(orientation:landscape){#app{flex-direction:row}#sidebar{flex:0 0 280px;overflow-y:auto}}#hud{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;padding:8px 12px;background:#111827;border:1px solid #1f2937;border-radius:10px}#turn-info{font-weight:700;font-size:15px;line-height:1.15}#turn-info small{font-weight:600;font-size:11px;color:#fde047}#selection-info{flex:1;color:#9ca3af;min-width:110px;font-size:12px}#controls{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.ctrl{padding:6px 10px;font-size:13px;font-weight:600;color:#e5e7eb;background:#1f2937;border:1px solid #374151;border-radius:8px;cursor:pointer}.ctrl.off{opacity:.55}.vol{display:inline-flex;align-items:center;gap:4px;font-size:13px}.vol input[type=range]{width:72px;accent-color:#fde047}.sound-modal{max-width:360px;display:flex;flex-direction:column;gap:12px}.sound-modal .vol-row{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:15px;padding:4px 2px}.sound-modal .vol-row input[type=range]{width:auto;flex:1 1 auto;height:22px}.sound-modal .ctrl{padding:10px 12px;font-size:14px;text-align:center}.sound-hint{margin:-4px 2px 0;font-size:12px;color:#9ca3af;text-align:center}.cutscene{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#080b1400;cursor:pointer}.cutscene.show{animation:cutsceneBg 1.6s ease-out forwards}@keyframes cutsceneBg{0%{background:#080b1400}12%{background:#080b14d1}80%{background:#080b14d1}to{background:#080b1400}}.cutscene-flash{position:absolute;width:60vmax;height:60vmax;border-radius:50%;background:radial-gradient(circle,#fffffff2,#fde04799 25%,#fb923c00 60%);opacity:0;transform:scale(.1)}.cutscene.show .cutscene-flash{animation:cutsceneFlash .9s ease-out forwards}@keyframes cutsceneFlash{0%{opacity:0;transform:scale(.1)}18%{opacity:1;transform:scale(.6)}to{opacity:0;transform:scale(1.6)}}.cutscene-ring{position:absolute;width:20vmax;height:20vmax;border-radius:50%;border:.6vmax solid #fde047;opacity:0}.cutscene.show .cutscene-ring{animation:cutsceneRing 1.1s ease-out forwards}@keyframes cutsceneRing{0%{opacity:0;transform:scale(.2);border-width:1vmax}20%{opacity:.9}to{opacity:0;transform:scale(3.2);border-width:.1vmax}}.cutscene-banner{position:relative;text-align:center;transform:scale(.6);opacity:0}.cutscene.show .cutscene-banner{animation:cutsceneBanner 1.6s cubic-bezier(.2,.9,.3,1) forwards}@keyframes cutsceneBanner{0%{transform:scale(.6);opacity:0}22%{transform:scale(1.08);opacity:1}34%{transform:scale(1);opacity:1}82%{transform:scale(1);opacity:1}to{transform:scale(1.04);opacity:0}}.cutscene-title{font:800 clamp(40px,12vw,96px) Georgia,"Times New Roman",serif;color:#fde047;text-shadow:0 2px 12px rgba(0,0,0,.8),0 0 28px rgba(253,224,71,.5);letter-spacing:.05em}.cutscene-name{margin-top:8px;font:700 clamp(18px,5vw,34px) Georgia,"Times New Roman",serif;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.9)}.cutscene-skip{position:absolute;bottom:8%;width:100%;text-align:center;font-size:13px;color:#fff9;opacity:0}.cutscene.show .cutscene-skip{animation:cutsceneSkip 1.6s ease-out forwards}@keyframes cutsceneSkip{0%,40%{opacity:0}55%{opacity:1}to{opacity:0}}.confirm-modal{max-width:340px}#confirm-message{margin:0 0 18px;font-size:15px;line-height:1.5;text-align:center;white-space:pre-line}.confirm-buttons{display:flex;gap:10px;justify-content:center}.confirm-buttons .ctrl{flex:1;padding:10px 12px;font-size:14px;text-align:center}.ctrl.confirm-ok{background:#b45309;border-color:#d97706;color:#fde68a}.ctrl.confirm-ok:hover{background:#92400e}.ctrl:hover{background:#374151}.diplo{border-color:#b45309;background:#78350f;color:#fde68a}.diplo:hover{background:#92400e}#end-turn{padding:6px 14px;font-size:14px;font-weight:700;color:#0a0f1a;background:#fde047;border:none;border-radius:8px;cursor:pointer}#end-turn:hover{background:#fef08a}#end-turn:disabled{background:#4b5563;color:#9ca3af;cursor:default}#scoreboard{display:flex;flex-wrap:wrap;gap:6px;font-size:12px}.score{flex:0 0 auto}.score{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;background:#111827;border:1px solid #1f2937;border-radius:999px;color:#d1d5db}.score i{width:10px;height:10px;border-radius:50%;display:inline-block}.score.me{border-color:#fde047;color:#fff;font-weight:700}.score.dead{opacity:.4;text-decoration:line-through}.score.goal{background:#1e3a5f;border-color:#2563eb;color:#bfdbfe;font-weight:700}#rotate-hint{display:none;padding:10px 14px;background:#1e3a5f;border:1px solid #2563eb;border-radius:10px;color:#bfdbfe;font-size:13px;text-align:center}@media(orientation:portrait)and (max-width:900px){#rotate-hint{display:block}}#map{display:block;width:100%;height:100%;border-radius:10px;border:1px solid #1f2937;cursor:pointer}#message-bar{padding:8px 14px;background:#111827;border:1px solid #1f2937;border-radius:10px;font-size:13px;color:#d1d5db;text-align:center}#message-bar.error{background:#7f1d1d;border-color:#b91c1c;color:#fecaca;font-weight:600}#message-bar.good{background:#14532d;border-color:#16a34a;color:#bbf7d0;font-weight:600}#action-menu{position:absolute;left:50%;bottom:16px;transform:translate(-50%);z-index:8;background:#111827f5;border:1px solid #374151;border-radius:12px;padding:12px;min-width:220px;box-shadow:0 8px 24px #00000080}#action-title{font-size:14px;color:#e5e7eb;text-align:center;margin-bottom:8px}#action-title .combat-info{font-size:12px;color:#9ca3af}#action-title .combat-info b{color:#fde047}#action-buttons{display:flex;flex-direction:column;gap:6px}#amount-row{display:flex;flex-direction:column;gap:6px;padding:6px 4px 10px;font-size:13px;color:#fde047}#amount-row input[type=range]{width:100%;accent-color:#fde047}.amount-controls{display:flex;align-items:center;gap:8px}.amount-controls input[type=range]{flex:1 1 auto;min-width:0}.amount-step{flex:0 0 auto;width:40px;height:36px;font-size:22px;line-height:1;font-weight:700;color:#fde047;background:#1f2937;border:1px solid #374151;border-radius:8px;cursor:pointer;user-select:none;-webkit-user-select:none;touch-action:manipulation}.amount-step:hover:not(:disabled){background:#374151}.amount-step:active:not(:disabled){background:#4b5563}.amount-step:disabled{opacity:.35;cursor:default}.action-btn{padding:12px;font-size:15px;font-weight:600;color:#e5e7eb;background:#1f2937;border:1px solid #374151;border-radius:8px;cursor:pointer;text-align:center}.action-btn:hover{background:#374151}.action-btn.attack{background:#7f1d1d;border-color:#b91c1c;color:#fecaca}.action-btn.cancel{background:transparent;color:#9ca3af}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:16px;background:#0a0f1ad1;z-index:10}.modal{background:#111827;border:1px solid #374151;border-radius:12px;padding:24px;max-width:520px;width:90%;max-height:86vh;overflow-y:auto}.modal h2{margin:0 0 16px;text-align:center}#scenario-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}.scenario-card{display:flex;flex-direction:column;gap:4px;padding:14px;text-align:left;color:#e5e7eb;background:#1f2937;border:1px solid #374151;border-radius:10px;cursor:pointer}.scenario-card:hover{background:#374151;border-color:#fde047}.scenario-card strong{font-size:15px}.scenario-card span{font-size:12px;color:#9ca3af}.recover-card{background:#14532d;border-color:#22c55e}.recover-card:hover{background:#166534;border-color:#4ade80}.recover-card strong{color:#bbf7d0}.recover-card span{color:#86efac}.help-body{font-size:14px;line-height:1.55;color:#d1d5db}.help-body h3{font-size:15px;margin:16px 0 4px;color:#fde047}.help-body h3:first-child{margin-top:0}.help-body p{margin:0 0 4px}.help-body b{color:#fff}#help-close{display:block;width:100%;margin-top:12px;padding:12px;position:sticky;bottom:-24px;background:#111827}