:root{
  --bg:#0E1114; --fg:#FAFAFA; --muted:#22262B; --mfg:#A1A1AA;
  --accent:#41D67F; --accent-fg:#04140B; --border:#33383F;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:'Space Grotesk',Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--accent);color:#000}
a{color:inherit;text-decoration:none}
.up{text-transform:uppercase}
.acc{color:var(--accent)} .mfg{color:var(--mfg)}
.tight{letter-spacing:-.03em} .lead0{line-height:.85}

/* noise overlay */
.noise{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.025;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* nav */
.nav{position:relative;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:2px solid var(--border)}
.brand{font-weight:700;text-transform:uppercase;letter-spacing:-.02em;font-size:18px}
.brand b{color:var(--accent)}
.navlinks a{font-weight:700;text-transform:uppercase;letter-spacing:.01em;font-size:13px;margin-left:22px}
.navlinks a:hover{color:var(--accent)}
.navlinks a.on{color:var(--accent)}

/* marquee */
.mq{display:flex;overflow:hidden;white-space:nowrap;width:100%}
.mq__t{display:flex;flex:0 0 auto;align-items:center;animation:mqx 22s linear infinite;will-change:transform}
.mq--fast .mq__t{animation-duration:15s}
.mq--slow .mq__t{animation-duration:46s}
.mq__t span{display:inline-flex;align-items:center;padding:0 28px}
@keyframes mqx{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.mq__t{animation:none}}

/* brutalist card with hover color-flip */
.kcard{border:2px solid var(--border);background:var(--bg);transition:background .25s ease,border-color .25s ease,color .25s ease}
.kcard:hover{background:var(--accent);border-color:var(--accent);color:#000}
.kcard:hover .mfg,.kcard:hover .acc{color:#000}
.kcard:hover .mfg{opacity:.72}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;font-weight:700;text-transform:uppercase;letter-spacing:-.02em;border:2px solid var(--border);height:56px;padding:0 30px;cursor:pointer;transition:transform .18s ease,background .18s ease,color .18s ease;font-size:15px;font-family:inherit}
.btn-acc{background:var(--accent);color:#000;border-color:var(--accent)}
.btn-acc:hover{transform:scale(1.05)}
.btn-acc:active{transform:scale(.96)}
.btn-out{background:transparent;color:var(--fg)}
.btn-out:hover{background:var(--fg);color:#000;border-color:var(--fg)}

/* dividers / grid hairline */
.hair{background:var(--border)}
.gridline{display:grid;gap:2px;background:var(--border);border:2px solid var(--border)}
.gridline>*{background:var(--bg)}

/* leaflet dark */
.leaflet-container{background:#09090B!important;font-family:'Space Grotesk',sans-serif}
.leaflet-control-attribution{background:rgba(9,9,11,.7)!important;color:#A1A1AA!important}
.leaflet-control-attribution a{color:#A1A1AA!important}
.leaflet-bar a{background:#09090B!important;color:#FAFAFA!important;border-color:#3F3F46!important}
.kpin{width:16px;height:16px;border:2px solid #000;transform:rotate(45deg)}
.kpin.load{background:#41D67F;box-shadow:0 0 0 5px rgba(65,214,127,.3)}
.kpin.queue{background:#FAFAFA}
.kpin.near{background:#41D67F}
.kpin.out{background:#A1A1AA;opacity:.7}
.kent{width:24px;height:24px;background:#41D67F;border:3px solid #FAFAFA;transform:rotate(45deg)}
.leaflet-popup-content-wrapper{background:#09090B;color:#FAFAFA;border:2px solid #41D67F;border-radius:0}
.leaflet-popup-tip{background:#41D67F}
.leaflet-popup-content{margin:12px 14px;font-size:13px}
.pp b{color:#41D67F;text-transform:uppercase;letter-spacing:-.01em}

/* inputs (driver) */
.kin{width:100%;background:transparent;border:0;border-bottom:2px solid var(--border);color:var(--fg);
  font-family:inherit;font-weight:700;text-transform:uppercase;letter-spacing:-.02em;font-size:clamp(1.6rem,4vw,2.5rem);
  padding:14px 0;outline:none}
.kin::placeholder{color:var(--muted)}
.kin:focus{border-color:var(--accent)}
select.kin option{background:#09090B;color:#FAFAFA;font-size:16px}

/* badges */
.badge{display:inline-flex;align-items:center;font-weight:700;text-transform:uppercase;letter-spacing:.02em;font-size:11px;border:2px solid var(--border);padding:3px 9px}
.b-load{background:var(--accent);color:#000;border-color:var(--accent)}
.b-queue{border-color:var(--fg);color:var(--fg)}
.b-near{border-color:var(--accent);color:var(--accent)}
.b-out{border-color:var(--mfg);color:var(--mfg)}

.foot{border-top:2px solid var(--border);padding:24px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;font-size:13px;text-transform:uppercase;letter-spacing:.02em;color:var(--mfg)}
.foot a{color:var(--accent)}

.blink{animation:bl 1.1s steps(2,end) infinite}
@keyframes bl{50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.blink{animation:none}}

/* admin expandable queue row */
.qitem{border-bottom:2px solid var(--border)}
.qitem:last-child{border-bottom:0}
.qhead{display:flex;align-items:center;gap:16px;padding:16px;cursor:pointer;transition:background .15s}
.qhead:hover{background:#161A1F}
.qitem.open .qhead{background:#161A1F}
.qchevron{transition:transform .2s;color:var(--mfg)}
.qitem.open .qchevron{transform:rotate(90deg);color:var(--accent)}
.qdetail{display:none;padding:0 16px 16px}
.qitem.open .qdetail{display:block}
.qdkv{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--border);border:2px solid var(--border)}
.qdkv>div{background:var(--bg);padding:10px 12px}
.qdkv .k{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--mfg)}
.qdkv .v{font-weight:700;margin-top:2px}
@media (max-width:520px){.qdkv{grid-template-columns:1fr}}