/* Yan Cyber: one blue hue, stepped surfaces, a 232px shell and 20px content gutters.
   At a 1440px layout width: 232px navigation + 32px gutter + 1144px content + 32px gutter. */
:root{
  --workspace-ground:#e8eef4;--workspace-frame:#dce5ef;--workspace-surface:#f6f8fb;
  --workspace-well:#edf2f7;--workspace-selected:#ccdbea;--workspace-control:#bac8d8;
  --workspace-text:#203349;--workspace-muted:#536579;--workspace-faint:#58697a;
  --workspace-accent:#245d91;--workspace-rule:#dce4ed;--workspace-white:#fff;
  --workspace-positive:#21694f;--workspace-negative:#a33443;--workspace-warning:#805315;
  --blue:var(--workspace-accent);--muted:var(--workspace-muted);--line:#d2dde8;
  --green:var(--workspace-positive);--red:var(--workspace-negative);
  --dialog-pad:24px;
  color:var(--workspace-text);background:var(--workspace-ground);color-scheme:light;font-size:16px;line-height:1.65;
  font-family:"Segoe UI","Microsoft YaHei",sans-serif;font-variant-numeric:tabular-nums;
}
body,.main{background:var(--workspace-ground)}
.sidebar{background:var(--workspace-frame);border-color:var(--line);padding:26px 16px;color:var(--workspace-text)}
.sidebar .brand{padding:0 8px 26px;gap:10px}
.sidebar .brand b{color:var(--workspace-text);font-size:17px;letter-spacing:.3px}
.sidebar .brand small,.nav-section{color:var(--workspace-muted);font-size:13px}
.brand-mark{color:var(--workspace-accent);background:transparent;border-color:#9db3c9}
.nav-section{margin:14px 12px 12px;letter-spacing:1px}
.nav-item{font-size:16px;min-height:44px;padding:10px 12px;margin:5px 0;color:#41566c;border-radius:8px}
.nav-item:hover{background:#d2dfea;color:var(--workspace-text)}
.nav-item.active{background:var(--workspace-selected);color:#153d63;font-weight:600;box-shadow:none}
.nav-icon{font-size:19px;width:19px;flex:none}
.mobile-menu svg{display:block;width:20px;height:20px}
.sidebar-bottom{border-color:#c2d1df;padding-top:16px}
.sidebar-bottom b{color:var(--workspace-text)}
.sidebar-bottom small,.profile .ghost{color:var(--workspace-muted)}
.avatar{background:#c9d9e9;color:#21496e}
.topbar{height:64px;background:var(--workspace-ground);border-color:var(--line);padding:0 32px}
.topbar .company{color:var(--workspace-muted);font-size:14px}
.topbar-right{gap:12px}.topbar .sync-state{color:var(--workspace-positive)}
.page{padding:26px 32px 40px}
.page-heading{margin-bottom:22px;align-items:center}
.page-heading h1{font-size:26px;font-weight:650;color:var(--workspace-text);letter-spacing:-.3px}
.page-heading p{color:var(--workspace-muted);font-size:15px;line-height:1.7;margin-top:7px}
.page-heading .actions{gap:8px}
button{background:var(--workspace-surface);border-color:#c7d3df;color:var(--workspace-text);transition:background-color .12s,border-color .12s}
button:hover{background:#e5edf5;border-color:#9eb3c8}
.primary{background:var(--workspace-accent);border-color:var(--workspace-accent);color:var(--workspace-white)}
.primary:hover{background:#194b78;border-color:#194b78;color:var(--workspace-white)}
.ghost,.icon-button{background:transparent;border-color:transparent}
.ghost:hover,.icon-button:hover{background:#dce7f1}
button:disabled,.official-root button:disabled{opacity:1;background:#e5ebf1;color:#5a6c7f;border-color:#ced8e2}
.small{font-size:14px;min-height:32px;padding:6px 10px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--workspace-accent);outline-offset:2px}
.panel,.metric,.team-card,.document,.ceo,.kanban-card{background:var(--workspace-surface);border-color:var(--line);border-radius:10px;box-shadow:none}
.panel-head{padding:18px 20px;background:var(--workspace-surface);border-color:var(--workspace-rule)}
.panel-head h2{font-size:17px;font-weight:600;color:var(--workspace-text)}
.panel-head small{font-size:14px;line-height:1.7;color:var(--workspace-faint)}
.panel-body{padding:20px}.panel-body>.help{font-size:15px;line-height:1.8}
.panel-head h2 small{font-size:14px;font-weight:400}
.cyber-home-grid,.cyber-cockpit-grid,.settings-grid{gap:20px}
.cyber-personal{background:var(--workspace-frame);border:1px solid #ccd8e4;border-radius:10px;padding:20px 24px;margin-bottom:20px}
.cyber-personal strong{font-size:24px;color:var(--workspace-text)}
.cyber-personal span,.cyber-personal small{color:var(--workspace-muted);font-size:14px}
.cyber-personal p{color:#354b61}.cyber-personal b{font-weight:600}
.cyber-entry-list>button{font-size:16px;padding:14px 0;border-color:var(--workspace-rule)}
.cyber-entry-list>button:hover{background:transparent;color:var(--workspace-accent)}
.cyber-entry-list small{color:var(--workspace-muted);font-size:14px}
.cyber-daily-counts{background:var(--workspace-well);border-radius:6px;padding:12px 14px;color:var(--workspace-muted);gap:12px 20px}
.cyber-daily-counts b{color:var(--workspace-text)}
.cyber-metrics{background:var(--workspace-surface);border-color:var(--line);margin-bottom:20px}
.cyber-metric{background:transparent;padding:18px 20px;min-height:150px;border-color:var(--workspace-rule)}
.cyber-metric:hover{background:#eaf0f7}.cyber-metric:disabled{background:transparent;color:inherit}
.cyber-metric>span{font-size:15px;color:#40566d}.cyber-metric strong{font-size:30px;color:var(--workspace-text)}
.cyber-metric>small,.cyber-metric p{font-size:14px;line-height:1.6;color:var(--workspace-faint)}
.cyber-queues{background:#dde7f1;border-color:#cad7e5;margin-bottom:20px}
.cyber-queues button{padding:16px 20px;border-color:#cad7e5;color:var(--workspace-text)}
.cyber-queues button:hover,.cyber-queues button.active{background:#cbddec}
.cyber-queues button.active strong{color:#174a76}.cyber-queues small{font-size:14px;color:var(--workspace-muted)}
.cyber-center-meta{color:var(--workspace-muted);border-color:#cbd8e4;font-size:14px;padding-bottom:14px;margin-bottom:14px}
.cyber-center-links{gap:8px;margin-bottom:20px}.cyber-center-links button{background:#eff4f9}
.cyber-tabs{background:var(--workspace-well);border-color:var(--line);padding:6px 12px 0;gap:0 8px}
.cyber-tabs button{color:var(--workspace-muted);font-size:15px;padding:12px 10px}
.cyber-tabs button.active{color:#1c4e7c;border-color:var(--workspace-accent);font-weight:600}
.cyber-tabs small{font-size:13px;color:var(--workspace-muted)}
.cyber-filters{padding:18px 20px;gap:12px;background:var(--workspace-well);border-bottom:1px solid var(--workspace-rule);margin-bottom:14px}
.cyber-filters .field{font-size:14px;color:#425970}.cyber-filters input,.cyber-filters select{font-size:15px}
table{background:transparent}
th,.cyber-number-table th{background:var(--workspace-surface);font-size:14px;color:var(--workspace-muted);border-color:var(--workspace-rule)}
td{border-color:var(--workspace-rule);font-size:15px;color:var(--workspace-text)}
td small,.cyber-business-table td small{font-size:14px;color:var(--workspace-faint)}
.cyber-business-table th,.cyber-number-table th{font-size:14px}.cyber-business-table td,.cyber-number-table td{font-size:15px}
.task-row{border-color:var(--workspace-rule)}.task-row:hover{background:#eaf0f7}
.task-row small,.cyber-table-count,.cyber-issue small,.cyber-activity span,.cyber-record-line small{font-size:14px;color:var(--workspace-faint)}
.empty{background:var(--workspace-well);color:var(--workspace-muted);padding:32px 22px}
.empty b{color:#3c536a;font-size:17px}.empty p{font-size:15px;line-height:1.7;margin-bottom:12px}
.empty-symbol{color:#607e9b;font-size:26px;margin-bottom:8px}
.help,.footnote,.muted,.document footer,.history{color:var(--workspace-faint)}
.help{font-size:14px;line-height:1.7}.footnote{font-size:13px;gap:12px;flex-wrap:wrap}
.notice,.ai-accent,.official-message,.official-job{background:#e3edf6;border-color:#c5d6e6;color:#315879;font-size:14px;line-height:1.8}
.notice.warning{background:#f7efd9;border-color:#e2d1a9;color:var(--workspace-warning)}
.notice.error,.error-text{background:#f8e9ec;border-color:#e9c4cc;color:var(--workspace-negative)}
.badge{background:#e2eaf2;color:#3d5872;font-size:13px;flex:none}
.badge.blue{background:#dceaf7;color:#245784}.badge.green{background:#e1eee7;color:#216046}
.badge.amber{background:#f5ead2;color:#785014}.badge.red{background:#f6e4e8;color:#983345}
.badge.purple{background:#e2eaf2;color:#3d5872}
input,select,textarea{border-color:var(--workspace-control);background:var(--workspace-white);color:var(--workspace-text);border-radius:6px}
input::placeholder,textarea::placeholder{color:var(--workspace-faint);opacity:1}
input:not([type=checkbox]):not([type=radio]):focus,select:focus,textarea:focus{border-color:var(--workspace-accent)}
input[type=checkbox],input[type=radio]{accent-color:var(--workspace-accent)}
.field{font-size:15px;color:#3b5269;line-height:1.6}
.field input,.field select,.field textarea{font-size:16px;margin-top:8px;padding:10px 12px}
.form-grid{gap:18px 20px;margin-bottom:20px}.form-grid>.field{margin-bottom:0}
dialog{background:var(--workspace-well);border-color:#bccbdc;border-radius:12px;box-shadow:0 20px 70px #1a304a33;scroll-padding-block:90px}
dialog::backdrop{background:#22364c66;backdrop-filter:none}
dialog>header{padding:18px var(--dialog-pad);background:#dfe9f2;border-color:#c5d3e1;z-index:2}
dialog>header h2{font-size:20px;font-weight:650;line-height:1.6;color:var(--workspace-text)}
#dialogBody{padding:var(--dialog-pad)}
.cyber-business-fields{background:var(--workspace-surface);border:1px solid var(--line);border-radius:8px;padding:20px;margin:20px 0}
.cyber-fieldset{background:var(--workspace-surface);border-color:var(--line)}
.cyber-fieldset legend{color:#38546f}.cyber-record-details dt{font-size:14px;color:var(--workspace-faint)}
.cyber-record-details dd{color:var(--workspace-text)}
#dialogBody>form>.form-actions{position:sticky;bottom:0;z-index:1;margin:22px calc(-1 * var(--dialog-pad)) calc(-1 * var(--dialog-pad));padding:16px var(--dialog-pad);background:#e0e9f2;border-color:#c4d3e1}
.form-actions small{font-size:14px;color:var(--workspace-faint)}
.cyber-progress,.reply,.kanban-col{background:#dfe8f1}.cyber-progress>div span{color:#465d73;background:#d0dce8}
.cyber-progress>div span.current{background:#345a7b;color:var(--workspace-white)}
.cyber-org-top{background:#e0e9f2;border-color:var(--line)}
.cyber-org-top small,.cyber-org-top p,.team-card>small,.cyber-position-row>span{color:var(--workspace-muted);font-size:14px}
.shipping-query-panel .panel-head{background:var(--workspace-surface)}
.shipping-order-table .shipping-column-filters th{background:#e5edf5;border-color:var(--line)}
.shipping-order-table small,.shipping-column-filters .shipping-date-help,.shipping-query-toolbar .help,.shipping-options-popover>.help,.shipping-options-footer small{color:var(--workspace-muted);font-size:13px}
.shipping-multi>summary{border-color:var(--workspace-control);color:#40566d}
.shipping-multi[open]>summary{border-color:var(--workspace-accent);box-shadow:none}
.shipping-options-popover{background:var(--workspace-surface);border-color:#b7c8d9}
.shipping-option:hover{background:#dfeaf4}
.official-root{color:var(--workspace-text)}
.official-root small,.official-root .help,.official-root .field,.official-milestones span,.official-data-status,.official-coverage,.official-notes,.official-edit-status,.official-field-help,.official-section-head>span,.official-pagination{color:var(--workspace-muted)}
.official-root .field{font-size:15px}.official-root input::placeholder{color:var(--workspace-faint)}
.official-root .form-grid{gap:18px 20px}.official-milestones{border-color:#c6d5e3;padding:0 0 20px}
.official-milestones>div{border-color:#c6d5e3}.official-milestones b{color:var(--workspace-text)}
.official-table-scroll,.official-root table th,.official-data-table td:first-child,.official-data-table th:first-child{background:var(--workspace-surface)}
.official-root table td,.official-root table th{border-color:var(--workspace-rule)}
.official-root table th,.official-root table td.official-empty{color:var(--workspace-muted)}
.official-root table tr:hover td{background:#eaf0f7}
.official-tabs button{color:var(--workspace-muted)}.official-tabs button.active{color:#1c4e7c;border-color:var(--workspace-accent)}
.official-state-error,.official-row-error{color:var(--workspace-negative)}
.login{background:var(--workspace-ground)}.login-brand{background:var(--workspace-frame)}
.login-brand h1,.login-brand .brand b{color:var(--workspace-text)}
.login-brand p,.login-bottom,.login-brand .eyebrow,.login-brand .brand small{color:var(--workspace-muted)}
.login-form{background:var(--workspace-surface)}
@media(max-width:1100px){.page{padding:24px}.topbar{padding:0 24px}.cyber-metric{min-height:150px}}
@media(max-width:760px){
  :root{--dialog-pad:20px}
  .page{padding:20px 16px 28px}.topbar{height:60px;padding:0 12px}.topbar-right{gap:5px}
  .topbar .sync-state{font-size:13px}.topbar button{min-height:40px}.topbar .mobile-menu{min-width:44px;min-height:44px}
  .sidebar{width:260px;max-width:85vw;padding:24px 16px}.nav-item{min-height:44px}
  .page-heading{align-items:flex-start}.page-heading h1{font-size:24px}.page-heading p{font-size:14px}
  .page-heading .actions button{font-size:14px;min-height:40px}
  .panel-head{padding:16px}.panel-body{padding:18px}.panel-head small{font-size:14px}
  .cyber-personal{padding:18px 16px;gap:14px}.cyber-personal>div:last-child{max-width:42%}
  .cyber-personal strong{font-size:22px}.cyber-personal span,.cyber-personal small{font-size:14px}
  .cyber-personal p{font-size:15px}.cyber-personal b{font-size:17px}
  .cyber-metric{padding:16px 14px;min-height:160px}.cyber-metric strong{font-size:26px}
  .cyber-metric>small,.cyber-metric p{font-size:14px}.cyber-metric>span{font-size:15px}
  .cyber-queues button{padding:14px}.cyber-queues small{font-size:14px}
  .cyber-center-meta{font-size:14px}.cyber-center-links button{min-height:40px;font-size:14px}
  .cyber-filters{padding:16px;gap:12px}.cyber-filters .field{font-size:14px}
  .cyber-tabs{flex-wrap:nowrap;overflow-x:auto;gap:0 8px}.cyber-tabs button{white-space:nowrap;flex:none;font-size:15px;min-height:44px}
  .cyber-entry-list>button{display:block;min-height:44px}.cyber-entry-list small{display:block;margin-top:5px;font-size:14px}
  .cyber-daily-counts{gap:10px 16px;padding:12px}.empty{padding:28px 18px}
  .form-grid{grid-template-columns:1fr;gap:18px;margin-bottom:18px}
  .field{font-size:16px}.field input,.field select,.field textarea{font-size:16px;min-height:44px}
  .cyber-business-fields{padding:16px;margin:18px 0}
  dialog>header{padding:16px var(--dialog-pad)}.icon-button{min-width:44px;min-height:44px}
  #dialogBody>form>.form-actions button{min-height:44px;font-size:16px}
  dialog.official-dialog>header,dialog.official-dialog #dialogBody{padding:var(--dialog-pad)}
  .official-root .form-grid{gap:18px}.official-root .field{font-size:16px}
  .footnote{font-size:13px;line-height:1.8}.shipping-mobile-hint{font-size:13px;color:var(--workspace-muted)}
}
@media(prefers-reduced-motion:reduce){button{transition:none}}

/* Reading scale: 16px body and inputs, 14px context, 13px compact status.
   Keep the dense ERP table within its own scroll frame as labels grow. */
.task-row b,.cyber-record-line,.cyber-entry-list>button,.cyber-activity button,.cyber-business-table .title-link{font-size:16px}
.task-row small,.profile small,.summary-line,.cyber-daily-counts,.cyber-check-list,.cyber-issue p,.cyber-history-item,.history,.preline,.reply,.checks label{font-size:14px}
.cyber-personal-daily h3,.cyber-issue strong,.cyber-report-item h3,.team-card>h3,.document h3{font-size:16px}
.cyber-report-item p,.cyber-report-item small,.cyber-record-details dd,.team-card>p,.document p{font-size:14px}
.metric .label,.metric small,.cyber-finance-totals span,.toolbar,.step-list,.error-text,.erp-auto-form .field{font-size:14px}
.form-actions button,.template-chips button,.login-form .field,.login-form input{font-size:16px}
.login-form>form>p,.login-form .help{font-size:14px}
.cyber-business-table{min-width:1000px}.cyber-business-table td:first-child{min-width:210px}
.shipping-order-table td,.shipping-order-table td b,.shipping-order-table .title-link{font-size:15px}
.shipping-order-table th,.shipping-order-table small,.shipping-order-table th small,.shipping-column-filters input,.shipping-column-filters select,.shipping-multi>summary,.shipping-option,.shipping-options-popover>input,.shipping-options-heading b,.shipping-followup .small,.shipping-filter-actions button{font-size:14px}
.shipping-order-table .shipping-column-filters input,.shipping-order-table .shipping-column-filters select,.shipping-multi>summary,.shipping-options-popover>input{height:auto;min-height:38px}
.shipping-date-range label>span,.shipping-date-help,.shipping-options-popover>.help,.shipping-options-footer small,.shipping-options-popover .small,.shipping-pagination>small,.shipping-filter-count small,.shipping-filter-chip,.shipping-query-toolbar .help,.shipping-mobile-hint{font-size:13px}
.shipping-options-popover{font-size:14px}.shipping-option{padding:8px 3px}.shipping-query-panel .notice{font-size:14px}
.official-root{font-size:16px}
.official-root button,.official-tabs button,.official-check,.official-state,.official-root table td,.official-root table strong{font-size:15px}
.official-root input,.official-root select,.official-root .field input{font-size:16px;min-height:44px;height:auto}
.official-root .official-check input{min-height:16px;width:16px;height:16px}
.official-root small,.official-root .help,.official-root table th,.official-milestones span,.official-field-help,.official-edit-status,.official-interval,.official-dataset-options legend,.official-section-head>span,.official-notes,.official-data-status,.official-coverage,.official-row-error,.official-pagination,.official-job,.official-message{font-size:14px;line-height:1.65}
.official-section-head h3{font-size:17px}.official-milestones b{font-size:21px}
.official-root .official-data-table{min-width:1000px}.official-row-actions button{white-space:nowrap}
.official-data-toolbar input{max-width:350px}
@media(min-width:761px) and (max-width:1100px){
  .shell{display:block}
  .sidebar{display:none;position:fixed;top:0;left:0;z-index:20;width:280px;height:100dvh;box-shadow:0 0 0 100vmax #17264166}
  .shell.menu-open .sidebar{display:flex}
  .mobile-menu{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:8px}
}
@media(max-width:760px){
  .page-heading{flex-wrap:wrap}.page-heading>.actions{justify-content:flex-start}
  .page-heading h1{font-size:24px}.page-heading p{font-size:14px}
  .field,.field input,.field select,.field textarea,.official-root .field{font-size:16px}
  .cyber-center-links button,.page-heading .actions button,.cyber-tabs button{font-size:14px;min-height:44px}
  .cyber-queues button{grid-template-columns:minmax(0,1fr) auto;gap:6px}.cyber-queues span{font-size:14px}
  .cyber-entry-list small,.cyber-personal span,.cyber-personal small{font-size:14px}
  .cyber-personal>div:last-child{min-width:90px}.cyber-personal strong{font-size:22px}
  .official-milestones{gap:6px}.official-milestones>div{padding-left:8px}.official-milestones b{font-size:18px}
  .official-milestones span,.official-milestones small{font-size:13px}
  .official-root button{min-height:44px}.official-sync-table .official-row-actions button{padding:6px 9px;font-size:14px}
  .official-sync-table td:nth-child(3)::before{font-size:13px}
  .topbar-right{gap:3px}.topbar .small{padding:6px 8px;font-size:14px}
  .topbar .sync-state{font-size:12px}.topbar .mobile-menu{display:inline-flex;align-items:center;justify-content:center}
  .shipping-options-popover{padding:10px}.shipping-options-footer small{max-width:55%}
  .shipping-query-toolbar .help{max-width:none;font-size:13px}.shipping-filter-actions button{min-height:40px}
}
