:root{font-family:system-ui,'Yu Gothic',sans-serif;color:#dce7f2;background:#0b1220;line-height:1.65;color-scheme:dark}*{box-sizing:border-box}body{margin:0}header,main,footer{max-width:1200px;margin:auto;padding:28px}header{padding-top:48px}h1{font-size:clamp(27px,4vw,44px);margin:8px 0}h2{font-size:21px;margin:0 0 14px}h3{font-size:17px}.eyebrow{letter-spacing:.18em;color:#82c3d8;font-size:12px}.tag,.notice{color:#b6c5d8}.tag{border:1px solid #3a4c63;border-radius:20px;padding:5px 12px;font-size:12px}.notice{padding:16px;background:#142237;border-left:3px solid #78bfcf;border-radius:6px}.panel,.score{background:#121e30;border:1px solid #293a51;border-radius:14px;padding:24px;margin-top:22px}.cards{display:grid;grid-template-columns:1fr 1fr;gap:18px}.score strong{display:block;font-size:34px}.score:first-child{border-top:3px solid #67d3da}.score:last-child{border-top:3px solid #f6b278}.muted,footer{color:#96a9bf;font-size:13px}.battle{display:grid;grid-template-columns:1fr 1fr;gap:24px}#map{position:relative;aspect-ratio:1;background:radial-gradient(ellipse,#213047,#0d1727);border-radius:12px;margin-top:12px}.node{position:absolute;transform:translate(-50%,-50%);border:1px solid #536177;border-radius:7px;padding:7px 4px;font-size:11px;min-width:72px;text-align:center;background:#243044;color:white}.node.A{background:#17565e;border-color:#67d3da}.node.B{background:#69452f;border-color:#f6b278}.camp{position:absolute;font-weight:bold;font-size:12px}.campA{left:4%;top:3%;color:#67d3da}.campB{right:4%;bottom:3%;color:#f6b278}input,select,button,.file{font:inherit;border:1px solid #415169;background:#0e1829;color:#e6edf5;border-radius:6px;padding:7px}button,.file{cursor:pointer}button:hover{background:#29405a}input[type=range]{width:100%;accent-color:#67d3da}output{font-size:23px;margin-left:12px;color:#67d3da}.toolbar,.extras{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}.event{padding:16px 0;border-top:1px solid #314057}.fields{display:grid;grid-template-columns:1.5fr .6fr 1.4fr 1fr 1fr 1fr 1fr auto;gap:8px;align-items:end}.fields label{font-size:12px}.fields input,.fields select{width:100%;min-width:0}.stages{font-size:12px;color:#a5bbd2;margin-top:8px}.error{color:#ffc0b7}#errors:not(:empty){background:#42262a;border-radius:8px;padding:14px;margin-top:12px}.legend{color:#67d3da;font-size:13px}.legend span{color:#f6b278}svg{width:100%;background:#0e1829;border-radius:10px}.trackrow{display:grid;grid-template-columns:135px 1fr;gap:12px;margin:6px 0;font-size:12px}.track{height:20px;position:relative;background:#293348;border-radius:3px;overflow:hidden}.segment{height:100%;position:absolute}.segment.A{background:#429ca7}.segment.B{background:#bd8359}.marker{position:absolute;height:100%;border-left:2px solid white;top:0}.file input{max-width:200px;margin-left:10px}.extras input{max-width:130px}footer{text-align:center}@media(max-width:700px){header,main,footer{padding:18px}.panel{padding:16px}.battle{grid-template-columns:1fr}.fields{grid-template-columns:1fr 1fr}.cards{gap:10px}.score{padding:14px}.score strong{font-size:26px}.trackrow{grid-template-columns:100px 1fr}.node{min-width:59px;font-size:9px;padding:5px 2px}}

/* Reference-relative facility placement: compact markers keep the original geometry readable. */
#map{border:2px solid #48647e;background:radial-gradient(ellipse at center,#263a50 0%,#142235 62%,#0d1727 100%)}
.node{border:0;border-radius:0;padding:0;min-width:0;width:42px;background:transparent!important;color:#c5cfdb;text-align:center;line-height:1.15;z-index:1}
.node-icon{display:block;font-size:25px;line-height:27px;text-shadow:0 1px 3px #000}
.node-label{display:block;font-size:10px;white-space:nowrap;text-shadow:0 1px 3px #000}
.node.A{color:#67d3da}.node.B{color:#f6b278}
.campA{left:3%;top:3%}.campB{right:3%;bottom:3%}
@media(max-width:700px){.node{width:36px;padding:0;min-width:0}.node-icon{font-size:21px;line-height:23px}.node-label{font-size:9px}}

.campA{left:2%;top:49%;font-size:10px}.campB{right:2%;bottom:auto;top:49%;font-size:10px}

.failure-panel{margin:24px 0;padding:16px;background:#0b1728;border:1px solid #3a506c;border-radius:12px}#sodomPhases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.failure-card{padding:16px;background:#17263a;border-radius:10px}.failure-card h3{margin:0}.stepper{display:flex;align-items:center;justify-content:space-between;gap:10px}.stepper button{min-width:48px;min-height:48px;font-size:24px}.stepper strong{font-size:26px}.stepper small{font-size:13px}button:disabled{opacity:.4;cursor:default}summary{cursor:pointer;font-weight:600;padding:12px 0}.fields{grid-template-columns:repeat(4,minmax(0,1fr))}@media(max-width:700px){#sodomPhases{grid-template-columns:1fr}.fields{grid-template-columns:1fr 1fr}}

/* Equal, independent desktop scroll regions; natural document flow on narrow screens. */
header,main,footer{max-width:1560px}
.simulator-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-items:start;margin-top:22px}
.settings-column,.battle-column,.battle>div{min-width:0}
.settings-column>.panel:first-child,.battle-column>.cards .score{margin-top:0}
.battle-column .panel{margin-top:18px}
.battle-column .battle{grid-template-columns:minmax(0,1fr);gap:18px}
.battle-column #map{width:100%;max-width:420px;justify-self:center}
.battle-column .score strong{font-size:clamp(24px,2.2vw,34px)}
.battle-column .score{padding:16px}
.battle-column .trackrow{grid-template-columns:minmax(0,145px) minmax(0,1fr)}
.settings-column p,.settings-column .stages,.battle-column p,.trackrow>span{overflow-wrap:anywhere}
.settings-column .file{max-width:100%}.settings-column .file input{max-width:100%;margin-left:0}
@media(min-width:1100px){
 .simulator-layout{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr)}
 .simulator-layout{height:calc(100vh - 32px);height:calc(100dvh - 32px);min-height:0}
 .settings-column,.battle-column{position:static;height:100%;max-height:100%;min-height:0;overflow-y:scroll;overflow-x:hidden;overscroll-behavior-y:contain;scrollbar-gutter:stable;padding-right:8px;padding-bottom:24px;scroll-padding-block:12px}
}
@media(max-width:1099px){
 .simulator-layout{height:auto}
 .settings-column,.battle-column{position:static;height:auto;max-height:none;overflow:visible;padding-right:0;padding-bottom:0;overscroll-behavior:auto}
}
@media(max-width:700px){
 .simulator-layout{gap:18px}.battle-column .trackrow{grid-template-columns:minmax(0,118px) minmax(0,1fr)}
 .stepper{gap:6px}.stepper strong{font-size:23px}.stepper button{min-width:44px}
}

.settings-column:focus-visible,.battle-column:focus-visible{outline:2px solid #82c3d8;outline-offset:3px}

/* Compact failure controls; the details element itself is never re-rendered. */
.failure-panel{padding:12px;margin:16px 0;font-size:13px}
.failure-panel>summary{padding:2px 0;font-size:16px}
.failure-overview{display:block;margin:4px 0 0 18px;font-size:12px;font-weight:400;color:#b7cce0}
.failure-panel[open]>summary{margin-bottom:10px}
#sodomPhases{gap:8px}.failure-card{padding:10px}.failure-card h3{font-size:14px}.failure-card p{margin:5px 0;font-size:12px}
.stepper{gap:6px}.stepper button{min-width:34px;min-height:34px;padding:2px 7px;font-size:20px}.stepper strong{font-size:22px}.stepper small{font-size:12px}
#sodomSummary p{margin:5px 0}
@media(max-width:700px),(pointer:coarse){.stepper button{min-width:44px;min-height:44px}.failure-panel>summary{min-height:44px}}

#attackMinutes{width:100px;max-width:100%}

.fortress-summary{white-space:pre-line;line-height:1.7} #fortressFalls select,#fortressFalls input{max-width:100%;min-height:44px}