@import "https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700;900&family=Cinzel:wght@400;500;600;700&family=Inter:wght@300;400;500;600;700&display=swap";:root{--bg-deep:#09070a;--bg-base:#0f0c10;--bg-surface:#161219;--bg-elevated:#1e1822;--bg-panel:#261f2c;--bg-hover:#2f2838;--gold-dim:#6a541a;--gold:#c9a227;--gold-light:#e8c547;--gold-bright:#f5d76e;--gold-glow:#c9a22733;--gold-glow-strong:#c9a22766;--crimson-dark:#5a0f0f;--crimson:#8b1a1a;--crimson-light:#c0392b;--crimson-glow:#8b1a1a4d;--arcane-dark:#3a1f5e;--arcane:#6b3fa0;--arcane-light:#9d6edb;--arcane-glow:#6b3fa040;--nature:#2d6a4f;--nature-light:#52b788;--divine:#c77d2b;--divine-light:#e8973e;--text-primary:#f0e6d3;--text-secondary:#b8a898;--text-muted:#6b5d52;--text-gold:var(--gold);--border:#2a2030;--border-gold:#4a3810;--border-bright:#6a5420;--font-title:"Cinzel Decorative", serif;--font-head:"Cinzel", serif;--font-body:"Inter", sans-serif;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:20px;--radius-full:9999px;--shadow-sm:0 2px 8px #0006;--shadow-md:0 4px 20px #0009;--shadow-lg:0 8px 40px #000c;--shadow-gold:0 0 20px var(--gold-glow);--shadow-gold-strong:0 0 40px var(--gold-glow-strong);--transition-fast:.15s ease;--transition-base:.25s ease;--transition-slow:.4s ease;--z-base:1;--z-modal:100;--z-tooltip:200;--z-top:999}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-body);background-color:var(--bg-base);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;line-height:1.6;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(at 20% 10%,#8b1a1a0f 0%,#0000 50%),radial-gradient(at 80% 90%,#6b3fa00f 0%,#0000 50%),radial-gradient(#c9a22708 0%,#0000 60%);position:fixed;inset:0}#root{z-index:1;position:relative}h1,h2,h3,h4,h5,h6{font-family:var(--font-head);color:var(--text-primary);line-height:1.2}.title-epic{font-family:var(--font-title);letter-spacing:.05em;background:linear-gradient(135deg, var(--gold-bright) 0%, var(--gold) 50%, var(--gold-dim) 100%);-webkit-text-fill-color:transparent;text-shadow:none;-webkit-background-clip:text;background-clip:text;font-weight:700}.title-section{font-family:var(--font-head);color:var(--gold-light);letter-spacing:.08em;text-transform:uppercase;font-size:1.5rem;font-weight:600}.text-gold{color:var(--gold)}.text-muted{color:var(--text-muted)}.text-secondary{color:var(--text-secondary)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-base)}::-webkit-scrollbar-thumb{background:var(--gold-dim);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--gold)}.btn{align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);border-radius:var(--radius-md);font-family:var(--font-head);letter-spacing:.05em;cursor:pointer;transition:all var(--transition-base);white-space:nowrap;border:none;font-size:.9rem;font-weight:600;text-decoration:none;display:inline-flex;position:relative;overflow:hidden}.btn:before{content:"";opacity:0;transition:opacity var(--transition-fast);background:linear-gradient(135deg,#ffffff0d 0%,#0000 100%);position:absolute;inset:0}.btn:hover:before{opacity:1}.btn-primary{background:linear-gradient(135deg, var(--gold) 0%, #a07d1a 100%);color:var(--bg-deep);box-shadow:0 4px 15px var(--gold-glow), inset 0 1px 0 #fff3}.btn-primary:hover{background:linear-gradient(135deg, var(--gold-light) 0%, var(--gold) 100%);box-shadow:0 6px 25px var(--gold-glow-strong);transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}.btn-secondary{color:var(--gold);border:1px solid var(--border-gold);background:0 0;box-shadow:inset 0 0 10px #c9a2270d}.btn-secondary:hover{background:var(--gold-glow);border-color:var(--gold);box-shadow:0 0 15px var(--gold-glow)}.btn-ghost{color:var(--text-secondary);border:1px solid var(--border);background:0 0}.btn-ghost:hover{background:var(--bg-elevated);color:var(--text-primary);border-color:var(--border-gold)}.btn-danger{background:linear-gradient(135deg, var(--crimson) 0%, var(--crimson-dark) 100%);color:var(--text-primary);box-shadow:0 4px 15px var(--crimson-glow)}.btn-danger:hover{background:linear-gradient(135deg, var(--crimson-light) 0%, var(--crimson) 100%);transform:translateY(-1px)}.btn-lg{padding:var(--space-4) var(--space-8);font-size:1.1rem}.btn-sm{padding:var(--space-2) var(--space-4);font-size:.8rem}.btn:disabled{opacity:.4;cursor:not-allowed;transform:none!important}.card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg);transition:all var(--transition-base);position:relative;overflow:hidden}.card:before{content:"";background:linear-gradient(90deg, transparent, var(--border-gold), transparent);opacity:0;height:1px;transition:opacity var(--transition-base);position:absolute;top:0;left:0;right:0}.card:hover:before{opacity:1}.card-clickable{cursor:pointer}.card-clickable:hover{background:var(--bg-elevated);border-color:var(--border-gold);box-shadow:var(--shadow-gold), var(--shadow-sm);transform:translateY(-2px)}.card-selected{background:var(--bg-elevated);border-color:var(--gold);box-shadow:var(--shadow-gold-strong), 0 0 0 1px var(--gold-dim)}.card-selected:before{opacity:1}.input{width:100%;padding:var(--space-3) var(--space-4);background:var(--bg-deep);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-body);transition:all var(--transition-fast);outline:none;font-size:.95rem}.input:focus{border-color:var(--gold-dim);box-shadow:0 0 0 2px var(--gold-glow)}.input::placeholder{color:var(--text-muted)}.textarea{resize:vertical;min-height:80px}.label{font-family:var(--font-head);color:var(--text-secondary);letter-spacing:.08em;text-transform:uppercase;margin-bottom:var(--space-2);font-size:.8rem;font-weight:600;display:block}.badge{align-items:center;gap:var(--space-1);padding:2px var(--space-3);border-radius:var(--radius-full);letter-spacing:.05em;text-transform:uppercase;font-size:.75rem;font-weight:600;display:inline-flex}.badge-gold{color:var(--gold-light);border:1px solid var(--gold-dim);background:#c9a22726}.badge-red{color:#e57373;border:1px solid var(--crimson);background:#8b1a1a33}.badge-purple{color:var(--arcane-light);border:1px solid var(--arcane);background:#6b3fa033}.badge-green{color:var(--nature-light);border:1px solid var(--nature);background:#2d6a4f33}.divider{align-items:center;gap:var(--space-4);margin:var(--space-6) 0;display:flex}.divider:before,.divider:after{content:"";background:linear-gradient(90deg, transparent, var(--border-gold), transparent);flex:1;height:1px}.divider span{font-family:var(--font-head);color:var(--gold-dim);letter-spacing:.2em;text-transform:uppercase;white-space:nowrap;font-size:.75rem}.stat-block{background:var(--bg-deep);border:2px solid var(--border-gold);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);flex-direction:column;justify-content:center;align-items:center;min-width:80px;display:flex;position:relative}.stat-block__label{font-family:var(--font-head);color:var(--gold-dim);letter-spacing:.12em;text-transform:uppercase;margin-bottom:var(--space-1);font-size:.65rem;font-weight:700}.stat-block__score{font-family:var(--font-head);color:var(--text-primary);font-size:1.6rem;font-weight:700;line-height:1}.stat-block__mod{background:var(--gold);color:var(--bg-deep);font-family:var(--font-head);border-radius:var(--radius-full);margin-top:var(--space-2);text-align:center;min-width:40px;padding:2px 10px;font-size:.85rem;font-weight:700}.tooltip-wrapper{display:inline-flex;position:relative}.tooltip-content{background:var(--bg-panel);border:1px solid var(--border-gold);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);color:var(--text-secondary);white-space:nowrap;white-space:normal;max-width:280px;box-shadow:var(--shadow-md);z-index:var(--z-tooltip);pointer-events:none;font-size:.8rem;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.container{max-width:1200px;padding:0 var(--space-6);margin:0 auto}.container-wide{max-width:1400px;padding:0 var(--space-8);margin:0 auto}.container-narrow{max-width:800px;padding:0 var(--space-6);margin:0 auto}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-2{gap:var(--space-2)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.grid-cards{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(240px,1fr));display:grid}.grid-cards-lg{gap:var(--space-5);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));display:grid}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes slideRight{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes glow-pulse{0%,to{box-shadow:0 0 10px var(--gold-glow)}50%{box-shadow:0 0 25px var(--gold-glow-strong)}}@keyframes shimmer{0%{background-position:-200%}to{background-position:200%}}.animate-fade-in{animation:.3s both fadeIn}.animate-slide-right{animation:.3s both slideRight}.class-barbaro{--class-color:#c0392b}.class-bardo{--class-color:#9b59b6}.class-clerigo{--class-color:#f39c12}.class-druida{--class-color:#27ae60}.class-guerrero{--class-color:#e74c3c}.class-monje{--class-color:#1abc9c}.class-paladin{--class-color:#f1c40f}.class-explorador{--class-color:#2ecc71}.class-picaro{--class-color:#95a5a6}.class-hechicero{--class-color:#e74c3c}.class-brujo{--class-color:#8e44ad}.class-mago{--class-color:#3498db}::selection{background:var(--gold-glow-strong);color:var(--gold-bright)}