:root{--navy:#132b3b;--ink:#193442;--muted:#76848c;--teal:#0f8c80;--pale:#e8f6f2;--line:#e4ebed;--bg:#f5f8f8;--white:#fff;--shadow:0 3px 18px #153d4210;font-family:"Segoe UI",Tahoma,Arial,sans-serif;color:var(--ink);font-size:14px}*{box-sizing:border-box}body{margin:0;background:var(--bg)}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a,input,select{outline-offset:4px}button{cursor:pointer}.sidebar{width:246px;position:fixed;inset:0 auto 0 0;background:var(--navy);color:#d9e5eb;padding:32px 18px;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:12px;font-size:24px;font-weight:750;letter-spacing:1px;padding:0 12px 40px;color:white}.brand-mark{display:grid;place-items:center;background:#16aa96;color:#fff;border-radius:12px;width:43px;height:43px;font-size:26px;box-shadow:inset 0 0 0 1px #ffffff25}.brand small{display:block;font-size:8px;letter-spacing:2.7px;font-weight:500;color:#91adb9;margin-top:4px}.nav-label{font-size:10px;font-weight:700;letter-spacing:1.7px;color:#71909f;margin:25px 14px 10px}.nav-item{display:flex;gap:11px;align-items:center;font-size:12px;padding:14px 13px;margin:3px 0;border-radius:7px}.nav-item span{font-size:18px}.nav-item:hover{background:#ffffff0c}.nav-item.active{background:#1a4a50;color:#75e1ce;border-left:3px solid #34c3a8;padding-left:10px}.sidebar-foot{margin-top:auto;border-top:1px solid #ffffff13;padding:22px 11px 0;font-size:10px;color:#a7bec7}.sidebar-foot small{display:block;margin:7px 0 0 13px;color:#6f919f;font-size:10px}.secure-dot{display:inline-block;width:7px;height:7px;background:#20ad91;border-radius:50%;margin-right:6px;vertical-align:middle}.workspace{margin-left:246px;min-height:100vh;display:flex;flex-direction:column}.topbar{height:74px;background:#fff;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 38px;font-size:12px}.topbar>span{font-weight:600}.account{display:flex;gap:22px;align-items:center}.account>a{border-left:1px solid var(--line);padding-left:22px}.link-button{background:none;border:none;color:var(--muted);font-size:12px}.workspace main{padding:35px 38px;max-width:1900px;width:100%;margin:auto;flex:1}.muted{color:var(--muted)}.small{font-size:12px;line-height:1.7}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:750;color:var(--teal)}h1{font-size:32px;font-weight:650;letter-spacing:-1.1px;margin:10px 0 10px;line-height:1.25}h2{font-size:16px;font-weight:650;letter-spacing:-.25px;margin:0 0 8px}p{line-height:1.7;margin:8px 0}.accent{color:#10a28d}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:28px}.page-heading p{font-size:12px}.sync-chip{padding:12px 15px;border:1px solid var(--line);border-radius:7px;background:white;font-size:10px;color:var(--muted);white-space:nowrap}.sync-chip strong{display:block;margin:6px 0 0 14px;color:#425f68;font-size:11px;font-weight:500}.filter-bar{display:flex;align-items:flex-end;gap:12px;padding:18px;background:white;border:1px solid var(--line);border-radius:10px;margin-bottom:25px;flex-wrap:wrap}.filter-bar>div{min-width:130px}.filter-bar .filter-grow{flex:1;min-width:220px}label{font-size:11px;font-weight:650;color:#516a74;display:block;margin:0 0 7px}input:not([type=checkbox]),select{border:1px solid #dce5e8;border-radius:6px;padding:10px 11px;background:#fff;color:var(--ink);min-height:39px;width:100%}input::placeholder{color:#9aa7ad;font-size:11px}input:focus,select:focus{border-color:var(--teal)}input[readonly]{background:#f4f7f7}input[type=checkbox]{accent-color:var(--teal);width:16px;height:16px;margin:0}.button{border:1px solid #dce5e8;background:#fff;padding:10px 15px;min-height:39px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:6px;font-size:11px;font-weight:650;white-space:nowrap;color:#45616c}.button:hover{background:#f0f7f6;border-color:#b8d5ce}.button.primary{background:var(--teal);color:white;border-color:var(--teal)}.button.primary:hover{background:#08786e}.button:disabled{opacity:.6;cursor:wait}.button.full{width:100%;margin-top:25px}.small-button{padding:6px 11px;min-height:31px;font-size:11px}.text-link{color:var(--teal);font-weight:650;font-size:12px}.text-link:hover{text-decoration:underline}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:0 0 24px}.stat{position:relative;background:white;border:1px solid var(--line);border-radius:10px;padding:23px;overflow:hidden}.stat>span{font-size:12px;color:#617a85;font-weight:600}.stat>strong{font-size:34px;display:block;letter-spacing:-1px;margin:13px 0 9px;font-weight:650}.stat>small{font-size:10px;color:#91a0a8}.stat>i{font-style:normal;position:absolute;right:19px;top:17px;background:var(--pale);color:var(--teal);padding:7px 11px;border-radius:8px;font-size:20px}.stat strong.date-stat{font-size:19px;letter-spacing:-.3px}.charts-grid{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(0,1fr);gap:23px;margin-bottom:23px}.panel{padding:24px;background:white;border:1px solid var(--line);border-radius:10px;margin-bottom:22px;min-width:0;box-shadow:var(--shadow)}.charts-grid>.panel,.bottom-grid>.panel{margin:0}.panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:23px}.panel-heading p{margin:0;font-size:10px}.legend{font-size:10px;color:var(--muted);white-space:nowrap;margin-top:5px}.mini-icon{font-size:20px;color:#8caaa9}.column-chart{display:flex;gap:10px;align-items:flex-end;height:225px;padding-top:12px;background:repeating-linear-gradient(to top,transparent,transparent 49px,#edf2f2 50px);border-bottom:1px solid var(--line)}.column{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;height:100%;justify-content:flex-end;position:relative}.column-track{height:165px;width:65%;display:flex;align-items:flex-end}.column-fill{background:linear-gradient(#1aaa97,#178b81);width:100%;border-radius:4px 4px 0 0;min-height:2px}.column small{font-size:9px;color:var(--muted);white-space:nowrap;margin:12px 0}.bar-count{font-size:10px;color:#5d7d82;margin-bottom:6px}.horizontal-bar{margin:22px 0}.horizontal-bar>div:first-child{display:flex;justify-content:space-between;font-size:11px;margin-bottom:10px}.horizontal-bar strong{font-weight:600}.track{height:8px;border-radius:4px;background:#edf4f3;overflow:hidden}.track span{height:100%;background:#2aaa94;display:block;border-radius:4px}.bottom-grid{display:grid;grid-template-columns:minmax(0,2.5fr) minmax(0,1fr);gap:23px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;text-align:left;font-size:11px}th{font-size:9px;letter-spacing:.7px;font-weight:650;color:#7f959e;padding:13px 11px;border-bottom:1px solid var(--line);background:#f8fafa;white-space:nowrap}td{padding:17px 11px;border-bottom:1px solid #edf1f2;line-height:1.6;vertical-align:middle}tr:last-child td{border-bottom:none}td small,.document small{display:block;font-size:10px;color:#8499a0;margin-top:3px}td strong{font-weight:600}tbody tr:hover{background:#fbfdfc}.destination{display:flex;align-items:center;gap:12px;border-bottom:1px solid #edf1f2;padding:15px 0;font-size:11px}.destination:last-child{border:none}.destination>strong{margin-left:auto;font-size:12px}.port-icon{display:grid;place-items:center;width:32px;height:32px;background:var(--pale);color:var(--teal);border-radius:8px}.badge{padding:5px 9px;background:#e8f6f0;color:#258469;border-radius:5px;font-size:10px;font-weight:650;display:inline-block}.danger{color:#ba4c56;background:#fff4f3;border-color:#f1d7d6}.empty{padding:35px;text-align:center;color:var(--muted);font-size:12px}.pagination{display:flex;justify-content:space-between;align-items:center;margin-top:18px;font-size:11px;color:var(--muted)}.pagination>div{display:flex;gap:8px}.notice{border:1px solid #cde3e0;background:#edf8f5;color:#3c736b;padding:14px 17px;font-size:12px;border-radius:7px;line-height:1.8;margin-bottom:22px}.success{background:#e8f7ed;border-color:#c6e6d3}.validation{color:#b3394e;font-size:12px;line-height:1.7}.validation:empty{display:none}.validation ul{padding-left:18px}.validation-summary-valid{display:none}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:20px 0}.check-list{display:flex;flex-wrap:wrap;gap:14px 25px;margin:18px 0}.check-list label{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:500}fieldset{border:1px solid var(--line);border-radius:7px;padding:12px 18px;margin:20px 0}legend{font-size:11px;padding:0 8px;color:var(--muted)}.row-actions{display:flex;gap:8px;align-items:center}.row-actions form{display:inline}.narrow{max-width:540px}.narrow input{margin-bottom:20px}.detail-grid{display:grid;grid-template-columns:minmax(120px,1fr) 2fr;gap:0;margin-bottom:0}.detail-grid dt,.detail-grid dd{padding:12px 0;border-bottom:1px solid #edf1f2;font-size:12px;margin:0;overflow-wrap:anywhere}.detail-grid dt{color:var(--muted)}.document{display:flex;gap:13px;align-items:center;padding:19px 0;border-bottom:1px solid var(--line)}.document:last-child{border:0}.document>div{flex:1;min-width:0;overflow-wrap:anywhere}.document strong{font-size:11px;font-weight:500}.file-icon{font-size:24px;background:var(--pale);color:var(--teal);padding:9px 12px;border-radius:8px}.route-banner{display:flex;align-items:center;gap:40px;background:#153d47;border-radius:10px;padding:25px 30px;color:white;margin-bottom:24px}.route-banner small{display:block;color:#92bcbf;letter-spacing:1.2px;font-size:9px;margin-bottom:9px}.route-banner strong{font-size:19px;font-weight:550}.route-banner>span{font-size:30px;color:#4dc3ad}.route-banner>div:last-child{margin-left:auto}footer{padding:18px 38px;border-top:1px solid var(--line);font-size:10px;color:#849ba3;display:flex;gap:20px}footer span{margin-left:auto}.public-main{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:40px}.login-shell{display:grid;grid-template-columns:1.15fr 1fr;width:1040px;max-width:100%;min-height:620px;border-radius:20px;overflow:hidden;box-shadow:0 25px 80px #1b49401c;background:white}.login-intro{background:#123b47;padding:45px;color:white;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.login-intro .brand{padding:0;font-size:25px}.login-intro .eyebrow{color:#66d7bc;font-size:9px}.login-intro h1{font-size:42px;font-weight:500;line-height:1.15;letter-spacing:-1.5px;margin:20px 0}.login-intro p{font-size:12px;color:#a7c5ca;max-width:350px;line-height:1.9}.login-intro>small{font-size:10px;color:#7fa8ad}.login-form{padding:90px 55px 45px;align-self:center}.login-form h2{font-size:30px;margin:12px 0}.login-form>.muted{font-size:12px;margin-bottom:32px}.login-form label{margin-top:20px}.login-form>p:last-child{text-align:center;margin-top:25px}.ocean-art{height:130px;position:relative;margin:25px 0 0}.ship{height:32px;background:#8da8a7;position:absolute;bottom:29px;left:10px;right:25px;clip-path:polygon(0 0,100% 0,90% 100%,7% 100%)}.container{position:absolute;height:30px;width:75px;background:repeating-linear-gradient(90deg,#31a792,#31a792 12px,#207e74 13px);bottom:65px;left:45px;border:2px solid #4eaf9e}.container.c2{left:122px;background:repeating-linear-gradient(90deg,#467c87,#467c87 12px,#2b606e 13px);border-color:#5b9197}.container.c3{left:122px;bottom:97px}.wave{height:2px;position:absolute;bottom:20px;left:0;right:0;background:#58b3aa;box-shadow:20px 8px 0 #427c82,50px 16px 0 #2c606b}
@media(min-width:1600px){.workspace main{padding:40px 50px}.stat{padding:26px}.column-chart{height:250px}.column-track{height:190px}}@media(max-width:1150px){.sidebar{width:205px;padding-left:12px;padding-right:12px}.brand{font-size:21px;gap:9px}.brand-mark{width:36px;height:36px}.workspace{margin-left:205px}.workspace main{padding:25px}.topbar{padding:0 25px}.stats-grid{gap:12px}.stat{padding:18px}.stat>i{display:none}.charts-grid,.bottom-grid{grid-template-columns:1.5fr 1fr;gap:16px}.panel{padding:19px}.legend{display:none}.filter-bar select{max-width:280px}.column-chart{gap:5px}.column small{font-size:8px}}@media(max-width:850px){.sidebar{position:static;width:100%;padding:15px 20px;display:flex;flex-direction:row;gap:8px;align-items:center;flex-wrap:wrap}.brand{padding:0 12px 0 0;font-size:20px}.brand small,.nav-label,.sidebar-foot{display:none}.nav-item{font-size:11px;padding:9px}.nav-item.active{border-left:0;border-bottom:2px solid #34c3a8;padding:9px}.nav-item span{display:none}.workspace{margin-left:0}.topbar{height:60px}.stats-grid{grid-template-columns:repeat(2,1fr)}.charts-grid,.bottom-grid{grid-template-columns:1fr}.page-heading{align-items:flex-start}.sync-chip{display:none}h1{font-size:27px}.panel-heading{flex-wrap:wrap}.login-shell{grid-template-columns:1fr;max-width:500px}.login-intro{padding:30px;min-height:210px}.login-intro>div{margin-top:35px}.login-intro h1{font-size:28px;margin:12px 0}.login-intro p,.ocean-art,.login-intro>small{display:none}.login-form{padding:35px}.route-banner{gap:20px;flex-wrap:wrap}.route-banner>div:last-child{margin:0}.public-main{padding:20px}.form-grid{grid-template-columns:1fr}footer span{display:none}}@media(max-width:520px){.workspace main{padding:22px 14px}.topbar{padding:0 15px;font-size:10px}.account{gap:9px}.account>a{padding-left:10px}.page-heading{flex-wrap:wrap;gap:12px}.filter-bar{padding:14px;gap:12px}.filter-bar>div{flex:1;min-width:120px}.filter-bar .filter-grow{min-width:100%}.stat>strong{font-size:29px}.stat>small{font-size:9px}.stat{padding:15px}.column-chart{gap:3px}.column small{font-size:7px;transform:rotate(-30deg)}.document{flex-wrap:wrap}.document>a{margin-left:auto}.detail-grid{grid-template-columns:1fr 1.3fr}.route-banner strong{font-size:15px}.login-form{padding:30px 25px}.login-intro{padding:25px}.pagination{flex-wrap:wrap;gap:15px}}

.date-field{position:relative;min-width:155px}.date-field input[data-date-display]{padding-right:39px}.date-field .date-native{position:absolute;right:0;bottom:0;width:38px;height:39px;min-height:0;opacity:0;pointer-events:none;padding:0}.date-toggle{position:absolute;right:0;top:0;width:38px;height:100%;border:0;border-radius:0 6px 6px 0;background:transparent;color:#627e86;display:grid;place-items:center}.date-toggle:hover{color:var(--teal);background:var(--pale)}


.shipment-table-heading{align-items:center;flex-wrap:wrap;margin-bottom:16px}.shipment-table-heading h2,.shipment-table-heading p{margin:0}.shipment-table-wrap{max-height:65vh;border:1px solid var(--line);border-radius:7px}.shipment-grid{width:max-content;min-width:100%}.shipment-grid th,.shipment-grid td{white-space:nowrap;min-width:105px}.shipment-grid th{position:sticky;top:0;z-index:2;padding:0;background:#f8fafa;text-transform:none;letter-spacing:0}.sort-link{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:44px;padding:13px 14px;color:#657f89;font-size:11px}.sort-link:hover,.sort-link.sorted{color:var(--teal);background:var(--pale)}.sort-link span{font-size:10px;color:#92aaa9}.sort-link.sorted span{color:var(--teal)}.shipment-grid th:first-child,.shipment-grid td:first-child{position:sticky;left:0;z-index:1;min-width:135px;background:#fff;box-shadow:1px 0 0 var(--line)}.shipment-grid th:last-child,.shipment-grid td:last-child{position:sticky;right:0;z-index:1;min-width:110px;background:#fff;box-shadow:-1px 0 0 var(--line)}.shipment-grid th:first-child,.shipment-grid th:last-child{z-index:3;background:#f8fafa}.shipment-grid th:last-child{padding:13px 14px;font-size:11px}.shipment-grid tbody tr:hover td{background:#f7fbfa}.shipment-grid td.empty{position:static;box-shadow:none}


.filter-bar .shipment-field-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;width:100%;flex-basis:100%;border-top:1px solid var(--line);padding-top:18px;margin-top:4px}.shipment-filter-help{flex-basis:100%;margin:0;font-size:11px}.filter-bar .shipment-filter-actions{display:flex;gap:10px;flex-basis:100%}.shipment-filter-bar .filter-grow{min-width:250px}.shipment-field-filters select{max-width:none;width:100%}@media(min-width:1500px){.filter-bar .shipment-field-filters{grid-template-columns:repeat(6,minmax(0,1fr))}}@media(max-width:650px){.filter-bar .shipment-field-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:390px){.filter-bar .shipment-field-filters{grid-template-columns:1fr}}

