/* LinkWay driver console redesign - 2026-08-25 */
:root{--d-navy:#07182d;--d-navy2:#102c50;--d-blue:#1673e6;--d-cyan:#42b8ff;--d-ink:#172033;--d-muted:#718096;--d-line:#e4eaf2;--d-bg:#f3f6fa;--d-green:#12a66a;--d-orange:#f28a24}
#appScreen.app-screen{min-height:100vh;padding:30px 34px 48px 278px;color:var(--d-ink);background:radial-gradient(circle at 88% -8%,rgba(39,132,237,.1),transparent 28%),var(--d-bg)}
#appScreen .app-shell{width:min(1480px,100%);margin:0 auto}
#appScreen .topbar{position:fixed;z-index:40;inset:0 auto auto 0;width:242px;height:104px;padding:23px 22px;display:flex;align-items:center;gap:11px;border:0;background:var(--d-navy)}
#appScreen .topbar-logo{width:44px;height:44px;object-fit:contain;filter:brightness(0) invert(1)}
#appScreen .topbar-brand-copy{display:grid;gap:2px;min-width:0}
#appScreen .topbar-brand-copy strong{color:#fff;font-size:15px;font-weight:950;letter-spacing:.09em}
#appScreen .topbar-brand-copy span{color:#7991ae;font-size:10px;letter-spacing:.04em}
#appScreen .topbar h1,#appScreen .menu-toggle{display:none}
#appScreen .bottom-nav{position:fixed;z-index:39;inset:104px auto 0 0;width:242px;height:auto;padding:18px 13px 16px;display:flex;flex-direction:column;align-items:stretch;gap:4px;border:0;border-radius:0;overflow:visible;transform:none;background:var(--d-navy);box-shadow:15px 0 35px rgba(7,24,45,.08)}
#appScreen .bottom-nav::before{content:"DRIVER WORKSPACE";margin:0 14px 9px;color:#58718f;font-size:9px;font-weight:900;letter-spacing:.15em}
#appScreen .nav-item{position:relative;width:100%;min-width:0;min-height:45px;padding:0 13px;display:flex;flex:0 0 auto;flex-direction:row;align-items:center;justify-content:flex-start;gap:12px;border:1px solid transparent;border-radius:10px;color:#9dafc5;background:transparent;font-size:12px;font-weight:800;text-align:left;white-space:nowrap;transition:.18s ease}
#appScreen .nav-item strong{width:23px;margin:0;color:#6e86a4;font-size:18px;text-align:center}
#appScreen .nav-item:hover{color:#edf5ff;background:rgba(255,255,255,.055);transform:translateX(2px)}
#appScreen .nav-item.active{color:#fff;border-color:rgba(87,162,255,.24);background:linear-gradient(100deg,rgba(22,115,230,.38),rgba(22,115,230,.11));box-shadow:inset 3px 0 0 #4fa2ff}
#appScreen .nav-item.active strong{color:#65b0ff}#appScreen .nav-item.active::after{display:none}
#appScreen #locationButton{margin-top:8px;border-top:1px solid rgba(255,255,255,.08);border-radius:0;padding-top:7px}
#appScreen #logoutButton{margin:auto 0 0;border-top:1px solid rgba(255,255,255,.08);border-radius:0}

#appScreen .hero{position:relative;min-height:278px;margin:0 0 22px;padding:33px 36px 29px;overflow:hidden;border:0;border-radius:22px;color:#fff;background:radial-gradient(circle at 88% 17%,rgba(66,184,255,.33),transparent 25%),linear-gradient(128deg,#0b203b,#11437a 64%,#1673e6 145%);box-shadow:0 18px 42px rgba(19,64,111,.19)}
#appScreen .hero::before{content:"";position:absolute;inset:0;opacity:.36;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:36px 36px;mask-image:linear-gradient(90deg,transparent 28%,#000)}
#appScreen .hero::after{content:"";position:absolute;right:-70px;bottom:-150px;width:400px;height:400px;border:1px solid rgba(255,255,255,.12);border-radius:50%;box-shadow:0 0 0 44px rgba(255,255,255,.025),0 0 0 88px rgba(255,255,255,.018);background:none;filter:none}
#appScreen .hero-heading{position:relative;z-index:2}
#appScreen .hero-eyebrow,#appScreen .panel-title-group>span{display:block;margin-bottom:7px;color:#72bdff;font-size:10px;font-weight:950;letter-spacing:.16em}
#appScreen .hero h2{position:relative;z-index:2;margin:0 0 9px;color:#fff;font-size:clamp(22px,2vw,30px);line-height:1.3}
#appScreen .hero h2 strong{color:#fff;font-size:inherit}
#appScreen .hero-heading>p{position:relative;z-index:2;margin:0;color:#b8cce2;font-size:13px}
#appScreen .driver-live{position:absolute;z-index:3;top:33px;right:34px;display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid rgba(255,255,255,.14);border-radius:999px;color:#deebf8;background:rgba(5,18,36,.27);font-size:11px;font-weight:800;backdrop-filter:blur(8px)}
#appScreen .driver-live i{width:7px;height:7px;border-radius:50%;background:#32d890;box-shadow:0 0 0 4px rgba(50,216,144,.14)}
#appScreen .stats{position:absolute;z-index:3;right:32px;bottom:28px;left:32px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr)) minmax(190px,1.35fr);gap:9px}
#appScreen .stat,#appScreen .revenue-stat{min-height:94px;padding:13px 14px;display:grid;grid-template-columns:40px 1fr;grid-template-rows:1fr 1fr;align-items:center;gap:0 10px;border:1px solid rgba(255,255,255,.13);border-radius:13px;color:#fff;background:rgba(255,255,255,.09);box-shadow:none;backdrop-filter:blur(9px);transition:.18s ease}
#appScreen .stat:hover,#appScreen .stat:focus-visible{border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.15);transform:translateY(-2px);outline:0}
#appScreen .stat::before,#appScreen .revenue-stat::before{grid-row:1/3;width:38px;height:38px;display:grid;place-items:center;border-radius:11px;color:#e0efff;background:rgba(255,255,255,.1);font-size:17px}
#appScreen .stat:nth-child(1),#appScreen .stat:nth-child(2),#appScreen .stat:nth-child(3),#appScreen .stat:nth-child(4),#appScreen .stat:nth-child(5),#appScreen .revenue-stat{border-color:rgba(255,255,255,.13);background:rgba(255,255,255,.09)}
#appScreen .stat:nth-child(1)::before{content:"↗"}#appScreen .stat:nth-child(2)::before{content:"▤"}#appScreen .stat:nth-child(3)::before{content:"✓"}#appScreen .stat:nth-child(4)::before{content:"■"}#appScreen .stat:nth-child(5)::before{content:"✉"}#appScreen .revenue-stat::before{content:"₩"}
#appScreen .stat span,#appScreen .revenue-stat span{align-self:end;color:#aac0d8;font-size:10px;font-weight:800}
#appScreen .stat strong,#appScreen .stat:nth-child(n) strong{align-self:start;margin:0;color:#fff;font-size:24px;line-height:1.15}
#appScreen .revenue-stat strong{align-self:start;color:#fff;font-size:18px;line-height:1.3}
#appScreen .revenue-stat{background:linear-gradient(125deg,rgba(255,183,61,.17),rgba(255,255,255,.08));border-color:rgba(255,206,122,.24)}

#appScreen #jobsPanel,#appScreen #myPanel,#appScreen #supportPanel,#appScreen #settlementPanel{margin:0 0 20px;padding:23px 24px;border:1px solid var(--d-line);border-radius:18px;color:var(--d-ink);background:#fff;box-shadow:0 7px 24px rgba(17,35,61,.045)}
#appScreen .panel-head{margin:0 0 17px;padding:0;border:0;background:transparent}
#appScreen .panel-title-group h3{margin:0;color:var(--d-ink);font-size:19px;letter-spacing:-.02em}
#appScreen .panel-title-group>span{margin-bottom:4px;color:#2675d9}
#appScreen .badge{min-width:38px;padding:6px 10px;border:0;border-radius:999px;color:#2166bd;background:#eaf3ff;font-size:11px;font-weight:900;text-align:center}
#appScreen .search-row{grid-template-columns:minmax(0,1fr) auto;gap:10px}
#appScreen .search-row input{min-height:45px;padding-left:43px;border:1px solid var(--d-line);border-radius:11px;color:var(--d-ink);background:#f8fafc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238190a4' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E") 14px center/17px no-repeat;box-shadow:none}
#appScreen .filter-button{min-height:45px;padding-inline:18px;border:1px solid var(--d-line);border-radius:11px;color:#53657d;background:#fff}
#appScreen .jobs-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-top:15px}
#appScreen .job-card{position:relative;overflow:hidden;border:1px solid var(--d-line);border-radius:15px;background:#fff;box-shadow:0 5px 18px rgba(15,31,54,.045);transition:.18s ease}
#appScreen .job-card:hover{border-color:#b9cde9;box-shadow:0 12px 28px rgba(19,55,94,.1);transform:translateY(-2px)}
#appScreen .job-card::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(#1877e8,#4eb2ff)}
#appScreen .job-route-summary{border-radius:12px;background:#f7f9fc}
#appScreen .job-card .primary{border-color:#1673e6;color:#fff;background:linear-gradient(120deg,#176bda,#1488ed);box-shadow:0 7px 16px rgba(23,107,218,.2)}
#appScreen .profile-grid input,#appScreen .profile-grid select,#appScreen #driverSupportContent{border-color:var(--d-line);border-radius:11px;color:var(--d-ink);background:#f9fbfd;box-shadow:none}
#appScreen .support-layout{gap:16px}#appScreen .support-form{padding:18px;border:1px solid var(--d-line);border-radius:14px;background:#f8fafc}
#appScreen button:focus-visible,#appScreen [role=button]:focus-visible,#appScreen input:focus-visible,#appScreen textarea:focus-visible{outline:3px solid rgba(22,115,230,.22);outline-offset:2px}

@media(max-width:1180px){
#appScreen.app-screen{padding:26px 22px 38px 226px}#appScreen .topbar,#appScreen .bottom-nav{width:202px}
#appScreen .topbar{padding-inline:17px}#appScreen .topbar-brand-copy strong{font-size:13px}
#appScreen .hero{min-height:380px}#appScreen .stats{grid-template-columns:repeat(3,minmax(0,1fr))}
#appScreen .jobs-list{grid-template-columns:1fr}
}
@media(max-width:760px){
#appScreen.app-screen{padding:76px 11px 28px;background:#f3f6fa}
#appScreen .topbar{inset:0 0 auto 0;width:100%;height:62px;padding:9px 14px;justify-content:flex-start;box-shadow:0 5px 18px rgba(5,18,36,.17)}
#appScreen .topbar-logo{width:36px;height:36px}#appScreen .topbar-brand-copy strong{font-size:13px}#appScreen .topbar-brand-copy span{font-size:9px}
#appScreen .menu-toggle{width:38px;height:38px;margin-left:auto;display:grid;place-items:center;border:1px solid rgba(255,255,255,.15);border-radius:10px;color:#fff;background:rgba(255,255,255,.07)}
#appScreen .bottom-nav{display:none;inset:68px 11px auto auto;width:min(292px,calc(100% - 22px));height:auto;padding:9px;gap:3px;border:1px solid #213b5d;border-radius:15px;background:rgba(7,24,45,.99);box-shadow:0 20px 44px rgba(7,20,39,.32)}
#appScreen.menu-open .bottom-nav{display:flex}#appScreen .bottom-nav::before{margin:4px 11px 5px}#appScreen .nav-item{min-height:42px;padding:0 11px}#appScreen #locationButton{margin-top:4px}#appScreen #logoutButton{margin-top:4px}
#appScreen .hero{min-height:306px;padding:22px 17px 15px;border-radius:18px}
#appScreen .hero h2{font-size:21px}#appScreen .hero-heading>p{max-width:255px;font-size:11px;line-height:1.5}
#appScreen .driver-live{top:18px;right:16px;padding:6px 8px}#appScreen .driver-live span{display:none}
#appScreen .stats{right:13px;bottom:15px;left:13px;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
#appScreen .stat,#appScreen .revenue-stat{min-height:70px;padding:7px 5px;border-radius:10px}
#appScreen .stat{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center}
#appScreen .stat::before{width:26px;height:26px;border-radius:8px;font-size:11px}
#appScreen .stat span{font-size:8px;line-height:1.15;white-space:nowrap}#appScreen .stat strong,#appScreen .stat:nth-child(n) strong{font-size:17px}
#appScreen .stat:nth-child(5),#appScreen .revenue-stat{grid-column:span 2;display:grid;grid-template-columns:32px minmax(0,1fr);grid-template-rows:1fr 1fr;gap:0 8px;padding:8px 12px;text-align:left}
#appScreen .stat:nth-child(5)::before,#appScreen .revenue-stat::before{grid-row:1/3;width:30px;height:30px;border-radius:9px;font-size:12px}
#appScreen .stat:nth-child(5) span,#appScreen .revenue-stat span{align-self:end;font-size:9px}#appScreen .stat:nth-child(5) strong{align-self:start;font-size:18px}#appScreen .revenue-stat strong{font-size:15px}
#appScreen #jobsPanel,#appScreen #myPanel,#appScreen #supportPanel,#appScreen #settlementPanel{padding:18px 13px;border-radius:15px}
#appScreen .panel-title-group h3{font-size:17px}#appScreen .search-row{grid-template-columns:1fr}#appScreen .filter-button{width:100%}
#appScreen .jobs-list{grid-template-columns:1fr;gap:10px}#appScreen .job-card{border-radius:13px}
}
@media(max-width:390px){#appScreen .hero{min-height:312px}#appScreen .stat{padding-inline:2px}#appScreen .stat span{font-size:7.5px}#appScreen .stat:nth-child(5),#appScreen .revenue-stat{padding-inline:8px}}
@media(prefers-reduced-motion:reduce){#appScreen *,#appScreen *::before,#appScreen *::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* Driver workspace expert UI refresh - 2026-08-31 */
body[data-driver-page]{font-family:Pretendard,"Noto Sans KR","Malgun Gothic",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#eef3f8}
body[data-driver-page] button,body[data-driver-page] input,body[data-driver-page] select,body[data-driver-page] textarea{font-family:inherit}
#appScreen.app-screen{--d-surface:#fff;--d-soft:#f5f8fc;--d-ink:#14243a;--d-muted:#708096;--d-line:#dde6f0;background:radial-gradient(circle at 84% 0,rgba(44,129,222,.09),transparent 26%),linear-gradient(180deg,#f3f7fb,#edf2f7)}
#appScreen .app-shell{max-width:1380px}
#appScreen[data-driver-menu="my"] .hero,#appScreen[data-driver-menu="support"] .hero,#appScreen[data-driver-menu="settlement"] .hero{display:none}

/* Page and panel hierarchy */
#appScreen #jobsPanel,#appScreen #myPanel,#appScreen #supportPanel,#appScreen #settlementPanel{overflow:hidden;padding:0;border-color:#dbe5f0;border-radius:22px;background:#fff;box-shadow:0 16px 45px rgba(21,45,77,.075)}
#appScreen #jobsPanel>.panel-head{min-height:94px;margin:0;padding:22px 26px;border-bottom:1px solid #e6edf4;background:linear-gradient(120deg,#fff,#f7faff)}
#appScreen .panel-title-group{min-width:0}
#appScreen .panel-title-group>span{margin-bottom:5px;color:#2473d3;font-size:9px;letter-spacing:.18em}
#appScreen .panel-title-group h3{font-size:21px;font-weight:950;letter-spacing:-.04em}
#appScreen .panel-title-group p{margin:6px 0 0;color:var(--d-muted);font-size:10px;font-weight:600;line-height:1.5}
#appScreen #jobsPanel>.panel-head>.badge{align-self:flex-start;margin-top:2px}
#appScreen #jobsPanel>.search-row{margin:18px 24px 0}
#appScreen #jobsPanel>.jobs-list{padding:0 24px 24px}
#appScreen .driver-page-head{position:relative;display:flex;min-height:132px;align-items:center;justify-content:space-between;gap:20px;margin:0;padding:25px 28px;overflow:hidden;border:0;background:radial-gradient(circle at 80% 0,rgba(74,148,232,.3),transparent 40%),linear-gradient(118deg,#0a203c,#123a68 68%,#19588f);color:#fff}
#appScreen .driver-page-head::after{position:absolute;right:84px;bottom:-130px;width:260px;height:260px;border:1px solid rgba(255,255,255,.1);border-radius:50%;content:""}
#appScreen .driver-page-title{position:relative;z-index:1;min-width:0}
#appScreen .driver-page-title>span{display:block;margin-bottom:6px;color:#7fc0ff;font-size:9px;font-weight:950;letter-spacing:.18em}
#appScreen .driver-page-title h3{margin:0;color:#fff;font-size:23px;font-weight:950;letter-spacing:-.04em}
#appScreen .driver-page-title p{margin:7px 0 0;color:#c9daeb;font-size:11px;font-weight:600;line-height:1.5}
#appScreen .driver-page-head>.badge{position:relative;z-index:2;border:1px solid rgba(255,255,255,.17);background:rgba(255,255,255,.1);color:#e1eefb;backdrop-filter:blur(8px)}

/* Delivery cards and state system */
#appScreen .jobs-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
#appScreen .job-card{--job-accent:#1b75df;padding:18px;border-color:#dde6f0;border-radius:18px;box-shadow:0 8px 25px rgba(20,48,82,.055)}
#appScreen .job-card::before{width:4px;background:var(--job-accent)}
#appScreen .job-card.status-assigned,#appScreen .job-card.status-pickup_arrived{--job-accent:#1d75df}
#appScreen .job-card.status-departure_registered{--job-accent:#f28b2c}
#appScreen .job-card.status-arrival_registered{--job-accent:#16a36a}
#appScreen .job-card.status-completed{--job-accent:#68778c}
#appScreen .job-card:hover{border-color:color-mix(in srgb,var(--job-accent) 34%,#dbe5ef);box-shadow:0 16px 35px rgba(20,56,98,.11)}
#appScreen .job-head{align-items:flex-start;margin-bottom:13px;padding-left:2px}
#appScreen .job-head>strong{color:#15253b;font-size:14px;font-weight:950;letter-spacing:-.015em}
#appScreen .job-head-actions{flex-wrap:wrap;justify-content:flex-end}
#appScreen .job-head-actions>.badge{border:1px solid color-mix(in srgb,var(--job-accent) 22%,transparent);background:color-mix(in srgb,var(--job-accent) 10%,#fff);color:var(--job-accent)}
#appScreen .job-head-actions .navigation-button{min-height:34px;padding:0 12px;border:0;border-radius:10px;background:linear-gradient(120deg,#176ddd,#1385eb);color:#fff;font-size:9px;font-weight:900;box-shadow:0 6px 14px rgba(21,108,216,.2)}
#appScreen .job-route-summary{grid-template-columns:82px minmax(0,1fr);gap:13px;padding:14px;border:1px solid #e8eef5;border-radius:15px;background:linear-gradient(145deg,#f8fafd,#f3f7fb)}
#appScreen .job-vehicle-tile{border-right:1px solid #e0e8f1}
#appScreen .job-vehicle-tile svg{color:#173b68}
#appScreen .job-vehicle-tile strong{color:#25364d;font-size:10px}
#appScreen .job-route-timeline{gap:9px}
#appScreen .job-route-point b{color:#314259;font-size:10px}
#appScreen .job-route-point p{color:#607086;font-size:13px;line-height:1.45}
#appScreen .job-route-dot{border-color:#fff;background:var(--job-accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--job-accent) 40%,#dfe7ef)}
#appScreen .job-driver-line{color:#5e7087;font-weight:750}
#appScreen .job-progress-track::before{background:linear-gradient(to right,var(--job-accent) 0 var(--job-progress),#d7e0ea var(--job-progress) 100%)}
#appScreen .job-progress-step.is-done::before{background:var(--job-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--job-accent) 12%,transparent)}
#appScreen .job-card>.meta{gap:0;margin-top:14px;overflow:hidden;border:1px solid #e7edf4;border-radius:13px;background:#fff}
#appScreen .job-card>.meta>div{min-width:0;padding:10px 12px;border-bottom:1px solid #edf1f5}
#appScreen .job-card>.meta>div:nth-last-child(-n+2){border-bottom:0}
#appScreen .job-card>.meta span{color:#8a97a8;font-size:13px;font-weight:800}
#appScreen .job-card>.meta strong{overflow:hidden;color:#2a3a50;font-size:13px;text-overflow:ellipsis;white-space:nowrap}
#appScreen .job-card>.actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:12px}
#appScreen .job-card>.actions button{min-height:46px;padding:0 10px;border-radius:11px;font-size:14px;font-weight:900}
#appScreen .job-card>.actions button[data-support-center]{border:0;color:#fff;background:linear-gradient(120deg,#1770dc,#1686e9);box-shadow:0 6px 15px rgba(24,112,215,.18)}
#appScreen #loadOlderJobs{grid-column:1/-1;min-height:46px;border:1px solid #cfdae7;border-radius:13px;background:#fff;color:#50627a;font-size:11px;font-weight:900}

/* Shared empty state */
#appScreen .driver-empty-state{display:grid;min-height:210px;place-content:center;justify-items:center;padding:30px 20px;border:1px dashed #cbd8e6;border-radius:17px;background:linear-gradient(145deg,#fafcff,#f3f7fb);color:#748398;text-align:center}
#appScreen .driver-empty-state>span{display:grid;width:54px;height:54px;margin-bottom:13px;place-items:center;border:1px solid #d8e4f1;border-radius:17px;background:#fff;color:#1d70d2;font-size:22px;font-weight:900;box-shadow:0 10px 25px rgba(28,68,115,.09)}
#appScreen .driver-empty-state strong{color:#26374e;font-size:14px}
#appScreen .driver-empty-state p{max-width:340px;margin:7px 0 0;color:#7a899c;font-size:10px;line-height:1.6}
#appScreen .driver-empty-state.jobs-empty{grid-column:1/-1}

/* My account */
#appScreen #myPanel .profile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;padding:25px 28px 15px;background:#f5f8fc}
#appScreen .driver-form-section-heading{grid-column:1/-1;display:flex;align-items:center;gap:11px;margin-top:12px;padding:18px 0 3px;border-top:1px solid #dce5ef}
#appScreen .driver-form-section-heading:first-child{margin-top:0;padding-top:0;border-top:0}
#appScreen .driver-form-section-heading>b,#appScreen .driver-section-heading>b{display:grid;flex:0 0 31px;width:31px;height:31px;place-items:center;border-radius:10px;background:#e7f2ff;color:#1769cb;font-size:9px;font-weight:950}
#appScreen .driver-form-section-heading>span,#appScreen .driver-section-heading>span{display:grid;gap:3px}
#appScreen .driver-form-section-heading strong,#appScreen .driver-section-heading strong{color:#1c2e45;font-size:13px;font-weight:950}
#appScreen .driver-form-section-heading small,#appScreen .driver-section-heading small{color:#7d8b9e;font-size:9px;font-weight:600}
#appScreen #myPanel .profile-grid label{gap:7px;color:#405168;font-size:10px;font-weight:850}
#appScreen #myPanel .profile-grid input,#appScreen #myPanel .profile-grid select{min-height:48px;padding:0 13px;border:1px solid #d5dfeb;border-radius:12px;background:#fff;color:#26374d;font-size:11px;font-weight:650;transition:.16s ease}
#appScreen #myPanel .profile-grid input:focus,#appScreen #myPanel .profile-grid select:focus{border-color:#69a7e7;background:#fff;box-shadow:0 0 0 3px rgba(31,117,215,.09);outline:0}
#appScreen #saveProfileButton{position:sticky;bottom:14px;z-index:3;width:calc(100% - 56px);min-height:50px;margin:10px 28px 28px;border:0;border-radius:13px;background:linear-gradient(110deg,#1266cc,#1682ec);font-size:13px;font-weight:950;box-shadow:0 12px 28px rgba(19,111,218,.24)}

/* Support */
#appScreen #supportPanel .support-layout{display:grid;grid-template-columns:minmax(290px,.78fr) minmax(0,1.22fr);gap:15px;padding:22px;background:#f5f8fc}
#appScreen #supportPanel .support-form,#appScreen #supportPanel .support-list{min-width:0;padding:18px;border:1px solid #dde6f0;border-radius:17px;background:#fff;box-shadow:0 7px 22px rgba(28,53,85,.045)}
#appScreen #supportPanel .support-form{align-self:start}
#appScreen #supportPanel .admin-message-list{grid-column:1/-1}
#appScreen .driver-section-heading{display:flex;align-items:center;gap:10px;margin-bottom:16px}
#appScreen #supportPanel .support-form label{gap:7px;color:#405168;font-size:10px;font-weight:850}
#appScreen #driverSupportContent{min-height:154px;padding:14px;border:1px solid #d5dfeb;border-radius:13px;background:#fafcff;color:#293a50;font-size:11px;line-height:1.6}
#appScreen #driverSupportContent:focus{border-color:#69a7e7;background:#fff;box-shadow:0 0 0 3px rgba(31,117,215,.09);outline:0}
#appScreen #sendDriverSupportButton{width:100%;min-height:46px;margin-top:10px;border:0;border-radius:12px;background:linear-gradient(110deg,#1266cc,#1682ec);font-size:11px;font-weight:950;box-shadow:0 9px 20px rgba(19,111,218,.2)}
#appScreen .driver-ticket-cards,#appScreen .driver-message-cards{display:grid;gap:10px}
#appScreen .driver-ticket-card{padding:15px;border:1px solid #e0e7f0;border-radius:14px;background:#fbfcfe}
#appScreen .driver-ticket-card>header,#appScreen .driver-ticket-card>footer{display:flex;align-items:center;justify-content:space-between;gap:10px}
#appScreen .driver-ticket-card>header>span{color:#69788d;font-size:9px;font-weight:850}
#appScreen .driver-ticket-card>header>b{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;background:#fff1dc;color:#99620c;font-size:8px;font-weight:950}
#appScreen .driver-ticket-card.is-complete>header>b{background:#e4f6ed;color:#137a52}
#appScreen .driver-ticket-card .new-badge{min-height:16px;padding:0 5px;font-size:7px;font-style:normal}
#appScreen .driver-ticket-card>strong{display:block;margin-top:12px;color:#1f3047;font-size:12px}
#appScreen .driver-ticket-card>p{margin:6px 0 13px;color:#748398;font-size:9px;line-height:1.5}
#appScreen .driver-ticket-card>footer{padding-top:11px;border-top:1px solid #e9eef4}
#appScreen .driver-ticket-card time{color:#909bad;font-size:8px}
#appScreen .driver-ticket-card .actions,#appScreen .driver-message-card .actions{display:flex;gap:5px}
#appScreen .driver-ticket-card .actions button,#appScreen .driver-message-card .actions button{min-height:30px;padding:0 10px;border-radius:8px;font-size:9px;font-weight:850}
#appScreen .actions .is-danger{border-color:#f0d6d8;background:#fff8f8;color:#b64750}
#appScreen .driver-message-card{display:grid;grid-template-columns:38px minmax(0,1fr);gap:12px;padding:15px;border:1px solid #e0e7f0;border-radius:15px;background:#fff}
#appScreen .driver-message-card.unread{border-color:#bad4f1;background:linear-gradient(120deg,#fff,#f4f9ff);box-shadow:0 7px 20px rgba(28,94,168,.07)}
#appScreen .driver-message-avatar{display:grid;width:38px;height:38px;place-items:center;border-radius:12px;background:linear-gradient(145deg,#133e70,#227bd4);color:#fff;font-size:13px;font-weight:950}
#appScreen .driver-message-content{min-width:0}
#appScreen .driver-message-content>header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
#appScreen .driver-message-content>header>span:first-child{display:grid;gap:3px}
#appScreen .driver-message-content>header strong{color:#314156;font-size:10px}
#appScreen .driver-message-content>header small{color:#929daf;font-size:8px}
#appScreen .driver-message-card .new-badge{min-height:18px;padding:0 6px;font-size:7px}
#appScreen .message-read-state{color:#8b97a8;font-size:8px}
#appScreen .driver-message-title{display:block;margin-top:10px;color:#1e3047;font-size:12px}
#appScreen .driver-message-content>p{margin:5px 0 12px;color:#728096;font-size:9px;line-height:1.5}
#appScreen .driver-message-content>footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:10px;border-top:1px solid #edf1f5}
#appScreen .driver-message-content>footer>span{color:#8794a6;font-size:8px}

/* Settlement */
#appScreen #settlementHistoryContent{padding:22px;background:#f5f8fc}
#appScreen .settlement-overview{display:grid;grid-template-columns:minmax(250px,.7fr) minmax(0,1.3fr);gap:14px}
#appScreen .settlement-primary-card{position:relative;display:grid;align-content:center;min-height:174px;padding:24px;overflow:hidden;border-radius:18px;background:radial-gradient(circle at 90% 0,rgba(97,183,255,.33),transparent 38%),linear-gradient(135deg,#0e2a4c,#14548d);color:#fff;box-shadow:0 14px 30px rgba(15,64,110,.18)}
#appScreen .settlement-primary-card::after{position:absolute;right:-45px;bottom:-85px;width:190px;height:190px;border:1px solid rgba(255,255,255,.12);border-radius:50%;content:""}
#appScreen .settlement-primary-card>span{color:#a9cce9;font-size:10px;font-weight:850}
#appScreen .settlement-primary-card>strong{margin-top:8px;color:#fff;font-size:28px;font-weight:950;letter-spacing:-.04em}
#appScreen .settlement-primary-card>small{margin-top:10px;color:#bad0e4;font-size:9px;line-height:1.5}
#appScreen .settlement-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:0}
#appScreen .settlement-summary strong{min-height:82px;padding:15px;border:1px solid #dce5ef;border-radius:14px;background:#fff;color:#20344e;font-size:15px;box-shadow:0 6px 18px rgba(27,51,82,.04)}
#appScreen .settlement-summary strong:last-child{grid-column:1/-1}
#appScreen .settlement-summary span{color:#7e8c9f;font-size:9px}
#appScreen .settlement-record-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:24px 0 11px}
#appScreen .settlement-record-head>div{display:grid;gap:3px}
#appScreen .settlement-record-head strong{color:#203148;font-size:14px}
#appScreen .settlement-record-head small,#appScreen .settlement-record-head>span{color:#8491a3;font-size:9px}
#appScreen .settlement-record-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
#appScreen .settlement-record-card{padding:17px;border:1px solid #dfe7f0;border-radius:16px;background:#fff;box-shadow:0 7px 22px rgba(29,52,83,.045)}
#appScreen .settlement-record-card>header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:13px;border-bottom:1px solid #edf1f5}
#appScreen .settlement-record-card>header>span{display:grid;gap:3px}
#appScreen .settlement-record-card small{color:#8a97a8;font-size:8px;font-weight:750}
#appScreen .settlement-record-card>header strong{color:#26384f;font-size:12px}
#appScreen .settlement-record-card>header>b{padding:5px 8px;border-radius:999px;background:#e8f6ef;color:#157850;font-size:8px}
#appScreen .settlement-record-main{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;padding:14px 0}
#appScreen .settlement-record-main>span{display:grid;min-width:0;gap:4px}
#appScreen .settlement-record-main strong{overflow:hidden;color:#35465c;font-size:10px;text-overflow:ellipsis;white-space:nowrap}
#appScreen .settlement-record-main .settlement-fare{text-align:right}
#appScreen .settlement-record-main .settlement-fare strong{color:#1263bc;font-size:14px}
#appScreen .settlement-costs{display:flex;justify-content:flex-end;gap:13px;padding:10px 12px;border-radius:11px;background:#f6f8fb;color:#7b899c;font-size:8px}
#appScreen .settlement-costs b{margin-left:4px;color:#4a5a70;font-size:9px}
#appScreen .settlement-record-card>footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:12px;color:#8a97a8;font-size:8px}

/* Receipt window: persistent close actions */
#departureReceiptModal{padding:14px;background:rgba(7,22,42,.65);backdrop-filter:blur(5px)}
#departureReceiptModal>.modal{width:min(1180px,100%);max-height:calc(100dvh - 28px);padding:0 18px 92px;overflow:auto;border:1px solid #dce5ef;border-radius:22px;background:#f4f7fb;box-shadow:0 28px 90px rgba(4,17,34,.42)}
#departureReceiptModal>.modal>.modal-head{position:sticky;z-index:20;top:0;min-height:92px;margin:0 -18px;padding:17px 20px;border:0;background:radial-gradient(circle at 72% 0,rgba(76,151,235,.28),transparent 40%),linear-gradient(118deg,#0a203c,#123a68 70%,#19588f);color:#fff;box-shadow:0 8px 24px rgba(12,43,77,.17)}
#departureReceiptModal .receipt-title-icon{border-color:rgba(255,255,255,.25);background:rgba(255,255,255,.12);color:#fff}
#departureReceiptModal .receipt-title-block h3{color:#fff;font-size:20px;font-weight:950}
#departureReceiptModal .receipt-title-block p{color:#c8d9ea;font-size:10px}
#departureReceiptModal .receipt-doc-number{border-color:rgba(255,255,255,.2);border-radius:12px;background:rgba(255,255,255,.1);color:#fff}
#departureReceiptModal .receipt-doc-number span{color:#bcd2e7}
#departureReceiptModal .receipt-window-close{display:inline-flex;min-width:88px;min-height:42px;align-items:center;justify-content:center;gap:7px;padding:0 13px;border:1px solid rgba(255,255,255,.2);border-radius:12px;background:rgba(255,255,255,.1);color:#fff;font-size:10px;font-weight:900}
#departureReceiptModal .receipt-window-close span:first-child{font-size:20px;font-weight:400;line-height:1}
#departureReceiptModal .receipt-section-tabs{top:92px;margin:0 -18px;box-shadow:0 6px 16px rgba(25,48,78,.06)}
#departureReceiptModal .receipt-summary-card,#departureReceiptModal .receipt-route-panel,#departureReceiptModal .receipt-meter-panel,#departureReceiptModal .receipt-proof-panel,#departureReceiptModal .receipt-time-panel,#departureReceiptModal .receipt-card{border-color:#dbe5ef;border-radius:16px;background:#fff;box-shadow:0 7px 22px rgba(26,50,82,.045)}
#departureReceiptModal .receipt-action-row{position:sticky;z-index:19;bottom:0;display:grid;grid-template-columns:minmax(120px,.65fr) minmax(120px,.8fr) minmax(180px,1.35fr);gap:8px;margin:18px -18px -92px;padding:12px 18px max(12px,env(safe-area-inset-bottom));border-top:1px solid #dce5ef;background:rgba(255,255,255,.96);box-shadow:0 -10px 28px rgba(21,45,75,.1);backdrop-filter:blur(12px)}
#departureReceiptModal .receipt-action-row .secondary,#departureReceiptModal .receipt-action-row .receipt-submit{width:100%;min-height:48px;margin:0;border-radius:12px;font-size:11px;font-weight:950}
#departureReceiptModal .receipt-close-action{border-color:#d7e0ea;background:#f1f4f8;color:#506078}
#departureReceiptModal #printReceiptPdfButton{border-color:#bcd2ec;background:#edf5ff;color:#195fab}
#departureReceiptModal .receipt-action-row .receipt-submit{border:0;background:linear-gradient(110deg,#087845,#10a267);color:#fff;box-shadow:0 8px 19px rgba(11,139,84,.2)}

@media(max-width:1180px){
#appScreen .jobs-list,#appScreen .settlement-record-list{grid-template-columns:1fr}
}
@media(max-width:760px){
#appScreen.app-screen{padding:74px 9px 22px}
#appScreen[data-driver-menu]:not([data-driver-menu="home"]) .topbar-brand-copy{display:none}
#appScreen[data-driver-menu]:not([data-driver-menu="home"]) .topbar h1{display:block;overflow:hidden;margin:0;color:#fff;font-size:13px;font-weight:900;text-overflow:ellipsis;white-space:nowrap}
#appScreen[data-driver-menu="ready"] .hero,#appScreen[data-driver-menu="departure"] .hero,#appScreen[data-driver-menu="arrival"] .hero,#appScreen[data-driver-menu="completed"] .hero{display:none}
#appScreen #jobsPanel,#appScreen #myPanel,#appScreen #supportPanel,#appScreen #settlementPanel{border-radius:17px}
#appScreen #jobsPanel>.panel-head{min-height:87px;padding:18px}
#appScreen .panel-title-group h3{font-size:18px}
#appScreen .panel-title-group p{max-width:260px;font-size:9px}
#appScreen #jobsPanel>.search-row{margin:13px 12px 0}
#appScreen #jobsPanel>.jobs-list{padding:0 12px 13px}
#appScreen .driver-page-head{min-height:112px;padding:19px 18px}
#appScreen .driver-page-title h3{font-size:19px}
#appScreen .driver-page-title p{max-width:270px;font-size:9px}
#appScreen .job-card{padding:14px;border-radius:15px}
#appScreen .job-head{gap:8px}
#appScreen .job-head>strong{font-size:12px}
#appScreen .job-route-summary{grid-template-columns:64px minmax(0,1fr);gap:10px;padding:11px}
#appScreen .job-vehicle-tile{padding-right:8px}
#appScreen .job-card>.meta{grid-template-columns:1fr 1fr}
#appScreen .job-card>.meta>div{padding:9px}
#appScreen .job-card>.actions{grid-template-columns:repeat(2,minmax(0,1fr))}
#appScreen .job-card>.actions button{min-height:42px}

#appScreen #myPanel .profile-grid{grid-template-columns:1fr;gap:12px;padding:16px 14px 10px}
#appScreen .driver-form-section-heading{grid-column:auto;margin-top:9px;padding-top:16px}
#appScreen #saveProfileButton{position:static;width:calc(100% - 28px);margin:8px 14px 18px}

#appScreen #supportPanel .support-layout{grid-template-columns:1fr;gap:12px;padding:12px}
#appScreen #supportPanel .support-form,#appScreen #supportPanel .support-list{padding:14px;border-radius:14px}
#appScreen #supportPanel .admin-message-list{grid-column:auto}
#appScreen .driver-message-card{grid-template-columns:32px minmax(0,1fr);gap:10px;padding:13px}
#appScreen .driver-message-avatar{width:32px;height:32px;border-radius:10px}

#appScreen #settlementHistoryContent{padding:12px}
#appScreen .settlement-overview{grid-template-columns:1fr;gap:10px}
#appScreen .settlement-primary-card{min-height:148px;padding:20px;border-radius:15px}
#appScreen .settlement-primary-card>strong{font-size:25px}
#appScreen .settlement-summary{gap:7px}
#appScreen .settlement-summary strong{min-height:74px;padding:12px;font-size:13px}
#appScreen .settlement-record-head{margin-top:19px}
#appScreen .settlement-record-card{padding:14px;border-radius:14px}
#appScreen .settlement-record-main{grid-template-columns:1fr 1fr}
#appScreen .settlement-record-main .settlement-fare{grid-column:1/-1;padding-top:10px;border-top:1px solid #edf1f5;text-align:left}

#departureReceiptModal{padding:0}
#departureReceiptModal>.modal{width:100%;height:100dvh;max-height:none;padding:0 8px 82px;border:0;border-radius:0}
#departureReceiptModal>.modal>.modal-head{min-height:72px;margin:0 -8px;padding:11px 12px}
#departureReceiptModal .receipt-title-block{gap:9px}
#departureReceiptModal .receipt-title-icon{width:34px;height:34px;flex-basis:34px;border-radius:10px;font-size:18px}
#departureReceiptModal .receipt-title-block h3{font-size:16px}
#departureReceiptModal .receipt-title-block p{display:none}
#departureReceiptModal .receipt-doc-number{min-width:102px;padding:8px 9px}
#departureReceiptModal .receipt-doc-number span{font-size:8px}
#departureReceiptModal .receipt-doc-number strong{font-size:12px}
#departureReceiptModal .receipt-window-close{min-width:38px;width:38px;min-height:38px;padding:0}
#departureReceiptModal .receipt-window-close span:last-child{display:none}
#departureReceiptModal .receipt-section-tabs{top:72px;margin:0 -8px}
#departureReceiptModal .receipt-action-row{grid-template-columns:.8fr .8fr 1.3fr;bottom:0;margin:14px -8px -82px;padding:9px 8px max(9px,env(safe-area-inset-bottom))}
#departureReceiptModal .receipt-action-row .secondary,#departureReceiptModal .receipt-action-row .receipt-submit{min-height:47px;padding:0 6px;font-size:10px}
}
@media(max-width:430px){
#appScreen .job-route-summary{grid-template-columns:1fr}
#appScreen .job-vehicle-tile{display:grid;grid-template-columns:34px 1fr;align-items:center;padding:0 0 10px;border-right:0;border-bottom:1px solid #e0e8f1;text-align:left}
#appScreen .job-vehicle-tile svg{width:30px}
#appScreen .driver-ticket-card>footer,#appScreen .driver-message-content>footer{align-items:stretch;flex-direction:column}
#appScreen .driver-ticket-card .actions,#appScreen .driver-message-card .actions{width:100%}
#appScreen .driver-ticket-card .actions button,#appScreen .driver-message-card .actions button{flex:1}
#appScreen .settlement-summary{grid-template-columns:1fr}
#appScreen .settlement-summary strong:last-child{grid-column:auto}
#departureReceiptModal .receipt-doc-number{display:none}
}

/* New assignment alert */
#driverAssignmentModal.driver-assignment-modal{z-index:90;padding:18px;background:rgba(7,22,42,.68);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
#driverAssignmentModal .driver-assignment-dialog{width:min(600px,100%);overflow:hidden;border:1px solid rgba(255,255,255,.72);border-radius:24px;background:#f5f8fc;box-shadow:0 30px 80px rgba(2,12,27,.4),0 8px 22px rgba(2,12,27,.2)}
#driverAssignmentModal .driver-assignment-head{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:13px;align-items:start;padding:23px;background:linear-gradient(125deg,#081b34 0%,#0d315e 58%,#115ba8 100%);color:#fff}
#driverAssignmentModal .driver-assignment-mark{display:grid;width:48px;height:48px;place-items:center;border:1px solid rgba(255,255,255,.2);border-radius:15px;background:rgba(255,255,255,.11);box-shadow:inset 0 1px rgba(255,255,255,.16)}
#driverAssignmentModal .driver-assignment-mark svg{width:24px;height:24px}
#driverAssignmentModal .driver-assignment-heading>span{display:block;margin:1px 0 7px;color:#75b9ff;font-size:10px;font-weight:950;letter-spacing:.15em}
#driverAssignmentModal .driver-assignment-heading h3{margin:0;color:#fff;font-size:21px;font-weight:950;line-height:1.25;letter-spacing:-.03em}
#driverAssignmentModal .driver-assignment-heading p{margin:7px 0 0;color:#c5d6e9;font-size:12px;font-weight:650;line-height:1.5}
#driverAssignmentModal .driver-assignment-close{min-width:52px;min-height:38px;padding:0 11px;border:1px solid rgba(255,255,255,.24);border-radius:11px;background:rgba(255,255,255,.1);color:#fff;font-size:12px;font-weight:900}
#driverAssignmentModal .driver-assignment-close:hover{background:rgba(255,255,255,.18)}
#driverAssignmentModal .driver-assignment-content{padding:18px 20px 8px}
#driverAssignmentModal .driver-assignment-summary{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:12px}
#driverAssignmentModal .driver-assignment-summary>span{display:flex;min-width:0;min-height:68px;padding:12px 14px;flex-direction:column;justify-content:center;border:1px solid #dce6f1;border-radius:14px;background:#fff}
#driverAssignmentModal .driver-assignment-summary small,#driverAssignmentModal .driver-assignment-route small{color:#8796a9;font-size:10px;font-style:normal;font-weight:850;letter-spacing:.02em}
#driverAssignmentModal .driver-assignment-summary strong{overflow:hidden;margin-top:4px;color:#17283e;font-size:14px;font-weight:950;text-overflow:ellipsis;white-space:nowrap}
#driverAssignmentModal .driver-assignment-route{padding:17px 16px;border:1px solid #dce6f1;border-radius:16px;background:#fff;box-shadow:0 6px 18px rgba(25,54,88,.05)}
#driverAssignmentModal .driver-assignment-route>div{display:grid;grid-template-columns:32px minmax(0,1fr);gap:11px;align-items:center}
#driverAssignmentModal .driver-assignment-route i{display:grid;width:32px;height:32px;place-items:center;border-radius:10px;background:#e8f2ff;color:#1269d3;font-size:11px;font-style:normal;font-weight:950}
#driverAssignmentModal .driver-assignment-route>div:last-child i{background:#e9f8f2;color:#087a4a}
#driverAssignmentModal .driver-assignment-route span:not(.driver-assignment-route-line){display:flex;min-width:0;flex-direction:column;gap:3px}
#driverAssignmentModal .driver-assignment-route strong{color:#22354e;font-size:13px;font-weight:850;line-height:1.45;word-break:keep-all}
#driverAssignmentModal .driver-assignment-route-line{display:block;width:1px;height:15px;margin:3px 0 3px 15px;background:repeating-linear-gradient(to bottom,#9eb5cc 0 3px,transparent 3px 6px)}
#driverAssignmentModal .driver-assignment-note{margin:10px 0 0;padding:12px 14px;border-radius:12px;background:#eaf2fb;color:#52667d;font-size:12px;font-weight:700;line-height:1.55}
#driverAssignmentModal .driver-assignment-actions{padding:12px 20px 20px}
#driverAssignmentModal .driver-assignment-actions button{display:flex;width:100%;min-height:52px;padding:0 18px;align-items:center;justify-content:center;gap:9px;border:0;border-radius:14px;background:linear-gradient(120deg,#126bd7,#168af1);box-shadow:0 10px 22px rgba(18,108,218,.25);color:#fff;font-size:14px;font-weight:950}
#driverAssignmentModal .driver-assignment-actions button span{font-size:20px;line-height:1}

@media(max-width:430px){
#driverAssignmentModal.driver-assignment-modal{padding:10px}
#driverAssignmentModal .driver-assignment-dialog{border-radius:20px}
#driverAssignmentModal .driver-assignment-head{grid-template-columns:42px minmax(0,1fr) auto;gap:10px;padding:18px 15px}
#driverAssignmentModal .driver-assignment-mark{width:42px;height:42px;border-radius:13px}
#driverAssignmentModal .driver-assignment-heading h3{font-size:18px}
#driverAssignmentModal .driver-assignment-heading p{font-size:11px}
#driverAssignmentModal .driver-assignment-close{min-width:42px;padding:0 8px}
#driverAssignmentModal .driver-assignment-content{padding:14px 13px 5px}
#driverAssignmentModal .driver-assignment-summary{grid-template-columns:1fr}
#driverAssignmentModal .driver-assignment-summary>span{min-height:58px}
#driverAssignmentModal .driver-assignment-actions{padding:11px 13px 14px}
}

/* Administrator message alert */
#messageModal.driver-admin-message-modal{z-index:85;padding:18px;background:rgba(7,22,42,.68);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
#messageModal .driver-admin-message-dialog{width:min(570px,100%);overflow:hidden;border:1px solid rgba(255,255,255,.7);border-radius:24px;background:#f5f8fc;box-shadow:0 30px 80px rgba(2,12,27,.4),0 8px 22px rgba(2,12,27,.2)}
#messageModal .driver-admin-message-head{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:13px;align-items:start;padding:23px;background:linear-gradient(125deg,#0a1c34 0%,#143657 58%,#175b8b 100%);color:#fff}
#messageModal .driver-admin-message-mark{display:grid;width:48px;height:48px;place-items:center;border:1px solid rgba(255,255,255,.2);border-radius:15px;background:rgba(255,255,255,.11);box-shadow:inset 0 1px rgba(255,255,255,.16)}
#messageModal .driver-admin-message-mark svg{width:25px;height:25px}
#messageModal .driver-admin-message-heading>span{display:block;margin:1px 0 7px;color:#78c8ff;font-size:10px;font-weight:950;letter-spacing:.14em}
#messageModal .driver-admin-message-heading h3{margin:0;color:#fff;font-size:21px;font-weight:950;line-height:1.25;letter-spacing:-.03em;word-break:keep-all}
#messageModal .driver-admin-message-heading p{margin:7px 0 0;color:#c7d8e8;font-size:12px;font-weight:650;line-height:1.5}
#messageModal .driver-admin-message-close{min-width:52px;min-height:38px;padding:0 11px;border:1px solid rgba(255,255,255,.24);border-radius:11px;background:rgba(255,255,255,.1);color:#fff;font-size:12px;font-weight:900}
#messageModal .driver-admin-message-close:hover{background:rgba(255,255,255,.18)}
#messageModal .driver-admin-message-content{padding:20px 20px 8px}
#messageModal .driver-admin-message-meta{display:flex;margin-bottom:12px;align-items:center;justify-content:space-between;gap:12px;color:#7b8b9f;font-size:11px;font-weight:750}
#messageModal .driver-admin-message-meta>span{display:flex;min-width:0;align-items:center;gap:8px;color:#24374f}
#messageModal .driver-admin-message-meta i{display:grid;width:28px;height:28px;place-items:center;border-radius:9px;background:linear-gradient(140deg,#1169d1,#1a8ded);box-shadow:0 5px 12px rgba(20,111,213,.2);color:#fff;font-size:11px;font-style:normal;font-weight:950}
#messageModal .driver-admin-message-meta strong{overflow:hidden;font-size:12px;font-weight:900;text-overflow:ellipsis;white-space:nowrap}
#messageModal .driver-admin-message-meta time{flex:none}
#messageModal .driver-admin-message-body{min-height:92px;margin:0;padding:17px 18px;border:1px solid #dce6f1;border-radius:16px;background:#fff;color:#25384f;font-size:14px;font-weight:720;line-height:1.7;white-space:pre-wrap;word-break:break-word;box-shadow:0 6px 18px rgba(25,54,88,.05)}
#messageModal .driver-admin-message-reference{display:flex;margin-top:10px;padding:11px 14px;align-items:center;justify-content:space-between;gap:12px;border-radius:12px;background:#eaf2fb;color:#52667d}
#messageModal .driver-admin-message-reference span{font-size:11px;font-weight:800}
#messageModal .driver-admin-message-reference strong{overflow:hidden;color:#155da9;font-size:12px;font-weight:950;text-overflow:ellipsis;white-space:nowrap}
#messageModal .driver-admin-message-actions{padding:12px 20px 20px}
#messageModal .driver-admin-message-actions button{display:flex;width:100%;min-height:52px;padding:0 18px;align-items:center;justify-content:center;gap:9px;border:0;border-radius:14px;background:linear-gradient(120deg,#126bd7,#168af1);box-shadow:0 10px 22px rgba(18,108,218,.25);color:#fff;font-size:14px;font-weight:950}
#messageModal .driver-admin-message-actions button span{font-size:20px;line-height:1}

@media(max-width:430px){
#messageModal.driver-admin-message-modal{padding:10px}
#messageModal .driver-admin-message-dialog{border-radius:20px}
#messageModal .driver-admin-message-head{grid-template-columns:42px minmax(0,1fr) auto;gap:10px;padding:18px 15px}
#messageModal .driver-admin-message-mark{width:42px;height:42px;border-radius:13px}
#messageModal .driver-admin-message-heading h3{font-size:18px}
#messageModal .driver-admin-message-heading p{font-size:11px}
#messageModal .driver-admin-message-close{min-width:42px;padding:0 8px}
#messageModal .driver-admin-message-content{padding:15px 13px 5px}
#messageModal .driver-admin-message-body{min-height:82px;padding:15px;font-size:13px}
#messageModal .driver-admin-message-actions{padding:11px 13px 14px}
}

/* Driver premium visual system — existing typography scale is intentionally preserved */
#appScreen.app-screen{
--stage-accent:#2377df;
--stage-accent-2:#54a9ff;
--stage-soft:#edf6ff;
--stage-ring:rgba(35,119,223,.16);
background:
radial-gradient(circle at 84% -5%,rgba(38,126,225,.14),transparent 26%),
radial-gradient(circle at 20% 100%,rgba(17,156,129,.07),transparent 28%),
linear-gradient(180deg,#f4f8fc 0%,#edf3f8 100%);
}
#appScreen[data-driver-menu="departure"]{--stage-accent:#e47a19;--stage-accent-2:#ffb44e;--stage-soft:#fff5e8;--stage-ring:rgba(228,122,25,.16)}
#appScreen[data-driver-menu="arrival"]{--stage-accent:#0d9a69;--stage-accent-2:#42c99a;--stage-soft:#eaf9f3;--stage-ring:rgba(13,154,105,.16)}
#appScreen[data-driver-menu="completed"]{--stage-accent:#596a81;--stage-accent-2:#91a1b4;--stage-soft:#f0f3f7;--stage-ring:rgba(89,106,129,.15)}
#appScreen[data-driver-menu="settlement"]{--stage-accent:#b77b13;--stage-accent-2:#efbc50;--stage-soft:#fff7e7;--stage-ring:rgba(183,123,19,.16)}
#appScreen[data-driver-menu="support"]{--stage-accent:#157fa8;--stage-accent-2:#4bbbd2;--stage-soft:#ebf8fb;--stage-ring:rgba(21,127,168,.16)}
#appScreen[data-driver-menu="my"]{--stage-accent:#6659c5;--stage-accent-2:#9a8df0;--stage-soft:#f2f0ff;--stage-ring:rgba(102,89,197,.16)}

#appScreen .topbar{background:linear-gradient(145deg,#071a31,#0b294b);box-shadow:inset -1px 0 rgba(255,255,255,.05)}
#appScreen .bottom-nav{background:linear-gradient(180deg,#0b294b 0%,#071a31 70%);box-shadow:18px 0 48px rgba(7,24,45,.12)}
#appScreen .bottom-nav::after{position:absolute;right:16px;bottom:14px;left:16px;height:110px;border-radius:24px;background:radial-gradient(circle at 50% 100%,rgba(55,137,229,.12),transparent 68%);content:"";pointer-events:none}
#appScreen .nav-item{z-index:1}
#appScreen .nav-item strong{display:grid;height:28px;place-items:center;border:1px solid rgba(255,255,255,.055);border-radius:9px;background:rgba(255,255,255,.035);transition:.18s ease}
#appScreen .nav-item:hover strong{border-color:rgba(104,176,255,.2);background:rgba(75,150,235,.12)}
#appScreen .nav-item.active{border-color:color-mix(in srgb,var(--stage-accent-2) 30%,transparent);background:linear-gradient(105deg,color-mix(in srgb,var(--stage-accent) 38%,transparent),rgba(255,255,255,.035));box-shadow:inset 3px 0 0 var(--stage-accent-2),0 8px 22px rgba(2,16,32,.12)}
#appScreen .nav-item.active strong{border-color:color-mix(in srgb,var(--stage-accent-2) 35%,transparent);background:color-mix(in srgb,var(--stage-accent) 26%,transparent);color:#fff}

#appScreen .hero{border:1px solid rgba(255,255,255,.08);background:
radial-gradient(circle at 88% 14%,rgba(69,180,255,.35),transparent 23%),
radial-gradient(circle at 64% 120%,rgba(36,115,215,.28),transparent 36%),
linear-gradient(130deg,#081d36 0%,#10416f 64%,#126ec8 125%);
box-shadow:0 24px 58px rgba(11,52,94,.2),inset 0 1px rgba(255,255,255,.08)}
#appScreen .driver-live{border-color:rgba(133,203,255,.22);background:rgba(4,18,35,.38);box-shadow:inset 0 1px rgba(255,255,255,.06)}
#appScreen .stat,#appScreen .revenue-stat{border-color:rgba(255,255,255,.14);background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.065));box-shadow:inset 0 1px rgba(255,255,255,.06),0 8px 22px rgba(3,23,45,.08)}
#appScreen .stat:hover,#appScreen .stat:focus-visible{border-color:rgba(119,194,255,.46);background:linear-gradient(145deg,rgba(255,255,255,.19),rgba(255,255,255,.1))}
#appScreen .revenue-stat{border-color:rgba(255,205,113,.28);background:linear-gradient(135deg,rgba(227,160,49,.23),rgba(255,255,255,.07))}

#appScreen #jobsPanel,#appScreen #myPanel,#appScreen #supportPanel,#appScreen #settlementPanel{position:relative;border-color:#d8e4ef;background:rgba(255,255,255,.98);box-shadow:0 20px 55px rgba(19,48,80,.085),inset 0 1px #fff}
#appScreen #jobsPanel::before,#appScreen #myPanel::before,#appScreen #supportPanel::before,#appScreen #settlementPanel::before{position:absolute;z-index:4;inset:0 0 auto;height:4px;background:linear-gradient(90deg,var(--stage-accent),var(--stage-accent-2),transparent 82%);content:"";pointer-events:none}
#appScreen #jobsPanel>.panel-head{position:relative;background:
radial-gradient(circle at 88% 0,var(--stage-ring),transparent 42%),
linear-gradient(120deg,#fff 0%,color-mix(in srgb,var(--stage-soft) 42%,#fff) 100%)}
#appScreen #jobsPanel>.panel-head>.badge{border:1px solid color-mix(in srgb,var(--stage-accent) 18%,#dfe8f1);background:var(--stage-soft);color:var(--stage-accent)}
#appScreen #jobsPanel>.search-row{padding:10px;border:1px solid #e1e9f2;border-radius:15px;background:#f6f9fc;box-shadow:inset 0 1px 2px rgba(23,48,79,.035)}
#appScreen .search-row input{border-color:transparent;background-color:#fff;box-shadow:0 5px 15px rgba(27,54,88,.055)}
#appScreen .search-row input:focus{border-color:color-mix(in srgb,var(--stage-accent) 44%,#cbd9e7);box-shadow:0 0 0 4px var(--stage-ring),0 5px 15px rgba(27,54,88,.055);outline:0}
#appScreen .filter-button{border-color:#d9e4ee;background:linear-gradient(#fff,#f8fafc);box-shadow:0 3px 9px rgba(25,51,82,.04)}

#appScreen .job-card{background:linear-gradient(145deg,#fff 0%,#fbfdff 100%);box-shadow:0 10px 30px rgba(18,47,80,.07),inset 0 1px #fff}
#appScreen .job-card.status-assigned,#appScreen .job-card.status-pickup_arrived{background:linear-gradient(145deg,#fff 74%,#f1f7ff)}
#appScreen .job-card.status-departure_registered{background:linear-gradient(145deg,#fff 74%,#fff8ef)}
#appScreen .job-card.status-arrival_registered{background:linear-gradient(145deg,#fff 74%,#effaf6)}
#appScreen .job-card.status-completed{background:linear-gradient(145deg,#fff 74%,#f3f5f8)}
#appScreen .job-head{padding-bottom:12px;border-bottom:1px solid #e9eff5}
#appScreen .job-route-summary{border-color:#e0e9f2;background:
radial-gradient(circle at 100% 0,color-mix(in srgb,var(--job-accent) 8%,transparent),transparent 38%),
linear-gradient(145deg,#f9fbfd,#f3f7fb);box-shadow:inset 0 1px #fff}
#appScreen .job-route-dot{box-shadow:0 0 0 3px #fff,0 0 0 5px color-mix(in srgb,var(--job-accent) 20%,#dfe7ef)}
#appScreen .job-card>.meta{border-color:#dfe8f1;background:#f8fafc;box-shadow:inset 0 1px #fff}
#appScreen .job-card>.meta>div{background:rgba(255,255,255,.72)}
#appScreen .job-card>.actions button{border-color:#d4e0ec;background:linear-gradient(#fff,#f6f9fc);box-shadow:0 4px 10px rgba(25,52,84,.045);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
#appScreen .job-card>.actions button:hover{border-color:color-mix(in srgb,var(--job-accent) 32%,#cad9e8);box-shadow:0 7px 16px color-mix(in srgb,var(--job-accent) 10%,transparent);transform:translateY(-1px)}
#appScreen .job-card>.actions button[data-support-center]{background:linear-gradient(125deg,var(--job-accent),color-mix(in srgb,var(--job-accent) 72%,#2aa7ef));box-shadow:0 8px 18px color-mix(in srgb,var(--job-accent) 22%,transparent)}

#appScreen .driver-page-head{background:
radial-gradient(circle at 82% 0,color-mix(in srgb,var(--stage-accent-2) 38%,transparent),transparent 38%),
linear-gradient(120deg,#081e38 0%,color-mix(in srgb,var(--stage-accent) 58%,#0d3156) 74%,#185b8e 135%);
box-shadow:inset 0 -1px rgba(255,255,255,.06)}
#appScreen .driver-page-head>.badge{border-color:color-mix(in srgb,var(--stage-accent-2) 34%,transparent);background:color-mix(in srgb,var(--stage-accent) 28%,transparent);box-shadow:inset 0 1px rgba(255,255,255,.08)}

#appScreen #myPanel .profile-grid{background:
radial-gradient(circle at 100% 0,rgba(102,89,197,.08),transparent 31%),
linear-gradient(180deg,#f7f8fc,#f2f5fa)}
#appScreen .driver-form-section-heading{border-bottom-color:color-mix(in srgb,var(--stage-accent) 17%,#dce5ef)}
#appScreen .driver-form-section-heading b,#appScreen .driver-section-heading b{background:linear-gradient(145deg,var(--stage-accent),var(--stage-accent-2));box-shadow:0 6px 14px var(--stage-ring)}
#appScreen #myPanel .profile-grid>label{padding:13px;border:1px solid #dce5ef;border-radius:15px;background:rgba(255,255,255,.86);box-shadow:0 6px 18px rgba(29,54,84,.04)}
#appScreen #myPanel .profile-grid input,#appScreen #myPanel .profile-grid select{border-color:#d8e3ed;background:#f8fafc}
#appScreen #myPanel .profile-grid input:focus,#appScreen #myPanel .profile-grid select:focus{border-color:var(--stage-accent);box-shadow:0 0 0 4px var(--stage-ring)}
#appScreen #saveProfileButton{background:linear-gradient(120deg,var(--stage-accent),var(--stage-accent-2));box-shadow:0 10px 24px var(--stage-ring)}

#appScreen #supportPanel .support-layout{background:
radial-gradient(circle at 0 100%,rgba(25,151,176,.07),transparent 30%),
linear-gradient(180deg,#f6f9fc,#f1f5f9)}
#appScreen #supportPanel .support-form,#appScreen #supportPanel .support-list{border-color:#dbe5ee;box-shadow:0 10px 28px rgba(24,51,81,.055)}
#appScreen #supportPanel .support-form{border-top:4px solid var(--stage-accent)}
#appScreen #supportPanel .support-list{border-top:4px solid color-mix(in srgb,var(--stage-accent) 60%,#9cc9d9)}
#appScreen #driverSupportContent{background:linear-gradient(#fbfdff,#f7fafc)}
#appScreen #driverSupportContent:focus{border-color:var(--stage-accent);box-shadow:0 0 0 4px var(--stage-ring)}
#appScreen #sendDriverSupportButton{background:linear-gradient(120deg,var(--stage-accent),var(--stage-accent-2));box-shadow:0 9px 22px var(--stage-ring)}
#appScreen .driver-ticket-card,#appScreen .driver-message-card{border-color:#dce6ef;background:linear-gradient(145deg,#fff,#fafdff);box-shadow:0 7px 20px rgba(26,53,84,.045)}
#appScreen .driver-ticket-card:hover,#appScreen .driver-message-card:hover{border-color:color-mix(in srgb,var(--stage-accent) 25%,#d7e3ed);box-shadow:0 12px 28px rgba(22,65,105,.08)}

#appScreen #settlementHistoryContent{background:
radial-gradient(circle at 100% 0,rgba(225,172,60,.08),transparent 28%),
linear-gradient(180deg,#f7f9fc,#f1f5f9)}
#appScreen .settlement-primary-card{border:1px solid rgba(255,215,140,.17);background:
radial-gradient(circle at 90% 0,rgba(255,200,91,.32),transparent 38%),
linear-gradient(135deg,#09233f,#124d7f);box-shadow:0 18px 38px rgba(12,55,94,.2),inset 0 1px rgba(255,255,255,.08)}
#appScreen .settlement-summary strong{border-color:#dde6ef;background:linear-gradient(145deg,#fff,#f9fbfd);box-shadow:0 8px 21px rgba(29,54,85,.05)}
#appScreen .settlement-record-card{border-color:#dbe5ee;background:linear-gradient(145deg,#fff,#fbfdff);box-shadow:0 9px 26px rgba(24,51,83,.055)}
#appScreen .settlement-record-card:hover{border-color:#c7d8e8;box-shadow:0 14px 32px rgba(22,57,94,.09)}
#appScreen .settlement-costs{border:1px solid #e7edf3;background:#f5f8fb}

#jobDetailModal.modal-backdrop{background:rgba(5,19,37,.7);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
#jobDetailModal>.modal{border:1px solid #d8e3ed;background:#f3f7fb;box-shadow:0 32px 95px rgba(3,16,32,.45)}
#jobDetailModal>.modal>.modal-head{border:0;background:
radial-gradient(circle at 78% 0,rgba(75,159,242,.3),transparent 42%),
linear-gradient(120deg,#081d36,#103b67 72%,#17659f);box-shadow:0 9px 24px rgba(10,40,72,.18)}
#jobDetailModal>.modal>.modal-head h3{color:#fff}
#jobDetailModal>.modal>.modal-head button{border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.1);color:#fff}
#jobDetailModalBody{background:linear-gradient(180deg,#f5f8fc,#eef3f8)}
#jobDetailModal .detail-reference-hero{border-color:#d7e3ef;background:
radial-gradient(circle at 90% 0,rgba(45,137,232,.1),transparent 38%),
linear-gradient(145deg,#fff,#f7faff);box-shadow:0 11px 30px rgba(23,53,87,.07)}
#jobDetailModal .detail-reference-card{border-color:#dbe5ef;background:linear-gradient(145deg,#fff,#fbfdff);box-shadow:0 9px 25px rgba(24,51,83,.055)}
#jobDetailModal .detail-reference-card.route{border-top-color:#1b8db8}
#jobDetailModal .detail-reference-card.important{border-top-color:#ee9a32;background:linear-gradient(145deg,#fff,#fffaf2)}
#jobDetailModal .detail-reference-route>div{border-color:#dce6ef;background:#f8fbfd}
#jobDetailModal .detail-drive-summary,#jobDetailModal .detail-options{border-color:#e0e8f1;background:#f7f9fc}
#jobDetailModal .detail-reference-actions{border-top-color:#d8e3ed;background:rgba(255,255,255,.96);box-shadow:0 -12px 30px rgba(17,43,72,.1);backdrop-filter:blur(12px)}
#jobDetailModal .detail-reference-actions button{border-color:#ceddea;background:linear-gradient(#fff,#f5f8fb);box-shadow:0 5px 13px rgba(24,51,82,.06)}
#jobDetailModal .detail-reference-actions .primary{border-color:transparent;background:linear-gradient(120deg,#12885e,#16ad77);box-shadow:0 8px 20px rgba(14,145,98,.22)}

#departureReceiptModal{background:rgba(5,19,37,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
#departureReceiptModal>.modal{border-color:#d7e2ed;background:
radial-gradient(circle at 100% 0,rgba(32,119,222,.07),transparent 24%),
linear-gradient(180deg,#f5f8fc,#edf3f8);box-shadow:0 34px 105px rgba(3,16,32,.48)}
#departureReceiptModal>.modal>.modal-head{background:
radial-gradient(circle at 74% 0,rgba(76,166,247,.34),transparent 42%),
linear-gradient(120deg,#081d36,#103e6e 72%,#1769a7)}
#departureReceiptModal>.modal.receipt-arrival-layout>.modal-head{background:
radial-gradient(circle at 74% 0,rgba(71,215,164,.3),transparent 42%),
linear-gradient(120deg,#071f2d,#0c594c 72%,#118665)}
#departureReceiptModal .receipt-window-close{border-color:rgba(255,255,255,.32);background:rgba(255,255,255,.14);box-shadow:0 6px 16px rgba(2,18,35,.14),inset 0 1px rgba(255,255,255,.1)}
#departureReceiptModal .receipt-window-close:hover{border-color:rgba(255,255,255,.54);background:rgba(255,255,255,.22);transform:translateY(-1px)}
#departureReceiptModal .receipt-summary-card,#departureReceiptModal .receipt-route-panel,#departureReceiptModal .receipt-meter-panel,#departureReceiptModal .receipt-proof-panel,#departureReceiptModal .receipt-time-panel,#departureReceiptModal .receipt-card{border-color:#d8e3ed;background:linear-gradient(145deg,#fff,#fbfdff);box-shadow:0 10px 28px rgba(24,52,84,.06)}
#departureReceiptModal .receipt-section-tabs{border-bottom-color:#d8e3ed;background:rgba(255,255,255,.96);backdrop-filter:blur(12px)}
#departureReceiptModal .receipt-section-tab{border-color:#d9e4ee;background:linear-gradient(#fff,#f6f9fc);box-shadow:0 4px 11px rgba(24,51,83,.045)}
#departureReceiptModal .receipt-section-tab.active{border-color:#1c75dc;background:linear-gradient(125deg,#176ed8,#168ce9);box-shadow:0 8px 18px rgba(22,112,218,.2);color:#fff}
#departureReceiptModal>.modal.receipt-arrival-layout .receipt-section-tab.active{border-color:#108d63;background:linear-gradient(125deg,#0b7e58,#16aa78);box-shadow:0 8px 18px rgba(13,139,96,.2)}
#departureReceiptModal .meter-photo-drop,#departureReceiptModal .vehicle-slot,#departureReceiptModal .signature-pad-button{border-color:#cfddeb;background:
radial-gradient(circle at 100% 0,rgba(36,121,221,.07),transparent 34%),
linear-gradient(145deg,#fbfdff,#f3f7fb)}
#departureReceiptModal .meter-photo-drop:hover,#departureReceiptModal .vehicle-slot:hover,#departureReceiptModal .signature-pad-button:hover{border-color:#77aee4;background:#f3f8ff;box-shadow:0 7px 18px rgba(25,101,184,.09)}
#departureReceiptModal .receipt-close-action{border-color:#cbd9e6;background:linear-gradient(#fff,#eef3f7);box-shadow:0 5px 14px rgba(25,52,83,.06)}
#departureReceiptModal .receipt-close-action:hover{border-color:#9db5cb;background:#fff}
#departureReceiptModal .receipt-action-row{border-top-color:#d4e0eb;background:rgba(255,255,255,.97);box-shadow:0 -14px 34px rgba(16,43,74,.12)}
#departureReceiptModal .receipt-action-row .receipt-submit{background:linear-gradient(115deg,#0a7d4d,#14a66e);box-shadow:0 9px 22px rgba(10,136,84,.24)}

@media(max-width:760px){
#appScreen .bottom-nav{background:linear-gradient(180deg,rgba(9,36,65,.99),rgba(5,21,40,.99))}
#appScreen .bottom-nav::after{height:70px}
#appScreen #jobsPanel>.search-row{margin-inline:12px;padding:7px}
#appScreen #myPanel .profile-grid>label{padding:11px}
#appScreen #supportPanel .support-form,#appScreen #supportPanel .support-list{border-top-width:3px}
#jobDetailModal>.modal>.modal-head{box-shadow:0 7px 20px rgba(10,40,72,.17)}
#departureReceiptModal .receipt-window-close{position:relative;z-index:3;flex:none}
#departureReceiptModal .receipt-action-row{box-shadow:0 -10px 28px rgba(16,43,74,.13)}
}

/* Receipt actions stay anchored to the receipt window viewport */
#departureReceiptModal.active>.modal{padding-bottom:118px}
#departureReceiptModal.active .receipt-action-row{
position:fixed;
z-index:80;
right:auto;
bottom:14px;
left:50%;
width:min(calc(100vw - 28px),1180px);
box-sizing:border-box;
margin:0;
padding:12px 18px max(12px,env(safe-area-inset-bottom));
transform:translateX(-50%);
border:1px solid #d4e0eb;
border-radius:0 0 22px 22px;
background:#fff;
box-shadow:0 -14px 34px rgba(16,43,74,.14),0 12px 28px rgba(4,20,39,.12);
isolation:isolate;
}

@media(max-width:760px){
#departureReceiptModal.active>.modal{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
#departureReceiptModal.active .receipt-action-row{
right:0;
bottom:0;
left:0;
width:100%;
padding:9px 8px max(9px,env(safe-area-inset-bottom));
transform:none;
border-width:1px 0 0;
border-radius:0;
box-shadow:0 -12px 30px rgba(16,43,74,.16);
}
}

/* Profile management tabs */
#appScreen #myPanel .profile-tabs{
position:relative;
z-index:2;
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:7px;
margin:22px 28px 0;
padding:7px;
border:1px solid #dbe4ef;
border-radius:17px;
background:#edf2f8;
box-shadow:inset 0 1px 3px rgba(28,53,84,.055);
}
#appScreen #myPanel .profile-tab{
display:flex;
min-width:0;
min-height:66px;
padding:10px 13px;
align-items:center;
gap:11px;
border:1px solid transparent;
border-radius:13px;
background:transparent;
color:#607088;
text-align:left;
transition:border-color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease;
}
#appScreen #myPanel .profile-tab:hover{border-color:#d3deea;background:rgba(255,255,255,.66)}
#appScreen #myPanel .profile-tab:focus-visible{outline:3px solid var(--stage-ring);outline-offset:2px}
#appScreen #myPanel .profile-tab.active{
border-color:color-mix(in srgb,var(--stage-accent) 22%,#d8e3ed);
background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--stage-soft) 46%,#fff));
color:#273951;
box-shadow:0 8px 20px rgba(34,55,88,.09),inset 0 1px #fff;
transform:translateY(-1px);
}
#appScreen #myPanel .profile-tab>b{
display:grid;
width:34px;
height:34px;
flex:0 0 34px;
place-items:center;
border:1px solid #d9e3ed;
border-radius:11px;
background:#fff;
color:#77869a;
box-shadow:0 4px 10px rgba(26,53,86,.045);
}
#appScreen #myPanel .profile-tab.active>b{
border-color:transparent;
background:linear-gradient(145deg,var(--stage-accent),var(--stage-accent-2));
color:#fff;
box-shadow:0 7px 16px var(--stage-ring);
}
#appScreen #myPanel .profile-tab>span{display:grid;min-width:0;gap:3px}
#appScreen #myPanel .profile-tab>span strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#appScreen #myPanel .profile-tab>span small{overflow:hidden;color:#8a97a9;text-overflow:ellipsis;white-space:nowrap}
#appScreen #myPanel .profile-tab-stack{
margin-top:16px;
border-top:1px solid #e2e9f1;
background:
radial-gradient(circle at 100% 0,rgba(102,89,197,.08),transparent 31%),
linear-gradient(180deg,#f7f8fc,#f2f5fa);
}
#appScreen #myPanel .profile-tab-panel[hidden]{display:none}
#appScreen #myPanel .profile-tab-panel.active{animation:driverProfilePanelIn .2s ease both}
#appScreen #myPanel .profile-tab-panel .profile-grid{background:transparent}
#appScreen #myPanel .profile-tab-panel .driver-form-section-heading{margin-top:0}
@keyframes driverProfilePanelIn{
from{opacity:0;transform:translateY(6px)}
to{opacity:1;transform:none}
}

@media(max-width:760px){
#appScreen #myPanel .profile-tabs{gap:5px;margin:13px 12px 0;padding:5px;border-radius:14px}
#appScreen #myPanel .profile-tab{min-height:58px;padding:8px;justify-content:center;gap:7px;border-radius:11px;text-align:center}
#appScreen #myPanel .profile-tab>b{width:30px;height:30px;flex-basis:30px;border-radius:9px}
#appScreen #myPanel .profile-tab>span small{display:none}
#appScreen #myPanel .profile-tab-stack{margin-top:12px}
}

@media(max-width:390px){
#appScreen #myPanel .profile-tab{flex-direction:column;gap:4px}
}

/* In-app guide menu; keep all eleven menu entries reachable on short screens. */
#appScreen .driver-guide-link{text-decoration:none}
#appScreen .driver-guide-link strong{display:grid;place-items:center}
#appScreen .driver-guide-link:focus-visible{outline:2px solid #75bdff;outline-offset:-2px}
#appScreen .bottom-nav{overflow-y:auto;overscroll-behavior:contain}
@media(max-width:760px){
#appScreen .bottom-nav{max-height:calc(100dvh - 82px - env(safe-area-inset-bottom,0px))}
}

/* Keep the app shell and navigation mounted while the separate guide pages change. */
#appScreen[data-driver-menu="guide"]{padding-bottom:24px}
#appScreen[data-driver-menu="guide"] .hero{display:none}
#appScreen #guidePanel{margin:0;padding:0;min-width:0;overflow:hidden;border:1px solid var(--d-line);border-radius:18px;background:#f5f7f5;box-shadow:0 7px 24px rgba(17,35,61,.045)}
#appScreen #driverGuideFrame{display:block;width:100%;height:calc(100vh - 62px);height:calc(100dvh - 62px);border:0;background:#f5f7f5}
@media(max-width:760px){
#appScreen[data-driver-menu="guide"]{padding-bottom:12px}
#appScreen #guidePanel{border-radius:14px}
#appScreen #driverGuideFrame{height:calc(100vh - 90px - env(safe-area-inset-bottom,0px));height:calc(100dvh - 90px - env(safe-area-inset-bottom,0px))}
}