@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&family=Noto+Color+Emoji&display=swap";:root{--surface: #0b1326;--surface-container-lowest: #060e20;--surface-container-low: #131b2e;--surface-container: #171f33;--surface-container-high: #222a3d;--surface-container-highest: #2d3449;--surface-bright: #31394d;--primary: #00daf3;--primary-container: #00bcd2;--on-primary: #00363d;--accent: var(--primary);--secondary: #b9c7df;--secondary-container: #3c4a5e;--on-secondary-container: #abb9d1;--success: #10b981;--danger: var(--error);--warning: #ffb2b7;--error: #ffb4ab;--on-error: #690005;--outline: #869396;--outline-variant: #3c494c;--text-primary: #f8fafc;--text-secondary: #cbd5e1;--text-muted: #a4b3c8;--panel-border: rgba(255, 255, 255, .08);--z-map: 0;--z-hud: 10;--z-panel: 20;--z-overlay: 30;--z-modal: 1000;--z-toast: 9000;--z-pause: 9999;--z-dev: 10000}body{margin:0;padding:0;background:radial-gradient(circle at 50% 50%,#0c162d,#030712);color:var(--text-primary);font-family:Inter,sans-serif;height:100vh;overflow:hidden}#root{height:100vh;display:flex;flex-direction:column}.glass-panel{background:#0a0f19bf;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:24px;box-shadow:0 20px 40px #00000080,inset 1px 1px #ffffff0d;transition:all .25s ease-out}.glass-panel:hover{background:#0e1420cc;box-shadow:0 16px 48px -12px #000000e6,inset 0 1px #ffffff14}.glass-panel-glow{border-color:#00daf333;box-shadow:0 0 40px #00daf30d}h1,h2,h3,.heading-display{font-family:Space Grotesk,sans-serif;letter-spacing:-.02em}h1{font-size:1.5rem;font-weight:600;margin:0;color:var(--text-primary)}h2{font-size:1.1rem;font-weight:600;color:var(--text-primary);margin-top:0;margin-bottom:12px;border-bottom:1px solid rgba(60,73,76,.15);padding-bottom:8px}h3{font-size:.95rem;font-weight:500;color:var(--text-primary);margin:8px 0}p{margin:6px 0;font-size:.95rem;color:var(--text-secondary);line-height:1.4}.text-accent{color:var(--primary)}.text-danger{color:var(--error)}.text-success{color:var(--success)}.text-warning{color:var(--warning)}strong{color:var(--text-primary);font-weight:600}.stat-box{background:#0f172a59;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.05);border-top:1px solid rgba(255,255,255,.1);box-shadow:inset 0 2px 8px #0003,0 4px 16px #0000004d;padding:12px 16px;border-radius:12px;display:flex;flex-direction:column;gap:4px;transition:all .2s cubic-bezier(.16,1,.3,1)}.stat-box:hover{background:#1e293b73;border-color:#ffffff1f;transform:translateY(-1px)}.stat-label{font-size:.6875rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;font-weight:600;font-family:Inter,monospace}.stat-value{font-size:1.15rem;font-weight:600;color:var(--primary)}.glass-v2{background:#0a0f1ebf;backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border:1px solid rgba(255,255,255,.12);box-shadow:0 12px 40px #00000080;border-radius:20px}.glass-header{background:#0000004d;border-bottom:1px solid rgba(255,255,255,.1);padding:12px 20px;position:relative}.glass-button{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:#fff9;cursor:pointer;transition:all .2s cubic-bezier(.16,1,.3,1)}.glass-button:hover:not(:disabled){background:#ffffff26;color:#fff;border-color:#ffffff40;transform:translateY(-1px);box-shadow:0 4px 12px #0003}.glass-button:active:not(:disabled){transform:scale(.97) translateY(0);background:#ffffff14;box-shadow:none}.glass-button.active{background:var(--primary);color:#000;border-color:transparent}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#ffffff05;border-radius:4px}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff40}.panel-title{font-family:Space Grotesk,sans-serif;letter-spacing:-.02em}.btn{background:#1e293b66;color:var(--text-primary);border:1px solid rgba(255,255,255,.08);border-top:1px solid rgba(255,255,255,.12);padding:10px 20px;border-radius:8px;font-family:Space Grotesk,sans-serif;font-size:.9rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;transition:all .2s cubic-bezier(.16,1,.3,1);display:inline-flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 4px 12px #0003,inset 0 1px #ffffff0d;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.btn:hover:not(:disabled){background:#38bdf81a;border-color:#38bdf84d;transform:translateY(-2px);box-shadow:0 8px 20px -4px #0006,inset 0 1px #ffffff1a,0 0 16px #38bdf826;color:#fff}.btn:active:not(:disabled){transform:translateY(1px) scale(.98);box-shadow:0 2px 4px #0003,inset 0 2px 4px #0003;background:#38bdf80d;border-color:#38bdf826}.btn:disabled{opacity:.4;cursor:not-allowed;transform:none}.btn-primary{background:linear-gradient(135deg,#0284c7cc,#0ea5e9cc);color:#fff;border:1px solid rgba(56,189,248,.3);border-top:1px solid rgba(125,211,252,.5);box-shadow:0 4px 16px #0ea5e933,inset 0 1px #fff3}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,#0ea5e9e6,#38bdf8e6);box-shadow:0 8px 24px #0ea5e966,inset 0 1px #ffffff4d;border-color:#7dd3fc80}.btn-danger{background:linear-gradient(135deg,#991b1bcc,#dc2626cc);color:#fff;border:1px solid rgba(248,113,113,.3);border-top:1px solid rgba(252,165,165,.5);box-shadow:0 4px 16px #dc262633,inset 0 1px #fff3}.btn-danger:hover:not(:disabled){background:linear-gradient(135deg,#dc2626e6,#f87171e6);box-shadow:0 8px 24px #dc262666,inset 0 1px #ffffff4d;border-color:#fca5a580}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:var(--surface-container-lowest)}::-webkit-scrollbar-thumb{background:var(--surface-container-high);border-radius:0}::-webkit-scrollbar-thumb:hover{background:var(--surface-bright)}@keyframes fadeInOut{0%{opacity:0;transform:translate(-50%,-20px) scale(.95)}10%{opacity:1;transform:translate(-50%) scale(1)}90%{opacity:1;transform:translate(-50%) scale(1)}to{opacity:0;transform:translate(-50%,-20px) scale(.95)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes glowPulse{0%{border-color:#00daf333;box-shadow:0 0 5px #00daf31a}50%{border-color:#00daf3cc;box-shadow:0 0 25px #00daf366}to{border-color:#00daf333;box-shadow:0 0 5px #00daf31a}}.glow-pulse{animation:glowPulse 2s infinite ease-in-out;border-width:2px!important}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-slide-left{animation:slideInLeft .3s cubic-bezier(.16,1,.3,1) forwards}.animate-slide-right{animation:slideInRight .3s cubic-bezier(.16,1,.3,1) forwards}.animate-slide-up{animation:slideUp .3s cubic-bezier(.16,1,.3,1) forwards}.toast-container{position:fixed;top:32px;left:50%;transform:translate(-50%);background:#0f172ad9;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:var(--text-primary);padding:16px 32px;border-radius:24px;border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 40px -10px #000c,inset 0 1px 1px #ffffff1a;border-top:2px solid rgba(14,165,233,.8);z-index:var(--z-toast);font-size:.95rem;font-family:Space Grotesk,sans-serif;font-weight:500;pointer-events:none;animation:fadeInOut 3s forwards cubic-bezier(.16,1,.3,1)}.toast-error{border-top-color:var(--error);background:#450a0ad9;box-shadow:0 20px 40px -10px #450a0acc,inset 0 1px 1px #ffffff1a}.combat-card{background:#0f172a99;border:1px solid rgba(255,255,255,.08);padding:16px;border-radius:12px;margin-bottom:12px;box-shadow:inset 0 2px 8px #0000004d,0 4px 12px #0000004d}.combat-round{border-bottom:1px solid rgba(60,73,76,.15);padding-bottom:8px;margin-bottom:8px;font-size:.9rem}.combat-round:last-child{border-bottom:none;padding-bottom:0;margin-bottom:0}.unit-tag{display:inline-flex;align-items:center;background:var(--surface-container);border-radius:0;padding:2px 6px;margin-right:4px;margin-bottom:4px;font-size:.85rem;border-left:2px solid var(--primary)}.strategic-directive{background:#0f172ab3;backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border:1px solid rgba(14,165,233,.5);border-radius:16px;box-shadow:inset 0 0 40px #0ea5e926,0 16px 40px #000c,0 0 60px #0ea5e933;position:relative;overflow:hidden}.strategic-directive:before{content:"";position:absolute;top:0;left:0;width:100%;height:2px;background:linear-gradient(90deg,transparent,var(--primary),transparent);animation:scanline 8s linear infinite;opacity:.6;z-index:2;pointer-events:none}@keyframes pulse-breathing{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.05);opacity:1}to{transform:scale(1);opacity:.8}}.pulse-breathing{animation:pulse-breathing 2s infinite ease-in-out}@keyframes scanline{0%{transform:translateY(-100%)}to{transform:translateY(400px)}}.strategic-directive:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.15),rgba(0,0,0,.15) 1px,transparent 1px,transparent 2px);pointer-events:none;z-index:1}.pulse-beacon{width:8px;height:8px;background-color:var(--primary);border-radius:50%;box-shadow:0 0 #00daf3b3;animation:pulse-beacon-anim 2s infinite;display:inline-block}@keyframes pulse-beacon-anim{0%{transform:scale(.95);box-shadow:0 0 #00daf3b3}70%{transform:scale(1);box-shadow:0 0 0 10px #00daf300}to{transform:scale(.95);box-shadow:0 0 #00daf300}}.typewriter-cursor{display:inline-block;width:8px;height:1.2em;background-color:var(--primary);vertical-align:bottom;margin-left:4px;animation:blink 1s step-end infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.directive-anim-enter{animation:directiveEnter .5s cubic-bezier(.16,1,.3,1) forwards}.directive-anim-exit{animation:directiveExit .3s cubic-bezier(.16,1,.3,1) forwards}@keyframes directiveEnter{0%{opacity:0;transform:translateY(30px) scale(.95);filter:blur(10px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}@keyframes directiveExit{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(30px) scale(.95)}}