*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overflow:hidden;background:#1d2b1b;color:#fff;font-family:Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,Yu Gothic,Meiryo,sans-serif;touch-action:none;overscroll-behavior:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}#app{position:fixed;inset:0;overflow:hidden;touch-action:none}#game{position:absolute;inset:0;width:100%;height:100%;display:block}#touch-zone{position:absolute;inset:0;touch-action:none}#joystick{display:none;position:absolute;width:110px;height:110px;margin:-55px 0 0 -55px;border-radius:50%;background:#ffffff1f;border:2px solid rgba(255,255,255,.35);pointer-events:none;z-index:5}#stick{position:absolute;left:50%;top:50%;width:50px;height:50px;border-radius:50%;background:#ffffff8c;transform:translate(-50%,-50%)}.hidden{display:none!important}#hud{position:absolute;inset:0;pointer-events:none;z-index:4;padding:max(6px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}.topbar{display:flex;gap:6px;align-items:center}.pill{background:#0a100ac7;border:1px solid rgba(255,255,255,.18);border-radius:10px;padding:5px 9px;font-size:15px;font-weight:700;white-space:nowrap;display:flex;align-items:center;gap:6px}.res .gem{color:#7ff0ff}.res{min-width:70px;font-size:18px;transition:transform .1s}.res.pulse{transform:scale(1.12);color:#c9f7ff}.fort{flex:1;min-width:0}.fort .bar{flex:1;height:12px;background:#ffffff1f;border-radius:6px;overflow:hidden;min-width:40px}#fort-bar{height:100%;width:100%;background:#6be38b;transition:width .2s}.fort.hit{border-color:#ff4b4b;background:#5a0a0ad9}.wave{font-size:13px}.btn-icon{pointer-events:auto;width:40px;height:36px;border-radius:10px;border:1px solid rgba(255,255,255,.3);background:#0a100acc;color:#fff;font-weight:700;font-size:15px}.row2{display:flex;gap:6px;margin-top:6px;align-items:flex-start}.front{flex:1;min-width:0;background:#0a100ab3;border-radius:9px;padding:4px 8px;font-size:12px;border:2px solid transparent}.front.east{text-align:right}.front .fh{font-weight:700;font-size:14px}.front.west .fh{color:#ff8fb6}.front.east .fh{color:#ffbd70}.front .st{font-size:11px;padding:1px 5px;border-radius:5px;background:#ffffff1f;color:#ddd}.front .fd{color:#d7e2d7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.front[data-state=engaged]{border-color:#ffffff40}.front[data-state=danger]{border-color:#ffb347}.front[data-state=danger] .st{background:#a5620f;color:#fff}.front[data-state=critical]{border-color:#ff3b3b;animation:blink .5s infinite alternate}.front[data-state=critical] .st{background:#c41e1e;color:#fff}@keyframes blink{0%{background:#780a0ad9}to{background:#0a100ab3}}#minimap{width:150px;height:94px;border-radius:8px;border:1px solid rgba(255,255,255,.3);flex:none}.top-stack{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:6px}.hint-box{max-width:min(520px,94%);background:#ffecaaf2;color:#2a1c05;border-radius:10px;padding:6px 12px;font-size:14px;line-height:1.45;text-align:center;box-shadow:0 3px 12px #00000073;animation:hint-in .3s ease-out}.hint-box b{color:#8a3b00}@keyframes hint-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}.preview{margin:0 auto;width:fit-content;max-width:96%;text-align:center;background:#0a100abf;border-radius:10px;padding:5px 12px;font-size:13px;line-height:1.5}.preview .w,.help .w{color:#ff8fb6;font-weight:700}.preview .e,.help .e{color:#ffbd70;font-weight:700}.ic.grunt{color:#ff9d9d}.ic.runner{color:#ffd27a}.ic.captain{color:gold}.dim{color:#888}.banner{position:absolute;left:50%;top:34%;transform:translate(-50%,-50%) scale(.9);opacity:0;transition:opacity .25s,transform .25s;background:#000000b8;padding:10px 20px;border-radius:12px;font-size:20px;font-weight:700;text-align:center;white-space:nowrap;max-width:94vw;overflow:hidden;text-overflow:ellipsis}.banner.show{opacity:1;transform:translate(-50%,-50%) scale(1)}.banner.warn{color:#ffb0a0;border:2px solid #ff5b4b}.banner.good{color:#b9ffcd}.banner.final{color:#ffe08a;border:2px solid #ffd36b;font-size:24px}.dev{position:absolute;left:8px;bottom:8px;font-size:12px;color:#ff0;background:#00000080;padding:2px 6px}.bottom{position:absolute;left:0;right:0;bottom:max(10px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:6px;padding:0 120px 0 8px}.spot-panel{background:#0a100adb;border:2px solid rgba(125,255,160,.55);border-radius:12px;padding:7px 12px;font-size:13px;max-width:340px;width:100%}.sp-title{font-weight:700;font-size:15px}.sp-action{margin-top:2px;font-size:14px}.sp-effect{color:#cfe0cf}.cost{font-weight:700;padding:0 6px;border-radius:5px}.cost.ok{background:#1d6b3a;color:#c8ffd6}.cost.bad{background:#5a2020;color:#ffb0b0}.reason{color:#ff9b9b;font-weight:700}.hint{color:#9fe8b4}.squad{pointer-events:auto;display:flex;align-items:stretch;gap:4px;background:#0a100abf;border-radius:12px;padding:4px}.btn-squad{border:1px solid rgba(74,163,255,.6);background:#163a63;color:#fff;border-radius:9px;font-size:14px;font-weight:700;padding:6px 10px;min-height:40px;touch-action:none}.btn-squad small{display:block;font-size:10px;color:#9fc6ee;font-weight:400}.btn-squad:active{background:#2c6bb0}.squad-info{display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:13px;font-weight:700;padding:0 6px;color:#cfe6ff}.squad-info .sep{font-size:10px;color:#8fb3d9}.btn-build{pointer-events:auto;position:absolute;right:max(14px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));width:100px;height:100px;border-radius:50%;border:none;padding:0;background:transparent;color:#fff;touch-action:none}.btn-build .ring{position:absolute;inset:0;border-radius:50%}.btn-build .inner{position:absolute;inset:7px;border-radius:50%;background:#1d6b3a;display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:13px;line-height:1.3;box-shadow:0 3px 10px #00000080}.btn-build .inner b{font-size:17px}.btn-build.held .inner{background:#2a9a55;transform:scale(.96)}.btn-build.disabled .inner{background:#4a4a4a;color:#bbb}.screen{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;background:#080e08b8;padding:16px;overflow-y:auto;touch-action:pan-y}.card{background:#22331f;border:2px solid #c9a75a;border-radius:16px;padding:22px 22px 18px;max-width:460px;width:100%;text-align:center;box-shadow:0 10px 40px #0009;max-height:100%;overflow-y:auto}.card h1{margin:0;font-size:40px;color:#ffe08a;letter-spacing:.1em;text-shadow:0 0 18px rgba(255,211,107,.6)}.card h2{margin:0 0 12px;color:#ffe08a}.card .sub{margin:2px 0 14px;color:#c9b98a;font-size:13px}.story{line-height:1.8;font-size:15px}.note{font-size:12px;color:#b8c8b0}.btn-main,.btn-sub{display:block;width:100%;margin:10px 0 0;border-radius:12px;font-size:18px;font-weight:700;padding:12px;border:none;cursor:pointer}.btn-main{background:#e0b04a;color:#2a1c05}.btn-sub{background:#3a4d36;color:#fff;font-size:15px;padding:10px}.help{text-align:left;font-size:14px;line-height:1.6}.help h2{text-align:center}.help h3{margin:10px 0 2px;color:#c9e6a8;font-size:15px}.help ul{margin:0;padding-left:18px}.gemc{color:#7ff0ff}.result-grid{display:grid;grid-template-columns:auto auto;gap:3px 14px;text-align:left;font-size:14px;margin:0 auto 8px;width:fit-content}.result-grid dt{color:#b8c8b0}.result-grid dd{margin:0;font-weight:700}.tips{text-align:left;background:#00000040;border-radius:10px;padding:8px 12px;font-size:13px;line-height:1.6}.tips li{margin-left:-6px}@media(max-width:560px){.pill{font-size:13px;padding:4px 7px}.res{font-size:16px;min-width:58px}.wave{font-size:11px}#minimap{width:104px;height:66px}.front{font-size:11px;padding:3px 6px}.front .fh{font-size:12px}.front .fd{white-space:normal}.bottom{padding:0 112px 0 6px;align-items:flex-start}.spot-panel{font-size:12px}.banner{font-size:16px}.hint-box{font-size:12.5px;padding:5px 9px}.card h1{font-size:32px}}@media(max-height:500px){#hud{padding-top:max(4px,env(safe-area-inset-top))}.pill{font-size:12px;padding:3px 7px}.res{font-size:15px;min-width:56px}.btn-icon{height:30px}.row2{margin-top:4px}#minimap{width:96px;height:60px}.front{font-size:11px;padding:2px 6px}.front .fh{font-size:12px}.hint-box,.preview{font-size:12px;padding:3px 9px}.btn-build{width:84px;height:84px}.btn-squad{min-height:34px;padding:3px 8px}}
