:root{--bg-deepest:#0a0a12;--bg-deep:#12121e;--bg-base:#1a1a2e;--bg-card:#1e1e32;--bg-elevated:#252540;--bg-hover:#2e2e4a;--gold:#d4a843;--gold-dim:#c9952a;--gold-bright:#e8c455;--gold-bg:#d4a8431a;--gold-border:#d4a8434d;--text-primary:#e8e6e3;--text-secondary:#a09b94;--text-muted:#6b6660;--text-gold:#d4a843;--border:#3a3a52;--border-light:#4a4a62;--border-gold:#d4a84366;--danger:#c0392b;--danger-dim:#a0301f;--heal:#27ae60;--heal-dim:#1e8449;--accent-purple:#9b59b6;--accent-blue:#3498db;--whisper-purple:#8e44ad;--hp-full:#27ae60;--hp-half:#f39c12;--hp-low:#c0392b;--sidebar-width:360px;--bottombar-height:80px;--topbar-height:48px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--shadow-sm:0 1px 3px #0006;--shadow-md:0 4px 12px #00000080;--shadow-lg:0 8px 24px #0009;--shadow-gold:0 0 12px #d4a8434d;--font-body:"Segoe UI", system-ui, -apple-system, sans-serif;--font-display:Georgia, "Times New Roman", serif}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden}body{font-family:var(--font-body);color:var(--text-primary);background:var(--bg-deepest);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:14px;line-height:1.5}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-deep)}::-webkit-scrollbar-thumb{background:var(--border-light);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}button{font-family:var(--font-body);cursor:pointer;color:var(--text-primary);background:0 0;border:none;outline:none;font-size:14px}button:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg, var(--gold-dim), var(--gold));color:#1a1a2e;border-radius:var(--radius-md);border:1px solid var(--gold);justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-weight:600;transition:all .2s;display:inline-flex}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg, var(--gold), var(--gold-bright));box-shadow:var(--shadow-gold);transform:translateY(-1px)}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-secondary{background:var(--bg-elevated);color:var(--text-primary);border-radius:var(--radius-md);border:1px solid var(--border);justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-weight:500;transition:all .2s;display:inline-flex}.btn-secondary:hover:not(:disabled){background:var(--bg-hover);border-color:var(--border-light)}.btn-danger{background:var(--danger);color:var(--text-primary);border-radius:var(--radius-md);border:1px solid var(--danger);justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-weight:600;transition:all .2s;display:inline-flex}.btn-danger:hover:not(:disabled){background:var(--danger-dim)}.btn-icon{border-radius:var(--radius-sm);width:36px;height:36px;color:var(--text-secondary);background:0 0;justify-content:center;align-items:center;transition:all .15s;display:inline-flex}.btn-icon:hover{background:var(--bg-hover);color:var(--text-primary)}.btn-icon.active{background:var(--gold-bg);color:var(--gold)}input,textarea,select{font-family:var(--font-body);color:var(--text-primary);background:var(--bg-deep);border:1px solid var(--border);border-radius:var(--radius-md);outline:none;width:100%;padding:10px 14px;font-size:14px;transition:border-color .2s}input::placeholder,textarea::placeholder{color:var(--text-muted)}input:focus,textarea:focus,select:focus{border-color:var(--gold-dim);box-shadow:0 0 0 2px #d4a84326}select{appearance:none;cursor:pointer}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px}.card-elevated{background:var(--bg-elevated);border:1px solid var(--border-light);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:24px}.flex{display:flex}.flex-col{flex-direction:column}.flex-1{flex:1}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-xs{gap:4px}.gap-sm{gap:8px}.gap-md{gap:16px}.gap-lg{gap:24px}.text-gold{color:var(--gold)}.text-muted{color:var(--text-secondary)}.text-center{text-align:center}.font-display{font-family:var(--font-display)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.badge{text-transform:uppercase;letter-spacing:.5px;border-radius:var(--radius-sm);background:var(--bg-elevated);color:var(--text-secondary);border:1px solid var(--border);align-items:center;padding:2px 8px;font-size:11px;font-weight:600;display:inline-flex}.badge-gold{background:var(--gold-bg);color:var(--gold);border-color:var(--gold-border)}.badge-danger{color:var(--danger);background:#c0392b26;border-color:#c0392b4d}.badge-purple{color:var(--accent-purple);background:#9b59b626;border-color:#9b59b64d}.tooltip{position:relative}.tooltip:after{content:attr(data-tooltip);background:var(--bg-deep);color:var(--text-primary);border-radius:var(--radius-sm);border:1px solid var(--border);white-space:nowrap;pointer-events:none;opacity:0;z-index:100;padding:4px 8px;font-size:12px;transition:opacity .15s;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.tooltip:hover:after{opacity:1}.divider{background:var(--border);width:100%;height:1px;margin:8px 0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes goldGlow{0%,to{box-shadow:0 0 8px #d4a8434d}50%{box-shadow:0 0 20px #d4a84399}}@keyframes scaleIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.animate-fade-in{animation:.3s fadeIn}.animate-slide-up{animation:.3s slideUp}.animate-pulse{animation:2s ease-in-out infinite pulse}.animate-gold-glow{animation:2s ease-in-out infinite goldGlow}.animate-scale-in{animation:.2s scaleIn}