#order-operations-app .oo-page { display:grid; gap:20px; color:#34465f; min-width:0; --oo-accent:#507ac0; --oo-tint:#f0f5ff; }
#order-operations-app * { box-sizing:border-box; }
#order-operations-app .oo-toolbar { padding:24px 26px 0; background:radial-gradient(ellipse at 100% 0%,#fff0ee 0%,transparent 42%),#fff; border:1px solid #dfe6f1; border-radius:var(--card-radius,16px); }
#order-operations-app .oo-toolbar-main { display:flex; justify-content:space-between; align-items:center; gap:20px; padding-bottom:23px; }
#order-operations-app .oo-title-line { display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
#order-operations-app h2, #order-operations-app h3, #order-operations-app p { margin:0; }
#order-operations-app h2 { font-size:24px; color:#263f61; margin:7px 0; letter-spacing:.3px; }
#order-operations-app h3 { font-size:20px; color:#2b4668; display:flex; align-items:center; gap:11px; }
#order-operations-app .oo-title p { color:#7c8a9d; font-size:13px; }
#order-operations-app .oo-eyebrow { letter-spacing:1.5px; font-size:10px; font-weight:750; color:#7489a6; }
#order-operations-app .oo-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
#order-operations-app button { display:inline-flex; align-items:center; justify-content:center; gap:7px; }
#order-operations-app button svg, #order-operations-app .asset-icon { width:18px; height:18px; flex-shrink:0; }
#order-operations-app [data-action=refresh] svg, #order-operations-app [data-action=sync] svg { fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
#order-operations-app .text-button { background:transparent; border:0; box-shadow:none; color:#6385b3; padding:8px 10px; }
#order-operations-app .oo-shop { display:flex; align-items:center; min-width:0; border-left:1px solid #e1e7f0; padding-left:19px; }
#order-operations-app .oo-shop .system-select-control { width:235px; max-width:100%; }
#order-operations-app .oo-shop .system-control-trigger { border:0; background:transparent; box-shadow:none; color:#4f617b; gap:10px; padding:6px 0; font-size:15px; font-weight:600; }
#order-operations-app .oo-shop .system-control-trigger:before { content:''; width:25px; height:25px; flex:0 0 25px; background:url('/assets/ui-icons/rakuten-r.svg') center/contain no-repeat; }
#order-operations-app .oo-datebar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; padding:18px 0; border-top:1px solid #e9edf4; }
#order-operations-app .oo-periods { display:flex; flex-wrap:wrap; gap:4px; background:#f2f5fa; padding:4px; border-radius:10px; }
#order-operations-app .oo-periods button { border:0; border-radius:7px; background:transparent; color:#72829a; font-size:12px; padding:8px 13px; box-shadow:none; }
#order-operations-app .oo-periods button.active { color:#3568cf; background:white; box-shadow:0 2px 5px #284d7b13; }
#order-operations-app .oo-dates { display:flex; gap:10px; align-items:center; color:#7587a0; font-size:12px; flex-wrap:wrap; }
#order-operations-app .oo-dates .system-date-control { width:240px; }
#order-operations-app .oo-dates .system-control-trigger { font-size:13px; }
#order-operations-app .oo-source { display:flex; flex-wrap:wrap; gap:10px 24px; font-size:12px; color:#7789a2; padding:16px 0 0; line-height:1.8; border-top:1px dashed #dde5ef; }
#order-operations-app .oo-source small { flex-basis:100%; font-size:11px; }
#order-operations-app [data-content] { display:grid; gap:20px; min-width:0; }
#order-operations-app [data-job]:empty { display:none; }
#order-operations-app [data-content][aria-busy=true] { opacity:.6; pointer-events:none; }
#order-operations-app .oo-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:repeat(2,136px); gap:14px; }
#order-operations-app .oo-kpi { position:relative; display:flex; flex-direction:column; align-items:stretch; justify-content:space-between; text-align:left; gap:8px; min-width:0; min-height:0; overflow:hidden; border:1px solid #dce3ec; border-radius:var(--card-radius,16px); padding:18px 20px; background:#fff; isolation:isolate; box-shadow:0 2px 3px #24395803; transition:border-color .18s,box-shadow .18s; }
#order-operations-app .oo-kpi::before { content:''; position:absolute; z-index:-1; pointer-events:none; inset:0; border-radius:inherit; background:linear-gradient(135deg,#fff0 12%,var(--kpi-tint,#eff4fc) 100%); opacity:.58; transition:opacity .3s ease; }
#order-operations-app .oo-kpi:hover::before { opacity:1; }
#order-operations-app .oo-kpi:hover { border-color:var(--kpi-accent,#94afd2); box-shadow:0 4px 14px #38587b0b; filter:none; }
#order-operations-app .oo-kpi-label { display:flex; align-items:center; gap:10px; color:#5d6d82; font-size:14px; font-weight:550; white-space:nowrap; }
#order-operations-app .oo-kpi-icon { width:28px; height:28px; display:grid; place-items:center; flex-shrink:0; color:var(--kpi-accent); }
#order-operations-app .oo-kpi strong { color:#243d5c; font-size:30px; line-height:1.2; letter-spacing:-.8px; font-weight:650; font-variant-numeric:tabular-nums; white-space:nowrap; }
#order-operations-app .oo-kpi-value { display:flex; align-items:center; justify-content:space-between; gap:10px; min-width:0; }
#order-operations-app .oo-kpi-main .oo-kpi-value { flex-direction:column; align-items:flex-start; justify-content:center; gap:15px; flex:1; }
#order-operations-app .oo-change { display:flex; flex-direction:column; align-items:flex-start; gap:2px; min-width:0; font-size:10px; line-height:1.5; color:#8894a4; font-weight:400; }
#order-operations-app .oo-change b { font-size:11px; color:#7e90a7; font-weight:600; }
#order-operations-app .oo-change-up b { color:#27926d; }
#order-operations-app .oo-change-down b { color:#c56b5d; }
#order-operations-app .oo-kpi small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10px; font-weight:400; color:#8a97a8; line-height:1.5; }
#order-operations-app .oo-kpi-main { grid-row:1/3; padding:24px; gap:16px; }
#order-operations-app .oo-kpi-main .oo-kpi-label { font-size:15px; gap:12px; }
#order-operations-app .oo-kpi-main .oo-kpi-icon { width:40px; height:40px; border:0; background:#ffffffb3; border-radius:12px; color:var(--kpi-accent); }
#order-operations-app .oo-kpi-main strong { font-size:clamp(29px,2.3vw,40px); line-height:1.2; max-width:100%; }
#order-operations-app .oo-kpi-main small { font-size:11px; width:100%; color:#8694a7; padding-top:15px; border-top:1px solid #e5eaf280; }
#order-operations-app .oo-kpi-main .oo-change { flex-direction:row; align-items:center; flex-wrap:wrap; gap:6px 10px; }
#order-operations-app .oo-change-percent b { font-size:13px; font-variant-numeric:tabular-nums; }
#order-operations-app .oo-kpi-main .oo-change-percent b { font-size:15px; }
#order-operations-app .oo-kpi-main .oo-change-up b { background:transparent; }
#order-operations-app .oo-kpi-main .oo-change-down b { background:transparent; }
#order-operations-app .oo-kpi-orders { grid-column:1; --kpi-accent:#5d82bd; --kpi-tint:#eaf1ff; }
#order-operations-app .oo-kpi-units { --kpi-accent:#4f9b92; --kpi-tint:#e8f5f0; }
#order-operations-app .oo-kpi-aov { --kpi-accent:#b68d56; --kpi-tint:#fbf2e2; }
#order-operations-app .oo-kpi-shipping { --kpi-accent:#5e91ac; --kpi-tint:#eaf4f9; }
#order-operations-app .oo-kpi-pending { --kpi-accent:#a184a1; --kpi-tint:#f6eef5; }
#order-operations-app .oo-kpi-amount { grid-column:2; --kpi-accent:#8a78b3; --kpi-tint:#f0eafa; }
#order-operations-app .oo-today { padding:26px 30px 16px; border:1px solid #cddded; background:radial-gradient(ellipse at 85% 0%,#dceeee 0%,transparent 55%),linear-gradient(120deg,#f0f5ff,#fff); border-radius:20px; overflow:hidden; }
#order-operations-app .oo-today-head { display:flex; align-items:center; gap:17px; }
#order-operations-app .oo-today-head p { color:#7b8c9f; font-size:12px; }
#order-operations-app .oo-shipping-layout { display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.25fr); gap:30px; margin-top:22px; align-items:center; }
#order-operations-app .oo-clock-panel { min-width:0; padding:4px 22px 20px 0; }
#order-operations-app .oo-countdown { text-align:left; display:grid; gap:10px; }
#order-operations-app .oo-countdown span { color:#3f6ec0; font-size:16px; font-weight:600; }
#order-operations-app .oo-countdown strong { color:#396de2; font-size:clamp(36px,3.7vw,56px); line-height:1.15; letter-spacing:2px; font-variant-numeric:tabular-nums; }
#order-operations-app .oo-clock-track { position:relative; height:10px; border-radius:6px; background:#dfe7f3; margin:22px 0 15px; }
#order-operations-app .oo-clock-track>i { display:block; height:100%; background:linear-gradient(90deg,#769fff,#437be7); border-radius:6px; }
#order-operations-app .oo-clock-cutoff,#order-operations-app .oo-clock-end { position:absolute; top:-5px; height:20px; width:2px; background:#96aac5; }
#order-operations-app .oo-clock-cutoff { background:#da8b73; }
#order-operations-app .oo-clock-cutoff b,#order-operations-app .oo-clock-end b { display:block; position:absolute; top:26px; transform:translateX(-50%); font-size:12px; color:#58729a; white-space:nowrap; }
#order-operations-app .oo-clock-cutoff small,#order-operations-app .oo-clock-end small { position:absolute; top:46px; transform:translateX(-50%); font-size:10px; color:#8d9db2; white-space:nowrap; }
#order-operations-app .oo-clock-cutoff b,#order-operations-app .oo-clock-cutoff small { color:#c27d65; }
#order-operations-app .oo-clock-end { right:0; }
#order-operations-app .oo-clock-end b,#order-operations-app .oo-clock-end small { transform:translateX(-100%); }
#order-operations-app .oo-clock-now { display:block; color:#8597ae; font-size:11px; margin-top:15px; padding-bottom:15px; }
#order-operations-app .oo-today-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(100px,1fr)); gap:0; margin:0; padding:0; background:transparent; border:1px solid #ccdceb; border-radius:14px; overflow:hidden; }
#order-operations-app .oo-today-metric { display:grid; gap:8px; border:0; border-right:1px solid #ccdceb; border-bottom:1px solid #ccdceb; border-radius:0; padding:18px 10px; background:transparent; color:#647ea2; box-shadow:none; }
#order-operations-app .oo-today-metric:nth-child(3n) { border-right:0; }
#order-operations-app .oo-today-metric:nth-child(n+4) { border-bottom:0; }
#order-operations-app .oo-today-metric:hover { background:transparent; filter:none; color:#396de2; }
#order-operations-app .oo-today-metric span { font-size:12px; }
#order-operations-app .oo-today-metric strong { font-size:27px; color:#3e6089; }
#order-operations-app .oo-today[data-phase=before_warehouse][data-risk=true] { background:radial-gradient(ellipse at 90% 0%,#fff0cf,transparent 60%),#fffdf7; border-color:#eadab8; }
#order-operations-app .oo-today[data-phase=closed][data-risk=true] { background:radial-gradient(ellipse at 90% 0%,#fbe1dc,transparent 60%),#fffbf9; border-color:#e9cfc8; }
#order-operations-app .oo-today[data-phase=closed] .oo-countdown strong { color:#6884a8; font-size:34px; letter-spacing:1px; }
#order-operations-app .oo-today[data-phase=closed][data-risk=true] .oo-countdown strong { color:#af5a4c; }
#order-operations-app .oo-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; min-width:0; }
#order-operations-app .oo-trend-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; }
#order-operations-app .oo-card { background:#fff; border:1px solid #dce3ec; border-radius:var(--card-radius,16px); min-width:0; overflow:hidden; padding:22px; }
#order-operations-app .oo-card header { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:18px; padding-bottom:18px; border-bottom:1px solid #e8edf2; }
#order-operations-app .oo-card header h3 { margin-top:4px; }
#order-operations-app small, #order-operations-app footer { color:#8b98a9; font-size:11px; font-weight:400; }
#order-operations-app footer { margin-top:14px; line-height:1.8; }
#order-operations-app .oo-trend-card { display:flex; flex-direction:column; height:490px; }
#order-operations-app .oo-chart-controls { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:14px; }
#order-operations-app .oo-segments { display:inline-flex; padding:3px; gap:3px; border-radius:9px; background:#f1f5fb; }
#order-operations-app .oo-segments button { background:transparent; box-shadow:none; border:1px solid transparent; color:#7c8da6; font-size:12px; padding:6px 12px; min-height:31px; border-radius:7px; }
#order-operations-app .oo-segments button.active { background:#fff; color:#3c6fb8; border-color:#e2e9f4; box-shadow:0 1px 3px #3d56750a; }
#order-operations-app .oo-trend-ranges { display:flex; gap:2px; }
#order-operations-app .oo-trend-ranges button { background:transparent; border:0; box-shadow:none; color:#8a97a9; font-size:11px; padding:5px 8px; min-height:29px; border-radius:6px; }
#order-operations-app .oo-trend-ranges button.active { background:#edf3fc; color:#537db5; }
#order-operations-app .oo-chart-sub { font-size:11px; color:#8a98ac; }
#order-operations-app [data-chart] { position:relative; flex:1; display:flex; min-height:0; margin-top:10px; }
#order-operations-app .oo-chart { position:relative; flex:1; min-width:0; min-height:0; }
#order-operations-app .oo-chart-legend { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:7px 12px; font-size:10px; color:#8190a3; }
#order-operations-app .oo-chart-legend span { display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
#order-operations-app .oo-legend-bar { display:inline-block; width:9px; height:10px; border-radius:2px; background:#a0bdec; }
#order-operations-app .oo-legend-bar.oo-legend-units { background:#83c5b8; }
#order-operations-app .oo-legend-line { display:inline-block; width:15px; height:2px; background:#d29750; }
#order-operations-app [data-bar-metric=units] .oo-bars rect { fill:#83c5b8; }
#order-operations-app .oo-chart[data-mode=amount] .oo-plot { right:7px; }
#order-operations-app .oo-y-axis { position:absolute; left:0; width:43px; top:8.2%; bottom:calc(8.2% + 24px); display:flex; flex-direction:column; justify-content:space-between; color:#94a2b5; font-size:10px; }
#order-operations-app .oo-y-axis.oo-y-axis-right { left:auto; right:0; width:48px; text-align:right; color:#b3956f; }
#order-operations-app .oo-plot { position:absolute; inset:0 53px 0 43px; min-width:0; }
#order-operations-app .oo-chart-svg { display:block; width:100%; height:calc(100% - 24px); overflow:visible; }
#order-operations-app .oo-chart-grid line { stroke:#e8eef6; stroke-width:1; stroke-dasharray:3 4; vector-effect:non-scaling-stroke; }
#order-operations-app .oo-bars rect { fill:#a0bdec; }
#order-operations-app .oo-trend-line { fill:none; stroke:#d29750; stroke-width:2.3; vector-effect:non-scaling-stroke; pointer-events:none; }
#order-operations-app .oo-trend-point { fill:none; stroke:#c68d43; stroke-width:6; stroke-linecap:round; vector-effect:non-scaling-stroke; pointer-events:none; opacity:0; }
#order-operations-app .oo-point-guide { fill:transparent; cursor:crosshair; }
#order-operations-app [data-point]:focus { outline:none; }
#order-operations-app [data-point].is-active .oo-point-guide, #order-operations-app [data-point]:focus .oo-point-guide { fill:#548bdd15; }
#order-operations-app [data-point].is-active .oo-trend-point, #order-operations-app [data-point]:focus .oo-trend-point { opacity:1; }
#order-operations-app .oo-x-axis { display:grid; height:24px; align-items:end; font-size:10px; color:#94a2b5; }
#order-operations-app .oo-x-axis span { text-align:center; white-space:nowrap; overflow:visible; }
#order-operations-app .oo-chart-tooltip { position:absolute; top:9px; width:196px; z-index:3; pointer-events:none; background:#fff; border:1px solid #dce6f3; border-radius:11px; box-shadow:0 8px 25px #29476c1c; padding:12px 14px; }
#order-operations-app .oo-chart-tooltip[hidden] { display:none; }
#order-operations-app .oo-chart-tooltip>strong { display:block; margin-bottom:8px; color:#405879; font-size:12px; }
#order-operations-app .oo-chart-tooltip span { display:flex; justify-content:space-between; gap:12px; line-height:1.9; font-size:11px; color:#8494aa; }
#order-operations-app .oo-chart-tooltip b { color:#375d91; font-weight:650; font-variant-numeric:tabular-nums; }
#order-operations-app .oo-red { color:#ae7777; }
#order-operations-app .oo-platform-item { display:grid; grid-template-columns:1fr auto; width:100%; text-align:left; border:1px solid transparent; border-bottom-color:#edf0f4; padding:14px 10px; background:#fff; border-radius:8px; box-shadow:none; margin-bottom:3px; transition:background-color .18s,box-shadow .18s,border-color .18s; }
#order-operations-app .oo-platform-item span { display:flex; align-items:center; gap:8px; font-size:13px; color:#526b8e; }
#order-operations-app .oo-platform-item span i { width:7px; height:7px; border-radius:50%; }
#order-operations-app .oo-platform-item small { grid-column:1 / -1; font-size:11px; }
#order-operations-app .oo-platform-item b { color:#405675; font-size:19px; }
#order-operations-app .oo-platform-item:is(:hover,:focus-visible) { background:#fff; border-color:transparent; border-bottom-color:#edf0f4; box-shadow:none; filter:none; }
#order-operations-app .oo-platform-item:is(:hover,:focus-visible) .oo-meter { transform:scaleY(1.35); background:#e7edf7; }
#order-operations-app .oo-platform-item:is(:hover,:focus-visible) .oo-meter i { opacity:.62; }
#order-operations-app .oo-meter { grid-column:1 / -1; height:9px; border-radius:6px; background:#edf2f8; overflow:hidden; margin-top:8px; transition:transform .18s,background-color .18s; transform-origin:center; }
#order-operations-app .oo-meter i { display:block; height:100%; border-radius:6px; opacity:.85; transition:opacity .18s; }
#order-operations-app .oo-status-confirm { background:#7397e2; }
#order-operations-app .oo-status-shipping { background:#e6b251; }
#order-operations-app .oo-status-shipped { background:#45b2a0; }
#order-operations-app .oo-status-cancel { background:#d9868a; }
#order-operations-app .oo-work-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; border:1px solid #e5eaf1; border-radius:12px; overflow:hidden; }
#order-operations-app .oo-work-item { position:relative; display:flex; justify-content:space-between; min-width:0; min-height:76px; border:0; border-right:1px solid #e5eaf1; border-bottom:1px solid #e5eaf1; background:#fff; border-radius:0; padding:18px 20px; color:#5d6f85; text-align:left; font-size:13px; }
#order-operations-app .oo-work-item strong { font-size:24px; font-weight:600; font-variant-numeric:tabular-nums; color:#42658f; padding-right:8px; }
#order-operations-app .oo-wms .oo-work-item { border-color:#e5eaf1; background:#fff; }
#order-operations-app .oo-wms .oo-work-item strong { color:#388578; }
#order-operations-app .oo-warning { background:#fff8e8; border:1px solid #f1e4c6; color:#9b7c3d; padding:10px 13px; border-radius:9px; font-size:11px; line-height:1.7; margin-bottom:12px; }
#order-operations-app .oo-top-table { overflow:auto; flex:1; min-height:0; scrollbar-gutter:stable; scrollbar-width:thin; scrollbar-color:#c3cfde transparent; overscroll-behavior:contain; }
#order-operations-app table { width:100%; min-width:0; table-layout:fixed; border-collapse:collapse; }
#order-operations-app th { background:#f5f7fa; color:#768597; font-weight:550; font-size:12px; text-align:left; padding:12px 8px; }
#order-operations-app td { border-bottom:1px solid #e8eef7; padding:12px 8px; font-size:13px; color:#526b8d; }
#order-operations-app th:first-child { width:32px; }
#order-operations-app th:nth-child(3) { width:122px; }
#order-operations-app th:nth-child(4) { width:46px; text-align:right; }
#order-operations-app th:last-child { width:112px; text-align:right; }
#order-operations-app td:nth-child(4), #order-operations-app td:last-child { text-align:right; font-variant-numeric:tabular-nums; }
#order-operations-app td strong, #order-operations-app td small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height:1.7; }
#order-operations-app td strong { font-weight:500; color:#455f83; font-size:13px; max-width:240px; }
#order-operations-app .oo-upc { display:block; color:#6883a7; font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-variant-numeric:tabular-nums; }
#order-operations-app td.oo-product-amount { font-size:13px; font-weight:700; color:#325f9d; }
#order-operations-app .oo-rank { display:inline-grid; place-items:center; width:25px; height:27px; border-radius:8px; color:#8b9eb8; font-size:12px; font-weight:700; }
#order-operations-app .oo-rank-gold { background:linear-gradient(145deg,#fff0c3,#e6bd60); color:#876020; border:1px solid #e4bd64; }
#order-operations-app .oo-rank-silver { background:linear-gradient(145deg,#f4f7fb,#c9d4e3); color:#64768d; border:1px solid #c3cedd; }
#order-operations-app .oo-rank-bronze { background:linear-gradient(145deg,#ffecdf,#dda47b); color:#8e5635; border:1px solid #d5a27c; }
#order-operations-app .oo-top-label { font-size:10px; font-weight:650; letter-spacing:1px; padding:5px 9px; border:1px solid #e5ecf6; background:#f6f9fe; color:#87a0c2; border-radius:7px; }
#order-operations-app .oo-todo { display:flex; justify-content:space-between; width:100%; border:1px solid transparent; border-bottom-color:#edf0f4; border-radius:8px; background:#fff; padding:14px 12px; margin-bottom:3px; color:#66809e; box-shadow:none; font-size:13px; }
#order-operations-app .oo-todo strong { margin-left:auto; font-size:16px; }
#order-operations-app .oo-todo-active { color:#5e6b7e; background:#fff; border-color:transparent; border-bottom-color:#edf0f4; }
#order-operations-app .oo-todo-active strong { min-width:34px; text-align:center; background:#f9f1e5; padding:3px 9px; border-radius:6px; color:#a67936; }
#order-operations-app .oo-health-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; }
#order-operations-app .oo-health-item { display:flex; gap:14px; align-items:center; border:1px solid #e4ebf4; border-radius:13px; background:#fff; padding:16px; }
#order-operations-app .oo-health-item:last-child { border:1px solid #e4ebf4; }
#order-operations-app .oo-health-item div { flex:1; min-width:0; }
#order-operations-app .oo-health-item strong { font-size:15px; color:#3f597b; }
#order-operations-app .oo-health-item small { display:block; line-height:1.8; overflow-wrap:anywhere; }
#order-operations-app .oo-health-icon { flex-shrink:0; background:#f7f9fc; border:1px solid #e6edf5; width:48px; height:48px; border-radius:13px; display:grid; place-items:center; }
#order-operations-app .oo-health footer { display:grid; gap:16px; border-top:1px solid #e2eaf4; padding-top:20px; margin-top:22px; }
#order-operations-app .oo-dot { display:inline-flex; align-items:center; gap:6px; font-size:11px; white-space:nowrap; }
#order-operations-app .oo-dot:before { content:''; width:6px; height:6px; border-radius:50%; background:currentColor; }
#order-operations-app .oo-ok { color:#4d987d; }
#order-operations-app .oo-warning, #order-operations-app .oo-dot.oo-warning { color:#b08844; }
#order-operations-app .oo-error { color:#b2655c; }
#order-operations-app .oo-unknown, #order-operations-app .oo-disabled { color:#98a3b3; }
#order-operations-app .oo-dot.oo-warning { background:transparent; padding:0; border:0; margin:0; }
#order-operations-app .oo-empty { background:white; border:1px solid #e2e9f3; border-radius:14px; padding:50px 25px; text-align:center; color:#91a0b2; display:grid; justify-items:center; gap:13px; line-height:1.8; }
#order-operations-app .oo-job { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 18px; border:1px solid #cedef3; background:#edf5ff; color:#5e80ad; border-radius:10px; font-size:12px; line-height:1.6; }
#order-operations-app .oo-job [data-action=dismiss-job] { flex-shrink:0; display:grid; place-items:center; width:26px; height:26px; padding:0; border:0; background:transparent; color:inherit; font-size:22px; line-height:1; box-shadow:none; transform:none; filter:none; }
#order-operations-app .oo-job [data-action=dismiss-job]:hover { background:transparent; color:inherit; box-shadow:none; transform:none; filter:none; }
#order-operations-app .oo-layer { position:fixed; inset:0; z-index:2300; display:grid; place-items:center; padding:20px; }
#order-operations-app .oo-shade { position:absolute; inset:0; background:rgba(29,39,56,.28); }
#order-operations-app .oo-modal { position:relative; width:min(510px,100%); background:white; border:1px solid #dce5f1; border-radius:17px; box-shadow:0 15px 60px #20334e33; padding:26px; }
#order-operations-app .oo-modal header { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
#order-operations-app .oo-modal header button { border:0; background:transparent; color:#7c8ba0; font-size:22px; }
#order-operations-app .oo-modal p { font-size:12px; color:#8a96a9; line-height:1.8; margin-bottom:20px; }
#order-operations-app .oo-modal label { display:flex; justify-content:space-between; align-items:center; gap:20px; margin:15px 0; color:#6d809b; font-size:13px; }
#order-operations-app .oo-modal input { max-width:150px; }
#order-operations-app .oo-modal footer { display:flex; gap:10px; justify-content:flex-end; }

