:root {
    color-scheme: dark;
    --ink: #edeff2;
    --muted: rgba(237, 239, 242, .68);
    --line: rgba(237, 239, 242, .12);
    --accent: #26afc4;
    --accent-hover: #67cfdd;
    --surface: #1f2229;
    --canvas: #181a1f;
    --field: #15181d;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: var(--ink);
    background: var(--canvas);
}

/* Pre-intake conversations: compact queue and direct follow-up actions. */
.page-heading.inquiry-heading { margin-bottom: .6rem; }
.page-heading.inquiry-heading > .muted { margin: 0; }
.inquiry-counts { display: flex; flex-wrap: wrap; gap: .45rem 1.25rem; margin-bottom: .8rem; }
.inquiry-counts a { display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; font-size: .88rem; text-decoration: none; }
.inquiry-counts strong { font-size: 1.15rem; }
.inquiry-due { color: #ffd09d; }
.inquiry-unrecorded { margin: 0 0 1rem; color: var(--muted); font-size: .86rem; }
.inquiry-search { display: flex; align-items: end; flex-wrap: wrap; gap: .7rem; padding: 1rem; border-bottom: 1px solid var(--line); }
.inquiry-search .field { margin: 0; min-width: 0; flex: 1 1 10rem; }
.inquiry-search .inquiry-search-field { flex: 2 1 16rem; }
.inquiry-search .field input, .inquiry-search .field select { min-height: 44px; }
.inquiry-view-options { border-bottom: 1px solid var(--line); }
.inquiry-view-options > summary { cursor: pointer; padding: .65rem 1rem; min-height: 44px; font-weight: 700; font-size: .88rem; }
.inquiry-view-options > summary span { margin-left: .4rem; font-weight: 400; font-size: .8rem; color: var(--muted); }
.inquiry-options-form { border-bottom: 0; }
.inquiry-queue table { table-layout: fixed; }
.inquiry-queue th:first-child { width: 34%; }
.inquiry-queue th:nth-child(2) { width: 38%; }
.inquiry-queue td { vertical-align: top; overflow-wrap: anywhere; padding: .85rem 1rem; }
.inquiry-device { display: block; font-weight: 700; margin: .15rem 0; }
.inquiry-issue { display: block; font-size: .84rem; color: var(--muted); margin: .2rem 0; }
.inquiry-status { font-size: .84rem; font-weight: 750; color: #c9f3f8; }
.inquiry-note, .inquiry-next p { margin: .3rem 0 .5rem; font-size: .88rem; }
.inquiry-queue time { display: inline-block; white-space: nowrap; }
.inquiry-overview { padding: 1.25rem; margin-bottom: .8rem; overflow-wrap: anywhere; }
.inquiry-overview h1 { margin: .3rem 0; font-size: clamp(1.4rem, 3vw, 2rem); line-height: 1.2; }
.inquiry-contact-details { display: flex; flex-wrap: wrap; gap: .4rem 1rem; font-size: .9rem; }
.inquiry-contact-details a { overflow-wrap: anywhere; }
.inquiry-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem 1.4rem; margin-block: 1rem; }
.inquiry-facts dt { color: var(--muted); font-size: .78rem; font-weight: 700; margin-bottom: .2rem; }
.inquiry-facts dd { margin: 0; font-size: .92rem; }
.inquiry-overview .inquiry-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; margin: .85rem 0 1rem; padding: 0; border: 0; }
.inquiry-actions > a:last-child { min-height: 44px; display: inline-flex; align-items: center; }
.inquiry-editor { margin-bottom: .65rem; scroll-margin-top: 1rem; }
.inquiry-editor > summary { cursor: pointer; padding: .85rem 1.1rem; min-height: 44px; font-weight: 750; }
.inquiry-editor form { padding: .2rem 1.1rem 1.1rem; }
.inquiry-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem 1rem; }
.inquiry-form-grid .field { margin: .25rem 0; min-width: 0; }
.inquiry-form-grid .field:has(textarea) { grid-column: 1 / -1; }
.inquiry-history, .inquiry-source { margin-top: 1rem; overflow-wrap: anywhere; }
.inquiry-event { padding: .75rem 0; border-bottom: 1px solid var(--line); }
.inquiry-event:last-child { border-bottom: 0; }
.inquiry-event p { margin: .25rem 0; }
.inquiry-source summary { cursor: pointer; min-height: 44px; font-weight: 700; }
@media (max-width: 750px) {
    .inquiry-heading { align-items: flex-start; gap: .5rem; }
    .inquiry-heading > .muted { font-size: .83rem; max-width: 18rem; }
    .inquiry-search { flex-wrap: nowrap; gap: .6rem; padding: .8rem; }
    .inquiry-options-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .inquiry-options-form .button { grid-column: 1 / -1; justify-self: end; }
    .inquiry-queue table, .inquiry-queue tbody { display: block; }
    .inquiry-queue tbody tr { display: block; padding: .85rem; }
    .inquiry-queue tbody td { display: block; padding: 0; }
    .inquiry-queue tbody td::before { display: none; }
    .inquiry-queue .inquiry-conversation, .inquiry-queue .inquiry-next { margin-top: .6rem; }
    .inquiry-queue .inquiry-next .button { margin-top: .2rem; }
    .inquiry-form-grid { grid-template-columns: 1fr; }
    .inquiry-facts { grid-template-columns: 1fr; gap: .7rem; }
    .inquiry-overview { padding: 1rem; }
}
@media (max-width: 440px) {
    .page-heading.inquiry-heading { display: block; }
    .inquiry-heading > .muted { max-width: none; }
    .inquiry-counts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
    .inquiry-counts a { display: block; font-size: .75rem; }
    .inquiry-counts strong { display: block; font-size: 1.1rem; }
    .inquiry-actions .button { flex: 1 1 10rem; }
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(ellipse at 50% -120px, #1d3037 0, var(--canvas) 510px); }
[hidden] { display: none !important; }
a { color: var(--accent); }
a:hover { color: var(--accent-hover); }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 3px solid var(--accent-hover); outline-offset: 2px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.shell { width: min(100% - 2.5rem, 1120px); margin-inline: auto; }
.site-header { background: #15181d; border-bottom: 1px solid var(--line); }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 76px; }
.brand { display: inline-flex; align-items: center; gap: .65rem; color: var(--ink); text-decoration: none; white-space: nowrap; }
.brand:hover { color: var(--ink); }
.brand img { display: block; width: 170px; height: auto; max-height: 52px; }
.brand-app { border-left: 1px solid var(--line); padding-left: .65rem; color: var(--accent); font-size: .86rem; font-weight: 800; letter-spacing: .12em; }
.site-header nav { display: flex; align-items: center; flex-wrap: wrap; gap: .35rem; }
.site-header nav a, .site-header nav button { display: inline-flex; align-items: center; min-height: 40px; padding: .45rem .8rem; border-radius: 7px; color: var(--muted); text-decoration: none; font-size: .9rem; font-weight: 650; }
.site-header nav a:hover, .site-header nav button:hover, .site-header nav [aria-current="page"] { color: var(--ink); background: #2a3038; }
.site-header nav button { border: 0; background: none; }
.site-header .nav-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 1.45rem; padding: .1rem .4rem; margin-left: .45rem; border-radius: 99px; background: #f4d39d; color: #181a1f; font-size: .75rem; font-weight: 800; line-height: 1.2; }

.page { padding-top: 2.4rem; padding-bottom: calc(4rem + env(safe-area-inset-bottom, 0px)); }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.75rem; }
.page-heading h1 { margin: .1rem 0 .35rem; font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.15; letter-spacing: -.035em; }
.eyebrow { margin: 0; color: var(--accent); font-size: .75rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.muted { color: var(--muted); margin: .4rem 0 0; }
.back-link { display: inline-block; margin-bottom: 1.5rem; font-weight: 650; text-decoration: none; }
.back-link:hover { text-decoration: underline; }

.panel { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 12px 30px rgb(0 0 0 / 12%); }
.panel h2 { margin: 0 0 1.1rem; font-size: 1.2rem; letter-spacing: -.02em; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .6rem 1.05rem; border: 1px solid transparent; border-radius: 8px; font-weight: 700; font-size: .9rem; text-decoration: none; text-align: center; }
.button-primary { background: var(--accent); color: #0d1215; }
.button-primary:hover { background: var(--accent-hover); color: #0d1215; }
.button-quiet { background: #2b3940; color: #b8e9ef; border-color: var(--line); }
.button-quiet:hover { background: #34474e; color: #e8fbfd; }
.list-scopes { display: flex; flex-wrap: wrap; gap: .5rem; padding: 1rem 1rem .25rem; }
.list-scopes a { padding: .45rem .8rem; border: 1px solid var(--line); border-radius: 99px; text-decoration: none; font-weight: 750; font-size: .88rem; }
.list-scopes a:hover, .list-scopes a.selected { background: #27505a; color: #e4faff; border-color: var(--accent); }
.list-scopes .count { margin-left: .25rem; font-size: .78rem; }
.list-filters { display: flex; flex-wrap: wrap; gap: .3rem; padding: .75rem 1rem 0; border-bottom: 1px solid var(--line); }
.list-filters a { padding: .65rem .9rem; border-radius: 8px 8px 0 0; border-bottom: 3px solid transparent; text-decoration: none; font-weight: 700; font-size: .88rem; }
.list-filters a:hover, .list-filters a.selected { background: #263940; color: #c9f3f8; }
.list-filters a.selected { border-bottom-color: var(--accent); }
.list-filters .count { display: inline-block; padding: .05rem .46rem; border-radius: 99px; background: #35464d; margin-left: .2rem; font-size: .78rem; }

.search-bar { display: flex; align-items: center; gap: 1.5rem; padding: 1.25rem; border-bottom: 1px solid var(--line); }
.search-bar label { font-size: .88rem; font-weight: 700; white-space: nowrap; }
.search-controls { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; flex: 1; }
.search-controls input { width: min(100%, 420px); min-width: 0; padding: .55rem .75rem; border: 1px solid #57636b; border-radius: 8px; background: var(--field); color: var(--ink); }
.mobile-sort { display: none; }
.mobile-queue-filters, .job-area-mobile-nav { display: none; }
.queue-alert { margin: 0; padding: .75rem 1.25rem; background: #433c25; color: #fff1cf; font-weight: 700; border-bottom: 1px solid var(--line); }
.queue-alert.has-overdue { background: #572b32; color: #ffe2dc; }
.queue-alert a { color: #fff0d6; }
.table-scroll { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; text-align: left; }
th { background: #252930; color: var(--muted); font-size: .75rem; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; }
th, td { padding: 1rem 1.25rem; border-bottom: 1px solid var(--line); }
th[aria-sort]:not([aria-sort="none"]) { color: var(--ink); }
.sort-link { display: inline-flex; align-items: center; gap: .3rem; color: inherit; text-decoration: none; white-space: nowrap; }
.sort-link:hover { color: var(--accent-hover); }
.sort-link span { display: inline-block; width: 1em; color: var(--accent-hover); font-size: 1.1rem; line-height: 1; }
tr:last-child td { border-bottom: 0; }
tbody tr:hover, tbody tr:focus-within { background: #262e34; }
td { overflow-wrap: anywhere; }
.job-link { font-weight: 750; text-decoration: none; white-space: nowrap; }
.job-link:hover { text-decoration: underline; }
.status { display: inline-block; border: 1px solid rgb(255 255 255 / 25%); border-radius: 99px; padding: .28rem .68rem; background: #35c8de; color: #111820; font-size: .8rem; font-weight: 800; white-space: nowrap; }
.status-intake { background: #67b8ee; }
.status-diagnostic { background: #35c8de; }
.status-quote-draft, .status-draft { background: #cba4ff; }
.status-waiting-for-approval, .status-sent { background: #ffd072; }
.status-approved { background: #4cdbb0; }
.status-declined { background: #ff8186; }
.status-in-repair { background: #ffa35c; }
.status-testing { background: #869cff; }
.status-ready-for-pickup { background: #a9e86c; }
.status-closed { background: #afb8c4; }
.date-cell, .empty-state { color: var(--muted); }
.queue-meta { display: block; margin-top: .22rem; color: var(--muted); font-size: .8rem; }
.queue-meta.is-due { color: #f4d39d; font-weight: 750; }
.target-badge { display: inline-block; border: 1px solid transparent; border-radius: 99px; padding: .25rem .55rem; font-size: .79rem; font-weight: 800; white-space: nowrap; }
.target-overdue { background: #852f3a; border-color: #f77f87; color: #fff1f1; }
.target-today { background: #79501e; border-color: #ffc36d; color: #fff4dc; }
.target-soon { background: #615825; border-color: #e7d778; color: #fff8d9; }
.target-track { background: #185745; border-color: #69d5a6; color: #e4fff3; }
.target-unset, .target-done { background: #343c44; border-color: #7c8b98; color: #edf2f6; }
.date-cell { white-space: nowrap; }
.empty-state { text-align: center; padding: 3rem 1rem; }
.pagination { display: flex; justify-content: center; align-items: center; gap: 1.25rem; padding: 1.1rem; color: var(--muted); border-top: 1px solid var(--line); }
.pagination a { font-weight: 700; }

.detail-grid { display: grid; grid-template-columns: minmax(270px, .9fr) minmax(0, 1.4fr); align-items: start; gap: 1.25rem; }
.detail-panel, .form-panel { padding: clamp(1.25rem, 3vw, 2rem); }
.inquiry-context { margin-bottom: 1.25rem; }
.workflow-panel { padding: clamp(1.25rem, 3vw, 2rem); margin-top: 1.25rem; }
.workflow-panel:first-of-type { margin-top: 0; margin-bottom: 1.25rem; }
.next-step { border-color: #37646b; border-left: 5px solid var(--accent); background: linear-gradient(115deg, #20343a, var(--surface) 65%); }
.next-step .button { margin: .55rem .5rem 0 0; }
.workflow-panel h2 { margin-bottom: .65rem; }
.workflow-panel h3 { margin: 1.3rem 0 .5rem; font-size: 1rem; }
.workflow-panel form { margin-top: 1rem; }
.workflow-panel > .button { margin-top: 1rem; }
.job-disclosure > summary { display: flex; align-items: center; gap: .8rem; cursor: pointer; list-style: none; scroll-margin-top: 1.5rem; }
.job-disclosure > summary::-webkit-details-marker { display: none; }
.job-disclosure > summary::after { content: '+'; display: grid; place-items: center; flex: 0 0 1.6rem; height: 1.6rem; margin-left: auto; border: 1px solid var(--line); border-radius: 6px; color: var(--accent); font-size: 1.2rem; line-height: 1; }
.job-disclosure[open] > summary::after { content: '−'; }
.job-disclosure > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.job-disclosure-heading { min-width: 0; }
.job-disclosure-heading .eyebrow { display: block; margin-bottom: .35rem; }
.job-disclosure-title { display: block; font-size: 1.2rem; font-weight: 700; line-height: 1.3; letter-spacing: -.02em; }
.job-disclosure-meta { color: var(--muted); font-size: .9rem; overflow-wrap: anywhere; }
.job-disclosure-content { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.job-disclosure-content > .button:first-child { margin-bottom: .5rem; }
.job-disclosure-content > .event-list { margin: -.5rem 0 0; }
.section-heading { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 1rem; }
.action-plan { margin: 0 0 1.25rem; padding: 1rem 1.25rem; }
.plan-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0 1.5rem; }
.quote-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0 1.5rem; }
.quote-facts div:first-child, .quote-facts div:nth-child(2) { grid-column: 1 / -1; }
.quote-facts .quote-total { grid-column: 1 / -1; margin-top: .5rem; padding: 1rem; border: 1px solid #39747d; border-radius: 9px; background: #21383e; }
.quote-total dd { font-size: 1.3rem; color: #c5f2f6; }
.quote-history { border-top: 1px solid var(--line); padding: .75rem 0; }
.quote-history summary, .event-list summary { color: var(--accent); cursor: pointer; font-weight: 700; }
.quote-history p { overflow-wrap: anywhere; }
.event-list { margin: 0; padding-left: 1.5rem; }
.event-list li { padding: 1rem .25rem; border-top: 1px solid var(--line); overflow-wrap: anywhere; }
.event-meta { display: block; color: var(--muted); font-size: .84rem; }
.event-details { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; background: var(--field); padding: .75rem; border-radius: 7px; }
.multiline { white-space: pre-wrap; overflow-wrap: anywhere; }
.login-panel { width: min(100%, 480px); margin-inline: auto; }
.intake-shell { max-width: 800px; }
.intake-header > a:last-child { color: var(--muted); font-size: .85rem; font-weight: 700; text-decoration: none; }
.intake-intro { margin-bottom: 1.5rem; }
.intake-intro h1, .intake-thanks h1 { margin: .25rem 0 .75rem; font-size: clamp(1.9rem, 5vw, 2.8rem); line-height: 1.15; }
.intake-intro p:last-child { color: var(--muted); max-width: 65ch; }
.intake-section { padding: clamp(1.25rem, 3vw, 2rem); margin-bottom: 1rem; }
.intake-section h2 { margin: 0 0 1.35rem; }
.intake-contact-help { margin: -.4rem 0 1rem; }
.intake-history { border-top: 1px solid var(--line); padding-top: 1.15rem; margin-top: 1.4rem; }
.intake-history h3 { font-size: 1.02rem; margin: 0; }
.intake-history > .help-text { margin: .25rem 0 1.2rem; }
.intake-two-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; }
.intake-two-columns > div { min-width: 0; }
.intake-finish { padding: 1.4rem clamp(.5rem, 3vw, 2rem) 0; }
.intake-finish h2 { font-size: 1.08rem; margin: 0 0 1rem; }
.intake-finish > .field, .intake-finish > div[data-visible-when] { max-width: 460px; }
.intake-form [hidden] { display: none !important; }
.intake-ack { padding: .9rem; border: 1px solid #39747d; border-radius: 9px; background: #20343a; }
.intake-ack label { display: flex; align-items: flex-start; gap: .75rem; cursor: pointer; }
.intake-ack input { flex: none; width: 1.2rem; height: 1.2rem; margin-top: .2rem; accent-color: var(--accent); }
.intake-ack .field-errors { margin: .5rem 0 0 2rem; }
.intake-honey { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.intake-thanks { margin-top: 3rem; }
.intake-thanks .button { margin-top: 1.4rem; }
@media (max-width: 640px) {
    .intake-two-columns { grid-template-columns: 1fr; gap: 0; }
    .intake-finish { padding-inline: .25rem; }
    .intake-header > a:last-child { display: none; }
    .intake-form .form-actions .button { width: 100%; }
}
.remember-device label { display: flex; align-items: flex-start; gap: .65rem; }
.remember-device input[type="checkbox"] { width: 1.2rem; min-width: 1.2rem; min-height: 1.2rem; margin: .1rem 0 0; accent-color: var(--accent); }
.remember-device .help-text { margin: .3rem 0 0 1.85rem; }
.facts { margin: 0; }
.facts div { padding: .85rem 0; border-top: 1px solid var(--line); }
.facts dt { margin-bottom: .2rem; color: var(--muted); font-size: .79rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.facts dd { margin: 0; overflow-wrap: anywhere; }
.minor-details, .edit-disclosure { border-top: 1px solid var(--line); margin-top: 1rem; padding-top: 1rem; }
.minor-details summary, .edit-disclosure summary { color: var(--accent); cursor: pointer; font-weight: 700; }
.minor-details > .facts, .edit-disclosure form { margin-top: 1.15rem; }
.edit-disclosure > summary { display: list-item; }
.edit-disclosure .minor-details { margin: .25rem 0 0; padding: .9rem 0 0; }
.edit-disclosure .minor-details .field:first-of-type { margin-top: 1rem; }
.form-panel > .muted { margin-top: -.65rem; margin-bottom: 1.4rem; }
.required-note { margin: 0 0 1.25rem; color: var(--muted); font-size: .84rem; }
.form-section-title { margin: 1.85rem 0 1rem; padding-top: 1.4rem; border-top: 1px solid var(--line); font-size: 1.05rem; letter-spacing: -.01em; }
.form-section-title:first-of-type { margin-top: .35rem; padding-top: 0; border-top: 0; }
.required { color: #f0a990; }
.field { margin-bottom: 1.2rem; }
.field label { display: block; margin-bottom: .35rem; font-size: .88rem; font-weight: 700; }
.field input, .field textarea, .field select { display: block; width: 100%; min-height: 44px; border: 1px solid #57636b; border-radius: 8px; padding: .6rem .75rem; background: var(--field); color: var(--ink); }
.field textarea { min-height: 100px; resize: vertical; }
.field input:focus, .field textarea:focus, .field select:focus, .search-controls input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgb(38 175 196 / 18%); outline: 0; }
.field input::placeholder, .search-controls input::placeholder, .field textarea::placeholder { color: #9ca5af; }
.field-error input, .field-error textarea, .field-error select { border-color: #f0a18e; }
.field-errors, .form-errors { margin-top: .35rem; color: #ffb19d; font-size: .85rem; }
.field-errors ul, .form-errors ul { margin: 0; padding-left: 1.2rem; }
.help-text { color: var(--muted); font-size: .82rem; }
.quote-preview { display: flex; flex-wrap: wrap; gap: .75rem 2rem; padding: 1rem; margin-top: .5rem; background: #21383e; border: 1px solid #39747d; border-radius: 8px; }
.quote-preview span { display: flex; flex-direction: column; font-size: .84rem; color: var(--muted); }
.quote-preview strong { color: #c5f2f6; font-size: 1.12rem; }
.form-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1.75rem; }
.messages { margin-bottom: 1.5rem; }
.message { margin: 0 0 .5rem; border: 1px solid #397a66; border-radius: 8px; background: #213e35; color: #b4ebd2; padding: .85rem 1rem; font-weight: 650; }
.message-error { border-color: #8d5049; background: #442c2a; color: #ffb8aa; }

.photo-capture { margin-bottom: 1.25rem; }
.photo-capture h2 { margin-top: 0; }
.photo-inputs { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 0 1rem; }
.photo-inputs input[type="file"] { padding: .7rem; height: auto; }
.photo-session[hidden], .camera-panel[hidden], .photo-session [hidden], #photo-manual-save[hidden] { display: none; }
.photo-session-actions { margin-top: .8rem; }
.camera-panel { max-width: 550px; margin-top: 1rem; }
.camera-panel video { display: block; width: 100%; max-height: 70vh; border-radius: 10px; background: #080b0e; object-fit: contain; }
.camera-panel .form-actions { margin-top: .75rem; }
.photo-session-status { margin: 1rem 0 .65rem; color: #b8e9ef; font-weight: 700; }
.photo-upload-queue { display: grid; gap: .5rem; max-height: 440px; overflow-y: auto; }
.photo-upload-item { display: grid; grid-template-columns: 62px minmax(0, 1fr) auto; gap: .7rem; align-items: center; padding: .5rem; border: 1px solid var(--line); border-radius: 8px; background: #191d23; }
.photo-upload-item img { display: block; width: 62px; height: 62px; border-radius: 5px; object-fit: cover; background: #101318; }
.photo-upload-name { display: block; overflow-wrap: anywhere; font-size: .84rem; }
.photo-upload-state { display: block; margin-top: .2rem; font-size: .8rem; color: var(--muted); overflow-wrap: anywhere; }
.photo-upload-item[data-state="saved"] .photo-upload-state { color: #abebca; }
.photo-upload-item[data-state="failed"] .photo-upload-state { color: #ffb19d; }
.photo-upload-item .button { padding: .45rem .65rem; }
.photo-upload-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .3rem; }
.photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 1rem; margin-top: 1rem; }
.photo-grid-recent { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.photo-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #191d23; }
.photo-card img { display: block; width: 100%; height: 175px; object-fit: cover; background: #101318; }
.photo-card video { display: block; width: 100%; aspect-ratio: 16 / 9; max-height: 300px; background: #101318; }
.photo-grid.video-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.photo-grid-recent img { height: 140px; }
.photo-card-info { padding: .75rem; overflow-wrap: anywhere; font-size: .87rem; }
.photo-card-info p { margin: 0 0 .4rem; }
.photo-card-info a, .photo-all-link { font-weight: 700; }
.photo-caption { font-weight: 700; }
.photo-note-form { display: grid; gap: .35rem; margin-bottom: .65rem; }
.photo-note-form label { font-weight: 700; }
.photo-note-form input { width: 100%; min-width: 0; padding: .48rem; color: var(--ink); background: var(--field); border: 1px solid #57636b; border-radius: 6px; }
.photo-note-form .button { justify-self: start; padding: .4rem .65rem; }
.photo-meta { color: var(--muted); font-size: .8rem; }
.photo-all-link { display: inline-block; margin-top: 1rem; }
.share-link-field { margin-top: 1rem; }
.share-link-field input { width: 100%; min-width: 0; padding: .7rem; color: var(--ink); background: var(--field); border: 1px solid #57636b; border-radius: 8px; }
.share-photo-choice { display: inline-flex; align-items: center; gap: .45rem; margin-bottom: .55rem; font-weight: 750; color: #b8e9ef; cursor: pointer; }
.share-photo-choice input { width: 1.15rem; height: 1.15rem; accent-color: var(--accent); }
.photo-stage-heading { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .5rem; margin-top: 1.25rem; }
.photo-stage-heading h3 { margin: 0; }
.photo-stage-heading .button { min-height: 40px; }
.photo-selection-status { margin: 1rem 0 .25rem; font-weight: 700; color: #b8e9ef; }
[data-select-photo-stage][hidden], .photo-selection-status[hidden] { display: none; }
.viewer-list-card { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; }
.viewer-list-card p:not(.eyebrow) { margin: .35rem 0 .75rem; }
.viewer-hero { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; padding: clamp(1.25rem, 3vw, 2rem); border-color: #39747d; background: linear-gradient(115deg, #20343a, var(--surface) 70%); }
.viewer-hero h2 { margin: .25rem 0; font-size: clamp(1.3rem, 2.5vw, 1.7rem); }
.viewer-hero .help-text { margin-bottom: 0; }
.viewer-hero-metrics { display: flex; gap: .7rem; flex: none; }
.viewer-hero-metrics div { display: grid; min-width: 90px; padding: .8rem; border-radius: 9px; background: #171e24; text-align: center; }
.viewer-hero-metrics strong { font-size: 1.4rem; color: #c5f2f6; }
.viewer-hero-metrics span { color: var(--muted); font-size: .75rem; }
.viewer-nav { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 1.5rem; }
.viewer-nav a { padding: .55rem .85rem; border: 1px solid var(--line); border-radius: 99px; background: #263940; color: #c9f3f8; text-decoration: none; font-size: .85rem; font-weight: 700; }
.viewer-nav a:hover { background: #34535b; color: #fff; }
.viewer-section { scroll-margin-top: 1rem; }
.viewer-figures { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; margin-top: 1.2rem; }
.viewer-figures > div { min-width: 0; padding: 1rem; border: 1px solid var(--line); border-radius: 10px; background: #171e24; }
.viewer-figures h3 { margin: 0 0 .75rem; }
.viewer-milestones { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .6rem; padding: 0; list-style: none; }
.viewer-milestones li { padding: .8rem; border-left: 3px solid var(--accent); border-radius: 6px; background: #171e24; }
.viewer-milestones span { display: block; margin-top: .2rem; color: var(--muted); font-size: .8rem; }
.viewer-downloads { margin: .8rem 0 1.4rem; }
.viewer-downloads .button { margin: .2rem .35rem .2rem 0; }
.job-toolbar { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin: -.5rem 0 .5rem; }
.job-toolbar .back-link { display: inline-flex; align-items: center; min-height: 44px; margin: 0; font-size: .85rem; }
.job-actions { position: relative; flex: none; }
.job-actions > summary { display: flex; align-items: center; gap: .5rem; min-height: 44px; padding: .45rem .7rem; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; font-size: .85rem; color: var(--muted); list-style: none; }
.job-actions > summary::-webkit-details-marker { display: none; }
.job-actions > summary::after { content: '+'; color: var(--accent); }
.job-actions[open] > summary::after { content: '−'; }
.job-actions-menu { position: absolute; z-index: 5; right: 0; top: calc(100% + .3rem); width: min(16rem, calc(100vw - 2rem)); padding: .4rem; border: 1px solid #53717a; border-radius: 9px; background: var(--surface); box-shadow: 0 10px 25px #0006; }
.job-actions-menu a { display: flex; align-items: center; min-height: 44px; padding: .5rem .65rem; border-radius: 6px; text-decoration: none; font-size: .88rem; }
.job-actions-menu a:hover { background: #2b3940; }
.job-header { margin-bottom: .85rem; }
.job-heading-line, .job-status-line { display: flex; align-items: center; flex-wrap: wrap; gap: .45rem .8rem; }
.job-header h1 { margin: 0; font-size: 1.6rem; line-height: 1.3; letter-spacing: -.03em; }
.job-status-line { gap: .35rem .55rem; }
.job-workflow-state { color: var(--muted); font-size: .82rem; }
.job-header-device { margin: .35rem 0 0; font-size: 1.1rem; font-weight: 750; overflow-wrap: anywhere; }
.job-header-device span { color: var(--muted); font-size: .85rem; font-weight: 500; }
.job-header-customer { margin: .1rem 0 0; color: var(--muted); overflow-wrap: anywhere; }
.job-return-reference { display: inline-flex; align-items: center; min-height: 44px; font-size: .85rem; }
.job-current-step { padding: 1rem 1.15rem; margin-bottom: .85rem; }
.job-step-heading { display: flex; align-items: center; justify-content: space-between; gap: .75rem 1.5rem; }
.job-step-heading > div { min-width: 0; }
.job-current-step h2 { margin: .15rem 0 0; font-size: 1.1rem; line-height: 1.4; overflow-wrap: anywhere; scroll-margin-top: 1rem; }
.job-step-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: .5rem; flex: 0 1 50%; }
.job-step-actions form { margin: 0; }
.job-step-actions .button { margin: 0; }
.job-step-alternative { width: 100%; }
.job-step-alternative summary { display: flex; align-items: center; min-height: 44px; color: var(--muted); cursor: pointer; font-size: .85rem; }
.job-step-alternative textarea { display: block; width: 100%; margin: .4rem 0; padding: .5rem; color: var(--ink); background: var(--field); border: 1px solid #57636b; border-radius: 6px; }
.job-step-alternative label { font-size: .85rem; }
.job-current-note { margin-top: .6rem; overflow-wrap: anywhere; }
.job-current-note.customer-wait-panel { padding-left: .75rem; }
.job-parts-summary { list-style: none; margin: .8rem 0 0; padding: 0; border-top: 1px solid var(--line); }
.job-parts-summary li { display: flex; justify-content: space-between; align-items: center; gap: .5rem 1.5rem; padding-top: .65rem; overflow-wrap: anywhere; }
.job-parts-summary li > div { min-width: 0; }
.job-part-meta { display: block; color: var(--muted); font-size: .8rem; }
.job-part-arrival { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: .3rem .6rem; font-size: .85rem; }
.job-part-arrival strong { display: inline-block; }
.job-overview-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
.job-overview-grid > :only-child { grid-column: 1 / -1; }
.job-overview, .job-payment-summary { padding: 1rem; min-width: 0; }
.job-overview .section-heading { align-items: center; gap: .5rem; margin-bottom: .75rem; }
.job-overview h2, .job-payment-summary h2 { margin: 0; font-size: 1rem; overflow-wrap: anywhere; }
.job-overview-plan { display: grid; grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); gap: .65rem; margin: 0 0 .85rem; }
.job-overview-plan > div { min-width: 0; padding: .7rem .8rem; border: 1px solid var(--line); border-radius: 8px; background: #171e24; }
.job-overview-plan dt { color: var(--muted); font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.job-overview-plan dd { margin: .2rem 0 0; font-weight: 700; overflow-wrap: anywhere; }
.job-overview-plan .target-badge { margin-left: .3rem; }
.job-overview-meta { display: block; color: var(--muted); font-size: .8rem; }
.job-overview-warning { margin: .6rem 0 0; color: #ffd995; font-weight: 700; }
.job-saved-plan summary { display: flex; align-items: center; min-height: 44px; cursor: pointer; color: var(--muted); font-size: .85rem; }
.job-saved-plan summary::before { content: '+ '; margin-right: .4rem; color: var(--accent); }
.job-saved-plan[open] summary::before { content: '− '; }
.job-plan-assignee { margin: 0; color: var(--muted); font-size: .8rem; }
.job-invoice-link { display: inline-flex; align-items: center; min-height: 44px; font-weight: 650; overflow-wrap: anywhere; }
.job-payment-summary .job-overview-meta { margin: 0; }
.job-payment-amounts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; margin: .75rem 0; }
.job-payment-amounts dt { font-size: .75rem; color: var(--muted); }
.job-payment-amounts dd { margin: .2rem 0 0; font-size: .9rem; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.job-payment-amounts strong { color: #d3f9fb; }
.job-payment-refresh { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: .5rem; padding-top: .65rem; border-top: 1px solid var(--line); }
.job-payment-summary .help-text, .job-payment-summary .job-overview-warning { font-size: .8rem; }
.job-workspace > .detail-panel { margin-top: 1rem; }
.job-tools { display: block; margin: 0 0 1.25rem; }
.job-tools summary { padding: .85rem 1rem; font-weight: 750; color: #c9f3f8; cursor: pointer; }
.job-overview-links, .job-tool-links { display: flex; flex-wrap: wrap; gap: .55rem; }
.job-overview-links { margin-top: .85rem; }
.job-overview-links a { display: inline-flex; align-items: center; min-height: 44px; padding: .55rem .8rem; border: 1px solid var(--line); border-radius: 8px; background: #263940; font-weight: 700; text-decoration: none; }
.job-overview-links a:hover { border-color: var(--accent); }
.job-tool-links { padding: 0 1rem 1rem; }
.job-phase-map { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .45rem; margin: 1rem 0 1.25rem; padding: 0; list-style: none; }
.job-phase-map li { min-width: 0; padding: .65rem .75rem; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--muted); font-size: .81rem; font-weight: 700; }
.job-phase-map .phase-number { display: inline-block; margin-right: .4rem; font-weight: 800; }
.job-phase-map .is-complete { color: #bce7d6; border-color: #356f59; }
.job-phase-map .is-current { color: #d2fbff; border-color: #55c7d7; background: #203b40; }
.job-phase-map .is-skipped { color: var(--muted); border-style: dashed; }
.job-phase-map .is-unverified { color: #ffdfb4; border-color: #9d7856; border-style: dashed; }
.job-phase-map .phase-note { display: block; font-size: .7rem; font-weight: 500; }
.job-area-nav { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; margin: 0 0 1rem; }
.job-area-nav a { display: flex; align-items: center; min-width: 0; min-height: 44px; padding: .5rem .75rem; border: 1px solid #365d65; border-radius: 8px; background: #203138; text-decoration: none; font-size: .85rem; }
.job-area-nav a:hover, .job-area-nav a:focus-visible { border-color: var(--accent); background: #28424a; }
.job-area-nav a[aria-current="page"] { border-color: #55c7d7; background: #284b53; box-shadow: inset 0 -3px 0 var(--accent); }
.job-area-nav strong { display: block; color: #d9f7fb; }
.job-area-nav span { display: block; color: var(--muted); font-size: .8rem; }
.job-area { margin-top: .5rem; }
.job-area-heading { margin-bottom: 1rem; }
.job-area-heading h2 { margin: .1rem 0 0; font-size: 1.4rem; }
.job-area-shortcuts { margin-top: .8rem; }
.job-area-heading h2, .job-area .section-heading h3 { scroll-margin-top: 1.5rem; }
.job-area .section-heading h3 { margin: 0; }
.job-area > .workflow-panel:first-of-type { margin-top: 0; }

@media (max-width: 750px) {
    .job-disclosure > summary { flex-wrap: wrap; gap: .25rem .65rem; }
    .job-disclosure-summary > .job-disclosure-heading, .job-disclosure-summary > .job-disclosure-title { width: calc(100% - 2.25rem); }
    .job-disclosure-meta { order: 1; width: 100%; padding-right: 2.25rem; }
    .job-disclosure > summary::after { order: 0; }
    .page { padding-top: 1.75rem; }
    .page-heading { align-items: flex-start; flex-direction: column; }
    .job-overview-grid { grid-template-columns: minmax(0, 1fr); }
    .job-current-step { padding: .85rem; }
    .job-step-heading { flex-direction: column; align-items: stretch; gap: .6rem; }
    .job-step-actions { justify-content: flex-start; }
    .job-step-actions .button { max-width: 100%; }
    .job-parts-summary li { flex-direction: column; align-items: stretch; gap: .2rem; }
    .job-part-arrival { justify-content: flex-start; }
    .job-heading-line { gap: .3rem .65rem; }
    .job-status-line { flex-wrap: wrap; }
    .job-overview-plan { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .job-phase-map { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .job-phase-map li { padding: .55rem .5rem; }
    .job-area-nav { display: none; }
    .job-area-mobile-nav { display: block; margin-bottom: 1.25rem; }
    .job-area-mobile-nav details { border: 1px solid #55c7d7; border-radius: 9px; background: #203138; }
    .job-area-mobile-nav summary { padding: .7rem .9rem; min-height: 44px; cursor: pointer; font-weight: 750; color: #d9f7fb; }
    .job-area-mobile-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .3rem; padding: 0 .55rem .55rem; }
    .job-area-mobile-links a { display: flex; align-items: center; min-height: 44px; padding: .5rem .6rem; border-radius: 7px; text-decoration: none; font-size: .88rem; font-weight: 650; }
    .job-area-mobile-links a:hover, .job-area-mobile-links a[aria-current="page"] { background: #284b53; color: #e4faff; }
    .workflow-panel h2, .detail-panel h2 { scroll-margin-top: 1.5rem; }
    .photo-grid-recent .photo-card:nth-child(n+3) { display: none; }
    .detail-grid { grid-template-columns: 1fr; }
    .viewer-hero { align-items: flex-start; flex-direction: column; }
    .viewer-hero-metrics { width: 100%; }
    .viewer-hero-metrics div { flex: 1; }
    .workflow-layout .form-panel { order: -1; }
    .search-bar { flex-direction: column; align-items: stretch; gap: .55rem; }
    .table-scroll { overflow-x: visible; }
    table, tbody { display: block; }
    thead { display: none; }
    tbody tr { display: block; padding: .75rem .9rem; border-bottom: 1px solid var(--line); }
    tbody tr:last-child { border-bottom: 0; }
    tbody td { display: grid; grid-template-columns: 6.75rem minmax(0, 1fr); gap: .75rem; padding: .35rem 0; border: 0; }
    tbody td::before { content: attr(data-label); color: var(--muted); font-size: .78rem; font-weight: 750; text-transform: uppercase; letter-spacing: .03em; }
    tbody td.empty-state { display: block; }
    tbody td.empty-state::before { display: none; }
    .date-cell { white-space: normal; }
    .job-queue tbody tr { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .15rem .5rem; padding: .85rem 1rem; }
    .job-queue tbody tr:focus-within { outline: 2px solid var(--accent-hover); outline-offset: -2px; }
    .job-queue tbody tr.queue-empty { display: block; }
    .job-queue tbody td { display: block; min-width: 0; padding: 0; }
    .job-queue tbody td::before { display: none; }
    .job-queue tbody td[data-label="Code"] { grid-column: 1; grid-row: 1; }
    .job-queue tbody td[data-label="Stage"] { grid-column: 2; grid-row: 1; align-self: start; }
    .job-queue tbody td[data-label="Device"] { grid-column: 1 / -1; grid-row: 2; font-weight: 750; }
    .job-queue tbody td[data-label="Customer"] { grid-column: 1 / -1; grid-row: 3; color: var(--muted); font-size: .88rem; }
    .job-queue tbody td[data-label="Service target"] { grid-column: 1 / -1; grid-row: 4; margin-top: .3rem; }
    .job-queue tbody td[data-label="Service target"] .queue-meta { display: inline-block; margin: .1rem .55rem 0 0; }
    .job-queue tbody td[data-label="Next action"] { grid-column: 1 / -1; grid-row: 5; margin-top: .35rem; padding-top: .45rem; border-top: 1px solid var(--line); font-size: .88rem; }


    .job-queue tbody td[data-label="Updated"] { display: none; }

}

@media (max-width: 440px) {
    .shell { width: min(100% - 1.5rem, 1120px); }
    .header-inner { align-items: flex-start; flex-direction: column; justify-content: center; gap: .35rem; padding-block: .65rem; }
    .brand img { width: 150px; }
    .site-header nav { gap: .15rem; }
    .site-header nav a, .site-header nav button { padding-inline: .55rem; }
    .search-controls { flex-wrap: wrap; }
    .search-controls input { width: 100%; flex-basis: 100%; }
    .list-scopes { padding-inline: .55rem; }
    .list-filters { padding-inline: .55rem; }
    .list-filters a { padding: .6rem .55rem; }
    .photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
    .photo-card img { height: 130px; }
    .photo-card-info { padding: .55rem; }
    .photo-upload-item { grid-template-columns: 50px minmax(0, 1fr) auto; gap: .45rem; }
    .photo-upload-item img { width: 50px; height: 50px; }
}

.social-progress { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.2rem; margin-bottom: 1rem; border-color: #39747d; }
.content-workspace { padding: 1.3rem; margin-bottom: 1rem; border-color: #39747d; background: linear-gradient(115deg, #20343a, var(--surface) 70%); }
.content-workspace-intro { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.content-workspace-intro .eyebrow { margin: 0 0 .25rem; }
.content-workspace-intro h2 { margin: 0 0 .25rem; }
.content-workspace-intro p:last-child { margin: 0; color: var(--muted); }
.content-workspace-intro .button { flex: none; }
.content-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .55rem; margin: 1.3rem 0 0; padding: 0; list-style: none; }
.content-steps a { display: flex; align-items: center; gap: .7rem; min-height: 64px; padding: .7rem; border: 1px solid var(--line); border-radius: 9px; background: #171e24; text-decoration: none; font-weight: 750; }
.content-steps a:hover, .content-steps a:focus-visible { border-color: var(--accent); background: #263940; }
.content-step-number { display: grid; place-items: center; flex: none; width: 1.7rem; height: 1.7rem; border-radius: 50%; background: #315b62; color: #d5f9fc; font-size: .78rem; }
.content-steps small { display: block; margin-top: .1rem; color: var(--muted); font-size: .75rem; font-weight: 500; }
.social-source, .social-editor, .social-media, .social-approval, .social-publish { scroll-margin-top: 1rem; }
.social-progress strong { display: inline-block; margin-right: .5rem; color: #b9f3f8; font-size: 2rem; font-variant-numeric: tabular-nums; }
.social-progress .eyebrow { margin: 0; }
.social-progress p { max-width: 24rem; margin: 0; color: var(--muted); }
.social-queue { padding: 1.3rem; margin-bottom: 1rem; }
.social-queue h2 { margin-top: 0; }
.social-row { display: flex; justify-content: space-between; align-items: center; gap: 1.2rem; padding: 1rem 0; border-top: 1px solid var(--line); }
.social-row > div { min-width: 0; }
.social-row .eyebrow { margin: 0; }
.social-row h3 { margin: .25rem 0; }
.social-row p { margin: .35rem 0; overflow-wrap: anywhere; }
.social-row .social-queue-next { margin-top: .7rem; color: #c9f3f8; }
.social-row .button { flex-shrink: 0; }
.social-empty { color: var(--muted); }
.social-editor, .social-media, .social-approval, .social-publish, .social-source { padding: 1.25rem; margin-bottom: 1rem; }
.social-editor h2, .social-media h2, .social-approval h2, .social-publish h2 { margin-top: 0; }
.social-channel-grid, .social-publication-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.social-channel-grid { margin: 1rem 0; }
.social-channel { min-width: 0; padding: 1rem; border: 1px solid var(--line); border-radius: 9px; background: #202930; overflow-wrap: anywhere; }
.social-channel h3 { margin: 0 0 .6rem; }
.social-channel p { margin: .6rem 0 0; }
.social-publication-form { max-width: 48rem; }
.social-publication-form .field { margin-bottom: 1rem; }
.social-publication-links { margin-bottom: 1rem; }
.social-publication-links summary { padding: .6rem 0; font-weight: 700; cursor: pointer; }
.status-social-scheduled, .status-social-pending { background: #67492a; color: #ffdeaf; }
.social-edit-form textarea, .social-caption-copy { display: block; width: 100%; max-width: 100%; padding: .8rem; border: 1px solid #57636b; border-radius: 8px; background: var(--field); color: var(--ink); line-height: 1.5; }
.social-caption-copy { margin-bottom: .8rem; }
.social-edit-form .form-actions, .social-approval form { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1rem; }
.social-save-actions { position: sticky; bottom: 0; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem; margin-top: 1rem; padding: .8rem; border: 1px solid var(--line); border-radius: 9px; background: #202b31; box-shadow: 0 -8px 18px rgb(0 0 0 / 22%); }
.social-save-state { color: #b8e9ef; font-size: .85rem; font-weight: 700; }
.social-save-state[data-unsaved="true"] { color: #ffd995; }
.social-photo-controls { display: flex; align-items: end; justify-content: space-between; flex-wrap: wrap; gap: .6rem; margin: 1rem 0; }
.social-photo-controls label { font-size: .84rem; font-weight: 700; }
.social-photo-controls select { display: block; min-height: 44px; margin-top: .3rem; padding: .45rem .7rem; border: 1px solid #57636b; border-radius: 8px; background: var(--field); color: var(--ink); }
.social-photo-controls span { color: var(--muted); font-size: .84rem; }
.social-photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .8rem; margin: 1rem 0; }
.social-photo-card { display: flex; flex-direction: column; gap: .45rem; min-width: 0; padding: .65rem; border: 1px solid var(--line); border-radius: 9px; background: #202930; overflow-wrap: anywhere; }
.social-photo-card[hidden] { display: none; }
.social-photo-card img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 6px; }
.social-photo-card .button { text-align: center; }
.social-text-warning { margin: -.25rem 0 1rem; padding: .7rem .85rem; border-left: 3px solid #d8a45c; background: #302b25; border-radius: 6px; }
.social-text-warning p { margin: 0 0 .4rem; }
.social-text-warning ul { margin: .35rem 0; padding-left: 1.2rem; }
.social-text-warning mark { background: #58422b; color: #ffe1b4; padding: .05rem .25rem; border-radius: 3px; overflow-wrap: anywhere; }
.review-confirmation { margin: 1rem 0; scroll-margin-bottom: 7rem; }
.review-confirmation label { display: flex; align-items: flex-start; gap: .65rem; cursor: pointer; font-weight: 600; }
.review-confirmation input { width: 1.25rem; height: 1.25rem; min-width: 1.25rem; flex: none; margin: .2rem 0 0; accent-color: var(--accent); }
.app-install-panel { max-width: 720px; margin-inline: auto; }
.app-install-icon { display: block; border-radius: 20px; margin-bottom: 1rem; }
.app-install-panel h2 { margin-top: 1.75rem; }
.device-draft-panel { margin: 0 0 1.2rem; padding: .8rem 1rem; background: #20353c; border: 1px solid #327a87; border-radius: 9px; }
.device-draft-panel p { margin: 0 0 .6rem; }
.device-draft-panel .button { margin: .25rem .5rem .25rem 0; }
.device-draft-panel[hidden] { display: none; }
@media (display-mode: standalone) {
    .page { padding-bottom: calc(3rem + env(safe-area-inset-bottom, 0px)); }
    .site-header { padding-top: env(safe-area-inset-top); }
}
.social-photo-selection summary { padding: .7rem 0; font-weight: 700; cursor: pointer; }
.social-photo-selection .field { margin-bottom: 1rem; }
.social-mask-workspace { position: relative; display: inline-block; max-width: 100%; line-height: 0; margin: 1rem 0; }
.social-mask-workspace img { display: block; max-width: 100%; max-height: 75vh; width: auto; height: auto; }
.social-mask-workspace canvas { position: absolute; inset: 0; cursor: crosshair; touch-action: none; }
.status-social-draft { background: #564331; color: #ffdfad; }
.status-social-approved { background: #254d46; color: #c8ffe8; }
.status-social-published { background: #24445a; color: #cdefff; }
.status-social-skipped { background: #42444b; color: #e4e7eb; }
.status-scout-strong { background: #275c43; color: #d1ffe3; }
.status-scout-ok { background: #28506b; color: #d7edff; }
.status-scout-hold, .status-scout-error { background: #67492a; color: #ffdeaf; }
.status-scout-pending, .status-scout-skip { background: #484953; color: #e0e3e9; }
.social-evidence { padding: .7rem 0; border-top: 1px solid var(--line); overflow-wrap: anywhere; }
.social-evidence p { margin: .35rem 0; }
.social-fact-choice { display: flex; align-items: flex-start; gap: .75rem; cursor: pointer; }
.social-fact-choice input { margin-top: .25rem; flex: none; }

@media (max-width: 640px) {
    .social-progress, .social-row { align-items: flex-start; flex-direction: column; }
    .social-row .button { width: 100%; text-align: center; }
    .social-photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .content-workspace-intro { align-items: stretch; flex-direction: column; }
    .content-workspace-intro .button, .social-save-actions .button { width: 100%; }
    .content-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .social-channel-grid, .social-publication-fields { grid-template-columns: 1fr; }
}
/* Account security follows the same compact OHMX panels on phone and desktop. */
.security-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 1rem; }
.security-method { padding-block: .7rem; border-bottom: 1px solid var(--line); margin-bottom: 1rem; }
.security-codes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; padding: 1rem 0; list-style: none; }
.security-qr { display: block; background: white; padding: .6rem; margin-block: 1rem; max-width: 100%; }
.security-secret { overflow-wrap: anywhere; font-family: monospace; }

/* Service requests and customer holds stay distinct from quote approval. */
.status-waiting-for-customer { background: #f39ade; }
.service-priority { background: #e9a6ff; }
.service-priority-request { background: transparent; color: #e9a6ff; border: 1px solid #ab6abf; }
.target-paused { background: #43233d; color: #ffb9ec; }
.customer-wait-panel { border-left: 3px solid #f39ade; }
.customer-wait-panel form { display: flex; flex-wrap: wrap; gap: .6rem; }
.field input.priority-request-checkbox { width: 1.75rem; min-height: 1.75rem; height: 1.75rem; margin: 0; padding: 0; cursor: pointer; accent-color: var(--accent); }
/* Imported history stays visually separate from active repair stages. */
.status-historical { color: #c4d5ef; background: #203247; border-color: #5a7698; }
.history-record > .panel { margin-bottom: 1.25rem; }
.history-record .page-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.history-record details { padding-block: 1rem; border-top: 1px solid var(--line); }
.history-record details > summary { cursor: pointer; font-weight: 750; }
.history-record .text-block { margin-top: .8rem; overflow-wrap: anywhere; }
.history-record dl.detail-grid { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.history-record dt { color: var(--muted); font-size: .85rem; }
.history-record dd { margin: .3rem 0 0; overflow-wrap: anywhere; }

/* Compact navigation and an operational queue at every viewport size. */
.header-inner { gap: .75rem; }
.main-nav { margin-left: auto; }
.site-header .nav-badge { min-width: 1.6rem; padding: .2rem .5rem; }
.account-menu { position: relative; flex: none; }
.account-menu > summary { display: flex; align-items: center; gap: .5rem; cursor: pointer; min-height: 44px; padding: .5rem .75rem; border: 1px solid var(--line); border-radius: 8px; list-style: none; font-weight: 650; }
.account-menu > summary::after { content: '⌄'; }
.account-menu > summary::-webkit-details-marker { display: none; }
.account-menu-content { position: absolute; top: calc(100% + .5rem); right: 0; z-index: 20; width: min(18rem, calc(100vw - 1.5rem)); padding: .6rem; background: #1f2229; border: 1px solid #57636b; border-radius: 10px; box-shadow: 0 12px 35px #0008; }
.account-menu-content p { margin: .4rem .6rem .7rem; color: var(--muted); font-size: .8rem; overflow-wrap: anywhere; }
.account-menu-content a, .account-menu-content button { display: flex; align-items: center; min-height: 44px; width: 100%; padding: .6rem; border: 0; border-radius: 6px; background: none; color: var(--ink); text-decoration: none; text-align: left; }
.account-menu-content form { margin-top: .6rem; padding-top: .6rem; border-top: 1px solid var(--line); }
.queue-heading { align-items: center; flex-direction: row; margin: 0 0 .8rem; gap: .75rem; }
.queue-heading h1 { margin: 0; }
.queue-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; margin-bottom: .8rem; }
.queue-summary a { display: flex; align-items: center; justify-content: center; min-height: 44px; border: 1px solid #53616a; padding: .5rem .7rem; border-radius: 8px; color: #dde6ee; font-size: .82rem; font-weight: 700; text-decoration: none; text-align: center; }
.queue-summary .attention-overdue { background: #572b32; border-color: #c97985; color: #ffe2dc; }
.queue-summary .attention-soon { background: #433c25; border-color: #9e8b53; color: #fff1cf; }
.queue-summary .attention-unset { border-style: dashed; }
.queue-controls { border-bottom: 1px solid var(--line); }
.queue-controls .search-bar { padding: 0; border: 0; }
.queue-controls .search-controls { flex-wrap: nowrap; gap: .5rem; }
.queue-controls .search-controls input { width: auto; flex: 1 1 0; min-height: 44px; min-width: 0; }
.queue-controls .search-clear { display: flex; align-items: center; min-height: 44px; font-size: .85rem; }
.queue-options summary { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .65rem; min-height: 48px; padding-block: .4rem; cursor: pointer; color: #b8e9ef; font-size: .85rem; font-weight: 700; list-style: none; }
.queue-options summary::-webkit-details-marker { display: none; }
.queue-options summary::before { content: '+'; font-size: 1.2rem; width: .75rem; }
.queue-options[open] summary::before { content: '−'; }
.queue-options summary span { margin-left: auto; color: var(--muted); font-size: .8rem; font-weight: 500; }
.queue-options-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; gap: .7rem; align-items: end; padding-top: .3rem; }
.queue-options-form .field { margin: 0; min-width: 0; }
.queue-options-form select { min-width: 0; }
.queue-caption { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .1rem .8rem; margin: .55rem 0; color: var(--muted); font-size: .8rem; }
.queue-caption p { margin: 0; }
.queue-caption a { display: inline-flex; align-items: center; min-height: 44px; }
.queue-return { display: block; width: fit-content; margin-top: .45rem; padding: .2rem .45rem; border-left: 3px solid #d2b5ff; background: #30283d; color: #e6d5ff; font-size: .78rem; font-weight: 650; }
.queue-category { display: block; color: var(--muted); font-size: .76rem; font-weight: 500; }
.queue-action-label { display: block; color: var(--muted); font-size: .72rem; }
.job-next-action { display: inline-block; padding-block: .25rem; min-height: 44px; color: #9edbe4; font-weight: 600; text-underline-offset: 3px; }
.job-queue th, .job-queue td { padding: .8rem .8rem; }
.job-queue .status { white-space: normal; background: transparent; border-radius: 6px; color: #cad9ec; border-color: #63718a; font-size: .76rem; font-weight: 650; }
.job-queue .status-waiting-for-customer, .job-queue .status-waiting-for-approval { color: #f4d39d; border-color: #8e794b; }
.job-queue .status-approved, .job-queue .status-testing { color: #d0c6ff; border-color: #8374b2; }
.job-queue .status-ready-for-pickup { color: #c2dfa6; border-color: #6e8753; }
.job-queue .status-declined { color: #ffb8aa; border-color: #a66a62; }
.job-queue .target-track { color: #d3dbe4; background: transparent; border-color: #5c6c78; }
.job-queue .target-unset { color: #f4d39d; background: transparent; border-color: #8e794b; border-style: dashed; min-height: 44px; display: inline-flex; align-items: center; }
.history-preview { margin-top: 1rem; padding: 1rem; }
.history-preview ul { margin: 0; padding: 0; list-style: none; }
.history-preview li { padding-block: .6rem; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
@media (hover: hover) {
    .queue-summary a:hover { text-decoration: underline; text-underline-offset: 3px; }
    .account-menu-content a:hover, .account-menu-content button:hover { background: #2a3038; }
}
@media (max-width: 750px) {
    .header-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .2rem .5rem; padding-block: .4rem; min-height: 0; }
    .brand img { width: 170px; }
    .brand { gap: .5rem; }
    .account-menu { grid-column: 2; grid-row: 1; }
    .site-header .main-nav { grid-column: 1 / -1; grid-row: 2; margin: 0; gap: .25rem; }
    .site-header .main-nav > a { flex: 1; justify-content: center; min-height: 44px; padding: .4rem .35rem; font-size: .85rem; }
    .site-header .main-nav .nav-new-job { display: none; }
    .page { padding-top: 1rem; }
    .queue-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem; }
    .queue-summary a { padding: .4rem; }
    .queue-options-form { grid-template-columns: 1fr; }
    .queue-options-form .button { justify-self: end; }
    .queue-options summary span { flex-basis: auto; }
    .job-queue { border: 0; background: transparent; box-shadow: none; }
    .job-queue tbody tr { grid-template-columns: minmax(0, 1fr) minmax(0, auto); gap: .2rem .5rem; padding: .8rem; margin-bottom: .65rem; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
    .job-queue tbody td { padding: 0; }
    .job-queue tbody td[data-label="Stage"] { max-width: 10rem; }
    .job-queue tbody td[data-label="Device"] { padding-top: .15rem; }
    .job-queue .queue-category { display: inline; margin-left: .45rem; }
    .job-queue .job-link { display: inline-flex; align-items: center; min-height: 44px; }
    .job-queue .queue-return { margin-top: .1rem; margin-bottom: .25rem; }
    .job-queue .job-next-action { display: flex; align-items: center; }
    .job-queue .queue-meta { font-size: .76rem; }
}

@media (min-width: 751px) {
    .job-queue table { min-width: 1000px; table-layout: fixed; }
    .job-queue .date-cell { font-size: .75rem; white-space: normal; }
    .job-queue .status { overflow-wrap: normal; }
    .queue-col-code { width: 11%; }
    .queue-col-customer { width: 13%; }
    .queue-col-device { width: 18%; }
    .queue-col-stage { width: 11%; }
    .queue-col-target { width: 18%; }
    .queue-col-action { width: 21%; }
    .queue-col-updated { width: 8%; }
    .job-queue td { vertical-align: top; }
}
@media (max-width: 750px) {
    .job-queue colgroup { display: none; }
    .queue-category::before { content: '· '; }
}

/* Operational queue: recorded blockers and short actions share the same hierarchy. */
.queue-summary { display: flex; flex-wrap: wrap; gap: .25rem .5rem; margin-bottom: .45rem; }
.queue-summary a { flex: 0 1 auto; padding: .3rem .6rem; border-radius: 6px; }
.queue-quiet-summary, .queue-detail-counts { color: var(--muted); font-size: .8rem; align-self: center; }
.queue-review-link { display: inline-flex; align-items: center; min-height: 44px; }
.queue-caption { margin: .35rem 0 .5rem; }
.queue-caption p { font-size: .75rem; }
.queue-plan-note { display: block; color: var(--text); font-size: .84rem; overflow-wrap: anywhere; }
.queue-plan-warning { display: inline-flex; align-items: center; min-height: 44px; color: #f4d39d; font-size: .8rem; }
.job-next-action { font-size: .85rem; text-decoration: none; gap: .5rem; }
.job-next-action:hover { text-decoration: underline; }
.job-next-action span { color: var(--muted); }
.job-queue .status-waiting-for-parts, .job-queue .status-parts-needed, .status-waiting-for-parts { color: #f4d39d; background: #433c25; border-color: #9e8b53; }
.queue-target-date, .queue-ready-since { color: #d3dbe4; font-size: .84rem; }
.rich-text { white-space: normal; overflow-wrap: anywhere; line-height: 1.5; }
.rich-text > :first-child { margin-top: 0; }
.rich-text > :last-child { margin-bottom: 0; }
.rich-text p { margin: 0 0 .65em; }
.rich-text ul, .rich-text ol { margin: .4em 0 .65em; padding-left: 1.4em; }
.rich-text h1, .rich-text h2, .rich-text h3, .rich-text h4, .rich-text h5, .rich-text h6 { font-size: 1.05em; margin: .7em 0 .35em; }
.rich-text pre { white-space: pre-wrap; padding: .5rem; background: #15191e; border-radius: 5px; }
.rich-text code { overflow-wrap: anywhere; }
.rich-text blockquote { margin-left: 0; padding-left: .8em; border-left: 2px solid var(--line); }
.text-tools { display: flex; align-items: center; flex-wrap: wrap; gap: .3rem .6rem; margin-top: .3rem; }
.text-tools .button { font-size: .78rem; min-height: 44px; padding: .3rem .6rem; }
.text-preview { border: 1px solid var(--line); border-radius: 6px; padding: .75rem; margin-top: .5rem; background: #171b21; }
.text-preview[hidden] { display: none; }
.parts-summary, .part-record, .parts-form { margin-bottom: 1rem; }
.part-record .section-heading h2 { overflow-wrap: anywhere; }
.part-record .facts dd { overflow-wrap: anywhere; }
@media (min-width: 751px) {
    .job-queue table { min-width: 0; }
    .job-queue th, .job-queue td { padding: .65rem .6rem; }
    .queue-col-action { width: 23%; }
    .queue-col-target { width: 16%; }
}
@media (max-width: 750px) {
    .header-inner { gap: 0 .4rem; padding-block: .2rem; }
    .brand img { width: 125px; height: auto; }
    .brand-app { font-size: .8rem; }
    .account-menu summary { padding: .3rem .55rem; min-height: 44px; }
    .site-header .main-nav > a { padding-block: .25rem; }
    .page { padding-top: .55rem; }
    .queue-heading { margin-bottom: .4rem; }
    .queue-heading h1 { font-size: 1.6rem; }
    .queue-heading .button { padding: .5rem .75rem; min-height: 44px; }
    .queue-summary { gap: .2rem .35rem; }
    .queue-summary a { padding: .25rem .4rem; font-size: .76rem; }
    .queue-controls .search-controls input { padding: .5rem .65rem; }
    .queue-controls .search-controls .button { padding: .45rem .7rem; min-height: 44px; }
    .queue-options summary { min-height: 44px; padding-block: .15rem; }
    .job-queue tbody tr { gap: .08rem .4rem; padding: .55rem .7rem; margin-bottom: .5rem; }
    .job-queue tbody td[data-label="Code"] { align-self: center; }
    .job-queue .job-link { min-height: 44px; font-size: .86rem; }
    .job-queue tbody td[data-label="Stage"] { align-self: center; max-width: 10.5rem; }
    .job-queue tbody td[data-label="Device"] { padding-top: 0; font-size: .96rem; line-height: 1.3; }
    .job-queue tbody td[data-label="Customer"] { font-size: .82rem; }
    .job-queue .queue-category { display: none; }
    .job-queue tbody td[data-label="Service target"] { margin-top: .25rem; display: flex; align-items: center; flex-wrap: wrap; gap: .25rem .55rem; }
    .job-queue tbody td[data-label="Service target"] .queue-meta { margin: 0; }
    .job-queue tbody td[data-label="Next action"] { margin-top: .2rem; padding-top: .1rem; display: flex; flex-wrap: wrap; align-items: center; gap: 0 .5rem; }
    .job-queue .job-next-action { min-height: 44px; flex: 0 1 auto; }
    .job-queue .queue-plan-note { flex-basis: 100%; margin-top: .25rem; font-size: .8rem; }
    .job-queue .queue-meta { font-size: .75rem; }
    .job-queue .target-badge { padding: .2rem .45rem; font-size: .76rem; }
    .job-queue .target-unset { min-height: 44px; }
}