/* ============================================================
   TOKEN
   ============================================================ */
:root{
  --paper:#F3F6F5;
  --panel:#FFFFFF;
  --ink:#14232E;
  --ink-2:#4F5E69;
  --ink-3:#8A96A0;
  --line:#D9E0E2;
  --line-2:#EAEEEF;
  --d1:#C8791A; --d1-soft:#FBEFDF;
  --d2:#2C8C6D; --d2-soft:#E1F2EB;
  --d3:#2E6DB4; --d3-soft:#E2ECF8;
  --warn:#B4412E; --warn-soft:#FBE7E2;
  --ok:#2C8C6D;
  --radius:10px;
  --font:"Bricolage Grotesque","Segoe UI",Roboto,system-ui,-apple-system,sans-serif;
  --max:760px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.5;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:600;line-height:1.15;letter-spacing:-0.01em}
h2{font-size:1.5rem;margin-bottom:6px}
h3{font-size:1.05rem}
p{margin:0}
.wrap{max-width:var(--max);margin:0 auto;padding:0 18px}
.muted{color:var(--ink-2)}
.small{font-size:.875rem}
.tiny{font-size:.8rem}
section{padding:40px 0 8px}
section+section{border-top:1px solid var(--line)}
.sec-head{margin-bottom:18px}
.sec-head h2{display:flex;align-items:center;gap:10px}
.sec-head h2 svg{flex:none;width:24px;height:24px;fill:none;stroke:var(--d3);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sec-head p{color:var(--ink-2);max-width:60ch}
.tbc{display:inline-block;margin:8px 0 6px;padding:4px 10px;border-radius:999px;background:var(--warn-soft);color:var(--warn);font-size:.78rem;font-weight:700;letter-spacing:.02em}

/* ============================================================
   HERO
   ============================================================ */
.hero{padding:28px 0 22px;background:var(--panel);border-bottom:1px solid var(--line)}
.hero .kicker{color:var(--ink-2);font-size:.95rem}
.hero h1{font-size:clamp(2.1rem,8vw,3.6rem);font-weight:700;letter-spacing:-0.03em;margin:4px 0 8px;line-height:1.02}
.hero .dates{font-size:1.15rem;font-weight:500}
.hero-grid{display:grid;grid-template-columns:1.45fr 1fr 1.1fr;gap:10px;margin-top:18px;border-top:1px solid var(--line);padding-top:14px}
.hero-grid div{min-width:0}
.hero-grid b{display:flex;align-items:center;gap:7px;font-size:1.35rem;font-weight:700;letter-spacing:-0.02em}
.hero-grid b svg{flex:none;width:18px;height:18px;fill:none;stroke:var(--d3);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.hero-grid b span{min-width:0;overflow-wrap:anywhere}
.hero-grid span{color:var(--ink-2);font-size:.85rem}
.hero-grid .pecah{display:block;margin-top:3px;font-size:.7rem;line-height:1.3;color:var(--ink-2);text-wrap:balance}
.btn-ringkas{margin-top:12px;font:inherit;font-size:.9rem;font-weight:600;padding:9px 16px;border-radius:999px;border:1px solid var(--ink);background:var(--ink);color:#fff;cursor:pointer}
.btn-ringkas:hover,.btn-ringkas:focus-visible{background:#22384A;border-color:#22384A}
/* Ringkasan: satu skrin penuh, tiada skrol */
.rk{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;background:rgba(12,22,30,.55);padding:10px}
.rk[hidden]{display:none}
.rk-kotak{position:relative;display:flex;flex-direction:column;width:100%;max-width:560px;max-height:100%;overflow:hidden;background:var(--paper);border-radius:16px;padding:14px clamp(12px,3.4vw,20px) 12px;box-shadow:0 12px 40px rgba(12,22,30,.3)}
.rk-kotak h2{flex:none;font-size:clamp(1rem,4.2vw,1.25rem);margin-bottom:8px;padding-right:34px}
.rk-x{position:absolute;top:9px;right:9px;display:flex;align-items:center;justify-content:center;width:30px;height:30px;padding:0;border:1px solid var(--line);border-radius:50%;background:var(--panel);color:var(--ink-2);cursor:pointer}
.rk-x svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.rk-x:hover,.rk-x:focus-visible{color:var(--ink);border-color:var(--ink-3)}
.rk-isi{flex:1;min-height:0;overflow:hidden;display:grid;gap:clamp(5px,1.4vh,10px);align-content:start}
.rk-isi section{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:clamp(6px,1.5vh,10px) 11px}
.rk-isi h3{font-size:clamp(.62rem,2.5vw,.72rem);letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);margin-bottom:3px}
.rk-isi p{font-size:clamp(.72rem,3vw,.85rem);line-height:1.35;color:var(--ink-2);margin-top:2px}
.rk-isi b{color:var(--ink);font-weight:700}
.rk-kereta i{font-style:normal;color:var(--ink-3);font-size:.92em}
.rk-kereta span{display:block;color:var(--ink-2)}
@media (min-width:560px){.rk{padding:24px}.rk-kotak{max-height:min(100%,720px)}}
.countdown{display:inline-block;margin-top:14px;padding:6px 12px;border:1px solid var(--ink);border-radius:999px;font-weight:600;font-size:.95rem}

/* ============================================================
   NAV
   ============================================================ */
.nav{position:sticky;top:0;z-index:60;background:rgba(243,246,245,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;gap:4px;overflow-x:auto;padding-top:8px;padding-bottom:8px;scrollbar-width:none}
.nav .wrap::-webkit-scrollbar{display:none}
.nav a{white-space:nowrap;text-decoration:none;font-size:.9rem;font-weight:500;padding:6px 11px;border-radius:999px;color:var(--ink-2)}
.nav a:hover,.nav a:focus-visible{background:var(--panel);color:var(--ink);outline:none}
.nav a.on{background:var(--ink);color:#fff}

/* ============================================================
   MAP
   ============================================================ */
.map-shell{position:relative;z-index:0;background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
#map{height:62vh;min-height:380px;width:100%;background:#E9EEED}
.leaflet-tile-pane{filter:saturate(.55) brightness(1.06) contrast(.94)}
.map-ctl{position:absolute;left:12px;bottom:14px;z-index:400;display:flex;gap:6px;flex-wrap:wrap;max-width:calc(100% - 24px)}
.map-ctl button{border:1px solid var(--line);background:var(--panel);color:var(--ink);font:inherit;font-size:.85rem;font-weight:600;padding:7px 12px;border-radius:999px;cursor:pointer;box-shadow:0 1px 2px rgba(20,35,46,.08)}
.map-ctl button[data-day="1"].on{background:var(--d1);border-color:var(--d1);color:#fff}
.map-ctl button[data-day="2"].on{background:var(--d2);border-color:var(--d2);color:#fff}
.map-ctl button[data-day="3"].on{background:var(--d3);border-color:var(--d3);color:#fff}
.map-ctl button[data-day="all"].on{background:var(--ink);border-color:var(--ink);color:#fff}
.map-note{position:absolute;right:12px;top:12px;z-index:400;display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.92);border:1px solid var(--line);border-radius:8px;padding:5px 5px 5px 10px;font-size:.78rem;color:var(--ink-2);max-width:220px}
.map-note[hidden]{display:none}
.map-note button{flex:none;display:flex;align-items:center;justify-content:center;width:22px;height:22px;padding:0;border:0;border-radius:6px;background:transparent;color:var(--ink-3);cursor:pointer}
.map-note button:hover,.map-note button:focus-visible{background:var(--paper);color:var(--ink)}
.map-note button svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.map-fallback{display:none;padding:40px 18px;text-align:center;color:var(--ink-2)}
.leaflet-container{font-family:var(--font)}
.pin{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;color:#fff;font-weight:700;font-size:.8rem;border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.35)}
.pin.d1{background:var(--d1)}.pin.d2{background:var(--d2)}.pin.d3{background:var(--d3)}
.pin.home,.pin.plane{background:var(--ink);width:30px;height:30px}
.pin svg{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.leaflet-popup-content-wrapper{border-radius:10px;box-shadow:0 4px 18px rgba(20,35,46,.18)}
.leaflet-popup-content{margin:12px 14px;font-size:.9rem;line-height:1.4;min-width:200px}
.pp-day{font-size:.75rem;font-weight:700;letter-spacing:.02em}
.pp-title{font-weight:700;font-size:1rem;margin:2px 0}
.pp-title a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;text-decoration-color:var(--line)}
.pp-title a:hover,.pp-title a:focus-visible{text-decoration-color:currentColor}
.pp-meta{color:var(--ink-2);font-size:.82rem}
.pp-links{display:flex;gap:6px;margin-top:8px}
.pp-links a{flex:1;text-align:center;text-decoration:none;font-weight:600;font-size:.82rem;padding:6px 8px;border-radius:7px;border:1px solid var(--line);color:var(--ink)}
.pp-links a.wz{background:#1EA5E6;border-color:#1EA5E6;color:#fff}
.rsum{margin-top:16px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
.rsum>summary{display:flex;align-items:center;gap:8px;padding:12px 14px;font-weight:600;cursor:pointer;list-style:none}
.rsum>summary::-webkit-details-marker{display:none}
.rsum>summary::after{content:"";width:8px;height:8px;border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);transform:rotate(45deg);margin-left:auto;transition:transform .15s}
.rsum[open]>summary::after{transform:rotate(-135deg)}
.rsum>summary:focus-visible{outline:2px solid var(--d3);outline-offset:-2px;border-radius:var(--radius)}
.route-sum{margin:0 14px}
.rs-tbl{table-layout:auto;border:0;border-radius:0;font-size:.84rem}
.rs-tbl th,.rs-tbl td{padding:8px 6px;overflow-wrap:normal;white-space:nowrap}
.rs-tbl thead td{border-top:0;background:transparent}
.rs-tbl thead th{text-align:right;font-size:.82rem;font-weight:700;border-top:0;background:transparent}
.rs-tbl thead th.d1{color:var(--d1)}.rs-tbl thead th.d2{color:var(--d2)}.rs-tbl thead th.d3{color:var(--d3)}
.rs-tbl tbody th{display:flex;align-items:center;gap:7px;font-weight:600;color:var(--ink);font-size:.82rem;width:100%}
.rs-tbl tbody th svg{flex:none;width:15px;height:15px;fill:none;stroke:var(--d3);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.rs-tbl tbody td{text-align:right;font-variant-numeric:tabular-nums}
.rs-foot{margin:8px 14px 0;color:var(--ink-3);font-size:.76rem}
.rs-note{margin:8px 14px 14px;padding-top:10px;border-top:1px solid var(--line-2);color:var(--ink-2);font-size:.8rem}
@media (max-width:400px){.rs-tbl{font-size:.8rem}.rs-tbl th,.rs-tbl td{padding:8px 4px}}

/* ============================================================
   TABS + TIMELINE
   ============================================================ */
.tabs{display:flex;gap:6px;margin:0 -18px 8px;padding:8px 18px;position:sticky;top:var(--navh,52px);z-index:40;background:var(--paper)}
.tabs button{flex:1;font:inherit;font-weight:600;font-size:.95rem;padding:10px 6px;border-radius:var(--radius);border:1px solid var(--line);background:var(--panel);color:var(--ink-2);cursor:pointer}
.tabs button small{display:block;font-weight:500;font-size:.78rem;color:var(--ink-3)}
.tabs button.on{color:#fff}
.tabs button.on small{color:rgba(255,255,255,.8)}
.tabs button[data-day="1"].on{background:var(--d1);border-color:var(--d1)}
.tabs button[data-day="2"].on{background:var(--d2);border-color:var(--d2)}
.tabs button[data-day="3"].on{background:var(--d3);border-color:var(--d3)}
#car-tabs button.on{background:var(--d3);border-color:var(--d3)}
.halalkey{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:14px;font-size:.84rem;color:var(--ink-2)}
.halalkey>summary{display:flex;align-items:center;gap:8px;padding:11px 14px;font-size:.8rem;font-weight:600;color:var(--ink);cursor:pointer;list-style:none}
.halalkey>summary::-webkit-details-marker{display:none}
.halalkey>summary::after{content:"";width:7px;height:7px;border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);transform:rotate(45deg);margin-left:auto}
.halalkey[open]>summary::after{transform:rotate(-135deg)}
.halalkey>summary:focus-visible{outline:2px solid var(--d3);outline-offset:-2px;border-radius:var(--radius)}
/* Legend: kategori ikon di atas, status halal di bawah */
.lg-tajuk{margin:2px 14px 6px;font-size:.72rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-3)}
.lg-tajuk+.halal-tbl{margin-top:0}
.cat-key{list-style:none;margin:0 14px 14px;padding:0 0 12px;display:grid;grid-template-columns:1fr 1fr;gap:7px 12px;border-bottom:1px solid var(--line-2)}
.cat-key li{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--ink-2);min-width:0}
.cat-key .ico{flex:none;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:7px;background:color-mix(in srgb,var(--c) 15%,#fff)}
.cat-key .ico svg{width:15px;height:15px;fill:none;stroke:var(--c);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:400px){.cat-key{gap:7px 8px}.cat-key li{font-size:.76rem}}
.halal-tbl{margin:0 14px;width:calc(100% - 28px);border:0;border-radius:0;font-size:.78rem}
.halal-tbl th{padding:0 4px 7px;border-top:0;background:transparent;text-align:left}
.halal-tbl td{padding:8px 4px;color:var(--ink-2);line-height:1.35;vertical-align:top}
.halal-tbl .bdg{font-size:.72rem;padding:3px 7px}
.halalkey em{display:block;font-style:normal;font-size:.78rem;color:var(--ink-3);margin:10px 14px 12px;padding-top:9px;border-top:1px solid var(--line-2)}
.day-intro{border-radius:var(--radius);margin-bottom:14px;font-size:.9rem}
.day-intro>summary{display:flex;align-items:center;gap:8px;padding:11px 16px;font-size:.74rem;font-weight:700;letter-spacing:.02em;cursor:pointer;list-style:none}
.day-intro>summary::-webkit-details-marker{display:none}
.day-intro>summary::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-left:auto;opacity:.6}
.day-intro[open]>summary::after{transform:rotate(-135deg)}
.day-intro>summary:focus-visible{outline:2px solid var(--d3);outline-offset:-2px;border-radius:var(--radius)}
.day-intro ul{margin:0;padding:0 16px 13px 32px;display:grid;gap:5px}
.day-intro li{line-height:1.4}
.day-intro.d1{background:var(--d1-soft)}.day-intro.d2{background:var(--d2-soft)}.day-intro.d3{background:var(--d3-soft)}
.tl{position:relative}
.ti{display:grid;grid-template-columns:92px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--line-2)}
.ti:first-child{border-top:0}
.ti-time{font-weight:700;font-size:1.05rem;line-height:1.2;letter-spacing:-0.01em}
.ti-time span{display:block;font-weight:500;color:var(--ink-2);font-size:.8rem;margin-top:2px}
.ti-title{font-weight:600;font-size:1.02rem;display:flex;align-items:flex-start;gap:8px}
.ti-title>span:not(.ico):not(.n){flex:1;min-width:0}
.ti-title a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:var(--line)}
.ti-title a:hover,.ti-title a:focus-visible{text-decoration-color:currentColor}
.ti-title .ico{flex:none;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:7px;margin-top:1px}
.ti-title .ico svg{width:15px;height:15px;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ti-title .ico{background:color-mix(in srgb,var(--c) 15%,#fff)}
.ti-title .ico svg{stroke:var(--c)}
.ti-title .n{flex:none;order:9;margin-left:auto;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;color:#fff;font-size:.75rem;font-weight:700;margin-top:2px}
.d1 .ti-title .n{background:var(--d1)}.d2 .ti-title .n{background:var(--d2)}.d3 .ti-title .n{background:var(--d3)}
.badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.bdg{display:inline-flex;align-items:center;gap:5px;font-size:.76rem;font-weight:600;padding:3px 9px;border-radius:999px;border:1px solid transparent}
.bdg.sijil{background:var(--d2-soft);color:#1E6B52;border-color:#BFE3D6}
.bdg.muslim{background:#EEF3FA;color:#2B5B94;border-color:#CFDFF0}
.bdg.semak{background:var(--warn-soft);color:var(--warn);border-color:#EFC6BB}
.bdg.rate{background:var(--panel);color:var(--ink-2);border-color:var(--line)}
.bdg svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bdg.rate svg{fill:#D9A21B;stroke:none}
.ti-meta{color:var(--ink-2);font-size:.88rem;margin-top:3px}
.ti-lede{color:var(--ink-2);font-size:.88rem;margin-top:3px}
.halal-note{margin-top:7px;padding:7px 10px;border-radius:8px;background:var(--warn-soft);color:var(--warn);font-size:.8rem;line-height:1.35}
/* Butiran: senarai point form, satu ikon garis halus setiap kategori */
.det{margin-top:8px}
.det>summary{display:inline-flex;align-items:center;gap:6px;font-size:.82rem;font-weight:600;color:var(--ink-2);cursor:pointer;list-style:none;padding:4px 10px;border:1px solid var(--line);border-radius:999px;background:var(--panel)}
.det>summary::-webkit-details-marker{display:none}
.det>summary::after{content:"";width:6px;height:6px;border-right:1.6px solid var(--ink-3);border-bottom:1.6px solid var(--ink-3);transform:rotate(45deg) translate(-1px,-1px)}
.det[open]>summary::after{transform:rotate(-135deg)}
.det>summary:focus-visible{outline:2px solid var(--d3);outline-offset:2px}
.det-list{list-style:none;margin:8px 0 0;padding:10px 12px;display:grid;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
.det-list li{display:flex;align-items:flex-start;gap:9px;font-size:.84rem;line-height:1.4;color:var(--ink-2)}
.det-list li svg{flex:none;width:15px;height:15px;margin-top:2px;fill:none;stroke:var(--d3);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.det-list li span{min-width:0;overflow-wrap:anywhere}
.det-list .bdg{margin-left:2px;vertical-align:middle}
.det-list b{color:var(--ink);font-weight:600}
.det-list a{color:var(--ink);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;text-decoration-color:var(--line)}
.det-list a:hover,.det-list a:focus-visible{text-decoration-color:currentColor}
/* Plan B: kad ringkas, satu pandangan terus tahu nak ke mana */
.pb-list{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.pb{padding:9px 11px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.pb-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pb-h a{font-weight:600;font-size:.88rem;color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;text-decoration-color:var(--line)}
.pb-h a:hover,.pb-h a:focus-visible{text-decoration-color:currentColor}
.pb-addr{display:block;margin-top:2px;color:var(--ink-3);font-size:.78rem}
.pb p{margin-top:3px;color:var(--ink-2);font-size:.82rem;line-height:1.4}
.pb-note{color:var(--ink-2);font-size:.82rem;line-height:1.45;background:var(--paper);border-style:dashed}

.ti-cost{display:inline-block;margin-top:6px;font-size:.82rem;font-weight:600;padding:2px 8px;border-radius:6px;background:var(--line-2)}
.flag{display:inline-block;margin:6px 6px 0 0;font-size:.78rem;font-weight:600;padding:3px 8px;border-radius:6px}
.flag.warn{background:var(--warn-soft);color:var(--warn)}
.flag.info{background:var(--line-2);color:var(--ink-2)}
.ti-move{padding:6px 0}
.ti-move .ti-time{visibility:hidden}
.ti-move .ti-body{display:flex;align-items:center;gap:8px;color:var(--ink-2);font-size:.85rem;padding-left:2px;border-left:2px dashed var(--line);margin-left:-8px;padding-left:12px}
.ti-move svg{width:16px;height:16px;flex:none;stroke:var(--ink-3);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ti-azan{padding:4px 0}
.ti-azan .ti-time{font-weight:500;color:var(--ink-3);font-size:.85rem}
.ti-azan .ti-body{font-size:.8rem;color:var(--ink-3)}
.ti-azan .ti-body b{color:var(--ink-2);font-weight:600}
.ti-links{display:flex;gap:6px;margin-top:8px}
.ti-links a{text-decoration:none;font-size:.8rem;font-weight:600;padding:5px 10px;border-radius:7px;border:1px solid var(--line);color:var(--ink)}
.ti-links a:hover{background:var(--line-2)}
details.planb{margin-top:8px;font-size:.88rem}
details.planb summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:.8rem;color:var(--ink-2);padding:3px 9px;border:1px dashed var(--line);border-radius:999px;user-select:none}
details.planb summary::-webkit-details-marker{display:none}
details.planb summary::before{content:"+";font-weight:700}
details.planb[open] summary::before{content:"–"}
.solat-row{display:grid;grid-template-columns:78px 1fr;gap:12px;padding:10px 0;border-top:1px solid var(--line-2)}
.solat-row .ti-time{font-weight:700}
.solat-row .ti-body{font-size:.95rem}

/* ============================================================
   SWIMLANE
   ============================================================ */
.lane-wrap{overflow-x:auto;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:12px 12px 8px}
.lane{min-width:0}
.lane-head,.lane-row{display:grid;grid-template-columns:96px repeat(3,1fr);gap:0 6px;align-items:center}
.lane-head{font-size:.8rem;color:var(--ink-2);font-weight:600;padding-bottom:6px;border-bottom:1px solid var(--line)}
.lane-head span{text-align:center}
.lane-row{padding:7px 0;border-bottom:1px solid var(--line-2)}
.lane-row:last-child{border-bottom:0}
.lane-name{font-size:.8rem;font-weight:600;line-height:1.2;overflow-wrap:anywhere}
.lane-name small{display:block;font-weight:500;color:var(--ink-3);font-size:.7rem}
.own .dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;vertical-align:0}
.lane-cell{position:relative;height:22px;background:repeating-linear-gradient(90deg,var(--line-2) 0 1px,transparent 1px 25%);border-radius:4px}
.seg{position:absolute;top:3px;bottom:3px;border-radius:4px}
.seg.here{background:var(--g)}
.seg.transit{background:repeating-linear-gradient(135deg,var(--g) 0 3px,transparent 3px 7px);opacity:.75}
.seg.here span{position:absolute;left:6px;top:50%;transform:translateY(-50%);font-size:.66rem;font-weight:700;color:#fff;white-space:nowrap}
.lane-legend{display:flex;gap:16px;margin-top:10px;font-size:.78rem;color:var(--ink-2);flex-wrap:wrap}
.lane-legend i{display:inline-block;width:22px;height:10px;border-radius:3px;vertical-align:-1px;margin-right:6px;--g:var(--ink)}
.lane-legend i.transit{background:repeating-linear-gradient(135deg,var(--ink) 0 3px,transparent 3px 7px);opacity:.75}
.lane-legend i.here{background:var(--ink)}
.headcount{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.codekey{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;margin-top:12px;padding:12px 14px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
@media (max-width:460px){.codekey{grid-template-columns:1fr}}
.codekey span{display:flex;align-items:center;gap:8px;font-size:.82rem;color:var(--ink-2)}
.codekey b{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:30px;padding:2px 6px;border-radius:5px;color:#fff;font-size:.7rem;font-weight:700;background:var(--g)}
.codekey em{font-style:normal;color:var(--ink-3);margin-left:auto;white-space:nowrap}
.headcount div{text-align:center;padding:10px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--line)}
.headcount b{display:block;font-size:1.6rem;letter-spacing:-0.02em}
.headcount span{color:var(--ink-2);font-size:.8rem}

/* ============================================================
   FLIGHTS
   ============================================================ */
.board{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.board-row{display:grid;grid-template-columns:96px 1fr;gap:12px;padding:14px 16px;border-top:1px solid var(--line-2);align-items:start}
.board-row:first-child{border-top:0}
.board-row .t{font-size:1.3rem;font-weight:700;letter-spacing:-0.02em;line-height:1;white-space:nowrap}
.board-row .t small{display:block;font-size:.78rem;font-weight:500;color:var(--ink-2);letter-spacing:0;margin-top:4px}
.board-row .t .est{display:block;font-style:normal;font-size:.66rem;font-weight:700;letter-spacing:.02em;color:var(--warn);margin-top:3px}
.board-row .r{font-weight:600}
.board-row .r span{color:var(--ink-2);font-weight:500}
.board-row .who{margin-top:6px;display:flex;flex-wrap:wrap;gap:4px}
.chip{display:inline-block;font-size:.75rem;font-weight:600;padding:2px 8px;border-radius:999px;color:#fff;background:var(--g,var(--ink))}
.chip.o{background:transparent;color:var(--ink-2);border:1px solid var(--line)}
.board-row .note{color:var(--ink-2);font-size:.85rem;margin-top:6px}
.cutoff-wrap{margin:16px 0}
.cutoff-wrap h3{display:flex;align-items:center;gap:8px;font-size:1rem;margin-bottom:10px}
.cut-ico{flex:none;width:20px;height:20px;fill:none;stroke:var(--d3);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cutoff-wrap p{margin-top:8px}
.cutoff{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:460px){.cutoff{grid-template-columns:1fr}}
.cutoff em{display:block;font-style:normal;font-size:.78rem;color:var(--ink-3);margin-top:5px}
.cutoff div{padding:12px 14px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--line)}
.cutoff b{display:block;font-size:1.4rem;letter-spacing:-0.02em}
.cutoff span{display:block;color:var(--ink-2);font-size:.82rem}
.kl-rule{margin-top:12px;padding:10px 14px;border-radius:var(--radius);background:var(--d3-soft);color:#22508A;font-size:.85rem;font-weight:600}
.kl-list{display:grid;gap:10px;margin-top:10px}
.opt{padding:10px 0;border-top:1px solid var(--line-2)}
.opt-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.opt-k{flex:none;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:6px;background:var(--g);color:#fff;font-size:.76rem;font-weight:700}
.opt-h b{font-size:.94rem}
.opt-h em{font-style:normal;font-size:.7rem;font-weight:700;padding:2px 7px;border-radius:999px;background:var(--line-2);color:var(--ink-2)}
.opt-h .lk{font-style:normal;font-size:.7rem;font-weight:700;padding:2px 7px;border-radius:999px;background:var(--warn-soft);color:var(--warn)}
.opt ul{margin:6px 0 0;padding-left:16px;font-size:.86rem;color:var(--ink-2)}
.opt li{margin:3px 0}
.opt-link{margin-top:7px;padding:8px 10px;border-radius:8px;background:var(--warn-soft);color:var(--warn);font-size:.82rem;font-weight:600}
.kl-foot{margin-top:10px;padding-top:9px;border-top:1px solid var(--line-2);font-size:.84rem;color:var(--ink-2)}
.kl{padding:12px 14px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--line);border-left:5px solid var(--g)}
.kl h3{font-size:.98rem;display:flex;justify-content:space-between;gap:8px}
.kl h3 span{font-weight:500;color:var(--ink-2);font-size:.85rem}
.kl p{font-size:.88rem;color:var(--ink-2);margin-top:4px}
.kl .steps{margin:8px 0 0;padding:0;list-style:none;font-size:.88rem}
.kl .steps li{display:flex;gap:8px;padding:3px 0}
.kl .steps li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--g);margin-top:8px}
.seatnote{margin-top:14px;padding:12px 14px;border-radius:var(--radius);border:1px dashed var(--line);font-size:.88rem;color:var(--ink-2);background:var(--panel)}
.seatnote b{color:var(--ink)}

/* ============================================================
   CARS / SEATS
   ============================================================ */
.cars{display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width:901px){.cars{grid-template-columns:1fr 1fr}}
.car{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:14px}
.car h3{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font-size:1rem;flex-wrap:wrap}
.car h3 .sug{font-weight:600;color:var(--d3);font-size:.78rem;margin-right:auto}
.car h3 span{font-weight:500;color:var(--ink-2);font-size:.82rem}
.car .cnote{font-size:.76rem;color:var(--ink-3);margin:4px 0 0;line-height:1.35}
.car .drv{font-size:.82rem;color:var(--ink-2);margin:6px 0 10px}
.car .cfoot{margin-top:9px;font-size:.78rem;color:var(--ink-2)}
.car .drv b{color:var(--ink)}
@media (max-width:420px){.car{padding:12px 10px}.seatkey{gap:3px 8px}.seatkey li{font-size:.73rem}}
/* Seat map: satu SVG, skala penuh ikut lebar bekas */
/* Telefon: lebar penuh supaya nama muat. Tablet: 380px. Desktop: 320px, dua lajur. */
.carmap{display:block;width:100%;height:auto;max-width:250px;margin:10px auto 0}
@media (min-width:500px) and (max-width:900px){.carmap{max-width:380px}}
@media (min-width:901px){.carmap{max-width:320px}}
/* Cadangan kedudukan */
.cadangan{margin-top:10px;border-top:1px solid var(--line-2);padding-top:9px}
.cadangan>summary{display:flex;align-items:center;gap:7px;font-size:.8rem;font-weight:600;color:var(--ink-2);cursor:pointer;list-style:none}
.cadangan>summary::-webkit-details-marker{display:none}
.cadangan>summary::after{content:"";width:6px;height:6px;border-right:1.6px solid var(--ink-3);border-bottom:1.6px solid var(--ink-3);transform:rotate(45deg) translate(-1px,-1px);margin-left:auto}
.cadangan[open]>summary::after{transform:rotate(-135deg)}
.cadangan>summary:focus-visible{outline:2px solid var(--d3);outline-offset:2px;border-radius:6px}
.cadangan ul{margin:8px 0 0;padding-left:17px;display:grid;gap:6px}
.cadangan li{font-size:.8rem;line-height:1.42;color:var(--ink-2)}
.seatkey{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:3px 10px}
.seatkey li{display:flex;align-items:baseline;gap:6px;font-size:.76rem;line-height:1.3;color:var(--ink-2);min-width:0}
.seatkey i{flex:none;width:9px;height:9px;border-radius:50%;background:var(--ink-3);transform:translateY(-1px)}
.seatkey li.beg i{background:transparent;border:1.5px dashed var(--ink-3)}
.seatkey b{flex:none;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;min-width:1.1em}
.seatkey span{min-width:0;overflow-wrap:anywhere}
.own{margin-top:12px;padding:12px 14px;border-radius:var(--radius);border:1px solid var(--line);background:var(--panel);font-size:.9rem;line-height:1.45}
.legend{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:12px;font-size:.8rem;color:var(--ink-2)}
.legend i{display:inline-block;width:12px;height:12px;border-radius:3px;background:var(--g);margin-right:6px;vertical-align:-1px}

/* ============================================================
   ROOMS / TABLES
   ============================================================ */
.stay{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px}
.stay h3{font-size:1.1rem}
.stay p{color:var(--ink-2);font-size:.92rem;margin-top:4px}
.stay .facts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}
@media (max-width:460px){.stay .facts{grid-template-columns:repeat(2,1fr)}}
.stay .facts div{padding:8px 10px;border-radius:8px;background:var(--paper)}
.stay .facts b{display:block;font-size:1.05rem}
.stay .facts span{font-size:.76rem;color:var(--ink-2)}
.rooms{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}
@media (max-width:480px){.rooms{grid-template-columns:repeat(2,1fr)}}
.room{padding:10px;border-radius:8px;border:1px solid var(--line);border-left:5px solid var(--g);font-size:.82rem;line-height:1.25;min-height:64px;background:#fff}
.room b{display:block;font-size:.86rem}
.room small{color:var(--ink-2)}
.room.vacant{border-left-color:var(--line);color:var(--ink-3);border-style:dashed}
table{width:100%;table-layout:fixed;border-collapse:collapse;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;font-size:.9rem}
th,td{padding:10px 12px;text-align:left;border-top:1px solid var(--line-2);vertical-align:top;overflow-wrap:anywhere}
th{font-weight:600;color:var(--ink-2);font-size:.8rem;border-top:0;background:var(--paper)}
td.num,th.num{text-align:right}
td small{color:var(--ink-2);display:block;font-size:.8rem}
.solat-tbl td{white-space:nowrap}
.solat-tbl td:first-child{font-weight:600}
#cost-tbl th.num{width:40%}
#bag-tbl td:first-child{font-weight:600;width:38%}
#fuel-tbl td:first-child,#fuel-tbl th:first-child{font-weight:600;width:37%}
#toll-tbl td:first-child,#toll-tbl th:first-child{font-weight:600;width:40%}
#fuel-tbl,#toll-tbl{font-size:.84rem}
#fuel-tbl th,#fuel-tbl td,#toll-tbl th,#toll-tbl td{padding:9px 7px}
@media (max-width:460px){#fuel-tbl,#toll-tbl{font-size:.78rem}#fuel-tbl th,#fuel-tbl td,#toll-tbl th,#toll-tbl td{padding:8px 5px}}
#cost-tbl td.num{font-weight:600}
.rain{display:grid;gap:10px}
.ladder{display:grid;gap:6px;margin-top:12px}
.lad{display:grid;grid-template-columns:120px 1fr;gap:10px;align-items:baseline;padding:9px 12px;border-radius:8px;border:1px solid var(--line);background:var(--panel);font-size:.85rem;color:var(--ink-2)}
@media (max-width:460px){.lad{grid-template-columns:1fr;gap:2px}}
.lad b{font-size:.82rem;color:var(--ink)}
.lad.l0{border-left:4px solid var(--d2)}
.lad.l1{border-left:4px solid #C9A227}
.lad.l2{border-left:4px solid var(--d1)}
.lad.l3{border-left:4px solid var(--warn)}
.roadcost{display:grid;gap:10px}
.roadcost div{padding:12px 14px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--d3);font-size:.9rem;color:var(--ink-2)}
.roadcost b{display:block;color:var(--ink);margin-bottom:3px}
.rain div{padding:12px 14px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--line);font-size:.92rem}
.rain b{display:block;margin-bottom:2px}
.rain p{color:var(--ink-2)}
.check{columns:2;column-gap:18px;margin:0;padding:0;list-style:none;font-size:.92rem}
@media (max-width:480px){.check{columns:1}}
.check li{break-inside:avoid;display:flex;gap:10px;padding:6px 0;border-bottom:1px solid var(--line-2)}
.check li .ci{flex:none;display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:7px;background:var(--d3-soft);margin-top:1px}
.check li .ci svg{width:15px;height:15px;fill:none;stroke:var(--d3);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ucapan{margin:0;padding:72px 24px;text-align:center;font-size:clamp(1.6rem,6vw,2.4rem);font-weight:600;letter-spacing:-0.02em;line-height:1.25;color:var(--ink)}
.ucapan:empty{display:none}
.pb-hours{display:block;margin-top:3px;color:var(--ink-3);font-size:.78rem}
.pb-note-kecil{margin-top:5px;padding-top:5px;border-top:1px solid var(--line-2);color:var(--ink-3);font-size:.78rem;line-height:1.4}
.det-tips{margin:5px 0 0;padding-left:16px;display:grid;gap:4px}
.det-tips li{line-height:1.4}
.fr24{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;text-decoration-color:var(--line)}
.fr24:hover,.fr24:focus-visible{text-decoration-color:currentColor}
footer{padding:28px 0 60px;color:var(--ink-3);font-size:.8rem;text-align:center}
footer a{color:var(--ink-2)}
#pagi-sabtu{scroll-margin-top:calc(var(--navh,52px) + 14px)}
.to-top{position:fixed;right:14px;bottom:14px;z-index:55;display:flex;align-items:center;justify-content:center;width:42px;height:42px;padding:0;border:1px solid var(--line);border-radius:50%;background:rgba(255,255,255,.94);color:var(--ink);cursor:pointer;box-shadow:0 2px 8px rgba(20,35,46,.16);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .15s,transform .15s,visibility .15s}
.to-top.on{opacity:1;visibility:visible;transform:none}
.to-top svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.to-top:hover,.to-top:focus-visible{background:#fff;border-color:var(--ink-3)}
@media (prefers-reduced-motion:reduce){.to-top{transition:none}}
:focus-visible{outline:2px solid var(--d3);outline-offset:2px}
