:root{--ink: #1f3044;--panel-bg: rgba(248, 255, 255, .9);--panel-edge: rgba(15, 43, 59, .2);--accent: #2a8ca6;--accent-strong: #2f6f95;--muted: #516b7f;--surface: rgba(255, 255, 255, .9)}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:Avenir Next,Trebuchet MS,Gill Sans,sans-serif;color:var(--ink);background:radial-gradient(circle at 12% 14%,rgba(255,255,255,.44),transparent 45%),radial-gradient(circle at 84% 18%,rgba(255,248,201,.4),transparent 39%),linear-gradient(145deg,#84caf0,#5ea9db 44%,#79b6da)}.ui-shell{position:relative;width:100%;height:100%}#viewport{position:absolute;top:0;right:0;bottom:0;left:0}.interaction-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.3rem;width:100%;margin-bottom:.55rem;padding:.35rem;border-radius:12px;background:#f7ffffd6;border:1px solid rgba(35,84,103,.18);box-shadow:0 8px 22px #0c2a3e24}.mode-btn{border:1px solid rgba(32,82,103,.25);background:var(--surface);color:var(--ink);border-radius:999px;font-size:.86rem;min-height:42px;padding:.45rem .7rem}.mode-btn.active{background:linear-gradient(135deg,#2f9db7,#2c7c9f);color:#fff;border-color:#1d5067a6}.message-stack{position:absolute;left:10px;right:10px;bottom:calc(252px + env(safe-area-inset-bottom,0px));z-index:55;display:grid;gap:.42rem;pointer-events:none}.toast{opacity:0;transform:translateY(8px);transition:opacity .18s ease,transform .18s ease;font-size:.88rem;font-weight:600;line-height:1.35;padding:.56rem .68rem;border-radius:10px;border:2px solid rgba(16,52,73,.3);background:#fbfffffa;box-shadow:0 14px 28px #102d4040}.toast.show{opacity:1;transform:translateY(0)}.toast-info{border-color:#28699273;background:#f0fafffa}.toast-success{border-color:#2b784885;background:#eefff4fa}.toast-warn{border-color:#b96e3994;background:#fff5e3fa}.bottom-hud{position:absolute;left:10px;right:10px;bottom:calc(8px + env(safe-area-inset-bottom,0px));z-index:36;display:grid;gap:.4rem}.hud-shell{border-radius:14px;border:1px solid rgba(21,61,84,.22);background:#f8ffffe0;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);box-shadow:0 10px 28px #0e2d412e;padding:.48rem .52rem .45rem}.hud-row{display:grid;gap:.35rem}.hud-primary{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:.35rem}.hud-resources,.hud-support{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:.35rem}.hud-chip{border:1px solid rgba(23,56,79,.16);border-radius:9px;background:#ffffffb8;padding:.27rem .34rem}.hud-chip span{display:block;font-size:.56rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}.hud-chip strong{display:block;margin-top:.07rem;font-size:.8rem;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hud-harmony-track{height:9px;border-radius:999px;background:#325b782e;overflow:hidden}#hud-harmony-fill{height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#cc6e4f,#e5b04a 40%,#58b56c);transition:width .22s ease}.hud-note{margin:.35rem 0 0;font-size:.68rem;color:var(--muted)}.panel-toggle{width:100%;border-radius:12px;border:1px solid rgba(32,82,103,.26);background:#fffffff0;color:var(--ink);font-size:.92rem;min-height:44px;padding:.6rem .7rem}.control-panel{position:absolute;z-index:44;left:0;right:0;bottom:0;width:100%;max-height:min(74vh,680px);overflow:auto;padding:14px 14px calc(24px + env(safe-area-inset-bottom,0px));border-radius:18px 18px 0 0;border:1px solid var(--panel-edge);border-bottom:0;background:var(--panel-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 -12px 35px #17344838;transform:translateY(0);transition:transform .22s ease}.control-panel.collapsed{transform:translateY(100%)}.tab-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.36rem;margin-bottom:.68rem}.tab-btn{min-height:40px;font-size:.76rem;font-weight:600;letter-spacing:.02em;border-radius:10px}.tab-btn.active{background:linear-gradient(135deg,#2f9db7,#2c7c9f);color:#fff;border-color:#1d5067a6}.tab-panels{display:block}.panel-tab{display:none;margin:0;padding:0}.panel-tab.active{display:block}.control-panel::-webkit-scrollbar{width:10px}.control-panel::-webkit-scrollbar-thumb{background:#1f435947;border-radius:999px}h1{margin:0;font-size:1.14rem;letter-spacing:.02em}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.panel-close{width:auto;min-height:34px;padding:.36rem .6rem;font-size:.76rem;border-radius:999px;border:1px solid rgba(40,83,105,.28);background:#ffffffe0}.tagline{margin:.2rem 0 .85rem;color:var(--muted);font-size:.82rem}.panel-tab section{margin-bottom:.75rem;padding-bottom:.64rem;border-bottom:1px dashed rgba(28,58,78,.18)}.panel-tab section:last-of-type{border-bottom:0;margin-bottom:0;padding-bottom:0}h2{margin:0 0 .45rem;font-size:.83rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-strong)}.control-row{display:grid;gap:.25rem;margin-bottom:.52rem}.control-row label{font-size:.77rem;color:var(--muted);display:flex;justify-content:space-between;gap:.45rem}select,button,input[type=range]{width:100%}select,button{border-radius:12px;border:1px solid rgba(32,82,103,.23);background:#ffffffe6;color:var(--ink);font-size:.9rem;min-height:44px;padding:.55rem .65rem}button{cursor:pointer;transition:transform .11s ease,background .12s ease}button:hover{transform:translateY(-1px);background:#ecfafff2}button:active{transform:translateY(0)}button:disabled{cursor:not-allowed;transform:none;opacity:.56;background:#eef3f7e6}input[type=range]{accent-color:var(--accent)}.button-row{display:grid;gap:.4rem}.next-move-card{border:1px solid rgba(34,88,118,.25);border-radius:12px;background:linear-gradient(135deg,#eaf8fff2,#f9fffaeb);box-shadow:0 8px 18px #163a501f;padding:.62rem .68rem;margin-bottom:.5rem}.next-move-kicker{margin:0;font-size:.66rem;letter-spacing:.07em;text-transform:uppercase;color:var(--accent-strong)}#next-move-title{display:block;margin-top:.16rem;font-size:.94rem}#next-move-body{margin:.2rem 0 0;font-size:.77rem;color:var(--muted)}.quest-card{border:1px solid rgba(73,108,50,.28);border-radius:12px;background:linear-gradient(140deg,#eefce9f2,#f9fff0eb);box-shadow:0 8px 16px #2745211f;padding:.6rem .66rem;margin-bottom:.52rem}.quest-kicker{margin:0;font-size:.66rem;letter-spacing:.07em;text-transform:uppercase;color:#5d7c41}#quest-title{display:block;margin-top:.16rem;font-size:.92rem}#quest-body{margin:.2rem 0 0;font-size:.76rem;color:#4f6740}.quest-meta{margin-top:.34rem;display:grid;gap:.12rem}#quest-stage{font-size:.72rem;color:#5d7c41;font-weight:700}#quest-progress{font-size:.74rem;font-weight:700;color:#3c5b2c}#quest-reward{font-size:.71rem;color:#4f6740}#quest-claim{margin-top:.4rem;min-height:40px;text-align:left;font-size:.76rem;border-color:#57793c52}.event-card{display:none;margin-top:.62rem;padding:.56rem .62rem .64rem;border:1px solid rgba(171,111,64,.3);border-radius:12px;background:#fff8e9eb}.event-card.active{display:block}.event-kicker{margin:0;font-size:.66rem;letter-spacing:.07em;text-transform:uppercase;color:#9b6a43}#event-title{display:block;margin-top:.16rem;font-size:.93rem}#event-body{margin:.2rem 0 .4rem;font-size:.77rem;color:#6f5643}.event-options{display:grid;gap:.34rem}.event-option-btn{text-align:left;min-height:40px;font-size:.74rem;padding:.46rem .54rem;border-color:#955f3554}.action-hidden{display:none!important}.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.45rem;margin-bottom:.65rem}.stats-grid>div{border:1px solid rgba(23,56,79,.16);border-radius:10px;padding:.4rem .5rem;background:#ffffff9e}.stats-grid span{display:block;font-size:.69rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.stats-grid strong{font-size:1.05rem}.phase-card,.resource-grid>div{border:1px solid rgba(23,56,79,.16);border-radius:10px;padding:.4rem .5rem;background:#ffffff9e}.phase-card{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:.55rem}.phase-card span{font-size:.69rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.phase-card strong{font-size:.9rem}.resource-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;margin-bottom:.65rem}.resource-grid span{display:block;font-size:.66rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.resource-grid strong{font-size:.95rem}.harmony-wrap{margin-top:.35rem}.harmony-label{display:flex;justify-content:space-between;font-size:.8rem;margin-bottom:.2rem}.harmony-track{height:11px;border-radius:999px;background:#325b782b;overflow:hidden}#harmony-fill{height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#cc6e4f,#e5b04a 40%,#58b56c);transition:width .22s ease}.hint{margin:0;font-size:.79rem;color:var(--muted)}#event-log{margin:.5rem 0 0;padding:0;list-style:none;display:grid;gap:.28rem;max-height:130px;overflow:auto}#event-log li{font-size:.73rem;line-height:1.24;padding:.36rem .45rem;border-radius:8px;background:#ffffff91;border:1px solid rgba(34,74,93,.13)}.pulse-up{animation:pulseUp .46s ease}.pulse-down{animation:pulseDown .46s ease}@keyframes pulseUp{0%{transform:scale(1);color:inherit}35%{transform:scale(1.08);color:#2f8f5b}to{transform:scale(1);color:inherit}}@keyframes pulseDown{0%{transform:scale(1);color:inherit}35%{transform:scale(1.05);color:#b35f43}to{transform:scale(1);color:inherit}}.touch-ui select,.touch-ui button{min-height:46px}@media (max-width: 430px){.stats-grid,.tab-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.hud-primary,.hud-resources{grid-template-columns:repeat(3,minmax(0,1fr))}.hud-support{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width: 960px){#viewport{right:388px}.bottom-hud{left:auto;right:0;top:auto;bottom:0;width:388px;padding:10px 12px 12px;z-index:40}.message-stack{left:14px;right:402px;bottom:14px;width:auto}.control-panel{left:auto;right:0;top:0;bottom:228px;width:388px;max-height:none;border-radius:0;border-top:0;border-right:0;border-bottom:0;box-shadow:-12px 0 35px #17344838;padding:14px 16px 16px;z-index:44}.control-panel.collapsed{transform:translate(calc(100% + 12px))}.hud-shell{max-height:170px;overflow:auto}h1{font-size:1.18rem}.tagline{font-size:.86rem}}