/* Additional guide sections use the established cold steel surfaces. */
.hero-page-content.hero-with-profile{grid-template-areas:'top top' 'analysis analysis' 'alternatives alternatives' 'situations situations' 'matchups matchups' 'maps maps' 'tips tips' 'meta meta' 'talents talents' 'sources sources'}
#hero-alternative-builds{grid-area:alternatives}#hero-matchups{grid-area:matchups}#hero-maps{grid-area:maps}#hero-tips{grid-area:tips}#hero-meta{grid-area:meta}
.guide-section{min-width:0;padding:18px;border:1px solid;border-color:#5b7592 #30455f #1c2b43 #3c526e;border-radius:8px;background:linear-gradient(145deg,#1a2a42,#131f33 36%,#101b2d);box-shadow:inset 0 1px 0 #c5e0ff12,0 10px 22px #02081433}
.guide-section-head{display:flex;align-items:center;gap:11px;margin-bottom:17px;min-width:0}
.guide-section-head h2{font-size:20px;line-height:1.35;letter-spacing:-.015em;margin:0}
.guide-section-number{display:grid;place-items:center;width:30px;height:30px;flex:0 0 30px;border:1px solid #56718c;border-radius:5px;background:#25405a;color:#acd7ec;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.guide-section-count{margin-left:auto;color:#8faac1;font-size:12px}
.guide-section p{font-size:13px;line-height:1.65;color:var(--sub)}
.guide-section .guide-context{margin:16px 0 0;padding-top:13px;border-top:1px solid #526b854d}
.guide-role-note{margin:7px 0 0;color:#8faac1!important;font-size:12px!important}
.matchup-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.matchup-group{min-width:0;padding:15px;border:1px solid #4d67804d;border-radius:6px;background:#07132255}
.matchup-allies{box-shadow:inset 0 2px 0 #9dcadd88;background:linear-gradient(160deg,#a2d8f810,#08121e44)}
.matchup-counters{box-shadow:inset 0 2px 0 #747f9c66;background:#060e1c66}
.matchup-group h3{font-size:16px;margin:0 0 8px;color:#dfedf6}
.matchup-group>p{margin:0 0 15px;min-height:3.3em;font-size:12px}
.matchup-heroes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;list-style:none;padding:0;margin:0}
.matchup-counters .matchup-heroes{grid-template-columns:repeat(2,minmax(0,1fr))}
.matchup-heroes li{display:flex;align-items:center;gap:8px;padding:8px 5px;min-width:0;border-bottom:1px solid #4d678033}
.matchup-heroes li>span:last-child{min-width:0}
.matchup-heroes strong{font-size:12px;font-weight:700;line-height:1.4;display:block;overflow-wrap:anywhere}
.matchup-heroes small{display:block;margin-top:2px;color:#8faac1;font-size:10px;line-height:1.4}
.matchup-portrait{width:34px;height:41px;flex:0 0 34px;display:grid;place-items:center;overflow:hidden;border:1px solid #5f7a9299;border-radius:5px;background:#1a2a40}
.matchup-portrait img{width:100%;height:100%;object-fit:cover;object-position:center 25%}
.map-groups{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.map-group{padding:14px;border:1px solid #4b637e6b;border-radius:6px;background:#08142266;min-width:0}
.map-strong{background:radial-gradient(ellipse at top right,#64b9e31c,transparent 70%),#142a3c99;border-color:#6b9bb88c}
.map-average{grid-column:1/-1}
.map-group-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.map-group h3{font-size:15px;margin:0;line-height:1.4}
.map-group-heading>span{color:#91b3ca;font-size:11px;font-variant-numeric:tabular-nums}
.map-group p{margin:0 0 12px;color:#98b8cd;font-size:11px}
.map-group ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.map-average ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 16px}
.map-group li{display:flex;align-items:center;gap:8px;font-size:12px;line-height:1.5;color:#c6dce9;min-width:0}
.map-strong li{font-size:20px;color:#e2f4ff;font-family:'Russo One',sans-serif}
.map-location-mark{width:6px;height:6px;flex:0 0 6px;border:1px solid #80abc6;transform:rotate(45deg);opacity:.7}
.map-strong .map-location-mark{background:#8acfe8;opacity:1}
.map-weak .map-location-mark{border-color:#7c869e}
.guide-tips-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.guide-tip{padding:14px;border:1px solid #49627a66;border-radius:6px;background:#09162666;min-width:0}
.guide-tip-top{display:flex;align-items:center;gap:12px;margin-bottom:9px}
.guide-tip-top>div{min-width:0}
.guide-tip h3{font-size:14px;line-height:1.4;margin:0 0 3px}
.guide-tip .guide-ability-icon{width:44px;height:44px;border-radius:6px;background:#142b40;border-color:#6b86a0;padding:0;flex:0 0 44px;cursor:pointer}
.guide-ability-icon img{width:100%;height:100%;object-fit:cover}
.guide-tip-ability{display:inline;background:transparent;color:#8db9d2;border:0;padding:4px 0;font-size:11px;line-height:1.5;text-align:left;cursor:help}
.guide-tip>p{margin:0;font-size:12px}
.guide-tip kbd{border:1px solid #59728b80;border-radius:3px;padding:0 4px;background:#20354c;color:#c7dfef;font:inherit;font-size:11px;white-space:nowrap}
.guide-section .hero-battle-plan{grid-area:auto;background:#07132266;border:0;border-left:2px solid #709db4;border-radius:0;padding:4px 13px 6px;margin:0 0 16px;box-shadow:none}
.guide-section .hero-battle-plan h3{font-size:14px;margin:0 0 5px}
.guide-section .hero-battle-plan p{font-size:12px}
.guide-meta-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.guide-role{padding:14px;border:1px solid #536c844d;border-radius:6px;background:#08132166;position:relative}
.guide-role-index{display:block;margin-bottom:9px;font-size:10px;letter-spacing:.1em;color:#7898b0}
.guide-role h3{font-size:16px;margin:0 0 8px}
.guide-role p{font-size:12px;margin:0}
.alternative-builds-list{display:grid;gap:9px}
.alternative-build{border:1px solid #56708b66;border-radius:6px;overflow:clip;background:#09162655;min-width:0}
.alternative-build>summary{list-style:none;display:flex;align-items:center;gap:12px;min-height:56px;padding:12px 15px;cursor:pointer}
.alternative-build>summary::-webkit-details-marker{display:none}
.alternative-build>summary:hover{background:#98c7e509}
.alternative-build-name{font-size:15px;font-weight:700;line-height:1.45}
.alternative-build-label{font-size:11px;color:#94b4cb;margin-left:auto;white-space:nowrap}
.alternative-build-lock{font-size:10px;color:#8c9db4;padding:3px 6px;border:1px solid #54647c66;border-radius:4px}
.alternative-toggle{font-size:20px;line-height:1;color:#93b6ce;margin-left:5px}
.alternative-build[open] .alternative-toggle{font-size:0}.alternative-build[open] .alternative-toggle:after{content:'-';font-size:20px}
.hero-page-content .alternative-build-card{padding:13px 15px;border:0;border-radius:0;background:#08132055;box-shadow:none;border-top:1px solid #56708b55}
.alternative-build-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:9px}
.alternative-build-controls>p{font-size:11px!important;color:#8faac1!important}
.alternative-build-note{margin-top:8px!important;color:#8faac1!important;font-size:12px!important}
.alternative-build-locked{padding:0 15px 14px}.alternative-build-locked p{margin:0 0 4px;font-size:12px}
.alternative-build-locked .text-button{font-size:12px;min-height:34px;color:#9ec9e0}
#situations .situations>p{margin-bottom:14px}
#situations .situations{display:grid;grid-template-columns:1fr 1fr;gap:9px 12px}
#situations .situations>h3,#situations .situations>p{grid-column:1/-1;margin-bottom:0}
#situations .situation{margin-bottom:0;min-width:0}
#situations .situation-button{min-height:52px;font-size:12px}
.guide-section :focus-visible{outline:2px solid #9fd7ed;outline-offset:3px}
@media(max-width:1100px){.matchup-heroes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){
  .hero-page-content.hero-with-profile{grid-template-areas:'top' 'analysis' 'alternatives' 'situations' 'matchups' 'maps' 'tips' 'meta' 'talents' 'sources'}
  .guide-section{padding:15px}.matchup-columns{grid-template-columns:1fr}.matchup-group>p{min-height:0}
  .matchup-heroes{grid-template-columns:repeat(3,minmax(0,1fr))}.matchup-counters .matchup-heroes{grid-template-columns:repeat(3,minmax(0,1fr))}
  .guide-meta-grid{grid-template-columns:1fr}.guide-role{padding:13px}.guide-role-index{display:none}
  .alternative-build>summary{flex-wrap:wrap;gap:6px 10px}.alternative-build-name{flex:1 1 auto}.alternative-build-label{order:2;margin:0;flex-basis:100%;font-size:10px}
  .alternative-build-lock{margin-left:auto}.alternative-toggle{margin-left:0}
}
@media(max-width:540px){
  .guide-section-head h2{font-size:18px}.guide-section-number{width:26px;height:26px;flex-basis:26px;font-size:10px}
  .guide-tips-grid,.map-groups{grid-template-columns:1fr}.map-average{grid-column:auto}.map-average ul{grid-template-columns:1fr}
  .map-strong li{font-size:19px}.matchup-heroes,.matchup-counters .matchup-heroes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .guide-tip{padding:12px}.guide-tip h3{font-size:13px}.guide-context{font-size:12px!important}
  #situations .situations{grid-template-columns:1fr}.alternative-build-name{font-size:13px}
  .alternative-build-lock{font-size:9px}.alternative-build-controls{align-items:center;gap:5px}
}