500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#182f31;--muted:#788588;--green:#146b57;--line:#e3e9e6;--bg:#f5f7f5}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px 'DM Sans',Arial,sans-serif}button,input,select,textarea{font:inherit}button,a,select{cursor:pointer}button{border:1px solid var(--line);background:white;border-radius:7px;padding:10px 15px;color:var(--ink);font-weight:600}button:hover{filter:brightness(.96)}button.primary{background:var(--green);color:white;border-color:var(--green)}button.link{border:0;background:none;padding:5px;color:var(--green)}aside{width:238px;background:#102d2a;position:fixed;inset:0;color:#c3d1ca;padding:30px 20px;display:flex;flex-direction:column}.brand{display:flex;gap:10px;color:white;text-decoration:none;font:800 25px Manrope,Arial}.brand>span{display:block}.brand i{display:block;font:8px 'DM Sans';letter-spacing:2.1px;color:#8eaaa0;margin-top:7px}.workspace{display:flex;align-items:center;gap:12px;border:1px solid #34514a;padding:14px 9px;margin:35px 0;font-size:11px;border-radius:8px}.workspace span{font-size:12px;font-weight:600}small{display:block;font-size:11px;font-weight:400;color:var(--muted);margin-top:5px}.workspace small{color:#88a59c;font-size:9px}.navlabel{font-size:9px;letter-spacing:1.6px;margin-bottom:15px;color:#77948a}nav button{display:block;text-align:left;width:100%;margin-bottom:6px;border:0;background:none;color:#a8c0b5;padding:13px;font-weight:500}nav button.active{background:#254b40;color:#fff}nav button b{margin-right:12px;font-size:17px}.asidefoot{margin-top:auto}.demo{font-size:11px;border-top:1px solid #315047;padding-top:18px;color:#b9d5a7}.demo small{color:#79988c;font-size:9px}.person{display:flex;gap:14px;align-items:center;margin-top:25px;color:white}.person span{font-size:12px}.person small{color:#8aa79c}.shell{margin-left:238px}header{height:77px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 38px;background:white;font-size:12px;color:var(--muted)}header>div{display:flex;gap:18px;align-items:center}select,input,textarea{padding:10px;border:1px solid var(--line);border-radius:6px;background:white;color:var(--ink)}.avatar{border-radius:50%;padding:6px 11px}main{padding:32px 38px;max-width:1600px;margin:auto}.eyebrow{font-size:10px;letter-spacing:1.7px;color:var(--green);font-weight:700}.heading{display:flex;justify-content:space-between;align-items:center;margin:10px 0 26px}h1{font:800 29px Manrope,Arial;margin:0 0 8px;letter-spacing:-1px}h2{font:700 17px Manrope,Arial;margin:0}h3{font-size:14px}p{color:var(--muted);line-height:1.6;margin:0}.heading p{font-size:12px}.actions{display:flex;gap:10px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:25px}.stat{padding:21px;background:white;border:1px solid var(--line);border-radius:10px}.stat label{color:#697c76;font-size:11px}.stat strong{display:block;font:800 29px Manrope;margin:12px 0}.stat small{font-size:10px}.stat .dot{float:right;color:var(--green)}.grid{display:grid;grid-template-columns:minmax(0,2.7fr) minmax(260px,1fr);gap:22px}.panel{background:white;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-bottom:22px}.panelhead{display:flex;justify-content:space-between;align-items:center;padding:21px 23px;border-bottom:1px solid var(--line)}.panelhead small{font-size:11px}.tabs{display:flex;gap:22px;padding:16px 23px 0;border-bottom:1px solid var(--line)}.tabs button{padding:0 0 15px;border:0;border-radius:0;background:none;color:var(--muted);font-size:12px}.tabs button.active{color:var(--green);border-bottom:2px solid var(--green)}.toolbar{display:flex;gap:10px;padding:15px 23px}.toolbar input{flex:1;min-width:0;font-size:12px}.tablewrap{overflow:auto}table{border-collapse:collapse;width:100%;text-align:left;white-space:nowrap}th{font-size:9px;text-transform:uppercase;letter-spacing:.8px;color:#87928e;background:#fafbf9;padding:13px 20px;font-weight:500}td{font-size:12px;padding:18px 20px;border-top:1px solid #eff2ef}td small{font-size:10px}tbody tr{cursor:pointer}tbody tr:hover{background:#f7faf8}.ref{color:var(--green);font-weight:700}.badge{display:inline-block;padding:6px 9px;font-size:10px;border-radius:5px;background:#e8f3eb;color:#317148}.badge.transit{background:#e8effb;color:#476fba}.badge.wait{background:#fff1d9;color:#a57723}.badge.late{background:#fae7e4;color:#b35b4d}.panelbottom{padding:15px 23px;color:var(--muted);font-size:10px;display:flex;justify-content:space-between}.attention{padding:18px 22px;border-bottom:1px solid var(--line);display:flex;gap:12px}.attention:last-child{border:0}.attention strong{font-size:12px}.attention p{font-size:11px;margin-top:5px}.attention .icon{color:#ad7b24;background:#fff3de;width:29px;height:29px;border-radius:7px;text-align:center;padding-top:6px;flex-shrink:0}.routepanel{padding:24px;background:#e9f0e7}.routepanel h2{margin:9px 0;font-size:21px}.routepanel p{font-size:12px;color:#62806d}.routegraphic{height:95px;margin:20px 0;position:relative;background:radial-gradient(circle at 20% 80%,#c5d7bc 1px,transparent 2px);background-size:12px 12px}.routegraphic:after{content:'● ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ◉';position:absolute;top:38%;left:5%;color:var(--green);font-size:18px}.routeends{display:flex;justify-content:space-between;font-size:11px}.activity{padding:18px 22px;display:flex;gap:12px;font-size:11px}.activity p{font-size:11px}.activity .icon{color:var(--green)}footer{padding:12px 38px 25px;font-size:10px;color:#8b9892;display:flex;justify-content:space-between}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{padding:24px;background:white;border:1px solid var(--line);border-radius:10px}.card h2{margin:12px 0}.card p{font-size:12px}.card button{margin-top:20px}.row{display:flex;justify-content:space-between;align-items:center;gap:15px}.metric{padding:15px 0;border-bottom:1px solid var(--line);font-size:12px}.metric b{font-size:15px}dialog{border:0;border-radius:14px;padding:28px;width:680px;max-width:95vw;max-height:92vh;color:var(--ink);box-shadow:0 20px 80px #142c3340}dialog::backdrop{background:#102b2966;backdrop-filter:blur(3px)}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:22px 0}.formgrid label{font-size:11px;color:#697b75}.formgrid input,.formgrid select,.formgrid textarea{width:100%;margin-top:6px}.formgrid .wide{grid-column:1/-1}.notice{padding:13px;background:#edf4eb;border-radius:7px;color:#537059;font-size:12px;margin:16px 0}.detailtabs{display:flex;gap:8px;margin:20px 0}.detailtabs button.active{background:var(--green);color:white}.detailbody{min-height:230px}.timeline{padding:12px 0;border-bottom:1px solid var(--line);font-size:12px}#toast{position:fixed;right:30px;bottom:25px;background:#163e33;color:white;padding:14px 22px;border-radius:9px;display:none;z-index:100}.empty{padding:35px;text-align:center;color:var(--muted)}.bar{height:7px;background:#edf1eb;border-radius:10px;margin:12px 0}.bar span{display:block;height:100%;background:#458767;border-radius:10px}@media(max-width:1100px){aside{width:195px;padding:25px 14px}.shell{margin-left:195px}main{padding:25px}.grid{grid-template-columns:1fr}.cards{grid-template-columns:repeat(2,1fr)}.date{display:none}}@media(max-width:700px){aside{position:static;width:auto;padding:18px}.brand{font-size:20px}.workspace,.navlabel,.asidefoot{display:none}nav{display:flex;overflow:auto;margin-top:15px}nav button{width:auto;white-space:nowrap;padding:9px;font-size:11px}nav button b{display:none}.shell{margin:0}header{padding:0 20px;height:60px}main{padding:22px 16px}.heading{align-items:flex-start;gap:15px;flex-direction:column}h1{font-size:25px}.stats{grid-template-columns:1fr 1fr;gap:10px}.stat{padding:16px}.stat strong{font-size:25px}.cards{grid-template-columns:1fr}.formgrid{grid-template-columns:1fr}.formgrid .wide{grid-column:auto}footer{padding:20px;gap:12px;flex-direction:column}.detailtabs{overflow:auto}}


.panel{overflow-x:auto}.actions{flex-wrap:wrap}dialog code{overflow-wrap:anywhere}@media(max-width:700px){header{height:auto;min-height:70px;flex-wrap:wrap;gap:12px;padding:12px 16px}header>div{flex-wrap:wrap;gap:7px}header button{padding:8px 10px;font-size:11px}.detailtabs{flex-wrap:wrap}.row{flex-wrap:wrap}}
