:root { color-scheme: light; font-family: system-ui, sans-serif; color: #202a35; background: #f4f5f7; }
body { margin: 0; } main { max-width: 760px; margin: 3rem auto; padding: 2rem; }
h1 { font-size: 2.3rem; } h2 { margin-top: 2rem; } p { line-height: 1.6; }
.eyebrow { color: #596371; } section { padding: 1.5rem; background: white; border: 1px solid #ccd1d8; border-radius: 12px; margin: 1rem 0; }
label { display: block; margin: 1rem 0; } label[hidden] { display: none; } input { display: block; box-sizing: border-box; padding: .8rem; width: 100%; max-width: 420px; margin-top: .4rem; font: inherit; }
button { padding: .8rem 1.2rem; font: inherit; background: #283d54; color: white; border: 0; border-radius: 6px; cursor: pointer; }
dt { margin-top: 1rem; font-weight: 600; } dd { margin: .3rem 0; } [role=alert] { color: #9b2020; }
.wide { max-width: 1200px; } .filter { display: flex; align-items: end; gap: 1rem; flex-wrap: wrap; margin: 1.5rem 0; }
.filter label { margin: 0; } .filter input { width: 190px; } .filter a { padding-bottom: .8rem; }
.table-wrap { overflow-x: auto; background: white; border: 1px solid #ccd1d8; border-radius: 12px; margin: 1rem 0; }
table { width: 100%; border-collapse: collapse; text-align: left; } th, td { padding: .8rem; border-bottom: 1px solid #e0e4e9; vertical-align: top; }
th { background: #e9edf2; white-space: nowrap; } td:nth-child(4) { overflow-wrap: anywhere; } .pages { display: flex; gap: 1rem; margin: 1rem 0; }

/* The authenticated daily workspace uses the native app's dark/red visual language. */
.workspace { display: flex; min-height: 100vh; background: radial-gradient(circle at 95% 8%, #42101c, transparent 30%), radial-gradient(circle at 4% 94%, #4b0615, transparent 35%), #090b11; color: #eff0f3; }
.workspace a { color: inherit; text-decoration: none; }
.workspace-sidebar { box-sizing: border-box; width: 264px; flex: 0 0 264px; min-height: 100vh; padding: 0 15px 20px; border-right: 1px solid #39404c; background: linear-gradient(165deg, #252f33, #080c10 40%, #160810); position: sticky; top: 0; height: 100vh; }
.brand { display: flex; align-items: center; gap: 12px; margin: 0 -15px 28px; padding: 18px 15px; border-bottom: 1px solid #475057; }
.brand strong { display: block; font-size: 17px; white-space: nowrap; }.brand small { display: block; font-size: 8px; letter-spacing: .08em; color: #aeb8c1; }
.brand-mark { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 12px; background: linear-gradient(#fb3549, #9b071c); font-size: 25px; }
.nav-heading { margin: 25px 10px 12px; font-size: 13px; letter-spacing: .07em; color: #a6adb8; }
.nav-link { display: flex; align-items: center; justify-content: space-between; border: 1px solid #363c47; border-radius: 30px; padding: 15px 18px; margin-bottom: 8px; background: #ffffff09; }
.nav-link.active { background: linear-gradient(#f46b80, #960c24 65%, #500918); box-shadow: 0 0 16px #fb496c88; border-color: #ff9db0; }
.nav-link span { border: 1px solid #ffffff77; border-radius: 50%; min-width: 28px; text-align: center; }
.sidebar-footer { position: absolute; bottom: 20px; left: 18px; right: 18px; display: flex; align-items: center; justify-content: space-between; gap: 6px; font-size: 12px; color: #aeb8c1; }
.sidebar-footer button { padding: 8px 12px; border: 1px solid #872a3b; background: #450c19; }
.workspace-main { min-width: 0; flex: 1; }
.workspace-header { display: flex; align-items: center; gap: 18px; padding: 15px 22px; border-bottom: 2px solid #4b5760; background: #121820b8; flex-wrap: wrap; }
.workspace-header h1 { font-size: 23px; margin: 0; }.workspace-header small { color: #acb6c1; }
.date-nav { display: flex; align-items: center; gap: 6px; }.date-nav a, .date-nav button { padding: 9px 14px; border: 1px solid #57616c; border-radius: 25px; background: linear-gradient(#3e454d, #161b20); }.date-nav a { font-size: 19px; line-height: 1; }.date-nav form { display: flex; align-items: center; gap: 5px; }.date-nav input { width: 160px; margin: 0; padding: 8px; border-radius: 20px; background: #1c232c; border: 1px solid #606b78; color: white; color-scheme: dark; }.date-nav .today-link { font-size: 14px; line-height: normal; }
.source-label { margin-left: auto; font-size: 13px; color: #bfc9d3; border: 1px solid #505866; border-radius: 20px; padding: 8px 14px; }
.daily-sheet-link { font-size: 13px; border: 1px solid #a55b70; border-radius: 20px; padding: 8px 14px; background: #711b34; white-space: nowrap; }
.pilot-banner { padding: 9px 22px; background: #3d2a19; color: #f7dbb4; font-size: 13px; }.pilot-banner a { text-decoration: underline; }
.status-tabs { display: flex; gap: 8px; padding: 12px 20px; overflow-x: auto; border-bottom: 1px solid #303a45; }.status-tab { min-width: 125px; flex: 1; display: flex; justify-content: space-between; gap: 8px; padding: 12px; border: 1px solid #545a64; border-radius: 18px; background: #0c0f17; font-size: 12px; text-transform: uppercase; font-weight: 700; }.status-tab b { font-size: 20px; color: #58d5f5; }.status-tab.selected { border-color: #fa88a0; background: linear-gradient(125deg, #92324e77, #1d1420); box-shadow: 0 0 10px #dd3c6980; }.status-tab.selected b { color: #fa4771; }
.order-layout { display: grid; grid-template-columns: minmax(300px, 34%) minmax(0, 1fr); min-height: calc(100vh - 190px); }.order-list { border-right: 1px solid #56606b; padding: 16px 12px; background: #11151cb0; }.list-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }.list-heading span,.sync-note { font-size: 12px; color: #a7b1bd; }.sync-note { margin: 5px 0 15px; }.order-card { display: block; margin: 9px 0; padding: 15px 16px; border: 2px solid #3e4856; border-radius: 22px; background: linear-gradient(#252630, #090c14); box-shadow: inset 0 0 0 3px #0a0d13; }.order-card.chosen { border-color: #ffb1c3; background: linear-gradient(#59303e, #120d18); box-shadow: 0 0 14px #e5427280; }.card-top { display: flex; justify-content: space-between; gap: 8px; border-bottom: 1px solid #4b4e59; padding-bottom: 15px; }.card-top strong { font-size: 18px; }.card-top span { font-size: 11px; color: #bd9be9; text-transform: uppercase; }.card-meta { display: flex; gap: 8px; padding-top: 12px; flex-wrap: wrap; }.card-meta em { font-style: normal; color: #b9e9ff; padding: 4px 8px; border: 1px solid #326080; border-radius: 16px; font-size: 12px; }.empty-list { padding: 20px; color: #bfc9d3; }
.order-detail { box-sizing: border-box; max-width: none; margin: 0; padding: 22px; }.detail-heading span,.detail-facts small { color: #aab5c2; font-size: 11px; letter-spacing: .08em; font-weight: 700; }.detail-heading h2 { margin: 5px 0 18px; font-size: 25px; }.detail-facts { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }.detail-facts div { padding: 12px; border: 1px solid #5a606a; border-radius: 15px; background: #ffffff14; }.detail-facts strong { display: block; margin-top: 5px; font-size: 18px; overflow-wrap: anywhere; }.detail-section { margin-top: 22px; padding: 20px; border: 1px solid #505763; border-radius: 24px; background: #0a0d15da; }.detail-section h3 { margin: 0 0 15px; text-transform: uppercase; font-size: 14px; letter-spacing: .05em; }.detail-section p { margin: 0; overflow-wrap: anywhere; }.order-id { color: #aab5c2; font-size: 13px; }.special-text { padding: 17px; border-radius: 18px; border: 1px solid #825a20; background: #49311580; color: #f3d074; }.item-row { display: flex; gap: 15px; padding: 16px; margin: 8px 0; border: 1px solid #323844; border-radius: 18px; background: #ffffff09; }.item-row strong { color: #f2adbe; }.item-row small { display: block; padding-top: 10px; color: #aeb9c5; }.workspace .pages { padding: 8px; }.workspace .pages a { text-decoration: underline; }
.order-attributes { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px 20px; margin: 16px 0 0; }.order-attributes dt { color: #aab5c2; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }.order-attributes dd { margin: 5px 0 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.order-action { display: flex; align-items: center; gap: 12px; margin-top: 15px; flex-wrap: wrap; }.order-action button { background: #a51e3f; }.order-action small { color: #bfc9d3; }
.order-action select { max-width: 100%; padding: 10px 12px; border: 1px solid #77808c; border-radius: 10px; background: #161b25; color: #fff; font: inherit; }.order-action select:disabled { opacity: .6; }
.packing-section-heading { margin: 22px 0 8px; color: #e4b7c4; font-size: 14px; }.packing-row { display: flex; align-items: center; gap: 12px; min-height: 52px; border-bottom: 1px solid #303844; }.packing-row input { display: none; }.packing-row button { flex: 0 0 44px; height: 44px; padding: 0; border: 1px solid #a56074; border-radius: 14px; background: #581c30; font-size: 24px; }.packing-row button:disabled { cursor: default; opacity: .55; }.packing-row span { flex: 1; overflow-wrap: anywhere; }.packing-row small { color: #f1c06e; }
.detail-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 12px; }.detail-tab { padding: 12px 20px; border: 1px solid #5d6672; border-radius: 26px; background: #20252d; font-weight: 700; font-size: 14px; }.detail-tab.active { border-color: #f593ab; background: linear-gradient(#b45473, #713149); box-shadow: 0 0 14px #e4447180; }.detail-tab:focus-visible,.status-tab:focus-visible,.order-card:focus-visible { outline: 3px solid #80d8f2; outline-offset: 3px; }.detail-tab-panel[hidden] { display: none; }.stage-track { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; padding: 8px; border: 1px solid #5b6370; border-radius: 28px; background: #11141b; }.stage { text-align: center; padding: 10px 4px; border: 1px solid #555d67; border-radius: 20px; font-weight: 700; font-size: 13px; color: #b7c0cc; }.stage.current { color: #edb6ff; border-color: #d8b5ed; background: #63506c99; }.detail-tab-panel { min-height: 280px; }.detail-tab-panel .detail-section:first-child { margin-top: 14px; }
.card-progress { display: block; width: 100%; height: 7px; margin-top: 14px; border: 0; border-radius: 8px; overflow: hidden; background: #343c4a; accent-color: #40d69a; }.card-progress::-webkit-progress-bar { background: #343c4a; }.card-progress::-webkit-progress-value { background: linear-gradient(90deg, #4bbbec, #40d69a); border-radius: 8px; }.card-progress::-moz-progress-bar { background: #40d69a; }.card-progress-label { display: block; text-align: right; color: #aeb9c5; font-size: 11px; margin-top: 4px; }
.card-readiness { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 12px; }
.card-readiness-chip { display: inline-flex; align-items: center; gap: 4px; min-height: 26px; padding: 3px 7px; border: 1px solid #716045; border-radius: 8px; background: #302719; color: #f2d5a0; font-size: 11px; line-height: 1.25; }
.card-readiness-chip b { color: #fff0c7; white-space: nowrap; }
.card-readiness-chip.is-done { border-color: #326b52; background: #173629; color: #afe9c6; }
.card-readiness-chip.is-done b { color: #c4f6d5; }
.week-main { box-sizing: border-box; max-width: 1200px; margin: 0 auto; padding: 18px; }.week-day { margin: 14px 0; padding: 18px; color: #eff0f3; border: 1px solid #505763; background: #11151c; }.week-day-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }.week-day-heading h2 { margin: 0 0 4px; font-size: 20px; }.week-day-heading span { color: #aeb9c5; font-size: 13px; }.week-day-heading a { color: #f3a0b6; }.week-orders { display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: 10px; margin-top: 16px; }.week-order { display: flex; flex-direction: column; gap: 4px; padding: 13px; border: 1px solid #48525e; border-radius: 13px; background: #222630; }.week-order strong { color: #7ed8f3; }.week-order span { font-weight: 700; }.week-order small { color: #bdc5cf; }
.search-main { box-sizing: border-box; max-width: 1000px; margin: 0 auto; padding: 24px; }.order-search { padding: 20px; border: 1px solid #505763; border-radius: 18px; background: #11151c; }.order-search label { margin: 0 0 12px; font-weight: 700; }.order-search div { display: flex; gap: 10px; }.order-search input { max-width: none; flex: 1; margin: 0; background: #222630; border: 1px solid #737f8f; border-radius: 10px; color: #fff; }.order-search button { background: #a51e3f; }.search-count { margin: 20px 0 8px; color: #bcc6d2; }.search-results { display: grid; gap: 8px; }.search-result { display: flex; flex-direction: column; gap: 5px; padding: 16px; border: 1px solid #48525e; border-radius: 14px; background: #20242e; }.search-result strong { font-size: 18px; }.search-result span { color: #8dd9f2; }.search-result small { color: #bdc5cf; }
.order-search .search-filters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }.search-filters label { display: block; color: #c8d2dd; font-size: 13px; }.search-filters input,.search-filters select { box-sizing: border-box; width: 100%; min-height: 44px; margin-top: 6px; padding: 8px 10px; border: 1px solid #737f8f; border-radius: 10px; background: #222630; color: #fff; font: inherit; color-scheme: dark; }.order-search small { display: block; margin-top: 12px; color: #aeb9c5; }.order-search :focus-visible { outline: 3px solid #f5b4c5; outline-offset: 2px; }
@media (max-width: 700px) { .order-search .search-filters { grid-template-columns: 1fr; }.search-main { padding: 14px; } }
.review-complete form { margin-top: 10px; }.review-complete form button { min-height: 44px; padding: 9px 14px; border: 1px solid #f294ad; border-radius: 10px; background: #8d1c3b; color: #fff; cursor: pointer; }.review-complete form small { display: block; margin-top: 6px; max-width: 380px; }.review-complete a { text-decoration: underline; }.review-complete :focus-visible { outline: 3px solid #f5b4c5; outline-offset: 2px; }
.departure-panel { margin: 14px 0; padding: 14px; border: 1px solid #58687a; border-radius: 12px; background: #172230d9; }.departure-panel strong,.departure-panel small { display: block; }.departure-panel small { margin-top: 6px; color: #c2d0dc; }.departure-panel button { min-height: 44px; border: 1px solid #91c4d6; border-radius: 10px; background: #244c60; color: #fff; cursor: pointer; }.departure-panel button:focus-visible { outline: 3px solid #f5b4c5; outline-offset: 2px; }
.customer-main,.documents-main { box-sizing: border-box; max-width: 1380px; margin: 0 auto; padding: 22px; }.customer-layout { display: grid; grid-template-columns: minmax(270px, 33%) minmax(0, 1fr); gap: 18px; margin-top: 16px; }.customer-list,.customer-detail,.document-feature { margin: 0; border: 1px solid #4c5663; border-radius: 20px; background: #11151c; color: #eff0f3; }.customer-list,.customer-detail { padding: 20px; }.customer-list h2,.documents-main h2 { margin: 0 0 15px; font-size: 20px; }.customer-detail h2 { margin: 0 0 12px; font-size: 27px; }.customer-card { display: flex; flex-direction: column; gap: 4px; padding: 14px; margin: 8px 0; border: 1px solid #46505d; border-radius: 15px; background: #20242e; }.customer-card.chosen { border-color: #f49bb1; background: #552333; }.customer-card span,.customer-card small,.document-row small { color: #b8c2ce; }.customer-card small { font-size: 12px; }.customer-badges { display: flex; gap: 8px; flex-wrap: wrap; }.customer-badges span { border: 1px solid #a45c70; border-radius: 16px; padding: 5px 10px; color: #f3c0d0; background: #5b2032; }.detail-kicker { color: #aab5c2; font-size: 11px; font-weight: 700; letter-spacing: .08em; }.customer-detail .detail-section { margin-top: 16px; }.customer-detail .detail-section p { white-space: pre-wrap; }.customer-detail li { margin: 7px 0; }.document-feature { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 24px; margin-bottom: 24px; }.document-feature h2 { margin: 4px 0; }.document-feature p { color: #c1cad5; }.document-button { border: 1px solid #fb839e; border-radius: 14px; padding: 14px 18px; background: #a51e3f; white-space: nowrap; }.document-list { display: grid; gap: 9px; }.document-row { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 16px; border: 1px solid #4c5663; border-radius: 14px; background: #20242e; }.document-row span { display: flex; flex-direction: column; gap: 5px; }.document-row b { color: #f3a0b6; white-space: nowrap; }
@media (max-width: 1250px) { .detail-facts { grid-template-columns: repeat(3, 1fr); } .workspace-sidebar { width: 205px; flex-basis: 205px; }.brand strong { font-size: 13px; } }
@media (max-width: 750px) { .workspace { display: block; }.workspace-sidebar { position: relative; width: auto; height: auto; min-height: 0; padding-bottom: 8px; }.brand { margin-bottom: 8px; }.nav-heading { display: none; }.nav-link { display: inline-flex; margin-right: 8px; padding: 8px 12px; }.sidebar-footer { position: static; padding: 8px; }.order-layout,.customer-layout { grid-template-columns: 1fr; }.order-list { border-right: 0; }.detail-facts { grid-template-columns: repeat(2, 1fr); }.document-feature,.document-row { align-items: flex-start; flex-direction: column; } }

/* Match the daily workspace's native visual hierarchy and background. */
/* A solid workspace background avoids image loading and repaint flashes. */
html:has(> body.workspace) { background: #101217; }
.workspace { background: #101217; }
.workspace .detail-tab-panel { min-width: 0; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: #eff0f3; }
.workspace .detail-tab-panel[hidden] { display: none; }
.workspace .stage-track { gap: 6px; padding: 5px; border-color: #ffffff3d; border-radius: 999px; background: linear-gradient(145deg, #03070e6b, #0408103d), #05080e38; }
.workspace .stage-form { min-width: 0; margin: 0; }
.workspace .stage { box-sizing: border-box; display: grid; place-items: center; width: 100%; min-height: 44px; padding: 9px 5px; border: 1px solid transparent; border-radius: 999px; background: transparent; color: #d7e2ec; font: 700 14px system-ui, sans-serif; text-align: center; }
.workspace button.stage { cursor: pointer; }
.workspace button.stage:hover, .workspace .stage-link:hover { border-color: #96d6ff43; background: #ffffff14; color: #fff; }
.workspace .stage.current { border-color: #8cd2ff75; background: linear-gradient(#ffffff29, #ffffff0b); box-shadow: inset 0 1px #ffffff3d, 0 0 18px #46d3ff1a; }
.workspace .stage.current.new { color: #edb6ff; }
.workspace .stage.current.confirmed { color: #9fd4ff; }
.workspace .stage.current.packed { color: #ffd28c; }
.workspace .stage.current.picked_up { color: #9ce9bb; }
.workspace .stage-help { margin: 8px 4px 12px; color: #b7bfcd; font-size: 12px; line-height: 1.35; }
.workspace .stage:focus-visible { outline: 3px solid #80d8f2; outline-offset: 2px; }
.workspace-sidebar { background: linear-gradient(150deg, #202b31ef, #090d12ef 42%, #18060ce8); }
.sidebar-navigation { max-height: calc(100vh - 166px); overflow-y: auto; padding-bottom: 12px; }
.sidebar-navigation .nav-heading { margin: 17px 10px 8px; font-size: 11px; }
.sidebar-navigation .nav-link { justify-content: flex-start; gap: 11px; min-height: 43px; box-sizing: border-box; padding: 8px 13px; margin-bottom: 5px; border-radius: 14px; font-size: 14px; }
.sidebar-navigation .nav-link.active { background: linear-gradient(115deg, #a91c3d, #491322); box-shadow: 0 0 10px #b9254a55; }
.sidebar-navigation .nav-icon { flex: 0 0 20px; width: 20px; text-align: center; font-size: 19px; line-height: 1; border: 0; background: none; }
.sidebar-navigation .nav-label { flex: 1; min-width: 0; border: 0; border-radius: 0; background: none; text-align: left; }
.sidebar-navigation .nav-count { min-width: 23px; padding: 1px 5px; border: 1px solid #ffffff66; border-radius: 20px; text-align: center; font-size: 12px; }
.nav-utility { display: inline-flex; align-items: center; gap: 8px; margin: 7px 13px; color: #b7bfcd !important; font-size: 12px; }
.nav-utility:hover { text-decoration: underline; }
.detail-message-action { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 15px; margin-top: 16px; padding: 12px 16px; border: 1px solid #3d4654; border-radius: 14px; background: #171d28; }
.detail-message-action > span { font-weight: 700; }
.detail-message-action .message-link { margin-left: auto; }
.detail-message-action small { flex-basis: 100%; color: #b7bfcd; }
.order-detail .detail-section { border-radius: 16px; padding: 16px 18px; margin-top: 15px; }
.order-detail .order-attributes { gap: 10px; }
.source-id { margin-top: 15px; color: #aeb8c1; font-size: 12px; }
.source-id summary { cursor: pointer; }
.source-id p { margin-top: 7px !important; overflow-wrap: anywhere; }
.sidebar-navigation a:focus-visible { outline: 2px solid #f3acbd; outline-offset: 2px; }
@media (max-width: 750px) { .sidebar-navigation { max-height: none; }.sidebar-navigation .nav-heading { display: block; }.sidebar-navigation .nav-link { display: flex; margin-right: 0; } }
.workspace-header { background: linear-gradient(100deg, #182029ed, #1c0d14dc); }
.workspace-title { min-width: 215px; }.workspace-title small { display: block; margin-top: 3px; letter-spacing: .03em; }
.source-label { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; background: #10141aba; color: #d5dce6; white-space: nowrap; }
.source-label i { width: 10px; height: 10px; border-radius: 50%; background: #bac6d5; }

.daily-sheet-link { background: linear-gradient(#fa5d78, #aa1437); border-color: #ff9bad; box-shadow: 0 0 12px #c2294f99; font-weight: 700; }
.pilot-banner { padding: 6px 20px; background: #2b2020e0; color: #ebcdd2; font-size: 11px; }
.attention-panel { margin: 10px 20px 0; border: 1px solid #694d53; border-radius: 14px; background: #18151cde; }
.attention-panel summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 16px; cursor: pointer; }
.attention-panel summary strong { color: #ffd1dc; }.attention-panel summary strong span { display: inline-block; min-width: 22px; text-align: center; margin-left: 5px; border-radius: 12px; background: #922841; color: white; }
.attention-panel summary small { color: #c3b7bf; }.attention-list { display: flex; gap: 8px; padding: 0 12px 12px; overflow-x: auto; }
.attention-item { display: flex; justify-content: space-between; gap: 18px; min-width: 230px; max-width: 360px; padding: 10px; border: 1px solid #755763; border-radius: 10px; background: #281d27; }
.attention-item span { display: grid; gap: 3px; }.attention-item small { color: #c9c5cc; }.attention-item b { align-self: center; color: #ffb8ca; white-space: nowrap; font-size: 12px; }
.attention-item > div { display: grid; align-content: center; gap: 8px; min-width: 96px; text-align: right; }
.attention-item a { color: #ffb8ca; font-size: 12px; font-weight: 700; white-space: nowrap; }
.attention-item form { margin: 0; }
.attention-item button { min-height: 36px; padding: 6px 10px; border: 1px solid #946a78; border-radius: 8px; background: #38232c; color: #fff; cursor: pointer; }
.attention-item button:focus-visible { outline: 3px solid #f5b4c5; outline-offset: 2px; }
.attention-item .attention-seen { color: #d7d4b6; }
.attention-item:focus-visible,.attention-item:hover { outline: 2px solid #ffc4d2; outline-offset: 2px; }
.next-action { display: grid; gap: 4px; margin: 2px 0 16px; padding: 12px 16px; border: 1px solid #7b5c6a; border-radius: 13px; background: #412431c7; }
.next-action small { color: #f3bdca; font-size: 10px; font-weight: 700; letter-spacing: .09em; }.next-action strong { color: #fff1f4; }
.next-action a { color: #fff; font-size: 13px; font-weight: 700; width: fit-content; text-decoration: underline; text-underline-offset: 3px; }
.order-owner { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 0 0 16px; padding: 12px 16px; border: 1px solid #434d5b; border-radius: 13px; background: #18202ac9; }
.order-owner small { display: block; color: #aab5c2; font-size: 10px; font-weight: 700; letter-spacing: .09em; }
.order-owner strong { display: block; margin-top: 4px; overflow-wrap: anywhere; }
.order-owner button { min-height: 40px; padding: 8px 14px; border: 1px solid #9f7180; border-radius: 10px; background: #35212b; color: #fff; cursor: pointer; }
.order-owner form { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.order-owner label { color: #b7bfcd; font-size: 13px; }
.order-owner select { min-height: 40px; margin-left: 6px; padding: 6px 10px; border: 1px solid #627085; border-radius: 9px; background: #232936; color: #f5f6fa; }
.packing-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 8px; margin: 14px 0 18px; }
.packing-summary div { padding: 12px; border: 1px solid #414956; border-radius: 12px; background: #1b232e; }
.packing-summary strong,.packing-summary span,.packing-summary small { display: block; }
.packing-summary span { margin-top: 4px; color: #d4dbe5; }
.packing-summary small { margin-top: 6px; color: #aeb9c5; overflow-wrap: anywhere; }
.source-readiness { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; margin-top: 14px; }
.source-readiness section { min-width: 0; margin: 0; padding: 14px; border: 1px solid #495566; border-radius: 12px; background: #18212c; }
.source-readiness h4 { margin: 0 0 8px; color: #f2d4dc; }
.source-readiness ul { margin: 0; padding-left: 19px; }
.source-readiness li { margin: 7px 0; white-space: pre-line; overflow-wrap: anywhere; }
.source-readiness .source-readiness-group { margin-top: 12px; color: #c4d4e4; font-weight: 700; list-style: none; }
.handoff-main { max-width: 1180px; margin: 0 auto; padding: 24px; }
.handoff-main h2 { margin: 26px 0 14px; font-size: 19px; }
.my-deliveries-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.my-delivery-card { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 10px; padding: 18px; border: 1px solid #46515f; border-radius: 13px; background: #18202ac9; }
.my-delivery-card strong,.my-delivery-card small { display: block; }
.my-delivery-card small { margin-top: 6px; color: #bac5d2; }
.my-delivery-card p { margin: 12px 0 0; }
.my-delivery-missing { color: #f8db9d; }
.my-delivery-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px; }
.my-delivery-actions span { color: #bac5d2; }
.my-delivery-actions a { color: #f0b3c1; }
.my-delivery-actions button { min-height: 44px; padding: 9px 16px; border: 1px solid #e47791; border-radius: 10px; background: #b91840; color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.handoff-summary { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.handoff-summary div { padding: 18px; border: 1px solid #46515f; border-radius: 14px; background: #18202ac9; }
.handoff-summary small,.handoff-summary strong { display: block; }
.handoff-summary small { color: #adbac9; font-size: 11px; letter-spacing: .06em; }
.handoff-summary strong { margin-top: 8px; font-size: 27px; }
.handoff-order { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(200px, 1.4fr) auto; align-items: center; gap: 16px; margin-bottom: 9px; padding: 16px; border: 1px solid #46515f; border-radius: 13px; background: #18202ac9; color: #f5f6fa; text-decoration: none; }
.handoff-order strong,.handoff-order small,.handoff-order span { display: block; }
.handoff-order small { margin-top: 6px; color: #bac5d2; }
.handoff-order b { white-space: nowrap; color: #f0b3c1; }
.handoff-warning { margin: 16px 24px 0; padding: 12px 16px; border: 1px solid #9b7134; border-radius: 10px; color: #f8db9d; }
.handoff-ack { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 18px; padding: 18px 20px; border: 1px solid #46515f; border-radius: 13px; background: #18202a; }
.handoff-ack strong { display: block; font-size: 17px; }
.handoff-ack p { margin: 6px 0 0; color: #bac5d2; }
.handoff-ack button { min-height: 44px; padding: 9px 16px; border: 1px solid #e47791; border-radius: 10px; background: #b91840; color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.handoff-ack button:focus-visible { outline: 3px solid #f5b4c5; outline-offset: 3px; }
.handoff-note { margin-top: 18px; padding: 18px 20px; border: 1px solid #46515f; border-radius: 13px; background: #18202a; }
.handoff-note h2 { margin: 0 0 6px; }
.handoff-note p,.handoff-note small { color: #bac5d2; }
.handoff-note form { margin-top: 14px; }
.handoff-note label,.handoff-note textarea { display: block; width: 100%; }
.handoff-note label { margin-bottom: 7px; font-weight: 700; }
.handoff-note textarea { box-sizing: border-box; padding: 12px; border: 1px solid #627085; border-radius: 10px; background: #232936; color: #f5f6fa; font: inherit; resize: vertical; }
.handoff-note button { min-height: 44px; margin-top: 10px; padding: 9px 16px; border: 1px solid #e47791; border-radius: 10px; background: #b91840; color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.handoff-history { margin-top: 14px; padding: 12px 18px; border: 1px solid #46515f; border-radius: 12px; background: #18202a; color: #eff0f3; }
.handoff-history summary { cursor: pointer; font-weight: 700; }
.handoff-history ol { margin: 12px 0 0; padding-left: 20px; }
.handoff-history li { margin: 7px 0; color: #bac5d2; }
.settings-main { max-width: 850px; margin: 0 auto; padding: 24px; color: #f5f6fa; }
.settings-card { margin-top: 18px; padding: 24px; border: 1px solid #46515f; border-radius: 14px; background: #18202a; }
.settings-card h2 { margin: 0 0 8px; }.settings-card p,.settings-card small { color: #bac5d2; }
.settings-card form { display: grid; gap: 16px; margin: 20px 0; }
.settings-card label { display: grid; gap: 5px; font-weight: 700; }.settings-card label span { color: #bac5d2; font-size: 13px; font-weight: 400; }
.settings-card input { width: min(100%, 220px); min-height: 44px; box-sizing: border-box; padding: 8px 12px; border: 1px solid #6e7a8b; border-radius: 9px; background: #222630; color: #fff; font: inherit; }
.settings-checklist { display: grid; gap: 10px; border: 1px solid #46515f; border-radius: 10px; padding: 14px; }
.settings-checklist legend { font-weight: 700; padding: 0 6px; }
.settings-card .settings-checklist label { display: flex; align-items: center; gap: 12px; min-height: 44px; margin: 0; }
.settings-checklist input[type="checkbox"] { width: 20px; min-height: 20px; height: 20px; flex: 0 0 20px; accent-color: #b91840; }
.settings-card button { width: fit-content; min-height: 44px; padding: 9px 16px; border: 1px solid #e47791; border-radius: 10px; background: #b91840; color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.settings-saved { padding: 12px 16px; border: 1px solid #5c9e77; border-radius: 10px; color: #b4ebc8; }
.review-metrics { margin-top: 20px; padding: 18px 20px; border: 1px solid #46515f; border-radius: 13px; background: #18202a; }
.review-metrics h2 { margin: 0 0 6px; }
.review-metrics p { margin: 0 0 14px; color: #bac5d2; }
.review-metrics > div { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.review-metrics span { padding: 12px; border-radius: 9px; background: #232936; color: #bac5d2; }
.review-metrics strong { display: block; margin-bottom: 3px; color: #f5f6fa; font-size: 22px; }
@media (max-width: 1000px) { .handoff-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 750px) { .handoff-main { padding: 16px; }.handoff-summary { grid-template-columns: 1fr; }.handoff-order { grid-template-columns: 1fr; gap: 8px; } }
@media (max-width: 750px) { .my-delivery-card { display: block; }.my-delivery-actions { justify-content: flex-start; margin-top: 16px; } }
@media (max-width: 750px) { .handoff-ack { flex-direction: column; align-items: stretch; } }
.mobile-list-back { display: none; }
.week-alerts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }.week-alerts span { padding: 6px 10px; border: 1px solid #9b7341; border-radius: 10px; background: #39291b; color: #ffdfad; font-size: 12px; font-weight: 700; }
.week-order .week-order-issues { color: #ffdfad; font-size: 12px; font-weight: 700; line-height: 1.4; }
.week-order .week-change-summary { display: block; margin-top: 7px; padding: 7px 9px; border-left: 3px solid #e3ad5c; background: #422e19; color: #ffe5b9; line-height: 1.4; overflow-wrap: anywhere; }
.source-revision { margin: 0 0 16px; padding: 16px; border: 1px solid #d69a4f; border-radius: 15px; background: #322414ed; }
.source-revision h3 { margin: 0 0 5px; color: #ffdb9a; }.source-revision p { margin: 0 0 14px; color: #f1e1c6; }
.source-revision-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.source-revision-grid > div { padding: 12px; border: 1px solid #80694c; border-radius: 10px; background: #1b1714; min-width: 0; }
.source-revision-grid strong { color: #ffdb9a; }.source-revision-grid dl { margin: 8px 0 0; }.source-revision-grid dt { margin-top: 8px; font-size: 11px; color: #c8ae85; text-transform: uppercase; }.source-revision-grid dd { margin: 3px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; }
.source-revision-grid dd:first-of-type { color: #c5b2ab; text-decoration: line-through; text-decoration-color: #a86868; }
.source-revision-grid dd:last-of-type { color: #dcf5db; font-weight: 700; }
.source-revision form { margin-top: 14px; }.source-revision button { padding: 10px 14px; border: 1px solid #e9b969; border-radius: 10px; background: #795424; color: #fff6e7; font-weight: 700; }.source-revision button:disabled { opacity: .5; }
.source-revision-impact { margin-top: 14px; padding: 12px; border: 1px solid #80694c; border-radius: 10px; background: #1b1714; }
.source-revision-impact h4 { margin: 0 0 8px; color: #ffdb9a; }
.order-card.completed-card { padding: 12px 16px; min-height: 44px; }
.completed-card .card-top { margin: 0; }
.order-assignment { margin: 8px 0; color: var(--muted, #b7bfcd); }
.order-assignment > summary, .order-update > summary { cursor: pointer; padding: 8px 0; }
.order-update > summary { font-weight: 600; }
.source-revision:has(.order-update) { padding: 8px 16px; }
.source-revision-impact p { margin: 6px 0; }.source-revision-impact ul { margin: 6px 0 0; padding-left: 20px; }
.source-revision-impact li { margin: 4px 0; }.source-revision-impact a { color: #ffdb9a; }
.status-tabs { align-items: stretch; gap: 6px; background: #0b0d12b8; }.status-tab { align-items: center; min-width: 110px; border-radius: 18px; background: #0b0c13db; }.status-tab:nth-child(2) b { color: #6bdcff; }.status-tab:nth-child(3) b { color: #c3a5ff; }.status-tab:nth-child(4) b { color: #f2bd61; }.status-tab:nth-child(5) b { color: #5fe2a1; }
.day-overview { min-width: 170px; flex: 1.1; border: 1px solid #59636f; border-radius: 18px; background: #0b0c13df; position: relative; }.day-overview summary { height: 100%; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; gap: 3px; padding: 7px 13px; cursor: pointer; list-style: none; }.day-overview summary::-webkit-details-marker { display: none; }.day-overview summary span:first-child { color: #aab5c2; font-size: 11px; font-weight: 700; }.day-overview summary strong { color: #58e2a4; font-size: 18px; }.day-overview summary span:last-child { position: absolute; right: 12px; top: 19px; }.overview-grid { position: absolute; z-index: 5; top: calc(100% + 5px); right: 0; width: min(350px, 80vw); padding: 16px; border: 1px solid #76808e; border-radius: 15px; background: #111720; box-shadow: 0 15px 35px #000b; }.overview-grid div { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px solid #3c4552; }.overview-grid div:last-child { border: 0; }.overview-grid span { color: #aeb8c5; }.overview-grid strong { text-align: right; }
.order-layout { grid-template-columns: minmax(330px, 32%) minmax(0, 1fr); }.order-list { background: #0c1118bc; }.list-heading { align-items: center; }.list-heading strong { white-space: nowrap; }.list-search { display: flex; align-items: center; max-width: 190px; border: 1px solid #53606d; border-radius: 25px; background: #111920; }.list-search input { min-width: 0; width: 100%; margin: 0; padding: 8px 4px 8px 12px; border: 0; background: transparent; color: white; font-size: 13px; }.list-search button { padding: 4px 10px; border: 0; background: transparent; }.clear-search { display: inline-block; margin-top: 8px; color: #a9dff3 !important; font-size: 12px; text-decoration: underline !important; }.order-group-title { display: flex; align-items: center; gap: 8px; margin: 14px 4px 8px; color: #c0c7d2; font-size: 11px; letter-spacing: .09em; }.order-group-title span { padding: 2px 7px; border-radius: 12px; background: #4a3b46; color: #f4d2dd; }
.workspace-save-error { margin: 12px 20px; padding: 12px 16px; border: 1px solid #e47791; border-radius: 10px; background: #4b1625; color: #fff; }
.order-card { background: linear-gradient(160deg, #282c36e8, #070a11e8); }.order-card.chosen { background: linear-gradient(150deg, #563141e9, #0e0d16ec); }.card-top span { padding: 3px 8px; border: 1px solid #a184b6; border-radius: 12px; background: #9d7bb229; white-space: nowrap; }.card-meta em:nth-child(2) { color: #c3ebf9; }.detail-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 18px; }.detail-heading span { flex-basis: 100%; }.detail-heading h2 { flex: 1; margin-bottom: 8px; }.detail-heading a { padding: 8px 12px; border: 1px solid #a36879; border-radius: 20px; background: #41202cb3; font-size: 13px; }.order-detail { background: #090c13a6; }.detail-facts div,.detail-section { background: #111720bd; backdrop-filter: blur(5px); }.stage-track { margin-top: 12px; }
@media (max-width: 1100px) { .source-label { margin-left: 0; }.status-tabs { flex-wrap: wrap; }.day-overview { flex-basis: 170px; }.order-layout { grid-template-columns: minmax(290px, 38%) minmax(0, 1fr); } }
@media (max-width: 750px) { .workspace { background-attachment: scroll; }.order-layout { grid-template-columns: 1fr; }.workspace-header { gap: 10px; }.status-tab { min-width: 90px; }.day-overview { min-width: 140px; }.workspace:not(.mobile-order-detail) .order-detail { display: none; }.workspace.mobile-order-detail .order-list { display: none; }.workspace.mobile-order-detail .mobile-list-back { display: inline-flex; align-items: center; min-height: 44px; margin-bottom: 14px; color: #b9e5f4; font-weight: 700; text-decoration: underline; }.workspace.mobile-order-detail .order-detail { padding: 16px; } }
.order-edit { margin: 14px 0; border: 1px solid #8b6b7c; border-radius: 18px; background: #19151dda; }
.order-edit summary { padding: 12px 16px; color: #f2bed0; font-weight: 700; cursor: pointer; }
.order-edit form { display: flex; align-items: end; flex-wrap: wrap; gap: 12px; padding: 4px 16px 16px; }
.order-edit label { flex: 1 1 180px; margin: 0; color: #c4cad4; font-size: 12px; font-weight: 700; }
.order-edit input,.order-edit select { display: block; width: 100%; max-width: none; margin-top: 5px; padding: 9px; border: 1px solid #727a88; border-radius: 9px; background: #101720; color: #f5f5f7; font-size: 14px; }
.order-edit button { padding: 10px 16px; border-radius: 10px; background: #aa1c42; }
.order-edit button:disabled { opacity: .55; cursor: default; }
.order-edit small { flex-basis: 100%; color: #b9c2cd; }
.hosted-doc-layout { display:grid; grid-template-columns:minmax(300px, 40%) minmax(0, 1fr); gap:18px; margin-bottom:26px; }
.hosted-doc-library,.hosted-doc-preview { min-width:0; border:1px solid #4c5663; border-radius:20px; background:#11151c; padding:20px; }
.hosted-doc-library .documents-section-heading p { color:#c1cad5; line-height:1.5; }
.documents-selection-form { margin:16px 0 20px; }
.documents-batch-actions { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
.documents-batch-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; border:1px solid #6a5260; border-radius:14px; background:#28202b; color:#f3d4df; font-weight:700; }
.documents-batch-bar button { border:1px solid #ff9eb5; border-radius:11px; padding:10px 14px; background:#ad2448; color:white; font:inherit; cursor:pointer; }
.documents-batch-bar button:disabled { opacity:.5; cursor:not-allowed; }
.document-select { display:flex; align-items:center; gap:12px; cursor:pointer; flex:1; }
.document-select input { width:19px; height:19px; accent-color:#d53a61; }
.hosted-doc-library .document-row>a { color:#f3a0b6; font-weight:700; white-space:nowrap; }
.hosted-doc-library .document-list { margin:16px 0; }
.hosted-doc-library .document-row { padding:13px; }
.hosted-doc-library .document-row[aria-disabled="true"] { opacity:.65; }
.hosted-doc-preview { min-height:640px; }
.hosted-doc-preview h2 { margin:8px 0; }
.hosted-doc-preview p { color:#c1cad5; }
.hosted-doc-preview .document-button { display:inline-block; margin:8px 0 16px; }
.hosted-doc-preview iframe { width:100%; height:750px; border:1px solid #717b89; border-radius:12px; background:white; }
.documents-preview-empty { min-height:420px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; border:1px dashed #5b6572; border-radius:16px; }
@media (max-width:900px) { .hosted-doc-layout { grid-template-columns:1fr; }.hosted-doc-preview iframe { height:620px; } }
.card-meta .card-change { border-color: #c28c36; color: #ffe0a2; background: #5e3b1399; }
.card-change-summary { display: block; margin-top: 8px; padding: 8px 10px; border-left: 3px solid #e3ad5c; border-radius: 4px; background: #422e19; color: #ffe5b9; line-height: 1.4; overflow-wrap: anywhere; }
.activity-list { list-style: none; padding: 0; margin: 0; }
.activity-list li { padding: 14px 0; border-top: 1px solid #3b4654; }
.activity-list li > div { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.activity-list small { display: block; margin-top: 6px; color: #b7c2d1; }
.activity-state { border-radius: 12px; padding: 4px 9px; font-size: 12px; font-weight: 700; }
.activity-pending { color: #ffe0a2; background: #5e3b13; }
.activity-applied { color: #b8f0d5; background: #164c39; }
.activity-conflict { color: #ffd2d2; background: #672626; }
.week-busy-window{margin:10px 0 14px;padding:12px 15px;border:1px solid #795d36;border-radius:12px;background:#32291d;color:#f5ddb0;line-height:1.45}
.service-calendar{position:fixed;z-index:1000;width:304px;max-width:calc(100vw - 16px);box-sizing:border-box;padding:14px;border:1px solid #626c7a;border-radius:14px;background:#232936;color:#f5f6fa;box-shadow:0 18px 45px #0009}.service-calendar-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}.service-calendar-heading button{width:40px;height:40px}.service-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;text-align:center}.service-calendar-grid span{padding:7px 0;color:#b7bfcd;font-size:12px}.service-calendar-grid button{min-width:0;height:38px;padding:0;border:0;border-radius:8px;background:#353d4a;color:#f5f6fa;cursor:pointer}.service-calendar-grid button:hover:not(:disabled),.service-calendar-grid button:focus-visible{background:#b91840;outline:2px solid #f5f6fa}.service-calendar-grid button[aria-current="date"]{outline:2px solid #f39ab0}.service-calendar-grid button:disabled{background:#252a32;color:#69717e;cursor:not-allowed;text-decoration:line-through}.service-calendar>small{display:block;margin-top:10px;color:#b7bfcd}.service-calendar-clear{margin-top:8px;min-height:36px}
.team-roster{list-style:none;padding:0;margin:12px 0 20px}.team-roster li{padding:10px 0;border-bottom:1px solid #424857}.team-roster form{display:inline-block;margin-left:12px}.team-roster button{min-height:36px}.team-invite-result{max-width:680px;margin:clamp(24px,8vh,90px) auto;padding:24px;background:#191d25;border:1px solid #424857;border-radius:16px;color:#f5f6fa}.team-invite-result input{display:block;width:100%;margin:8px 0 16px;padding:12px;box-sizing:border-box}.team-invite-result p{line-height:1.5}
.settings-overview{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.settings-overview a{padding:9px 12px;border:1px solid #626d7c;border-radius:10px;background:#232936;color:#f5f6fa;font-weight:600}.settings-overview a:focus-visible,.settings-text-link:focus-visible{outline:3px solid #80d8f2;outline-offset:3px}.settings-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;margin:16px 0}.settings-facts div{padding:12px;border:1px solid #485564;border-radius:11px;background:#161e28}.settings-facts dt{margin:0 0 6px;color:#b7bfcd;font-size:13px}.settings-facts dd{margin:0;font-weight:600;overflow-wrap:anywhere}.settings-card .settings-text-link{text-decoration:underline;text-underline-offset:3px;color:#bfe7fa}.settings-pending{padding-left:22px;line-height:1.6}.settings-pending li{margin:5px 0}
.settings-card .settings-note { margin: 8px 0 0; padding: 10px 14px; border-left: 3px solid #6e7a8b; border-radius: 6px; background: #1f2733; color: #cdd6e1; font-size: 14px; }
.settings-card input[name="location_name"] { width: min(100%, 420px); }

/* Shared sidebar: native pill items, the same sections on every page. */
.workspace-sidebar { display: flex; flex-direction: column; }
.sidebar-navigation { flex: 1 1 auto; min-height: 0; max-height: none; overflow-y: auto; padding-bottom: 8px; }
.sidebar-navigation .nav-heading { margin: 16px 10px 7px; font-size: 11px; font-weight: 600; letter-spacing: .06em; color: #a6adb8; }
.sidebar-navigation .nav-heading:first-child { margin-top: 4px; }
.sidebar-navigation .nav-link { gap: 12px; min-height: 42px; padding: 8px 14px; margin-bottom: 3px; border-radius: 999px; border-color: #ebf5ff14; background: linear-gradient(145deg, #03070e52, #0408102e); color: #d5dbe4; font-weight: 500; }
.sidebar-navigation .nav-link:hover { border-color: #ebf5ff33; color: #fff; }
.sidebar-navigation .nav-link.active { border-color: #ffa9bcc7; background: linear-gradient(180deg, #ff5279f5, #e8183cc7 48%, #60081dad); box-shadow: 0 0 0 1px #ff235b57, 0 10px 22px #e3183752, inset 0 1px 0 #ffffff75; color: #fff; }
.sidebar-navigation .nav-icon { flex: 0 0 24px; width: 24px; font-size: 18px; }
.sidebar-navigation .nav-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-navigation .nav-count { margin-left: auto; min-width: 24px; padding: 2px 8px; border: 1px solid #ffffff47; border-radius: 999px; background: #ffffff38; font-size: 11px; font-weight: 700; }
.nav-utilities { display: grid; gap: 2px; margin: 14px 4px 0; padding-top: 10px; border-top: 1px solid #39404c; }
.nav-utility { margin: 0; padding: 6px 10px; border-radius: 8px; }
.nav-utility.active { color: #fff !important; background: #ffffff14; }
.workspace-sidebar .sidebar-footer { position: static; margin: auto -15px 0; padding: 12px 18px 0; border-top: 1px solid #39404c; }
.status-main dl { margin: 0; }
@media (max-width: 750px) {
  .workspace-sidebar { display: block; padding: 0 12px 8px; }
  .workspace-sidebar .brand { margin: 0 -12px 8px; padding: 10px 12px; }
  .workspace-sidebar .brand-mark { width: 36px; height: 36px; font-size: 19px; }
  .sidebar-navigation { display: flex; align-items: center; gap: 6px; overflow-x: auto; overflow-y: hidden; padding-bottom: 6px; scrollbar-width: thin; }
  .sidebar-navigation .nav-heading { display: none; }
  .sidebar-navigation .nav-link { display: inline-flex; flex: 0 0 auto; margin: 0; min-height: 40px; }
  .nav-utilities { display: flex; flex: 0 0 auto; gap: 6px; margin: 0; padding: 0; border: 0; }
  .nav-utility { white-space: nowrap; border: 1px solid #363c47; border-radius: 999px; padding: 8px 12px; }
  .workspace-sidebar .sidebar-footer { margin: 4px 0 0; padding: 6px 2px 0; }
}

/* Order detail: facts, then status, then the tabs. Status colors follow the
   native app: New cyan, Confirmed violet, Packed amber, Picked up / Delivered green. */
.workspace { --status-new: #4cc9ff; --status-confirmed: #b99aff; --status-packed: #f8b84e; --status-picked: #45e58e; --status-canceled: #c9ced6; }
.order-detail .detail-heading h2 { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin-bottom: 12px; }
.detail-flag { padding: 3px 10px; border: 1px solid #c79a3c; border-radius: 999px; background: #4a34107a; color: #ffd98a; font-size: 12px; font-style: normal; font-weight: 700; letter-spacing: .03em; }
.order-detail .detail-facts { grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); margin-bottom: 12px; }
.order-detail .detail-facts div { padding: 10px 12px; }
.workspace .stage-track { margin: 0; }
.workspace .stage.current.new { color: var(--status-new); border-color: #4cc9ff75; }
.workspace .stage.current.confirmed { color: var(--status-confirmed); border-color: #b99aff75; box-shadow: inset 0 1px #ffffff3d, 0 0 18px #b99aff24; }
.workspace .stage.current.packed { color: var(--status-packed); border-color: #f8b84e75; box-shadow: inset 0 1px #ffffff3d, 0 0 18px #f8b84e24; }
.workspace .stage.current.picked_up { color: var(--status-picked); border-color: #45e58e75; box-shadow: inset 0 1px #ffffff3d, 0 0 18px #45e58e24; }
.workspace .stage-help { margin: 6px 6px 10px; }
.order-detail > .sync-note { margin: 0 6px 10px; color: #ffd98a; }
.order-detail .next-action { grid-template-columns: 1fr auto; align-items: center; gap: 2px 14px; margin: 0 0 4px; padding: 10px 14px; }
.order-detail .next-action small { grid-column: 1 / -1; }
.order-detail .detail-tabs { margin: 14px 0 4px; }
.card-top .card-status.status-new { color: var(--status-new); border-color: #4cc9ff5c; background: #4cc9ff17; }
.card-top .card-status.status-confirmed { color: var(--status-confirmed); border-color: #b99aff57; background: #b99aff17; }
.card-top .card-status.status-packed { color: var(--status-packed); border-color: #f8b84e57; background: #f8b84e17; }
.card-top .card-status.status-picked_up { color: var(--status-picked); border-color: #45e58e57; background: #45e58e17; }
.card-top .card-status.status-canceled, .card-top .card-status.status-cancelled, .card-top .card-status.status-other { color: var(--status-canceled); border-color: #e5e7eb42; background: #e5e7eb12; }
.detail-address { border-left: 3px solid var(--status-confirmed); background: linear-gradient(135deg, #b99aff1f, #0a0d15da 60%); }
.detail-address p { font-size: 16px; font-weight: 500; }
.detail-address .detail-missing { color: #ffd98a; font-size: 14px; }
.workspace .detail-address .detail-map-link { color: #d9c9ff; font-size: 14px; text-decoration: underline; }
.paper-goods-compact { padding: 0; }
.paper-goods-compact summary, .paper-goods-static { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; padding: 14px 18px; list-style: none; }
.paper-goods-compact summary { cursor: pointer; }
.paper-goods-compact summary::-webkit-details-marker { display: none; }
.paper-goods-plan { flex: 1 1 160px; color: #d5dbe4; }
.paper-goods-choice { padding: 3px 10px; border: 1px solid #5d6672; border-radius: 999px; color: #d5dbe4; font-size: 12px; }
.paper-goods-change { color: #f2bed0; font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.paper-goods-compact[open] .paper-goods-change { visibility: hidden; }
.paper-goods-compact > .sync-note, .paper-goods-compact > form { margin-left: 18px; margin-right: 18px; }
.paper-goods-compact > form { margin-bottom: 16px; }
.paper-goods-compact summary:focus-visible { outline: 3px solid #80d8f2; outline-offset: 2px; border-radius: 16px; }
.detail-team .order-owner { margin: 0 0 10px; }
.detail-team .order-owner:last-child { margin-bottom: 0; }
.order-detail .order-edit { margin: 15px 0 0; }
.order-detail > .source-revision { margin-top: 12px; }
@media (max-width: 1250px) { .order-detail .detail-facts { grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); } }
@media (max-width: 750px) { .order-detail .detail-facts { grid-template-columns: repeat(2, 1fr); } .order-detail .next-action { grid-template-columns: 1fr; } }
@media (max-width: 750px) { .order-detail .detail-heading h2 { flex-basis: 100%; } }
.list-meta { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px; }.workspace .list-meta a { color: #b9e5f4; text-decoration: underline; text-underline-offset: 3px; }

/* Status chosen by a person, and orders canceled in the hosted workspace. */
.workspace .stage-warning { color: var(--status-packed); font-weight: 700; }
.canceled-panel { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; margin: 0 0 10px; padding: 12px 16px; border: 1px solid #e5e7eb42; border-left: 3px solid var(--status-canceled); border-radius: 14px; background: #1b1f27e0; }
.canceled-panel strong, .canceled-panel small { display: block; }
.canceled-panel small { margin-top: 4px; color: #b7bfcd; line-height: 1.4; }
.canceled-panel form { margin: 0; }
.canceled-panel button, .order-cancel button { min-height: 44px; padding: 9px 16px; border: 1px solid #9f7180; border-radius: 10px; background: #35212b; color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.canceled-panel button:disabled, .order-cancel button:disabled { opacity: .55; cursor: default; }
.order-cancel { margin-top: 12px; border: 1px solid #3d4654; border-radius: 14px; background: #171d28; }
.order-cancel summary { padding: 11px 16px; color: #d5dbe4; font-weight: 700; cursor: pointer; }
.order-cancel p { margin: 0 16px 10px; color: #cdd6e1; font-size: 14px; line-height: 1.45; }
.order-cancel form { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 0 16px 14px; }
.order-cancel small { color: #ffd98a; }
.order-cancel summary:focus-visible, .canceled-panel button:focus-visible, .order-cancel button:focus-visible { outline: 3px solid #80d8f2; outline-offset: 2px; }

/* Order detail: native-style message button, saved customer and last message. */
.detail-message-action .message-link-primary { border-color: #e47791; background: linear-gradient(#d53a61, #a51e3f); color: #fff; }
.detail-message-action .message-state-submitted { border-color: #45e58e75; color: var(--status-picked); }
.detail-message-action .message-state-queued, .detail-message-action .message-state-submitting, .detail-message-action .message-state-approved { border-color: #f8b84e75; color: var(--status-packed); }
.detail-message-action .message-state-unknown, .detail-message-action .message-state-failed { border-color: #ff9bad; color: #ffc2cd; }
.saved-customer-heart { color: #ff6f91; font-size: 20px; }
.customer-panel .customer-badges { margin-bottom: 12px; }
.customer-panel .customer-visits { border-color: #45e58e57; background: #45e58e17; color: var(--status-picked); }
.customer-panel h4 { margin: 16px 0 4px; color: #aab5c2; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.customer-panel .customer-text { white-space: pre-wrap; }
.customer-favorites { margin: 4px 0 0; padding-left: 20px; }
.customer-panel .sync-note, .last-message .sync-note { margin: 12px 0 0; }
.last-message-body { margin: 10px 0 0; padding: 12px 14px; max-height: 260px; overflow: auto; border: 1px solid #36404d; border-radius: 12px; background: #0f141c; color: #e7ecf2; font: inherit; white-space: pre-wrap; overflow-wrap: anywhere; }
.order-detail .detail-heading h2 .saved-customer-heart { flex-basis: auto; color: #ff6f91; font-size: 20px; letter-spacing: 0; }
.workspace .customer-panel a, .workspace .last-message a { color: #bfe7fa; text-decoration: underline; text-underline-offset: 3px; }

/* Native-style sidebar: the real app icon and full-colour SVG equivalents of
   the Mac app's navigation emoji. */
.workspace-sidebar img.brand-mark { display: block; width: 48px; height: 48px; flex: 0 0 48px; border-radius: 12px;
  object-fit: cover; background: #c8102e; box-shadow: 0 10px 24px rgba(227,24,55,.28), inset 0 1px 0 rgba(255,255,255,.3); }
.sidebar-navigation .nav-icon { display: inline-grid; place-items: center; }
.sidebar-navigation .nav-svg { display: block; width: 20px; height: 20px; filter: drop-shadow(0 1px 1px rgba(0,0,0,.35)); }
.nav-utility .nav-icon { display: inline-grid; place-items: center; width: 18px; vertical-align: -4px; margin-right: 4px; }
.nav-utility .nav-svg { width: 16px; height: 16px; }
@media (max-width: 1100px) { .workspace-sidebar img.brand-mark { width: 36px; height: 36px; flex-basis: 36px; } }
/* "Team & review" is a quiet, labelled group in the shared sidebar. */
.sidebar-navigation .nav-group { margin: 10px 0 0; }
.sidebar-navigation .nav-group > summary { display: flex; align-items: center; gap: 12px; min-height: 38px; padding: 6px 14px; border: 1px solid transparent; border-radius: 999px; color: #a6adb8; font-size: 13px; font-weight: 600; letter-spacing: .02em; cursor: pointer; list-style: none; }
.sidebar-navigation .nav-group > summary::-webkit-details-marker { display: none; }
.sidebar-navigation .nav-group > summary:hover { color: #fff; border-color: #ebf5ff33; }
.sidebar-navigation .nav-group > summary:focus-visible { outline: 2px solid #f3acbd; outline-offset: 2px; }
.sidebar-navigation .nav-group > summary > span:nth-child(2) { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-navigation .nav-group .nav-chevron { flex: 0 0 auto; font-size: 14px; transition: transform .15s; }
.sidebar-navigation .nav-group[open] .nav-chevron { transform: rotate(180deg); }
.sidebar-navigation .nav-group-links { margin: 3px 0 0 10px; padding-left: 8px; border-left: 1px solid #39404c; }
.sidebar-navigation .nav-group-links .nav-link { min-height: 38px; font-size: 13px; }
@media (prefers-reduced-motion: reduce) { .sidebar-navigation .nav-group .nav-chevron { transition: none; } }
/* Phones: brand, store and Sign out share one row and the destinations are
   one swipeable row, so navigation never fills the first screen. The phone
   Sign out sits in the brand row in the page itself, so keyboard and reading
   order match what is drawn; the desktop footer copy is not rendered here. */
.workspace-sidebar .brand-signout, .workspace-sidebar .brand .brand-store { display: none; }
@media (max-width: 750px) {
  .workspace-sidebar { display: block; padding: 0 12px 6px; }
  .workspace-sidebar .brand { min-width: 0; margin: 0; padding: 8px 0; border-bottom: 0; }
  .workspace-sidebar .brand > div { flex: 1 1 auto; min-width: 0; }
  .workspace-sidebar .brand small { display: none; }
  .workspace-sidebar .brand .brand-store { display: block; font-size: 11px; letter-spacing: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .workspace-sidebar .brand strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .workspace-sidebar .brand-signout { display: block; flex: 0 0 auto; margin: 0; }
  .workspace-sidebar .brand-signout button { min-height: 40px; padding: 6px 12px; border: 1px solid #872a3b; border-radius: 8px; background: #450c19; color: #fff; font: inherit; font-size: 13px; cursor: pointer; white-space: nowrap; }
  .workspace-sidebar .brand-signout button:focus-visible { outline: 2px solid #f3acbd; outline-offset: 2px; }
  .workspace-sidebar .sidebar-footer { display: none; }
  .sidebar-navigation { padding: 2px 0 6px; scroll-snap-type: x proximity; }
  .sidebar-navigation .nav-link, .sidebar-navigation .nav-utility { scroll-snap-align: start; }
  .sidebar-navigation .nav-group { display: flex; flex: 0 0 auto; align-items: center; gap: 6px; margin: 0; }
  .sidebar-navigation .nav-group > summary { display: inline-flex; gap: 8px; min-height: 40px; box-sizing: border-box; padding: 8px 14px; border-color: #ebf5ff14; color: #d5dbe4; white-space: nowrap; }
  .sidebar-navigation .nav-group[open] > summary { border-color: #ebf5ff47; color: #fff; }
  .sidebar-navigation .nav-group[open] .nav-chevron { transform: rotate(-90deg); }
  .sidebar-navigation .nav-group-links { display: flex; gap: 6px; margin: 0; padding: 0; border: 0; }
  .sidebar-navigation .nav-group-links .nav-link { min-height: 40px; font-size: 14px; }
}
/* Tablets and desktops at 200% zoom use the narrower sidebar. Tighten its rows
   so "Packing Station" and "Team & review" are not cut short and the store
   line stays on one row with Sign out. */
@media (min-width: 751px) and (max-width: 1250px) {
  .sidebar-navigation .nav-link { gap: 8px; padding: 8px 10px; font-size: 13px; }
  .sidebar-navigation .nav-group > summary { gap: 8px; padding: 6px 10px; }
  .sidebar-navigation .nav-group-links { margin-left: 6px; padding-left: 6px; }
  .sidebar-navigation .nav-group-links .nav-link { font-size: 12.5px; }
  .workspace-sidebar .sidebar-footer { gap: 8px; padding-left: 12px; padding-right: 12px; font-size: 11px; }
  .workspace-sidebar .sidebar-footer > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .workspace-sidebar .sidebar-footer button { flex: 0 0 auto; white-space: nowrap; }
}
/* Page titles use the same native-style icons as their sidebar entries. */
h1 .title-icon { display: inline-grid; place-items: center; margin-right: 8px; vertical-align: -3px; }
h1 .title-icon .nav-svg { width: 24px; height: 24px; filter: drop-shadow(0 1px 1px rgba(0,0,0,.35)); }
/* Product administration pages (Bron only) */
.admin-page { max-width: 1200px; margin: 0 auto; padding: 1rem; }
.admin-page label { display: block; margin: .5rem 0; }
.admin-page input, .admin-page select { max-width: 100%; }
.admin-nav { margin: .5rem 0 1rem; }
.inline-form { display: inline; }
.filters label { display: inline-block; margin-right: 1rem; }
pre.technical { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 30rem; overflow: auto; }
.admin-page .settings-card form, .admin-page .settings-card label { grid-template-columns: minmax(0, 1fr); }
.admin-page select { width: 100%; min-width: 0; text-overflow: ellipsis; }
/* Sign-in: the remembered-store choice matches the other fields. */
#saved-store { display: block; box-sizing: border-box; width: 100%; max-width: 420px; margin-top: .4rem; padding: .8rem; font: inherit; }
/* The hosted version under the store name, on every workspace page. */
.sidebar-footer .sidebar-version { display: block; margin-top: 3px; color: #8f9aa6; font-size: 11px; text-decoration: none; }
.sidebar-footer .sidebar-version:hover, .sidebar-footer .sidebar-version:focus-visible { color: #dfe5ee; text-decoration: underline; }
/* Collector controls on Connection status. */
.collector-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-top: 12px; }
.collector-controls form { margin: 0; }
.collector-controls p, .collector-controls small { flex-basis: 100%; margin: 0; color: #c5ccd6; }
.collector-controls button:disabled { opacity: .5; cursor: default; }
.workspace a.collector-reset-link { color: #ffb4c2; text-decoration: underline; }
.workspace .collector-reset-link.is-disabled { color: #8f9aa6; text-decoration: none; }
.collector-confirm label { display: flex; align-items: flex-start; gap: 10px; margin: 14px 0; }
.collector-confirm input[type=checkbox] { display: inline-block; flex: none; width: 22px; height: 22px; margin: 2px 0 0; padding: 0; }
.collector-actions { margin: 6px 0 0; padding-left: 18px; }
.collector-actions li { margin: 4px 0; }
.collector-control-error { padding: 10px 12px; border: 1px solid #f08a8a; border-radius: 10px; background: #3a1418; color: #ffd7d7; }
.order-card .card-top .saved-customer-heart { margin-left: 6px; font-size: 14px; }
/* Get CaterCom guide and the quiet sign-in link. */
.quiet-link { font-size: .92rem; color: #596371; } .quiet-link a { color: inherit; }
.get-catercom .guide-steps li { margin: .35rem 0; } .get-catercom .guide-note, .get-catercom .platform-note { color: #596371; }
.get-catercom .platform-choices { display: flex; flex-wrap: wrap; gap: .4rem .9rem; font-size: .92rem; margin-top: 1rem; }