@font-face{font-family:'Fira Sans';font-weight:400;font-display:swap;src:url(fonts/FiraSans-400.woff2) format('woff2');}
@font-face{font-family:'Fira Sans';font-weight:600;font-display:swap;src:url(fonts/FiraSans-600.woff2) format('woff2');}
@font-face{font-family:'Fira Sans';font-weight:700;font-display:swap;src:url(fonts/FiraSans-700.woff2) format('woff2');}
@font-face{font-family:'Fira Sans Condensed';font-weight:500;font-display:swap;src:url(fonts/FiraSansCondensed-500.woff2) format('woff2');}
@font-face{font-family:'Plex Mono';font-weight:500;font-display:swap;src:url(fonts/IBMPlexMono-500.woff2) format('woff2');}
@font-face{font-family:'Plex Mono';font-weight:600;font-display:swap;src:url(fonts/IBMPlexMono-600.woff2) format('woff2');}

:root{
  --y:#F7C31E; --k:#1C1C1A; --k2:#262624; --w:#F4F2EA; --paper:#E9E5DA; --rule:#B9B4A6;
  --g:#3E9A5B; --a:#E58A1F; --r:#C8402E; --blue:#3B6FB6;
  --topH:56px; --palW:84px;
  --sans:'Fira Sans',system-ui,sans-serif; --cond:'Fira Sans Condensed','Fira Sans',sans-serif; --mono:'Plex Mono',ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html,body{width:100%;height:100%;overflow:hidden;background:#9DB07A;font-family:var(--sans);color:var(--w);
  -webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
#game{position:fixed;inset:0}
#game canvas{display:block}

.ico{display:inline-block;width:22px;height:22px;flex:none;background:currentColor;
  -webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.ico.y{color:var(--y)}
.ico-plane{--m:url(img/ic_plane.png)} .ico-money{--m:url(img/ic_money.png)} .ico-pax{--m:url(img/ic_pax.png)}
.ico-clock{--m:url(img/ic_clock.png)} .ico-calendar{--m:url(img/ic_calendar.png)} .ico-terminal{--m:url(img/ic_terminal.png)}
.ico-gate{--m:url(img/ic_gate.png)} .ico-checkin{--m:url(img/ic_checkin.png)} .ico-security{--m:url(img/ic_security.png)}
.ico-runway{--m:url(img/ic_runway.png)} .ico-taxiway{--m:url(img/ic_taxiway.png)} .ico-parking{--m:url(img/ic_parking.png)}
.ico-service{--m:url(img/ic_service.png)} .ico-bulldoze{--m:url(img/ic_bulldoze.png)} .ico-route{--m:url(img/ic_route.png)}
.ico-finance{--m:url(img/ic_finance.png)} .ico-staff{--m:url(img/ic_staff.png)} .ico-warning{--m:url(img/ic_warning.png)}
.ico-star{--m:url(img/ic_star.png)} .ico-tower{--m:url(img/ic_tower.png)}

/* ---------- top sign strip ---------- */
#top{position:fixed;left:0;right:0;top:0;height:var(--topH);background:var(--k);display:flex;align-items:stretch;z-index:45;
  border-bottom:2px solid #000;box-shadow:0 2px 6px rgba(0,0,0,.35);padding-top:env(safe-area-inset-top)}
#top>div{display:flex;align-items:center;gap:10px;padding:0 14px;border-right:1px solid #3a3a37}
.brand .yellowbox{width:36px;height:36px;background:var(--k);box-shadow:inset 0 0 0 36px var(--y);-webkit-mask:none;mask:none;position:relative}
.brand .yellowbox::after{content:"";position:absolute;inset:5px;background:var(--k);-webkit-mask:url(img/ic_plane.png) center/contain no-repeat;mask:url(img/ic_plane.png) center/contain no-repeat}
.brandtext{display:flex;flex-direction:column;line-height:1.15}
.brandtext b{font-weight:600;font-size:14px;letter-spacing:.06em;white-space:nowrap}
.brandtext small{font-size:10px;letter-spacing:.08em;color:#c9c6bb}
.readout .ico{width:26px;height:26px}
.rv{display:flex;flex-direction:column;justify-content:center;position:relative}
.r-money .rv{flex-direction:row;align-items:center;gap:6px}
.dollar{font-family:var(--mono);font-size:20px;color:var(--w)}
.lab{font-size:10px;letter-spacing:.12em;color:#d8d5ca;font-weight:600}
.profit{position:absolute;left:18px;top:100%;margin-top:-4px;font-family:var(--mono);font-size:11px;color:var(--w);white-space:nowrap;
  opacity:0;transform:perspective(200px) rotateX(-90deg);transform-origin:top;transition:transform .25s,opacity .25s}
.profit.show{opacity:1;transform:none}
.profit.neg{color:#ff9c8c}
.ontime{display:flex;align-items:center;gap:7px}
.ontime b{font-family:var(--mono);font-size:19px;font-weight:600}
.dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.dot.g{background:var(--g)} .dot.a{background:var(--a)} .dot.r{background:var(--r)}
.ctrls{margin-left:auto;border-right:0!important;gap:4px!important;padding:0 10px!important}
.ctrls .sp,.ctrls .tb{height:32px;min-width:34px;padding:0 6px;background:var(--k2);border:1px solid #44443f;color:var(--w);font-size:11px;letter-spacing:-.1em;display:flex;align-items:center;justify-content:center}
.ctrls .tb{font-size:16px;letter-spacing:0;font-weight:700}
.ctrls .tb .ico{width:18px;height:18px;color:var(--y)}
.ctrls .sp.on{background:var(--y);color:var(--k);border-color:var(--y)}
.ctrls .tb.off{color:#777}
.ctrls .sep{width:6px}

/* split-flap */
.flaps{display:inline-flex;gap:2px}
.fc{position:relative;display:inline-block;width:.78em;height:1.3em;line-height:1.3em;text-align:center;background:#2b2b28;color:var(--w);
  font-family:var(--mono);font-weight:500;border-radius:1px;overflow:hidden}
.fc::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(0,0,0,.65)}
.fc.sepc{background:none;width:.45em}
.fc.flip{animation:flip .09s linear}
@keyframes flip{0%{transform:scaleY(1);filter:brightness(1)}50%{transform:scaleY(.6);filter:brightness(.7)}100%{transform:scaleY(1);filter:brightness(1)}}
#money,#pax,#clock{font-size:19px}

/* ---------- palette ---------- */
#palette{position:fixed;left:6px;top:calc(var(--topH) + 10px);width:var(--palW);z-index:15;display:flex;flex-direction:column;gap:5px;
  overflow-y:auto;scrollbar-width:none;background:var(--k);padding:5px;border:1px solid #000;max-height:calc(100% - var(--topH) - 20px)}
#palette::-webkit-scrollbar{display:none}
.tile{flex:none;width:100%;height:min(calc(var(--palW) - 10px),calc((100vh - var(--topH) - 32px - 40px) / 10 - 1px));background:var(--y);color:var(--k);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  border:2px solid var(--y);position:relative}
.tile .ico{width:30px;height:30px}
.tile b{font-size:10px;font-weight:700;letter-spacing:.06em}
.tile small{font-family:var(--cond);font-size:10.5px;font-weight:500}
.tile.sel{background:var(--k);color:var(--y);border-color:var(--y)}
.tile.poor small{color:var(--r)}
.tile.sel.poor small{color:#ff7a66}
.tile.demo{background:#d9d5ca}
.tile.demo.sel{background:var(--k)}
#toolhint{position:fixed;left:calc(var(--palW) + 18px);bottom:12px;z-index:15;background:var(--k);color:var(--w);font-size:13px;padding:8px 12px;border-left:4px solid var(--y);
  display:none;max-width:min(520px,calc(100% - var(--palW) - 40px));line-height:1.35}
#toolhint.on{display:block}
#toolhint button{margin-left:10px;background:var(--y);color:var(--k);font-weight:700;font-size:11px;padding:4px 8px;letter-spacing:.06em}

/* ---------- departures board ---------- */
#board{position:fixed;right:8px;top:calc(var(--topH) + 10px);width:min(420px,40vw);z-index:15;background:var(--k);border:1px solid #000;box-shadow:0 4px 14px rgba(0,0,0,.35);
  display:flex;flex-direction:column;max-height:calc(100% - var(--topH) - 20px)}
#board.min{display:none}
.bhead{display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid #3a3a37}
.bhead>b{color:var(--y);font-size:18px;font-weight:600;letter-spacing:.02em}
.btabs{margin-left:auto;display:flex}
.btabs button{font-size:10px;letter-spacing:.12em;font-weight:700;padding:5px 8px;color:#bbb;border:1px solid #44443f}
.btabs button.on{background:var(--y);color:var(--k);border-color:var(--y)}
#bCollapse{font-size:22px;color:var(--y);width:28px;line-height:1}
#boardTab{position:fixed;right:8px;top:calc(var(--topH) + 10px);z-index:15;background:var(--k);color:var(--y);font-weight:700;font-size:12px;letter-spacing:.1em;
  padding:9px 12px;display:none;align-items:center;gap:8px;border:1px solid #000}
#boardTab .ico{width:18px;height:18px}
#board.min+#boardTab{display:flex}
.bcols,.brow{display:grid;grid-template-columns:5.2em 5.6em 1fr 2.6em 7.8em;gap:6px;padding:0 10px}
.bcols{font-size:10px;letter-spacing:.1em;color:#cfccc0;padding-top:6px;padding-bottom:4px}
#rows{padding-bottom:8px;overflow-y:auto}
.brow{height:24px;align-items:center;font-size:12px}
.brow .flaps{gap:1px}
.brow .fc{width:.74em;height:1.45em;line-height:1.45em;background:#252523}
.brow .st .fc{color:var(--g)}
.brow.delayed .st .fc{color:var(--a)}
.brow.cancelled .st .fc{color:var(--r)}
.brow.departed .st .fc{color:#9b998f}
.brow.boarding .st .fc{color:#6fd18e}
.brow.empty{opacity:.5}
.boardfoot{font-size:11px;color:#bdbab0;padding:6px 10px 10px;border-top:1px solid #333;line-height:1.4}

#bRoutes{overflow-y:auto;padding:8px 10px 12px;font-size:13px}
.rt{display:grid;grid-template-columns:1fr auto;gap:2px 8px;padding:8px 0;border-bottom:1px solid #34342f}
.rt .nm{font-weight:600;letter-spacing:.04em}
.rt .meta{font-size:11px;color:#bdbab0;grid-column:1}
.rt .freq{grid-row:1/3;grid-column:2;display:flex;align-items:center;gap:4px}
.rt .freq b{font-family:var(--mono);min-width:2.6em;text-align:center}
.rt .freq button,.rbtn{background:var(--k2);border:1px solid #55554f;min-width:30px;height:28px;font-weight:700}
.rt .freq .rbtn.y,.rbtn.y{background:var(--y);color:var(--k);border-color:var(--y);padding:0 10px;font-size:11px;letter-spacing:.06em}
.rbtn:disabled{opacity:.35;cursor:default}
.chip{display:inline-block;width:10px;height:10px;margin-right:6px;vertical-align:-1px}
.rsec{font-size:10px;letter-spacing:.14em;color:var(--y);font-weight:700;margin:12px 0 2px}
.rt.locked{opacity:.5}

/* ---------- clipboard panel ---------- */
#panel{position:fixed;right:8px;bottom:10px;width:min(340px,calc(100% - 16px));z-index:18;background:var(--paper);color:var(--k);border:1px solid #8f8a7d;
  box-shadow:0 6px 18px rgba(0,0,0,.35);border-radius:2px;max-height:calc(100% - var(--topH) - 24px);display:flex;flex-direction:column}
.phead{background:var(--k);color:var(--y);display:flex;align-items:center;gap:10px;padding:10px 12px}
.phead b{font-size:17px;font-weight:600;flex:1}
.phead .ico{width:24px;height:24px}
#pClose{color:var(--w);font-size:24px;line-height:1;width:28px}
.ptabs{display:flex;border-bottom:1px solid var(--rule)}
.ptabs button{flex:1;padding:9px 4px;font-size:11px;font-weight:700;letter-spacing:.1em;color:#55534c;border-right:1px solid var(--rule)}
.ptabs button:last-child{border-right:0}
.ptabs button.on{color:var(--k);box-shadow:inset 0 -3px 0 var(--k);background:#f4f1e8}
#pBody{padding:6px 14px 14px;overflow-y:auto;font-size:13px}
.kv{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--rule);letter-spacing:.04em}
.kv span:first-child{text-transform:uppercase;font-size:11.5px;color:#3d3b35}
.kv span:last-child{font-variant-numeric:tabular-nums;font-family:var(--mono);font-size:13px;text-align:right}
.kv.warn span:last-child{color:var(--r)}
.kv.ok span:last-child{color:var(--g)}
.pbtn{display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:10px;background:var(--y);color:var(--k);font-weight:700;font-size:15px;
  padding:11px 14px;letter-spacing:.06em;border:1px solid #c99b0c;border-radius:2px}
.pbtn.sec{background:transparent;border:1px solid var(--k);font-size:12px;padding:8px 12px}
.pbtn.danger{background:transparent;border:1px solid var(--r);color:var(--r);font-size:12px;padding:8px 12px}
.pbtn:disabled{opacity:.45;cursor:default}
.pnote{font-size:12px;color:#4d4a43;margin-top:8px;line-height:1.4}
.stf{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 10px;padding:9px 0;border-bottom:1px solid var(--rule)}
.stf .t{font-size:11.5px;text-transform:uppercase;letter-spacing:.05em}
.stf .s{font-size:11px;color:#55534c;grid-column:1}
.stf .c{grid-row:1/3;grid-column:2;display:flex;align-items:center;gap:4px}
.stf .c b{font-family:var(--mono);min-width:2.4em;text-align:center}
.stf .c button{width:30px;height:28px;border:1px solid var(--k);font-weight:700;background:#f4f1e8}
.bars{display:flex;align-items:flex-end;gap:3px;height:70px;margin:10px 0 4px;border-bottom:1px solid var(--k);position:relative}
.bars i{flex:1;background:var(--k);min-height:1px}
.bars i.neg{background:var(--r);align-self:flex-start}
.lb{padding:4px 0}
.lb div{display:flex;justify-content:space-between;padding:5px 0;border-bottom:1px solid var(--rule);font-size:12px}
.lb div.mine{font-weight:700}
.lb a{color:var(--k)}

/* ---------- banners ---------- */
#banners{position:fixed;top:var(--topH);left:50%;transform:translateX(-50%);z-index:19;display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none;width:min(560px,calc(100% - 24px))}
.banner{background:var(--y);color:var(--k);display:flex;align-items:center;gap:10px;padding:8px 14px;font-weight:600;font-size:13.5px;letter-spacing:.02em;
  box-shadow:0 3px 8px rgba(0,0,0,.3);transform:translateY(-120%);transition:transform .32s cubic-bezier(.2,.7,.2,1),opacity .3s;max-width:100%}
.banner.in{transform:none}
.banner.out{opacity:0}
.banner .ico{width:20px;height:20px;color:var(--k)}
.banner.bad{border-left:6px solid var(--r)}
#milestone{position:fixed;left:0;right:0;top:calc(var(--topH) + 34%);z-index:25;background:var(--k);padding:14px 10px;display:flex;flex-direction:column;align-items:center;gap:8px;
  box-shadow:0 8px 30px rgba(0,0,0,.5);border-top:3px solid var(--y);border-bottom:3px solid var(--y)}
#milestone .flaps{font-size:clamp(14px,3.2vw,30px);flex-wrap:wrap;justify-content:center}
#milestone small{color:var(--y);font-size:12px;letter-spacing:.2em;font-weight:700}

/* ---------- tooltips ---------- */
#tip{position:fixed;z-index:22;background:var(--k);color:var(--w);font-size:12px;padding:8px 10px;pointer-events:none;min-width:160px;border-top:3px solid var(--y);line-height:1.5}
#tip b{color:var(--y);letter-spacing:.06em;font-size:11px}
#tip div{display:flex;justify-content:space-between;gap:14px}
#tip span:last-child{font-family:var(--mono)}
#tag{position:fixed;z-index:22;background:var(--k);color:var(--w);font-size:12px;padding:5px 8px;pointer-events:none;transform:translate(-50%,-130%);white-space:nowrap;text-align:center;line-height:1.3}
#tag b{display:block;background:var(--y);color:var(--k);font-family:var(--mono);margin-top:3px;padding:1px 6px}
#tag.bad b{background:var(--r);color:#fff}

/* ---------- overlay card ---------- */
#overlay{position:fixed;inset:0;top:var(--topH);z-index:40;background:transparent;pointer-events:none;display:flex;align-items:center;justify-content:center;padding:16px}
#overlay[hidden]{display:none}
#overlay.block{pointer-events:auto;background:rgba(28,28,26,.45)}
.card{pointer-events:auto;background:var(--paper);color:var(--k);width:min(560px,100%);max-height:100%;overflow-y:auto;box-shadow:0 10px 40px rgba(0,0,0,.5);border-radius:2px}
.chead{background:var(--k);color:var(--y);display:flex;align-items:center;gap:10px;padding:12px 16px;font-size:13px;letter-spacing:.18em}
.cbody{padding:16px 20px 20px}
.cbody h1{font-size:26px;font-weight:700;letter-spacing:.01em}
.lead{margin:4px 0 12px;color:#3d3b35}
.how{list-style:none;border-top:1px solid var(--rule)}
.how li{display:flex;gap:12px;align-items:center;padding:8px 0;border-bottom:1px solid var(--rule);font-size:14px;line-height:1.35}
.how .ico{width:30px;height:30px;padding:4px;background:var(--y);color:var(--k);box-sizing:content-box;-webkit-mask:none;mask:none;position:relative}
.how .ico::after{content:"";position:absolute;inset:4px;background:var(--k);-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.keys{font-size:12.5px;color:#4d4a43;margin-top:10px}
.note{font-size:12px;color:#4d4a43;margin-top:6px}
.cbtns{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.big{flex:1;min-width:160px;background:var(--y);color:var(--k);font-weight:700;font-size:16px;letter-spacing:.08em;padding:14px;border:1px solid #c99b0c;border-radius:2px}
.big.sec{background:transparent;border:1px solid var(--k)}
.stats .kv span:last-child{font-size:14px}

/* ---------- narrow & short screens ---------- */
@media (max-width:1400px){ .brandtext small{display:none} }
@media (max-width:1240px){ .brandtext b{font-size:12px} .brand{padding:0 10px!important} }
@media (max-width:960px){ .brandtext{display:none} #board{width:min(380px,46vw)} .bcols,.brow{grid-template-columns:4.6em 5em 1fr 2.4em 6.6em;font-size:12px} }
@media (max-height:640px) and (min-width:761px){
  :root{--palW:128px}
  #palette{display:grid;grid-template-columns:1fr 1fr;align-content:start}
  .tile{width:auto;height:calc((100vh - var(--topH) - 32px - 20px) / 5 - 1px);max-height:72px}
  .tile .ico{width:22px;height:22px} .tile b{font-size:9px} .tile small{font-size:9.5px} .tile{gap:1px}
}
@media (max-height:520px){
  :root{--topH:46px}
  .brand{display:none!important}
  #top>div{padding:0 8px}
  .ctrls .sp,.ctrls .tb{height:30px;min-width:30px}
  .cbody{padding:10px 16px 14px} .cbody h1{font-size:20px} .lead{margin:2px 0 6px;font-size:13px}
  .how{display:grid;grid-template-columns:1fr 1fr;column-gap:14px} .how li{font-size:12px;padding:5px 0} .how .ico{width:22px;height:22px;padding:3px}
  .keys{margin-top:6px;font-size:11.5px} .cbtns{margin-top:8px} .big{padding:10px;font-size:14px}
  .card{width:min(760px,100%)}
  #money,#pax,#clock{font-size:15px} .dollar{font-size:16px} .ontime b{font-size:15px}
  .readout .ico{width:20px;height:20px} .lab{font-size:9px}
    .brow{height:21px;font-size:11.5px}
  #panel{width:min(320px,calc(100% - 90px))}
}
@media (max-width:760px){
  :root{--topH:88px;--palW:0px}
  #top{flex-wrap:wrap;height:var(--topH)}
  .brand{display:none!important}
  #top>div.readout{flex:1 1 0;min-width:0;height:46px;padding:0 6px;gap:5px;border-bottom:1px solid #3a3a37}
  #top>div.r-money{flex:1.5 1 0}
  .r-money .ico,.r-pax .ico,.r-ontime .ico{display:none}
  .readout .ico{width:18px;height:18px}
  .r-money .rv{gap:2px}
  #money,#pax,#clock{font-size:13px} .dollar{font-size:13px} .ontime b{font-size:14px} .lab{font-size:8.5px;letter-spacing:.06em}
  .fc{width:.74em}
  .profit{left:0;font-size:10px;margin-top:-1px}
  #top::before{content:"";order:4;flex-basis:100%;height:0}
  #top>div.r-date{order:5;flex:0 0 auto;height:40px;border-bottom:0;border-right:1px solid #3a3a37}
  .r-date .rv{flex-direction:row;align-items:center;gap:6px}
  .ctrls{order:6;flex:1 1 auto;height:40px;justify-content:flex-end;margin-left:0}
  .ctrls{gap:3px!important;padding:0 6px!important;flex:1 1 0!important;min-width:0}
  .ctrls .sp,.ctrls .tb{height:30px;min-width:0;flex:1 1 0;max-width:40px;padding:0 2px}
  .ctrls .sep{width:0}
  .r-date .ico{display:none}
  #top>div.r-date{padding:0 4px 0 8px}
#palette{left:0;right:0;top:auto;bottom:0;width:auto;height:auto;flex-direction:row;overflow-x:auto;overflow-y:hidden;padding:6px;padding-bottom:calc(6px + env(safe-area-inset-bottom));max-height:none}
  .tile{width:68px;aspect-ratio:auto;height:70px}
  .tile .ico{width:24px;height:24px}
  #toolhint{left:8px;right:8px;max-width:none;bottom:96px;font-size:12px}
  #board{left:6px;right:6px;width:auto;top:auto;bottom:92px;max-height:52%}
  #boardTab{top:calc(var(--topH) + 8px);right:6px}
  .bcols,.brow{grid-template-columns:4.4em 4.9em 1fr 2.2em 6.4em;gap:4px;padding:0 8px;font-size:11px}
  #panel{left:6px;right:6px;width:auto;bottom:92px;max-height:60%}
  #banners{top:calc(var(--topH) + 2px)}
  #tip{display:none!important}
}
@media (max-width:370px){ .r-date .lab{display:none} }

/* ---------- docked intro strip ---------- */
#intro{position:fixed;left:50%;transform:translateX(-50%);bottom:12px;z-index:30;width:min(640px,calc(100% - var(--palW) - 40px));margin-left:calc(var(--palW) / 2);
  background:var(--k);color:var(--w);border-top:4px solid var(--y);display:flex;align-items:center;gap:12px;padding:10px 12px;box-shadow:0 6px 18px rgba(0,0,0,.35)}
#intro .ico{width:28px;height:28px}
.itext{flex:1;display:flex;flex-direction:column;gap:2px;font-size:12.5px;line-height:1.35}
.itext b{color:var(--y);font-size:14px;letter-spacing:.03em}
.itext small{color:#bdbab0;font-size:11px}
.itext small:empty{display:none}
.ibtns{display:flex;flex-direction:column;gap:5px}
.ib{font-size:11px;font-weight:700;letter-spacing:.08em;padding:7px 10px;border:1px solid #55554f;white-space:nowrap}
.ib.y{background:var(--y);color:var(--k);border-color:var(--y)}
@media (max-width:760px){ #intro{left:6px;right:6px;width:auto;transform:none;margin:0;bottom:92px} #intro>.ico{display:none} .itext{font-size:12px} }
@media (max-height:520px){ #intro{padding:7px 10px} .itext{font-size:11.5px} .ibtns{flex-direction:row} }

/* map navigation */
#mapnav{position:fixed;left:calc(var(--palW) + 20px);bottom:12px;z-index:14;display:flex;align-items:stretch;gap:3px;background:var(--k);border:1px solid #000;padding:4px;box-shadow:0 4px 14px rgba(0,0,0,.35)}
#mapnav button{background:var(--y);color:var(--k);border:0;font:700 11px/1 inherit;font-family:inherit;letter-spacing:.08em;padding:0 9px;min-height:32px;min-width:32px;cursor:pointer}
#mapnav button:active{filter:brightness(.85)}
#mapnav #zIn,#mapnav #zOut,#mapnav #zAll{font-size:17px;padding:0}
#mapnav .mnlab{color:var(--y);font-size:10px;font-weight:700;letter-spacing:.12em;align-self:center;padding:0 5px 0 3px}
#mapnav .mnsep{width:5px}
@media (max-width:760px){
  #mapnav{left:6px;right:6px;bottom:calc(92px + env(safe-area-inset-bottom));justify-content:center}
  #mapnav button{flex:1;padding:0 4px;font-size:10px;min-height:34px}
  #mapnav #zIn,#mapnav #zOut,#mapnav #zAll{flex:0 0 34px}
  #mapnav .mnlab{display:none}
}

.away{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px 10px;margin:4px 0 3px;font-family:var(--mono);font-size:12px}
.away span{display:flex;flex-direction:column;min-width:0}
.away i{font-style:normal;font-family:inherit;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:#bdbab0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.away .ok{color:#7fd08f;font-weight:700}.away .warn{color:#ff8a7a;font-weight:700}
@media (max-width:520px){ .away{grid-template-columns:repeat(2,minmax(0,1fr))} }