:root{
  --bg:#020507;--panel:#070b0d;--panel2:#0b1013;--line:rgba(255,93,15,.28);
  --soft:rgba(255,255,255,.08);--text:#f8fafc;--muted:#aaa;--orange:#ff5a13;
  --orange2:#ff8a1f;--green:#23c45e;--red:#e52d26;--blue:#126af6;--purple:#8b2edb;
}
*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,Segoe UI,Arial,sans-serif;background:radial-gradient(circle at 55% 10%,rgba(255,93,15,.08),transparent 35%),#010405;color:var(--text);min-height:100vh;display:flex}button,input{font:inherit}.sidebar{width:280px;min-height:100vh;border-right:1px solid var(--line);padding:24px 20px;position:fixed;left:0;top:0;bottom:0;background:linear-gradient(180deg,#02080b,#010304)}.brand{display:flex;gap:16px;align-items:center;margin-bottom:34px}.brand-icon{width:64px;height:64px;border-radius:14px;background:linear-gradient(135deg,var(--orange),#ff7a16);display:grid;place-items:center;font-size:32px;color:#111}.brand h1{font-size:21px;letter-spacing:.5px}.brand strong{color:var(--orange);font-size:18px}.brand span{display:block;color:var(--muted);font-size:14px;margin-top:4px}.side-nav{display:grid;gap:10px}.side-nav a{color:#d6d6d6;text-decoration:none;display:flex;gap:16px;align-items:center;padding:14px 16px;border-radius:10px;font-size:17px}.side-nav a.active,.side-nav a:hover{color:var(--orange);background:linear-gradient(90deg,rgba(255,91,13,.2),rgba(255,91,13,.06));outline:1px solid rgba(255,91,13,.42)}.promo-card,.settings-card{margin-top:28px;border:1px solid var(--line);border-radius:12px;padding:20px;background:linear-gradient(145deg,rgba(255,91,13,.12),rgba(0,0,0,.15))}.promo-card h3{color:var(--orange);font-size:20px}.promo-card p{line-height:1.55;color:#d7d7d7;margin:10px 0}.bus-illo{font-size:72px;text-align:right;opacity:.6}.promo-card button,.status button{width:100%;padding:13px;border-radius:8px;border:1px solid var(--orange);background:transparent;color:var(--orange);font-weight:700}.settings-card{display:grid;gap:18px}.settings-card div{display:flex;justify-content:space-between;color:#ddd}.settings-card b{width:38px;height:20px;border-radius:20px;background:var(--orange);position:relative}.settings-card b:after{content:"";width:14px;height:14px;background:white;border-radius:50%;position:absolute;right:3px;top:3px}.settings-card em{font-style:normal}.app{margin-left:280px;flex:1;padding:22px}.topbar{display:flex;justify-content:space-between;gap:24px;margin-bottom:18px}.search{height:58px;max-width:760px;flex:1;border:1px solid var(--line);border-radius:10px;background:#050709;display:flex;align-items:center;gap:14px;padding:0 22px;color:#f3b27f}.search input{background:transparent;border:0;outline:0;color:white;width:100%;font-size:17px}.top-actions{display:flex;align-items:center;gap:18px}.weather{height:58px;min-width:175px;border:1px solid rgba(255,91,13,.18);border-radius:10px;background:#071015;display:flex;align-items:center;gap:10px;padding:0 18px}.weather strong{font-size:22px}.weather small,.user small{display:block;color:var(--muted)}.bell{width:58px;height:58px;border-radius:50%;border:1px solid var(--line);background:#050709;color:#eee;position:relative}.bell i{position:absolute;right:5px;top:3px;background:var(--orange);border-radius:50%;font-size:12px;padding:3px 6px}.user{display:flex;align-items:center;gap:12px}.avatar{width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,#3b2418,#111);border:1px solid var(--line)}.layout{display:grid;grid-template-columns:1fr 390px;gap:18px}.panel{background:linear-gradient(180deg,rgba(8,13,15,.98),rgba(4,6,7,.98));border:1px solid rgba(255,91,13,.18);border-radius:10px;box-shadow:0 0 30px rgba(0,0,0,.25)}.map-card{overflow:hidden}.map-bg{height:360px;position:relative;background:radial-gradient(circle at 58% 54%,rgba(255,91,13,.12),transparent 20%),linear-gradient(135deg,#0d1416,#030505)}.map-bg:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:35px 35px;opacity:.35}.city{position:absolute;left:43%;top:38%;font-weight:800;font-size:32px;color:#aaa;letter-spacing:2px}.place{position:absolute;color:#c9c9c9;font-size:17px}.lanang{left:30%;top:20%}.agdao{left:43%;top:34%}.matina{left:17%;top:82%}.gulf{right:15%;bottom:28%;color:var(--orange)}.routes{position:absolute;inset:0}.r{fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px currentColor)}.r.orange{stroke:var(--orange)}.r.green{stroke:#40d96b}.r.blue{stroke:#4f91ff}.r.red{stroke:#ff3434}.bus{position:absolute;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;box-shadow:0 0 18px currentColor}.b1{left:17%;top:25%;background:var(--orange)}.b2{left:58%;top:9%;background:#27b34c}.b3{right:12%;top:27%;background:#1b77ff}.b4{left:44%;bottom:13%;background:#e52d26}.zoom{position:absolute;left:16px;bottom:18px;display:grid;gap:8px}.zoom button{width:38px;height:38px;background:#050607;color:#fff;border:1px solid var(--soft);border-radius:6px;font-size:20px}.layers{position:absolute;right:18px;bottom:18px;background:rgba(0,0,0,.72);padding:12px 16px;border-radius:8px;display:grid;gap:9px}.layers input{accent-color:var(--orange)}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:14px}.stat{padding:18px;min-height:142px}.stat{position:relative;overflow:hidden}.stat-icon{width:54px;height:54px;background:rgba(255,91,13,.18);color:var(--orange);font-size:29px;border-radius:10px;display:grid;place-items:center;float:left;margin-right:16px}.stat strong{font-size:31px}.stat span,.stat small{display:block}.stat small{color:var(--muted);margin-top:4px}.stat svg{position:absolute;left:18px;right:18px;bottom:16px;width:calc(100% - 36px);height:35px}.stat polyline{fill:none;stroke:var(--orange);stroke-width:3}.lower-grid{display:grid;grid-template-columns:1fr 350px;gap:14px;margin-top:14px}.panel-head{display:flex;justify-content:space-between;align-items:center;padding:18px 18px 6px}.panel-head h2{font-size:20px}.panel-head a{color:var(--orange);font-weight:600}.route-row{display:grid;grid-template-columns:46px 1.5fr .8fr .8fr .8fr .7fr 25px;gap:12px;align-items:center;padding:12px 18px;border-top:1px solid rgba(255,255,255,.06)}.tag{width:42px;height:42px;border-radius:8px;display:grid;place-items:center;font-size:24px;color:white}.purple{background:var(--purple)}.green{background:#2dac3d}.blue{background:#126af6}.red{background:#d9312c}.route-row small,.stop small,.arrival small,.alert small{display:block;color:var(--muted);line-height:1.4}.route-row span{color:#cfcfcf;font-size:14px}.route-row em,.stop em{font-style:normal;color:#ddd;font-size:24px}.stops-card{padding-bottom:12px}.stop{margin:10px 14px;padding:12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.05);border-radius:8px;display:grid;grid-template-columns:42px 1fr 24px;gap:10px;align-items:center}.stop b{font-size:24px}.stop em{color:#ffa30f}.rightbar{display:grid;gap:14px;align-content:start}.arrival{display:grid;grid-template-columns:48px 1fr 46px 20px;gap:12px;align-items:center;margin:10px 14px;padding:11px;border-radius:9px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.05)}.arrival span{font-size:26px;text-align:center}.arrival span small{font-size:13px}.alerts .alert{display:grid;grid-template-columns:35px 1fr 50px;gap:10px;padding:15px 18px;border-top:1px solid rgba(255,255,255,.06)}.alert b{color:#ffae2a}.alert .ok{color:#39c765}.alert span{color:#aaa;font-size:13px}.status{padding-bottom:16px}.status p{display:flex;justify-content:space-between;padding:10px 18px;color:#ccc}.status p span{color:#38c75b}.status button{width:calc(100% - 36px);margin:12px 18px 0;color:var(--orange)}footer{border-top:1px solid var(--line);margin-top:18px;padding:22px 0;text-align:center;color:#9d9d9d;position:relative}footer div{position:absolute;right:50px;top:20px;display:flex;gap:14px}footer span{width:44px;height:44px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;color:#ddd}@media(max-width:1280px){.layout{grid-template-columns:1fr}.rightbar{grid-template-columns:repeat(3,1fr)}.lower-grid{grid-template-columns:1fr}.topbar{flex-direction:column}.top-actions{justify-content:space-between}.sidebar{width:230px}.app{margin-left:230px}.stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:900px){body{display:block}.sidebar{position:relative;width:100%;min-height:auto}.side-nav{grid-template-columns:repeat(2,1fr)}.app{margin-left:0}.rightbar{grid-template-columns:1fr}.stats{grid-template-columns:1fr}.route-row{grid-template-columns:46px 1fr}.route-row span,.route-row em{display:none}footer div{position:static;justify-content:center;margin-top:18px}}@media(max-width:600px){.top-actions{flex-wrap:wrap}.weather{flex:1}.user{width:100%}.map-bg{height:300px}.side-nav{grid-template-columns:1fr}.search{height:52px}.brand-icon{width:52px;height:52px}.city{font-size:24px}.promo-card,.settings-card{display:none}}