/* finesse · register=product · shell=centered-dense-workflow · accent=restrained-brand-red · DENSITY=8 SPECTACLE=1 */
:root { --base:#f4f3f0; --panel:#fbfaf7; --ink:#242321; --muted:#6d6a65; --rule:rgba(36,35,33,.16); --product-rule:#85817b; --rule-strong:rgba(36,35,33,.32); --accent:#a62922; --accent-soft:#f4deda; --danger:#9a231d; --focus:rgba(166,41,34,.34); --quote-image-size:96px; --nav-h:64px; --z-nav:10; --z-sticky:5; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
html, body { min-height:100%; overflow-x:clip; }
body { margin:0; background:var(--base); color:var(--ink); font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif; font-size:14px; line-height:1.5; }
.quote-app-shell { position:sticky; top:0; z-index:var(--z-nav); min-height:var(--nav-h); display:flex; align-items:center; justify-content:space-between; gap:18px; padding:8px max(20px, calc((100vw - 1440px) / 2)); border-bottom:1px solid var(--rule-strong); background:var(--panel); }
.quote-app-nav, .quote-app-identity { display:flex; align-items:center; gap:5px; min-width:0; }.quote-app-nav-link, .quote-app-logout { display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:0 10px; border:0; color:var(--muted); text-decoration:none; white-space:nowrap; }.quote-app-nav-link[aria-current="page"] { background:var(--accent-soft); color:var(--accent); font-weight:700; }.quote-app-count, .quote-app-role { font-size:12px; color:var(--muted); }.quote-app-user { max-width:140px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
button, input { font:inherit; }
button, .quiet-link { min-height:44px; }
button { border:1px solid var(--rule-strong); background:transparent; color:var(--ink); cursor:pointer; padding:8px 13px; }
button:hover:not(:disabled) { border-color:var(--accent); color:var(--accent); }
button:disabled { cursor:not-allowed; opacity:.52; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, a:focus-visible { outline:3px solid var(--focus); outline-offset:2px; }
.skip-link { position:fixed; z-index:20; top:-48px; left:12px; background:var(--ink); color:var(--panel); padding:10px 14px; text-decoration:none; }
.skip-link:focus { top:12px; }
.quote-workspace { width:min(1440px, 100%); margin:0 auto; padding:24px 30px 120px; }
.workspace-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; padding:12px 0 24px; border-bottom:1px solid var(--rule-strong); }
.workspace-heading h1, .panel-heading h2, .metadata-fields h2 { margin:0; font-size:24px; letter-spacing:-.03em; overflow-wrap:anywhere; min-width:0; }
.workspace-heading p:not(.workspace-kicker) { margin:8px 0 0; color:var(--muted); }
.workspace-kicker { margin:0 0 4px; color:var(--accent); font-size:11px; font-weight:700; letter-spacing:.08em; line-height:1.1; }
.quiet-link { display:inline-flex; align-items:center; color:var(--accent); white-space:nowrap; }
.quote-app-version { color:var(--muted); font-size:12px; }
.workspace-status { margin:16px 0; padding:12px 14px; border-top:2px solid var(--accent); background:var(--accent-soft); color:var(--ink); }
.workspace-recovery { margin:0 0 16px; }
.quote-view-tabs { display:flex; gap:10px; padding:14px 0; border-bottom:1px solid var(--rule-strong); }
.quote-view-tabs a { display:inline-flex; align-items:center; justify-content:center; min-height:48px; min-width:120px; padding:0 22px; border:1px solid var(--rule-strong); border-radius:4px; background:var(--panel); color:var(--ink); font-size:15px; font-weight:700; text-decoration:none; white-space:nowrap; }
.quote-view-tabs a[aria-current="page"] { background:var(--accent); color:var(--panel); border-color:var(--accent); }
@media (hover:hover) { .quote-view-tabs a:not([aria-current="page"]):hover { background:var(--accent-soft); border-color:var(--accent); color:var(--accent); } }
.quote-view-tabs a:active { box-shadow:inset 0 0 0 2px var(--rule-strong); }

.quote-history-view, .quote-detail-view { margin-top:18px; background:var(--panel); border:1px solid var(--rule); }.history-filters { display:grid; grid-template-columns:minmax(180px,2fr) repeat(3,minmax(120px,1fr)) auto auto; gap:10px; padding:14px 16px; border-bottom:1px solid var(--rule); }.history-filters label { display:grid; gap:4px; color:var(--muted); font-size:12px; }.history-filters input, .history-filters select, .history-filters textarea { min-width:0; min-height:40px; border:1px solid var(--rule-strong); background:var(--panel); color:var(--ink); padding:7px 8px; }.history-table { width:100%; border-collapse:collapse; table-layout:fixed; }.history-table th, .history-table td { height:42px; padding:7px 10px; border-bottom:1px solid var(--rule); text-align:left; overflow-wrap:anywhere; }.history-table th { background:rgba(36,35,33,.035); color:var(--muted); font-size:12px; font-weight:600; }.history-table th:nth-child(1) { width:14%; }.history-table th:nth-child(2) { width:15%; }.history-table th:nth-child(3) { width:18%; }.history-table th:nth-child(4) { width:12%; }.history-table th:nth-child(5) { width:7%; }.history-table th:nth-child(6) { width:12%; }.history-table th:nth-child(7) { width:10%; }.history-table th:nth-child(8) { width:12%; }.history-table tbody tr:last-child td { border-bottom:0; }.history-table button { min-height:34px; padding:5px 8px; }.history-pagination { display:flex; justify-content:flex-end; align-items:center; gap:12px; padding:12px 16px; }.history-pagination button { min-height:36px; }
.history-detail-content { padding:16px; }.history-overview { display:grid; grid-template-columns:130px minmax(0,1fr); gap:0; margin:0 0 14px; border-top:1px solid var(--rule); }.history-overview dt, .history-overview dd { min-width:0; margin:0; padding:9px 10px; border-bottom:1px solid var(--rule); }.history-overview dt { color:var(--muted); background:rgba(36,35,33,.035); }.history-overview dd { overflow-wrap:anywhere; }.status-tag { display:inline-flex; margin-top:4px; padding:2px 7px; border:1px solid var(--rule-strong); font-size:12px; }.status-void { color:var(--danger); border-color:var(--danger); }.void-audit { margin:12px 0; padding:10px; border:1px solid var(--danger); background:var(--accent-soft); }.history-actions { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0; }.history-line-list { border-top:1px solid var(--rule); }.history-line { display:grid; grid-template-columns:var(--quote-image-size) minmax(0,1fr) minmax(180px,auto); align-items:center; gap:8px 10px; padding:10px 0; border-bottom:1px solid var(--rule); }.history-line strong { min-width:0; overflow-wrap:anywhere; }.history-line p { grid-column:2; margin:0; color:var(--muted); font-size:12px; overflow-wrap:anywhere; }.history-line .numeric { grid-column:3; grid-row:1 / span 2; color:var(--ink); }
dialog { width:min(520px, calc(100% - 28px)); border:1px solid var(--rule-strong); background:var(--panel); color:var(--ink); padding:0; box-shadow:0 20px 60px rgba(36,35,33,.22); } dialog::backdrop { background:rgba(36,35,33,.42); } dialog form { display:grid; gap:14px; padding:20px; } dialog h2, dialog p { margin:0; } dialog label { display:grid; gap:6px; font-weight:600; } dialog textarea { min-height:120px; resize:vertical; } dialog menu { display:flex; justify-content:flex-end; gap:8px; margin:0; padding:0; }
.quote-lines-panel, .metadata-fields { background:var(--panel); border:1px solid var(--rule); margin-top:18px; }
.panel-heading { display:flex; justify-content:space-between; gap:16px; align-items:baseline; padding:14px 16px; border-bottom:1px solid var(--rule); }
.panel-heading span { color:var(--muted); font-size:12px; }
.quote-table-wrap { overflow-x:auto; }
.quote-lines-table { width:100%; min-width:960px; border-collapse:collapse; table-layout:fixed; }
.quote-lines-table th, .quote-lines-table td { min-width:0; height:46px; padding:8px 10px; border-bottom:1px solid var(--rule); overflow-wrap:anywhere; vertical-align:middle; }
.quote-lines-table th { background:rgba(36,35,33,.035); color:var(--muted); font-size:12px; font-weight:600; text-align:left; }
.quote-lines-table th:nth-child(1) { width:22%; }.quote-lines-table th:nth-child(2) { width:9%; }.quote-lines-table th:nth-child(3) { width:21%; }.quote-lines-table th:nth-child(4) { width:11%; }.quote-lines-table th:nth-child(5), .quote-lines-table th:nth-child(6) { width:13%; }.quote-lines-table th:nth-child(7) { width:11%; }
.quote-lines-table th.numeric { text-align:right; }
.quote-lines-table tbody tr:last-child td { border-bottom:0; }.numeric { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }.quote-lines-table input { width:100%; min-width:0; min-height:36px; border:1px solid var(--rule-strong); background:var(--panel); color:var(--ink); padding:4px 7px; }.quote-lines-table button { min-height:36px; }
.quote-product-cell, .quote-mobile-product { display:flex; align-items:center; gap:12px; min-width:0; }.quote-product-cell strong, .quote-mobile-product strong { min-width:0; overflow-wrap:anywhere; }.quote-product-image, .quote-product-placeholder { width:var(--quote-image-size); height:var(--quote-image-size); flex:0 0 var(--quote-image-size); object-fit:contain; border:1px solid var(--rule); background:var(--base); }.quote-product-placeholder { display:grid; place-items:center; color:var(--muted); font-size:11px; line-height:1; }.quote-lines-table td small { display:block; margin-top:3px; color:var(--muted); font-size:11px; line-height:1.35; }
.quote-lines-mobile { display:none; }
.quote-metadata { display:grid; grid-template-columns:minmax(0, 1fr) 300px; align-items:start; gap:18px; margin-top:18px; }
.metadata-fields { margin-top:0; padding:16px; }.metadata-grid { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px; margin-top:16px; }.metadata-grid label { display:grid; gap:6px; font-weight:600; }.metadata-grid label span { color:var(--accent); }.metadata-grid input { min-width:0; min-height:44px; border:1px solid var(--rule-strong); background:var(--panel); padding:9px 10px; color:var(--ink); }.metadata-grid input:invalid { border-color:var(--danger); }
.field-error { color:var(--danger); font-size:12px; font-weight:600; }
.quote-total-region { position:sticky; top:calc(var(--nav-h) + 16px); z-index:var(--z-sticky); display:grid; gap:8px; padding:16px; border:1px solid var(--rule-strong); background:var(--ink); color:var(--panel); }.quote-total-region span { color:#d5d1ca; font-size:12px; }.quote-total-region strong { font-size:26px; letter-spacing:-.03em; }.quote-total-region button { border-color:#d5d1ca; color:var(--panel); white-space:nowrap; }.quote-total-region button:hover:not(:disabled) { border-color:#fff0ed; color:#fff0ed; }
@media (max-width: 720px) { :root { --quote-image-size:80px; } .quote-workspace { padding:16px 14px 106px; }.workspace-heading { align-items:flex-start; flex-direction:column; }.workspace-heading h1 { font-size:22px; }.quiet-link { min-height:44px; }.quote-table-wrap { display:none; }.quote-lines-mobile { display:grid; gap:0; }.quote-mobile-row { display:grid; gap:7px; padding:14px; border-bottom:1px solid var(--rule); }.quote-mobile-row:last-child { border-bottom:0; }.quote-mobile-row p { margin:0; color:var(--muted); }.quote-mobile-row .numeric { color:var(--ink); text-align:left; }.quote-mobile-row input { min-height:44px; width:100%; border:1px solid var(--rule-strong); background:var(--panel); padding:8px; }.quote-mobile-row button { min-height:44px; justify-self:start; }.quote-metadata { grid-template-columns:minmax(0,1fr); }.metadata-grid { grid-template-columns:minmax(0,1fr); }.quote-total-region { position:fixed; right:0; bottom:0; left:0; top:auto; z-index:var(--z-sticky); grid-template-columns:1fr auto; align-items:center; gap:4px 14px; border-width:1px 0 0; }.quote-total-region button { grid-row:1 / span 2; grid-column:2; }.quote-total-region strong { text-align:left; }.workspace-kicker { line-height:1.1; }.history-filters { grid-template-columns:minmax(0,1fr); }.history-filters button { min-height:44px; }.history-overview { grid-template-columns:108px minmax(0,1fr); }.history-line { grid-template-columns:var(--quote-image-size) minmax(0,1fr); }.history-line .numeric { grid-column:2; grid-row:auto; text-align:left; }.history-actions button { flex:1 1 100%; } }
@media (max-width: 900px) { .quote-app-shell { align-items:flex-start; flex-direction:column; gap:2px; }.quote-app-nav, .quote-app-identity { width:100%; overflow-x:auto; }.quote-app-identity { justify-content:flex-end; } }
@media (max-width: 480px) { .quote-app-shell { padding-inline:10px; }.quote-app-nav-link, .quote-app-logout { padding-inline:8px; }.quote-app-user, .quote-app-role { display:none; } }
@media (prefers-reduced-motion:reduce) { *, *::before, *::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; } }

.document-toolbar{display:flex;align-items:end;flex-wrap:wrap;gap:12px;padding:16px 0;border-bottom:1px solid var(--rule);margin-bottom:18px}.document-toolbar[hidden]{display:none}.document-toolbar label{display:grid;gap:6px;font-weight:600;font-size:12px}.document-toolbar select{min-height:44px;min-width:140px;padding:8px;border:1px solid var(--rule-strong);background:var(--panel);color:var(--ink)}.document-toolbar button{min-height:44px}.document-toolbar p{flex:1 0 100%;margin:0;color:var(--muted);font-size:12px}.document-preview{width:min(960px,calc(100vw - 24px));max-height:90vh;padding:16px;border:1px solid var(--rule-strong);background:var(--panel);color:var(--ink)}.document-preview::backdrop{background:rgba(29,29,27,.55)}.document-preview header{display:flex;gap:12px;align-items:center;justify-content:space-between;position:sticky;top:-16px;background:var(--panel);padding:12px 0}.document-preview h2{font-size:18px;margin:0}.document-preview button{min-height:44px;flex-shrink:0}.document-pages{display:grid;gap:16px}.document-pages img{display:block;width:100%;height:auto;border:1px solid var(--rule)}@media(max-width:480px){.document-toolbar label{flex:1 1 40%;min-width:0}.document-toolbar select{width:100%;min-width:0}.document-toolbar button{flex:1 1 40%}.document-preview{padding:10px}.document-preview h2{font-size:15px}}

/* Product boundaries stay visible in the table, detail list and mobile cards. */
.quote-lines-table td, .quote-mobile-row, .history-line { border-bottom:1px solid var(--product-rule); }

/* Compact editing actions preserve table-cell alignment. */
.quote-row-actions button { margin: 3px 6px 3px 0; white-space: nowrap; }
#draftSourceNotice { padding: 10px 14px; border-top: 2px solid var(--accent); background: var(--accent-soft); }
#saveDraftMetadata { justify-self: start; }
#englishNameField[hidden], #saveEnglishName[hidden] { display:none; }
#englishNameField input { min-height:44px; width:190px; padding:8px 10px; border:1px solid var(--rule-strong); background:var(--panel); color:var(--ink); font:inherit; }
#englishNameStatus:not(:empty) { align-self:center; color:var(--muted); font-size:12px; }