/* rider.html — extracted CSS (sprint 14 ship 37 2026-05-30). Was inline <style> in rider.html. Non-functional move. */

:root {
      --g900:#071F17; --g800:#0A3D2E; --g700:#0F5A43; --g600:#1A7A5E; --g500:#26A07A;
      --acc:#00E5A0; --acc2:#00C896;
      --lite:#F0FBF6; --lite2:#E3F7EE;
      --white:#FFFFFF; --ink:#0A1F16; --ink2:#2E5045; --mute:#7A9E8E; --mute2:#B0CCBF;
      --bg:#F2F8F5; --warn:#F59E0B; --danger:#EF4444; --info:#3B82F6; --wa:#25D366;
      --shadow:0 1px 12px rgba(10,61,46,0.08);
      --shadow-md:0 4px 24px rgba(10,61,46,0.12);
      --r:16px; --r-sm:10px; --r-lg:24px;
      --font:'Plus Jakarta Sans',sans-serif; --mono:'DM Mono',monospace;
    }
    *,*::before,*::after{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
    html,body{height:100%;background:var(--g800);font-family:var(--font);color:var(--ink)}
    #shell{position:relative;width:390px;max-width:100%;min-height:100dvh;margin:0 auto;background:var(--bg);overflow:hidden}
    @media(max-width:420px){body{background:var(--bg)}}

    .scr{position:absolute;inset:0;display:none;flex-direction:column;background:var(--bg);overflow-y:auto;-webkit-overflow-scrolling:touch}
    .scr.on{display:flex}

    /* ── auth ─── */
    .auth-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 20px}
    .brand-logo{font-size:30px;font-weight:900;color:var(--g800);letter-spacing:-1px;margin-bottom:2px}
    .brand-sub{font-size:13px;color:var(--mute);font-weight:600;margin-bottom:24px;letter-spacing:.02em}
    .auth-card{width:100%;background:var(--white);border-radius:var(--r-lg);padding:24px 20px;box-shadow:var(--shadow-md)}
    .auth-card h2{font-size:17px;font-weight:800;color:var(--g800);margin-bottom:4px}
    .auth-card .sub{font-size:13px;color:var(--mute);line-height:1.5;margin-bottom:18px}

    /* ── form ─── */
    .fg{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
    label{font-size:11px;font-weight:700;color:var(--ink2);letter-spacing:0.4px;text-transform:uppercase}
    input[type=tel],input[type=text],input[type=number]{width:100%;height:52px;border-radius:var(--r-sm);border:1.5px solid var(--mute2);background:var(--bg);font-family:var(--font);font-size:15px;font-weight:600;color:var(--ink);padding:0 14px;outline:none;transition:border-color .15s}
    input:focus{border-color:var(--acc2);background:var(--white)}
    input::placeholder{font-weight:400;color:var(--mute2)}
    input.err{border-color:var(--danger)}
    .ferr{font-size:12px;color:var(--danger);font-weight:600;min-height:16px;margin-top:2px}
    .phone-row{display:flex;gap:8px}
    .phone-pfx{height:52px;padding:0 12px;border:1.5px solid var(--mute2);border-radius:var(--r-sm);background:var(--lite);font-family:var(--mono);font-size:13px;font-weight:500;color:var(--ink2);display:flex;align-items:center;white-space:nowrap;flex-shrink:0}
    .phone-row input{flex:1}
    .naira-row{display:flex;gap:8px;align-items:stretch}
    .naira-pfx{height:52px;padding:0 12px;border:1.5px solid var(--mute2);border-radius:var(--r-sm);background:var(--lite);font-family:var(--mono);font-size:15px;font-weight:600;color:var(--ink2);display:flex;align-items:center}
    .naira-row input{flex:1}
    textarea{width:100%;border-radius:var(--r-sm);border:1.5px solid var(--mute2);background:var(--bg);font-family:var(--font);font-size:14px;font-weight:500;color:var(--ink);padding:12px 14px;outline:none;transition:border-color .15s;line-height:1.5;resize:none}
    textarea:focus{border-color:var(--acc2);background:var(--white)}
    textarea::placeholder{font-weight:400;color:var(--mute2)}
    .req{color:var(--danger);font-weight:800}
    .opt{font-size:10px;color:var(--mute);font-weight:400;text-transform:none;letter-spacing:0}

    /* OTP */
    .otp-f{font-family:var(--mono);font-size:28px;font-weight:500;letter-spacing:14px;text-align:center;width:100%;border:1.5px solid var(--mute2);border-radius:var(--r);padding:16px 20px;background:var(--white);color:var(--ink);outline:none;transition:border-color .15s}
    .otp-f:focus{border-color:var(--acc2)}
    .otp-hint{font-size:12px;color:var(--mute);text-align:center;margin-top:8px}
    .otp-resend{font-size:13px;color:var(--g600);font-weight:600;cursor:pointer;text-align:center;display:block;margin-top:10px;background:none;border:none;font-family:var(--font)}
    .otp-resend:disabled{color:var(--mute);cursor:not-allowed}

    /* ── buttons ─── */
    .btn{width:100%;height:52px;border-radius:var(--r);border:none;cursor:pointer;font-family:var(--font);font-size:15px;font-weight:800;transition:all .15s;display:flex;align-items:center;justify-content:center;gap:8px}
    .btn-p{background:var(--g800);color:var(--white)}
    .btn-p:hover{background:var(--g700)}
    .btn-p:disabled{background:var(--mute2);cursor:not-allowed}
    .btn-g{background:transparent;color:var(--g700);font-weight:600;font-size:14px}
    .btn-warn{background:var(--warn);color:var(--g900)}
    .btn-sm{height:44px;font-size:14px}
    .btn-row{display:flex;flex-direction:column;gap:10px;margin-top:18px}

    .spin{width:20px;height:20px;border:3px solid rgba(255,255,255,.3);border-top-color:var(--white);border-radius:50%;animation:rot .7s linear infinite}
    @keyframes rot{to{transform:rotate(360deg)}}

    /* toast */
    #toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:9999;pointer-events:none;display:flex;flex-direction:column;gap:8px;align-items:center}
    .t{background:var(--g900);color:var(--white);font-size:13px;font-weight:600;padding:12px 20px;border-radius:var(--r);box-shadow:var(--shadow-md);white-space:nowrap;animation:tin .2s ease-out}
    .t.warn{background:var(--warn);color:var(--g900)}
    .t.danger{background:var(--danger)}
    .t.ok{background:var(--g700)}
    @keyframes tin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

    /* topbar */
    .topbar{display:flex;align-items:center;gap:12px;padding:16px;background:var(--g800);color:var(--white);flex-shrink:0}
    .tb-back{width:40px;height:40px;border-radius:var(--r-sm);background:rgba(255,255,255,.12);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--white);flex-shrink:0}
    .tb-title{flex:1;font-size:17px;font-weight:800;letter-spacing:-0.3px}
    .tb-sub{font-size:11px;color:rgba(255,255,255,.6);font-weight:500}

    /* home header */
    .home-hdr{background:var(--g800);padding:28px 20px 24px;flex-shrink:0}
    .home-gr{font-size:12px;color:rgba(255,255,255,.6);font-weight:500;margin-bottom:2px}
    .home-name{font-size:20px;font-weight:900;color:var(--white);letter-spacing:-0.5px;margin-bottom:14px}
    .wallet-card{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);border-radius:var(--r);padding:14px 16px;display:flex;align-items:center;justify-content:space-between}
    .wallet-label{font-size:11px;color:rgba(255,255,255,.6);font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-bottom:2px}
    .wallet-amount{font-family:var(--mono);font-size:22px;font-weight:700;color:var(--white)}
    .wallet-note{font-size:10px;color:rgba(255,255,255,.45);margin-top:2px}
    .wallet-ic{font-size:28px}

    /* home body */
    .home-body{flex:1;padding:16px;display:flex;flex-direction:column;gap:14px;overflow-y:auto}
    .section-title{font-size:11px;font-weight:800;color:var(--ink2);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}

    /* new pickup button */
    .new-pickup-btn{width:100%;background:var(--g800);border:none;border-radius:var(--r);padding:18px 16px;display:flex;align-items:center;gap:14px;cursor:pointer;font-family:var(--font);text-align:left;transition:background .15s}
    .new-pickup-btn:hover{background:var(--g700)}
    .new-pickup-btn:active{transform:scale(.99)}
    .np-ic{font-size:28px;flex-shrink:0}
    .np-text{flex:1}
    .np-title{font-size:16px;font-weight:900;color:var(--white);letter-spacing:-.3px}
    .np-sub{font-size:12px;color:rgba(255,255,255,.6);font-weight:500;margin-top:2px}
    .np-arrow{font-size:20px;color:var(--acc);font-weight:900}

    /* shipment card */
    .shipment-card{background:var(--white);border-radius:var(--r);padding:14px;box-shadow:var(--shadow);cursor:pointer;border:none;width:100%;text-align:left;font-family:var(--font);display:flex;gap:12px;align-items:flex-start}
    .shipment-card:active{transform:scale(.99)}
    .sc-ic{width:42px;height:42px;border-radius:var(--r-sm);background:var(--lite2);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
    .sc-ic.delivered{background:#D1FAE5}
    .sc-ic.transferred{background:#F3F4F6}
    .sc-info{flex:1;min-width:0}
    .sc-code{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--g700);letter-spacing:.5px;margin-bottom:2px}
    .sc-parties{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    .sc-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

    /* status chips */
    .chip{display:inline-block;font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;text-transform:uppercase;letter-spacing:.05em}
    .chip.in_transit{background:#FEF3C7;color:#92400E}
    .chip.picked_up{background:var(--lite2);color:var(--g700)}
    .chip.transferred{background:#F3F4F6;color:var(--mute)}
    .chip.delivered{background:#D1FAE5;color:#065F46}
    .chip.assigned{background:#DBEAFE;color:var(--info)}
    .sc-items{font-size:12px;color:var(--mute);font-weight:500}

    /* job cards (vendor-assigned) */
    .job-card{background:var(--white);border-radius:var(--r);padding:14px;box-shadow:var(--shadow);cursor:pointer;border:none;width:100%;text-align:left;font-family:var(--font);display:flex;gap:12px;align-items:flex-start}
    .job-card:active{transform:scale(.99)}
    .job-icon{width:42px;height:42px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
    .job-icon.assigned{background:#DBEAFE;color:var(--info)}
    .job-icon.in_transit{background:#FEF3C7;color:var(--warn)}
    .job-icon.picked_up{background:var(--lite2);color:var(--g700)}
    .job-info{flex:1;min-width:0}
    .job-num{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--g700);letter-spacing:.5px;margin-bottom:2px}
    .job-addr{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    .job-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
    .job-fee{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--g700)}

    /* transfer alert */
    .transfer-card{background:var(--white);border-radius:var(--r);padding:14px;box-shadow:0 0 0 2px var(--warn),var(--shadow);cursor:pointer;border:none;width:100%;text-align:left;font-family:var(--font)}
    .transfer-card:active{transform:scale(.99)}
    .tc-head{display:flex;align-items:center;gap:10px;margin-bottom:8px}
    .tc-ic{font-size:22px}
    .tc-title{font-size:13px;font-weight:800;color:var(--ink)}
    .tc-meta{font-size:12px;color:var(--mute);line-height:1.5}
    .tc-fee{font-family:var(--mono);font-size:14px;font-weight:800;color:var(--g700);margin-top:6px}
    .tc-btn{margin-top:10px;height:42px;border-radius:var(--r-sm);background:var(--warn);color:var(--g900);border:none;font-family:var(--font);font-size:13px;font-weight:800;cursor:pointer;width:100%}

    /* empty state */
    .empty{text-align:center;padding:24px 20px;color:var(--mute);font-size:13px}
    .empty .ic{font-size:32px;margin-bottom:8px;opacity:.5}

    /* detail screens */
    .jd-body{flex:1;padding:16px;display:flex;flex-direction:column;gap:14px;overflow-y:auto}
    .detail-card{background:var(--white);border-radius:var(--r);padding:16px;box-shadow:var(--shadow)}
    .section-label{font-size:11px;font-weight:800;color:var(--mute);text-transform:uppercase;letter-spacing:.05em;margin-bottom:12px}
    .detail-row{display:flex;justify-content:space-between;align-items:flex-start;padding:6px 0;border-bottom:1px solid var(--lite2)}
    .detail-row:last-child{border-bottom:none}
    .detail-row .k{font-size:12px;color:var(--mute);font-weight:600;flex-shrink:0;margin-right:12px}
    .detail-row .v{font-size:13px;font-weight:700;color:var(--ink);text-align:right;word-break:break-word}
    .detail-row .v.mono{font-family:var(--mono);color:var(--g700)}
    .items-list{margin-top:8px;font-size:12px;color:var(--ink2);line-height:1.6}
    .items-list li{padding:2px 0}
    .action-block{padding:16px;background:var(--white);border-top:1px solid var(--lite2);flex-shrink:0;display:flex;flex-direction:column;gap:8px}

    /* ── pickup form ─── */
    .pickup-body{flex:1;padding:16px;display:flex;flex-direction:column;gap:12px;overflow-y:auto}
    .pickup-body .detail-card{padding:16px}

    /* ── created / success screen ─── */
    .created-body{flex:1;padding:16px;display:flex;flex-direction:column;gap:14px;overflow-y:auto}
    .gbz-card{background:var(--g800);border-radius:var(--r);padding:24px 20px;text-align:center}
    .gbz-label{font-size:11px;color:rgba(255,255,255,.6);font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
    .gbz-code{font-family:var(--mono);font-size:32px;font-weight:700;color:var(--acc);letter-spacing:2px;margin-bottom:8px}
    .gbz-hint{font-size:12px;color:rgba(255,255,255,.5);line-height:1.5}

    /* WhatsApp buttons */
    .wa-section{display:flex;flex-direction:column;gap:10px}
    .wa-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
    .wa-section-title{font-size:11px;font-weight:800;color:var(--ink2);text-transform:uppercase;letter-spacing:.05em}
    .wa-section-hint{font-size:11px;color:var(--mute);line-height:1.4}
    .wa-btn{width:100%;background:var(--wa);border:none;border-radius:var(--r);padding:0 16px;height:56px;display:flex;align-items:center;gap:12px;cursor:pointer;font-family:var(--font);transition:opacity .15s}
    .wa-btn:hover{opacity:.9}
    .wa-btn:active{transform:scale(.99)}
    .wa-btn-link{background:var(--lite2);border:1.5px solid var(--acc2)}
    .wa-ic{font-size:22px;flex-shrink:0}
    .wa-btn-text{flex:1;text-align:left}
    .wa-btn-title{font-size:14px;font-weight:800;color:var(--white)}
    .wa-btn-link .wa-btn-title{color:var(--g700)}
    .wa-btn-sub{font-size:11px;color:rgba(255,255,255,.7);font-weight:500;margin-top:1px}
    .wa-btn-link .wa-btn-sub{color:var(--mute)}

    /* link modal overlay */
    .modal-overlay{position:fixed;inset:0;background:rgba(7,31,23,.6);z-index:8000;display:flex;align-items:flex-end}
    .modal-overlay.off{display:none}
    .modal-sheet{width:100%;max-width:390px;margin:0 auto;background:var(--white);border-radius:var(--r-lg) var(--r-lg) 0 0;padding:24px 20px 32px;display:flex;flex-direction:column;gap:10px}
    .modal-title{font-size:15px;font-weight:800;color:var(--ink);margin-bottom:4px}
    .modal-sub{font-size:12px;color:var(--mute);margin-bottom:8px;line-height:1.5}

    /* transfer form */
    .tf-body{flex:1;padding:16px;display:flex;flex-direction:column;gap:14px;overflow-y:auto}
    .proof-area{border:2px dashed var(--mute2);border-radius:var(--r);padding:20px;text-align:center;cursor:pointer;background:var(--lite);transition:border-color .15s;position:relative}
    .proof-area input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;font-size:0}
    .proof-area .proof-label{font-size:13px;color:var(--mute);font-weight:600;pointer-events:none}
    .proof-area .proof-icon{font-size:28px;margin-bottom:6px;display:block;pointer-events:none}
    .proof-preview{width:100%;aspect-ratio:4/3;border-radius:var(--r-sm);object-fit:cover;display:none;margin-top:8px}
    .proof-preview.on{display:block}

    /* ── smart pool pending job ─── */
    .sp-card{background:var(--white);border-radius:var(--r);padding:16px;box-shadow:0 0 0 2px var(--acc),var(--shadow-md);display:flex;flex-direction:column;gap:10px}
    .sp-head{display:flex;align-items:center;gap:10px}
    .sp-ic{font-size:24px;animation:pulse 1.4s ease-in-out infinite}
    @keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}
    .sp-title{font-size:14px;font-weight:800;color:var(--g800)}
    .sp-sub{font-size:12px;color:var(--mute);line-height:1.4;margin:0}
    .sp-addr{font-size:13px;font-weight:700;color:var(--ink)}
    .sp-timer{font-family:var(--mono);font-size:12px;color:var(--warn);font-weight:700}
    .sp-btns{display:flex;gap:8px}
    .sp-btn-accept{flex:1;height:44px;border-radius:var(--r-sm);background:var(--g800);color:var(--white);border:none;font-family:var(--font);font-size:14px;font-weight:800;cursor:pointer}
    .sp-btn-decline{flex:1;height:44px;border-radius:var(--r-sm);background:var(--lite2);color:var(--g700);border:none;font-family:var(--font);font-size:14px;font-weight:700;cursor:pointer}

    /* done screen */
    .done-body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 20px;gap:6px}
    .done-ic{width:72px;height:72px;border-radius:36px;display:flex;align-items:center;justify-content:center;font-size:34px;margin-bottom:8px}
    .done-ic.ok{background:var(--lite2)}
    .done-ic.warn{background:#FEF3C7}
    .done-title{font-size:20px;font-weight:800;color:var(--g800);text-align:center}
    .done-sub{font-size:14px;color:var(--mute);text-align:center;line-height:1.5}
    .done-amount{font-family:var(--mono);font-size:28px;font-weight:900;color:var(--g700);margin:10px 0}
    .done-note{font-size:12px;color:var(--mute);text-align:center;line-height:1.5;padding:10px 14px;background:var(--lite);border-radius:var(--r-sm);width:100%;max-width:320px}

    /* ── registration ─── */
    .reg-body{flex:1;padding:16px;display:flex;flex-direction:column;gap:12px;overflow-y:auto}
    .vehicle-options{display:flex;flex-direction:column;gap:8px}
    .vehicle-opt{display:flex;align-items:center;gap:12px;padding:14px 16px;background:var(--bg);border:1.5px solid var(--mute2);border-radius:var(--r);cursor:pointer;transition:border-color .15s}
    .vehicle-opt.sel{border-color:var(--g700);background:var(--lite2)}
    .vehicle-opt input[type=radio]{display:none}
    .vehicle-ic{font-size:22px;flex-shrink:0}
    .vehicle-label{font-size:14px;font-weight:700;color:var(--ink)}
    .vehicle-sub{font-size:11px;color:var(--mute);margin-top:1px}
    .id-upload-area{border:2px dashed var(--mute2);border-radius:var(--r);padding:20px;text-align:center;cursor:pointer;background:var(--lite);transition:border-color .15s;position:relative;overflow:hidden}
    .id-upload-area input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;font-size:0}
    .id-upload-area.has-photo{border-color:var(--g700);background:var(--lite2)}
    .id-upload-ic{font-size:28px;margin-bottom:6px}
    .id-upload-label{font-size:13px;color:var(--mute);font-weight:600}
    .id-photo-preview{width:100%;max-height:180px;object-fit:cover;border-radius:var(--r-sm);display:none;margin-top:8px}
    .id-photo-preview.on{display:block}
    .pending-body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 20px;gap:12px;text-align:center}
    .pending-ic{font-size:48px;margin-bottom:8px}
    .pending-title{font-size:20px;font-weight:800;color:var(--g800)}
    .pending-sub{font-size:13px;color:var(--mute);line-height:1.6;max-width:280px}
    .reg-step{font-size:11px;color:rgba(255,255,255,.6);font-weight:500}
    .step-dots{display:flex;gap:6px;justify-content:center;margin-top:8px}
    .step-dot{width:6px;height:6px;border-radius:3px;background:rgba(255,255,255,.3)}
    .step-dot.on{background:var(--acc);width:16px}

    /* ── trust tier ─── */
    .tier-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
    .tier-badge.bronze{background:#fef3c7;color:#92400e}
    .tier-badge.silver{background:#f1f5f9;color:#475569}
    .tier-badge.gold{background:#fef9c3;color:#854d0e}
    .tier-badge.platinum{background:#ede9fe;color:#5b21b6}
    .stat-row{display:flex;gap:10px;flex-wrap:wrap}
    .stat-box{flex:1;min-width:80px;background:var(--white);border-radius:var(--r-sm);padding:12px 10px;text-align:center;box-shadow:var(--shadow)}
    .stat-val{font-family:var(--mono);font-size:20px;font-weight:700;color:var(--g800)}
    .stat-lbl{font-size:10px;font-weight:700;color:var(--mute);text-transform:uppercase;letter-spacing:.05em;margin-top:2px}

    .profile-btn{background:rgba(255,255,255,.15);border:none;border-radius:var(--r-sm);width:38px;height:38px;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--white);flex-shrink:0}

    .logout-row{padding:16px;text-align:center}
    .logout-btn{background:none;border:none;font-family:var(--font);font-size:13px;font-weight:600;color:var(--mute);cursor:pointer}
    .logout-btn:active{color:var(--danger)}

    #loading{position:fixed;inset:0;background:var(--g800);display:flex;align-items:center;justify-content:center;z-index:9000;flex-direction:column;gap:16px}
    #loading.off{display:none}
    #loading .logo{font-size:28px;font-weight:900;color:var(--white);letter-spacing:-1px}
    #loading .sub{font-size:12px;color:rgba(255,255,255,.5);font-weight:500}
    #loading .spin-w{width:28px;height:28px;border:3px solid rgba(255,255,255,.2);border-top-color:var(--acc);border-radius:50%;animation:rot .7s linear infinite}
    /* ── Dispatch Manager UI ──────────────────────────── */
    .stat-n{font-family:var(--mono);font-size:20px;font-weight:700;color:var(--white)}
    .stat-l{font-size:10px;color:rgba(255,255,255,.55);font-weight:600;text-transform:uppercase;letter-spacing:.04em;margin-top:2px}
    .dm-home-role{font-size:11px;color:rgba(255,255,255,.5);font-weight:500;margin-top:2px}
    .dm-stat-row{display:flex;gap:10px;margin-top:16px}
    .dm-stat-box{flex:1;background:rgba(255,255,255,.1);border-radius:var(--r-sm);padding:10px 12px;text-align:center}
    .dm-tabs{display:flex;background:var(--white);border-bottom:1px solid var(--lite2);flex-shrink:0}
    .dm-tab-btn{flex:1;height:44px;border:none;background:none;font-family:var(--font);font-size:13px;font-weight:700;color:var(--mute);cursor:pointer;border-bottom:2px solid transparent;transition:all .15s}
    .dm-tab-btn.on{color:var(--g700);border-bottom-color:var(--g700)}
    .dm-body{flex:1;padding:14px;display:flex;flex-direction:column;gap:12px;overflow-y:auto}
    .sm-card{background:var(--white);border-radius:var(--r);padding:14px;box-shadow:var(--shadow);cursor:pointer;border:none;width:100%;text-align:left;font-family:var(--font);display:flex;gap:12px;align-items:flex-start}
    .sm-card:active{transform:scale(.99)}
    .sm-ic{width:42px;height:42px;border-radius:var(--r-sm);background:var(--lite2);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
    .sm-ic.in_transit{background:#FEF3C7}.sm-ic.assigned{background:#DBEAFE}
    .sm-info{flex:1;min-width:0}
    .sm-code{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--g700);letter-spacing:.5px;margin-bottom:2px}
    .sm-parties{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    .sm-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
    .sm-rider{font-size:11px;color:var(--mute);font-weight:600}
    .fleet-card{background:var(--white);border-radius:var(--r);padding:14px;box-shadow:var(--shadow);display:flex;gap:12px;align-items:center}
    .fleet-av{width:42px;height:42px;border-radius:50%;background:var(--lite2);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
    .fleet-name{font-size:14px;font-weight:800;color:var(--ink);margin-bottom:2px}
    .fleet-meta{font-size:12px;color:var(--mute);font-weight:500}
    .note-item{font-size:12px;color:var(--ink2);padding:8px 10px;background:var(--lite);border-radius:var(--r-sm);line-height:1.5}
    .note-meta{font-size:10px;color:var(--mute);margin-top:3px}
    .action-bar{padding:12px 14px 20px;background:var(--white);border-top:1px solid var(--lite2);flex-shrink:0;display:flex;flex-direction:column;gap:8px}
    .dm-modal-back{display:none;position:fixed;inset:0;background:rgba(7,31,23,.55);z-index:500;align-items:flex-end;justify-content:center}
    .dm-modal-back.on{display:flex}
    .dm-modal-sheet{width:100%;max-width:430px;background:var(--white);border-radius:20px 20px 0 0;max-height:80vh;display:flex;flex-direction:column}
    .dm-modal-hdr{padding:16px 16px 10px;border-bottom:1px solid var(--lite2);display:flex;align-items:center;gap:10px;flex-shrink:0}
    .dm-modal-body{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px}
    .dm-modal-foot{padding:12px 16px 20px;border-top:1px solid var(--lite2);flex-shrink:0}
    select.dm-sel{width:100%;height:52px;border-radius:var(--r-sm);border:1.5px solid var(--mute2);background:var(--bg);font-family:var(--font);font-size:15px;font-weight:600;color:var(--ink);padding:0 14px;outline:none;-webkit-appearance:none;appearance:none}
    select.dm-sel:focus{border-color:var(--acc2)}