:root { color-scheme: light; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:#17212b; background:#f5f7fa; --blue:#0758a8; --gold:#b59138; --line:#d9e1e9; }
* { box-sizing:border-box; }
body { margin:0; padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }
button,input,select,textarea { font:inherit; }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; touch-action:manipulation; }
button:disabled { opacity:.55; cursor:default; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #e1b951; outline-offset:3px; }
.brand { display:flex; align-items:center; gap:18px; padding:20px max(18px,calc((100% - 720px)/2)); background:white; border-bottom:3px solid var(--gold); }
.brand img { width:120px; height:auto; display:block; object-fit:contain; }
.brand strong { display:block; font-size:1.35rem; line-height:1.2; }
.brand span { display:block; margin-top:5px; font-size:.84rem; color:#536173; }
.connection { padding:10px 18px; text-align:center; font-size:.85rem; background:#e9f2fa; color:#184b7d; }
.connection.offline { background:#fff4da; color:#76540c; }
.notice { margin:14px auto; max-width:720px; padding:14px 18px; border-radius:10px; background:#e6f4eb; border:1px solid #a9d7bc; line-height:1.5; }
.notice.error,.error-box { background:#fff0ef; border:1px solid #e7b8b3; color:#8b2620; }
.notice.warning { background:#fff7e7; border-color:#e2c778; color:#735414; }
.notice button { margin:6px; }
.navigation { display:grid; grid-template-columns:repeat(4,1fr); gap:5px; max-width:720px; margin:16px auto 0; padding:0 12px; }
.navigation button { min-height:48px; padding:9px 5px; border:1px solid transparent; background:transparent; border-radius:8px; font-weight:600; color:#5a6674; font-size:.88rem; }
.navigation button.active { color:var(--blue); border-color:#bed5ec; background:white; }
.navigation span:not(:empty) { display:inline-block; margin-left:3px; min-width:19px; border-radius:20px; color:white; background:var(--blue); font-size:.75rem; padding:2px 5px; }
main { max-width:720px; margin:0 auto; padding:24px 18px 40px; min-height:60vh; }
h1 { font-size:1.65rem; margin:0 0 8px; letter-spacing:-.02em; }
h2 { margin:0 0 17px; font-size:1.12rem; }
h3 { margin:0 0 12px; font-size:1.02rem; }
p { line-height:1.5; }
.intro { margin:0 0 22px; color:#586575; font-size:.92rem; }
.section,.card { padding:22px; margin:18px 0; background:white; border:1px solid var(--line); border-radius:14px; }
.section-title { display:flex; align-items:center; gap:10px; }
.section-number { display:inline-flex; align-items:center; justify-content:center; width:25px; height:25px; border-radius:50%; color:var(--blue); background:#ebf3fb; font-size:.8rem; }
.field { margin:18px 0; }
.field:last-child { margin-bottom:0; }
label,.label { display:block; font-size:.93rem; font-weight:600; margin:0 0 8px; line-height:1.4; }
.required { color:var(--blue); }
input:not([type=checkbox]),select,textarea { width:100%; min-height:49px; border:1px solid #b7c4d1; border-radius:8px; background:white; color:#17212b; padding:12px; }
input:disabled,select:disabled { background:#f4f6f8; color:#647384; }
textarea { min-height:115px; resize:vertical; }
.form-fieldset { border:0; padding:0; margin:0; min-width:0; }
.review-job-heading { margin-top:24px; }
.scope-pdf { display:inline-block; text-decoration:none; }
.help,.muted { color:#637180; font-size:.84rem; line-height:1.5; }
.help { margin:6px 0 0; }
.not-provided { display:flex; align-items:center; gap:9px; font-size:.82rem; font-weight:400; color:#5e6c7b; margin:10px 0 0; }
input[type=checkbox] { width:22px; height:22px; flex-shrink:0; accent-color:var(--blue); }
.choices { display:flex; gap:8px; flex-wrap:wrap; }
.choice { margin:0; display:flex; align-items:center; gap:9px; min-height:48px; padding:10px 14px; border:1px solid var(--line); border-radius:8px; background:#fff; font-weight:500; }
.primary,.secondary,.danger,.link-button { min-height:48px; border-radius:8px; padding:12px 18px; font-weight:600; }
.primary { background:var(--blue); color:white; border:1px solid var(--blue); }
.secondary { background:white; color:var(--blue); border:1px solid #aac3db; }
.danger { background:white; color:#a72b24; border:1px solid #dab8b5; }
.link-button { background:transparent; color:var(--blue); border:0; padding:12px 4px; }
.wide { width:100%; }
.actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
.actions > * { flex:1; }
.job-type { border-left:3px solid var(--gold); border-radius:10px; margin:15px 0; padding:16px; background:#f8fafc; border-top:1px solid var(--line); border-bottom:1px solid var(--line); border-right:1px solid var(--line); }
.job-type-head { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; }
.job-type-head h3 { margin:0; }
.reorder { display:flex; gap:6px; }
.reorder button { min-width:44px; min-height:44px; border:1px solid #c8d2dd; border-radius:7px; background:white; color:#35516d; }
.two-fields { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.badge { display:inline-block; border-radius:6px; background:#e9f2fa; color:#0758a8; padding:6px 9px; font-size:.76rem; line-height:1.4; font-weight:600; }
.badge.queued { color:#76540c; background:#fff3d5; }
.badge.received { color:#2e6443; background:#e8f4eb; }
.save-line { min-height:24px; color:#5c6d7d; font-size:.82rem; margin:12px 0 0; }
.save-line.error { color:#a12d27; }
.job-list .card { margin:12px 0; }
.job-list h2 { margin:0 0 8px; }
.job-list p { margin:8px 0; }
.job-list .secondary { margin-top:12px; }
.card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:14px; }
.reference { font-variant-numeric:tabular-nums; font-size:.85rem; color:#5b6a7a; overflow-wrap:anywhere; }
.empty { padding:36px 22px; background:white; border:1px dashed #b8c7d6; border-radius:12px; text-align:center; color:#5c6d7d; }
.review-grid { margin:0; }
.review-grid dt { color:#647181; font-size:.83rem; margin-top:14px; }
.review-grid dd { margin:4px 0 0; white-space:pre-wrap; overflow-wrap:anywhere; font-size:.95rem; }
.review-grid dd.unknown { color:#865f15; }
.error-box { padding:14px 18px; margin:18px 0; border-radius:9px; line-height:1.5; }
.error-box ul { margin:6px 0; padding-left:20px; }
.install { border-color:#d8c17f; background:#fffdf6; }
.install ol { line-height:1.65; padding-left:24px; font-size:.9rem; }
details { margin:16px 0; }
summary { cursor:pointer; min-height:44px; padding:10px 0; font-weight:600; }
.timeline { padding-left:22px; list-style:none; border-left:2px solid #d3dfec; }
.timeline li { position:relative; margin:18px 0; }
.timeline li::before { content:""; position:absolute; left:-29px; top:5px; width:12px; height:12px; border-radius:50%; background:var(--blue); border:2px solid white; }
.timeline time { display:block; color:#637180; font-size:.8rem; margin-top:5px; }
.scope ul { padding-left:21px; line-height:1.65; }
.scope-version { border-top:1px solid var(--line); padding-top:16px; margin-top:16px; }
.scope-option { background:#fff6df; color:#7b5b14; font-size:.78rem; padding:5px 8px; border-radius:5px; display:inline-block; margin-bottom:8px; }
.message { border-left:3px solid #b7cce1; padding:4px 0 4px 14px; margin:18px 0; white-space:pre-wrap; overflow-wrap:anywhere; }
.message strong { display:block; font-size:.84rem; margin-bottom:5px; }
.message time { display:block; margin-top:5px; color:#637180; font-size:.78rem; }
.loading { padding:48px 18px; text-align:center; color:#637180; }
.skip-link { position:absolute; top:-100px; left:12px; background:white; color:var(--blue); padding:12px; z-index:5; }
.skip-link:focus { top:10px; }
footer { max-width:720px; margin:0 auto; padding:22px 18px; border-top:1px solid var(--line); color:#637180; font-size:.8rem; line-height:1.6; }
footer span { display:block; }
[hidden] { display:none !important; }
@media (max-width:430px) { .brand { gap:12px; padding:16px 18px; } .brand img { width:96px; } .brand strong { font-size:1.16rem; } .section,.card { padding:18px; } .two-fields { grid-template-columns:1fr; gap:0; } .actions { flex-direction:column; } main { padding-top:22px; } }
@media (prefers-reduced-motion:no-preference) { button { transition:background .12s ease; } }
 .job-photo {display:block;max-width:100%;max-height:360px;object-fit:contain;border-radius:8px}

body:has(.login-tools) { background:#fff; color:#111; }
.connection::before { content:""; display:inline-block; width:10px; height:10px; border-radius:50%; margin-right:8px; background:#7b8490; }
.connection[data-state="ready"]::before { background:#16803c; }
.connection[data-state="busy"]::before { background:#d87800; }
.connection[data-state="error"]::before { background:#c52c2c; }
.login-sync,.login-tools { margin:18px 0; }
.login-tools>button,.install-buttons>button { margin-bottom:12px; min-height:48px; }
.version-line { overflow-wrap:anywhere; font-size:.75rem; }
#install-help:not(:empty),#share-link:not(:empty) { margin-top:18px; padding:18px; border:1px solid var(--line); border-radius:12px; }
#install-help li { margin:12px 0; line-height:1.5; }

.office-status {font-weight:700;margin:8px 0;}
.office-status::before {content:"";display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:8px;}
.confirmed::before {background:#16854b;}
.unconfirmed::before {background:#be3030;}
.scope li,.scope h3 {white-space:pre-wrap;overflow-wrap:anywhere;}