#order-operations-app .oo-kpi .asset-icon { width:24px; height:24px; }
#order-operations-app h3 .asset-icon { width:26px; height:26px; padding:0; color:var(--oo-accent); }
#order-operations-app .oo-kpi-main .asset-icon { width:26px; height:26px; }
#order-operations-app .oo-rocket { width:64px; height:64px; object-fit:contain; flex-shrink:0; pointer-events:none; user-select:none; }
#order-operations-app [data-action=cutoffs] { margin-left:auto; flex-shrink:0; }
#order-operations-app .oo-health-icon img { width:34px; height:34px; object-fit:contain; }
#order-operations-app .oo-products { --oo-accent:#b78942; --oo-tint:#fff7e7; display:flex; flex-direction:column; height:490px; }
#order-operations-app .oo-wms { --oo-accent:#388578; --oo-tint:#eaf6f1; }
#order-operations-app .oo-todos { --oo-accent:#ae8145; --oo-tint:#fff5e5; }
#order-operations-app .oo-platform { --oo-accent:#6b88bc; --oo-tint:#f0f5ff; }
#order-operations-app .oo-work-item:nth-child(even) { border-right:0; }
#order-operations-app .oo-work-item:nth-last-child(-n+2) { border-bottom:0; }
#order-operations-app .oo-work-item:after { content:'›'; position:absolute; right:10px; color:var(--oo-accent); opacity:0; transition:opacity .15s; }
#order-operations-app .oo-work-item:hover:after,#order-operations-app .oo-work-item:focus-visible:after { opacity:1; }
#order-operations-app :is(.oo-work-item,.oo-todo) { transition:background-color .18s,box-shadow .18s; }
#order-operations-app .oo-work-item:is(:hover,:focus-visible) { box-shadow:inset 3px 0 var(--oo-accent),0 3px 10px #38587b09; }
#order-operations-app .oo-todo:is(:hover,:focus-visible) { box-shadow:none; }
#order-operations-app :is(.oo-work-item,.oo-todo):hover { filter:none; background:var(--oo-tint); border-color:#b9cce5; }
#order-operations-app :is(.oo-kpi,.oo-work-item,.oo-todo,.oo-platform-item,.oo-today-metric):focus-visible { outline:2px solid #749edc; outline-offset:-3px; }
#order-operations-app .oo-top-table thead th { position:sticky; top:0; z-index:1; }
#order-operations-app .oo-products header, #order-operations-app .oo-products footer { flex-shrink:0; }
#order-operations-app .oo-top-table tbody tr:hover { background:#f3f7fd; }
#order-operations-app .oo-sync-schedule { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:16px 22px; }
#order-operations-app .oo-sync-schedule>span { display:grid; gap:5px; font-size:11px; color:#8a9cb3; }
#order-operations-app .oo-sync-schedule b { font-size:13px; color:#526f95; font-weight:550; }

