:root{--ink:#182522;--green:#2e5345;--paper:#f4f3ee;--line:#dedfd6;--muted:#6d776f;--red:#a3372c}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.5 "Segoe UI",Arial,sans-serif}a{color:inherit}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{cursor:pointer;min-height:42px;padding:9px 15px;border:1px solid #c5cec3;border-radius:3px;background:#fff;color:var(--ink)}button:hover:not(:disabled){background:#e9eee6}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:var(--ink);color:white;border-color:var(--ink)}button.primary:hover:not(:disabled){background:var(--green)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #518c72;outline-offset:3px}[hidden]{display:none!important}h1,h2,p{margin:0}h1,h2{font-weight:550;line-height:1.15;letter-spacing:-.035em}.topbar{height:76px;background:var(--ink);color:#fff;display:flex;align-items:center;gap:36px;padding:0 max(4vw,24px)}.brand{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:750;text-decoration:none;letter-spacing:.02em}.brand>span>span{font-weight:350;margin-left:5px}.back{font-size:12px;text-decoration:none;color:#d3ddd7}.back:hover{text-decoration:underline}.device-status{margin-left:auto;font-size:12px;color:#d3ddd7}main{max-width:1600px;padding:0 4vw 35px;margin:auto}.heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:30px 0 22px}.heading h1{font-size:36px;margin-top:8px}.eyebrow{font-size:10px;letter-spacing:.17em;font-weight:700;color:var(--muted)}label{display:flex;flex-direction:column;gap:6px;font-size:11px;color:var(--muted)}input[type=datetime-local],select{height:43px;border:1px solid #c9cfc4;background:white;border-radius:3px;padding:8px 10px;color:var(--ink);min-width:0}.device-select{min-width:180px}.range-panel{background:#fff;border:1px solid var(--line);padding:18px 22px}#range-form{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap}#range-form label{flex:1;min-width:200px;max-width:300px}#range-form button{min-height:43px}.range-bottom{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:15px;color:var(--muted);font-size:11px}.presets{display:flex;gap:5px}.presets button{min-height:30px;padding:5px 12px;font-size:11px;border:0;background:var(--paper)}.presets button.selected{background:#e0e9dc;color:var(--green);font-weight:650}.range-help{margin-left:auto}.load-status{min-height:20px;margin:14px 0;font-size:12px;color:var(--muted)}.notice{padding:12px 16px;border:1px solid #e2bfb1;background:#fff3ec;color:var(--red);margin:0 0 14px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 265px;border:1px solid var(--line);background:white}.map-column{min-width:0}.map-stage{position:relative;height:clamp(390px,58vh,730px);min-height:390px}#map{position:absolute;inset:0;background:#e5e8df}.map-tools{position:absolute;z-index:500;left:64px;right:15px;top:15px;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;pointer-events:none}.map-tools>*{pointer-events:auto;box-shadow:0 2px 10px #18252216}.map-tools label{padding:6px 8px 8px;background:#fff;border-radius:4px;font-size:10px}.map-tools select{height:33px;padding:4px 7px;min-width:190px;font-size:12px;border-color:var(--line)}.map-tools>button{font-size:12px;background:#fff}.empty-card{position:absolute;z-index:450;pointer-events:none;top:50%;left:50%;transform:translate(-50%,-50%);background:#fffffff0;border:1px solid var(--line);padding:26px 30px;text-align:center;max-width:390px;width:calc(100% - 48px);box-shadow:0 8px 35px #1825220c}.empty-card>span{font-size:29px;color:var(--green)}.empty-card h2{font-size:23px;margin:10px 0}.empty-card p{font-size:12px;color:var(--muted)}.tile-error{position:absolute;bottom:28px;left:12px;z-index:500;background:#fff6e6;padding:8px 12px;max-width:calc(100% - 24px);font-size:11px;border:1px solid #dfcaa5}.timeline{border-top:1px solid var(--line);padding:17px 20px 13px}.timeline-controls{display:flex;gap:9px;align-items:center;margin-bottom:15px}.timeline-controls button{font-size:12px}.timeline-controls .play{min-width:145px}.timeline-controls label{flex-direction:row;align-items:center;gap:8px;margin-left:8px}.timeline-controls select{height:38px;font-size:12px}.timeline-controls .follow{margin-left:auto;color:var(--ink);font-size:11px}.follow input{accent-color:var(--green);width:16px;height:16px}#timeline{width:100%;accent-color:var(--green);display:block;margin:0;cursor:pointer;height:24px}.timeline-labels{display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:10px;margin-top:6px}.point-panel{padding:27px 22px;border-left:1px solid var(--line)}.point-panel h2{font-size:26px;margin-top:13px}.point-panel>time{display:block;color:var(--muted);font-size:12px;margin-top:9px}.point-panel dl{margin:26px 0 23px}.point-panel dl>div{padding:14px 0;border-bottom:1px solid var(--line)}.point-panel dt{font-size:11px;color:var(--muted)}.point-panel dd{margin:4px 0 0;font-size:19px;font-variant-numeric:tabular-nums;word-break:break-word}.point-note,.contact{font-size:11px;color:var(--muted);line-height:1.7;margin-top:13px}.contact{padding-top:15px;border-top:1px solid var(--line)}.leaflet-control-attribution{font-size:10px!important;background:#fffffff2!important;max-width:calc(100% - 10px)}.leaflet-container{font-family:"Segoe UI",Arial,sans-serif}.leaflet-tooltip{font-size:11px}footer{max-width:1600px;padding:22px 4vw 27px;margin:auto;display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:10px;border-top:1px solid var(--line)}footer>span:first-child{font-weight:750;letter-spacing:.15em}footer a{text-decoration:none}@media(max-width:1000px){.workspace{grid-template-columns:minmax(0,1fr) 220px}.point-panel{padding:24px 17px}.timeline-controls .follow{max-width:100px}.range-help{margin-left:0}.timeline-controls{flex-wrap:wrap}.map-stage{height:54vh}}@media(max-width:700px){.topbar{height:66px;padding:0 18px;gap:18px}.brand{font-size:18px}.brand img{width:24px;height:27px}.device-status{font-size:10px;max-width:105px;text-align:right}.back{font-size:11px}main{padding:0 14px 25px}.heading{padding:24px 0 18px;align-items:flex-end;gap:12px}.heading h1{font-size:28px}.device-select{min-width:0;max-width:145px}.device-select select{width:100%;font-size:12px}.range-panel{padding:16px 14px}#range-form{gap:10px}#range-form label{min-width:0;max-width:none;flex:1 1 40%}input[type=datetime-local]{width:100%;padding:8px 5px;font-size:11px}#range-form button{flex:1}.range-bottom{gap:9px;font-size:10px}.range-help{width:100%}.presets{gap:3px}.presets button{padding:5px 10px}.workspace{display:flex;flex-direction:column}.map-stage{height:55svh;min-height:360px;max-height:620px}.map-tools{left:53px;right:9px;top:10px;gap:7px}.map-tools select{min-width:150px;max-width:175px;font-size:11px}.map-tools>button{padding:8px;font-size:10px;min-height:39px}.timeline{padding:13px 13px 11px}.timeline-controls{gap:7px}.timeline-controls button{padding:9px 11px}.timeline-controls .play{min-width:140px}.timeline-controls label{margin-left:0}.timeline-controls .follow{margin-left:0;max-width:none;width:100%}.timeline-labels{font-size:9px;gap:5px}.timeline-labels>span{white-space:nowrap}.point-panel{border-left:0;border-top:1px solid var(--line);padding:22px}.point-panel h2{font-size:23px}.point-panel dl{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;margin:16px 0}.point-panel dd{font-size:18px}.point-panel .point-note{font-size:10px}.point-panel .contact{margin-top:15px}footer{padding:20px 18px;flex-wrap:wrap}footer>span:nth-child(2){order:3;width:100%}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
/* Desktop uses the available window; short/tablet/mobile views keep normal flow. */
@media(min-width:1000px) and (min-height:680px){
  body{height:100vh;height:100dvh;display:flex;flex-direction:column}
  .topbar{height:54px;flex:0 0 54px;padding:0 24px;gap:24px}
  .brand{font-size:19px}
  .brand img{width:25px;height:29px}
  main{width:100%;flex:1;min-height:0;padding:10px 24px 8px;display:flex;flex-direction:column}
  .heading{flex:none;min-height:44px;padding:0 0 8px;gap:16px}
  .heading h1{font-size:25px;margin-top:2px}
  .eyebrow{font-size:9px}
  .device-select{min-width:175px;flex-direction:row;align-items:center;gap:10px}
  .device-select select{height:40px}
  .range-panel{flex:none;padding:9px 14px}
  #range-form{gap:10px;flex-wrap:nowrap}
  #range-form label{min-width:175px;max-width:260px;gap:3px;font-size:10px}
  input[type=datetime-local]{height:40px;font-size:12px}
  #range-form button{min-height:40px;font-size:12px;padding:8px 14px}
  .range-bottom{margin-top:7px;gap:12px;font-size:10px;flex-wrap:nowrap}
  .presets button{min-height:30px;padding:5px 10px}
  .load-status{flex:none;min-height:16px;margin:7px 0;font-size:10px;line-height:1.4}
  .notice{flex:none;margin-bottom:7px;padding:6px 12px;font-size:11px}
  .workspace{flex:1;min-height:0;grid-template-columns:minmax(0,1fr) 245px}
  .map-column{min-height:0;display:flex;flex-direction:column}
  .map-stage{flex:1;height:auto;min-height:180px}
  .map-tools{top:10px;right:10px}
  .map-tools>button{min-height:40px}
  .timeline{flex:none;padding:8px 14px 7px}
  .timeline-controls{gap:8px;margin-bottom:6px;flex-wrap:nowrap}
  .timeline-controls button{min-height:40px;padding:7px 12px}
  .timeline-controls select{height:36px}
  .timeline-controls .follow{max-width:none}
  #timeline{height:20px}
  .timeline-labels{font-size:9px;margin-top:3px}
  .point-panel{min-height:0;overflow:auto;overscroll-behavior:contain;padding:13px 16px}
  .point-panel h2{font-size:21px;margin-top:6px}
  .point-panel>time{font-size:10px;margin-top:5px}
  .point-panel dl{margin:12px 0}
  .point-panel dl>div{padding:6px 0}
  .point-panel dt{font-size:10px}
  .point-panel dd{font-size:15px;margin-top:1px}
  .point-note,.contact{font-size:10px;line-height:1.4;margin-top:8px}
  .contact{padding-top:8px}
  footer{flex:0 0 30px;width:calc(100% - 48px);padding:6px 0;margin:0 auto;font-size:9px}
}