:root {
  color-scheme: light;
  font-family: "Microsoft YaHei UI", "Segoe UI", system-ui, sans-serif;
  line-height: 1.55;
  color: #182638;
  background: #f2f5f8;
  --ink: #182638;
  --muted: #536579;
  --line: #dce4ec;
  --primary: #14655a;
  --soft: #e5f4ee;
  --surface: #fff;
  --wash: #f5f8fa;
  --shadow: 0 2px 5px #18263806, 0 10px 24px #18263805;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; display: grid; grid-template-columns: 236px minmax(0, 1fr); min-height: 100vh; }
button, input, select, textarea { font: inherit; }
button { border: 1px solid var(--line); border-radius: 9px; background: var(--surface); color: var(--ink); padding: .56rem .85rem; cursor: pointer; white-space: nowrap; font-size: 13px; font-weight: 600; }
button:hover { background: #edf5f4; border-color: #adc9c5; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, a:focus-visible { outline: 2px solid #378f7e; outline-offset: 2px; }
button:disabled { opacity: .55; cursor: default; }
.primary { background: var(--primary); color: white; border-color: var(--primary); }
.primary:hover { background: #104e46; border-color: #104e46; }
.danger { color: #a72c2c; }
.sidebar { background: linear-gradient(165deg, #172d40, #102132 66%); color: #e7edf3; padding: 23px 14px 16px; display: flex; flex-direction: column; height: 100dvh; position: sticky; top: 0; }
.sidebar-header { margin: 1px 5px 23px; }
.brand { display: flex; align-items: center; gap: 11px; min-width: 0; }
.brand-mark { display: block; width: 39px; height: 39px; flex: 0 0 39px; }
.brand-controls { min-width: 0; }
.language-picker { display: flex; gap: 2px; width: fit-content; margin-top: 9px; padding: 2px; border: 1px solid var(--line); border-radius: 8px; background: var(--wash); }
.language-picker button { padding: 4px 9px; border: 0; border-radius: 5px; background: transparent; color: var(--muted); font-size: 12px; }
.language-picker button[aria-pressed="true"] { background: var(--soft); color: var(--primary); }
.sidebar .language-picker { border-color: #425d6e; background: #122738; }
.sidebar .language-picker button { color: #ccdde7; }
.sidebar .language-picker button[aria-pressed="true"] { background: #c4f2df; color: #143d37; }
.sidebar-foot b { font-weight: 400; }
.brand strong { display: block; font-size: 16px; }
.brand small { color: #a9c0cf; font-size: 9px; letter-spacing: .17em; }
.menu-toggle { display: none; }
.menu-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.nav-group { color: #a1b9c9; margin: 19px 11px 7px; font-size: 11px; font-weight: 650; letter-spacing: .05em; }
nav { flex: 1; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #466478 transparent; }
nav button, .nav-link { width: 100%; min-height: 39px; display: flex; align-items: center; gap: 11px; text-align: left; border: 0; background: transparent; color: #d8e5ec; padding: 9px 11px; margin: 2px 0; font-size: 13px; font-weight: 550; line-height: 1.4; }
nav button:not(.sales-toggle), .nav-link { white-space: normal; }
.nav-link { text-decoration: none; border-radius: 8px; }
.button-link { display: inline-block; text-decoration: none; color: var(--ink); background: white; border: 1px solid var(--line); border-radius: 7px; padding: .52rem .72rem; }
.button-link:hover { background: #eef5f6; }
nav button:hover, .nav-link:hover { background: #233d4e; }
nav button[aria-current="page"] { background: #214c48; color: #ecfff8; box-shadow: inset 3px 0 #87ddbf; font-weight: 700; }
.sales-nav-row { display: flex; gap: 3px; }
.sales-nav-row > button:first-child { flex: 1; min-width: 0; }
nav .sales-toggle { width: auto; padding-inline: 10px; justify-content: center; }
.sales-toggle[aria-expanded="true"] { transform: rotate(180deg); }
.sales-submenu { border-left: 1px solid #395062; margin-left: 17px; padding-left: 8px; }
.sales-submenu button { width: 100%; }
.nav-icon { color: #a5d6c8; flex: 0 0 18px; text-align: center; font-size: 15px; line-height: 1; }
.sidebar-foot { color: #aec2cf; font-size: 11px; padding: 12px 8px 0; border-top: 1px solid #395062; }
.sidebar-foot span { float: right; }
.sidebar-foot i { display: inline-block; background: #79e1bd; width: 7px; height: 7px; border-radius: 50%; margin-right: 3px; }
.workspace { min-width: 0; }
.topbar { min-height: 62px; border-bottom: 1px solid var(--line); background: var(--surface); padding: 0 clamp(16px, 3vw, 40px); display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 13px; }
.local-label { display: inline-flex; align-items: center; gap: 7px; border-radius: 20px; padding: 5px 10px; background: var(--soft); color: var(--primary); white-space: nowrap; font-size: 12px; }
.local-label::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
main { padding: 28px clamp(15px, 3vw, 40px) 50px; margin: auto; max-width: 1560px; }
.page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px 26px; margin-bottom: 26px; }
.page-head > div:first-child { min-width: 0; }
.page-head > .actions { max-width: 100%; justify-content: flex-end; }
h1, h2, p { margin: 0; }
h1 { font-size: clamp(26px, 3vw, 36px); line-height: 1.23; overflow-wrap: anywhere; }
h2 { font-size: 18px; line-height: 1.4; }
.page-head p, .muted { color: var(--muted); font-size: 13px; line-height: 1.65; }
.page-head p { max-width: 68ch; margin-top: 9px; font-size: 14px; }
.toolbar, .actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.toolbar { gap: 10px 12px; margin-bottom: 18px; }
.toolbar > input { flex: 1 1 220px; max-width: 380px; }
.toolbar > select { flex: 0 1 auto; width: auto; min-width: 130px; max-width: 100%; }
.panel, .metric { min-width: 0; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); }
.panel { padding: clamp(15px, 2vw, 23px); margin-bottom: 20px; }
.panel h2 { margin-bottom: 14px; }
.customer-profile { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 14px; margin: 0; font-size: 13px; }
.customer-profile dt { color: var(--muted); }
.customer-profile dd { margin: 4px 0 0; overflow-wrap: anywhere; }
.preserve-lines { white-space: pre-wrap; }
.metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(135px, 1fr)); gap: 13px; margin: 0 0 18px; }
.metric { padding: 16px; }
.metric small { display: block; color: var(--muted); margin-bottom: 9px; font-size: 13px; }
.metric strong { font-size: 25px; font-variant-numeric: tabular-nums; }
.overview-hero { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: end; justify-content: space-between; gap: 18px; padding: clamp(19px, 4vw, 38px); margin-bottom: 19px; border-radius: 19px; background: linear-gradient(115deg, #14293f 15%, #174856 71%, #206456); color: #f4fbfd; }
.overview-hero::after { content: ""; position: absolute; z-index: -1; inset: 0; background: repeating-radial-gradient(ellipse at 84% 115%, transparent 0 26px, #a2f2d61c 27px 28px, transparent 29px 47px); mask-image: linear-gradient(90deg, transparent 26%, black 75%); }
.overview-heading { min-width: 0; }
.overview-kicker { color: #b2e9d9; font-size: 10px; font-weight: 700; letter-spacing: .17em; }
.overview-hero h1 { margin: 9px 0 7px; }
.overview-hero p { color: #d2e5eb; font-size: 13px; overflow-wrap: anywhere; }
.overview-actions { display: flex; flex-direction: column; align-items: end; gap: 11px; }
.overview-actions time { white-space: nowrap; color: #d2e5eb; font-size: 12px; font-variant-numeric: tabular-nums; }
.overview-actions .primary { background: #c2f1dd; color: #153d36; border-color: #c2f1dd; }
.overview-actions .primary:hover { background: #e2fff0; border-color: #e2fff0; }
.overview-metrics { grid-template-columns: repeat(auto-fit, minmax(min(100%, 140px), 1fr)); gap: 14px; }
.overview-metrics .metric { display: flex; flex-direction: column; justify-content: space-between; }
.overview-metrics .metric strong { font-size: clamp(23px, 3vw, 31px); line-height: 1.15; }
.columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.table-wrap { max-width: 100%; overflow: auto; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; }
table { width: 100%; border-collapse: collapse; font-size: 13px; text-align: left; }
table:has(th:nth-child(6)) { min-width: 690px; }
table:has(th:nth-child(9)) { min-width: 890px; }
th, td { padding: 14px 15px; border-bottom: 1px solid #e8edf2; vertical-align: middle; overflow-wrap: anywhere; }
th { font-weight: 700; color: #3d5267; background: #edf3f7; line-height: 1.4; }
.table-name { display: grid; gap: 3px; }
.table-name .muted { font-size: 12px; }
.table-wrap > table.catalog-table { min-width: 980px; }
.catalog-table :is(th, td) { padding-inline: 11px; }
.catalog-table td { vertical-align: top; }
.catalog-table :is(th, td):nth-child(-n+4) { min-width: 104px; }
.catalog-table :is(th, td):nth-child(2) { min-width: 143px; }
.catalog-table :is(th, td):nth-child(n+5):nth-child(-n+7) { min-width: 96px; }
.catalog-table :is(th, td):nth-child(8), .catalog-table :is(th, td):nth-child(9) { white-space: nowrap; }
.catalog-table :is(th, td):last-child { min-width: 120px; }
.catalog-table td:last-child .actions { flex-wrap: nowrap; }
.catalog-table td:first-child { font: 12px/1.6 Consolas, monospace; }
.orders-table :is(th, td):nth-child(3), .orders-table :is(th, td):nth-child(4) { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.orders-table td:last-child { min-width: 200px; }
tbody tr:hover { background: #f6fafb; }
tr:last-child td { border-bottom: 0; }
td button { font-size: 12px; padding: .38rem .55rem; }
.supplier-price-line { display: flex; align-items: center; min-height: 36px; white-space: nowrap; }
.supplier-price-line select { width: auto; min-width: 84px; min-height: 31px; padding: 4px 6px; }
.part-model-group { margin-bottom: 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); box-shadow: var(--shadow); }
.part-model-group > summary { padding: 12px 14px; border-radius: 12px; }
.part-model-group > summary:hover, .part-model-group[open] > summary { background: var(--wash); }
.part-model-group > summary .pill { margin-left: 6px; }
.part-model-group > .table-wrap { border: 0; border-top: 1px solid var(--line); border-radius: 0 0 10px 10px; }
.pill { background: var(--soft); color: var(--primary); padding: 4px 8px; display: inline-block; white-space: nowrap; border-radius: 16px; font-size: 12px; }
.empty { text-align: center; padding: 30px 18px; color: var(--muted); background: var(--wash); line-height: 1.75; }
input, select, textarea { min-width: 0; width: 100%; padding: 9px 11px; border: 1px solid #c4d0dc; background: var(--surface); color: var(--ink); border-radius: 9px; }
input:not([type="checkbox"], [type="radio"], [type="file"]), select { min-height: 42px; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--primary); }
textarea { min-height: 75px; resize: vertical; }
label { min-width: 0; display: flex; flex-direction: column; gap: 7px; font-size: 13px; line-height: 1.5; color: #37475a; }
.fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; }
.fields > label { justify-content: flex-end; }
.fields .wide { grid-column: 1 / -1; }
dialog { width: min(920px, calc(100vw - 26px)); max-height: calc(100dvh - 32px); padding: 0; border: 1px solid var(--line); border-radius: 17px; color: var(--ink); box-shadow: 0 24px 90px #14293952; }
dialog::backdrop { background: #101f31a8; }
#editor { display: flex; flex-direction: column; max-height: calc(100dvh - 36px); }
.dialog-head, .dialog-foot { flex: none; display: flex; justify-content: space-between; align-items: center; padding: 14px 20px; background: var(--wash); }
.dialog-head { border-bottom: 1px solid var(--line); }
.dialog-foot { justify-content: flex-end; flex-wrap: wrap; gap: 8px; border-top: 1px solid var(--line); }
.dialog-head .icon { padding: 1px 10px; font-size: 22px; }
#dialog-body { min-height: 0; padding: 22px; overflow: auto; overscroll-behavior: contain; }
#dialog-error { padding: 0 18px; color: #a72c2c; font-size: 13px; }
#dialog-error:not(:empty) { padding-bottom: 12px; }
.document-section, .line-section { margin: 20px 0 16px; }
.document-section h3, .line-section h3 { font-size: 15px; margin: 0 0 15px; }
.document-section { padding: 17px 18px; border: 1px solid var(--line); border-radius: 11px; }
.document-section .fields + .fields { margin-top: 16px; }
.line { display: grid; grid-template-columns: minmax(130px, 2fr) repeat(3, minmax(70px, 1fr)) auto; gap: 8px; align-items: end; padding: 10px; background: #f3f7f9; border-radius: 8px; margin-bottom: 7px; }
.line.ship-line { grid-template-columns: minmax(130px, 2fr) repeat(5, minmax(60px, 1fr)) auto; }
.line .icon { height: 37px; }
.doc-list { display: grid; gap: 9px; margin-top: 12px; }
.doc-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; padding: 10px; background: #f2f7f8; border-radius: 8px; }
.template-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; }
.template-card { margin: 0; }
.template-card h2 { margin: 7px 0 3px; }
.template-card button { margin-top: 11px; }
.doc-import { display: flex; gap: 8px; align-items: end; margin-bottom: 15px; }
.doc-import label { flex: 1; }
.doc-party-details { padding: 12px 14px; margin-bottom: 14px; background: var(--wash); border: 1px solid var(--line); border-radius: 11px; }
.doc-party-details .fields { margin-top: 10px; }
.doc-item { padding: 13px; border: 1px solid var(--line); border-radius: 11px; background: var(--wash); margin-bottom: 9px; }
.doc-item button { margin-top: 9px; }
.pi-currency { align-items: end; margin-bottom: 12px; }
.pi-product-search { margin: 10px 0 6px; }
.doc-party-details .pi-product-filters { grid-template-columns: repeat(auto-fit, minmax(min(100%, 155px), 1fr)); }
.pi-product-list { max-height: 180px; overflow: auto; margin: 6px 0; }
.pi-product-choice { display: flex; flex-direction: row; align-items: flex-start; padding: 5px 2px; }
.pi-product-choice input { width: auto; flex: 0 0 auto; }
.pi-product-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 3px 6px; border-radius: 7px; }
.pi-product-row:has(input:checked) { background: var(--soft); }
.pi-product-row .pi-product-choice span { overflow-wrap: anywhere; }
.pi-product-quantity { display: flex; flex-direction: row; align-items: center; white-space: nowrap; }
.pi-product-quantity input { width: 5.5rem; padding: 4px 6px; }
.calc-fields { margin-top: 13px; }
.calc-fields output { align-self: end; padding: 9px; background: var(--soft); border-radius: 7px; }
.pi-profit-form { margin-top: 12px; }
.pi-profit-form > label { max-width: 540px; margin-bottom: 12px; }
.pi-profit-tools { align-items: end; margin-bottom: 8px; }
.pi-profit-tools > label { min-width: 122px; max-width: min(100%, 290px); }
.pi-profit-tools > span { align-self: center; }
.pi-profit-scroll { max-height: 55vh; margin-top: 10px; }
.pi-profit-scroll .pi-profit-table { min-width: 1130px; table-layout: fixed; }
.pi-profit-table td, .pi-profit-table th { padding: 8px; vertical-align: top; }
.pi-profit-table thead th { position: sticky; top: 0; z-index: 1; }
.pi-profit-table tbody th { white-space: normal; background: transparent; }
.pi-profit-table td strong, .pi-profit-table td .muted { white-space: normal; }
.pi-profit-table label > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.pi-profit-table select, .pi-profit-table input { min-width: 0; padding: 6px; }
.pi-profit-line .pi-cost-note { margin-top: 4px; overflow-wrap: anywhere; }
.pi-select-col { width: 44px; }
.pi-item-col { width: 20%; }
.pi-sale-col { width: 11%; }
.pi-supplier-col { width: 14%; }
.pi-quote-col { width: 15%; }
.pi-qty-col, .pi-price-col { width: 7%; }
.pi-currency-col { width: 7%; }
.pi-profit-choice { text-align: center; }
.pi-profit-choice input { width: auto; }
#pi-profit-fx-source { margin: 12px 0; }
#pi-profit-fx-source .actions { margin: 6px 0; }
#pi-profit-rates { margin-bottom: 12px; }
#pi-profit-work > label { max-width: 300px; }
#pi-profit-work > button { margin: 10px 0; }
#pi-profit-error { color: #a12121; }
#pi-profit-result { margin-top: 12px; }
.pi-finance-panel { border: 1px solid var(--line); border-radius: 10px; padding: 14px; margin: 12px 0; }
.pi-finance-panel h3 { font-size: 15px; margin: 12px 0 6px; }
.pi-finance-panel h3:first-child { margin-top: 0; }
.pi-finance-panel .fields { margin: 8px 0; }
.pi-extra-cost { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(76px, .55fr) auto; align-items: end; gap: 8px; margin-bottom: 8px; }
.pi-profit-summary { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 24px; padding: 12px 14px; background: var(--soft); border: 1px solid var(--line); border-radius: 10px; }
.pi-profit-summary > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px 8px; }
.pi-profit-summary span { font-size: 13px; }
.pi-profit-summary strong { font-size: 19px; }
#pi-profit-details-toggle { font-size: 12px; padding: 4px 9px; }
.pi-profit-details { padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; margin-top: 8px; }
.pi-profit-details dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px 14px; margin: 0 0 12px; }
.pi-profit-details dt { font-size: 12px; }
.pi-profit-details dd { margin: 2px 0 0; font-weight: 650; }
.pi-profit-details h3 { font-size: 14px; margin: 0 0 8px; }
.pi-profit-details p { font-size: 13px; margin: 0 0 6px; }
@media (max-width: 540px) {
  .pi-extra-cost { grid-template-columns: 1fr 1fr; }
  .pi-extra-cost > label:first-child { grid-column: 1 / -1; }
  .pi-extra-cost > button { grid-column: 2; justify-self: end; }
}
summary { cursor: pointer; color: var(--primary); font-weight: 650; }
summary:focus-visible { outline: 2px solid #378f7e; outline-offset: 2px; }
.stat { font-variant-numeric: tabular-nums; white-space: nowrap; }
.hint { padding: 11px 13px; border-radius: 8px; background: #ebf6f2; color: #224b44; font-size: 13px; line-height: 1.7; margin-bottom: 14px; }
.section-title { margin: 23px 0 9px; }
#toast { position: fixed; right: 18px; bottom: 18px; max-width: min(460px, calc(100vw - 36px)); background: #163e36; color: white; padding: 12px 16px; border-radius: 8px; box-shadow: 0 5px 24px #0003; z-index: 3; font-size: 13px; }
#print-preview { position: fixed; inset: 0; z-index: 2; background: #edf3f6; display: grid; grid-template-rows: auto minmax(0, 1fr); }
.preview-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 20px; background: white; border-bottom: 1px solid var(--line); }
#print-frame { width: min(100%, 930px); height: 100%; margin: auto; border: 0; background: white; }
.team-page { display: block; }
.team-page .topbar { gap: 14px; flex-wrap: wrap; padding-block: 9px; }
.team-page .brand { color: var(--ink); }
.team-page .brand small { color: var(--muted); }
.team-page .topbar a:not(.primary), .team-page table a { color: var(--primary); }
.team-page .topbar button { font-size: 12px; }
.team-page .panel { overflow-wrap: anywhere; }
.team-account-panel { max-width: 500px; margin-inline: auto; padding: clamp(18px, 4vw, 30px); }
.team-form { display: grid; gap: 16px; margin-top: 16px; }
.team-tabs { padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.report-plan-fields > label.wide { grid-column: auto; }
#team-report-editor textarea { min-height: 104px; }
.team-form > button { justify-self: start; }
.team-form .team-confirm { display: flex; flex-direction: row; gap: 8px; align-items: baseline; }
.team-confirm input { width: auto; }
.team-workspace-link { display: inline-flex; align-items: center; min-height: 40px; padding: 8px 14px; border-radius: 8px; text-decoration: none; }
.team-phone { display: flex; align-items: stretch; }
.team-phone output { display: grid; place-items: center; min-width: 54px; padding: 0 8px; border: 1px solid var(--line); border-right: 0; border-radius: 8px 0 0 8px; background: var(--soft); }
.team-phone input { min-width: 0; flex: 1; border-radius: 0 8px 8px 0; }
.team-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; margin: 12px 0; }
.report-history-head { display: flex; align-items: end; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.report-history-head h2 { margin-bottom: 3px; }
.report-history-head .team-toolbar { margin: 0; }
.report-history-summary { display: flex; flex-wrap: wrap; gap: 8px; margin: 15px 0; }
.report-status { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; border-radius: 6px; background: #eef2f7; color: #44566c; white-space: nowrap; font-size: 12px; }
.report-status-report { color: var(--primary); background: var(--soft); }
.report-status-leave { color: #80510d; background: #fff1d7; }
.report-status-missing { color: #a12632; background: #ffe2e5; font-weight: 650; }
.report-history-summary .report-status:hover { border-color: currentColor; }
.team-page .report-history-summary .report-status[aria-pressed="true"] { border-color: currentColor; }
.team-page .report-history-summary .report-status-missing[aria-pressed="true"] { color: #a12632; background: #ffe2e5; }
.team-page .report-history-summary .report-status-leave[aria-pressed="true"] { color: #80510d; background: #fff1d7; }
.report-history tr:has(.report-status-missing) td { background: #fff1f2; border-bottom-color: #f6d8db; }
.report-history tr:has(.report-status-missing) td:first-child { box-shadow: inset 3px 0 #c63846; }
.report-history time { font-weight: 650; white-space: nowrap; }
.report-weekday { display: block; margin-top: 2px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.report-excerpt { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; white-space: pre-wrap; min-width: 100px; }
.report-details dl { display: grid; gap: 8px; margin: 8px 0; }
.report-details dt { color: var(--muted); font-size: 12px; }
.report-details dd { margin: 2px 0 0; }
.report-customers { min-width: 0; margin: 0; padding: 12px; border: 1px solid var(--line); border-radius: 8px; }
.report-customers legend { padding: 0 5px; font-weight: 650; }
.report-customers details, .report-customer-options { margin-top: 8px; }
.report-customer-search { display: grid; grid-template-columns: minmax(0, 190px) minmax(0, 1fr); gap: 8px; margin-bottom: 8px; }
.report-customer-options { display: grid; gap: 6px; max-height: 240px; overflow: auto; }
.report-customer-option { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 8px; padding: 6px 8px; border: 1px solid transparent; border-radius: 6px; background: #f4f7fa; cursor: pointer; }
.report-customer-option:hover { border-color: var(--line); }
.report-customer-option:has(input:checked) { border-color: #8abdad; background: var(--soft); }
.report-customer-option input { width: auto; }
.report-customer-option small { display: block; color: var(--muted); }
.report-customer-tag { margin-left: auto; color: var(--primary); font-size: 12px; }
.ticket-create > summary { font-size: 17px; }
.ticket-create > p { margin-top: 8px; }
.ticket-contact-fields { min-width: 0; margin: 0; padding: 10px; border: 1px solid var(--line); border-radius: 8px; }
.ticket-contact-fields legend { padding: 0 5px; font-weight: 650; font-size: 13px; }
.ticket-detail-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; }
.ticket-status-working { background: #e3f0ff; color: #184b82; }
.ticket-status-waiting { background: #fff1d7; color: #80510d; }
.ticket-status-resolved { background: var(--soft); color: var(--primary); }
.ticket-urgent { display: inline-block; margin-left: 6px; color: #a12632; font-size: 12px; font-weight: 650; }
.ticket-activity { display: grid; gap: 8px; padding: 0; margin: 0; list-style: none; }
.ticket-activity li { padding: 10px; border: 1px solid var(--line); border-radius: 8px; }
@media (max-width: 560px) { .report-customer-search { grid-template-columns: 1fr; } }
.team-page [aria-pressed="true"] { background: var(--soft); color: var(--primary); border-color: var(--primary); }
.team-pagination { margin-top: 12px; }
.team-message { position: fixed; bottom: 14px; right: 14px; max-width: min(460px, calc(100vw - 28px)); padding: 12px 15px; border-radius: 8px; background: var(--primary); color: white; box-shadow: 0 3px 12px #0003; }
.team-message.team-error { background: #a72c2c; }
@media (max-width: 850px) {
  body { grid-template-columns: 192px minmax(0, 1fr); }
  .sidebar { padding-inline: 10px; }
  .sidebar .brand strong { font-size: 14px; }
  .columns { grid-template-columns: 1fr; gap: 0; }
  .page-head { align-items: flex-start; flex-direction: column; }
  .page-head > .actions { justify-content: flex-start; }
  .line, .line.ship-line { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  body { display: block; }
  .sidebar { height: auto; position: static; padding: 12px 15px; }
  .sidebar-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0; }
  .sidebar nav { margin-top: 10px; max-height: 55dvh; }
  .sidebar-header:has(.menu-toggle[aria-expanded="false"]) + nav { display: none; }
  .menu-toggle { display: inline-flex; align-items: center; gap: 6px; background: #233d50; border-color: #486375; color: #eef5fa; }
  .menu-toggle:hover { background: #2e4b60; border-color: #7490a2; }
  .sidebar-foot { display: none; }
  .workspace > .topbar { min-height: 48px; }
  main { padding-top: 20px; }
}
@media (max-width: 560px) {
  .fields { grid-template-columns: 1fr; }
  .overview-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .document-section { padding: 13px; }
  .overview-hero { flex-wrap: wrap; }
  .overview-actions { width: 100%; flex-direction: row; align-items: center; justify-content: space-between; }
  .dialog-head, .dialog-foot, #dialog-body { padding-inline: 13px; }
  .doc-import { align-items: stretch; flex-direction: column; }
  .line, .line.ship-line { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .line > label:first-child { grid-column: 1 / -1; }
  .pi-product-quantity input { width: 3.6rem; }
  .preview-bar { align-items: flex-start; flex-wrap: wrap; padding-inline: 12px; }
}
