.hero-stats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;margin:8px 0;background:#101a25ed;padding:6px;border-radius:10px}
.hero-stats label{text-align:center;font-size:11px;color:#c5d4e4}
.hero-stats input{display:block;width:100%;min-width:0;background:#17283b;color:#fff;border:1px solid #56708b;border-radius:6px;text-align:center;font-size:14px;padding:4px 0}
.hero-stats b{display:block;font-size:12px}
.hero-quick,.hero-options{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:6px 0;font-size:12px}
.hero-quick button,.hero-sheet button{background:#243d58;color:#fff;border:1px solid #6b8298;border-radius:8px;padding:5px 7px;cursor:pointer;font-size:12px}
.hero-quick .equipped{background:#315d39;border-color:#a3d49a}
.hero-quick input,.hero-sheet input[type=number]{width:48px;background:#142334;color:white;border:1px solid #536d86;border-radius:5px;padding:3px}
.hero-sheet{background:#102030ed;border:1px solid #4d6580;border-radius:8px;padding:7px;margin:6px 0;font-size:12px}
.hero-sheet summary{cursor:pointer;font-weight:600;padding:3px 0}
.hero-sheet details{margin:6px 0;border-top:1px solid #425363;padding-top:5px}
.hero-tables{display:grid;grid-template-columns:minmax(85px,.7fr) minmax(0,1.7fr);gap:6px;align-items:start}
.hero-tables table{width:100%;border-collapse:collapse;font-size:11px}
.hero-tables caption{font-weight:bold;padding:6px 0;color:#e6d7b4}
.hero-tables td{padding:4px 2px;border-bottom:1px solid #3f5061}
.hero-tables td:last-child{text-align:right;font-weight:bold;white-space:nowrap}
.hero-sheet select{background:#17283b;color:white;border:1px solid #536d86;border-radius:4px;padding:2px;max-width:100%;font-size:11px}
.hero-sheet p{margin:6px 0;line-height:1.4}
.hero-item{display:flex;gap:4px;align-items:center;margin:5px 0}
.hero-item-name{min-width:0;width:100%;background:#17283b;color:white;border:1px solid #536d86;border-radius:5px;padding:4px}
.hero-weapon{margin:7px 0;line-height:1.6;border-bottom:1px solid #425363}
.hero-weapon>div{display:flex;gap:5px;flex-wrap:wrap}
.hero-slot-max{width:36px;background:#17283b;color:white;border:1px solid #536d86;border-radius:4px;text-align:center}
/* Compact combat cards; expanded controls belong to the master sheet. */
.hero-stat-summary{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:3px;padding:3px;margin:3px 0;background:#0006;border-radius:6px;text-align:center;font-size:10px}
.hero-stat-summary span{display:block;color:#b7c2d3;font-size:9px}
.hero-stat-summary b{display:block;font-size:10px;white-space:nowrap}
.hero-quick-compact{margin:4px 0;gap:5px}
.hero-quick-compact button{padding:3px 7px;font-size:11px;border-radius:20px;background:#253247b8;border-color:#546276}
#heroDetailModal .hero-modal-content{width:min(900px,95vw);max-width:900px;max-height:90vh;padding:24px;border-radius:22px;background:linear-gradient(145deg,#172330,#101823)!important;border:1px solid #46586b;color:#e9eef5}
.hero-modal-header{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:0 24px 16px 0;border-bottom:1px solid #38495b}
.hero-modal-header h2{font-size:26px;margin:6px 0;color:#f7f9fc}
.hero-modal-header p{font-size:13px;color:#aebfd0;margin:0}
.hero-modal-eyebrow{color:#8caac6;letter-spacing:2px;font-size:10px}
.hero-modal-section{margin:16px 0;padding:16px;border:1px solid #33465a;border-radius:14px;background:#15202ce0}
.hero-modal-section h3{font-size:14px;color:#d9e7f4;margin:0 0 12px}
.hero-modal-section .hero-stats{gap:10px;background:none;padding:0}
.hero-modal-section .hero-stats label{font-size:12px}
.hero-modal-section .hero-stats input{padding:8px;font-size:18px;border-radius:9px;background:#101b28}
.hero-modal-section .hero-stats b{padding:5px}
.hero-modal-section .hero-tables{grid-template-columns:1fr 2fr;gap:22px}
.hero-modal-section .hero-tables table{font-size:13px}
.hero-modal-section .hero-tables td{padding:7px 4px}
.hero-modal-section .hero-tables select{font-size:12px;padding:4px}
.hero-modal-section .hero-options{gap:12px;line-height:1.8}
.hero-modal-slots{display:flex;flex-wrap:wrap;gap:10px}
.hero-modal-slot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px;background:#101b28;border:1px solid #33465a;border-radius:9px;font-size:13px}
.hero-modal-slot button{border:1px solid #527393;border-radius:6px;background:#253b52;color:white;width:27px;height:27px;cursor:pointer}
.hero-modal-slot input{width:42px;background:#152a3e;border:1px solid #527393;border-radius:6px;color:white;padding:4px}
@media(max-width:600px){#heroDetailModal .hero-modal-content{padding:14px;border-radius:14px}.hero-modal-header{flex-wrap:wrap}.hero-modal-header h2{font-size:21px}.hero-modal-section{padding:10px}.hero-modal-section .hero-tables{grid-template-columns:1fr}.hero-modal-section .hero-stats{gap:4px}.hero-modal-section .hero-stats input{padding:6px 0;font-size:16px}}

.hero-skills-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:start}
.hero-skill-group{min-width:0;padding:12px;background:#101b28;border:1px solid #33465a;border-radius:12px}
.hero-skill-group h4{display:flex;justify-content:space-between;margin:0 0 8px;color:#9fbdd9;font-size:12px;letter-spacing:1px}
.hero-skill-row{display:grid;grid-template-columns:minmax(0,1fr) 62px 26px;gap:5px;align-items:center;min-height:34px;border-top:1px solid #26384a;font-size:12px}
.hero-skill-row b{text-align:right;color:#f1d39c;font-variant-numeric:tabular-nums}
.hero-skill-row select{width:62px;padding:4px;border-radius:6px}
.hero-skills-title{margin:18px 0 10px;font-size:14px;color:#d9e7f4}
.hero-saves table{width:100%;border-collapse:collapse;font-size:13px}
.hero-saves caption{text-align:left;padding:8px 0;font-weight:600;color:#d9e7f4}
.hero-saves tbody{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.hero-saves tr{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;background:#101b28;border:1px solid #33465a;border-radius:9px}
.hero-saves td:last-child{color:#f1d39c;font-weight:600}
@media(max-width:760px){.hero-skills-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.hero-skills-grid{grid-template-columns:1fr}.hero-saves tbody{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Keep scores, labels and modifiers in the same grid cell. */
#heroDetailModal .hero-stats label{display:grid;grid-template-rows:auto auto auto;justify-items:stretch;min-width:0;gap:4px}
#heroDetailModal .hero-stats input[type=number]{width:100%;max-width:none;margin:0;box-sizing:border-box}
#heroDetailModal .hero-stats b{text-align:center;padding:0}
#heroDetailModal .hero-modal-content{box-sizing:border-box}
#heroDetailModal .hero-skill-row{grid-template-columns:minmax(0,1fr) 76px 30px}
#heroDetailModal .hero-skill-row select{width:100%;min-width:0}
#heroDetailModal .hero-options label{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap}
#heroDetailModal .hero-saves tr{min-width:0;gap:10px}
@media(max-width:600px){#heroDetailModal .hero-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
