/* Compact portal shell. Readability and touch targets remain independent of density. */
body[data-portal-compact="1"]{--portal-gap:12px;--portal-radius:12px;font-size:15px;line-height:1.45;background:#f4f6f3}
body[data-portal-compact="1"] #app main{padding:24px;max-width:1200px;min-width:0}
body[data-portal-compact="1"] #app .top{gap:12px;margin-bottom:16px;align-items:center}
body[data-portal-compact="1"] #app h1{font-size:clamp(24px,3vw,32px);line-height:1.2;margin:4px 0 8px}
body[data-portal-compact="1"] #app h2{font-size:19px;line-height:1.3;margin:0 0 8px}
body[data-portal-compact="1"] #app .card,body[data-portal-compact="1"] #app .metric{padding:16px;border-radius:var(--portal-radius);margin-bottom:12px;box-shadow:none}
body[data-portal-compact="1"] #app .head{gap:12px;margin-bottom:10px}
body[data-portal-compact="1"] #app .row,body[data-portal-compact="1"] #app .list-row{padding:12px 0}
body[data-portal-compact="1"] #app .metrics{gap:10px;margin:14px 0}
body[data-portal-compact="1"] #app .cols,body[data-portal-compact="1"] #app .container-grid{gap:12px}
body[data-portal-compact="1"] #app .compact-disclosure{border:0;border-top:1px solid #e0e6df;margin:8px 0 0;padding:0;background:transparent;border-radius:0;min-width:0}
body[data-portal-compact="1"] #app .compact-disclosure>summary{min-height:44px;display:list-item;align-content:center;cursor:pointer;font-weight:600;color:#365842;padding:10px 0;overflow-wrap:anywhere}
body[data-portal-compact="1"] #app .compact-disclosure>p{margin:0 0 12px}
body[data-portal-compact="1"] #app .compact-disclosure>label{display:block;margin:8px 0}
body[data-portal-compact="1"] #app .page-intro>.compact-disclosure{border:0;margin:0;font-size:13px}
body[data-portal-compact="1"] #app .page-intro>.compact-disclosure>summary{padding:3px 0;min-height:44px}
body[data-portal-compact="1"] #app .order-filters,body[data-portal-compact="1"] #app .doc-filters{display:block}
body[data-portal-compact="1"] #app .order-filters>label,body[data-portal-compact="1"] #app .doc-filters>label{display:block}
body[data-portal-compact="1"] #app .balance-toolbar{padding:0;border:0;border-radius:0;background:transparent}
body[data-portal-compact="1"] #app .button,body[data-portal-compact="1"] #app nav button{min-height:44px}
body[data-portal-compact="1"] #app input:not([type="checkbox"]),body[data-portal-compact="1"] #app select,body[data-portal-compact="1"] #app textarea{font-size:16px;min-height:44px;max-width:100%}
body[data-portal-compact="1"] #app .home-followup,body[data-portal-compact="1"] #app .overview-links{margin-top:12px}
body[data-portal-compact="1"] #app .legal-footer{font-size:12px;line-height:1.8;margin-top:20px}
body[data-portal-compact="1"] #app .data-freshness{font-size:12px}
@media(max-width:850px){
body[data-portal-compact="1"] #app main{padding:16px 14px calc(20px + env(safe-area-inset-bottom))}
body[data-portal-compact="1"] #app>aside{padding:10px 14px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center}
body[data-portal-compact="1"] #app .sidebar-brand{margin:0}
body[data-portal-compact="1"] #app .brand-logo{max-width:130px;height:auto}
body[data-portal-compact="1"] #app .customer{margin:0;padding:0;border:0;grid-column:1;font-size:12px;min-width:0}
body[data-portal-compact="1"] #app .customer strong{font-size:14px;overflow-wrap:anywhere}
body[data-portal-compact="1"] #app .customer>small:first-child{display:none}
body[data-portal-compact="1"] #mobile-menu-toggle{grid-column:2;grid-row:1 / span 2;min-height:44px;margin:0}
body[data-portal-compact="1"] #navigation,body[data-portal-compact="1"] #app .sidebar-bottom,body[data-portal-compact="1"] #customer-switch{grid-column:1 / -1}
body[data-portal-compact="1"] #navigation{margin:6px 0 0}
body[data-portal-compact="1"] #app>aside:not(.menu-open) .sidebar-bottom{display:none}
body[data-portal-compact="1"] #app>aside.menu-open #navigation{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
body[data-portal-compact="1"] #app .top{align-items:start;flex-wrap:wrap}
body[data-portal-compact="1"] #app .button-group{width:100%}
body[data-portal-compact="1"] #app .button-group>.primary{width:100%}
body[data-portal-compact="1"] #app .card,body[data-portal-compact="1"] #app .metric{padding:14px}
body[data-portal-compact="1"] #app .geo-layout{display:block}
body[data-portal-compact="1"] #professional-map{height:220px;min-height:220px}
body[data-portal-compact="1"] #app .geo-sidebar{margin-top:12px}
body[data-portal-compact="1"] #app .geo-card .head{flex-wrap:wrap}
body[data-portal-compact="1"] #app .geo-card .site-filter{flex:1;min-width:0}
body[data-portal-compact="1"] #app .map-overview{font-size:13px}
body[data-portal-compact="1"] #app .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
body[data-portal-compact="1"] #app .metric strong{font-size:26px}
body[data-portal-compact="1"] #app .actions,body[data-portal-compact="1"] #app .button-group{gap:8px;flex-wrap:wrap}
body[data-portal-compact="1"] #app .actions>.button{flex:1 1 140px}
body[data-portal-compact="1"] #app .material-grid{gap:8px}
body[data-portal-compact="1"] #app .material-tile{padding:10px;min-width:0}
body[data-portal-compact="1"] #app .mobile-doc-list td{padding-top:6px;padding-bottom:6px}
body[data-portal-compact="1"] #app .order-card p{margin:8px 0}
body[data-portal-compact="1"] #app .compact-disclosure .card{padding:0;border:0;border-radius:0}
}
@media print{body[data-portal-compact="1"] #app main{padding:0}body[data-portal-compact="1"] #app .compact-disclosure{display:none}}

body[data-portal-compact="1"] #app .offer-layout>.compact-disclosure{grid-column:1 / -1}
body[data-portal-compact="1"] #app .contact-grid .card h2{font-size:16px}
body[data-portal-compact="1"] #app .contact-grid .card a{display:block;min-height:44px;align-content:center;overflow-wrap:anywhere}

body[data-portal-compact="1"] #app .button-group{margin:8px 0 0}
body[data-portal-compact="1"] #app .top{margin-bottom:14px}
body[data-portal-compact="1"] #app .customer{display:block}
body[data-portal-compact="1"] #app .card{border-radius:12px}
body[data-portal-compact="1"] #app .button{border-radius:9px}

body[data-portal-compact="1"] #app .page-intro{position:relative}
body[data-portal-compact="1"] #app .page-intro h1{padding-right:48px}
body[data-portal-compact="1"] #app .page-intro>.compact-disclosure:not([open]){position:absolute;right:0;top:0}
body[data-portal-compact="1"] #app .page-intro>.compact-disclosure>summary{min-width:44px;min-height:44px;text-align:center}
body[data-portal-compact="1"] #app>main{padding:20px}
@media(max-width:850px){body[data-portal-compact="1"] #app>main{padding:16px 14px calc(20px + env(safe-area-inset-bottom))}}

@media(max-width:650px){
body[data-portal-compact="1"] #app .mobile-doc-list tr[data-document-row]{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:4px 8px;padding:12px;margin:10px 0;border-radius:10px;min-width:0}
body[data-portal-compact="1"] #app .mobile-doc-list tr[data-document-row]>td{display:block;padding:0;min-width:0;overflow-wrap:anywhere;border:0}
body[data-portal-compact="1"] #app .mobile-doc-list tr[data-document-row]>td::before{display:none}
body[data-portal-compact="1"] #app .mobile-doc-list tr[data-document-row]>td:nth-child(1){grid-column:1;grid-row:1 / span 3}
body[data-portal-compact="1"] #app .mobile-doc-list tr[data-document-row]>td:nth-child(2){grid-column:3;grid-row:1;font-size:12px}
body[data-portal-compact="1"] #app .mobile-doc-list tr[data-document-row]>td:nth-child(3){grid-column:2;grid-row:1;font-weight:600}
body[data-portal-compact="1"] #app .mobile-doc-list tr[data-document-row]>td:nth-child(4){grid-column:2 / -1;grid-row:2}
body[data-portal-compact="1"] #app .mobile-doc-list tr[data-document-row]>td:nth-child(5){grid-column:2 / -1;grid-row:3;font-size:13px}
body[data-portal-compact="1"] #app .mobile-doc-list tr[data-document-row]>td:nth-child(6){grid-column:1 / -1;grid-row:4}
body[data-portal-compact="1"] #app .table-wrap.mobile-doc-list{padding:0;border:0}
}

body[data-portal-compact="1"] #app .geo-card>.head{padding:0 0 12px}
body[data-portal-compact="1"] #app .metric{min-height:0;gap:4px;text-align:left;align-content:start}
body[data-portal-compact="1"] #app .metric strong{margin:0;line-height:1.2}
body[data-portal-compact="1"] #app .balance-metrics .metric:last-child:nth-child(odd){grid-column:1 / -1}
body[data-portal-compact="1"] #app .balance-context{margin:12px 0}
body[data-portal-compact="1"] #app .offer-layout{gap:14px}

@media(max-width:850px){body[data-portal-compact="1"] #app .geo-card>.head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:end;gap:10px}body[data-portal-compact="1"] #app .geo-card>.head>div:first-child{grid-column:1 / -1}body[data-portal-compact="1"] #app .geo-card>.head .eyebrow{display:none}body[data-portal-compact="1"] #app .geo-card .site-filter{width:100%;display:grid;margin:0}body[data-portal-compact="1"] #app .geo-card .site-filter select{width:100%}body[data-portal-compact="1"] #app .geo-card .map-overview{width:100%;margin:0}}

body[data-portal-compact="1"] #app .page-intro{width:100%;min-width:0}
@media(max-width:850px){body[data-portal-compact="1"] #app{grid-template-rows:max-content minmax(0,1fr)}body[data-portal-compact="1"] #app>aside{align-content:start;align-self:start;grid-template-rows:44px auto;height:auto;min-height:0}body[data-portal-compact="1"] #app>aside.menu-open{grid-template-rows:44px auto auto auto}}

/* App sheets: anchored to the device edge, with one scroll surface and safe areas. */
body[data-portal-compact="1"]{--portal-sheet-surface:#fff;--portal-sheet-line:#dce5dd;--portal-sheet-radius:24px}
body[data-portal-compact="1"] dialog[open]{position:fixed;inset:auto 0 0;margin:0 auto!important;width:min(680px,100vw)!important;max-width:100vw!important;max-height:calc(100dvh - env(safe-area-inset-top) - 12px)!important;padding:18px max(20px,env(safe-area-inset-right)) calc(20px + env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));border:0;border-radius:var(--portal-sheet-radius) var(--portal-sheet-radius) 0 0!important;background:var(--portal-sheet-surface);color:#233c2e;box-shadow:0 -12px 48px #13291e24;overflow-y:auto;overscroll-behavior:contain;scroll-padding-block:24px;box-sizing:border-box;animation:portal-sheet-in .18s ease-out}
body[data-portal-compact="1"] dialog[open]::before{content:"";display:block;width:38px;height:4px;margin:0 auto 18px;border-radius:4px;background:var(--portal-sheet-line)}
body[data-portal-compact="1"] dialog::backdrop{background:#10281e66;backdrop-filter:blur(3px)}
body[data-portal-compact="1"] dialog h2{font-size:22px;line-height:1.25;margin:0 48px 12px 0}
body[data-portal-compact="1"] dialog .button,body[data-portal-compact="1"] dialog button{min-height:44px;border-radius:12px}
body[data-portal-compact="1"] dialog input:not([type="checkbox"]),body[data-portal-compact="1"] dialog select,body[data-portal-compact="1"] dialog textarea{font-size:16px;min-height:46px;border-radius:10px;max-width:100%;box-sizing:border-box}
body[data-portal-compact="1"] dialog label{margin-bottom:12px}
body[data-portal-compact="1"] dialog .portal-dialog-close{position:sticky;float:right;top:0;width:44px;height:44px;background:#f0f4ef;border-radius:50%;z-index:3;margin:-8px -6px 4px 0}
body[data-portal-compact="1"] dialog .dialog-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;padding-top:14px;border-top:1px solid var(--portal-sheet-line)}
body[data-portal-compact="1"] dialog .dialog-actions>.button{flex:1 1 140px}
body[data-portal-compact="1"] #portal-nav-sheet{padding-top:14px}
body[data-portal-compact="1"] #portal-nav-sheet .portal-sheet-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 16px}
body[data-portal-compact="1"] #portal-nav-sheet .portal-sheet-header h2{margin:0;font-size:22px}
body[data-portal-compact="1"] #portal-nav-sheet .portal-sheet-dismiss{background:#f0f4ef;border:0;color:#365842;padding:10px 14px}
body[data-portal-compact="1"] #portal-nav-sheet #navigation{display:grid;grid-template-columns:1fr;gap:6px;margin:0;padding:0;overflow:visible;white-space:normal;max-height:none}
body[data-portal-compact="1"] #portal-nav-sheet #navigation button{display:flex;align-items:center;justify-content:space-between;min-height:48px;width:100%;padding:12px 14px;border:0;border-radius:12px;background:#f6f8f4;color:#233c2e;font:600 15px/1.35 Inter,Arial,sans-serif;text-align:left;white-space:normal}
body[data-portal-compact="1"] #portal-nav-sheet #navigation button::after{content:"›";font-size:24px;line-height:1;color:#728578;margin-left:12px}
body[data-portal-compact="1"] #portal-nav-sheet #navigation button.active{background:#e6f2dd;color:#326615}
body[data-portal-compact="1"] #portal-nav-sheet .sidebar-bottom{position:static;display:block;margin:16px 0 0;padding:14px 0 0;border-top:1px solid var(--portal-sheet-line);background:transparent}
body[data-portal-compact="1"] #portal-nav-sheet #identity{display:block;font-size:12px;color:#607065;margin:0 0 8px;overflow-wrap:anywhere}
body[data-portal-compact="1"] #portal-nav-sheet #logout{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:46px;border:1px solid var(--portal-sheet-line);border-radius:12px;background:#fff;color:#365842;margin:0}
@media(min-width:650px){body[data-portal-compact="1"] #portal-nav-sheet #navigation{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1025px){body[data-portal-compact="1"] dialog[open]{bottom:16px;max-width:calc(100vw - 32px)!important;border-radius:var(--portal-sheet-radius)!important}}
@media(prefers-reduced-motion:reduce){body[data-portal-compact="1"] dialog[open]{animation:none}}
@keyframes portal-sheet-in{from{transform:translateY(24px);opacity:.65}to{transform:translateY(0);opacity:1}}

body[data-portal-compact="1"] #portal-nav-sheet .portal-sheet-header{position:sticky;top:-1px;z-index:2;background:var(--portal-sheet-surface);padding:8px 0}
@media(max-width:1024px){body[data-portal-compact="1"] #app{grid-template-rows:max-content minmax(0,1fr)}body[data-portal-compact="1"] #app>aside{align-content:start;align-self:start}}

/* The same interaction rules as the employee and driver shell. */
body[data-portal-compact="1"] :is(input,select,textarea){box-sizing:border-box;max-width:100%;scroll-margin-block:80px}
body[data-portal-compact="1"] dialog{max-height:calc(var(--portal-visual-height,100dvh) - 24px - env(safe-area-inset-top));overscroll-behavior:contain;scroll-padding:16px}
@media(pointer:coarse){body[data-portal-compact="1"] :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea){font-size:max(16px,1rem)!important;min-height:44px}body[data-portal-compact="1"] button{touch-action:manipulation}}
@media(prefers-reduced-motion:reduce){body[data-portal-compact="1"],body[data-portal-compact="1"] *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media(prefers-contrast:more){body[data-portal-compact="1"] :is(input,select,textarea,button,dialog){border-width:2px!important}body[data-portal-compact="1"] :focus-visible{outline:3px solid currentColor!important;outline-offset:3px}}
@media(forced-colors:active){body[data-portal-compact="1"] dialog{border:2px solid CanvasText!important}}

/* Portal uses the same visual hierarchy, including the first login. */
body[data-portal-compact="1"]{--portal-radius:12px;--portal-sheet-radius:24px;--portal-layout-accent:#397b2b;--portal-layout-ink:#18241d;--portal-layout-line:#dce4de}
body[data-portal-compact="1"] :is(h1,h2,h3){letter-spacing:-.025em;line-height:1.25;text-wrap:balance}
body[data-portal-compact="1"] #app :is(.amount,.money,.balance-amount,.metric strong){font-variant-numeric:tabular-nums lining-nums}
body[data-portal-compact="1"] #app .card{border:0!important;border-radius:0!important;box-shadow:none!important;padding:16px 0!important;background:transparent!important;border-bottom:1px solid var(--portal-layout-line)!important}
body[data-portal-compact="1"] #app .card .card{border-bottom:0!important}
body[data-portal-compact="1"] #app .metric{border:0!important;box-shadow:none!important;padding:14px!important;background:#f3f7f1!important}
body[data-portal-compact="1"] .login-screen{background:#fff}
body[data-portal-compact="1"] .login-form-content{max-width:420px;width:100%;margin-inline:auto}
body[data-portal-compact="1"] .login-form-content h2{font-size:clamp(25px,5vw,32px);color:var(--portal-layout-ink);margin:10px 0 14px}
body[data-portal-compact="1"] .login-form-content input{min-height:50px;border:1px solid var(--portal-layout-line)!important;border-radius:12px!important;padding:12px 14px!important;background:#fafcf9;color:var(--portal-layout-ink);font-size:16px}
body[data-portal-compact="1"] .login-form-content #login-submit{width:100%;min-height:50px;border:0;border-radius:12px!important;background:var(--portal-layout-accent)!important;color:#fff;font-weight:650;margin-top:8px}
body[data-portal-compact="1"] .login-form-content .password-toggle{min-height:44px;border:0!important;border-radius:8px!important;background:transparent!important;color:var(--portal-layout-accent);padding:8px 0!important;justify-content:flex-start}
body[data-portal-compact="1"] .login-form-content .login-links{line-height:1.6}
body[data-portal-compact="1"] #portal-nav-sheet #navigation{gap:0!important}
body[data-portal-compact="1"] #portal-nav-sheet #navigation>:is(button,a){min-height:48px;border:0!important;border-bottom:1px solid var(--portal-layout-line)!important;border-radius:0!important;background:transparent!important;padding:12px 14px!important}
body[data-portal-compact="1"] #portal-nav-sheet #navigation>:is(button,a).active{background:#eef6eb!important;border-radius:12px!important;color:#2d6322!important}
@media(max-width:700px){body[data-portal-compact="1"] .login-form-panel{padding:24px 20px!important}body[data-portal-compact="1"] .login-brand-link{margin-bottom:24px}body[data-portal-compact="1"] #app>main{padding-inline:16px!important}body[data-portal-compact="1"] #app .metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}body[data-portal-compact="1"] dialog .dialog-actions{position:sticky;bottom:calc(-20px - env(safe-area-inset-bottom));padding:12px 0 calc(12px + env(safe-area-inset-bottom));background:var(--portal-sheet-surface);z-index:2}}
@media(min-width:701px) and (max-width:1024px){body[data-portal-compact="1"] #app>main{padding:24px!important}body[data-portal-compact="1"] #app .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
