:root { --ink:#172534 !important; --muted:#617187 !important; --line:#dce5ef !important; --soft:#f5f8fc !important; --paper:#fff !important; --brand:#1677ff !important; --brand-deep:#0f5ed7 !important; --mint:#e6f0ff !important; --blue:#dbeafe !important; --orange:#fff1da !important; --indigo:#ecebff !important; --danger:#c74b43 !important; --shadow:0 16px 42px rgba(0,26,51,.13) !important; font-family:"Noto Sans SC",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--ink); background:#f4f7f6; }
/* Reference visual system: navy navigation, bright operational blue, cool gray work surface. */
.sidebar { background:#001a33 !important; }
.brand { min-height:63px; padding:0 2px 24px !important; }
.brand-logo { display:block; width:220px; max-width:100%; height:48px; object-fit:contain; object-position:left center; }
.nav-item { color:#b7c8dc !important; }
.nav-item:hover { color:#fff !important; background:#082c50 !important; }
.nav-item.active { color:#fff !important; background:#1677ff !important; }
.sidebar-footer { border-color:rgba(191,211,235,.18) !important; }
.brand span,.user-chip span,.user-chip .icon-button { color:#b8c8da !important; }
.primary-button,.dingtalk-login,.multi-done { background:#1677ff !important; box-shadow:0 4px 10px rgba(22,119,255,.2) !important; }
.primary-button:hover,.dingtalk-login:hover { background:#0f5ed7 !important; }
.text-button,.push-link,.code-button,.all-cost-results summary,.candidate-terms summary { color:#1267d6 !important; }
.segmented-control button.active,.inquiry-quick.active,.cost-source-tab.active { background:#1677ff !important; border-color:#1677ff !important; }
.field input:focus,.field select:focus,.field textarea:focus,.multi-trigger:hover { border-color:#1677ff !important; }
.choice-row input,.multi-option input,.table-check { accent-color:#1677ff !important; }
.detail-hero { background:#001a33 !important; }
.login-screen { background:#edf3f8 !important; }
.login-card { border-color:#d7e1ec !important; box-shadow:0 18px 44px rgba(0,26,51,.14) !important; }
.login-logo { display:block; width:220px; height:48px; object-fit:contain; object-position:left center; }
.preview-login button { color:#1267d6 !important; background:#edf4ff !important; border-color:#bcd4f3 !important; }
[hidden] { display:none !important; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; background:#f4f7f6; }
button,input,select { font:inherit; }
button { cursor:pointer; }
button:focus-visible,input:focus-visible,select:focus-visible { outline:3px solid rgba(8,115,109,.23); outline-offset:2px; }
.app-shell { min-height:100vh; display:flex; }
.sidebar { width:244px; min-height:100vh; background:#103b3a; color:#e8f2ef; display:flex; flex-direction:column; padding:24px 14px 16px; position:fixed; inset:0 auto 0 0; z-index:20; }
.brand { display:flex; align-items:center; gap:11px; padding:0 10px 28px; }
.brand-mark { height:34px; width:34px; background:#50c5af; color:#0c3433; display:grid; place-items:center; border-radius:8px; font-family:"DM Mono",monospace; font-size:12px; font-weight:500; letter-spacing:0; }
.brand strong { display:block; color:#fff; font-size:15px; letter-spacing:0; line-height:1.1; }
.brand span,.user-chip span { display:block; color:#a9c2bd; font-size:11px; margin-top:3px; }
.main-nav { display:grid; gap:4px; }
.nav-item,.help-link { display:flex; border:0; background:transparent; width:100%; align-items:center; gap:12px; color:#bad0cb; padding:11px 11px; text-align:left; border-radius:6px; font-size:14px; }
.nav-item svg,.help-link svg { width:18px; height:18px; stroke-width:1.8; }
.nav-item:hover,.help-link:hover { background:rgba(255,255,255,.07); color:#fff; }
.nav-item.active { color:#fff; background:#17605c; font-weight:600; }
.nav-item b { margin-left:auto; font-family:"DM Mono",monospace; background:rgba(232,250,246,.16); color:#c9e8e0; border-radius:10px; padding:1px 6px; font-size:10px; }
.sidebar-footer { margin-top:auto; border-top:1px solid rgba(225,245,239,.14); padding-top:12px; }
.help-link { margin-bottom:8px; }
.user-chip { display:flex; align-items:center; gap:9px; padding:9px; }
.user-chip strong { display:block; font-size:13px; color:#f7fbfa; }
.user-chip>svg { width:14px; color:#a9c2bd; margin-left:auto; }
.avatar { border:0; height:30px; width:30px; border-radius:50%; display:grid; place-items:center; flex:0 0 auto; font-size:12px; font-weight:700; }
.avatar-blue { color:#16456a; background:#a9d7f5; }
.workspace { width:calc(100% - 244px); margin-left:244px; min-height:100vh; }
.topbar { height:66px; padding:0 34px; background:rgba(255,255,255,.9); border-bottom:1px solid #e6edeb; display:flex; align-items:center; justify-content:space-between; position:sticky; z-index:10; top:0; backdrop-filter:blur(8px); }
.crumbs { display:flex; align-items:center; gap:8px; color:#778582; font-size:13px; }.crumbs svg { width:14px; }.crumbs strong { color:#344341; font-weight:600; }
.topbar-actions { display:flex; align-items:center; gap:13px; }.top-avatar { width:31px; height:31px; }
.icon-button { height:34px; width:34px; background:transparent; border:0; color:#52625f; display:grid; place-items:center; border-radius:6px; position:relative; }
.icon-button:hover { background:#edf4f2; color:#075c57; }.icon-button svg { height:18px; width:18px; stroke-width:1.8; }.icon-button em { position:absolute; height:6px; width:6px; border-radius:50%; background:#ef7663; top:7px; right:7px; border:1px solid white; }.mobile-menu { display:none; }
.page-head { padding:34px 34px 28px; display:flex; align-items:flex-end; justify-content:space-between; gap:16px; max-width:1580px; margin:0 auto; }
.eyebrow { margin:0 0 6px; color:#7a8a87; font-size:10px; font-family:"DM Mono",monospace; letter-spacing:.5px; }.page-head h1 { font-size:28px; line-height:1.25; margin:0; font-weight:700; letter-spacing:0; }.subhead { color:var(--muted); margin:8px 0 0; font-size:14px; }.primary-button,.secondary-button,.danger-button { border-radius:6px; min-height:37px; border:1px solid transparent; padding:0 14px; display:inline-flex; align-items:center; justify-content:center; gap:7px; font-size:13px; font-weight:600; white-space:nowrap; }.primary-button { color:#fff; background:var(--brand); box-shadow:0 4px 10px rgba(8,115,109,.17); }.primary-button:hover { background:var(--brand-deep); }.primary-button svg,.secondary-button svg { height:16px; width:16px; }.secondary-button { border-color:#d3dedb; color:#36504b; background:#fff; }.secondary-button:hover { background:#f4f8f7; }.danger-button { background:var(--danger); color:#fff; }.danger-button:hover { background:#ad3c36; }
.metrics { max-width:1580px; margin:0 auto; padding:0 34px 24px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:15px; }.metrics article { min-height:112px; padding:18px; background:#fff; border:1px solid var(--line); border-radius:7px; display:flex; gap:13px; }.metric-icon { height:39px; width:39px; flex:0 0 39px; display:grid; place-items:center; border-radius:7px; }.metric-icon svg { width:19px; }.metric-icon.mint { background:var(--mint); color:#167a67; }.metric-icon.blue { background:var(--blue); color:#376ba9; }.metric-icon.orange { background:var(--orange); color:#b76e19; }.metric-icon.indigo { background:var(--indigo); color:#5c5bb2; }.metrics article>div:last-child { min-width:0; }.metrics span { display:block; color:#778582; font-size:12px; margin:1px 0 4px; }.metrics strong { font-family:"DM Mono",monospace; font-size:22px; display:block; line-height:1.2; font-weight:500; }.metrics strong small { font-size:12px; color:#566764; }.metrics small { color:#8b9895; display:block; font-size:11px; margin-top:6px; }.rise { color:#09836e; font-family:"DM Mono",monospace; font-weight:500; }.warning-text { color:#b26a13; font-weight:500; }
.clients-panel { max-width:1512px; margin:0 auto 36px; background:#fff; border:1px solid var(--line); border-radius:7px; overflow:hidden; }.panel-heading { min-height:75px; padding:17px 20px; display:flex; align-items:center; justify-content:space-between; }.panel-heading h2 { font-size:16px; margin:0; }.panel-heading span { color:#81908d; font-size:12px; display:block; margin-top:3px; }.panel-tools { display:flex; }.table-tool { border:1px solid #dce6e3; margin-left:7px; }.filter-row { padding:0 20px 15px; display:flex; gap:9px; align-items:center; border-bottom:1px solid #e8eeec; }.search-box { border:1px solid #cfdcda; height:35px; width:272px; border-radius:5px; display:flex; align-items:center; gap:8px; padding:0 10px; color:#758480; }.search-box svg { width:16px; }.search-box input { border:0; outline:none; width:100%; color:#253634; font-size:12px; background:transparent; }.search-box input::placeholder { color:#98a6a3; }.select-wrap { position:relative; width:126px; height:35px; }.select-wrap select { appearance:none; border:1px solid #cfdcda; border-radius:5px; background:#fff; color:#53635f; width:100%; height:100%; padding:0 28px 0 10px; font-size:12px; outline:none; }.select-wrap svg { position:absolute; pointer-events:none; height:14px; width:14px; right:9px; top:10px; color:#80908c; }.text-button { padding:0 8px; height:34px; border:0; background:transparent; color:#08736d; font-size:12px; }
.table-wrap { width:100%; overflow-x:auto; position:relative; }.table-wrap table { border-collapse:collapse; width:100%; min-width:1000px; }.table-wrap th { font-size:11px; font-weight:500; text-align:left; color:#7e8e8a; padding:11px 16px; background:#fafcfb; white-space:nowrap; }.table-wrap td { padding:14px 16px; border-top:1px solid #edf1f0; font-size:12px; color:#4f5f5c; vertical-align:middle; white-space:nowrap; }.table-wrap tbody tr { cursor:pointer; }.table-wrap tbody tr:hover { background:#f8fbfa; }.client-cell { display:flex; align-items:center; gap:10px; color:#1c2a28; font-weight:600; min-width:184px; }.company-mark { width:30px; height:30px; display:grid; place-items:center; background:#e7f1ed; color:#19796e; border-radius:5px; font-family:"DM Mono",monospace; font-size:11px; }.goods-tags,.route-cell { display:flex; gap:4px; }.tag { display:inline-flex; align-items:center; padding:3px 6px; font-size:10px; font-weight:500; border-radius:4px; }.tag.gray { background:#eef2f1; color:#60706c; }.tag.yellow { background:#fff1d6; color:#a66416; }.tag.red { background:#ffebe8; color:#b85349; }.tag.route { background:#e9f5f0; color:#19786c; }.status { display:inline-flex; align-items:center; gap:5px; font-size:11px; }.status::before { content:""; width:6px; height:6px; border-radius:50%; background:#2aa280; }.status.off::before { background:#a5afac; }.status.off { color:#8b9895; }.assignee { display:flex; align-items:center; gap:6px; }.assignee .avatar { height:22px; width:22px; font-size:10px; }.row-action { color:#80908d; }.table-footer { min-height:57px; padding:0 20px; display:flex; align-items:center; justify-content:space-between; color:#84918e; font-size:11px; }.pagination { display:flex; gap:4px; align-items:center; }.pagination .icon-button { height:27px; width:27px; border:1px solid #dfe7e5; }.pagination .icon-button svg { width:15px; }.page-number { height:27px; min-width:27px; border:0; background:transparent; border-radius:4px; color:#6b7b77; font-size:11px; }.page-number:hover { background:#edf4f2; }.page-number.current { background:#0b756e; color:#fff; }.pagination span { padding:0 3px; }.empty-state { padding:50px; display:grid; place-items:center; gap:7px; color:#70817d; }.empty-state svg { color:#9dafaa; }.empty-state strong { color:#344743; font-size:14px; }.empty-state span { font-size:12px; }.sr-only { position:absolute; clip:rect(0,0,0,0); clip-path:inset(50%); width:1px; height:1px; overflow:hidden; white-space:nowrap; }
.drawer-backdrop,.modal-backdrop { position:fixed; z-index:30; inset:0; background:rgba(15,35,33,.36); opacity:0; pointer-events:none; transition:opacity .22s ease; }.drawer-backdrop.show,.modal-backdrop.show { opacity:1; pointer-events:auto; }.detail-drawer { position:fixed; z-index:31; top:0; right:0; bottom:0; width:min(720px,100vw); background:#f7f9f8; transform:translateX(104%); transition:transform .25s ease; box-shadow:-12px 0 35px rgba(19,42,39,.14); display:flex; flex-direction:column; }.detail-drawer.open { transform:translateX(0); }.drawer-titlebar { min-height:84px; padding:15px 24px 14px; border-bottom:1px solid #dfe8e5; background:#fff; display:flex; justify-content:space-between; gap:12px; align-items:center; }.drawer-heading,.drawer-actions { display:flex; align-items:center; gap:10px; }.drawer-heading h2 { margin:0; font-size:18px; max-width:300px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.drawer-heading .eyebrow { margin:0 0 2px; }.more-wrap { position:relative; }.action-menu { position:absolute; z-index:3; width:158px; right:0; top:39px; padding:5px; background:#fff; border:1px solid #dce6e3; border-radius:6px; box-shadow:0 8px 20px rgba(22,48,45,.14); opacity:0; transform:translateY(-4px); pointer-events:none; transition:.15s ease; }.action-menu.show { opacity:1; pointer-events:auto; transform:translateY(0); }.action-menu button { border:0; background:transparent; color:#40524e; width:100%; min-height:31px; padding:0 8px; border-radius:4px; display:flex; align-items:center; gap:8px; font-size:12px; text-align:left; }.action-menu button:hover { background:#f0f6f4; }.action-menu svg { height:15px; width:15px; }.drawer-scroll { overflow:auto; padding:22px 24px 38px; }.detail-hero { background:#113f3d; color:#fff; border-radius:7px; padding:19px 20px; display:flex; justify-content:space-between; gap:15px; }.detail-hero .client-cell { color:#fff; font-size:16px; }.detail-hero .company-mark { background:#c4eadf; }.detail-meta { display:flex; flex-wrap:wrap; gap:16px; align-content:start; color:#c5d8d3; font-size:12px; }.detail-meta strong { display:block; color:white; font-size:15px; font-family:"DM Mono",monospace; font-weight:500; margin-top:3px; }.info-grid { margin:16px 0; display:grid; grid-template-columns:repeat(3,1fr); background:white; border:1px solid var(--line); border-radius:7px; }.info-grid div { padding:14px; border-right:1px solid #edf1f0; border-bottom:1px solid #edf1f0; min-height:69px; }.info-grid div:nth-child(3n) { border-right:0; }.info-grid div:nth-last-child(-n+3) { border-bottom:0; }.info-grid span { display:block; color:#81908d; font-size:11px; margin-bottom:6px; }.info-grid strong { color:#32413f; font-size:12px; font-weight:600; line-height:1.45; }.history-section { background:#fff; border:1px solid var(--line); border-radius:7px; margin-top:16px; overflow:hidden; }.section-title { display:flex; align-items:center; justify-content:space-between; min-height:54px; padding:0 16px; border-bottom:1px solid #e9efed; }.section-title h3 { margin:0; font-size:14px; }.section-title span { color:#84928f; font-size:11px; }.mini-stats { padding:15px 16px 6px; display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; }.mini-stats article { border-left:2px solid #53ae99; padding:3px 9px; }.mini-stats article:nth-child(2) { border-color:#9ab9d7; }.mini-stats article:nth-child(3) { border-color:#e9ad62; }.mini-stats span { font-size:11px; color:#84928e; }.mini-stats strong { display:block; margin-top:3px; font-family:"DM Mono",monospace; font-size:18px; font-weight:500; }.history-list { list-style:none; padding:0; margin:8px 16px 2px; }.history-list li { display:flex; align-items:center; padding:11px 0; border-top:1px solid #edf2f0; gap:11px; }.history-list li:first-child { border-top:0; }.history-list .history-icon { height:27px; width:27px; border-radius:5px; background:#edf7f3; color:#258874; display:grid; place-items:center; flex:0 0 auto; }.history-list .history-icon.quote { background:#eaf0fc; color:#5273b2; }.history-icon svg { height:14px; width:14px; }.history-list div:nth-child(2) { flex:1; min-width:0; }.history-list strong { display:block; font-size:12px; }.history-list p { margin:2px 0 0; color:#82908d; font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.history-list time { color:#879692; font-family:"DM Mono",monospace; font-size:10px; }
.form-modal { position:fixed; z-index:41; top:50%; left:50%; width:min(680px,calc(100vw - 32px)); max-height:calc(100vh - 32px); display:flex; flex-direction:column; background:#fff; border-radius:8px; box-shadow:var(--shadow); transform:translate(-50%,-46%); opacity:0; pointer-events:none; transition:.18s ease; }.form-modal.open { opacity:1; pointer-events:auto; transform:translate(-50%,-50%); }.modal-heading { display:flex; align-items:center; justify-content:space-between; min-height:75px; border-bottom:1px solid #e6edeb; padding:15px 22px; }.modal-heading h2 { margin:0; font-size:19px; }.modal-heading .eyebrow { margin:0 0 3px; }.form-modal form { display:flex; flex:1; min-height:0; flex-direction:column; }.form-scroll { overflow:auto; padding:4px 22px 8px; }.form-section { padding:17px 0; border-bottom:1px solid #e8eeec; }.form-section:last-child { border-bottom:0; }.form-section h3 { font-size:13px; margin:0 0 13px; }.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.field { min-width:0; display:block; }.field.span-2 { grid-column:span 2; }.field>span,.field legend { display:block; color:#586864; font-size:12px; margin:0 0 6px; padding:0; }.field b { color:#cf5149; }.field input,.field select { width:100%; height:35px; border:1px solid #cedbd8; border-radius:5px; padding:0 9px; color:#293a37; outline:none; background:#fff; font-size:12px; }.field input::placeholder { color:#a1adab; }.field input:focus,.field select:focus { border-color:#258a80; }.fieldset,.field { border:0; margin:0; }.choice-row { display:flex; flex-wrap:wrap; align-items:center; gap:13px; min-height:35px; border:1px solid #cedbd8; border-radius:5px; padding:0 9px; }.choice-row label { display:flex; align-items:center; gap:5px; color:#4f615d; font-size:12px; white-space:nowrap; }.choice-row input { accent-color:#08736d; height:14px; width:14px; margin:0; }.form-footer { padding:13px 22px; display:flex; justify-content:flex-end; gap:8px; border-top:1px solid #e6edeb; }.confirm-modal { position:fixed; z-index:41; left:50%; top:50%; width:min(390px,calc(100vw - 36px)); padding:25px; border-radius:8px; background:#fff; box-shadow:var(--shadow); text-align:center; transform:translate(-50%,-46%); opacity:0; pointer-events:none; transition:.18s ease; }.confirm-modal.open { opacity:1; pointer-events:auto; transform:translate(-50%,-50%); }.confirm-icon { width:42px; height:42px; display:grid; place-items:center; margin:0 auto 12px; background:#fff0de; color:#bd741f; border-radius:50%; }.confirm-icon svg { height:21px; }.confirm-modal h2 { font-size:17px; margin:0; }.confirm-modal p { color:#677773; font-size:13px; line-height:1.65; margin:9px 8px 22px; }.confirm-actions { display:flex; justify-content:flex-end; gap:8px; }.toast { position:fixed; z-index:60; bottom:24px; left:50%; transform:translate(-50%,20px); padding:10px 13px; display:flex; gap:7px; align-items:center; border-radius:6px; background:#193735; color:#fff; font-size:12px; box-shadow:0 8px 22px rgba(17,45,42,.2); opacity:0; pointer-events:none; transition:.2s ease; }.toast.show { opacity:1; transform:translate(-50%,0); }.toast svg { width:16px; color:#83d5c0; }
@media (max-width:1100px) { .metrics { grid-template-columns:repeat(2,1fr); }.clients-panel { margin-left:24px; margin-right:24px; }.page-head { padding-left:24px; padding-right:24px; }.metrics { padding-left:24px; padding-right:24px; }.topbar { padding:0 24px; } }
@media (max-width:760px) { .sidebar { transform:translateX(-100%); transition:transform .22s ease; box-shadow:8px 0 24px rgba(12,40,37,.25); }.sidebar.mobile-open { transform:translateX(0); }.workspace { width:100%; margin-left:0; }.mobile-menu { display:grid; }.topbar { padding:0 13px; height:57px; }.crumbs { margin-left:8px; }.crumbs span,.crumbs svg { display:none; }.page-head { padding:23px 16px 19px; align-items:flex-start; }.page-head h1 { font-size:23px; }.subhead { font-size:12px; line-height:1.65; max-width:240px; }.primary-button { min-height:35px; padding:0 11px; }.primary-button span { font-size:12px; }.metrics { padding:0 16px 16px; gap:9px; }.metrics article { min-height:92px; padding:13px; gap:9px; }.metric-icon { height:32px; width:32px; flex-basis:32px; }.metric-icon svg { width:16px; }.metrics strong { font-size:18px; }.metrics span { font-size:11px; }.metrics small { font-size:10px; }.clients-panel { margin:0 0 20px; border-radius:0; border-left:0; border-right:0; }.panel-heading { min-height:63px; padding:13px 16px; }.filter-row { padding:0 16px 12px; flex-wrap:wrap; gap:7px; }.search-box { width:100%; }.select-wrap { flex:1; width:calc(33.3% - 5px); min-width:100px; }.text-button { padding:0 4px; }.table-footer { padding:0 14px; }.pagination .page-number:not(.current) { display:none; }.detail-drawer { width:100vw; }.drawer-titlebar { padding:12px 14px; min-height:66px; }.drawer-heading h2 { max-width:175px; font-size:16px; }.drawer-heading .eyebrow { display:none; }.drawer-actions .icon-button { display:none; }.drawer-scroll { padding:14px 14px 28px; }.detail-hero { padding:15px; display:block; }.detail-meta { margin-top:13px; }.info-grid { grid-template-columns:1fr 1fr; }.info-grid div:nth-child(3n) { border-right:1px solid #edf1f0; }.info-grid div:nth-child(2n) { border-right:0; }.info-grid div:nth-last-child(-n+3) { border-bottom:1px solid #edf1f0; }.info-grid div:nth-last-child(-n+2) { border-bottom:0; }.form-modal { width:100vw; max-height:100vh; height:100vh; border-radius:0; }.modal-heading { padding:13px 16px; min-height:65px; }.form-scroll { padding:2px 16px; }.form-footer { padding:12px 16px; }.form-grid { grid-template-columns:1fr; gap:11px; }.field.span-2 { grid-column:auto; }.mini-stats { grid-template-columns:1fr 1fr 1fr; padding-left:12px; padding-right:12px; }.mini-stats strong { font-size:15px; }.history-list { margin-left:12px; margin-right:12px; } }
@media (max-width:390px) { .metrics { grid-template-columns:1fr 1fr; }.metrics article { padding:10px; }.metrics article:nth-child(3),.metrics article:nth-child(4) { display:none; }.metric-icon { display:none; }.page-head .primary-button span { display:none; }.page-head .primary-button { width:35px; padding:0; }.choice-row { gap:9px; } }
.dashboard-actions { display:flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:wrap; }
.dashboard-query { display:flex; align-items:center; gap:8px; margin:0 0 15px; padding:11px 13px; background:#f7faf9; border:1px solid #dce7e4; border-radius:6px; }.dashboard-query .search-box { width:min(310px,100%); }.dashboard-query .select-wrap { min-width:130px; }.dashboard-query .text-button { margin-left:auto; }
.segmented-control { display:inline-flex; padding:3px; background:#e9f0ee; border-radius:6px; }
.segmented-control button { min-height:31px; padding:0 10px; color:#60716d; font-size:12px; background:transparent; border:0; border-radius:4px; }
.segmented-control button.active { color:#fff; background:#08736d; box-shadow:0 1px 3px rgba(19,56,52,.18); }
.table-actions { display:flex; align-items:center; gap:6px; }
.quote-calc-action { display:flex; align-items:center; gap:10px; padding:10px; color:#74837f; font-size:11px; background:#f6faf9; border:1px dashed #c9dbd7; border-radius:5px; }
.quote-calc-action .secondary-button { flex:0 0 auto; }
.empty-calculation { min-height:78px; display:flex; align-items:center; justify-content:center; gap:8px; color:#7d8d89; font-size:12px; text-align:center; }
.empty-calculation i { width:19px; height:19px; color:#5d9d91; }.empty-calculation strong { color:#344a45; }.empty-calculation span { display:block; }
.calculation-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:11px; }.calculation-heading h3 { margin:0; font-size:13px; }.calculation-heading p { margin:4px 0 0; color:#70817c; font-size:11px; line-height:1.45; }.calculation-heading>span { color:#7c8b87; font-size:11px; white-space:nowrap; }
.cost-candidates { display:grid; gap:8px; }.cost-candidates.all { padding-top:9px; }.cost-candidate { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 11px; background:#fff; border:1px solid #dbe6e3; border-radius:6px; }.cost-candidate.selected { border-color:#4ca894; background:#f1faf7; }.cost-candidate>div { min-width:0; }.candidate-rank { display:inline-block; margin-right:7px; padding:2px 5px; color:#267a6d; font-size:10px; background:#e4f4ef; border-radius:3px; }.cost-candidate strong { color:#263e38; font:500 15px "DM Mono",monospace; }.cost-candidate p { margin:5px 0 2px; color:#405650; font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.cost-candidate small { display:block; color:#82918d; font-size:10px; }.cost-candidate .secondary-button { flex:0 0 auto; min-height:31px; padding:0 9px; font-size:11px; }.all-cost-results { margin-top:9px; }.all-cost-results summary { color:#08736d; font-size:12px; cursor:pointer; }.all-cost-results[open] summary { margin-bottom:2px; }
.deal-modal { width:min(540px,calc(100vw - 32px)); }.deal-reference { margin:0 0 14px; padding:9px 10px; color:#536762; font:11px "DM Mono",monospace; line-height:1.5; background:#f3f8f6; border:1px solid #e0ebe8; border-radius:5px; }
@media (max-width:760px) { .dashboard-actions { width:100%; justify-content:space-between; }.dashboard-query { align-items:stretch; flex-direction:column; }.dashboard-query .search-box,.dashboard-query .select-wrap { width:100%; max-width:none; }.dashboard-query .text-button { align-self:flex-end; margin-left:0; }.segmented-control { flex:1; }.segmented-control button { flex:1; }.quote-calc-action { align-items:flex-start; flex-direction:column; }.cost-candidate { align-items:flex-start; flex-direction:column; }.cost-candidate .secondary-button { width:100%; }.table-actions { min-width:155px; flex-wrap:wrap; }.deal-modal { width:100vw; height:100vh; max-height:100vh; border-radius:0; } }
.notification-wrap { position:relative; }.notification-panel { position:absolute; z-index:45; top:40px; right:0; display:none; width:330px; max-height:390px; overflow:auto; padding:6px; background:#fff; border:1px solid #d7e3e0; border-radius:7px; box-shadow:0 14px 32px rgba(17,48,44,.18); }.notification-panel.open { display:block; }.notification-item { width:100%; padding:10px; color:#425550; text-align:left; background:#fff; border:0; border-radius:5px; }.notification-item:hover { background:#f2f8f6; }.notification-item.read { opacity:.58; }.notification-item strong { display:block; font-size:12px; font-weight:600; line-height:1.5; }.notification-item span { display:block; margin-top:4px; color:#82918d; font:10px "DM Mono",monospace; }.notification-empty { margin:0; padding:15px 10px; color:#82918d; font-size:12px; text-align:center; }.user-chip .icon-button { margin-left:auto; color:#a9c2bd; }.user-chip .icon-button:hover { color:#fff; background:rgba(255,255,255,.08); }
.icon-button #notificationCount { top:2px; right:1px; width:auto; min-width:15px; height:15px; padding:0 3px; color:#fff; font:9px/13px "DM Mono",monospace; text-align:center; background:#ef7663; border:1px solid #fff; }
.group-push-modal { width:min(510px,calc(100vw - 32px)); }.group-push-customer { margin:0 0 7px; color:#324640; font-size:14px; font-weight:700; }.group-push-hint { margin:0 0 12px; color:#73827e; font-size:12px; line-height:1.6; }.group-push-modal .field { margin:0; }.group-lookup { display:grid; gap:8px; padding:10px 11px; margin:0 0 14px; color:#506963; font-size:12px; line-height:1.5; background:#f3f8f7; border:1px solid #d5e5e2; border-radius:6px; }.group-candidates { display:flex; flex-wrap:wrap; gap:7px; }.group-candidate { max-width:100%; padding:5px 8px; overflow:hidden; color:#006b63; font:600 12px/1.45 "Noto Sans SC",sans-serif; text-overflow:ellipsis; white-space:nowrap; background:#fff; border:1px solid #bdd8d3; border-radius:4px; cursor:pointer; }.group-candidate:hover { color:#fff; background:#087a70; border-color:#087a70; }
.login-screen { position:fixed; z-index:100; inset:0; display:grid; place-items:center; padding:20px; background:#eef5f3; }.login-card { width:min(400px,100%); padding:29px; background:#fff; border:1px solid #d9e6e2; border-radius:8px; box-shadow:0 18px 44px rgba(19,51,47,.14); }.login-brand { display:flex; align-items:center; gap:10px; margin-bottom:30px; }.login-mark { width:35px; height:35px; display:grid; place-items:center; color:#0d403b; font:500 12px "DM Mono",monospace; background:#58c9b4; border-radius:7px; }.login-brand strong,.login-brand span { display:block; }.login-brand strong { font-size:15px; }.login-brand div span { margin-top:2px; color:#83918e; font-size:11px; }.login-card .eyebrow { margin:0 0 7px; }.login-card h1 { margin:0; font-size:25px; }.login-card>p:not(.eyebrow) { min-height:42px; margin:9px 0 22px; color:#657570; font-size:13px; line-height:1.65; }.dingtalk-login { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:42px; color:#fff; font-size:13px; font-weight:600; background:#1677ff; border:0; border-radius:6px; }.dingtalk-login:hover { background:#0c66df; }.dingtalk-login svg { width:17px; }.preview-login { margin-top:18px; padding-top:16px; border-top:1px solid #e8eeec; }.preview-login>span { display:block; margin-bottom:8px; color:#83918e; font-size:11px; }.preview-login>div { display:grid; grid-template-columns:1fr 60px; gap:7px; }.preview-login select,.preview-login button { height:35px; color:#425550; font-size:12px; background:#fff; border:1px solid #cddbd7; border-radius:5px; }.preview-login button { color:#08736d; background:#ecf7f4; border-color:#b8ddd3; }.login-card small { display:block; margin-top:20px; color:#889692; font-size:10px; text-align:center; }
.login-screen[hidden] { display:none; }
.dingtalk-login:disabled { cursor:not-allowed; opacity:.48; background:#8ea6a3; }
@media (max-width:760px) { .notification-panel { position:fixed; top:58px; right:14px; left:14px; width:auto; max-height:calc(100vh - 78px); }.group-push-modal { width:100vw; height:100vh; max-height:100vh; border-radius:0; }.login-card { padding:24px 20px; } }
.module-head-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }.module-head-actions .secondary-button { min-height:36px; }
.region-cost-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:0 0 16px; }.region-cost-card { min-height:174px; display:flex; flex-direction:column; padding:15px; background:#fff; border:1px solid #dce7e4; border-radius:7px; }.region-cost-card.active { border-color:#299281; box-shadow:0 0 0 2px rgba(41,146,129,.12); }.region-cost-card>div:first-child { display:grid; grid-template-columns:auto 1fr; column-gap:8px; align-items:start; }.region-code { grid-row:span 2; display:grid; place-items:center; width:31px; height:31px; color:#16776c; font:600 10px "DM Mono",monospace; background:#e4f4ef; border-radius:5px; }.region-cost-card h3 { margin:1px 0 3px; color:#253a35; font-size:13px; }.region-cost-card p { margin:0; color:#81908c; font-size:10px; line-height:1.45; }.region-cost-card>strong { display:block; min-height:33px; margin:13px 0 5px; color:#263d38; font:500 15px/1.35 "DM Mono",monospace; }.region-cost-card>small { color:#81908c; font-size:10px; }.region-card-actions { display:flex; gap:11px; margin-top:auto; padding-top:12px; }.region-card-actions .text-button { height:auto; padding:0; font-size:11px; }
.cost-rule-panel { overflow:hidden; }.rule-summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid #e6eeeb; }.rule-summary-grid>div { min-height:88px; padding:13px 16px; border-right:1px solid #e6eeeb; border-bottom:1px solid #e6eeeb; }.rule-summary-grid>div:nth-child(3n) { border-right:0; }.rule-summary-grid span { display:block; margin-bottom:6px; color:#7f8e8a; font-size:11px; }.rule-summary-grid strong { color:#3a504a; font-size:11px; font-weight:500; line-height:1.6; }.rule-notice { margin:0; padding:11px 16px; color:#5c706b; font-size:12px; line-height:1.55; background:#f6faf9; }
.profit-control { display:grid; grid-template-columns:minmax(0,1fr) 76px; gap:10px; align-items:center; height:35px; }.profit-control input[type="range"] { width:100%; accent-color:#08736d; }.profit-control input[type="number"] { width:100%; }.quote-result-total { display:grid; grid-template-columns:1fr .8fr 1.3fr; gap:1px; margin:0 0 12px; overflow:hidden; border:1px solid #d8e5e1; border-radius:6px; background:#d8e5e1; }.quote-result-total>div { padding:11px 13px; background:#fff; }.quote-result-total span { display:block; margin-bottom:5px; color:#80908c; font-size:11px; }.quote-result-total strong { color:#344b45; font:500 16px "DM Mono",monospace; }.quote-result-total b { color:#08736d; font:600 20px "DM Mono",monospace; }.quote-breakdown { display:grid; grid-template-columns:1fr 1fr; gap:0 13px; margin-bottom:14px; }.quote-breakdown-row { display:flex; align-items:center; justify-content:space-between; min-height:31px; gap:10px; color:#566862; font-size:11px; border-bottom:1px dashed #e0e9e6; }.quote-breakdown-row strong { color:#405750; font:500 11px "DM Mono",monospace; }.quote-breakdown-row.zero { color:#a3afac; }.quote-breakdown-row.zero strong { color:#9aa8a4; }.quote-breakdown-row.total { grid-column:span 2; margin-top:4px; color:#1e463e; border-bottom:0; font-weight:700; }.quote-breakdown-row.total strong { color:#08736d; font-size:13px; }.quote-recommendations { padding-top:13px; border-top:1px solid #e4ece9; }.recommendation-title { display:flex; justify-content:space-between; gap:10px; margin-bottom:8px; }.recommendation-title h4,.quote-notes h4 { margin:0; color:#334944; font-size:12px; }.recommendation-title span { color:#82918d; font-size:10px; }.cost-candidate.compact { padding:8px 10px; }.cost-candidate.compact strong { font-size:13px; }.quote-notes { margin-top:13px; padding:11px; color:#657570; background:#f6faf9; border:1px solid #e0ebe8; border-radius:5px; }.quote-notes p { position:relative; margin:6px 0 0; padding-left:10px; font-size:11px; line-height:1.55; }.quote-notes p::before { content:""; position:absolute; top:7px; left:0; width:4px; height:4px; background:#54ad9a; border-radius:50%; }
@media (max-width:1100px) { .region-cost-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .module-head-actions { width:100%; }.module-head-actions .primary-button,.module-head-actions .secondary-button { flex:1; }.region-cost-grid { grid-template-columns:1fr; margin-left:0; margin-right:0; }.region-cost-card { min-height:151px; }.rule-summary-grid { grid-template-columns:1fr 1fr; }.rule-summary-grid>div:nth-child(3n) { border-right:1px solid #e6eeeb; }.rule-summary-grid>div:nth-child(2n) { border-right:0; }.quote-result-total { grid-template-columns:1fr 1fr; }.quote-result-total>div:last-child { grid-column:span 2; }.quote-breakdown { grid-template-columns:1fr; }.quote-breakdown-row.total { grid-column:auto; }.profit-control { grid-template-columns:minmax(0,1fr) 70px; } }
.inquiry-quickbar,.cost-source-tabs { display:flex; align-items:center; gap:8px; margin:0 0 14px; overflow-x:auto; padding-bottom:2px; }
.inquiry-quick,.cost-source-tab { display:inline-flex; flex:0 0 auto; align-items:center; gap:7px; min-height:34px; padding:0 11px; color:#536762; font-size:12px; background:#fff; border:1px solid #d7e3e0; border-radius:5px; }
.inquiry-quick:hover,.cost-source-tab:hover { color:#08736d; border-color:#92c9bd; }
.inquiry-quick.active,.cost-source-tab.active { color:#fff; background:#08736d; border-color:#08736d; }
.inquiry-quick b,.cost-source-tab b { display:inline-grid; place-items:center; min-width:18px; height:18px; padding:0 4px; color:#56706a; font:10px "DM Mono",monospace; background:#edf4f2; border-radius:4px; }
.inquiry-quick.active b,.cost-source-tab.active b { color:#e8fffa; background:rgba(255,255,255,.16); }
.inquiry-filter-row,.cost-sheet-filter { display:flex; align-items:center; gap:9px; padding:0 16px 13px; border-bottom:1px solid #e6eeeb; }
.inquiry-filter-row .search-box,.cost-sheet-filter .search-box { max-width:360px; }
.cost-sheet-filter { justify-content:space-between; color:#778681; font-size:11px; }
.cost-sheet { min-width:1320px; }
.cost-sheet input { width:100%; min-width:100px; height:31px; padding:0 7px; color:#334944; font-size:11px; background:#fff; border:1px solid #d1dfdb; border-radius:4px; }
.cost-sheet td:nth-child(4) input { min-width:130px; }.cost-sheet td:nth-child(8) input { min-width:190px; }
.cost-source-badge { display:inline-flex; align-items:center; min-height:22px; padding:0 6px; color:#4e6962; font-size:10px; background:#edf4f2; border-radius:4px; white-space:nowrap; }
.cost-source-badge.self { color:#0e7468; background:#dff4ed; }.cost-source-badge.template { color:#5967a6; background:#e8ebfc; }
.cost-origin { display:grid; gap:5px; min-width:170px; padding:8px 9px; background:#f7fbfa; border:1px solid #dce9e5; border-radius:5px; }.cost-origin-title { display:flex; align-items:center; gap:6px; min-width:0; }.cost-origin-title i { flex:0 0 auto; width:7px; height:7px; background:#25a58d; border-radius:50%; }.cost-origin strong { min-width:0; color:#29463f; font-size:12px; overflow-wrap:anywhere; }.cost-origin em { flex:0 0 auto; padding:2px 5px; color:#16766a; font:10px "DM Mono",monospace; font-style:normal; background:#def4ed; border-radius:3px; }.cost-origin span { display:block; color:#536d66; font:10px/1.45 "DM Mono",monospace; overflow-wrap:anywhere; word-break:break-word; }.cost-origin small { color:#71827d; font-size:10px; line-height:1.4; }.cost-origin.is-disabled { background:#faf8f7; border-color:#e7deda; }.cost-origin.is-disabled .cost-origin-title i { background:#a79d96; }.cost-origin.is-disabled em { color:#8a6254; background:#f3e9e4; }.cost-row-disabled td:not(.cost-origin-cell) { opacity:.57; }.cost-toggle { min-height:31px; padding:0 8px; font-size:11px; }.customer-link-section { padding-bottom:12px; }.customer-link-item { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:13px 16px; border-top:1px solid #e6efec; }.customer-link-item strong { color:#29463f; font-size:13px; }.customer-link-item p { margin:4px 0 0; color:#71817d; font-size:11px; line-height:1.55; }.customer-link-actions { display:flex; flex:0 0 auto; gap:8px; padding:0; }
.quote-origin-notice { margin:0 0 13px; padding:9px 10px; color:#27695f; font-size:12px; line-height:1.45; background:#edf8f5; border:1px solid #cce8e0; border-radius:5px; }
@media (max-width:760px) { .inquiry-quickbar,.cost-source-tabs { margin-left:-1px; margin-right:-1px; }.inquiry-filter-row { flex-wrap:wrap; padding-left:0; padding-right:0; }.inquiry-filter-row .search-box { width:100%; max-width:none; }.inquiry-filter-row .select-wrap { min-width:calc(50% - 5px); }.cost-sheet-filter { align-items:flex-start; flex-direction:column; padding-left:0; padding-right:0; }.cost-sheet-filter .search-box { width:100%; max-width:none; } }

textarea { font:inherit; }
.field textarea { width:100%; min-height:92px; padding:8px 9px; color:#293a37; font-size:12px; line-height:1.55; resize:vertical; background:#fff; border:1px solid #cedbd8; border-radius:5px; outline:none; }
.field textarea:focus { border-color:#258a80; }
.cost-sheet { min-width:1480px; }
.cost-sheet td:nth-child(4) input { min-width:130px; }.cost-sheet td:nth-child(8) input { min-width:0; }
.cost-terms-cell { min-width:330px; padding-top:7px !important; padding-bottom:7px !important; }
.cost-terms-cell details { width:100%; }
.cost-terms-cell summary { max-width:370px; overflow:hidden; color:#08736d; font-size:11px; line-height:1.45; text-overflow:ellipsis; white-space:nowrap; cursor:pointer; }
.cost-terms-cell details[open] summary { margin-bottom:7px; white-space:normal; }
.cost-terms-cell textarea { width:100%; min-width:320px; min-height:92px; padding:7px; color:#4a5f59; font-size:11px; line-height:1.55; resize:vertical; border:1px solid #d0dfdb; border-radius:4px; }
.cost-row-actions { display:flex; align-items:center; gap:4px; }.cost-row-actions .secondary-button { min-height:31px; padding:0 8px; font-size:11px; }
.danger-icon { color:#b54d46; border:1px solid #efd7d4; }.danger-icon:hover { color:#a43d36; background:#fff2f0; }
.cost-candidate { flex-wrap:wrap; }
.candidate-terms { flex:0 0 100%; padding-top:7px; border-top:1px dashed #d8e6e2; }
.candidate-terms summary { color:#08736d; font-size:11px; cursor:pointer; }
.candidate-terms pre,.quote-terms { margin:7px 0 0; color:#516761; font:11px/1.6 "Noto Sans SC",sans-serif; white-space:pre-wrap; word-break:break-word; }
.quote-notes .quote-terms { max-height:220px; overflow:auto; padding:9px; background:#fff; border:1px solid #dce8e4; border-radius:4px; }
@media (max-width:760px) { .cost-terms-cell { min-width:280px; }.cost-terms-cell textarea { min-width:270px; }.candidate-terms { width:100%; }.candidate-terms pre { max-height:180px; overflow:auto; }.customer-link-item { align-items:stretch; flex-direction:column; }.customer-link-actions { flex-direction:column; }.customer-link-actions button { width:100%; } }