/* Application chrome only: document templates and print styles stay independent. */
@media screen {
    :root { --muted:#657780; --line:#dfe7e5; --bg:#f3f6f5; }
    body { background:radial-gradient(ellipse at top left,#e7f2ec80,transparent 55%),var(--bg); }
    .topbar { min-height:80px;height:auto;padding:18px 3%;gap:24px; }
    .brand-mark { background:#173f35;box-shadow:0 4px 12px #173f3520; }
    .brand-label { letter-spacing:1.2px; }
    .workspace-label { justify-content:flex-end; }
    main { padding:24px 3% 28px;max-width:1680px; }
    .button { min-height:42px;font-size:13px;border-radius:10px;justify-content:center; }
    .primary { box-shadow:0 3px 8px #227c651a; }
    :where(button,a,input,textarea,select,[tabindex]):focus-visible { outline:3px solid #227c65;outline-offset:3px; }
    .search:focus-within { border-color:var(--green);box-shadow:0 0 0 3px #227c6514; }
    input:focus,textarea:focus,select:focus { border-color:var(--green); }
    .workspace-nav { display:flex;justify-content:space-between;align-items:center;gap:16px;border-bottom:1px solid var(--line);padding:0 0 18px;margin-bottom:28px; }
    .workspace-views,.workspace-shortcuts { display:flex;gap:6px;flex-wrap:wrap; }
    .workspace-views { padding:5px;background:#e7eeeb;border-radius:12px; }
    .workspace-nav button { border:0;background:transparent;color:#566c62;font-size:13px;font-weight:600;min-height:42px;padding:10px 18px;border-radius:9px; }
    .workspace-nav button.active { background:white;color:#184e3c;box-shadow:0 2px 5px #183f3510; }
    .workspace-nav button:hover { color:var(--green);background:#ffffff80; }
    .workspace-nav button.active:hover { background:white; }
    .page-heading { margin-bottom:26px; }
    .page-heading h1 { font-size:clamp(26px,2.6vw,38px);letter-spacing:-1.3px;font-weight:700;line-height:1.15;margin:12px 0; }
    .page-heading p { font-size:14px;line-height:1.7;max-width:680px; }
    .eyebrow { color:#63796e;letter-spacing:1.4px; }
    .workspace[data-workspace-view=editor] .dashboard,.workspace[data-workspace-view=editor] .overview-create { display:none; }
    .workspace[data-workspace-view=overview] .workbench,.workspace[data-workspace-view=overview] .workflow-guide { display:none; }
    .workflow-guide { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:24px; }
    .workflow-guide button { display:flex;align-items:center;gap:12px;padding:15px 18px;border:1px solid var(--line);border-radius:12px;background:#ffffffa6;text-align:left;min-width:0; }
    .workflow-guide button:hover { border-color:#9ebcaf;background:white; }
    .workflow-guide button>span:last-child { min-width:0; }
    .workflow-guide strong { display:block;font-size:13px; }
    .workflow-guide small { display:block;font-size:12px;color:var(--muted);margin-top:5px;overflow-wrap:anywhere; }
    .workflow-number { width:32px;height:32px;display:grid;place-items:center;flex-shrink:0;background:#eaf0ed;color:#536e61;border-radius:50%;font-weight:650; }
    .workflow-guide .complete .workflow-number { background:#227c65;color:white; }
    .workbench { grid-template-columns:minmax(250px,1fr) minmax(440px,1.85fr) minmax(270px,1fr);gap:20px; }
    .workbench>* { min-width:0; }
    .panel { border-radius:16px;box-shadow:0 4px 20px #173f3505; }
    .panel-heading { padding:18px 20px;min-height:76px; }
    .panel-heading h2 { font-size:16px; }
    .step { background:#edf3ef;color:#597263;font-size:11px;padding:7px; }
    .builder { border-color:#c4d8cc;box-shadow:0 8px 30px #173f3509; }
    .builder>.panel-heading { background:#f8fbf9; }
    .builder-body { padding:24px; }
    .builder label,.form-grid label,.notes-label { font-size:12px;font-weight:500; }
    .document-title h3 { font-size:23px; }
    .document-type-switch { padding:5px;background:#edf2ef;border-radius:12px;gap:4px; }
    .document-type-switch .button { flex:1;background:transparent;min-height:44px; }
    .document-type-switch .button.active { background:white;color:#19523f;box-shadow:0 2px 6px #183f3512; }
    .search { padding:10px 12px;border-radius:10px; }
    .search input { font-size:13px;min-height:24px; }
    .card-list { max-height:480px;scrollbar-width:thin; }
    .card-text strong { font-size:13px;line-height:1.5;overflow-wrap:anywhere; }
    .card-text small { font-size:11px;line-height:1.5; }
    .customer-card,.catalog-card { border-radius:11px;padding:14px 12px; }
    .customer-card.selected { box-shadow:inset 3px 0 var(--green); }
    .initials { width:36px;height:36px;background:#eaf0ef;color:#42695a; }
    .icon-button,.catalog-card .icon-button { min-width:36px;width:36px;height:36px;border-radius:8px; }
    #add-customer,#add-item,[data-add-item] { background:#e9f3ee;color:#1d6c51; }
    .text-button { min-height:32px;font-size:12px; }
    .customer-actions .text-button { font-size:12px; }
    .customer-utilities { border-top:1px solid #edf1ef;padding-top:5px; }
    .panel-foot { font-size:11px;line-height:1.5; }
    .drop-zone { border-radius:12px;padding:24px 16px;cursor:pointer; }
    .drop-zone:hover { border-color:#87b29e;background:#f1f8f4; }
    .drop-zone strong { font-size:14px; }
    .drop-zone span:last-child { font-size:12px;line-height:1.5; }
    .date-row input { min-height:44px;font-size:14px; }
    .date-help,.section-tools span { font-size:11px;line-height:1.6; }
    .section-caption h3 { font-size:14px; }
    .section-caption span { font-size:12px; }
    .position strong { font-size:13px;line-height:1.5; }
    .position small { font-size:11px; }
    .position input { min-height:42px; }
    .position .position-order button { min-width:32px;min-height:32px; }
    .position .line-price { font-size:13px; }
    .total-row { font-size:13px; }
    .total-row.grand { font-size:24px; }
    .total-row.grand span:first-child { font-size:14px; }
    .notes-label textarea { font-size:13px;line-height:1.6;padding:12px; }
    .builder-footer { background:#f5faf7; }
    .builder-footer>span { font-size:12px;line-height:1.5; }
    .tabs { flex-wrap:wrap; }
    .tabs button { font-size:12px;min-height:38px; }
    .catalog-tip strong { font-size:13px; }
    .catalog-tip p { font-size:12px; }
    .organization { background:#f8faf9;border-radius:10px; }
    .organization>p,.unassigned-field p { font-size:11px; }
    .folder-node { min-height:38px; }
    .dashboard { padding:24px;background:#ffffff70;border:1px solid var(--line);border-radius:16px; }
    .dashboard-heading h2 { font-size:21px; }
    .dashboard-heading p,.dashboard-note { font-size:12px; }
    .metric-card h3 { font-size:12px; }
    .metric-card p { font-size:12px; }
    .metric-balance { background:#184c3d;border-color:#184c3d; }
    .metric-balance h3,.metric-balance p { color:#d7e9df; }
    .metric-balance>strong { color:white; }
    dialog { border-radius:16px;box-shadow:0 24px 90px #102a3226; }
    dialog .dialog-heading h2 { font-size:18px; }
    dialog input,dialog select,dialog textarea { min-height:44px;font-size:14px; }
    .history-row { padding:20px 0; }
    .status-button { min-height:36px; }
    #notice { position:sticky;top:12px;z-index:5;border:1px solid #e7d6b8;box-shadow:0 6px 20px #183f350d;font-size:14px;line-height:1.5; }
    #notice.success { border-color:#bedac8; }
    .skip-link { position:fixed;top:10px;left:10px;z-index:50;transform:translateY(-150%);background:white;padding:14px;border-radius:8px;color:var(--green); }
    .skip-link:focus { transform:translateY(0); }
    .panel { scroll-margin-top:20px; }
    @media(max-width:1200px) {
        .workbench { grid-template-columns:minmax(250px,1fr) minmax(420px,1.8fr); }
        .catalog-panel { grid-column:1/-1; }
        .catalog-panel .card-list { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px; }
        .brand-label { display:none; }
    }
    @media(max-width:760px) {
        main { padding:18px 16px; }
        .topbar { padding:16px;gap:16px; }
        .workspace-label { justify-content:flex-start;gap:8px; }
        .workspace-label .button { min-height:42px;font-size:12px; }
        .account-name { max-width:none;margin-right:6px; }
        .workspace-nav { flex-direction:column;align-items:stretch;gap:10px;margin-bottom:24px; }
        .workspace-views button { flex:1;padding:10px; }
        .workspace-shortcuts button { padding:8px 12px; }
        .workflow-guide { gap:8px; }
        .workflow-guide button { flex-direction:column;align-items:flex-start;padding:12px 10px;gap:10px; }
        .workflow-guide strong { font-size:12px;line-height:1.5; }
        .workflow-guide small { display:none; }
        .workbench { display:flex; }
        .catalog-panel .card-list { grid-template-columns:1fr; }
        .builder-body { padding:18px; }
        .builder-footer { flex-wrap:wrap;padding:16px; }
        .builder-footer .primary { width:100%;min-height:48px; }
        .date-row { gap:12px; }
        .date-row label { min-width:0; }
        .position { grid-template-columns:minmax(0,1fr) 60px 65px 24px;gap:6px;padding:10px; }
        .position-heading { align-items:flex-start; }
        .position .line-price { font-size:12px;overflow-wrap:anywhere; }
        .dashboard { padding:18px 14px; }
        .metric-card { padding:16px 12px; }
        .form-grid label { min-width:0; }
        .document-type-switch .button { font-size:12px;padding:10px 8px; }
    }
    @media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important;transition:none!important;animation:none!important; } }
}
/* Records are selected and dragged in the organization panel; one detail pane follows. */
.organization-records { display:grid;gap:3px;margin:5px 0 12px calc(16px + var(--folder-depth,0)*12px);padding:0 0 0 9px;border-left:1px solid var(--line);max-height:280px;overflow:auto;scrollbar-width:thin; }
.organization-record { position:relative;display:flex;align-items:center;gap:10px;width:100%;min-height:44px;text-align:left;border:1px solid transparent;border-radius:8px;background:transparent;padding:10px;font-size:13px;line-height:1.45;cursor:grab; }
.organization-record span:last-child { overflow-wrap:anywhere;min-width:0; }
.organization .organization-record:hover { background:#f1f5f3;color:var(--ink); }
.organization .organization-record.active { background:#fff;border-color:var(--line);color:var(--ink);font-weight:600;box-shadow:0 2px 5px #173f3506; }
.organization-record.active::before { content:'';position:absolute;left:-1px;top:10px;bottom:10px;width:3px;border-radius:3px;background:var(--green); }
.record-grip { color:#98a59f;flex-shrink:0;font-size:12px; }
.organization-record:active { cursor:grabbing; }
.organization { margin:0 16px 16px;padding:14px;background:#f8faf9; }
.organization .folder-heading { gap:6px;font-size:14px;line-height:1.4; }
.organization .folder-heading .text-button { display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:34px;padding:6px 9px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);font-size:12px;flex-shrink:0; }
.organization .folder-heading .text-button .ui-icon { width:15px;height:15px;margin:0; }
.organization .folder-heading .text-button:hover:not(:disabled) { border-color:var(--green);color:var(--green); }
.organization > p { margin:8px 0 14px;font-size:12px;line-height:1.6;color:#62746d; }
.organization .unassigned-field { margin:0 0 14px;padding:4px;background:#fff9ed;border-color:#eadbb8;border-radius:9px; }
.organization .unassigned-field.is-empty { background:#f1f5f3;border-color:var(--line); }
.organization .folder-node { min-height:44px;padding:10px 10px 10px calc(10px + var(--folder-depth,0)*12px);gap:10px;font-size:13px;line-height:1.45;border-radius:8px;color:var(--ink); }
.organization .folder-node:hover { background:#edf3ef; }
.organization .folder-node.active { background:#e7f2ec;border-color:#c9dfd2;color:var(--green);font-weight:600; }
.organization .unassigned-records { min-height:58px; }
.organization .unassigned-records.active { background:#fff;border-color:#dfc78f;color:var(--ink); }
.organization .folder-node small { display:inline-flex;align-items:center;justify-content:center;min-width:25px;min-height:24px;padding:2px 6px;background:#fff;border:1px solid var(--line);border-radius:6px;font-size:11px;font-weight:600;color:#52635b;font-variant-numeric:tabular-nums; }
.organization .folder-copy { display:block;min-width:0; }
.organization .folder-hint { display:block;margin-top:3px;color:#69766e;font-size:11px;font-weight:400; }
.organization .folder-tree { max-height:380px;scrollbar-width:thin; }
.organization .folder-tree > .folder-node { margin-top:3px; }
.organization .folder-actions { padding-top:12px;border-top:1px solid var(--line);gap:8px 14px; }
.organization .folder-actions .text-button { font-size:12px; }
.organization .folder-node.drag-over { border:1px dashed var(--green);background:#d4ebdf; }
.organization :is(.folder-node,.organization-record,.text-button):focus-visible { outline:2px solid var(--green);outline-offset:2px; }
.organization-records .empty { margin:0;padding:10px 4px;font-size:12px;line-height:1.5;color:#62746d; }
.workbench .record-details { display:block;max-height:none;overflow:visible; }
.record-details .customer-card,.record-details .catalog-card { cursor:default; }
.record-details .record-description { display:block;white-space:pre-wrap;line-height:1.6;overflow-wrap:anywhere; }
.document-templates { padding: 22px; border-top: 1px solid var(--line, #e4e7e3); }
.templates-heading, .template-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.templates-heading h3 { margin: 0; font-size: 16px; }
.document-templates .form-help { line-height: 1.6; }
.template-card { padding: 14px 0; border-top: 1px solid var(--line, #e4e7e3); }
.template-card small { display: block; margin-top: 5px; color: var(--muted, #66736a); }
.template-actions { display: flex; align-items: center; gap: 12px; }

/* Icons inherit interface colors and never replace the accessible action label. */
.ui-icon { width:17px;height:17px;display:inline-block;vertical-align:middle;flex-shrink:0;pointer-events:none; }
button > .ui-icon,.metric-card h3 > .ui-icon { margin-right:5px; }
.initials .ui-icon { width:23px;height:23px; }
.catalog-symbol { display:inline-flex;align-items:center;justify-content:center;font-family:"Segoe UI Emoji","Apple Color Emoji",sans-serif;font-size:20px;line-height:1.2;flex-shrink:0;pointer-events:none; }
.organization-record .catalog-symbol { font-size:17px;width:19px; }
.folder-label { display:flex;align-items:center;gap:7px;min-width:0; }
.folder-label > span { overflow-wrap:anywhere; }
.folder-label > .ui-icon:first-child:not(:last-child) { width:16px; }
.folder-node small { flex-shrink:0; }
.position-heading strong .catalog-symbol { font-size:17px; }
.catalog-icon-picker { border:1px solid var(--line,#dde5df);border-radius:10px;margin:8px 0 16px;padding:16px;min-width:0; }
.catalog-icon-picker legend { padding:0 6px;font-size:13px;font-weight:600; }
.icon-selection { display:flex;align-items:center;gap:10px;min-height:32px;margin:0 0 14px;font-size:13px; }
.icon-picker-filters { display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px; }
.catalog-icon-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:7px;max-height:280px;overflow:auto;padding:4px; }
.catalog-icon-option { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:70px;padding:9px 4px;background:#fff;border:1px solid var(--line,#dde5df);border-radius:7px;cursor:pointer;color:var(--ink,#253e32); }
.catalog-icon-option span:last-child { font-size:10px;max-width:100%;overflow-wrap:anywhere; }
.catalog-icon-option .catalog-symbol { font-size:24px; }
.catalog-icon-option:hover { background:#f0f7f3; }
.catalog-icon-option[aria-pressed="true"] { background:#e6f4ec;border:2px solid var(--green,#227c65);padding:8px 3px; }
.catalog-icon-option:focus-visible { outline:2px solid var(--green,#227c65);outline-offset:2px; }
.icon-picker-empty { font-size:12px;color:var(--muted); }
@media(max-width:480px) { .icon-picker-filters { grid-template-columns:1fr; } .catalog-icon-picker { padding:10px; } }