/* Runner v3.5 approved visual system — mobile-first, Tailwind-inspired utility composition. */
:root{
  --runner-red:#ef233c;--runner-red-dark:#c9182b;--runner-black:#0b0f14;--runner-ink:#151a21;
  --runner-muted:#687386;--runner-line:#e7ebf0;--runner-surface:#fff;--runner-soft:#f5f7fa;
  --runner-radius:22px;--runner-shadow:0 16px 45px rgba(15,23,42,.07);--runner-shadow-sm:0 8px 25px rgba(15,23,42,.06);
  --safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--runner-ink);background:#f8fafc}
button,input,select,textarea{font:inherit}
button,a{touch-action:manipulation}
.btn{border-radius:14px!important;min-height:50px!important;padding:13px 19px!important;font-weight:850!important;letter-spacing:-.01em!important;box-shadow:none!important;transition:transform .16s ease,box-shadow .16s ease,background .16s ease!important}
.btn:hover{transform:translateY(-1px)!important}.btn:active{transform:translateY(0)!important}
.btn:not(.secondary):not(.danger):not(.btn-soft){background:var(--runner-red)!important;color:#fff!important}
.btn.secondary,.btn.btn-soft{background:#fff!important;color:#151a21!important;border:1px solid var(--runner-line)!important}
.btn.danger{background:#11151b!important;color:#fff!important}

/* Public product website */
.public-site{background:#fff;overflow:hidden}
.public-site .public-nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(231,235,240,.9)}
.public-site .public-nav-inner{width:min(1180px,calc(100% - 36px));margin:auto;min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:22px}
.public-site .public-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#111;font-weight:950;letter-spacing:-.04em}
.public-site .public-brand img{width:142px;height:42px;object-fit:contain}
.public-site .public-links{display:flex;align-items:center;gap:26px}.public-site .public-links a{font-size:13px;font-weight:800;color:#566171;text-decoration:none}.public-site .public-links a:hover{color:var(--runner-red)}
.public-site .public-nav-actions{display:flex;gap:9px;align-items:center}.public-site .public-nav-actions .btn{min-height:42px!important;padding:10px 15px!important;font-size:13px!important}
.public-site .public-menu{display:none;width:44px;height:44px;border:1px solid var(--runner-line);border-radius:13px;background:#fff}
.public-hero-v35{position:relative;background:linear-gradient(135deg,#fff 0%,#fff 55%,#fff5f6 100%);padding:76px 0 68px}
.public-hero-v35:after{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:rgba(239,35,60,.06);right:-190px;top:-180px;pointer-events:none}
.public-wrap{width:min(1180px,calc(100% - 36px));margin:auto;position:relative;z-index:1}
.public-hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr);align-items:center;gap:64px}
.public-kicker{display:inline-flex;align-items:center;gap:8px;padding:8px 11px;border-radius:999px;background:#fff0f2;color:#c9182b;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.public-kicker i{width:7px;height:7px;border-radius:50%;background:var(--runner-red);box-shadow:0 0 0 5px rgba(239,35,60,.10)}
.public-hero-v35 h1{font-size:clamp(42px,6vw,74px);line-height:.98;letter-spacing:-.065em;margin:20px 0 20px;font-weight:950;max-width:720px}.public-hero-v35 h1 span{color:var(--runner-red)}
.public-hero-v35 .lead{font-size:clamp(16px,2vw,19px);line-height:1.65;color:#5f6b7a;max-width:650px;margin:0}
.public-hero-actions-v35{display:flex;gap:10px;flex-wrap:wrap;margin:28px 0 22px}.public-hero-actions-v35 .btn{min-height:54px!important}
.public-trust-v35{display:flex;flex-wrap:wrap;gap:18px;color:#667085;font-size:12px;font-weight:800}.public-trust-v35 span{display:flex;align-items:center;gap:7px}.public-trust-v35 b{color:#18a957}
.public-device-stage{position:relative;min-height:530px;display:grid;place-items:center}.public-device-shadow{position:absolute;width:360px;height:100px;border-radius:50%;background:rgba(15,23,42,.13);filter:blur(28px);bottom:40px}
.public-phone{position:relative;width:280px;height:550px;border:9px solid #0d1117;border-radius:42px;background:#f8fafc;box-shadow:0 30px 70px rgba(15,23,42,.24);overflow:hidden;z-index:2}.public-phone:before{content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);width:108px;height:24px;background:#0d1117;border-radius:0 0 17px 17px;z-index:4}
.public-phone-head{height:82px;padding:31px 17px 8px;display:flex;align-items:center;justify-content:space-between;background:#fff}.public-phone-head img{width:102px;height:30px;object-fit:contain}.public-phone-head b{font-size:9px;color:#18a957;background:#eafaf1;border-radius:999px;padding:6px 8px}
.public-phone-body{padding:14px;display:grid;gap:11px}.phone-greeting{font-weight:900;font-size:19px;letter-spacing:-.04em}.phone-sub{font-size:10px;color:#7a8492}.phone-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.phone-action{border-radius:16px;padding:14px 10px;background:#fff;border:1px solid #e8ecf0;box-shadow:var(--runner-shadow-sm);font-size:10px;font-weight:900}.phone-action b{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:#fff0f2;color:var(--runner-red);margin-bottom:8px;font-size:14px}.phone-map{height:184px;border-radius:18px;background:linear-gradient(135deg,#e9edf1,#f8fafc);position:relative;overflow:hidden}.phone-map:before,.phone-map:after{content:"";position:absolute;background:#fff;transform:rotate(-19deg);opacity:.9}.phone-map:before{width:130%;height:9px;left:-20px;top:76px}.phone-map:after{width:9px;height:130%;left:126px;top:-20px}.phone-route{position:absolute;inset:0}.phone-pin{position:absolute;width:22px;height:22px;border:5px solid #fff;border-radius:50%;background:var(--runner-red);box-shadow:0 4px 12px rgba(239,35,60,.35)}.phone-pin.one{left:31%;top:58%}.phone-pin.two{right:22%;top:27%;background:#111827}.phone-driver{position:absolute;left:46%;top:43%;width:29px;height:29px;border-radius:50%;background:#111827;color:#fff;display:grid;place-items:center;font-size:10px;font-weight:900;border:4px solid #fff}
.phone-order{background:#fff;border:1px solid #e8ecf0;border-radius:16px;padding:12px}.phone-order small{display:block;color:#7b8491;font-size:9px}.phone-order b{display:block;font-size:11px;margin-top:4px}.phone-progress{height:6px;border-radius:99px;background:#edf0f3;margin-top:10px;overflow:hidden}.phone-progress span{display:block;width:68%;height:100%;background:var(--runner-red)}
.public-section-v35{padding:88px 0}.public-section-v35.soft{background:#f7f9fb}.public-section-v35.dark{background:#0d1117;color:#fff}.public-section-v35 .section-head-v35{text-align:center;max-width:700px;margin:0 auto 42px}.section-head-v35 .eyebrow{color:var(--runner-red)}.section-head-v35 h2{font-size:clamp(30px,4vw,48px);line-height:1.05;letter-spacing:-.055em;margin:10px 0 12px;font-weight:950}.section-head-v35 p{color:#697586;line-height:1.7;margin:0}.dark .section-head-v35 p{color:#aab3bf}
.public-how-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.how-card{padding:23px;border:1px solid var(--runner-line);border-radius:22px;background:#fff;box-shadow:var(--runner-shadow-sm)}.how-card .num{width:40px;height:40px;border-radius:13px;background:#fff0f2;color:var(--runner-red);display:grid;place-items:center;font-weight:950;margin-bottom:22px}.how-card h3{font-size:17px;margin:0 0 8px}.how-card p{font-size:13px;color:#687386;line-height:1.65;margin:0}
.role-grid-v35{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.role-card-v35{background:#fff;border:1px solid var(--runner-line);border-radius:24px;padding:25px;box-shadow:var(--runner-shadow-sm)}.role-card-v35 .role-icon{width:48px;height:48px;border-radius:15px;background:#fff0f2;color:var(--runner-red);display:grid;place-items:center;font-size:20px}.role-card-v35 h3{font-size:21px;margin:18px 0 8px}.role-card-v35 p{font-size:13px;line-height:1.7;color:#687386;margin:0 0 17px}.role-card-v35 a{font-size:13px;color:#111827;font-weight:900;text-decoration:none}.role-card-v35 a:hover{color:var(--runner-red)}


.public-footer-v35{background:#0b0f14;color:#aab3bf;padding:32px 0}.public-footer-grid{display:flex;justify-content:space-between;gap:20px;align-items:center}.public-footer-brand{display:flex;align-items:center;gap:10px;color:#fff;font-weight:900}.public-footer-brand img{width:115px;height:34px;object-fit:contain}.public-footer-v35 small{font-size:11px}

/* App shell */
.tw-shell{min-height:100vh;background:#f7f9fb}.tw-sidebar{background:#0b0f14!important;border-right:0!important}.tw-brand{padding:20px 18px!important}.tw-logo-plate{border-radius:15px!important;box-shadow:none!important}.tw-user{margin:4px 14px 14px!important;padding:13px!important;border-radius:17px!important;background:rgba(255,255,255,.055)!important;border:1px solid rgba(255,255,255,.06)!important}.tw-nav a{border-radius:13px!important;margin:3px 10px!important;padding:11px 12px!important}.tw-nav a.active{background:#fff!important;color:#101419!important;box-shadow:0 8px 20px rgba(0,0,0,.12)}.tw-nav a.active b{color:var(--runner-red)}.tw-online{border-radius:15px!important;margin:0 14px 16px!important}.tw-content{min-width:0}.tw-topbar{border-bottom:1px solid #e9edf1!important;background:rgba(255,255,255,.9)!important;backdrop-filter:blur(18px)!important}.tw-main{max-width:1440px!important;margin:auto!important}
.tw-page-context strong{font-weight:950!important;letter-spacing:-.04em}.tw-icon-button{border-radius:14px!important;border:1px solid #e7ebf0!important;background:#fff!important}.tw-wallet{border-radius:18px!important;background:linear-gradient(135deg,#ef233c,#c9182b)!important;box-shadow:0 12px 30px rgba(239,35,60,.2)!important}.tw-wallet *{color:#fff!important}.tw-role-switcher{padding:0 14px 14px!important}.role-pill{border-radius:999px!important;padding:7px 10px!important;border:1px solid rgba(255,255,255,.12)!important;background:rgba(255,255,255,.05)!important}.role-pill.active{background:#fff!important;color:#111!important}
.tw-main .card,.tw-main .metric,.tw-main .job-card,.tw-main .order-card,.tw-main .product-card,.tw-main .new-delivery-card,.tw-main .history-card,.tw-main .review-pending-card,.tw-main .ticket-card,.tw-main .tool-card{box-shadow:var(--runner-shadow)!important;border:1px solid #e7ebf0!important;background:#fff!important}
.tw-main .metric{border-radius:20px!important}.tw-main .metric strong{font-weight:950!important}.tw-main .quick>a{border:1px solid #e7ebf0!important;box-shadow:var(--runner-shadow-sm)!important;border-radius:19px!important;background:#fff!important}.tw-main .quick>a:first-child{border-color:#ffd6db!important;background:linear-gradient(180deg,#fff,#fff7f8)!important}.tw-main .quick>a:hover{transform:translateY(-2px)}
.tw-main input,.tw-main select,.tw-main textarea{border:1px solid #dfe5eb!important;border-radius:14px!important;background:#fff!important}.tw-main input:focus,.tw-main select:focus,.tw-main textarea:focus{border-color:#ef233c!important;box-shadow:0 0 0 4px rgba(239,35,60,.09)!important;outline:none!important}

/* Admin */
body.admin-page{background:#f5f7fa!important}.admin-shell{background:#f5f7fa!important}.admin-sidebar{background:#0b0f14!important}.admin-topbar{background:rgba(255,255,255,.92)!important;border-bottom:1px solid #e7ebf0!important}.admin-container{max-width:1480px!important}.metric-card,.admin-container .card,.admin-container .table-wrap,.admin-map-shell{border-radius:22px!important;border:1px solid #e5eaf0!important;box-shadow:var(--runner-shadow-sm)!important;background:#fff!important}.metric-card strong{font-weight:950!important}.admin-page-head h1{font-weight:950!important;letter-spacing:-.05em!important}.admin-page .btn{border-radius:13px!important}

@media(max-width:1020px){.public-links{display:none!important}.public-menu{display:block!important}.public-hero-grid{grid-template-columns:1fr;gap:28px}.public-device-stage{min-height:500px}.public-how-grid{grid-template-columns:1fr 1fr}.role-grid-v35{grid-template-columns:1fr}.public-section-v35{padding:70px 0}}
@media(max-width:767px){
 .public-site .public-nav-inner,.public-wrap{width:min(100% - 24px,1180px)}.public-site .public-nav-inner{min-height:64px}.public-site .public-brand img{width:116px;height:36px}.public-nav-actions .btn.secondary{display:none}.public-hero-v35{padding:48px 0 35px}.public-hero-v35 h1{font-size:43px}.public-hero-v35 .lead{font-size:15px}.public-hero-actions-v35{display:grid;grid-template-columns:1fr}.public-trust-v35{gap:9px 13px;font-size:11px}.public-device-stage{min-height:480px}.public-phone{width:255px;height:500px}.public-how-grid{grid-template-columns:1fr}.role-grid-v35{grid-template-columns:1fr}.public-section-v35{padding:58px 0}.section-head-v35{margin-bottom:28px!important}.section-head-v35 h2{font-size:32px}.public-footer-grid{display:grid;justify-content:stretch}.tw-main{padding-bottom:calc(96px + var(--safe-bottom))!important}.tw-topbar{padding-top:var(--safe-top)!important;height:calc(70px + var(--safe-top))!important}.tw-main .page-title{font-size:30px!important}.tw-main .sub{font-size:14px!important}.tw-main .metrics{grid-template-columns:1fr 1fr!important;gap:10px!important}.tw-main .quick{grid-template-columns:1fr 1fr!important;gap:10px!important}.tw-main .quick>a{min-height:102px!important}.admin-container{padding-left:12px!important;padding-right:12px!important}.admin-page .admin-topbar{padding-top:var(--safe-top)!important;height:calc(68px + var(--safe-top))!important}
}
@media(max-width:390px){.public-hero-v35 h1{font-size:39px}.public-phone{transform:scale(.92)}.public-device-stage{margin-bottom:-25px}.tw-main .quick{grid-template-columns:1fr!important}.tw-main .metrics{grid-template-columns:1fr 1fr!important}.tw-top-actions .tw-avatar{display:none!important}}
@media(min-width:768px){.tw-main{padding-bottom:38px!important}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}



/* V4.1.19 — public website launch splash */
.public-splash{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;background:#ffffff;transition:opacity .32s ease,visibility .32s ease;}
.public-splash.is-hidden{opacity:0;visibility:hidden;pointer-events:none;}
.public-splash-inner{text-align:center;padding:24px;}
.public-splash-inner img{display:block;width:min(360px,76vw);height:auto;max-height:120px;object-fit:contain;margin:0 auto 18px;}
.public-splash-inner .splash-kicker{color:#344054;font-size:10px;font-weight:850;letter-spacing:.16em;text-transform:uppercase;}
.public-splash-spinner{width:30px;height:30px;border:3px solid rgba(15,23,42,.10);border-top-color:#ef233c;border-radius:50%;margin:18px auto 0;animation:runnerSplashSpin .8s linear infinite;}
@keyframes runnerSplashSpin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.public-splash{transition:none}.public-splash-spinner{animation:none;}}


/* SwiftRunner V4.3.15: accessible dark theme + mobile scroll/navigation */
html,body{max-width:100%;overflow-x:clip}
body{padding-bottom:env(safe-area-inset-bottom,0)!important}
@media(max-width:767px){
  .bottom-nav,.bottom-navigation,.mobile-bottom-nav,.app-bottom-nav,.tw-bottom-nav,
  nav[aria-label="Bottom navigation"],[data-bottom-nav],.bottom-tabs,.fixed-bottom-nav{
    display:none!important;visibility:hidden!important;pointer-events:none!important
  }
  main,.container,.admin-container,.tw-content,.admin-workspace{
    padding-bottom:max(16px,env(safe-area-inset-bottom,0px))!important
  }
  .admin-sidebar,.tw-sidebar{overscroll-behavior:contain}
}
/* Dark mode: explicitly set readable foreground/background pairs instead of relying
   on inherited colors from the light theme. */
html.runner-dark,body.runner-dark,body[data-runner-theme="dark"]{
  color-scheme:dark;background:#0b1118!important;color:#f1f5f9!important
}
body.runner-dark main,body.runner-dark .container,body.runner-dark .card,
body.runner-dark .metric-card,body.runner-dark .metric,body.runner-dark .dashboard-hero,
body.runner-dark .admin-chart-card,body.runner-dark .admin-focus-card,
body[data-runner-theme="dark"] main,body[data-runner-theme="dark"] .container,
body[data-runner-theme="dark"] .card,body[data-runner-theme="dark"] .metric-card,
body[data-runner-theme="dark"] .metric,body[data-runner-theme="dark"] .dashboard-hero,
body[data-runner-theme="dark"] .admin-chart-card,body[data-runner-theme="dark"] .admin-focus-card{
  background-color:#111b26!important;color:#f1f5f9!important;border-color:#334155!important
}
body.runner-dark h1,body.runner-dark h2,body.runner-dark h3,body.runner-dark h4,
body.runner-dark p,body.runner-dark label,body.runner-dark li,body.runner-dark strong,
body.runner-dark b,body.runner-dark .section-head,body.runner-dark .metric small,
body[data-runner-theme="dark"] h1,body[data-runner-theme="dark"] h2,
body[data-runner-theme="dark"] h3,body[data-runner-theme="dark"] h4,
body[data-runner-theme="dark"] p,body[data-runner-theme="dark"] label,
body[data-runner-theme="dark"] li,body[data-runner-theme="dark"] strong,
body[data-runner-theme="dark"] b,body[data-runner-theme="dark"] .section-head,
body[data-runner-theme="dark"] .metric small{color:#f1f5f9}
body.runner-dark small,body.runner-dark .muted,body.runner-dark .eyebrow,
body.runner-dark .trend,body[data-runner-theme="dark"] small,
body[data-runner-theme="dark"] .muted,body[data-runner-theme="dark"] .eyebrow,
body[data-runner-theme="dark"] .trend{color:#b8c4d3!important}
body.runner-dark input,body.runner-dark select,body.runner-dark textarea,
body[data-runner-theme="dark"] input,body[data-runner-theme="dark"] select,
body[data-runner-theme="dark"] textarea{background:#0b1118!important;color:#f8fafc!important;border-color:#475569!important}
body.runner-dark a:not(.btn):not(.admin-sidebar-nav a),
body[data-runner-theme="dark"] a:not(.btn):not(.admin-sidebar-nav a){color:#fca5a5}
body.runner-dark .admin-topbar,body[data-runner-theme="dark"] .admin-topbar{
 background:#111b26!important;color:#f8fafc!important;border-color:#334155!important
}

