:root{color:#eef5f8;background:#09101c;font-family:Inter,Hiragino Sans,Yu Gothic UI,Meiryo,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--panel: rgba(13, 22, 36, .96);--line: rgba(198, 224, 238, .17);--muted: #9fb3bf}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;overflow:hidden}button{font:inherit;color:inherit}button:focus-visible{outline:3px solid #fff2a6;outline-offset:2px}.game-shell{width:100%;height:100dvh;min-height:340px;display:grid;grid-template-rows:48px minmax(0,1fr) 102px;background:radial-gradient(circle at 45% 20%,#22344d,#08101c 72%);user-select:none;-webkit-user-select:none}.game-header{position:relative;z-index:5;display:grid;grid-template-columns:minmax(150px,220px) minmax(180px,1fr) auto 34px;align-items:center;gap:12px;padding:5px max(10px,env(safe-area-inset-right)) 5px max(10px,env(safe-area-inset-left));background:linear-gradient(90deg,#101c2d,#16253a 62%,#111b2a);border-bottom:1px solid var(--line);box-shadow:0 3px 16px #00000059}.mission-title{display:flex;align-items:baseline;gap:9px;white-space:nowrap}.mission-title span{color:#f0c874;font-size:10px;font-weight:900;letter-spacing:.1em}.mission-title strong{font-size:17px;letter-spacing:.04em}.phase-hint{color:#b8c8d1;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.battle-counters{display:flex;gap:13px}.battle-counters div{display:grid;grid-template-columns:auto auto;gap:5px;align-items:baseline;white-space:nowrap}.battle-counters small{color:#91a7b5;font-size:8px;font-weight:900}.battle-counters b{font-size:14px;font-variant-numeric:tabular-nums}.icon-button{width:30px;height:30px;padding:0;border:1px solid var(--line);border-radius:50%;background:#26364a;font-weight:900;cursor:pointer}.battle-wrap{position:relative;min-height:0;overflow:hidden;background:#1a2937}.battle-canvas{display:block;width:100%;height:100%;object-fit:fill;touch-action:none;cursor:crosshair}.tier-switch{position:absolute;top:8px;left:max(8px,env(safe-area-inset-left));display:flex;align-items:center;gap:2px;padding:3px;border:1px solid rgba(255,255,255,.18);border-radius:8px;background:#080e18d1;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.tier-switch>span{padding:0 7px;color:#9db0bd;font-size:9px;font-weight:800}.tier-switch button{min-width:48px;padding:5px 7px;border:0;border-radius:5px;background:transparent;color:#b9c6ce;font-size:10px;font-weight:800;cursor:pointer}.tier-switch button.is-active{color:#101621;background:#e4edf0;box-shadow:0 0 14px #ffffff40}.tier-rookie .tier-switch button.is-active{background:#b9c7d8}.tier-elite .tier-switch button.is-active{background:#70c8ff}.tier-hero .tier-switch button.is-active{background:#ffd66d}.speed-button{position:absolute;top:9px;right:max(8px,env(safe-area-inset-right));padding:6px 9px;border:1px solid rgba(255,255,255,.16);border-radius:7px;background:#080e18c7;color:#c0d0d8;font-size:9px;font-weight:800;cursor:pointer}.battle-message{position:absolute;left:50%;top:9px;max-width:46%;translate:-50% 0;padding:7px 18px;border:1px solid rgba(255,222,132,.35);border-radius:20px;background:#111a29e0;color:#fff2c5;font-size:11px;font-weight:800;text-align:center;box-shadow:0 5px 20px #00000042;pointer-events:none;animation:message-in .2s ease-out}@keyframes message-in{0%{opacity:0;transform:translateY(-6px)}}.boss-meter{position:absolute;left:50%;top:44px;width:min(380px,48%);translate:-50% 0;display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:8px;padding:6px 10px;border:1px solid rgba(255,98,119,.4);border-radius:6px;background:#1e0c14db}.boss-meter span{color:#e99ca8;font-size:8px;font-weight:900}.boss-meter b{font-size:11px}.boss-meter i{height:6px;overflow:hidden;border-radius:5px;background:#30141d}.boss-meter i span{display:block;height:100%;background:linear-gradient(90deg,#c52e49,#ff7183);transition:width .15s}.quick-guide{position:absolute;left:max(8px,env(safe-area-inset-left));bottom:8px;max-width:430px;padding:10px 38px 10px 12px;border:1px solid rgba(255,255,255,.22);border-radius:9px;background:#080f19e3;box-shadow:0 8px 25px #00000061;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.quick-guide strong{display:block;margin-bottom:4px;color:#fff0bd;font-size:12px}.quick-guide p{margin:0 0 3px;font-size:10px;font-weight:700}.quick-guide small{display:block;color:#a6bac6;font-size:9px;line-height:1.45}.quick-guide button{position:absolute;top:4px;right:5px;width:28px;height:28px;border:0;background:transparent;color:#c5d3db;cursor:pointer}.quick-guide em{display:inline-block;width:7px;height:7px;margin:0 3px 0 6px;border-radius:50%}.quick-guide em:first-child{margin-left:0}.vanguard-dot{background:#ffb14e}.mage-dot{background:#9d8cff}.guardian-dot{background:#63d5b0}.command-deck{position:relative;z-index:6;display:grid;grid-template-columns:135px minmax(360px,1fr) 150px;gap:10px;align-items:stretch;padding:8px max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:linear-gradient(180deg,#162335,#0c1522);border-top:1px solid rgba(210,233,244,.2);box-shadow:0 -5px 24px #00000061}.party-vitals{display:flex;flex-direction:column;justify-content:center;gap:9px}.party-name{display:flex;flex-direction:column}.party-name span{color:#7f96a5;font-size:8px;font-weight:900;letter-spacing:.16em}.party-name b{font-size:15px;white-space:nowrap}.hp-bar{width:100%;height:8px;overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:5px;background:#18212a}.hp-bar span{display:block;height:100%;background:linear-gradient(90deg,#35b991,#77e1bf);transition:width .15s}.leader-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.leader-card{position:relative;display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:8px;min-width:0;padding:6px 8px;border:1px solid rgba(255,255,255,.14);border-radius:9px;background:linear-gradient(145deg,#2a394aeb,#16202deb);text-align:left;cursor:pointer;transition:transform .12s,border-color .12s,background .12s}.leader-card:active{transform:translateY(2px)}.leader-card.is-active{border-color:var(--card-color);background:linear-gradient(145deg,color-mix(in srgb,var(--card-color) 25%,#253344),#172230);box-shadow:inset 0 0 18px #ffffff0a,0 0 13px color-mix(in srgb,var(--card-color) 22%,transparent)}.leader-vanguard{--card-color: #ffb14e}.leader-mage{--card-color: #9d8cff}.leader-guardian{--card-color: #63d5b0}.portrait{display:grid;place-items:center;width:38px;aspect-ratio:1;border:2px solid color-mix(in srgb,var(--card-color) 70%,white);border-radius:50%;background:var(--card-color);color:#111b28;font-size:18px;font-weight:900;box-shadow:inset 0 -7px 12px #00000029}.leader-copy{display:flex;flex-direction:column;min-width:0}.leader-copy b{overflow:hidden;font-size:13px;text-overflow:ellipsis}.leader-copy small{color:var(--card-color);font-size:10px;font-weight:900}.formation-mark{padding:3px 4px;border-radius:4px;color:#7f929f;font-size:8px;font-weight:900}.leader-card.is-active .formation-mark{background:var(--card-color);color:#13202a}.order-button{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:6px 8px;border:1px solid color-mix(in srgb,var(--leader-color) 48%,#81909a);border-radius:10px;background:linear-gradient(to right,color-mix(in srgb,var(--leader-color) 32%,#182333) var(--gauge),#182333 var(--gauge));cursor:pointer}.order-button:disabled{cursor:not-allowed;opacity:.72}.order-button span{color:var(--leader-color);font-size:9px;font-weight:900;letter-spacing:.15em}.order-button b{margin:3px 0;font-size:14px}.order-button i{color:#9fb2bf;font-size:9px;font-style:normal;font-weight:900}.order-button.is-ready{color:#17202a;background:var(--leader-color);box-shadow:0 0 20px color-mix(in srgb,var(--leader-color) 55%,transparent);animation:ready-pulse 1.2s infinite}.order-button.is-ready span,.order-button.is-ready i{color:#17202a}@keyframes ready-pulse{50%{filter:brightness(1.22)}}.result-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:8;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:18px;background:radial-gradient(circle,#182b38e3,#040911f0);text-align:center;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.result-overlay>span{color:#f3cf78;font-size:10px;font-weight:900;letter-spacing:.2em}.result-overlay h1{margin:3px 0 4px;font-size:clamp(25px,5vw,44px)}.result-overlay p{margin:0 0 10px;color:#b9cbd4;font-size:11px}.result-stats{display:flex;gap:20px;margin:5px 0 12px}.result-stats div{display:flex;flex-direction:column;min-width:58px}.result-stats small{color:#8da3b1;font-size:9px}.result-stats b{font-size:20px}.result-overlay>button{padding:8px 22px;border:1px solid #f2d183;border-radius:7px;background:#e5bf62;color:#18202a;font-size:11px;font-weight:900;cursor:pointer}.result-defeat>span{color:#ff8a97}.result-defeat>button{border-color:#ff8794;background:#e15b6d;color:#fff}.portrait-warning{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;align-items:center;justify-content:center;flex-direction:column;gap:8px;background:#09111e;text-align:center}.portrait-warning strong{color:#f2d27f;font-size:20px}.portrait-warning span{color:#9db1bd;font-size:12px}@media(max-width:700px){.game-shell{grid-template-rows:42px minmax(0,1fr) 88px}.game-header{grid-template-columns:minmax(130px,180px) 1fr auto 30px;gap:6px}.phase-hint{font-size:9px}.battle-counters{gap:7px}.battle-counters div:nth-child(2),.battle-counters div:nth-child(3){display:none}.command-deck{grid-template-columns:95px minmax(330px,1fr) 120px;gap:6px;padding-top:6px}.party-name b{font-size:12px}.leader-card{grid-template-columns:34px 1fr;gap:6px;padding:4px 6px}.portrait{width:32px;font-size:15px}.formation-mark{display:none}.order-button b{font-size:11px}.quick-guide{max-width:360px}}@media(orientation:portrait)and (max-width:760px){.portrait-warning{display:flex}}@media(max-height:390px){.game-shell{grid-template-rows:40px minmax(0,1fr) 82px}.game-header{padding-top:3px;padding-bottom:3px}.mission-title strong{font-size:14px}.command-deck{padding-top:5px;padding-bottom:max(5px,env(safe-area-inset-bottom))}.quick-guide{bottom:5px;padding-top:7px;padding-bottom:7px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}
