.battle-brief{margin:0 0 24px;border-block:1px solid #a5ada9;background:#e9e8de;color:#17283e}
.battle-brief>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:54px;padding:12px 18px;cursor:pointer;list-style:none;font-size:14px;font-weight:800}
.battle-brief>summary::-webkit-details-marker{display:none}.battle-brief>summary small{color:#566867;font-size:10px;letter-spacing:.08em;font-weight:500}.battle-brief>summary::after{content:'+';font-size:20px;font-weight:400}.battle-brief[open]>summary::after{content:'−'}
.guide-steps{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:0;padding:0}
.guide-step{min-width:0;padding:18px;border-left:1px solid #a5ada966}.guide-step:first-child{border-left:0}.guide-step h3{font-size:16px;letter-spacing:-.5px;margin:12px 0 8px}.guide-step p{font-size:12px;line-height:1.8;margin:0;color:#506267}.guide-step .guide-detail{margin-top:10px}
.guide-art{height:66px;display:flex;align-items:center;gap:5px;position:relative;color:#173847}.guide-art:after{content:attr(data-label);position:absolute;right:0;bottom:0;font:9px/1.5 Georgia,serif;letter-spacing:.18em;color:#617679}
.guide-mini{width:36px;height:49px;display:grid;place-items:center;background:#29444b;color:#f2d6a5;border:1px solid #92a8a4;border-radius:3px;box-shadow:2px 3px #17384720;font:700 14px/1 Georgia,serif}
.guide-art[data-step=summon] .guide-mini:nth-child(2){transform:translate(-20px,-4px) rotate(7deg)}.guide-art[data-step=summon] .guide-mini:nth-child(3){transform:translate(-40px,-8px) rotate(14deg)}
.guide-art[data-step=deploy]{display:grid;grid-template-columns:repeat(3,32px);grid-template-rows:repeat(2,27px);gap:4px}.guide-art[data-step=deploy] .guide-mini{width:32px;height:27px;background:#c3d0c8;color:#476761;border-color:#96aca4;box-shadow:none;font-size:13px}.guide-art[data-step=deploy] .guide-mini:nth-child(2){background:#29444b;color:#f2d6a5;border-color:#ba995f}
.guide-art[data-step=merge] .guide-mini{width:28px;height:39px;font-size:12px}.guide-art[data-step=merge] .guide-mini:last-child{width:36px;height:49px;margin-left:12px;background:#a57e40;color:#fff2d0;border-color:#e2c488;box-shadow:0 0 0 3px #bd935c22}
.brief-footer{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 18px;padding:13px 0;border-top:1px solid #a5ada966}.brief-footer p{font-size:11px;line-height:1.8;margin:0;color:#506267}.brief-footer button{white-space:nowrap;font-size:12px;border-color:#7e9390;color:#24483f}
#battle-guide{width:min(820px,calc(100vw - 24px));max-height:88dvh;padding:0;background:#111f29;color:#ece1c9;border:1px solid #7e8f85;border-top:3px solid #c5a268;border-radius:8px;box-shadow:0 25px 90px #0009;overscroll-behavior:contain}
#battle-guide::backdrop{background:#060f1cda;backdrop-filter:blur(5px)}
.guide-heading{padding:26px 26px 20px;border-bottom:1px solid #4a606444}.guide-heading .eyebrow{color:#c8a46a;font-size:10px;margin-bottom:10px}.guide-heading h2{margin:0;font-size:30px;color:#f3e6ca;letter-spacing:-1px}.guide-heading>p:last-child{font-size:12px;line-height:1.8;color:#abc0c1;margin:10px 0 0}
#battle-guide .guide-steps{padding:8px 8px 0}#battle-guide .guide-step{border-color:#4a606466}#battle-guide .guide-step h3{color:#edd4a7;font-size:17px}#battle-guide .guide-step p{color:#b6c8c8;font-size:13px}#battle-guide .guide-art:after{color:#9bafaf}
#battle-guide .guide-art[data-step=deploy] .guide-mini{background:#213840;color:#9cbbbc}#battle-guide .guide-art[data-step=deploy] .guide-mini:nth-child(2){background:#a57e40;color:#fff2d0}
.guide-notes{margin:16px 26px 24px;padding:15px 18px;border-left:2px solid #af905c;background:#1c3037;color:#bed0cc;font-size:12px;line-height:1.9}.guide-notes p{margin:0 0 8px}.guide-notes p:last-child{margin:0;color:#e6c88f}
.guide-footer{position:sticky;bottom:0;padding:13px 26px;background:#14252ff5;border-top:1px solid #4a6064;display:flex;align-items:center;justify-content:space-between;gap:14px}.guide-footer p{font-size:10px;line-height:1.7;color:#aec2c0;margin:0}.guide-footer button{min-width:132px;min-height:44px;background:#c5a268;color:#15252b;border-color:#dfc08c;font-size:13px;white-space:nowrap}
#game #guide-open-battle{display:block;min-height:44px;margin-top:12px;width:100%;border-color:#80988c;color:#e8cf9d;text-align:left}
@media(max-width:600px){
.battle-brief{margin-bottom:18px}.battle-brief>summary{padding:10px 13px;gap:8px;font-size:13px}.battle-brief>summary small{font-size:8px}.guide-steps{grid-template-columns:1fr}.guide-step{display:grid;grid-template-columns:108px minmax(0,1fr);column-gap:12px;padding:13px;border-left:0;border-top:1px solid #a5ada944}.guide-step:first-child{border-top:0}.guide-art{grid-column:1;grid-row:1/4;align-self:center;height:66px}.guide-art:after{right:auto;left:0;bottom:-4px;font-size:8px}.guide-step h3{margin:0 0 6px;font-size:14px}.guide-step p{font-size:11px;line-height:1.75}.guide-step .guide-detail{margin-top:7px}.brief-footer{margin:0 13px;gap:10px;align-items:start}.brief-footer p{font-size:10px}.brief-footer button{font-size:10px;padding:8px;min-width:74px}
.guide-heading{padding:20px 18px 16px}.guide-heading h2{font-size:25px}#battle-guide .guide-steps{padding:3px}#battle-guide .guide-step{padding:16px 12px;grid-template-columns:92px minmax(0,1fr);gap:8px 10px}#battle-guide .guide-step h3{font-size:15px}#battle-guide .guide-step p{font-size:13px}.guide-notes{margin:12px 16px 18px;padding:12px;font-size:12px}.guide-footer{padding:12px 16px}.guide-footer p{font-size:9px}.guide-footer button{min-width:108px;font-size:12px}
.guide-art[data-step=deploy]{grid-template-columns:repeat(3,26px);grid-template-rows:repeat(2,25px);gap:3px}.guide-art[data-step=deploy] .guide-mini{width:26px;height:25px}
.guide-art[data-step=merge]{gap:3px}.guide-art[data-step=merge] .guide-mini{width:18px;height:31px;font-size:10px}.guide-art[data-step=merge] .guide-mini:last-child{width:26px;height:40px;margin-left:2px}
}
@media(prefers-reduced-motion:reduce){#battle-guide::backdrop{backdrop-filter:none}}