.hero-reference-actions,.hero-choice-tools {display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.hero-reference-actions button,.hero-choice-tools button {flex:1;min-height:44px;padding:6px 8px;font-size:.76rem}
.hero-reference-actions {margin-bottom:5px}
.hero-grid {gap:24px 18px;align-items:stretch}
.hero-grid>.hero-option {display:flex;flex-direction:column;min-width:0;transform:none}
.hero-option .hero-choice {width:100%;flex:none;border-radius:6px 6px 0 0}
.hero-option .hero-choice .hero-label {font-size:1.1rem;padding:10px 12px}
.hero-power-summary {flex:1;background:#f3e7c9;color:#30271c;padding:14px 15px;border:2px solid #9a8159;border-top:0;border-radius:0 0 5px 5px;box-shadow:2px 4px 0 #17120b80}
.hero-power-label {font-size:.8rem;color:#5e4930}
.hero-power-summary h3 {margin:3px 0 8px;font-size:1.4rem;line-height:1.15;color:#30271c}
.hero-power-effect {font-size:1rem;line-height:1.4;font-weight:700;margin:0 0 10px}
.hero-power-cost {font-size:.88rem;line-height:1.4;margin:0;padding-top:9px;border-top:1px solid #b29a72}
.hero-option .hero-choice-tools {flex-wrap:nowrap;align-items:stretch;gap:8px;margin-top:10px}
.hero-option .hero-choice-tools button {font-size:.88rem;min-height:58px;padding:8px}
.hero-option .hero-choice-tools .hero-choice-guide {flex:2;background:#efc671;color:#292118;border:2px solid #ffe2a2;box-shadow:2px 3px 0 #17120b80}
.hero-choice-guide strong,.hero-choice-guide span {display:block}
.hero-choice-guide strong {font-size:1rem}
.hero-choice-guide span {font-size:.78rem;line-height:1.3;margin-top:3px}
.hero-option .hero-choice-guide:hover:not(:disabled) {background:#ffe2a2}
@media(max-width:520px){.hero-grid{grid-template-columns:1fr;gap:24px}.hero-power-summary{padding:14px 16px}.hero-option .hero-choice-tools button{min-height:60px}.hero-choice-guide span{font-size:.84rem}}
.hero-portrait-button {min-height:44px;padding:0;border:0;box-shadow:none;background:transparent;border-radius:50%;flex:none}
.hero-portrait-button:hover:not(:disabled) {background:transparent;outline:2px solid #f1cc7a;outline-offset:3px}
.hero-guide-dialog {width:min(1040px,calc(100vw - 24px));max-width:1040px}
.hero-guide-top {position:sticky;top:0;z-index:3;background:#342d24}
.hero-guide-tabs {display:flex;gap:8px;background:#342d24;padding:8px 0 12px;margin-bottom:14px}
.hero-guide-tabs button {flex:1;min-height:46px}
.hero-guide-tabs button[aria-pressed=true] {background:#efc671;color:#292118;border-color:#ffe2a2;font-weight:700}
.hero-guide-ability {display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:24px;align-items:start}
.hero-mat-preview {display:block;width:100%;padding:0;background:transparent;box-shadow:none;border:0}
.hero-mat-preview img {display:block;width:100%;max-height:60dvh;object-fit:contain}
.hero-skill-art {display:block;position:relative;height:180px;overflow:hidden;background:#fff;border:2px solid #bca879;border-radius:3px}
.hero-mat-preview .hero-skill-art img {position:absolute;width:300%;max-width:none;max-height:none;height:auto;left:-100%;bottom:0}
.hero-mat-caption {display:block;margin-top:9px;color:#f1cc7a;text-decoration:underline;font-size:.88rem}
.hero-guide-rules {font-size:1rem;line-height:1.5}
.hero-guide-rules h3 {font-size:1.65rem;color:#ffe5a3}
.hero-guide-effect {font-size:1.2rem;font-weight:700;color:#fff0d0}
.hero-guide-rules ol {padding-left:22px}
.hero-guide-rules li {margin:12px 0}
.hero-guide-note {font-size:.88rem;color:#ddcbaa;margin:14px 0}
.hero-deck-heading {display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;border-bottom:1px solid #8f7c5a;padding-bottom:10px;margin:25px 0 16px}
.hero-deck-heading h3 {margin:0;font-size:1.15rem}
.hero-deck-heading span {color:#e5d4b5;font-size:.88rem}
.hero-deck-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px}
.hero-deck-card {display:flex;flex-direction:column;align-items:stretch;justify-content:start;background:#f3e7c9;color:#30271c;padding:8px;text-align:left;border:2px solid #a28b63;border-radius:5px;box-shadow:2px 4px 0 #17120b80;min-width:0}
.hero-deck-card:hover:not(:disabled) {background:#fff0d0}
.hero-deck-card .reference-card-title {display:flex;justify-content:space-between;align-items:baseline;gap:8px;font:700 1rem Georgia,serif;margin:4px 1px 9px}
.reference-quantity {white-space:nowrap;font-size:1.15rem}
.hero-deck-card img {width:100%;height:190px;object-fit:contain;display:block;border-radius:3px}
.hero-deck-card .reference-card-effect {font-size:.86rem;line-height:1.35;margin:10px 2px 4px}
.hero-guide-back {margin:0 0 16px;min-height:44px}
.hero-mat-full {display:block;width:100%;max-height:72dvh;object-fit:contain}
@media(max-width:720px){.hero-guide-dialog{padding:16px}.hero-guide-dialog .dialog-head h2{font-size:1.5rem}.hero-guide-ability{grid-template-columns:1fr;gap:22px}.hero-mat-preview img{max-height:42dvh}.hero-guide-rules h3{font-size:1.5rem}.hero-deck-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.hero-deck-card{padding:6px}.hero-deck-card img{height:158px}.hero-deck-card .reference-card-title{font-size:.85rem;flex-wrap:wrap;gap:3px}.reference-quantity{font-size:1rem}.hero-deck-card .reference-card-effect{font-size:.8rem}.hero-guide-tabs{gap:6px}.hero-guide-tabs button{padding:8px 6px;font-size:.86rem}.hero-reference-actions{grid-column:1/-1}}
@media(max-width:370px){.hero-deck-grid{grid-template-columns:1fr}.hero-deck-card img{height:230px}.hero-guide-tabs{flex-wrap:wrap}.hero-guide-tabs button{flex-basis:100%}}
