/* Shared CRM surfaces follow the compact Electro CAD workspace. */
:root {
  --ink: #172033;
  --muted: #718096;
  --line: #dce2e9;
  --teal: #2563eb;
  --navy: #172033;
  --crm-blue: #2563eb;
  --crm-canvas: #edf0f3;
  --crm-font: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  font-family: var(--crm-font);
  background: var(--crm-canvas);
}
body { min-width: 0; background: var(--crm-canvas); font-family: var(--crm-font); }
button, input, select, textarea { font-family: var(--crm-font); }
button { cursor: pointer; }
button:disabled { cursor: default; opacity: .5; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid #8fb0fb; outline-offset: 2px; }
input, select, textarea { border-color: var(--line); border-radius: 7px; font-size: 14px; }
input:focus, select:focus, textarea:focus { border-color: #8fb0fb; box-shadow: 0 0 0 2px #2563eb14; }
input::placeholder, textarea::placeholder { color: #8c98a9; }
body > .sidebar { width: 190px; padding: 24px 10px 14px; background: #fff; color: #465469; border-right: 1px solid var(--line); }
.sidebar .brand { gap: 10px; margin: 0 8px 25px; color: var(--ink); font-size: 15px; line-height: 1.2; }
.sidebar .brand-mark { width: 36px; height: 36px; display: grid; place-items: center; font-size: 30px; border-radius: 9px; background: var(--crm-blue); color: #fff; }
.sidebar .nav { gap: 3px; }
.sidebar .nav a { min-height: 38px; height: auto; padding: 9px 10px; gap: 10px; color: #465469; border-radius: 7px; font-size: 13px; font-weight: 600; }
.sidebar .nav a:hover { background: #f3f6f9; }
.sidebar .nav a.active { color: #1d4ed8; background: #eaf1ff; }
.sidebar .nav a > span { color: inherit; }
.sidebar .nav a.active:before { display: none; }
.sidebar .nav a .nav-icon { width: 20px; font-size: 21px; color: currentColor; }
.sidebar .nav a .nav-icon svg { width: 18px; height: 18px; }
.sidebar .space-switcher { margin: 0 6px 20px; }
.sidebar .space-switcher span { font-size: 12px; color: #718096; }
.sidebar .space-switcher select { height: 35px; background: #f8fafc; color: #334155; border: 1px solid var(--line); font-size: 13px; }
.sidebar .profile { margin-top: auto; padding: 16px 5px 0; border-top: 1px solid var(--line); color: #334155; font-size: 12px; }
.sidebar .profile small { color: #7c8999; font-size: 11px; }
.sidebar .profile-link { color: #334155; }
.sidebar #logout-button { color: #718096; }
.sidebar .avatar { background: #e8eef8; color: #335484; }
.sidebar-toggle { top: 8px; right: 7px; background: #f8fafc; border-color: var(--line); color: #64748b; width: 23px; height: 23px; }
body > .main { margin-left: 190px; min-height: 100vh; padding: 24px; background: var(--crm-canvas); }
.topbar { min-height: 48px; margin-bottom: 24px; }
.topbar h1 { color: var(--ink); font-family: var(--crm-font); font-size: 25px; letter-spacing: -.65px; font-weight: 700; }
.top-actions { gap: 8px; }
.primary-button, .secondary-button, .icon-button { height: 38px; padding: 0 13px; border-radius: 7px; box-shadow: none; font-family: var(--crm-font); font-size: 13px; font-weight: 650; }
.primary-button { background: #2563eb; }
.primary-button:hover:not(:disabled) { background: #1d4ed8; }
.secondary-button { background: #fff; color: #465469; border-color: var(--line); }
.secondary-button:hover:not(:disabled) { background: #f8faff; border-color: #9cb9fa; }
.text-button, .back-link { color: var(--crm-blue); font-family: var(--crm-font); font-size: 13px; font-weight: 600; }
.search, .search.compact, .filters .search, .filters select { min-height: 38px; height: 38px; border-radius: 7px; font-size: 13px; }
.filters { gap: 10px; margin-bottom: 18px; }
.search { padding: 0 12px; }
.search span { font-size: 23px; }
.filters input { font-size: 13px; }
.table-card { background: #fff; border-color: var(--line); border-radius: 9px; }
.table-head { background: #f8fafc; font-family: var(--crm-font); }
.order-row { font-size: 14px; }
.project { font-weight: 650; }
.pagination { height: 65px; font-size: 13px; }
.pagination button { width: 34px; height: 34px; font-family: var(--crm-font); font-size: 13px; }
.pagination button.selected { color: #2563eb; border-color: #8fb0fb; background: #eef4ff; }
.form-card { border-color: var(--line); border-radius: 9px; box-shadow: none; padding: 20px; }
.form-card h2, .form-card h3 { font-family: var(--crm-font); }
.form-card label { color: #66758a; font-size: 13px; font-weight: 600; }
.form-card label input, .form-card label select { height: 39px; margin-top: 6px; padding: 0 11px; font-size: 14px; }
.form-card label textarea { padding: 10px; font-size: 14px; }
.add-contact { color: #2563eb; border-color: #bbcdf7; font-family: var(--crm-font); font-size: 13px; height: 37px; }
.add-contact:hover { background: #eff5ff; }
#toast { border-radius: 8px; background: #172033; font-family: var(--crm-font); font-size: 13px; font-weight: 550; }
#toast.error { background: #a32d35; }
.project-stats { margin-bottom: 20px; }
.project-dashboard-summary, .project-dashboard-metric { border-radius: 9px; box-shadow: none; }
.project-dashboard-heading b, .project-dashboard-metric b { font-family: var(--crm-font); }
.project-detail-page .create-header { min-height: 54px; flex-direction: row; align-items: center; gap: 20px; margin-bottom: 16px; }
.project-detail-page .create-header .back-link { margin-bottom: 7px; font-size: 12px; }
.project-detail-page .create-header h1 { font-size: 22px; }
.project-detail-page .project-top-actions { width: auto; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.project-detail-page .project-lifecycle { gap: 12px; }
.project-detail-page .project-lifecycle b { font-size: 12px; font-family: var(--crm-font); }
.project-detail-page .project-lifecycle small { font-size: 11px; }
.project-status-inline select { min-height: 36px; height: 36px; border-radius: 7px; font-family: var(--crm-font); font-size: 13px; }
#order-form.project-detail-mode .project-workspace-layout { grid-template-columns: minmax(0,1fr) 320px; gap: 15px; }
.project-details-actions:empty { display: none; }
.project-details-actions { display: grid; gap: 8px; }
.project-details-actions .primary-button, .project-details-actions .danger-button { width: 100%; }
.danger-button { min-height: 44px; border: 1px solid #dc5c63; border-radius: 7px; background: #fff; color: #b4232d; padding: 0 16px; font-family: var(--crm-font); font-size: 13px; font-weight: 650; cursor: pointer; }
.danger-button:hover { background: #fff1f2; }
.danger-button:disabled { cursor: wait; opacity: .65; }
.delete-project-modal { position: fixed; inset: 0; z-index: 1200; display: grid; place-items: center; padding: 24px; background: rgba(9, 18, 32, .58); backdrop-filter: blur(2px); }
.delete-project-modal.hidden { display: none; }
.delete-project-dialog { width: min(440px, 100%); padding: 28px; border-radius: 12px; background: #fff; box-shadow: 0 24px 70px rgba(5, 16, 31, .28); text-align: center; }
.delete-project-dialog-icon { display: grid; place-items: center; width: 46px; height: 46px; margin: 0 auto 16px; border-radius: 50%; background: #fff1f2; color: #b4232d; font-size: 23px; font-weight: 800; }
.delete-project-dialog-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.delete-project-dialog h2 { margin: 0 0 10px; font-family: var(--crm-font); font-size: 21px; }
.delete-project-dialog p { margin: 0; color: #657286; font-size: 13px; line-height: 1.55; }
.delete-project-dialog p strong { color: #283548; }
.delete-project-error { min-height: 20px; padding-top: 8px; color: #b4232d!important; }
.delete-project-dialog-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 22px; }
.delete-project-dialog-actions .secondary-button, .delete-project-dialog-actions .danger-button { height: 44px; min-height: 44px; }
.delete-project-dialog-actions .danger-button { background: #b4232d; color: #fff; }
.delete-project-dialog-actions .danger-button:hover { background: #951c25; }
#order-form.project-detail-mode.project-info-collapsed .project-workspace-layout { grid-template-columns: minmax(0,1fr) 0; gap: 0; }
#order-form.project-detail-mode .project-info-toggle { top: 5px; right: 327px; height: 32px; width: 25px; font-size: 19px; box-shadow: none; color: #64748b; border-color: var(--line); border-radius: 6px; }
#order-form.project-detail-mode.project-info-collapsed .project-info-toggle { right: 0; }
#order-form.project-detail-mode .form-card { padding: 15px; border-radius: 8px; box-shadow: none; }
#order-form.project-detail-mode .form-card h2 { font-size: 14px; font-weight: 650; }
#order-form.project-detail-mode .form-card label { margin-bottom: 13px; font-size: 12px; }
#order-form.project-detail-mode .form-card label input, #order-form.project-detail-mode .form-card label select, #order-form.project-detail-mode .form-card label textarea { height: 36px; margin-top: 5px; padding: 0 9px; font-size: 13px; }
#order-form.project-detail-mode .form-card label textarea { height: 72px; padding: 9px; }
#order-form.project-detail-mode .project-card-heading { margin-bottom: 14px; }
#order-form.project-detail-mode .project-card-toggle { width: 25px; height: 25px; flex-basis: 25px; border: 0; border-radius: 5px; background: #f1f4f8; }
#order-form.project-detail-mode .project-main-card .three-cols, #order-form.project-detail-mode .project-client-card .three-cols { grid-template-columns: 1fr; gap: 0; }
.project-tabs { min-height: 42px; margin-bottom: 12px; gap: 2px; padding-right: 34px; border-color: #d3dbe5; }
.project-tab { min-width: 90px; padding: 11px 14px; font-family: var(--crm-font); font-size: 13px; font-weight: 650; }
.project-tab.active { color: #2563eb; }
.project-tab.active:after { height: 2px; left: 10px; right: 10px; background: #2563eb; }
#order-form:not(.project-detail-mode) .structure-derived-count { display: none; }
#order-form:not(.project-detail-mode) .project-main-card .three-cols { grid-template-columns: repeat(2,minmax(0,1fr)); }
.structure-derived-count input[readonly] { background: #f5f7fa; color: #7a8798; }
.project-design-intro { padding: 22px 18px 8px; }
.project-design-intro > span, .project-design-arrow { color: #2563eb; }
.project-design-intro h2 { font-family: var(--crm-font); font-size: 22px; }
.project-design-intro p { font-family: var(--crm-font); font-size: 14px; }
.project-design-card { border-radius: 9px; box-shadow: none; }
.project-design-icon { color: #2563eb; background: #edf3ff; border-radius: 9px; }
.project-design-copy :is(small,b,em), .project-design-badge { font-family: var(--crm-font); }
.project-design-card[href]:hover { border-color: #8fb0fb; box-shadow: none; transform: none; }
/* Presale keeps its calculation layout while sharing CAD colors and surfaces. */
.presale-root { color: #172033; font-family: var(--crm-font); }
.presale-root button, .presale-root input, .presale-root select, .presale-root textarea { font-family: var(--crm-font); }
.presale-header { background: #fff; border-color: var(--line); border-radius: 9px; box-shadow: none; padding: 17px; }
.presale-header h2 { font-family: var(--crm-font); font-size: 22px; }
.presale-eyebrow { color: #2563eb; }
.presale-context span { color: #335a97; background: #edf3ff; }
.presale-cost-chip small { color: #5b7398; }
.presale-cost-chip b { color: #172033; }
.presale-cost-chip.is-total { background: #dce8ff !important; }
.presale-picker-card, .presale-category-card, .presale-side-card, .presale-total-card { border-color: var(--line); border-radius: 8px; box-shadow: none; }
.presale-category-button.active { color: #1d4ed8; border-color: #8fb0fb; background: #edf3ff; }
.login-page { background: #edf0f3; }
.login-card { border-color: var(--line); border-radius: 12px; box-shadow: 0 16px 45px #1720330c; }
.login-brand > span, .login-heading > span { color: #2563eb; }
.login-card :is(input,select,button) { font-family: var(--crm-font); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* Structure workspace: physical tree, floor canvas, and contextual inspector. */
.project-structure-root { color: #172033; font-size: 13px; line-height: 1.45; }
.project-structure-root svg { width: 18px; height: 18px; flex: 0 0 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.project-structure-root button { font: inherit; }
.project-structure-root button:disabled { opacity: .45; }
.structure-toolbar { min-height: 63px; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 13px 16px; border: 1px solid var(--line); border-radius: 9px 9px 0 0; background: #fff; }
.structure-summary { display: flex; gap: 19px; }
.structure-summary > span { display: flex; align-items: baseline; gap: 6px; color: #718096; font-size: 12px; white-space: nowrap; }
.structure-summary b { font-size: 18px; color: #334155; font-weight: 650; }
.structure-save-area { display: flex; align-items: center; gap: 12px; }
.structure-save-state { display: flex; gap: 5px; align-items: center; color: #718096; font-size: 12px; }
.structure-save-state.ready { color: #168653; }
.structure-save-state.dirty { color: #99631d; }
.structure-save-state svg { width: 15px; height: 15px; flex-basis: 15px; }
.structure-button { display: inline-flex; min-height: 35px; align-items: center; justify-content: center; gap: 6px; padding: 6px 11px; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: #465469; font-size: 12px; font-weight: 600; white-space: nowrap; }
.structure-button:hover:not(:disabled) { background: #f3f6fb; border-color: #a9bee8; }
.structure-button.primary { border-color: #2563eb; background: #2563eb; color: #fff; }
.structure-button.primary:hover:not(:disabled) { background: #1d4ed8; }
.structure-button.subtle { color: #2563eb; background: #f8faff; border-color: #c5d5f4; }
.structure-save-error { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 12px 16px; color: #b42335; background: #fff2f3; border-right: 1px solid #fecdd3; border-left: 1px solid #fecdd3; }
.structure-issues { background: #fffaf0; border-left: 1px solid #eadcbb; border-right: 1px solid #eadcbb; color: #876522; }
.structure-issues summary { padding: 10px 16px; font-size: 12px; cursor: pointer; }
.structure-issues ul { margin: 0; padding: 0 20px 12px 37px; font-size: 12px; }
.structure-issues li + li { margin-top: 4px; }
.structure-issues button { color: inherit; background: transparent; border: 0; padding: 0; text-align: left; text-decoration: underline; text-decoration-color: #d1b575; text-underline-offset: 3px; }
.structure-draft-note { padding: 8px 16px; background: #f8fafc; border-right: 1px solid var(--line); border-left: 1px solid var(--line); color: #718096; font-size: 12px; }
.structure-workbench { display: grid; grid-template-columns: 216px minmax(250px,1fr) 264px; min-height: 620px; border: 1px solid var(--line); border-radius: 0 0 9px 9px; overflow: clip; }
.structure-tree-panel, .structure-inspector { background: #fff; min-width: 0; }
.structure-tree-panel { display: flex; flex-direction: column; border-right: 1px solid var(--line); }
.structure-side-heading { min-height: 46px; padding: 0 13px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #edf0f3; color: #465469; }
.structure-side-heading b { font-size: 12px; font-weight: 650; }
.structure-side-heading > span { color: #8390a1; font-size: 12px; }
.structure-side-heading svg { width: 16px; height: 16px; color: #91a0b3; }
.structure-search { display: block; padding: 10px 9px; }
.structure-search input { height: 33px; padding: 0 9px; border-color: #e3e8ef; border-radius: 6px; background: #f8fafc; font-size: 12px; }
.structure-tree { padding: 0 5px 12px; max-height: 590px; min-height: 170px; overflow: auto; }
.structure-tree-row { display: flex; align-items: center; min-height: 35px; border-radius: 6px; padding-left: calc(3px + var(--depth) * 12px); }
.structure-tree-row:hover { background: #f3f6f9; }
.structure-tree-row.selected { background: #eaf1ff; color: #1d4ed8; }
.structure-tree-node { min-width: 0; flex: 1; display: flex; align-items: center; gap: 6px; height: 35px; border: 0; padding: 0 5px 0 0; background: transparent; color: inherit; text-align: left; }
.structure-tree-node > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.structure-tree-node > svg { width: 15px; height: 15px; flex-basis: 15px; color: #7a8ba1; }
.structure-tree-row.selected .structure-tree-node > svg { color: #2563eb; }
.structure-tree-presale { display: grid; place-items: center; flex: 0 0 25px; width: 25px; height: 27px; margin-right: 3px; border: 0; border-radius: 4px; background: transparent; color: #647c9a; opacity: 0; }
.structure-tree-presale > svg { width: 14px; height: 14px; }
.structure-tree-row:hover .structure-tree-presale, .structure-tree-row.selected .structure-tree-presale, .structure-tree-row:focus-within .structure-tree-presale { opacity: 1; }
.structure-tree-presale:hover { color: #1d4ed8; background: #dce8ff; }
@media (hover: none) { .structure-tree-presale { opacity: 1; } }
.structure-fold, .structure-fold-placeholder { flex: 0 0 18px; width: 18px; height: 27px; display: grid; place-items: center; }
.structure-fold { border: 0; background: transparent; color: #8896a8; padding: 0; }
.structure-fold svg { width: 11px; height: 11px; }
.structure-fold.expanded svg { transform: rotate(90deg); }
.structure-master-dot { width: 5px; height: 5px; flex: 0 0 5px; margin-left: auto; border-radius: 50%; background: #2563eb; }
.structure-tree-empty { padding: 20px 10px; color: #91a0b2; font-size: 12px; text-align: center; }
.structure-tree-footer { margin-top: auto; padding: 12px 9px; border-top: 1px solid #edf0f3; }
.structure-tree-footer > button { width: 100%; }
.structure-canvas { display: flex; flex-direction: column; min-width: 0; background: #edf0f3; }
.structure-canvas-toolbar { min-height: 46px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 12px; border-bottom: 1px solid #dde3eb; }
.structure-view-switch { display: flex; padding: 2px; gap: 2px; background: #e0e6ed; border-radius: 6px; }
.structure-view-switch button { min-height: 28px; padding: 3px 9px; border: 0; border-radius: 4px; background: transparent; color: #68768a; font-size: 12px; white-space: nowrap; }
.structure-view-switch button.active { background: #fff; color: #334155; box-shadow: 0 1px 3px #17203312; }
.structure-count { color: #7a8798; font-size: 12px; white-space: nowrap; }
.structure-canvas-content { flex: 1; min-height: 350px; padding: 23px 18px; background-image: radial-gradient(#d4dce6 .7px,transparent .7px); background-size: 15px 15px; }
.structure-empty, .structure-loading { min-height: 430px; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 28px; color: #7c8999; }
.structure-empty-icon { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 12px; background: #e3eaf6; color: #4c75bd; }
.structure-empty-icon svg { width: 27px; height: 27px; }
.structure-empty h2 { margin: 20px 0 7px; color: #465469; font-family: var(--crm-font); font-size: 18px; font-weight: 650; }
.structure-empty p { margin: 0 0 22px; color: #718096; font-size: 13px; line-height: 1.7; }
.structure-start-steps { display: flex; gap: 20px; list-style: none; padding: 0; margin: 36px 0 0; }
.structure-start-steps li { display: grid; gap: 7px; justify-items: center; font-size: 12px; }
.structure-start-steps b { width: 23px; height: 23px; display: grid; place-items: center; border: 1px solid #cfd7e2; border-radius: 50%; color: #7c8da5; font-weight: 550; }
.structure-building-list { display: grid; gap: 22px; }
.structure-building { border: 1px solid #cbd5e1; border-radius: 8px; background: #f4f6f9; box-shadow: 0 3px 8px #17203304; overflow: hidden; }
.structure-building.selected { border-color: #7aa1ef; }
.structure-building-heading { min-height: 47px; display: flex; justify-content: space-between; align-items: center; gap: 9px; padding: 8px 12px; border-bottom: 1px solid #dce2e9; background: #fff; }
.structure-building-heading > button, .structure-floor-heading > button { min-width: 0; display: flex; gap: 8px; align-items: center; padding: 0; border: 0; background: transparent; color: #334155; text-align: left; }
.structure-building-heading > button b { font-size: 14px; font-weight: 650; }
.structure-building-heading > button svg { color: #647b9e; }
.structure-building-heading > span { color: #8491a3; font-size: 12px; white-space: nowrap; }
.structure-building-body { display: grid; gap: 12px; padding: 12px; }
.structure-floor { border: 1px solid #dce3eb; border-radius: 6px; background: #fff; overflow: hidden; }
.structure-floor.selected { border-color: #7aa1ef; box-shadow: 0 0 0 1px #7aa1ef; }
.structure-floor-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 40px; padding: 8px 10px; border-bottom: 1px solid #edf0f3; }
.structure-floor-heading > button b { font-size: 13px; font-weight: 600; }
.structure-floor-heading > button svg { width: 16px; height: 16px; flex-basis: 16px; color: #718096; }
.structure-floor-heading > small { max-width: 40%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #8c98a9; font-size: 12px; }
.structure-floor-body { display: grid; gap: 10px; padding: 10px; }
.structure-room-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(max(150px, calc((100% - 40px) / 6)), 1fr)); align-items: start; gap: 8px; }
.structure-room { min-width: 0; min-height: 72px; padding: 10px; display: flex; flex-direction: column; gap: 9px; border: 1px solid #dde4ee; border-radius: 6px; background: #fff; color: #465469; text-align: left; }
.structure-room:hover { background: #f8faff; border-color: #adc4ed; }
.structure-room.has-master { border-color: #b8cdf3; background: #f6f9ff; }
.structure-room.selected { border-color: #6a96ea; box-shadow: 0 0 0 1px #6a96ea; }
.structure-room-title { display: flex; gap: 7px; align-items: center; min-width: 0; }
.structure-room-title > b { overflow-wrap: anywhere; font-size: 12px; font-weight: 600; }
.structure-room-title > svg { width: 15px; height: 15px; flex-basis: 15px; color: #7b8ba3; }
.structure-room.has-master .structure-room-title > svg { color: #4d78c5; }
.structure-drag-grip { display: inline-flex; align-items: center; flex: 0 0 12px; color: #8392a8; cursor: grab; }
.structure-drag-grip > svg { width: 12px; height: 18px; stroke-width: 3; }
.structure-tree-node > .structure-drag-grip { flex: 0 0 10px; }
[data-structure-drag-node] { cursor: grab; }
[data-structure-drag-node]:active, .structure-dragging [data-structure-drag-node] { cursor: grabbing; }
.structure-dragging .is-dragging { opacity: .5; }
.structure-dragging .is-drop-allowed { outline: 1px dashed #90afdf; outline-offset: -3px; }
.structure-dragging .is-drop-active { outline: 2px solid #4c83df; outline-offset: -3px; background-color: #edf4ff; }
.structure-dragging .is-drop-invalid { outline: 2px solid #c86b75; outline-offset: -3px; }
.structure-drag-status { position: fixed; left: 50%; bottom: 22px; z-index: 1100; transform: translateX(-50%); max-width: min(680px,calc(100vw - 32px)); padding: 11px 15px; border: 1px solid #b8cbed; border-radius: 8px; background: #f5f9ff; box-shadow: 0 6px 24px #20365322; color: #354f79; font-size: 13px; line-height: 1.5; pointer-events: none; }
.structure-drag-status.invalid { color: #883c48; border-color: #e4bac2; background: #fff7f8; }
.structure-drag-status[hidden] { display: none; }
.structure-room-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.structure-room-meta > span:last-child:not(.structure-mode) { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #8693a6; font-size: 12px; }
.structure-room-block { min-width: 0; display: flex; flex-direction: column; border: 1px solid #dde4ee; border-radius: 6px; background: #fff; overflow: hidden; }
.structure-room-block.has-master { border-color: #b8cdf3; }
.structure-room-block.selected { border-color: #6a96ea; box-shadow: 0 0 0 1px #6a96ea; }
.structure-room-block > .structure-room { width: 100%; flex: 1; border: 0; border-radius: 0; box-shadow: none; }
.structure-mode { flex: 0 0 auto; padding: 2px 5px; border-radius: 4px; font-size: 12px; line-height: 1.4; font-weight: 600; }
.structure-mode.master { color: #2a5bab; background: #e5eeff; }
.structure-mode.slave { color: #7c8999; background: #f0f3f7; }
.structure-mode.container { color: #677489; background: #eaf0f5; }
.structure-panel-kind { flex: 0 0 auto; padding: 2px 5px; border: 1px solid #dce4ef; border-radius: 4px; color: #64778e; background: #fff; font-size: 11px; line-height: 1.4; font-weight: 600; }
.structure-panel-kind.lighting { color: #866c35; border-color: #eadfc5; background: #fffcf5; }
.structure-panel-kind.rack { color: #176b66; border-color: #b9dcd5; background: #edf8f5; }
.structure-panel-help { margin: -4px 0 13px; }
.structure-add { min-height: 36px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; border: 1px dashed #d2dce9; border-radius: 6px; padding: 7px 9px; background: #fafcfe; color: #7d8fa7; font-size: 12px; }
.structure-add:hover { color: #2563eb; border-color: #a2bbec; background: #f4f8ff; }
.structure-add > svg { width: 15px; height: 15px; flex-basis: 15px; }
.structure-room-grid > .structure-add { min-height: 72px; }
.structure-add-floor { min-height: 34px; width: 100%; border-style: solid; background: transparent; border-color: transparent; }
.structure-floor-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.structure-floor-actions > .structure-add { border: 0; padding: 3px 2px; min-height: 27px; background: transparent; }
.structure-floor-actions > .structure-add + .structure-add { margin-left: 8px; }
.structure-floor-actions > span { align-self: center; color: #8390a1; font-size: 12px; }
.structure-owned-panels { margin-top: 8px; border-top: 1px solid #e5eaf1; }
.structure-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 31px; color: #8390a1; font-size: 11px; }
.structure-add-panel { min-height: 27px; padding: 3px 2px; border: 0; background: transparent; }
.structure-panels { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 7px; }
.structure-panels .structure-room { width: 100%; min-height: 62px; background: #f7f9fc; }
.structure-room-block > .structure-owned-panels { margin: 0; padding: 0 8px 7px; background: #fbfcfe; }
.structure-room-block .structure-panels { grid-template-columns: minmax(0, 1fr); }
.structure-room-block .structure-panels .structure-room { padding: 8px; gap: 6px; }
.structure-room-group { padding: 9px; border: 1px solid #d8e1ee; border-radius: 6px; background: #f7f9fc; }
.structure-room-group > .structure-owned-panels { margin-bottom: 8px; }
.structure-room-group.selected { border-color: #6a96ea; }
.structure-group-heading { width: 100%; display: flex; align-items: center; gap: 7px; padding: 0 0 10px; border: 0; background: transparent; text-align: left; color: #64748b; }
.structure-group-heading svg { width: 15px; height: 15px; flex-basis: 15px; }
.structure-group-heading b { font-size: 12px; font-weight: 600; }
.structure-trust { min-height: 72px; display: flex; align-items: center; gap: 10px; padding: 13px 17px; border-top: 1px solid #dce2e9; background: #f8fafc; }
.structure-trust-icon { display: grid; place-items: center; color: #6b87b4; }
.structure-trust b { color: #526783; font-size: 12px; font-weight: 650; }
.structure-trust b > span { margin-left: 7px; padding: 2px 5px; border-radius: 4px; color: #718096; background: #e9eef6; font-weight: 450; }
.structure-trust p { margin: 3px 0 0; color: #8693a4; font-size: 12px; }
.structure-inspector { border-left: 1px solid var(--line); }
.structure-inspector-body { padding: 14px 13px; }
.structure-inspector-empty { display: grid; gap: 9px; justify-items: center; padding: 65px 18px; text-align: center; color: #a0adbd; }
.structure-inspector-empty > svg { width: 26px; height: 26px; }
.structure-inspector-empty > b { margin-top: 6px; color: #718096; font-size: 13px; font-weight: 550; }
.structure-inspector-empty > p { margin: 0; font-size: 12px; line-height: 1.65; }
.structure-kind { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 16px; color: #7a8798; font-size: 12px; }
.structure-field { position: relative; display: block; margin-bottom: 13px; }
.structure-field > span { display: block; color: #66758a; font-size: 12px; font-weight: 550; margin-bottom: 6px; }
.structure-field-heading { min-height: 30px; display: flex; align-items: center; justify-content: space-between; gap: 8px; color: #66758a; font-size: 12px; font-weight: 550; }
.structure-info-button { display: grid; place-items: center; flex: 0 0 30px; width: 30px; height: 30px; margin: -5px -4px -3px 0; padding: 0; border: 0; border-radius: 50%; color: #6680a7; background: transparent; }
.structure-info-button:hover, .structure-info-button[aria-expanded="true"] { color: #1d4ed8; background: #edf3ff; }
.structure-info-button:focus-visible { outline: 2px solid #6f9bea; outline-offset: 1px; }
.structure-info-button > svg { width: 17px; height: 17px; }
.structure-info-popover { position: absolute; z-index: 40; top: 31px; right: 0; width: min(244px, calc(100vw - 36px)); padding: 11px 12px; border: 1px solid #c9d8f2; border-radius: 8px; color: #435b7a; background: #fff; box-shadow: 0 12px 30px #2036532b, 0 2px 8px #20365316; }
.structure-info-popover::before { content: ''; position: absolute; top: -5px; right: 10px; width: 9px; height: 9px; transform: rotate(45deg); border-top: 1px solid #c9d8f2; border-left: 1px solid #c9d8f2; background: #fff; }
.structure-info-popover[hidden] { display: none; }
.structure-info-popover p { margin: 0; font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.structure-field > input, .structure-field > select { width: 100%; height: 35px; padding: 0 9px; border: 1px solid #dce2e9; border-radius: 6px; color: #334155; background: #fff; font-family: var(--crm-font); font-size: 12px; }
.structure-field > select:disabled { background: #f7f9fc; color: #8b98a9; }
.structure-presale-link { justify-content: space-between; width: 100%; margin: 0 0 13px; border-color: #dae5f7; color: #3565a7; background: #f6f9ff; }
.structure-clear-control { display: block; margin: -4px 0 13px; padding: 0; border: 0; background: transparent; color: #6c809c; font-size: 11px; text-align: left; }
.structure-clear-control:hover { color: #1d4ed8; text-decoration: underline; }
.structure-inspector-section { margin-top: 17px; padding-top: 14px; border-top: 1px solid #edf0f3; }
.structure-inspector-section h3 { margin: 0 0 12px; color: #465469; font-family: var(--crm-font); font-size: 12px; font-weight: 650; }
.structure-help { margin: 7px 0 0; color: #8390a1; font-size: 12px; line-height: 1.65; overflow-wrap: anywhere; }
.structure-inheritance { display: flex; align-items: flex-start; gap: 9px; padding: 10px; border: 1px solid #dbe6f6; border-radius: 6px; background: #f5f8fe; color: #6584b5; }
.structure-inheritance > span { display: grid; gap: 3px; }
.structure-inheritance small { color: #8a98ad; font-size: 12px; }
.structure-inheritance b { color: #4a6691; font-size: 12px; font-weight: 600; }
.structure-inheritance em { color: #8594aa; font-size: 12px; font-style: normal; }
.structure-inheritance.unresolved { background: #fffaf0; border-color: #eadcbb; color: #a88640; }
.structure-inheritance.unresolved b { color: #a88640; }
.structure-install-server { width: 100%; margin-top: 10px; white-space: normal; text-align: left; line-height: 1.5; }
.structure-inspector-add { display: grid; gap: 7px; }
.structure-inspector-add > button { justify-content: flex-start; border-style: solid; background: #fff; color: #5f779b; }
.structure-order-actions { display: flex; gap: 8px; }
.structure-order-actions > button { min-height: 32px; flex: 1; font-size: 12px; }
.structure-delete { width: 100%; min-height: 34px; margin-top: 22px; padding: 7px; border: 1px solid #f0cfd4; border-radius: 6px; background: #fff; color: #bf5a68; font-size: 12px; }
.structure-delete:hover { background: #fff6f7; }
/* Read-only control trees keep connections anchored to cards, not subtree heights. */
.structure-map-legend { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 22px; max-width: 1100px; margin: 0 auto 28px; color: #62758e; font-size: 12px; }
.structure-map-key { display: inline-flex; align-items: center; gap: 7px; }
.structure-map-key > svg { padding: 5px; box-sizing: content-box; border: 1px solid #cadbf5; border-radius: 7px; color: #356abd; background: #edf4ff; }
.structure-map-key.room > svg { border-radius: 50%; color: #227d78; border-color: #b9dcd5; background: #edf8f5; }
.structure-map-key.panel > svg { border-radius: 3px; color: #926d32; border-color: #e6d7b8; background: #fff9ed; }
.structure-map-key.rack > svg { color: #176b66; border-color: #b9dcd5; background: #edf8f5; }
.structure-map-key:is(.building, .floor, .group) > svg { border-radius: 7px; color: #70668c; border-color: #d8d3e7; background: #f3f1fa; }
.structure-map-legend > small { margin-left: auto; font-size: 12px; }
.structure-contour-map { display: grid; gap: 34px; max-width: 1280px; margin: 0 auto; }
.structure-map-branch { --map-line: #b2c5dc; --map-indent: 28px; --map-child-anchor: 18px; --map-root-anchor: 24px; display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; }
.structure-map-master { position: relative; box-sizing: border-box; width: 100%; max-width: 360px; min-width: 0; padding: 18px; border: 1px solid #97b8eb; border-radius: 14px; background: #f5f9ff; box-shadow: 0 3px 10px #224d8120; }
.structure-map-master.rack { border-color: #9bcfc7; background: #f1faf8; }
.structure-map-master.rack .structure-map-symbol { color: #176b66; background: #dff3ef; }
.structure-map-branch.has-slaves > .structure-map-master::after { content: ''; position: absolute; left: calc(var(--map-root-anchor) - 1px); top: 100%; height: 24px; border-left: 2px solid var(--map-line); }
.structure-map-master-heading { display: flex; align-items: center; gap: 11px; }
.structure-map-symbol { display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 38px; border-radius: 9px; color: #356abd; background: #e2edff; }
.structure-map-master-heading > div, .structure-map-slave-label { min-width: 0; }
.structure-map-role { display: block; color: #356abd; font-size: 11px; font-weight: 650; line-height: 1.5; }
.structure-map-master h3 { margin: 3px 0 0; font-family: var(--crm-font); font-size: 15px; line-height: 1.5; font-weight: 650; color: #304e77; overflow-wrap: anywhere; }
.structure-map-model { margin: 12px 0; color: #45638a; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.structure-map-location { padding-top: 12px; border-top: 1px solid #d9e5f6; }
.structure-map-location > span { display: block; margin-bottom: 7px; color: #657991; font-size: 11px; }
.structure-map-location > div { display: flex; align-items: flex-start; gap: 7px; color: #4d698e; }
.structure-map-location > div > div { flex: 1; min-width: 0; }
.structure-map-location b { display: block; font-size: 12px; line-height: 1.5; font-weight: 600; overflow-wrap: anywhere; }
.structure-map-location small, .structure-map-slave small { display: block; margin-top: 4px; color: #687b91; font-size: 11px; line-height: 1.6; overflow-wrap: anywhere; }
.structure-map-missing { margin: 0; color: #9a672b; font-size: 12px; }
.structure-map-leaves { position: relative; list-style: none; margin: 0; padding: 0; min-width: 0; }
.structure-map-branch > .structure-map-leaves { max-width: 900px; margin: 24px 0 0 var(--map-root-anchor); }
.structure-map-leaves > li { position: relative; min-width: 0; padding: 6px 0 6px var(--map-indent); }
.structure-map-leaves > li:not(:last-child)::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; border-left: 2px solid var(--map-line); pointer-events: none; }
.structure-map-leaves > li > .structure-map-leaves { margin-left: var(--map-child-anchor); padding-top: 12px; }
.structure-map-leaves > li > .structure-map-leaves::before { content: ''; position: absolute; left: 0; top: 0; height: 12px; border-left: 2px solid var(--map-line); pointer-events: none; }
.structure-map-slave { position: relative; display: flex; align-items: center; gap: 11px; min-width: 0; padding: 11px 16px; border: 1px solid #b9dcd5; border-radius: 22px; background: #f6fbf9; }
.structure-map-slave::before { content: ''; position: absolute; z-index: 1; top: calc(50% - 4px); left: -4px; width: 7px; height: 7px; box-sizing: border-box; border: 2px solid #75a99b; border-radius: 50%; background: #f6fbf9; pointer-events: none; }
.structure-map-slave::after { content: ''; position: absolute; box-sizing: border-box; left: calc(-1 * var(--map-indent) - 1px); top: -7px; width: var(--map-indent); height: calc(50% + 7px); border-left: 2px solid var(--map-line); border-bottom: 2px solid var(--map-line); pointer-events: none; }
.structure-map-slave .structure-map-symbol { flex-basis: 32px; width: 32px; height: 32px; border-radius: 50%; background: #e4f3ec; color: #227d78; }
.structure-map-slave .structure-map-role { color: #28776b; font-size: 10px; }
.structure-map-slave b { display: block; margin-top: 2px; color: #355b57; font-size: 13px; font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; }
.structure-map-slave.panel { border-radius: 6px; border-color: #e6d7b8; background: #fffcf5; }
.structure-map-slave.panel::before { border-color: #ba9c65; background: #fffcf5; }
.structure-map-slave.panel .structure-map-symbol { border-radius: 4px; background: #f7edda; color: #926d32; }
.structure-map-slave.panel .structure-map-role { color: #896530; }
.structure-map-slave.panel b { color: #685639; }
.structure-map-slave:is(.building, .floor, .group) { border-radius: 10px; border-color: #d8d3e7; background: #f8f7fc; }
.structure-map-slave:is(.building, .floor, .group)::before { border-color: #aaa0c0; background: #f8f7fc; }
.structure-map-slave:is(.building, .floor, .group) .structure-map-symbol { border-radius: 7px; color: #70668c; background: #efecf7; }
.structure-map-slave:is(.building, .floor, .group) .structure-map-role { color: #7b708f; }
.structure-map-slave:is(.building, .floor, .group) b { color: #5f5876; }
.structure-map-no-slaves { margin: 0; padding: 14px 18px 0; color: #718198; font-size: 12px; line-height: 1.6; }

@media (min-width: 801px) {
  body.sidebar-collapsed > .sidebar { width: 62px; padding-right: 6px; padding-left: 6px; }
  body.sidebar-collapsed > .main { margin-left: 62px; }
  body.sidebar-collapsed .brand-mark { width: 34px; height: 34px; }
  body.sidebar-collapsed .sidebar .space-switcher { display: none; }
}
@media (max-width: 1350px) {
  body > .main { padding: 20px 16px; }
  .project-detail-page .project-lifecycle { display: none; }
  .structure-workbench { grid-template-columns: 190px minmax(220px,1fr) 240px; }
  .structure-canvas-content { padding: 18px 12px; }
  .structure-summary { gap: 12px; }
  .structure-save-state { max-width: 150px; font-size: 12px; }
  .structure-count { display: none; }
  #order-form.project-detail-mode:not(.project-info-collapsed) .structure-workbench { grid-template-columns: 180px minmax(210px,1fr); }
  #order-form.project-detail-mode:not(.project-info-collapsed) .structure-inspector { grid-column: 1 / -1; border-top: 1px solid var(--line); border-left: 0; }
  #order-form.project-detail-mode:not(.project-info-collapsed) .structure-inspector-body { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 20px; }
  #order-form.project-detail-mode:not(.project-info-collapsed) .structure-inspector-section { margin-top: 0; }
}
@media (max-width: 1120px) {
  .structure-workbench { grid-template-columns: 180px minmax(240px,1fr); }
  .structure-inspector { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--line); }
  .structure-inspector-body { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 20px; }
  .structure-inspector-section { margin-top: 0; }
  .structure-inspector-empty { min-height: 140px; padding: 24px; }
  .structure-summary { gap: 10px; }
  .structure-summary > span { display: grid; gap: 0; font-size: 12px; }
  .structure-save-state { display: none; }
  .structure-toolbar { padding: 10px 12px; }
  .project-detail-page .cancel-project { display: none; }
  #order-form.project-detail-mode .project-workspace-layout { grid-template-columns: minmax(0,1fr); }
  #order-form.project-detail-mode .project-workspace-main { grid-column: 1; grid-row: 2; }
  #order-form.project-detail-mode .project-info-sidebar { grid-column: 1; grid-row: 1; }
  #order-form.project-detail-mode.project-info-collapsed .project-info-sidebar { display: none; }
  #order-form.project-detail-mode .project-info-toggle { right: 0; }
  #order-form.project-detail-mode:not(.project-info-collapsed) .structure-workbench { grid-template-columns: 180px minmax(240px,1fr); }
}
@media (max-width: 800px) {
  body > .sidebar { position: relative; width: 100%; padding: 12px; border-bottom: 1px solid var(--line); border-right: 0; }
  .sidebar .brand { margin-bottom: 14px; font-size: 14px; }
  .sidebar .space-switcher { margin: 0 0 12px; }
  .sidebar .nav { display: flex; flex-wrap: wrap; gap: 4px; }
  .sidebar .nav a { padding: 8px 10px; min-height: 34px; font-size: 12px; }
  .sidebar .profile { display: none; }
  body > .main { margin-left: 0; padding: 18px 12px; }
  .topbar h1 { font-size: 23px; }
  .project-detail-page .create-header { align-items: flex-start; flex-direction: column; gap: 12px; }
  .project-detail-page .project-top-actions { margin-top: 0; justify-content: flex-start; }
  #order-form.project-detail-mode .project-workspace-main { display: block; order: 1; min-height: 0; }
  #order-form.project-detail-mode .project-info-toggle { position: static; width: auto; min-height: 32px; height: 32px; align-self: flex-end; margin: 0; }
  #order-form.project-detail-mode .project-workspace-layout { display: flex; gap: 9px; }
  #order-form.project-detail-mode .project-info-sidebar { order: 0; }
  .project-tabs { padding-right: 0; }
  .project-tab { min-width: 70px; padding: 10px; font-size: 12px; }
  .structure-workbench, #order-form.project-detail-mode:not(.project-info-collapsed) .structure-workbench { grid-template-columns: minmax(0,1fr); }
  .structure-tree-panel { border-right: 0; border-bottom: 1px solid var(--line); }
  .structure-tree { max-height: 200px; min-height: 0; }
  .structure-tree-footer { margin-top: 0; padding-top: 8px; }
  .structure-tree-footer > button { width: auto; }
  .structure-inspector { grid-column: auto; }
  .structure-summary { gap: 12px; }
  .structure-save-area > button { padding: 6px 8px; font-size: 12px; white-space: normal; }
  .structure-empty { min-height: 350px; padding: 20px 12px; }
  .structure-start-steps { gap: 14px; }
  .structure-canvas-content { padding: 16px 10px; }
  .structure-building-body { padding: 9px; }
  .structure-floor-heading { align-items: flex-start; flex-direction: column; gap: 4px; }
  .structure-floor-heading > small { max-width: 100%; }
  .structure-trust { padding: 12px; }
  .structure-inspector-body, #order-form.project-detail-mode:not(.project-info-collapsed) .structure-inspector-body { display: block; }
  .structure-inspector-section { margin-top: 17px; }
  .structure-info-button { flex-basis: 40px; width: 40px; height: 40px; margin-top: -7px; margin-bottom: -5px; }
}
@media (prefers-reduced-motion: reduce) {
  .project-structure-root *, #order-form.project-detail-mode .project-workspace-layout { transition: none !important; }
}

/* Project creation dropdown and compact quick-project workflow. */
.project-create-control { position: relative; z-index: 80; display: inline-flex; }
.project-create-control.is-open { z-index: 240; }
.project-create-trigger { display: inline-flex; align-items: center; justify-content: center; gap: 9px; white-space: nowrap; }
.project-create-trigger > svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .16s ease; }
.project-create-control.is-open .project-create-trigger > svg { transform: rotate(180deg); }
.project-create-dropdown { position: absolute; z-index: 260; top: calc(100% + 8px); right: 0; width: min(360px, calc(100vw - 28px)); max-height: min(650px, calc(100vh - 88px)); overflow-y: auto; padding: 8px; border: 1px solid #dce4ed; border-radius: 11px; background: #fff; box-shadow: 0 18px 46px rgba(15, 31, 52, .18), 0 3px 9px rgba(15, 31, 52, .08); animation: project-create-menu-in .16s ease-out; }
.project-create-dropdown.hidden { display: none; }
.project-create-menu-heading { display: grid; gap: 2px; padding: 7px 9px 10px; }
.project-create-menu-heading b { color: #1d2c41; font-size: 12px; font-weight: 750; }
.project-create-menu-heading small { color: #8794a6; font-size: 10px; font-weight: 550; }
.project-create-menu-label { padding: 9px 9px 5px; color: #8a98aa; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.project-create-option { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; gap: 10px; align-items: center; width: 100%; min-height: 54px; padding: 7px 9px; border: 0; border-radius: 8px; background: transparent; color: #23344a; font-family: var(--crm-font); text-align: left; cursor: pointer; transition: background .14s ease, color .14s ease; }
.project-create-option.is-primary { border: 1px solid #e1e9fb; background: #f7f9ff; }
.project-create-option:not(:disabled):hover { background: #f0f5ff; color: #1d4ed8; }
.project-create-option-icon { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 8px; background: #edf3ff; color: #2563eb; }
.project-create-option-icon svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.project-create-option-copy { display: grid; min-width: 0; gap: 2px; }
.project-create-option-copy b { overflow: hidden; font-size: 12.5px; font-weight: 700; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.project-create-option-copy small { overflow: hidden; color: #8290a3; font-size: 10px; font-weight: 550; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.project-create-option-arrow { color: #94a3b8; font-size: 21px; line-height: 1; transition: transform .14s ease, color .14s ease; }
.project-create-option:not(:disabled):hover .project-create-option-arrow { color: #2563eb; transform: translateX(2px); }
.project-create-menu-separator { height: 1px; margin: 7px 3px; background: #e8edf3; }
.project-create-option.is-disabled { background: #f7f8fa; color: #8c98a8; cursor: not-allowed; }
.project-create-option.is-disabled .project-create-option-icon { background: #eceff3; color: #9aa5b3; }
.project-create-option.is-disabled .project-create-option-copy small { color: #a0a9b5; }
.project-create-option-badge { padding: 4px 6px; border-radius: 5px; background: #e9edf2; color: #8792a1; font-size: 8px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.project-create-trigger:focus-visible, .project-create-option:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
@keyframes project-create-menu-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }
.project-create-kind-summary { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; gap: 12px; align-items: center; margin-bottom: 14px; padding: 12px 14px; border: 1px solid #dce3eb; border-radius: 9px; background: #fff; }
.project-create-kind-summary.hidden { display: none; }
.project-create-kind-summary > span { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 9px; background: #edf3ff; color: #2563eb; font-size: 22px; font-weight: 750; }
.project-create-kind-summary > div:not(.project-create-control) { display: grid; gap: 2px; }
.project-create-kind-summary > div:not(.project-create-control) small { color: #718096; font-size: 10px; font-weight: 750; text-transform: uppercase; }
.project-create-kind-summary > div:not(.project-create-control) b { color: #172033; font-size: 14px; }
.project-create-kind-summary > div:not(.project-create-control) p { margin: 0; color: #718096; font-size: 11px; }
.project-create-kind-control .project-create-dropdown { top: calc(100% + 7px); }

.quick-project-page .create-header { display: none; }
#order-form.quick-project-mode .project-tabs { display: none; }
#order-form.quick-project-mode .project-workspace-layout { grid-template-columns: minmax(680px,1fr) 320px; gap: 14px; }
#order-form.quick-project-mode.project-info-collapsed .project-workspace-layout { grid-template-columns: minmax(680px,1fr) 0; gap: 0; }
#order-form.quick-project-mode .project-workspace-main { min-width: 0; }
#order-form.quick-project-mode #presale-root { font-size: 13px; }
#order-form.quick-project-mode #presale-panel:not(.hidden) {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  column-gap: 16px;
  row-gap: 10px;
}
#order-form.quick-project-mode #presale-panel > .project-subtabs { grid-column: 1; grid-row: 1; margin: 0; }
#order-form.quick-project-mode #quick-project-meta {
  grid-column: 2;
  grid-row: 1;
  justify-self: end;
  margin-right: 48px;
  min-width: 0;
}
#order-form.quick-project-mode #presale-stage-notice,
#order-form.quick-project-mode #presale-estimate-panel,
#order-form.quick-project-mode #presale-plans-panel,
#order-form.quick-project-mode #presale-chat-panel { grid-column: 1 / -1; }
#order-form.quick-project-mode #presale-estimate-panel:not(.hidden), #order-form.quick-project-mode #presale-root { display: block; }
#order-form.quick-project-mode .project-subtabs { margin: 0; padding: 3px; border: 1px solid #dce3eb; border-radius: 9px; background: #e8edf3; }
#order-form.quick-project-mode .project-subtab { min-width: 92px; padding: 9px 16px; border-radius: 7px; color: #64748b; font-size: 13px; }
#order-form.quick-project-mode .project-subtab.active { color: #1d4ed8; box-shadow: 0 2px 8px rgba(15,23,42,.08); }
#order-form.quick-project-mode #presale-stage-notice { margin-bottom: 0; }
#order-form.quick-project-mode .project-info-sidebar { position: sticky; top: 18px; }
#order-form.quick-project-mode .project-info-sidebar > .contacts-card { display: none; }
#order-form.quick-project-mode .project-info-sidebar .project-main-card,
#order-form.quick-project-mode .project-client-card { border-radius: 10px; }
#order-form.quick-project-mode .project-client-card .field-hint { padding: 9px; border-radius: 7px; background: #f5f7fa; }
#order-form.quick-project-mode .project-details-actions { margin-top: 9px; }
#order-form.quick-project-mode .project-details-actions .primary-button { min-height: 40px; }
#order-form:not(.quick-project-mode) .quick-only-subtab { display: none !important; }
.quick-project-page #presale-plans-panel > .project-design-intro,
.quick-project-page #presale-plans-panel > .project-design-grid { display: none; }

.quick-project-header { display: grid; grid-template-columns: minmax(240px,1fr) auto auto; gap: 14px; align-items: center; min-height: 112px; margin-bottom: 10px; padding: 17px 18px; border: 1px solid #dce3eb; border-radius: 10px; background: #fff; }
#order-form.quick-project-mode #quick-project-meta .presale-lifecycle {
  gap: 0;
  padding: 1px;
  border-radius: 8px;
  background: rgba(255,255,255,.88);
}
#order-form.quick-project-mode #quick-project-meta .presale-lifecycle span {
  max-width: 128px;
  padding: 3px 8px;
}
#order-form.quick-project-mode #quick-project-meta .presale-lifecycle small {
  color: #6f8199;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
#order-form.quick-project-mode #quick-project-meta .presale-lifecycle b {
  color: #344965;
  font-size: 10px;
  font-weight: 750;
}
#order-form.quick-project-mode #quick-project-meta .presale-lifecycle em {
  max-width: 112px;
  color: #6f8199;
  font-size: 9px;
  font-weight: 700;
}
#order-form.quick-project-mode #quick-project-meta .presale-lifecycle .presale-cad-revision {
  max-width: 72px;
}
#order-form.quick-project-mode #quick-project-meta .presale-lifecycle .presale-cad-revision small,
#order-form.quick-project-mode #quick-project-meta .presale-lifecycle .presale-cad-revision b {
  color: #94a3b8;
}
.quick-project-title { min-width: 0; }
.quick-project-title > a { display: inline-block; margin-bottom: 5px; color: #64748b; font-size: 12px; font-weight: 650; text-decoration: none; }
.quick-project-title > span { display: block; color: #2563eb; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.quick-project-title h1 { overflow: hidden; margin: 3px 0 7px; color: #172033; font-size: 25px; line-height: 1.15; letter-spacing: -.5px; text-overflow: ellipsis; white-space: nowrap; cursor: text; }
.quick-project-title h1 input { box-sizing: border-box; width: min(100%,560px); height: 35px; margin: -3px 0 -2px; padding: 2px 7px; border: 1px solid #9eb9ed; border-radius: 6px; outline: 3px solid rgba(37,99,235,.12); background: #fff; color: inherit; font: inherit; letter-spacing: inherit; }
.quick-project-title > div { display: flex; flex-wrap: wrap; gap: 6px; }
.quick-project-title em { padding: 5px 8px; border-radius: 6px; background: #edf3ff; color: #335a97; font-size: 11px; font-style: normal; font-weight: 700; }
.quick-project-totals { display: flex; align-items: stretch; overflow: hidden; border: 1px solid #dbe3ed; border-radius: 8px; background: #f8fafc; }
.quick-project-totals > span { display: grid; min-width: 112px; gap: 3px; padding: 10px 12px; border-left: 1px solid #e2e8f0; }
.quick-project-totals > span:first-child { border-left: 0; }
.quick-project-totals > span.is-total { background: #e7efff; }
.quick-project-totals small { color: #718096; font-size: 10px; font-weight: 750; text-transform: uppercase; }
.quick-project-totals b { color: #172033; font-size: 15px; white-space: nowrap; }
.quick-project-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
.quick-project-actions #presale-save-status { position: absolute; margin-top: 54px; color: #718096; font-size: 11px; white-space: nowrap; }
.quick-project-actions .presale-export-menu { position: relative; }
.quick-project-actions .presale-export-panel { right: 0; left: auto; }
.quick-project-presentation-text { margin: 0; overflow: hidden; border: 1px solid #dce3eb; border-radius: 9px; background: #fff; }
.quick-project-presentation-text .presale-category-heading { min-height: 42px; padding: 9px 14px; border-radius: 8px; }
.quick-project-presentation-text .presale-category-heading > span { color: #20344d; font-size: 13px; }
.quick-project-presentation-text .presale-category-heading > b { color: #567087; font-size: 10px; letter-spacing: .04em; text-transform: uppercase; }
.quick-project-presentation-body { padding: 14px; }
.quick-project-presentation-body > p { margin: 0 0 12px; color: #718096; font-size: 11px; }
.quick-project-presentation-basics, .quick-project-presentation-copy { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.quick-project-presentation-copy { margin-top: 10px; }
.quick-project-presentation-body label { display: grid !important; gap: 6px; margin: 0 !important; color: #40566e !important; font-size: 11px !important; font-weight: 800; }
.quick-project-presentation-body input { box-sizing: border-box; width: 100%; height: 38px !important; margin: 0 !important; padding: 0 10px !important; color: #30475f; font: 500 12px/1.5 Manrope,sans-serif; }
.quick-project-presentation-body textarea { box-sizing: border-box; width: 100%; min-height: 82px; margin: 0 !important; padding: 9px 10px !important; resize: vertical; color: #30475f; font: 500 12px/1.5 Manrope,sans-serif; }
.quick-project-presentation-contacts { margin-top: 14px; padding-top: 13px; border-top: 1px solid #e5eaf0; }
.quick-project-presentation-contacts-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.quick-project-presentation-contacts-head > div { display: grid; gap: 3px; }
.quick-project-presentation-contacts-head strong { color: #20344d; font-size: 13px; }
.quick-project-presentation-contacts-head span, .quick-project-presentation-contacts-head small { color: #718096; font-size: 10px; line-height: 1.4; }
.quick-project-presentation-body .quick-presentation-contact-list { margin-top: 10px; }
.quick-project-presentation-body .quick-presentation-contact { padding: 12px; border-radius: 9px; }
.quick-project-presentation-body .quick-presentation-fields { gap: 10px; margin-top: 12px; }
.quick-project-presentation-body .quick-presentation-field input { height: 38px !important; }
.quick-project-presentation-body .quick-presentation-phone input, .quick-project-presentation-body .quick-presentation-phone button { height: 38px !important; }
.quick-project-presentation-body .quick-presentation-add-contact { height: 40px; margin-top: 10px; }
.quick-project-workspace { display: grid; grid-template-columns: 320px minmax(0,1fr) 286px; gap: 10px; align-items: start; }
.quick-estimate-column { display: grid; min-width: 0; gap: 10px; }

.quick-catalog { min-width: 0; overflow: hidden; border: 1px solid #dce3eb; border-radius: 10px; background: #fff; }
.quick-catalog-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 14px 10px; }
.quick-catalog-heading small, .quick-estimate-heading small, .quick-additional-heading small { display: block; color: #2563eb; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.quick-catalog-heading h3, .quick-additional-heading h3 { margin: 3px 0 0; color: #172033; font-size: 16px; }
.quick-catalog-heading > span, .quick-estimate-heading > span { min-width: 27px; padding: 5px 8px; border-radius: 999px; background: #eef2f7; color: #64748b; font-size: 11px; font-weight: 750; text-align: center; }
.quick-catalog-search { position: relative; display: block; margin: 0 10px 8px !important; }
.quick-catalog-search svg { position: absolute; z-index: 1; top: 12px; left: 11px; width: 15px; height: 15px; fill: none; stroke: #94a3b8; stroke-width: 1.8; stroke-linecap: round; }
.quick-catalog-search input { width: 100%; height: 40px !important; margin: 0 !important; box-sizing: border-box; padding: 0 9px 0 35px !important; border: 1px solid #dce3eb; border-radius: 7px; background: #f8fafc; color: #334155; font-size: 13px !important; }
.quick-project-scope { display: flex !important; align-items: flex-start; gap: 8px; margin: 0 10px 9px !important; padding: 9px; border: 1px solid #cad9f8; border-radius: 7px; background: #f0f5ff; color: #334155 !important; cursor: pointer; }
.quick-project-scope input { width: 15px !important; height: 15px !important; flex: 0 0 15px; margin: 2px 0 0 !important; accent-color: #2563eb; }
.quick-project-scope > span { display: grid; gap: 2px; min-width: 0; }
.quick-project-scope b { font-size: 12px; }
.quick-project-scope small { overflow: hidden; color: #6b7f9e; font-size: 10px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.quick-catalog-list { max-height: 680px; overflow: auto; border-top: 1px solid #e5eaf0; scrollbar-width: thin; }
.quick-catalog-group + .quick-catalog-group { border-top: 1px solid #dce3eb; }
.quick-catalog-group-heading { position: sticky; z-index: 2; top: 0; display: flex; width: 100%; min-height: 38px; align-items: center; justify-content: space-between; gap: 8px; padding: 0 10px; border: 0; border-bottom: 1px solid #e5eaf0; background: #f6f8fb; text-align: left; cursor: pointer; }
.quick-catalog-group-heading:hover { background: #eef3f9; }
.quick-catalog-group-heading > span { display: flex; min-width: 0; align-items: center; gap: 7px; }
.quick-catalog-group-heading i { display: grid; width: 17px; height: 17px; flex: 0 0 17px; place-items: center; color: #6b7f9e; font-size: 16px; font-style: normal; }
.quick-catalog-group-heading b { overflow: hidden; color: #52627a; font-size: 11px; font-weight: 800; letter-spacing: .025em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.quick-catalog-group-heading em { color: #8391a4; font-size: 10px; font-style: normal; font-weight: 750; }
.quick-catalog-product { position: relative; display: grid; width: 100%; grid-template-columns: 58px minmax(0,1fr); gap: 10px; align-items: stretch; min-height: 82px; padding: 11px 10px; border-bottom: 1px solid #edf1f5; background: #fff; color: #334155; text-align: left; }
.quick-catalog-product:hover, .quick-catalog-product:focus-within { z-index: 1; background: #f5f8ff; outline: 1px solid #a9c0f4; outline-offset: -1px; }
.quick-catalog-product.is-inspected { z-index: 1; background: #f2f6ff; box-shadow: inset 3px 0 0 #2563eb; }
.quick-catalog-product.is-selected { background: #f7faff; }
.quick-catalog-image, .quick-line-image { display: grid; grid-template: minmax(0,1fr) / minmax(0,1fr); overflow: hidden; place-items: center; border: 1px solid #e2e8f0; border-radius: 7px; background: #fff; }
.quick-catalog-preview { position: relative; width: 58px; height: 58px; padding: 0; border: 0; border-radius: 8px; background: transparent; cursor: zoom-in; }
.quick-catalog-image { width: 58px; height: 58px; }
.quick-catalog-image img, .quick-line-image img { display: block; min-width: 0; min-height: 0; width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; }
.quick-product-image-placeholder { display: grid; place-items: center; gap: 1px; color: #93a0b2; }
.quick-product-image-placeholder > span { font-size: 18px; line-height: 1; }
.quick-product-image-placeholder small { font-size: 8px; }
.quick-catalog-preview-cue { position: absolute; right: -3px; bottom: -3px; display: grid; width: 27px; height: 27px; place-items: center; border: 1px solid #d4def0; border-radius: 7px; background: rgba(255,255,255,.96); color: #2563eb; box-shadow: 0 2px 7px rgba(15,23,42,.16); }
.quick-catalog-preview-cue svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.quick-catalog-main { display: grid; min-width: 0; grid-template-columns: minmax(0,1fr) 30px; gap: 8px; align-items: center; padding: 0; border: 0; background: transparent; text-align: left; cursor: pointer; }
.quick-catalog-copy { display: grid; min-width: 0; gap: 2px; }
.quick-catalog-copy b { display: -webkit-box; overflow: hidden; color: #263549; font-size: 13px; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.quick-catalog-copy small { overflow: hidden; color: #758397; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.quick-catalog-copy em { color: #2563eb; font-size: 12px; font-style: normal; font-weight: 750; }
.quick-catalog-add { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 7px; background: #eaf1ff; color: #2563eb; font-size: 17px; font-weight: 750; }
.quick-catalog-product > i { position: absolute; top: 4px; right: 4px; color: #4f70a7; font-size: 7px; font-style: normal; }
.quick-catalog-empty { display: grid; gap: 5px; padding: 28px 16px; color: #718096; text-align: center; }
.quick-catalog-empty b { color: #334155; font-size: 12px; }
.quick-catalog-empty span { font-size: 12px; line-height: 1.45; }
.quick-catalog-status { display: grid; justify-items: center; gap: 6px; padding: 28px 16px; color: #718096; text-align: center; }
.quick-catalog-status b { color: #334155; font-size: 12px; }
.quick-catalog-status small { font-size: 11px; line-height: 1.45; }
.quick-catalog-status button, .quick-catalog-page-status button { min-height: 32px; padding: 0 11px; border: 1px solid #cbd7e7; border-radius: 7px; background: #fff; color: #2563eb; font-size: 11px; font-weight: 750; cursor: pointer; }
.quick-catalog-status.is-error, .quick-catalog-page-status.is-error { color: #b42318; }
.quick-catalog-spinner { width: 16px; height: 16px; border: 2px solid #dbe5f5; border-top-color: #2563eb; border-radius: 50%; animation: quick-catalog-spin .75s linear infinite; }
.quick-catalog-page-status { display: flex; min-height: 42px; align-items: center; justify-content: center; gap: 8px; padding: 7px 10px; border-top: 1px solid #e5eaf0; color: #64748b; font-size: 11px; }
.quick-catalog-more { width: 100%; min-height: 42px; border: 0; border-top: 1px solid #e5eaf0; background: #f8fafc; color: #2563eb; font-size: 11px; font-weight: 800; cursor: pointer; }
.quick-catalog-more:hover { background: #eef4ff; }
@keyframes quick-catalog-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .quick-catalog-spinner { animation: none; } }

.quick-product-inspector { position: sticky; top: 10px; min-width: 0; max-height: calc(100dvh - 20px); overflow: auto; border: 1px solid #dce3eb; border-radius: 10px; background: #fff; scrollbar-width: thin; }
.quick-product-inspector-heading { position: sticky; z-index: 2; top: 0; display: flex; min-height: 56px; align-items: center; justify-content: space-between; gap: 10px; padding: 0 13px; border-bottom: 1px solid #e5eaf0; background: rgba(248,250,252,.96); backdrop-filter: blur(8px); }
.quick-product-inspector-heading > div { display: grid; gap: 2px; }
.quick-product-inspector-heading small { color: #2563eb; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.quick-product-inspector-heading h3 { margin: 0; color: #172033; font-size: 15px; }
.quick-product-inspector-body { padding: 11px; user-select: text; }
.quick-product-inspector .catalog-product-card { display: grid; grid-template-columns: 82px minmax(0,1fr); gap: 10px; align-items: center; padding: 9px; border: 1px solid #e0e6ec; border-radius: 9px; }
.quick-product-inspector .catalog-product-card-image { position: relative; display: grid; grid-template: minmax(0,1fr) / minmax(0,1fr); width: 82px; height: 92px; overflow: hidden; place-items: center; padding: 0; border: 0; border-radius: 6px; background: #f5f7f9; }
.quick-product-inspector button.catalog-product-card-image { cursor: zoom-in; }
.quick-product-inspector .catalog-product-card-image > img { display: block; min-width: 0; min-height: 0; width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; background: #fff; }
.quick-product-inspector .quick-catalog-preview-cue { right: 3px; bottom: 3px; }
.quick-product-inspector .catalog-product-card-image .quick-product-image-placeholder { min-height: 70px; }
.quick-product-inspector .catalog-product-card-image .quick-product-image-placeholder > span { font-size: 24px; }
.quick-product-inspector .catalog-product-card-copy { display: grid; min-width: 0; gap: 3px; }
.quick-product-inspector .catalog-product-card-copy small { overflow: hidden; font-size: 9.5px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.quick-product-inspector .catalog-product-card-copy > .catalog-product-card-sku { overflow: visible; color: #52627a; overflow-wrap: anywhere; white-space: normal; }
.quick-product-inspector .catalog-product-card-copy > b { display: -webkit-box; overflow: hidden; color: #334155; font-size: 12px; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.quick-product-inspector .catalog-product-card-copy > i { color: #718096; font-size: 9px; font-style: normal; line-height: 1.35; overflow-wrap: anywhere; }
.quick-product-inspector .catalog-product-card-copy > em { display: grid; gap: 1px; color: #52627a; font-size: 9px; font-style: normal; font-weight: 650; line-height: 1.35; overflow-wrap: anywhere; }
.quick-product-inspector .catalog-product-card-copy > em small { color: #8995a4; font-size: 8px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.quick-product-inspector .catalog-product-card-copy > strong { color: #172033; font-size: 12px; }
.quick-product-inspector-links { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; }
.quick-product-inspector-links a { display: inline-flex; min-height: 30px; align-items: center; justify-content: center; gap: 4px; padding: 0 8px; border: 1px solid #cad9f8; border-radius: 7px; background: #f7faff; color: #2563eb; font-size: 9.5px; font-weight: 750; text-decoration: none; }
.quick-product-inspector-links a:hover { border-color: #8fb0fb; background: #eef4ff; }
.quick-product-inspector .catalog-product-details { margin: 10px 0 0; padding: 10px; border: 1px solid #e0e6ec; border-radius: 8px; background: #fbfcfd; }
.quick-product-inspector .catalog-product-details h3 { margin: 0 0 6px; color: #718096; font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.quick-product-inspector .catalog-product-details > p { margin: 0 0 13px; color: #46566a; font-size: 10.5px; line-height: 1.55; overflow-wrap: anywhere; white-space: pre-line; }
.quick-product-inspector .catalog-product-details > p:last-child { margin-bottom: 0; color: #8793a2; }
.quick-product-inspector .catalog-product-details dl { margin: 0; border-top: 1px solid #e8edf2; }
.quick-product-inspector .catalog-product-details dl div { display: grid; min-height: 30px; grid-template-columns: minmax(76px,.9fr) 1.1fr; gap: 8px; align-items: start; padding: 7px 0; border-bottom: 1px solid #edf1f4; }
.quick-product-inspector .catalog-product-details dl div:last-child { padding-bottom: 0; border-bottom: 0; }
.quick-product-inspector .catalog-product-details dt { color: #78879a; font-size: 9.5px; line-height: 1.4; }
.quick-product-inspector .catalog-product-details dd { margin: 0; color: #38475a; font-size: 9.5px; font-weight: 650; line-height: 1.4; overflow-wrap: anywhere; text-align: right; }
.quick-product-inspector-empty { display: grid; min-height: 260px; place-content: center; justify-items: center; gap: 7px; padding: 24px; color: #8a98aa; text-align: center; }
.quick-product-inspector-empty > span { display: grid; width: 42px; height: 42px; place-items: center; border: 1px dashed #a9bee8; border-radius: 10px; background: #f3f6fc; color: #5d7fbd; font-size: 22px; }
.quick-product-inspector-empty b { color: #475569; font-size: 12px; }
.quick-product-inspector-empty p { max-width: 200px; margin: 0; font-size: 11px; line-height: 1.5; }
.quick-product-inspector-error p { margin-bottom: 7px !important; color: #a33a45 !important; }
.quick-product-inspector-error button { min-height: 34px; padding: 0 10px; border: 1px solid #e4b6bb; border-radius: 7px; background: #fff7f7; color: #a33a45; font-size: 10px; font-weight: 750; cursor: pointer; }
.quick-product-inspector a:focus-visible, .quick-product-inspector button:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }

.quick-estimate { min-width: 0; overflow: hidden; border: 1px solid #dce3eb; border-radius: 10px; background: #fff; }
.quick-estimate-heading { display: flex; min-height: 56px; align-items: center; justify-content: space-between; gap: 14px; padding: 0 14px; border-bottom: 1px solid #e5eaf0; background: #f8fafc; }
.quick-estimate-heading h2 { margin: 2px 0 0; color: #172033; font-size: 17px; }
.quick-estimate-lines { display: grid; }
.quick-estimate-line { display: grid; grid-template-columns: var(--quick-order-size,32px) 50px minmax(170px,1fr) 105px 104px 112px 24px; gap: 9px; align-items: center; padding: 12px 11px 0; border-bottom: 1px solid #dce3eb; }
.quick-estimate-line.is-inspected { background: #f7faff; box-shadow: inset 3px 0 0 #2563eb; }
.quick-line-order { display: grid; justify-items: center; align-self: start; gap: 2px; color: #94a3b8; user-select: none; }
.quick-line-move { display: grid; width: var(--quick-order-size,32px); height: var(--quick-order-size,32px); place-items: center; padding: 0; border: 1px solid transparent; border-radius: 6px; background: transparent; color: #64748b; cursor: pointer; }
.quick-line-move svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.quick-line-move.is-down svg { transform: rotate(180deg); }
.quick-line-move:hover:not(:disabled) { border-color: #cbd7e6; background: #eaf1ff; color: #2563eb; }
.quick-line-move:focus-visible { outline: 2px solid #2563eb; outline-offset: 1px; }
.quick-line-move:disabled { color: #c4ccd7; cursor: default; }
@media (pointer: coarse) {
  .quick-estimate-line { --quick-order-size: 44px; }
}
.quick-line-number { color: #8795a8; font-size: 11px; text-align: center; }
.quick-line-image { width: 48px; height: 48px; }
.quick-line-identity { display: grid; min-width: 0; gap: 5px; }
.quick-line-identity > input { width: 100%; height: 30px; box-sizing: border-box; padding: 0 6px; border: 1px solid transparent; background: transparent; color: #263549; font-size: 13px; font-weight: 750; }
.quick-line-identity > span { display: grid; grid-template-columns: minmax(80px,.7fr) minmax(90px,1fr); gap: 5px; }
.quick-line-identity label { display: flex !important; align-items: center; min-width: 0; margin: 0 !important; color: #7f8da0 !important; font-size: 10px !important; white-space: nowrap; }
.quick-line-identity label input { width: 100%; min-width: 0; height: 26px !important; margin: 0 !important; padding: 0 4px !important; border: 1px solid transparent; background: transparent; color: #55657b; font-size: 11px !important; }
.quick-line-identity input:hover, .quick-line-identity input:focus { border-color: #cbd7e6; background: #fff; }
.quick-line-price, .quick-line-quantity, .quick-line-total { display: grid !important; gap: 5px; margin: 0 !important; }
.quick-line-price > small, .quick-line-quantity > small, .quick-line-total > small { color: #7f8da0; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.quick-line-price > span { display: flex; height: 34px; align-items: center; overflow: hidden; border: 1px solid #dce3eb; border-radius: 6px; background: #fff; }
.quick-line-price input { width: 100%; min-width: 0; height: 32px !important; margin: 0 !important; padding: 0 4px !important; border: 0 !important; text-align: right; font-size: 12px !important; }
.quick-line-price b { padding-right: 7px; color: #7f8da0; font-size: 10px; }
.quick-line-quantity > .quick-quantity-stepper { justify-self: start; }
.quick-line-total b { color: #172033; font-size: 13px; white-space: nowrap; }
.quick-line-remove { width: 24px; height: 28px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: #94a3b8; font-size: 17px; }
.quick-line-remove:hover { background: #fff1f2; color: #b4232d; }
.quick-line-works { grid-column: 2/-1; margin: 10px -11px 0 -2px; border-top: 1px solid #e5eaf0; background: #f8fafc; }
.quick-line-works-heading { display: grid; width: 100%; min-height: 46px; grid-template-columns: 20px minmax(0,1fr) auto; align-items: center; gap: 8px; padding: 0 12px; border: 0; background: transparent; text-align: left; cursor: pointer; }
.quick-line-works-heading:hover { background: #f1f5f9; }
.quick-line-works-heading > i { color: #718096; font-size: 17px; font-style: normal; text-align: center; }
.quick-line-works-heading > span { display: grid; gap: 1px; }
.quick-line-works-heading b { color: #475569; font-size: 11px; }
.quick-line-works-heading small { color: #8391a4; font-size: 10px; }
.quick-line-works-heading > strong { color: #475569; font-size: 12px; }
.quick-line-work { display: grid; grid-template-columns: minmax(160px,1fr) 46px 116px 100px; gap: 9px; align-items: center; min-height: 48px; padding: 6px 12px; border-top: 1px dashed #dce3eb; }
.quick-line-work-name { display: grid; grid-template-columns: 16px minmax(0,1fr); gap: 1px 5px; min-width: 0; }
.quick-line-work-name i { grid-row: 1/3; color: #94a3b8; font-style: normal; }
.quick-line-work-name b { overflow: hidden; color: #475569; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.quick-line-work-name small { color: #8391a4; font-size: 10px; }
.quick-line-work-quantity { color: #7f8da0; font-size: 10px; text-align: right; }
.quick-line-work-price { display: flex; height: 30px; align-items: center; overflow: hidden; border: 1px solid #dce3eb; border-radius: 6px; background: #fff; }
.quick-line-work-price input { width: 100%; min-width: 0; height: 28px !important; margin: 0 !important; padding: 0 3px !important; border: 0 !important; text-align: right; font-size: 11px !important; }
.quick-line-work-price > b { padding-right: 5px; color: #7f8da0; font-size: 10px; }
.quick-line-work-price button { width: 25px; height: 30px; padding: 0; border: 0; border-left: 1px solid #ead7ae; background: #fff8e8; color: #a56c26; }
.quick-line-work-price button[hidden] { display: none; }
.quick-line-work > strong { color: #475569; font-size: 11px; text-align: right; white-space: nowrap; }
.quick-line-works .presale-product-work-add { padding: 7px 12px; background: transparent; }
.quick-line-works .presale-add-line-work { padding: 6px 9px; border-color: #bdcdf0; color: #2563eb; font-family: var(--crm-font); font-size: 11px; }
.quick-estimate-empty { display: grid; min-height: 250px; place-content: center; justify-items: center; gap: 6px; padding: 25px; color: #718096; text-align: center; }
.quick-estimate-empty > span { display: grid; width: 42px; height: 42px; place-items: center; border: 1px dashed #9bb4e8; border-radius: 10px; background: #f2f6ff; color: #2563eb; font-size: 22px; }
.quick-estimate-empty b { color: #334155; font-size: 13px; }
.quick-estimate-empty p { max-width: 370px; margin: 0; font-size: 13px; line-height: 1.5; }
.quick-additional-works { padding: 13px; background: #fff; }
.quick-additional-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 9px; }
.quick-additional-list { display: grid; gap: 6px; }
.quick-additional-list > p { margin: 0; padding: 14px; border: 1px dashed #dce3eb; border-radius: 7px; color: #7f8da0; font-size: 12px; text-align: center; }
.quick-additional-row { display: grid; grid-template-columns: minmax(160px,1fr) 128px 28px; gap: 7px; }
.quick-additional-row > input, .quick-additional-row > span { height: 34px; border: 1px solid #dce3eb; border-radius: 6px; }
.quick-additional-row > input { padding: 0 9px; font-size: 12px; }
.quick-additional-row > span { display: flex; align-items: center; overflow: hidden; }
.quick-additional-row > span input { width: 100%; min-width: 0; height: 32px; padding: 0 4px; border: 0; text-align: right; font-size: 12px; }
.quick-additional-row > span b { padding-right: 6px; color: #7f8da0; font-size: 10px; }
.quick-additional-row > button { border: 0; border-radius: 6px; background: #f8fafc; color: #94a3b8; font-size: 16px; }
.quick-additional-row > button:hover { background: #fff1f2; color: #b4232d; }
.quick-additional-actions { display: flex; justify-content: flex-start; margin-top: 9px; }
.quick-additional-work-add { position: relative; }
.quick-additional-work-add .presale-line-work-picker-menu { z-index: 4; width: min(420px, calc(100vw - 72px)); }
.quick-additional-actions > button,
.quick-additional-actions .presale-add-line-work { min-height: 38px; padding: 0 12px; border: 1px solid #bdcdf0; border-radius: 7px; background: #fff; color: #2563eb; font-size: 12px; font-weight: 700; cursor: pointer; }
.quick-additional-actions > button:hover,
.quick-additional-actions .presale-add-line-work:hover,
.quick-additional-actions .presale-add-line-work[aria-expanded="true"] { border-color: #8fb0fb; background: #f4f7ff; }

.quick-catalog-group-heading:focus-visible, .quick-catalog-preview:focus-visible, .quick-catalog-main:focus-visible, .quick-catalog-more:focus-visible, .quick-catalog-status button:focus-visible, .quick-catalog-page-status button:focus-visible, .quick-line-works-heading:focus-visible, .quick-additional-actions > button:focus-visible, .quick-additional-actions .presale-add-line-work:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }

@media (max-width: 1600px) {
  .quick-project-workspace { grid-template-columns: 280px minmax(0,1fr); }
  .quick-product-inspector { position: static; grid-column: 1/-1; max-height: none; }
  .quick-product-inspector-body { display: grid; grid-template-columns: minmax(260px,340px) minmax(0,1fr); gap: 10px; }
  .quick-product-inspector-links { grid-column: 1; align-content: start; margin-top: 0; }
  .quick-product-inspector .catalog-product-details { grid-column: 2; grid-row: 1/3; margin-top: 0; }
}
@media (max-width: 1380px) {
  .quick-project-header { grid-template-columns: minmax(220px,1fr) auto auto; }
  .quick-project-actions { grid-column: 1/-1; justify-self: end; margin-top: -9px; }
  .quick-estimate-line { grid-template-columns: var(--quick-order-size,32px) 44px minmax(150px,1fr) 95px 96px 100px 22px; gap: 7px; }
  .quick-line-image { width: 42px; height: 42px; }
}
@media (max-width: 1120px) {
  #order-form.quick-project-mode .project-workspace-layout { grid-template-columns: minmax(600px,1fr); }
  #order-form.quick-project-mode .project-info-sidebar { grid-row: 1; }
  #order-form.quick-project-mode .project-info-toggle { right: 0; }
  .quick-project-workspace { grid-template-columns: 280px minmax(0,1fr); }
  .quick-project-totals > span { min-width: 88px; padding-inline: 9px; }
}
@media (max-width: 800px) {
  .orders-create-control .project-create-dropdown { right: auto; left: 0; }
  .project-create-kind-summary { grid-template-columns: 42px minmax(0,1fr); }
  .project-create-kind-control { grid-column: 1/-1; }
  .project-create-kind-control .project-create-trigger { width: 100%; }
  .project-create-kind-control .project-create-dropdown { right: auto; left: 0; }
  #order-form.quick-project-mode .project-workspace-main { display: block; }
  .quick-project-header { grid-template-columns: 1fr; }
  .quick-project-totals { width: 100%; }
  .quick-project-totals > span { min-width: 0; flex: 1; }
  .quick-project-actions { grid-column: auto; justify-self: stretch; margin: 0; }
  .quick-project-presentation-basics, .quick-project-presentation-copy { grid-template-columns: 1fr; }
  .quick-project-workspace { grid-template-columns: 1fr; }
  .quick-catalog-list { max-height: 320px; }
  .quick-estimate-line { grid-template-columns: var(--quick-order-size,32px) 44px minmax(120px,1fr) 25px; }
  .quick-line-price, .quick-line-quantity, .quick-line-total { grid-row: 2; }
  .quick-line-price { grid-column: 2; }
  .quick-line-quantity { grid-column: 3; }
  .quick-line-total { grid-column: 4; }
  .quick-line-remove { grid-column: 4; grid-row: 1; }
  .quick-line-works { grid-column: 1/-1; }
  .quick-product-inspector-body { display: block; }
  .quick-product-inspector-links { margin: 8px 0 0; padding: 0; }
  .quick-product-inspector .catalog-product-details { margin-top: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .project-create-dropdown { animation: none; }
  .project-create-trigger > svg, .project-create-option-arrow { transition: none; }
}

/* Contours use the full workspace; editing stays in the location view. */
.structure-workbench.structure-map-workbench,
#order-form.project-detail-mode:not(.project-info-collapsed) .structure-workbench.structure-map-workbench { grid-template-columns: minmax(0,1fr); }
.structure-map-workbench .structure-canvas-content { padding: 24px clamp(16px, 4vw, 56px) 36px; container-type: inline-size; }
@container (max-width: 620px) {
  .structure-map-legend { gap: 8px 16px; margin-bottom: 22px; }
  .structure-map-legend > small { flex-basis: 100%; margin-left: 0; }
  .structure-map-branch { --map-indent: 20px; --map-child-anchor: 10px; --map-root-anchor: 18px; }
  .structure-map-slave { gap: 8px; padding: 10px 11px; }
}
@container (max-width: 420px) {
  .structure-map-branch { --map-indent: 16px; --map-child-anchor: 8px; --map-root-anchor: 14px; }
  .structure-map-slave { gap: 7px; padding: 10px 9px; }
  .structure-map-slave .structure-map-symbol { flex-basis: 26px; width: 26px; height: 26px; }
}

.structure-map-model small { display: block; margin-top: 3px; color: #687b91; font-size: 11px; }
.structure-map-issues { margin-bottom: 20px; padding: 12px 16px; border: 1px solid #e7d7b7; border-radius: 8px; background: #fffaf0; color: #88622f; font-size: 12px; line-height: 1.6; }
.structure-map-issues ul { margin: 6px 0 0; padding-left: 18px; }

/* Folder-like control trees use local connectors, never crossing wires. */
.structure-contour-map { max-width: 1180px; gap: 44px; }
.structure-control-tree, .structure-control-children { list-style: none; padding: 0; margin: 0; }
.structure-control-tree { --control-indent: 48px; --control-line: #a8bfdc; }
.structure-control-tree li { position: relative; min-width: 0; }
.structure-control-children { margin-left: 30px; padding-left: var(--control-indent); }
.structure-control-children > li { padding-top: 20px; }
.structure-control-children > li::before { content: ''; position: absolute; left: calc(-1 * var(--control-indent)); top: 0; bottom: 0; border-left: 2px solid var(--control-line); }
.structure-control-children > li:last-child::before { bottom: auto; height: 57px; }
.structure-control-children > li::after { content: ''; position: absolute; left: calc(-1 * var(--control-indent)); top: 57px; width: var(--control-indent); border-top: 2px solid var(--control-line); }
.structure-control-folder > summary { position: relative; list-style: none; cursor: pointer; border-radius: 12px; }
.structure-control-folder > summary::-webkit-details-marker { display: none; }
.structure-control-folder > summary::after { content: ''; position: absolute; right: 26px; top: 31px; width: 9px; height: 9px; border-right: 2px solid #7588a1; border-bottom: 2px solid #7588a1; transform: rotate(-45deg); }
.structure-control-folder[open] > summary::after { transform: rotate(45deg); }
.structure-control-folder > summary:focus-visible { outline: 3px solid #729ee5; outline-offset: 4px; }
.structure-control-folder > summary:hover > div { border-color: #8faad0; }
.structure-control-tree :is(.structure-map-master, .structure-map-slave) { display: block; width: 100%; max-width: none; box-sizing: border-box; min-height: 106px; padding: 20px 60px 20px 24px; border-radius: 12px; }
.structure-control-tree .structure-map-slave::before, .structure-control-tree .structure-map-slave::after { display: none; }
.structure-map-card-heading { display: flex; align-items: flex-start; gap: 14px; }
.structure-map-card-heading > div { min-width: 0; }
.structure-control-tree .structure-map-symbol { width: 38px; height: 38px; flex-basis: 38px; }
.structure-control-tree .structure-map-role { font-size: 13px; }
.structure-control-tree .structure-map-card-name { display: block; color: #304e77; margin-top: 3px; font-size: 18px; font-weight: 650; line-height: 1.5; overflow-wrap: anywhere; }
.structure-control-tree .panel .structure-map-card-name { color: #685639; }
.structure-control-tree .room .structure-map-card-name { color: #355b57; }
.structure-control-tree .structure-map-card-heading small { display: block; margin-top: 5px; color: #687b91; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.structure-control-tree .structure-map-model { margin: 10px 0 0 52px; font-size: 14px; }
.structure-map-related { margin-top: 16px; padding-top: 13px; border-top: 1px solid #e5dcc9; }
.structure-map-related > span { display: block; margin-bottom: 8px; font-size: 13px; color: #846635; }
.structure-map-related > div { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.structure-map-reference { display: inline-flex; align-items: flex-start; gap: 9px; max-width: 100%; padding: 8px 12px; border: 1px solid #e5dcc9; border-radius: 7px; color: #927139; background: #fffdf7; }
.structure-map-reference > span:last-child { min-width: 0; }
.structure-control-tree .structure-map-reference b { margin: 0; font-size: 14px; line-height: 1.5; color: #725b35; }
.structure-control-tree .structure-map-reference small { margin-top: 3px; font-size: 12px; line-height: 1.5; }
@media (max-width: 700px) {
  .structure-control-tree { --control-indent: 18px; }
  .structure-control-children { margin-left: 12px; }
  .structure-control-tree :is(.structure-map-master, .structure-map-slave) { padding: 16px 36px 16px 14px; }
  .structure-control-folder > summary::after { right: 16px; top: 28px; }
  .structure-control-tree .structure-map-card-name { font-size: 16px; }
}

.structure-map-key.lighting > svg { border-radius: 7px; color: #7962a3; border-color: #cfc1e4; background: #f4effb; }
.structure-control-tree .structure-map-slave.panel.lighting { background: #f8f5fd; border-color: #cfc1e4; }
.structure-control-tree .lighting .structure-map-symbol { background: #eee5fa; color: #7962a3; }
.structure-control-tree .lighting .structure-map-role, .structure-control-tree .lighting .structure-map-card-name { color: #715699; }
.structure-control-tree .structure-map-related { border-top-color: #ded3ed; }
.structure-control-tree .structure-map-related > span { color: #7962a3; }
.structure-control-tree .structure-map-reference { color: #7962a3; background: #fcfaff; border-color: #ded3ed; }
.structure-control-tree .structure-map-reference b { color: #715699; }

.structure-control-arrow { position: absolute; left: -8px; top: 52px; z-index: 1; width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 8px solid #7897be; pointer-events: none; }