:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100vh;background:#0a0a0a;color:#fafafa}.game-container{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:1.5rem;gap:1.5rem}.game-title{font-size:2.5rem;font-weight:800;letter-spacing:-.03em;background:linear-gradient(135deg,#ff6b6b,#ffd93d,#6bcb77,#4d96ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:0;text-align:center}.game-subtitle{color:#ffffff73;font-size:.85rem;margin:-.75rem 0 0;text-align:center;letter-spacing:.1em;text-transform:uppercase}.battle-arena{width:100%;max-width:900px;display:grid;grid-template-columns:1fr auto 1fr;gap:0;align-items:stretch}.kingdom-panel{border:1px solid rgba(255,255,255,.08);border-radius:1rem;padding:1.25rem;background:#ffffff05;display:flex;flex-direction:column;gap:1rem}.kingdom-panel.red{border-color:#ff505040;background:#ff505008}.kingdom-panel.blue{border-color:#4d96ff40;background:#4d96ff08}.kingdom-header{display:flex;align-items:center;justify-content:space-between}.kingdom-name{font-size:1.25rem;font-weight:700}.kingdom-panel.red .kingdom-name{color:#ff6b6b}.kingdom-panel.blue .kingdom-name{color:#4d96ff}.kingdom-gold{font-size:.8rem;color:#ffd93d;font-weight:600}.castle-section{display:flex;flex-direction:column;gap:.35rem}.castle-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:#fff6}.hp-bar-outer{height:14px;background:#ffffff0f;border-radius:7px;overflow:hidden;position:relative}.hp-bar-inner{height:100%;border-radius:7px;transition:width .5s ease}.kingdom-panel.red .hp-bar-inner{background:linear-gradient(90deg,#f44,#ff6b6b)}.kingdom-panel.blue .hp-bar-inner{background:linear-gradient(90deg,#2264d1,#4d96ff)}.hp-text{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}.units-section{display:flex;flex-direction:column;gap:.5rem}.units-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:#fff6}.unit-row{display:flex;align-items:center;justify-content:space-between;background:#ffffff08;padding:.5rem .75rem;border-radius:.5rem;border:1px solid rgba(255,255,255,.05)}.unit-info{display:flex;align-items:center;gap:.5rem}.unit-icon{font-size:1.2rem}.unit-name{font-size:.85rem;font-weight:600}.unit-stats{font-size:.7rem;color:#fff6}.unit-count{font-size:1.1rem;font-weight:700;min-width:2rem;text-align:center}.recruit-section{display:flex;flex-direction:column;gap:.4rem}.recruit-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:#fff6}.recruit-btn{display:flex;align-items:center;justify-content:space-between;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:.5rem;padding:.5rem .75rem;cursor:pointer;color:#fafafa;font-family:inherit;transition:all .15s}.recruit-btn:hover:not(:disabled){background:#ffffff14;border-color:#ffffff26}.recruit-btn:disabled{opacity:.35;cursor:not-allowed}.recruit-btn-left{display:flex;align-items:center;gap:.5rem;font-size:.8rem}.recruit-cost{font-size:.7rem;color:#ffd93d;font-weight:600}.vs-divider{display:flex;align-items:center;justify-content:center;padding:0 1rem}.vs-badge{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#ff6b6b,#4d96ff);display:flex;align-items:center;justify-content:center;font-weight:900;font-size:.85rem;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.4);box-shadow:0 0 20px #ff6b6b33,0 0 20px #4d96ff33}.actions-bar{display:flex;gap:1rem;align-items:center}.action-btn{padding:.75rem 2rem;border-radius:.5rem;border:none;font-family:inherit;font-weight:700;font-size:1rem;cursor:pointer;transition:all .2s;letter-spacing:.02em}.attack-btn{background:linear-gradient(135deg,#f44,#ff6b6b);color:#fff;box-shadow:0 4px 15px #ff44444d}.attack-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 20px #f446}.attack-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.reset-btn{background:#ffffff0f;color:#fff9;border:1px solid rgba(255,255,255,.1)}.reset-btn:hover{background:#ffffff1a;color:#fafafa}.turn-indicator{font-size:.85rem;color:#ffffff80}.turn-indicator strong{color:#fafafa}.kingdom-panel.red .turn-indicator strong{color:#ff6b6b}.kingdom-panel.blue .turn-indicator strong{color:#4d96ff}.battle-log{width:100%;max-width:900px;border:1px solid rgba(255,255,255,.08);border-radius:1rem;padding:1rem 1.25rem;background:#ffffff05;max-height:200px;overflow-y:auto}.battle-log-title{font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:#fff6;margin-bottom:.5rem}.log-entry{font-size:.8rem;color:#ffffff8c;padding:.2rem 0;border-bottom:1px solid rgba(255,255,255,.03)}.log-entry:last-child{border-bottom:none}.log-entry.damage{color:#ff6b6b}.log-entry.heal{color:#6bcb77}.log-entry.recruit{color:#ffd93d}.log-entry.victory{color:#ffd93d;font-weight:700;font-size:.9rem}.winner-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:100;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.winner-card{text-align:center;padding:3rem;border:1px solid rgba(255,255,255,.1);border-radius:1.5rem;background:#ffffff0a;display:flex;flex-direction:column;align-items:center;gap:1rem}.winner-text{font-size:3rem;font-weight:900}.winner-text.red{color:#ff6b6b}.winner-text.blue{color:#4d96ff}.winner-sub{font-size:1rem;color:#ffffff80}@keyframes flash-red{0%{background-color:#ff000026}to{background-color:transparent}}.flash-damage{animation:flash-red .4s ease-out}.battle-log::-webkit-scrollbar{width:6px}.battle-log::-webkit-scrollbar-track{background:transparent}.battle-log::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:3px}@media(max-width:700px){.battle-arena{grid-template-columns:1fr;gap:1rem}.vs-divider{padding:.5rem 0}.game-title{font-size:1.8rem}}