:root {
  --blue: #2f78bd;
  --blue-deep: #1d62a5;
  --blue-sidebar: #2466a2;
  --blue-light: #edf6fd;
  --canvas: #f3f6fa;
  --panel: #fff;
  --line: #dfe7f0;
  --line-dark: #ccd9e5;
  --text: #2c4055;
  --muted: #8192a4;
  --green: #36a475;
  --green-light: #edf9f3;
  --orange: #df9142;
  --orange-light: #fff4e8;
  --red: #d96767;
  --red-light: #fff0f0;
  --purple: #6d73a6;
  --sidebar: 216px;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--canvas); }
body { min-width: 320px; margin: 0; color: var(--text); background: var(--canvas); font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif; font-size: 13px; -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; } button { cursor: pointer; } button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(91,159,218,.32); outline-offset: 1px; }

.app-shell { display: flex; min-height: 100vh; }
.sidebar { position: fixed; z-index: 20; top: 0; bottom: 0; left: 0; display: flex; flex-direction: column; width: var(--sidebar); padding: 0 0 15px; overflow-y: auto; color: #dceeff; background: var(--blue-sidebar); }
.brand-lockup { display: flex; align-items: center; min-height: 60px; gap: 9px; padding: 0 18px; border-bottom: 1px solid rgba(255,255,255,.14); background: #1f5d98; }.brand-mark { position: relative; display: grid; width: 28px; height: 28px; overflow: hidden; border-radius: 3px; background: #fff; }.brand-mark i { position: absolute; width: 16px; height: 7px; border: 2px solid #2c71b0; border-top: 0; border-radius: 0 0 50% 50%; }.brand-mark i:first-child { top: 8px; left: 5px; }.brand-mark i:last-child { top: 13px; left: 7px; opacity: .55; }.brand-name { color: #fff; font-size: 15px; font-weight: 800; letter-spacing: .08em; }.brand-name small { display: block; margin-top: 1px; color: rgba(255,255,255,.63); font-size: 8px; font-weight: 500; letter-spacing: .08em; }
.factory-chip { display: flex; align-items: center; gap: 9px; margin: 13px 12px 14px; padding: 9px 10px; border: 1px solid rgba(255,255,255,.18); border-radius: 2px; background: rgba(11,55,102,.2); }.factory-chip small, .operator-card small { display: block; color: rgba(233,247,255,.64); font-size: 10px; }.factory-chip strong { display: block; margin-top: 2px; color: #fff; font-size: 11px; font-weight: 600; }.online-dot { flex: 0 0 auto; width: 6px; height: 6px; border-radius: 50%; background: #61daa5; }.chevron { margin-left: auto; color: rgba(230,247,255,.66); transform: translateY(-3px); }
.side-nav { padding: 0 8px; }.nav-label { margin: 16px 10px 5px; color: rgba(223,243,255,.62); font-size: 10px; letter-spacing: .04em; }.nav-label--spaced { margin-top: 16px; }.nav-item { display: flex; align-items: center; width: 100%; min-height: 38px; gap: 9px; margin: 1px 0; padding: 0 11px; border: 0; border-radius: 2px; color: rgba(236,248,255,.82); text-align: left; background: transparent; transition: background .15s ease, color .15s ease; }.nav-item:hover { color: #fff; background: rgba(255,255,255,.12); }.nav-item.is-active { color: #2565a1; background: #fff; }.nav-icon { display: grid; width: 17px; height: 17px; place-items: center; color: currentColor; font-size: 15px; }.nav-item > span:nth-child(2) { font-size: 12px; font-weight: 500; }.nav-item b { min-width: 17px; margin-left: auto; padding: 1px 4px; border-radius: 99px; color: #fff; font-size: 9px; text-align: center; background: rgba(255,255,255,.24); }.nav-item.is-active b { color: #2f78bd; background: #edf5fc; }.nav-item .nav-badge { color: #fff; background: #ef9639; }
.sidebar-bottom { margin: auto 11px 0; }.help-link { display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px 1px; border: 0; color: rgba(234,247,255,.72); font-size: 11px; text-align: left; background: transparent; }.help-link span { display: grid; width: 16px; height: 16px; place-items: center; border: 1px solid rgba(255,255,255,.48); border-radius: 50%; font-size: 10px; }.operator-card { display: flex; align-items: center; gap: 8px; padding-top: 11px; border-top: 1px solid rgba(255,255,255,.17); }.avatar { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 3px; color: #245f99; font-size: 11px; font-weight: 700; background: #cce7fb; }.operator-card strong { display: block; color: #fff; font-size: 11px; font-weight: 600; }.more-button { margin-left: auto; padding: 3px; border: 0; color: rgba(231,247,255,.6); letter-spacing: 1px; background: transparent; }

.main-content { width: calc(100% - var(--sidebar)); min-width: 0; min-height: 100vh; margin-left: var(--sidebar); padding: 0 26px 36px; background: var(--canvas); }.topbar { position: sticky; z-index: 10; top: 0; display: flex; align-items: center; min-height: 56px; margin: 0 -26px; padding: 0 26px; border-bottom: 1px solid #dce5ef; background: rgba(255,255,255,.96); box-shadow: 0 1px 2px rgba(29,67,107,.04); }.breadcrumb { flex:0 0 auto; color: #8a9aab; font-size: 11px; }.breadcrumb i { margin: 0 8px; color: #b5c0cb; font-style: normal; }.breadcrumb strong { color: #44596e; font-weight: 600; }.topbar-search { display: flex; align-items: center; width: min(310px,28vw); height: 29px; gap: 5px; margin-left: 30px; padding: 0 8px; border: 1px solid #d8e1eb; border-radius: 2px; color: #7f90a3; background: #fafcff; }.topbar-search span { font-size: 18px; line-height: 1; }.topbar-search input { width: 100%; border: 0; outline: 0; color: #42586d; font-size: 11px; background: transparent; }.topbar-actions { display: flex; flex:0 0 auto; align-items: center; gap: 7px; margin-left: auto; }.sync-status { display:flex; align-items:center; min-width:0; gap:5px; padding:0 8px; color:#71879a; font-size:10px; line-height:1; white-space:nowrap; }.sync-status__dot { display:block; flex:0 0 auto; width:6px; height:6px; border-radius:50%; background:#e0a053; box-shadow:0 0 0 3px rgba(224,160,83,.12); }.sync-status__label { color:#557087; }.sync-status__time { max-width:132px; overflow:hidden; padding-left:6px; border-left:1px solid #dde6ee; color:#94a4b2; font-size:9px; text-overflow:ellipsis; }.topbar-action-button { display:inline-flex; align-items:center; justify-content:center; min-height:29px; gap:5px; padding:0 8px; border:1px solid #cbd9e6; border-radius:2px; color:#4f718b; font-size:10px; background:#fff; transition:border-color .15s ease,color .15s ease,background .15s ease; }.topbar-action-button:hover { border-color:#6fa2d1; color:var(--blue); background:#f8fbff; }.topbar-action-button > span:first-child { color:#397cb8; font-size:12px; line-height:1; }.topbar-action-button--export { border-color:#7aa8cf; color:#2f78bd; background:#f7fbff; }.text-button, .outline-button, .round-button, .icon-button { border: 0; background: transparent; }.text-button { padding: 7px 6px; color: #6e8194; font-size: 11px; }.text-button:hover { color: var(--blue); }.icon-button { position: relative; display: grid; width: 29px; height: 29px; place-items: center; border: 1px solid #d8e1eb; border-radius: 2px; color: #688095; font-size: 17px; background: #fff; }.icon-button b { position: absolute; top: 5px; right: 5px; width: 5px; height: 5px; border-radius: 50%; background: var(--orange); }.primary-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 30px; padding: 0 11px; border: 1px solid var(--blue); border-radius: 2px; color: #fff; font-size: 11px; font-weight: 550; background: var(--blue); transition: background .15s ease; }.primary-button:hover { background: var(--blue-deep); }.primary-button span { font-size: 14px; line-height: 1; }.mobile-menu { display: none; }

.view { display: none; max-width: 1540px; margin: 0 auto; padding-top: 21px; animation: view-in .2s ease both; }.view.is-visible { display: block; } @keyframes view-in { from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)} }.page-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 16px; }.page-intro h1 { margin: 0; color: #293d52; font-size: 23px; font-weight: 600; letter-spacing: 0; }.overview-intro h1 { font-size: 25px; }.page-intro > div > p:last-child { margin: 6px 0 0; color: #8797a8; font-size: 12px; }.eyebrow, .section-label { margin: 0 0 6px; color: var(--blue); font-size: 9px; font-weight: 700; letter-spacing: .08em; }.eyebrow { display: flex; align-items: center; gap: 7px; }.eyebrow span { display: block; width: 22px; height: 1px; background: currentColor; }.intro-meta { display: flex; align-items: center; gap: 7px; padding: 7px 10px; border: 1px solid #d6e1ed; border-radius: 2px; color: #7990a5; font-size: 10px; background: #fff; }.intro-meta time { margin-left: 8px; padding-left: 8px; border-left: 1px solid #dee6ee; color: #617a91; font-variant-numeric: tabular-nums; }

.metric-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin-bottom: 12px; }.metric-card { position: relative; min-height: 123px; padding: 16px 17px; overflow: hidden; border: 1px solid var(--line); border-radius: 2px; background: #fff; }.metric-card--primary { border-top: 2px solid var(--blue); }.metric-label { display: flex; align-items: center; justify-content: space-between; color: #8192a4; font-size: 11px; }.metric-label i { display: grid; width: 21px; height: 21px; place-items: center; border-radius: 2px; color: #417fb9; font-size: 13px; font-style: normal; background: #eff6fd; }.metric-card > strong { display: inline-block; margin-top: 10px; color: #2b4055; font-size: 26px; font-weight: 600; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }.metric-card > strong span { font-size: 13px; }.metric-unit { margin-left: 5px; color: #8a9aad; font-size: 10px; }.metric-card > p { position: absolute; bottom: 11px; left: 17px; margin: 0; color: #8a9aaa; font-size: 9px; }.metric-card p b { color: var(--green); }.mini-progress { position: absolute; right: 17px; bottom: 23px; width: 76px; height: 6px; overflow: hidden; background: #e2eaf1; }.mini-progress i { display: block; width: var(--progress); height: 100%; background: #64a3d4; }.shipping-spark { position: absolute; right: 18px; bottom: 19px; display: flex; align-items: end; gap: 4px; height: 31px; }.shipping-spark i { width: 8px; height: 12px; background: #c7dff1; }.shipping-spark i:nth-child(2){height:25px;background:#75a9d4}.shipping-spark i:nth-child(3){height:19px}.shipping-spark i:nth-child(4){height:29px;background:#4f8ec6}.warning-bars { position: absolute; right: 18px; bottom: 21px; display: flex; align-items: end; gap: 4px; height: 31px; }.warning-bars i { width: 10px; height: 12px; background: #f8d9b3; }.warning-bars i:nth-child(2) { height: 24px; background: #e9a35b; }.warning-bars i:nth-child(3) { height: 31px; background: #df8b3a; }

.dashboard-grid { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(305px,.85fr); gap: 12px; }.dashboard-grid--bottom { margin-top: 12px; grid-template-columns: minmax(0,1.3fr) minmax(300px,.7fr); }.panel { border: 1px solid var(--line); border-radius: 2px; background: #fff; }.production-pulse, .todo-panel { min-height: 334px; padding: 17px; }.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }.panel-heading h2 { margin: 0; color: #33495f; font-size: 15px; font-weight: 600; }.outline-button { min-height: 27px; padding: 0 8px; border: 1px solid #cbd9e6; border-radius: 2px; color: #4c7dab; font-size: 10px; background: #fff; }.outline-button:hover { border-color: var(--blue); color: var(--blue); background: #f8fbff; }.round-button { display: grid; width: 26px; height: 26px; place-items: center; border: 1px solid #d4e0ec; border-radius: 2px; color: #4d86bb; font-size: 16px; }.round-button:hover { color: #fff; border-color: var(--blue); background: var(--blue); }.mini-line-board { margin-top: 12px; }.mini-line-row { display: grid; grid-template-columns: 91px minmax(0,1fr) 35px; align-items: center; gap: 9px; min-height: 53px; border-bottom: 1px solid #e8eef3; }.mini-line-row:last-child { border-bottom: 0; }.mini-line-row > div:first-child strong { display:block; color:#4b6479; font-size:10px; }.mini-line-row > div:first-child small { display:block; margin-top:2px; color:#95a5b2; font-size:9px; }.mini-line-track { position:relative; height:29px; overflow:hidden; border:1px solid #e0e8f0; background: repeating-linear-gradient(90deg,#f8fafc 0,#f8fafc calc(25% - 1px),#e1e8ef calc(25% - 1px),#e1e8ef 25%); }.mini-line-block { position:absolute; top:5px; bottom:5px; display:flex; align-items:center; min-width:28px; padding:0 5px; overflow:hidden; border:0; color:#fff; font-size:9px; text-overflow:ellipsis; white-space:nowrap; background:#70a5d3; }.mini-line-block.running { background:#4ca77e; }.mini-line-block.risk { background:#dd9345; }.mini-line-block.changeover { color:#925f2a;background:#ffe0ad; }.mini-line-row > b { color:#5d778d; font-size:10px; text-align:right; }.mini-line-row > b.high { color:#c47832; }
.todo-list { margin-top: 10px; }.todo-item { display: flex; align-items: center; width: 100%; gap: 9px; padding: 9px 0; border: 0; border-bottom: 1px solid #ebeff4; text-align: left; background: transparent; }.todo-item:last-child { border-bottom: 0; }.todo-icon { display: grid; flex: 0 0 auto; width: 25px; height: 25px; place-items: center; border-radius: 2px; font-size: 13px; }.todo-icon.warning { color: #b56b30; background: #fff4e8; }.todo-icon.pending { color: #337ab8; background: #eef6fd; }.todo-icon.info { color: #5774a2; background: #eef2fc; }.todo-item strong { display: block; color: #40566b; font-size: 11px; font-weight: 500; }.todo-item small { display: block; max-width: 265px; margin-top: 3px; overflow: hidden; color: #99a8b6; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.todo-item > i { margin-left: auto; color: #9babba; font-size: 18px; font-style: normal; }.work-order-panel, .warehouse-pulse { min-height: 260px; padding: 17px; }.data-table { width: 100%; min-width: 820px; border-spacing: 0; border-collapse: collapse; text-align: left; }.data-table th { height: 36px; padding: 0 12px; color: #597187; font-size: 10px; font-weight: 600; background: #f2f6fa; }.data-table td { height: 49px; padding: 7px 12px; border-top: 1px solid #e8eef3; color: #53687b; font-size: 10px; white-space: nowrap; }.data-table tr:hover td { background: #f7fbff; }.data-table.compact { min-width: 650px; }.data-table.compact td { height: 42px; }.table-scroll { overflow-x: auto; margin-top: 10px; }.order-name { display: flex; align-items: center; gap: 7px; }.order-icon, .material-icon { display: grid; width: 23px; height: 23px; place-items: center; border: 1px solid #bdd6e9; border-radius: 2px; color: #377db9; background: #eff7ff; }.order-name strong, .material-cell strong { display: block; max-width: 185px; overflow: hidden; color: #40566b; font-size: 10px; font-weight: 600; text-overflow: ellipsis; }.order-name small, .material-cell small { display: block; max-width: 185px; overflow: hidden; margin-top: 2px; color: #99a8b6; font-size: 9px; text-overflow: ellipsis; }.progress-cell { display: flex; align-items: center; gap: 6px; min-width: 100px; }.progress-cell i { width: 60px; height: 5px; overflow: hidden; background: #e0e8f0; }.progress-cell i::after { display: block; width: var(--progress); height: 100%; background: #62a0d3; content: ""; }.progress-cell.running i::after { background: #48a77d; }.progress-cell small { color: #718599; font-size: 9px; }.status-pill, .type-pill, .verified-pill { display: inline-flex; align-items: center; justify-content: center; min-width: 46px; padding: 4px 7px; border-radius: 2px; font-size: 9px; font-weight: 500; }.status-pill.waiting { color: #6e7f8f; background: #edf1f4; }.status-pill.planned { color: #427ba9; background: #edf5fc; }.status-pill.running { color: #2d8b69; background: #edf9f3; }.status-pill.done { color: #3d7a94; background: #eaf5f8; }.status-pill.risk { color: #be702f; background: #fff3e6; }.activity-list { margin-top: 10px; }.activity-item { display:grid; grid-template-columns:28px minmax(0,1fr) auto; align-items:center; gap:8px; min-height:42px; border-bottom:1px solid #edf1f4; }.activity-item:last-child{border-bottom:0}.activity-symbol{display:grid;width:23px;height:23px;place-items:center;border-radius:2px;font-size:12px}.activity-symbol.inbound{color:#347bb6;background:#edf6fd}.activity-symbol.outbound{color:#5d71a7;background:#eff2fc}.activity-symbol.production{color:#2d946f;background:#edf9f3}.activity-item strong{display:block;overflow:hidden;color:#465d70;font-size:10px;font-weight:500;text-overflow:ellipsis;white-space:nowrap}.activity-item small{display:block;margin-top:2px;color:#9aa9b7;font-size:9px}.activity-item time{color:#9aa9b7;font-size:9px}

.inventory-summary, .order-summary { display: grid; grid-template-columns: repeat(4,1fr); margin-bottom: 12px; border: 1px solid var(--line); border-radius: 2px; background: #fff; }.inventory-summary div, .order-summary div { min-height: 72px; padding: 13px 17px; border-right: 1px solid #e5ebf1; }.inventory-summary div:last-child, .order-summary div:last-child { border-right: 0; }.inventory-summary span, .order-summary span { display: block; color: #8193a4; font-size: 10px; }.inventory-summary strong, .order-summary strong { display: block; margin-top: 5px; color: #344a60; font-size: 21px; }.inventory-summary strong small, .order-summary strong small { font-size: 10px; }.inventory-summary .orange { color: #d9853d; }.inventory-summary .blue, .order-summary .blue { color: #3c7fba; }.order-summary .green { color: #399e78; }
.query-panel { display: flex; align-items: end; flex-wrap: wrap; gap: 10px 13px; margin-bottom: 12px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 2px; background: #fff; }.query-panel__title { align-self: center; margin-right: 4px; color: #40586e; font-size: 12px; font-weight: 600; }.query-panel label { display: grid; gap: 5px; color: #718499; font-size: 10px; }.query-panel select, .query-panel input { width: 135px; height: 28px; padding: 0 7px; border: 1px solid #ccd9e5; border-radius: 2px; color: #4f667b; outline: 0; font-size: 10px; background: #fff; }.query-panel__keyword input { width: 188px; }.table-panel, .warehouse-flow { overflow: hidden; }.table-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 55px; padding: 11px 14px; border-bottom: 1px solid #e2e9f0; }.segmented { display: flex; overflow: hidden; border: 1px solid #d6e0ea; border-radius: 2px; background: #fff; }.segmented button { min-height: 27px; padding: 0 10px; border: 0; border-right: 1px solid #d6e0ea; color: #5f768c; font-size: 10px; background: #fff; }.segmented button:last-child { border-right: 0; }.segmented .is-selected { color: #fff; background: #4b8bc4; }.operation-toolbar { display: flex; align-items: center; gap: 6px; }.tool-button { min-height: 27px; padding: 0 9px; border: 1px solid #cbd9e6; border-radius: 2px; color: #567187; font-size: 10px; background: #fff; }.tool-button:hover { border-color: #6fa2d1; color: var(--blue); background: #f8fbff; }.tool-button--primary { border-color: var(--blue); color: #fff; background: var(--blue); }.tool-button--primary:hover { color:#fff;background:var(--blue-deep); }.table-check { width: 13px; height: 13px; margin: 0; vertical-align: middle; accent-color: var(--blue); }.table-footer { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; border-top: 1px solid #e4ebf1; color: #8b9cab; font-size: 10px; }.table-footer div { display: flex; align-items: center; gap: 7px; }.table-footer button { width: 21px; height: 21px; border: 1px solid #d4e0ec; border-radius: 2px; color: #99aab7; background: #fff; }.table-footer b { color: var(--blue); }.material-cell { display:flex;align-items:center;gap:8px; }.type-pill { color:#54728d;background:#eef4f8; }.type-pill.finished{color:#526ea2;background:#f0f3fb}.type-pill.wip{color:#957345;background:#fff8e8}.type-pill.aux{color:#756c90;background:#f4f1fa}.stock-number{color:#455d71;font-weight:600}.stock-number small{margin-left:2px;color:#93a3b0;font-size:9px;font-weight:400}.table-action{padding:3px 0;border:0;color:#2f78bd;font-size:10px;background:transparent}.table-action:hover{text-decoration:underline}

.warehouse-kpis { display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:12px; }.warehouse-kpis article { min-height:82px;padding:13px 15px;border:1px solid var(--line);border-radius:2px;background:#fff; }.warehouse-kpis span{display:block;color:#8293a4;font-size:10px}.warehouse-kpis strong{display:block;margin-top:5px;color:#384f63;font-size:21px}.warehouse-kpis strong small{font-size:10px}.warehouse-kpis p{margin:4px 0 0;color:#99a8b6;font-size:9px}

.trace-hero { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;margin-bottom:12px;padding:21px 24px; }.trace-search label{display:block;margin-bottom:8px;color:#516a80;font-size:12px;font-weight:600}.trace-search>div{display:flex;max-width:550px;gap:8px}.trace-search input{width:100%;height:35px;padding:0 10px;border:1px solid #ccd9e5;border-radius:2px;color:#40586d;outline:0;background:#fff}.trace-search p{margin:8px 0 0;color:#8b9dab;font-size:10px}.inline-link{padding:0;border:0;color:var(--blue);font-size:inherit;background:none}.inline-link:hover{text-decoration:underline}.trace-status{display:flex;align-items:center;gap:12px;padding:8px 0 8px 24px;border-left:1px solid #e0e8f0}.trace-ring{display:grid;width:43px;height:43px;place-items:center;border:1px solid #9bd6bf;border-radius:2px;color:#299072}.trace-ring i{font-size:16px;font-style:normal}.trace-status span:not(.trace-ring){display:block;color:#8799a8;font-size:10px}.trace-status strong{display:block;margin-top:2px;color:#2a8a6b;font-size:15px}.trace-status small{display:block;margin-top:3px;color:#94a4b1;font-size:9px}.trace-panel{padding:17px}.verified-pill{color:#348c70;background:#eefaf4}.trace-timeline{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin:27px 0 23px}.trace-node{position:relative;min-width:0;padding-right:10px}.trace-node:not(:last-child)::after{position:absolute;top:17px;right:0;left:48px;height:1px;background:#b9dce0;content:""}.trace-node:not(:last-child)::before{position:absolute;z-index:1;top:13px;right:-1px;color:#79aeb6;font-size:11px;content:"›"}.trace-node>span{position:relative;z-index:2;display:grid;width:34px;height:34px;place-items:center;border:1px solid #aecfe9;border-radius:2px;color:#397db8;font-size:15px;background:#eff7fe}.trace-node:nth-child(4)>span{color:#796fa4;border-color:#c8c6e6;background:#f0effc}.trace-node:nth-child(5)>span{color:#3d967e;border-color:#acd8c9;background:#eaf9f3}.trace-node b{display:block;margin-top:8px;color:#496173;font-size:10px}.trace-node small{display:block;min-height:26px;margin-top:3px;color:#91a1ae;font-size:9px;line-height:1.4}.trace-detail-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:12px}.trace-detail-card{padding:13px;border:1px solid #dce6ee;border-radius:2px;background:#fafcff}.trace-detail-card h3{margin:0;color:#476174;font-size:11px}.trace-detail-card dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:11px 0 0;font-size:10px}.trace-detail-card dt{color:#91a1ae}.trace-detail-card dd{margin:0;color:#536b7d;font-weight:550;text-align:right}.trace-detail-card dd.good{color:#26866e}

.month-toolbar { display:flex;align-items:center;gap:15px;margin-bottom:12px;padding:12px 15px; }.month-toolbar>div{display:flex;align-items:center;gap:10px}.month-toolbar strong{color:#3c5368;font-size:15px}.month-toolbar>span{margin-left:auto;color:#8c9cab;font-size:10px}.month-toolbar>span b{color:#4c748f}.calendar-nav{display:grid;width:24px;height:24px;place-items:center;border:1px solid #d4e0eb;border-radius:2px;color:#6284a5;background:#fff}.monthly-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:12px}.monthly-metrics article{min-height:104px;padding:15px;border:1px solid var(--line);border-radius:2px;background:#fff}.monthly-metrics span{display:block;color:#8193a4;font-size:10px}.monthly-metrics strong{display:block;margin-top:7px;color:#384f63;font-size:22px}.monthly-metrics strong small{color:#8193a4;font-size:10px;font-weight:400}.monthly-metrics p{margin:7px 0 0;color:#91a1ae;font-size:9px}.monthly-metrics p b{color:#3a9473}.monthly-product-plan{padding:17px}.schedule-legend{display:flex;gap:12px;color:#7f92a4;font-size:9px}.schedule-legend span{display:flex;align-items:center;gap:4px}.schedule-legend i{width:8px;height:8px;border-radius:1px}.legend-running{background:#4ca77e}.legend-planned{background:#70a5d3}.legend-changeover{background:#e2a150}.week-progress{display:flex;align-items:center;gap:5px;min-width:120px}.week-progress i{width:74px;height:5px;overflow:hidden;background:#e2e9f0}.week-progress i::after{display:block;width:var(--progress);height:100%;background:#72a5d1;content:""}.week-progress small{color:#7890a3;font-size:9px}.monthly-lower{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);gap:12px;margin-top:12px}.monthly-line-plan,.month-note{min-height:211px;padding:17px}.month-line-list{display:grid;gap:11px;margin-top:16px}.month-line-row{display:grid;grid-template-columns:110px 1fr 42px;align-items:center;gap:10px}.month-line-row span{color:#5a7286;font-size:10px}.month-line-row i{height:7px;overflow:hidden;background:#e2e9f0}.month-line-row i::after{display:block;width:var(--load);height:100%;background:#6aa2d0;content:""}.month-line-row i.high::after{background:#e0a053}.month-line-row b{color:#547187;font-size:10px;text-align:right}.month-line-row b.high{color:#c27835}.month-note{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;border-color:#d3e0ea;background:#fbfdff}.callout-symbol{display:grid;width:31px;height:31px;place-items:center;margin-bottom:11px;border:1px solid #bdd8eb;border-radius:2px;color:#347eb9;font-size:16px}.month-note h2,.shortage-card h2{margin:0;color:#4a5f70;font-size:15px}.month-note p,.shortage-card p{margin:7px 0 13px;color:#80909e;font-size:10px;line-height:1.7}

.schedule-board{padding:17px}.schedule-board__header,.calendar-header{display:flex;align-items:center;justify-content:space-between;gap:15px}.schedule-board__header h2{margin:0;color:#33495f;font-size:15px}.schedule-grid{margin-top:19px;overflow-x:auto}.schedule-hour-row,.schedule-line-row{display:grid;grid-template-columns:116px minmax(760px,1fr)}.schedule-hour-row{min-width:876px}.schedule-hour-row>div:first-child{padding:6px 10px;color:#7d8fa1;font-size:9px;background:#f2f6fa}.schedule-hours{display:grid;grid-template-columns:repeat(9,1fr);border-left:1px solid #dfe7ef;background:#f2f6fa}.schedule-hours span{padding:6px 0;border-right:1px solid #dfe7ef;color:#7d8fa1;font-size:9px;text-align:center}.schedule-line-row{min-width:876px;min-height:55px}.schedule-line-label{display:flex;flex-direction:column;justify-content:center;padding:0 10px;border-right:1px solid #dfe7ef;border-bottom:1px solid #e4ebf1;background:#fbfcfd}.schedule-line-label strong{color:#466075;font-size:10px}.schedule-line-label small{margin-top:2px;color:#95a5b3;font-size:9px}.schedule-track{position:relative;border-bottom:1px solid #e4ebf1;background:repeating-linear-gradient(90deg,#fff 0,#fff calc(11.11% - 1px),#e9eef3 calc(11.11% - 1px),#e9eef3 11.11%)}.schedule-block{position:absolute;top:10px;bottom:10px;display:flex;align-items:center;min-width:45px;padding:0 7px;overflow:hidden;border:0;border-left:2px solid rgba(0,0,0,.1);color:#fff;font-size:9px;text-overflow:ellipsis;white-space:nowrap;background:#70a5d3}.schedule-block.running{background:#4ca77e}.schedule-block.risk{background:#dc9348}.schedule-block.changeover{color:#925f2a;background:#ffe0ad}.schedule-block:hover{filter:brightness(.96)}.capacity-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:12px}.capacity-strip article{min-height:78px;padding:12px;border:1px solid var(--line);border-radius:2px;background:#fff}.capacity-strip span{display:block;color:#8093a4;font-size:9px}.capacity-strip strong{display:block;margin-top:5px;color:#4a6377;font-size:17px}.capacity-strip strong.high{color:#c47832}.capacity-strip p{margin:3px 0 0;color:#9aa9b6;font-size:9px}

.material-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:12px}.material-summary article{display:flex;align-items:center;gap:11px;min-height:76px;padding:13px 15px;border:1px solid var(--line);border-radius:2px;background:#fff}.summary-icon{display:grid;width:33px;height:33px;place-items:center;border-radius:2px;font-size:15px}.summary-icon.ready{color:#2d946f;background:var(--green-light)}.summary-icon.partial{color:#c17833;background:var(--orange-light)}.summary-icon.shortage{color:#c15c5c;background:var(--red-light)}.material-summary strong{display:block;color:#42596e;font-size:18px}.material-summary small{display:block;margin-top:3px;color:#91a1af;font-size:10px}.material-matrix{padding:17px}.material-lower{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);gap:12px;margin-top:12px}.material-lower .panel{min-height:185px;padding:17px}.shortage-card{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;border-color:#ecd5c3;background:#fffdf9}.shortage-card .callout-symbol{border-color:#edc7b0;color:#c77a38}.shortage-card .section-label{color:#c27c3c}.usage-list{display:grid;gap:16px;margin-top:20px}.usage-list>div{display:grid;grid-template-columns:110px 1fr 31px;align-items:center;gap:9px}.usage-list span{color:#60778c;font-size:10px}.usage-list i{height:7px;overflow:hidden;background:#e2e9f0}.usage-list i b{display:block;width:var(--usage);height:100%;background:#73a7d1}.usage-list i b.risk{background:#e1a154}.usage-list strong{color:#4c697f;font-size:10px;text-align:right}.usage-list strong.risk{color:#c27835}

.capacity-calendar{padding:17px}.calendar-header>div{display:flex;align-items:center;gap:12px}.calendar-header strong{color:#394f64;font-size:14px}.calendar-grid{display:grid;grid-template-columns:130px repeat(7,1fr);min-width:830px;margin-top:18px;border-top:1px solid #dfe7ef;border-left:1px solid #dfe7ef}.calendar-grid>div{min-height:69px;padding:8px;border-right:1px solid #dfe7ef;border-bottom:1px solid #dfe7ef}.calendar-head{min-height:37px!important;color:#6e8498;font-size:10px;text-align:center;background:#f2f6fa}.calendar-head.is-today{color:#2d78bd;background:#edf6fd}.calendar-line-label{display:flex;flex-direction:column;justify-content:center;background:#fbfcfd}.calendar-line-label strong{color:#516a7d;font-size:10px}.calendar-line-label small{margin-top:3px;color:#93a4b2;font-size:9px}.calendar-cell{position:relative}.calendar-load{display:flex;flex-direction:column;justify-content:center;height:100%;padding:7px;color:#4d7594;font-size:10px;background:#eef6fd}.calendar-load strong{color:#397cb8;font-size:13px}.calendar-load.high{color:#a96b2e;background:#fff4e6}.calendar-load.high strong{color:#c17934}.capacity-summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}.capacity-summary-grid .panel{min-height:116px;padding:17px}.capacity-summary-grid strong{display:block;margin-top:8px;color:#384f63;font-size:22px}.capacity-summary-grid strong small{color:#8193a4;font-size:10px;font-weight:400}.capacity-summary-grid p{margin:7px 0 0;color:#91a1ae;font-size:10px}.capacity-summary-grid p b{color:#369b76}

.alert-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:12px}.alert-summary article{display:flex;align-items:center;gap:11px;min-height:74px;padding:13px 15px;border:1px solid var(--line);border-radius:2px;background:#fff}.alert-count{display:grid;width:33px;height:33px;place-items:center;border-radius:2px;font-size:15px;font-weight:700}.alert-count--red{color:#c65454;background:#ffeded}.alert-count--orange{color:#be702e;background:#fff0e2}.alert-count--blue{color:#237e93;background:#e1f7f9}.alert-count--purple{color:#6e6997;background:#f0effb}.alert-summary strong{display:block;color:#496174;font-size:11px}.alert-summary small{display:block;margin-top:3px;color:#8fa0ae;font-size:10px}.alert-list{display:grid;gap:10px}.alert-card{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:13px;padding:15px;border:1px solid var(--line);border-left-width:3px;border-radius:2px;background:#fff}.alert-card.critical{border-left-color:var(--red)}.alert-card.warning{border-left-color:var(--orange)}.alert-card.info{border-left-color:#4f9ec4}.alert-card.neutral{border-left-color:#817aad}.alert-symbol{display:grid;width:30px;height:30px;place-items:center;border-radius:2px;font-size:16px}.critical .alert-symbol{color:#c65656;background:#ffeded}.warning .alert-symbol{color:#bc6d2e;background:#fff0e2}.info .alert-symbol{color:#207b90;background:#e0f6f8}.neutral .alert-symbol{color:#736c9d;background:#f1effb}.alert-card h2{margin:0;color:#465d70;font-size:12px}.alert-card p{margin:5px 0 0;color:#8d9fac;font-size:10px}.alert-tags{display:flex;gap:5px;margin-top:8px}.alert-tags span{padding:3px 6px;border-radius:2px;color:#6d8699;font-size:9px;background:#eef4f8}

.plan-dialog,.warehouse-dialog,.detail-dialog{width:min(590px,calc(100vw - 26px));padding:0;border:1px solid #cbd9e6;border-radius:2px;color:var(--text);background:#fff;box-shadow:0 15px 40px rgba(16,50,81,.22)}.plan-dialog::backdrop,.warehouse-dialog::backdrop,.detail-dialog::backdrop{background:rgba(20,45,69,.5)}.plan-dialog form,.warehouse-dialog form,.detail-dialog>div{padding:20px}.dialog-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.dialog-heading h2,.detail-dialog h2{margin:0;color:#354c60;font-size:18px;font-weight:600}.close-dialog{display:grid;width:25px;height:25px;place-items:center;border:0;border-radius:2px;color:#708397;font-size:19px;line-height:1;background:#eff4f8}.close-dialog:hover{color:#fff;background:var(--blue)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:17px}.form-grid label,.form-note{display:block;color:#668095;font-size:10px;font-weight:600}.form-grid input,.form-grid select,.form-note textarea{width:100%;height:35px;margin-top:5px;padding:0 9px;border:1px solid #ccd9e5;border-radius:2px;outline:0;color:#40586d;font-size:11px;font-weight:400;background:#fff}.form-note{margin-top:11px}.form-note textarea{height:auto;padding-top:7px;resize:vertical}.demo-hint{display:flex;gap:7px;margin:13px 0 0;padding:8px 9px;color:#718a9d;font-size:9px;line-height:1.5;background:#edf5fb}.demo-hint span{display:grid;flex:0 0 auto;width:14px;height:14px;place-items:center;border:1px solid #92bcdf;border-radius:2px;color:#3d7eb8}.dialog-actions{display:flex;justify-content:flex-end;gap:7px;margin-top:16px}.record-kind-switch{display:flex;gap:4px;margin:15px 0;padding:2px;border-radius:2px;background:#edf3f8}.record-kind-switch button{flex:1;min-height:29px;border:0;border-radius:1px;color:#6d8295;font-size:11px;background:transparent}.record-kind-switch button.is-selected{color:#2f78bd;background:#fff}.detail-dialog{max-width:485px}.detail-dialog>div>p{margin:5px 0 16px;color:#8b9ba9;font-size:10px}.detail-list{border-top:1px solid #e4ebf1}.detail-list div{display:flex;justify-content:space-between;gap:15px;padding:9px 0;border-bottom:1px solid #e4ebf1;font-size:10px}.detail-list span{color:#8c9dac}.detail-list b{color:#4b6175;text-align:right}.detail-actions{display:flex;justify-content:flex-end;gap:7px;margin-top:16px}.toast{position:fixed;z-index:60;right:24px;bottom:24px;display:flex;align-items:center;gap:9px;min-width:270px;max-width:calc(100vw - 40px);padding:11px 13px;border:1px solid #b8d6ed;border-radius:2px;opacity:0;color:#45647a;pointer-events:none;background:#f6fbff;box-shadow:0 9px 23px rgba(21,68,109,.17);transform:translateY(13px);transition:opacity .2s ease,transform .2s ease}.toast.is-visible{opacity:1;transform:translateY(0)}.toast span{display:grid;width:20px;height:20px;place-items:center;border-radius:2px;color:#fff;font-size:11px;background:#3c85c1}.toast p{margin:0;font-size:11px;font-weight:500}

@media (max-width: 1180px) { .metric-grid,.monthly-metrics{grid-template-columns:repeat(2,1fr)}.dashboard-grid,.dashboard-grid--bottom,.monthly-lower,.material-lower{grid-template-columns:1fr}.alert-summary{grid-template-columns:repeat(2,1fr)}.capacity-strip{grid-template-columns:repeat(3,1fr)}.topbar-search{width:min(220px,23vw)}.sync-status__time{display:none}.topbar-actions{gap:5px}.topbar-action-button{padding-inline:7px} }
@media (max-width: 920px) { .sync-status{display:none}.topbar-search{width:min(210px,24vw);margin-left:18px}.topbar-actions .text-button{display:none} }
@media (max-width: 560px) { .breadcrumb>span,.breadcrumb>i{display:none}.breadcrumb strong{font-size:10px}.topbar-actions .topbar-action-button>span:last-child{display:none}.topbar-actions .topbar-action-button{width:29px;padding-inline:0}.topbar-actions .primary-button{gap:4px;padding-inline:7px}.topbar-actions .primary-button span{font-size:13px} }
@media (max-width: 760px) { :root{--sidebar:0px}.sidebar{left:-225px;width:216px;box-shadow:12px 0 30px rgba(20,55,87,.18);transition:left .2s ease}.sidebar.is-open{left:0}.main-content{width:100%;margin-left:0;padding:0 12px 30px}.topbar{min-height:57px;margin:0 -12px;padding:0 12px}.mobile-menu{display:grid;width:31px;height:31px;margin-right:8px;place-items:center;border:1px solid #d4e0eb;border-radius:2px;color:var(--blue);background:#fff}.topbar-search,.topbar-actions .icon-button,.topbar-actions .text-button{display:none}.topbar-actions{gap:5px}.topbar-actions .topbar-action-button{min-height:29px;padding-inline:7px;font-size:10px}.topbar-actions .topbar-action-button>span:first-child{font-size:12px}.topbar-actions .primary-button{min-height:29px;padding-inline:8px;font-size:10px}.page-intro{align-items:flex-start;flex-direction:column;gap:11px}.intro-meta{width:100%}.metric-grid{gap:8px}.metric-card{min-height:110px;padding:12px}.metric-card>strong{font-size:23px}.metric-card>p{bottom:9px;left:12px;font-size:8px}.dashboard-grid,.dashboard-grid--bottom{gap:8px}.production-pulse,.todo-panel,.work-order-panel,.warehouse-pulse,.schedule-board,.monthly-product-plan,.monthly-line-plan,.month-note,.material-matrix,.capacity-calendar{padding:13px}.mini-line-row{grid-template-columns:72px minmax(0,1fr) 30px;gap:5px}.mini-line-row>div:first-child small{display:none}.query-panel{align-items:stretch;gap:8px;padding:10px}.query-panel__title{width:100%}.query-panel label{flex:1 1 42%}.query-panel select,.query-panel input,.query-panel__keyword input{width:100%}.inventory-summary,.order-summary{grid-template-columns:1fr 1fr}.inventory-summary div,.order-summary div{min-height:62px;padding:10px}.inventory-summary div:nth-child(2),.order-summary div:nth-child(2){border-right:0}.inventory-summary div:nth-child(-n+2),.order-summary div:nth-child(-n+2){border-bottom:1px solid #e5ebf1}.warehouse-kpis{grid-template-columns:1fr 1fr;gap:8px}.warehouse-kpis article{min-height:70px;padding:10px}.table-toolbar{align-items:stretch;flex-direction:column;padding:10px}.segmented{width:max-content;max-width:100%}.segmented button{padding:0 7px}.operation-toolbar{width:100%}.tool-button{flex:1;padding:0 5px}.trace-hero{grid-template-columns:1fr;gap:17px;padding:16px}.trace-search>div{flex-direction:column}.trace-status{padding:12px 0 0;border-top:1px solid #e0e8f0;border-left:0}.trace-timeline{grid-template-columns:repeat(2,1fr);gap:19px 8px}.trace-node:not(:last-child)::after,.trace-node:not(:last-child)::before{display:none}.trace-detail-grid{grid-template-columns:1fr}.month-toolbar{align-items:flex-start;flex-wrap:wrap;padding:11px}.month-toolbar>span{width:100%;margin-left:0}.monthly-metrics,.material-summary,.capacity-summary-grid{grid-template-columns:1fr;gap:8px}.monthly-metrics article,.material-summary article,.capacity-summary-grid .panel{min-height:70px;padding:11px}.monthly-lower .panel,.material-lower .panel{min-height:160px;padding:13px}.capacity-strip{grid-template-columns:1fr 1fr;gap:8px}.capacity-strip article{min-height:67px;padding:10px}.alert-summary{grid-template-columns:1fr;gap:8px}.alert-summary article{min-height:64px;padding:10px}.alert-card{grid-template-columns:32px minmax(0,1fr);gap:10px;padding:12px}.alert-card>button{grid-column:2;justify-self:start}.form-grid{grid-template-columns:1fr;gap:9px}.plan-dialog form,.warehouse-dialog form,.detail-dialog>div{padding:16px}.toast{right:13px;bottom:13px;min-width:0} }

@keyframes sync-pulse { 50% { opacity: .45; transform: scale(.82); } }
.sync-status:has([data-sync-state="ready"]) .sync-status__dot { background:#4ca77e; box-shadow:0 0 0 3px rgba(76,167,126,.12); }
.sync-status:has([data-sync-state="saving"]) .sync-status__dot { background:#4b8bc4; box-shadow:0 0 0 3px rgba(75,139,196,.12); animation:sync-pulse .9s ease-in-out infinite; }
.sync-status:has([data-sync-state="offline"]) .sync-status__dot { background:#d88645; box-shadow:0 0 0 3px rgba(216,134,69,.12); }
.schedule-empty { position:absolute; inset:0; display:grid; place-items:center; color:#a0afbc; font-size:10px; }
.mini-line-empty { display:grid; height:100%; place-items:center; color:#a0afbc; font-size:9px; }
.empty-state { display:grid; min-height:66px; place-items:center; padding:16px; color:#96a6b3; font-size:10px; text-align:center; }
.empty-table-row td { height:84px!important; color:#96a6b3!important; text-align:center; background:#fbfcfd; }
.report-quantity { display:flex; flex:1 1 160px; align-items:center; gap:7px; color:#607a8f; font-size:10px; white-space:nowrap; }
.report-quantity input { width:72px; height:27px; padding:0 7px; border:1px solid #cbd9e6; border-radius:2px; color:#40586d; outline:0; background:#fff; }
.report-quantity small { color:#97a7b4; font-size:9px; }
.detail-actions { flex-wrap:wrap; align-items:center; }
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important;}}

/* Authentication gate: the operations shell stays out of view until the
   local service has verified the current browser session. */
.app-shell[hidden],.login-screen[hidden]{display:none!important}
.login-screen{position:relative;display:grid;min-height:100vh;padding:28px;place-items:center;overflow:hidden;background:linear-gradient(135deg,#eaf3fa 0%,#f7fafc 48%,#e8f1f8 100%)}
.login-screen::before,.login-screen::after{position:absolute;border-radius:50%;content:"";pointer-events:none}.login-screen::before{width:520px;height:520px;top:-250px;left:-150px;background:radial-gradient(circle,rgba(72,145,203,.17),rgba(72,145,203,0) 68%)}.login-screen::after{width:460px;height:460px;right:-170px;bottom:-220px;background:radial-gradient(circle,rgba(64,128,182,.14),rgba(64,128,182,0) 70%)}
.login-card{position:relative;z-index:1;width:min(426px,100%);padding:30px 32px 22px;border:1px solid #d6e3ee;border-radius:3px;background:rgba(255,255,255,.98);box-shadow:0 20px 54px rgba(37,78,111,.15)}
.login-card__brand{display:flex;align-items:center;gap:9px;color:#1f5d98;font-size:17px;font-weight:800;letter-spacing:.08em}.login-card__brand small{display:block;margin-top:2px;color:#8da0b1;font-size:8px;font-weight:600;letter-spacing:.08em}.login-card__mark{position:relative;display:grid;width:31px;height:31px;overflow:hidden;border-radius:3px;background:#2266a4}.login-card__mark i{position:absolute;width:17px;height:7px;border:2px solid #fff;border-top:0;border-radius:0 0 50% 50%}.login-card__mark i:first-child{top:8px;left:6px}.login-card__mark i:last-child{top:14px;left:8px;opacity:.58}
.login-card__heading{margin:28px 0 20px}.login-card__heading p{margin:0 0 7px;color:#397eb8;font-size:10px;font-weight:700;letter-spacing:.08em}.login-card__heading h1{margin:0;color:#30475b;font-size:25px;font-weight:600;letter-spacing:-.02em}.login-card__heading>span{display:block;margin-top:9px;color:#8295a7;font-size:11px;line-height:1.65}
.login-form{display:grid;gap:13px}.login-form>label{display:grid;gap:6px;color:#59748b;font-size:11px;font-weight:600}.login-form input{width:100%;height:37px;padding:0 10px;border:1px solid #cbd9e5;border-radius:2px;outline:0;color:#40586d;font-size:12px;background:#fff;transition:border-color .15s ease,box-shadow .15s ease}.login-form input:focus{border-color:#5e9dcc;box-shadow:0 0 0 3px rgba(77,139,194,.12)}.login-form input::placeholder{color:#a4b2be}
.login-status{display:flex;align-items:flex-start;gap:7px;min-height:18px;margin:2px 0 -3px;color:#6b8397;font-size:10px;line-height:1.5}.login-status i{display:block;flex:0 0 auto;width:7px;height:7px;margin-top:4px;border-radius:50%;background:#d5924b;box-shadow:0 0 0 3px rgba(213,146,75,.12)}.login-status[data-state="ready"]{color:#4c738f}.login-status[data-state="ready"] i{background:#4ca77e;box-shadow:0 0 0 3px rgba(76,167,126,.12)}.login-status[data-state="loading"] i{background:#4b8bc4;box-shadow:0 0 0 3px rgba(75,139,196,.12);animation:sync-pulse .9s ease-in-out infinite}.login-status[data-state="error"]{color:#a3693e}.login-status[data-state="error"] i{background:#d88645;box-shadow:0 0 0 3px rgba(216,134,69,.12)}
.login-connection-hint{margin:-2px 0 0;padding:8px 9px;border-left:2px solid #b8d8ee;color:#8296a7;font-size:9px;line-height:1.65;background:#f4f9fd}.login-actions{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:3px}.login-submit{min-width:118px}.login-submit:disabled,.topbar-action-button:disabled{cursor:not-allowed;opacity:.52}.login-logout{margin-left:auto}.login-card__footer{margin:22px 0 0;padding-top:14px;border-top:1px solid #e6edf3;color:#9aa9b6;font-size:9px;text-align:center}
.sync-status__cache{max-width:170px}.auth-user{display:inline-flex;align-items:center;max-width:88px;min-height:24px;padding:0 7px;overflow:hidden;border-left:1px solid #e0e8ef;color:#607a8f;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.auth-logout{white-space:nowrap}.topbar-action-button[disabled]{border-color:#dbe4ec;color:#98a8b5;background:#f7f9fb}.topbar-action-button[disabled]>span:first-child{color:#9eafbc}
@media (max-width:1380px){.sync-status__cache{display:none}.topbar-actions [data-download-local-backup]>span:last-child{display:none}.topbar-actions [data-download-local-backup]{width:29px;padding-inline:0}.auth-user{display:none}}
@media (max-width:760px){.login-screen{padding:16px}.login-card{padding:25px 21px 19px}.login-card__heading{margin:23px 0 18px}.login-card__heading h1{font-size:22px}.login-card__footer{font-size:8px}.topbar-actions [data-download-local-backup]{display:none}}