@import"https://fonts.googleapis.com/css2?family=Sora:wght@500;600;700;800&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@500;600&display=swap";:root{--bg: #0b0a12;--bg-elevated: #131120;--surface: #17142a;--surface-hover: #1d1a35;--border: rgba(139, 108, 247, .14);--border-strong: rgba(139, 108, 247, .35);--violet: #8b6cf7;--violet-bright: #a98cff;--violet-dim: rgba(139, 108, 247, .12);--emerald: #34d399;--emerald-dim: rgba(52, 211, 153, .15);--amber: #fbbf24;--rose: #fb7185;--rose-dim: rgba(251, 113, 133, .15);--text: #eae7f5;--text-dim: #948da8;--text-faint: #625c78;--radius: 14px;--radius-sm: 9px;--shadow-card: 0 1px 2px rgba(0,0,0,.3), 0 12px 28px -12px rgba(0,0,0,.5);--shadow-glow: 0 0 0 1px var(--border-strong), 0 0 24px rgba(139,108,247,.25);--font-display: "Sora", sans-serif;--font-body: "Inter", sans-serif;--font-mono: "JetBrains Mono", monospace}:root[data-theme=light]{--bg: #f4f2fa;--bg-elevated: #ffffff;--surface: #ffffff;--surface-hover: #ede9f8;--border: rgba(124, 92, 240, .18);--border-strong: rgba(124, 92, 240, .4);--violet: #7c5cf0;--violet-bright: #6941e0;--violet-dim: rgba(124, 92, 240, .1);--emerald: #059669;--emerald-dim: rgba(5, 150, 105, .12);--amber: #b45309;--rose: #e11d48;--rose-dim: rgba(225, 29, 72, .12);--text: #201c2e;--text-dim: #6b6478;--text-faint: #9891a3;--shadow-card: 0 1px 2px rgba(80,60,140,.06), 0 10px 24px -12px rgba(80,60,140,.18);--shadow-glow: 0 0 0 1px var(--border-strong), 0 0 20px rgba(124,92,240,.18)}:root[data-theme=light] body{background:radial-gradient(1100px 600px at 12% -8%,rgba(124,92,240,.06),transparent 60%),var(--bg)}*{box-sizing:border-box}body{margin:0;background:radial-gradient(1100px 600px at 12% -8%,rgba(139,108,247,.1),transparent 60%),radial-gradient(900px 500px at 100% 0%,rgba(52,211,153,.05),transparent 55%),var(--bg);color:var(--text);font-family:var(--font-body);min-height:100vh;-webkit-font-smoothing:antialiased}::selection{background:var(--violet);color:#fff}h1,h2,h3{font-family:var(--font-display);letter-spacing:-.01em}button{font-family:var(--font-body);cursor:pointer;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);padding:9px 15px;font-size:.9rem;font-weight:500;transition:background .15s ease,border-color .15s ease,transform .1s ease}button:hover{background:var(--surface-hover);border-color:var(--border-strong)}button:active{transform:scale(.98)}button.primary{background:linear-gradient(135deg,var(--violet),#7458e0);color:#fff;font-weight:600;border-color:transparent;box-shadow:0 4px 14px -4px #8b6cf799}button.primary:hover{background:linear-gradient(135deg,var(--violet-bright),var(--violet))}button.danger{border-color:#fb71854d;color:var(--rose);background:transparent}button.danger:hover{background:var(--rose-dim);border-color:var(--rose)}input,textarea,select{font-family:var(--font-body);background:var(--bg-elevated);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);padding:9px 12px;font-size:.92rem}input::placeholder,textarea::placeholder{color:var(--text-faint)}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--violet);box-shadow:0 0 0 3px var(--violet-dim)}.app-shell{display:flex;min-height:100vh}.sidebar{width:240px;flex-shrink:0;background:linear-gradient(180deg,var(--surface),var(--bg-elevated));border-right:1px solid var(--border);padding:22px 14px;position:sticky;top:0;height:100vh}.sidebar h1{font-size:1.25rem;font-weight:800;margin:0 0 2px;background:linear-gradient(135deg,var(--violet-bright),var(--emerald));-webkit-background-clip:text;background-clip:text;color:transparent}.sidebar .campaign-name{font-size:.78rem;color:var(--text-dim);margin-bottom:20px;font-family:var(--font-mono)}.sidebar nav{display:flex;flex-direction:column;gap:2px}.sidebar nav a{color:var(--text-dim);text-decoration:none;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-sm);font-size:.92rem;font-weight:500;transition:all .15s ease}.sidebar nav a svg{width:17px;height:17px;flex-shrink:0;opacity:.8}.sidebar nav a:hover{background:var(--surface-hover);color:var(--text)}.sidebar nav a.active{background:var(--violet-dim);color:var(--violet-bright);font-weight:600}.sidebar nav a.active svg{opacity:1}.main-content{flex:1;padding:32px 40px;max-width:1040px}.main-content h2{font-size:1.7rem;margin:0 0 20px;font-weight:700}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px;margin-bottom:14px;box-shadow:var(--shadow-card);transition:border-color .15s ease,transform .15s ease}.card h3{margin-top:0;margin-bottom:8px;font-size:1.05rem;font-weight:600;color:var(--text)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}.hp-bar-track{background:#00000059;border-radius:20px;height:8px;overflow:hidden;margin:8px 0}.hp-bar-fill{height:100%;border-radius:20px;background:linear-gradient(90deg,var(--emerald),#6ee7b7);transition:width .25s ease}.hp-bar-fill.low{background:linear-gradient(90deg,var(--rose),#fda4af)}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row-between{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}label{display:block;font-size:.78rem;color:var(--text-dim);margin-bottom:4px;font-weight:500}.field{margin-bottom:12px}.badge{display:inline-flex;align-items:center;background:var(--bg-elevated);border:1px solid var(--border);border-radius:20px;padding:3px 11px;font-size:.76rem;font-family:var(--font-mono);color:var(--text-dim)}.active-turn{border-color:var(--violet)!important;position:relative;animation:turnPulse 1.6s ease-in-out infinite}@keyframes turnPulse{0%,to{box-shadow:0 0 0 1px var(--border-strong),0 0 12px #8b6cf733}50%{box-shadow:0 0 0 2px var(--violet-bright),0 0 28px #8b6cf78c}}@keyframes flashDamage{0%{background-color:#fb718580;transform:translate(0)}10%{transform:translate(-8px) rotate(-1deg)}20%{transform:translate(7px) rotate(1deg)}30%{transform:translate(-6px)}40%{transform:translate(5px)}55%{transform:translate(-3px)}70%{transform:translate(2px)}to{background-color:transparent;transform:translate(0) rotate(0)}}@keyframes flashHeal{0%{background-color:#34d39959}to{background-color:transparent}}.flash-damage{animation:flashDamage .8s ease-out;border-radius:var(--radius, 14px)}.flash-heal{animation:flashHeal .8s ease-out;border-radius:var(--radius, 14px)}@keyframes diceSpin{0%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.15)}to{transform:rotate(360deg) scale(1)}}.dice-spinning{display:inline-block;animation:diceSpin .5s linear infinite}.mood-tint{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5;transition:background 1.2s ease;animation:moodFlash 1s ease-out}@keyframes moodFlash{0%{filter:brightness(2.2)}to{filter:brightness(1)}}.mood-tenso{background:radial-gradient(ellipse at 50% 0%,rgba(251,113,133,.45),transparent 80%)}.mood-misterioso{background:radial-gradient(ellipse at 50% 0%,rgba(139,108,247,.48),transparent 80%)}.mood-alegre{background:radial-gradient(ellipse at 50% 0%,rgba(251,191,36,.42),transparent 80%)}.mood-tranquilo{background:radial-gradient(ellipse at 50% 0%,rgba(52,211,153,.36),transparent 80%)}.mood-neutro{background:transparent;animation:none}@keyframes confettiFall{0%{transform:translateY(-10px) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}.confetti-piece{position:fixed;top:0;width:8px;height:14px;z-index:2000;animation:confettiFall linear forwards}.active-turn:before{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:var(--radius);padding:1px;pointer-events:none;background:linear-gradient(135deg,var(--violet-bright),transparent 60%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.dice-result{font-size:3rem;font-weight:800;font-family:var(--font-display);text-align:center;margin:14px 0;background:linear-gradient(135deg,var(--violet-bright),var(--emerald));-webkit-background-clip:text;background-clip:text;color:transparent}.empty-state{color:var(--text-faint);font-style:italic;padding:24px 0;text-align:center}@media (max-width: 640px){.app-shell{flex-direction:column}.sidebar{width:100%;height:auto;position:relative;border-right:none;border-bottom:1px solid var(--border)}.sidebar nav{flex-direction:row;overflow-x:auto}.main-content{padding:18px}}
