: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}.shell{min-height:100vh;display:grid;place-items:center;padding:2rem}h1{margin:0 0 .5rem;font-size:1.5rem;font-weight:600;letter-spacing:-.02em}p{margin:0;color:#ffffffa6;font-size:.95rem}.dragon-arena{background:#7f1d1d;color:#fecaca;padding:24px;border-radius:15px;max-width:600px;width:100%;display:flex;flex-direction:column;gap:20px}.arena-header h1{color:#fef2f2}.arena-header p{color:#fecaca}.dragon-roster{display:flex;gap:8px;flex-wrap:wrap}.roster-btn{background:#00000040;border:2px solid transparent;border-radius:8px;padding:6px 12px;color:#fecaca;cursor:pointer;font-size:.85rem;display:flex;align-items:center;gap:6px;transition:border-color .15s,background .15s}.roster-btn:hover{background:#0006}.roster-btn.active{border-color:#fca5a5;background:#00000073}.roster-emoji{font-size:1.1rem}.roster-name{font-weight:600}.roster-lv{font-size:.75rem;opacity:.7}.hatch-btn{border-style:dashed;border-color:#fff3;color:#fff9}.hatch-btn:hover{border-color:#fca5a5;color:#fecaca}.dragon-panel{display:flex;flex-direction:column;gap:20px}.dragon-info{background:#0003;border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:14px}.dragon-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.dragon-title h2{margin:0;font-size:1.3rem;color:#fef2f2}.dragon-element-badge{background:#00000059;padding:3px 10px;border-radius:6px;font-size:.8rem;text-transform:capitalize}.dragon-level{margin-left:auto;font-size:.85rem;opacity:.7}.stat-bars{display:flex;flex-direction:column;gap:8px}.stat-bar{display:grid;grid-template-columns:30px 1fr 60px;align-items:center;gap:8px;font-size:.8rem}.stat-label{font-weight:600;opacity:.7}.bar-track{height:10px;background:#00000059;border-radius:5px;overflow:hidden}.bar-fill{height:100%;border-radius:5px;transition:width .3s ease}.hp-fill{background:linear-gradient(90deg,#ef4444,#f87171)}.xp-fill{background:linear-gradient(90deg,#a855f7,#c084fc)}.stat-value{text-align:right;font-size:.75rem;opacity:.8}.stat-grid{display:flex;gap:12px}.stat-cell{flex:1;background:#00000040;border-radius:8px;padding:10px;text-align:center;display:flex;flex-direction:column;gap:2px}.stat-num{font-size:1.3rem;font-weight:700;color:#fef2f2}.stat-name{font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;opacity:.6}.action-panels{display:flex;gap:16px}@media(max-width:560px){.action-panels{flex-direction:column}}.panel{flex:1;background:#0003;border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:10px}.panel h3{margin:0;font-size:.95rem;color:#fef2f2}.training-options{display:grid;grid-template-columns:1fr 1fr;gap:6px}.train-btn{background:#0000004d;border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:8px 6px;color:#fecaca;font-size:.78rem;cursor:pointer;transition:background .15s,border-color .15s}.train-btn:hover{background:#00000080;border-color:#fca5a5}.arena-find-btn,.fight-btn{width:100%;padding:10px;border:none;border-radius:8px;font-weight:600;font-size:.9rem;cursor:pointer;transition:background .15s}.arena-find-btn{background:#00000059;color:#fecaca}.arena-find-btn:hover{background:#0000008c}.fight-btn{background:#dc2626;color:#fff}.fight-btn:hover{background:#b91c1c}.matchup{display:flex;flex-direction:column;gap:8px}.matchup-card{background:#0000004d;border-radius:8px;padding:10px;display:flex;flex-direction:column;align-items:center;gap:4px}.matchup-emoji{font-size:1.6rem}.matchup-name{font-weight:700;color:#fef2f2}.matchup-stats{font-size:.75rem;opacity:.7}.battle-log{background:#0000004d;border-radius:8px;padding:10px;max-height:180px;overflow-y:auto;display:flex;flex-direction:column;gap:3px}.battle-log p{font-size:.78rem;margin:0;color:#ffffffb3}.battle-log .log-final{font-weight:700;color:#fef2f2;margin-top:4px}.log-msg{font-size:.8rem;margin:0;color:#fbbf24;font-weight:600}