@media(max-width:1450px){#order-operations-app .oo-toolbar-main{flex-wrap:wrap;}#order-operations-app .oo-kpi{padding:16px;}#order-operations-app .oo-kpi-label{font-size:12px;gap:7px;}#order-operations-app .oo-kpi strong{font-size:23px;}#order-operations-app .oo-kpi-main strong{font-size:30px;}#order-operations-app .oo-trend-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);}#order-operations-app .oo-card{padding:18px;}#order-operations-app th:nth-child(3){width:114px;}#order-operations-app th:last-child{width:104px;}}
@media(max-width:1150px){#order-operations-app .oo-kpis{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:220px repeat(2,136px);}#order-operations-app .oo-kpi-main{grid-row:auto;min-height:0;}#order-operations-app .oo-kpi-main strong{font-size:36px;}#order-operations-app .oo-grid{grid-template-columns:1fr;}#order-operations-app .oo-health-grid{grid-template-columns:1fr;}#order-operations-app .oo-health-item{border:0;}#order-operations-app .oo-shipping-layout{grid-template-columns:1fr;gap:15px;}#order-operations-app .oo-clock-panel{max-width:600px;width:100%;}#order-operations-app .oo-today-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:0;padding:0;border:1px solid #ccdceb;}#order-operations-app .oo-today-metric:nth-child(3){border-right:0;}#order-operations-app .oo-trend-card{min-height:430px;}}
@media(max-width:700px){#order-operations-app .oo-kpi{padding:14px;}#order-operations-app .oo-kpi-main{min-height:0;}#order-operations-app .oo-kpis{grid-template-rows:220px repeat(2,150px);}#order-operations-app .oo-kpi-value{align-items:flex-start;}#order-operations-app .oo-kpi-main strong{font-size:clamp(24px,5vw,34px);}#order-operations-app .oo-toolbar,#order-operations-app .oo-card,#order-operations-app .oo-today{padding:18px;}#order-operations-app .oo-toolbar{padding-bottom:0;}#order-operations-app .oo-title-line{gap:5px;}#order-operations-app .oo-shop{border:0;padding-left:0;}#order-operations-app .oo-title-line h2{width:100%;}#order-operations-app .oo-today-head{flex-wrap:wrap;}#order-operations-app .oo-countdown{margin:0;text-align:left;}#order-operations-app .oo-work-grid{grid-template-columns:1fr;}#order-operations-app .oo-work-item{border-right:0;}#order-operations-app .oo-work-item:nth-last-child(2){border-bottom:1px solid #e5eaf1;}#order-operations-app .oo-dates{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:8px;width:100%;}#order-operations-app .oo-dates>span:first-child{grid-column:1/-1;}#order-operations-app .oo-dates .system-date-control{width:100%;min-width:0;}#order-operations-app .oo-today-metric{padding:14px 4px;font-size:11px;}#order-operations-app .oo-shop{max-width:100%;}#order-operations-app .oo-health-item{flex-wrap:wrap;}#order-operations-app .oo-top-table table{min-width:460px;}}
