:root{--bg:#0f1220;--card:#171b2e;--ink:#f4f5fb;--mute:#a7adc6;--line:#2a3050;--brand:#ffcc00;--brand-ink:#1a1400;--ok:#1fc46b;--bad:#ff5a5f;--blue:#4b8bff}
*{box-sizing:border-box}html,body{margin:0}body{font:16px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--ink);min-height:100vh;-webkit-text-size-adjust:100%}
.wrap{max-width:560px;margin:0 auto;padding:16px 16px 40px}
header.top{display:flex;align-items:center;gap:10px;padding:6px 0 14px}
.logo{width:40px;height:40px;border-radius:12px;background:var(--brand);color:var(--brand-ink);display:grid;place-items:center;font-weight:900;font-size:20px}
.brand{font-weight:800;font-size:20px;letter-spacing:-.01em}.brand small{display:block;font-weight:500;font-size:13px;color:var(--mute)}
h1{font-size:26px;line-height:1.15;margin:4px 0 6px;letter-spacing:-.02em}h2{font-size:19px;margin:0 0 10px}
p.lead{color:var(--mute);margin:0 0 16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px;margin:0 0 14px}
label{display:block;font-weight:600;font-size:14px;margin:12px 0 6px}label:first-child{margin-top:0}
input,textarea,select{width:100%;font:inherit;color:var(--ink);background:#0c0f1c;border:1px solid var(--line);border-radius:12px;padding:13px 12px;min-height:48px}
textarea{min-height:70px;resize:vertical}
input:focus,textarea:focus,select:focus,button:focus-visible,a:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.row{display:flex;gap:10px}.row>*{flex:1}
.seg{display:flex;gap:8px}.seg button{flex:1}
button,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-weight:700;border:0;border-radius:14px;min-height:50px;padding:12px 16px;cursor:pointer;text-decoration:none;color:var(--ink);background:#2a3050;width:100%}
.btn-brand{background:var(--brand);color:var(--brand-ink)}.btn-ok{background:var(--ok);color:#04220f}.btn-bad{background:transparent;color:var(--bad);border:1.5px solid var(--bad)}.btn-wa{background:#25d366;color:#052e14}
.btn-ghost{background:transparent;border:1.5px solid var(--line)}
.seg button[aria-pressed=true]{background:var(--brand);color:var(--brand-ink)}
button[disabled]{opacity:.5;cursor:default}
.mute{color:var(--mute)}.small{font-size:13px}.center{text-align:center}
.err{color:var(--bad);font-weight:600;margin:10px 0 0;min-height:1em}
footer.legal{margin-top:22px;padding-top:14px;border-top:1px solid var(--line);color:var(--mute);font-size:13px;text-align:center}
.status-hero{text-align:center;padding:26px 16px}
.spinner{width:58px;height:58px;border-radius:50%;border:6px solid #2a3050;border-top-color:var(--brand);margin:6px auto 16px;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.big{font-size:24px;font-weight:800;margin:0 0 4px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;margin:10px 0 0}.kv dt{color:var(--mute)}.kv dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.reg{display:inline-block;background:#fff;color:#111;border:2px solid #111;border-radius:6px;padding:1px 8px;font-weight:800;letter-spacing:.06em}
.pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;background:#2a3050}
.pill.open{background:var(--brand);color:var(--brand-ink)}.pill.accepted{background:var(--blue)}.pill.arrived{background:#9b5cff}.pill.done{background:var(--ok);color:#04220f}.pill.cancelled,.pill.taken{background:#3a3f55;color:#c9cde0}
.steps{display:flex;gap:6px;margin:14px 0 4px}.steps span{flex:1;height:6px;border-radius:4px;background:#2a3050}.steps span.on{background:var(--brand)}
.job{border:2px solid var(--brand);border-radius:18px;padding:14px;margin:0 0 12px;background:#1b1f35;animation:pop .35s ease}
.job.taken,.job.cancelled{border-color:var(--line);opacity:.6}
@keyframes pop{from{transform:scale(.97);opacity:.4}to{transform:none;opacity:1}}
.job .route{font-size:18px;font-weight:700;margin:6px 0}.job .route div{margin:2px 0}
.accept{background:var(--ok);color:#04220f;font-size:22px;min-height:64px;letter-spacing:.04em;margin-top:8px}
.toggle{display:flex;align-items:center;justify-content:space-between;gap:12px}
.switch{width:86px;min-height:46px;border-radius:999px;background:#3a3f55;position:relative;flex:0 0 86px;padding:0}
.switch::after{content:"";position:absolute;top:5px;left:5px;width:36px;height:36px;border-radius:50%;background:#fff;transition:left .2s}
.switch[aria-pressed=true]{background:var(--ok)}.switch[aria-pressed=true]::after{left:45px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.list{display:flex;flex-direction:column;gap:10px}
.item{border:1px solid var(--line);border-radius:14px;padding:12px;background:#12162a}
.h{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.warn{border-color:var(--bad)!important;box-shadow:0 0 0 2px rgba(255,90,95,.25)}
.tabs{display:flex;gap:8px;margin:0 0 14px}.tabs button{min-height:42px}
.hide{display:none!important}
.toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:#fff;color:#111;padding:12px 18px;border-radius:12px;font-weight:700;box-shadow:0 8px 30px rgba(0,0,0,.4);z-index:9}
a{color:#9cc0ff}

.pl-add,.pl-row,.pl-head{display:grid;grid-template-columns:minmax(0,2.2fr) repeat(3,minmax(0,1fr)) auto;gap:6px;align-items:center}
.pl-row{margin:4px 0}.pl-row input,.pl-add input,.pl-row select,.pl-add select{min-height:40px;padding:6px 4px;font-size:14px;min-width:0;width:100%}
.pl-row button,.pl-add button{min-height:40px;padding:0 10px;font-size:14px;width:auto}
.pl-row .sv{background:#2a2a2e}.pl-row .del{background:transparent;color:#ff6b6b;border:1px solid #553}
.pl-g{margin:10px 0 2px;font-weight:700;font-size:13px;color:#a1a1a6;text-transform:uppercase;letter-spacing:.04em}

/* GYT luxury look (Denzil's palette with restraint, 21 Oct 2026): deep purple-navy base, gradient as accent, white text, cyan + lavender */
:root{--bg:#120A24;--card:rgba(255,255,255,.045);--ink:#ffffff;--mute:#b9b2d6;--line:rgba(255,255,255,.08);--brand:#ffffff;--brand-ink:#2A0F4F;--blue:#7FE3FF}
html body,html body button,html body input,html body select,html body textarea{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
html body{background:radial-gradient(120% 40% at 50% 0%,rgba(66,8,79,.55),rgba(66,8,79,0) 60%) no-repeat,linear-gradient(180deg,#120A24,#1A1440) fixed;background-color:#120A24}
html body .card{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.08);border-radius:18px;box-shadow:0 10px 30px rgba(5,2,18,.35)}
html body input,html body textarea,html body select{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.1);color:#fff}
html body input::placeholder,html body textarea::placeholder{color:rgba(255,255,255,.45)}
html body option{color:#1A1440;background:#fff}
html body button,html body .btn{background:rgba(255,255,255,.07);color:#fff;border:1px solid rgba(255,255,255,.08)}
html body .btn-brand,html body .seg button[aria-pressed=true]{background:#fff;color:#2A0F4F;border-color:#fff}
html body .btn-ghost{background:transparent;border-color:rgba(255,255,255,.25)}
html body .btn-bad{background:transparent;color:#ffb8c6;border-color:#ffb8c6}
html body .logo{background:linear-gradient(90deg,#C9B6FF,#7FE3FF);color:#160C33}
html body .pill{background:rgba(255,255,255,.1)}
html body .pill.open{background:#fff;color:#2A0F4F}html body .pill.accepted{background:#7FE3FF;color:#160C33}html body .pill.arrived{background:#C9B6FF;color:#160C33}
html body .item{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.08)}
html body .job{background:rgba(255,255,255,.03);border-color:#C9B6FF}
html body .steps span{background:rgba(255,255,255,.1)}html body .steps span.on{background:#7FE3FF}
html body .spinner{border-color:rgba(255,255,255,.12);border-top-color:#7FE3FF}
html body a{color:#7FE3FF}
html body .err{color:#ffb8c6}
html body .legend span{background:rgba(255,255,255,.06)}
html body .pl-row .sv{background:#fff;color:#2A0F4F}html body .pl-row .del{color:#ffb8c6;border-color:rgba(255,184,198,.4)}
html body .pl-g{color:#C9B6FF}
html body .switch{background:rgba(255,255,255,.16)}html body .switch[aria-pressed=true]{background:#7FE3FF}
html body .dark-tiles{filter:invert(1) hue-rotate(205deg) brightness(.55) contrast(1.1) saturate(.45)}