/* Eight stops between midnight and dawn. */
.campaign-panel{margin:0 0 24px;padding:18px 20px 13px;background:#141c19;border:1px solid #3e4a38}
.campaign-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:16px}
.campaign-heading .eyebrow{font-size:7px;letter-spacing:1px}
.campaign-heading p{margin:9px 0 0;font-size:10px;letter-spacing:.7px;color:#d5ddc8}
.campaign-tools{text-align:right;flex-shrink:0}
.campaign-tools>span{display:block;color:#94ac81;font-size:7px;letter-spacing:.5px}
.campaign-tools button{margin-top:7px;font-size:6px;color:#c1ae88}
.campaign-route{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:7px}
.route-stop{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:9px;text-align:left;border:1px solid #354234;background:#101714;padding:11px 8px;color:#71846b;min-width:0;min-height:88px}
.route-stop:disabled{opacity:.53}
.route-stop>span{font-family:var(--pixel);font-size:12px;font-weight:400;color:#788a71}
.route-stop>b{font-weight:400;font-size:7px;letter-spacing:.2px;line-height:1.5;color:#9eaf96;min-height:22px}
.route-stop>small{font-size:5px;letter-spacing:1px;margin-top:auto}
.route-stop.current{border-color:var(--orange);background:#30291e;box-shadow:inset 0 -2px #c77c4b}
.route-stop.current>span,.route-stop.current>small{color:#ffb27c}
.route-stop.current>b{color:#f2dbc1}
.route-stop.current:disabled,.route-stop.cleared:disabled{opacity:1}
.route-stop.cleared{border-color:#6b8551;background:#202c1c}
.route-stop.cleared>span,.route-stop.cleared>small{color:var(--green)}
.route-stop:hover:enabled{border-color:#d7e6b5;transform:translateY(-2px)}
.campaign-guide{color:#839679;font-size:8px;line-height:1.7;margin:13px 0 0}
.campaign-objective{display:flex;align-items:center;gap:16px;background:#20291e;border-bottom:1px solid #4e6044;padding:10px 24px;font-size:9px;line-height:1.5;color:#c7d5b7}
.campaign-objective>b{color:#eab77e;font-size:8px;letter-spacing:.7px;white-space:nowrap;font-weight:400}
.arcade.is-expanded .campaign-objective{flex-shrink:0;padding-left:5vw;padding-right:5vw}
.stage-picker{flex-wrap:wrap;justify-content:flex-end}
.story-next{max-width:132px;line-height:1.8}
.result-card{max-width:720px}
.result-card .eyebrow{font-size:8px;line-height:1.8}
.result-card p{max-width:560px;margin-left:auto;margin-right:auto}
body[data-mode=complete] .result-card h2{color:#ffe2a3}
@media(max-width:1000px){
  .campaign-route{grid-template-columns:repeat(4,minmax(0,1fr))}
  .route-stop{min-height:72px;gap:7px;display:grid;grid-template-columns:22px 1fr;align-items:center}
  .route-stop>span{grid-row:span 2;font-size:10px}
  .route-stop>b{min-height:0;font-size:8px}
  .route-stop>small{margin-top:0}
  .campaign-heading .eyebrow{font-size:6px}
  .campaign-objective{font-size:8px;padding:8px 16px;gap:12px}
}
@media(max-width:550px){
  .campaign-panel{padding:13px 12px 10px;margin-bottom:17px}
  .campaign-heading{align-items:flex-start;gap:9px;margin-bottom:12px}
  .campaign-heading .eyebrow{font-size:5px;letter-spacing:.4px;line-height:1.6}
  .campaign-heading p{font-size:8px;line-height:1.6;margin-top:6px}
  .campaign-tools{max-width:95px}
  .campaign-tools>span{font-size:5px;line-height:1.7}
  .campaign-tools button{font-size:5px;white-space:normal;line-height:1.7}
  .campaign-route{gap:5px}
  .route-stop{display:flex;gap:6px;padding:8px 5px;min-height:81px}
  .route-stop>span{font-size:10px}
  .route-stop>b{font-size:6px;line-height:1.5;min-height:18px}
  .route-stop>small{font-size:4px;letter-spacing:.5px;margin-top:auto}
  .campaign-guide{font-size:7px;line-height:1.7;margin-top:10px}
  .campaign-objective{padding:8px 11px;font-size:7px;gap:9px}
  .campaign-objective>b{font-size:6px;max-width:72px;white-space:normal}
  .stage-picker{max-width:140px;gap:4px}
  .stage-picker>span{display:none}
  .stage-option{height:18px;width:25px}
  body[data-mode=story] .screen{min-height:310px;aspect-ratio:auto}
  body[data-mode=story] #game-canvas{position:absolute;inset:0;object-fit:cover}
  .story-overlay{padding:12px}
  .story-title{margin-top:23px;max-width:100%}
  .story-title h2{font-size:13px;line-height:1.7}
  .story-dialogue{min-height:128px;align-items:flex-start;gap:7px;padding:10px}
  .story-copy p{font-size:11px;line-height:1.6}
  .story-copy>b{font-size:6px;line-height:1.8;display:block}
  .story-next{font-size:5px;padding:8px 7px;max-width:74px;align-self:flex-end}
  .result-card .eyebrow{font-size:5px}
  .result-card p{font-size:9px}
  .result-actions{gap:10px}
  .result-actions .start-button{font-size:6px;white-space:normal;line-height:1.7;padding:12px}
  .result-actions .secondary-button{font-size:7px;padding:12px}
}