@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;600;700;800&display=swap');

:root { color-scheme: dark; --bg:#0b0f14; --panel:#121820; --line:#25303c; --muted:#83909d; --text:#edf4f7; --accent:#66e1b2; --danger:#ff6b70; --amber:#ffc46b; --feed-row-height:68px; --dashboard-width:1320px; --machine-title-size:19px; --machine-primary-size:43px; --machine-detail-size:12px; --machine-card-padding:22px; --machine-sparkline-height:48px; }
* { box-sizing:border-box; }
* { -ms-overflow-style:none; scrollbar-width:none; }
::-webkit-scrollbar { width:0; height:0; }
html,body { width:100%; height:100%; overflow:hidden; }
body { margin:0; background:var(--bg); color:var(--text); font-family:Manrope, sans-serif; }
.rotation-viewport { position:fixed; inset:0; overflow:hidden; background:var(--bg); }
.rotation-stage { position:absolute; top:0; left:0; width:100vw; height:100vh; overflow:auto; container:dashboard-viewport / inline-size; background:radial-gradient(circle at 90% 0%, #173029 0, transparent 32rem), var(--bg); transform-origin:0 0; overscroll-behavior:contain; }
body[data-dashboard-rotation="90"] .rotation-stage { width:100vh; height:100vw; transform:translateX(100vw) rotate(90deg); }
body[data-dashboard-rotation="180"] .rotation-stage { transform:translate(100vw,100vh) rotate(180deg); }
body[data-dashboard-rotation="270"] .rotation-stage { width:100vh; height:100vw; transform:translateY(100vh) rotate(270deg); }
.shell { width:100%; max-width:var(--dashboard-width); margin:0 auto; padding:52px 32px 28px; }
.topbar, .section-head { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; }
.eyebrow { margin:0 0 10px; color:var(--accent); font:500 11px 'DM Mono', monospace; letter-spacing:.16em; }
h1 { margin:0; font-size:clamp(32px, 5vw, 58px); letter-spacing:-.055em; line-height:.98; }
h2 { margin:0; font-size:26px; letter-spacing:-.04em; }
.subtitle { color:var(--muted); margin:16px 0 0; font-size:15px; }
.status-pill, .date-chip { border:1px solid var(--line); border-radius:99px; color:var(--muted); padding:10px 14px; white-space:nowrap; }
.status-pill { font:600 12px Manrope,sans-serif; }
.date-chip { font:500 12px 'DM Mono',monospace; }
.notice a { color: #ffd07a; font-weight: 700; }
.connect-shell { min-height: 100vh; display: grid; place-content: center; gap: 20px; padding: 32px; }
.connect-card { width: min(560px, calc(100vw - 64px)); background: var(--panel); border: 1px solid var(--line); border-radius: 24px; padding: 40px; }
.connect-card h1 { font-size: clamp(36px, 6vw, 64px); margin: 8px 0 16px; }
.back-link { color: var(--muted); text-decoration: none; }
.connect-form { display: grid; gap: 18px; margin-top: 28px; }
.connect-form label { display: grid; gap: 8px; color: var(--muted); }
.connect-form input { width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 12px; background: #0b1117; color: var(--text); padding: 14px 16px; font: inherit; }
.connect-form input:focus { border-color: var(--accent); outline: 2px solid color-mix(in srgb, var(--accent) 25%, transparent); }
.connect-form button { border: 0; border-radius: 12px; background: var(--accent); color: #07110d; cursor: pointer; font: inherit; font-weight: 700; padding: 15px 18px; }
.setup-history-card { width:min(650px,calc(100vw - 64px)); }
.setup-benefits { display:grid; gap:10px; margin:26px 0; padding-left:20px; color:#b8c4cc; line-height:1.5; }
.setup-actions { display:flex; flex-wrap:wrap; gap:10px; }
.setup-actions button { border:0; border-radius:12px; background:var(--accent); color:#07110d; cursor:pointer; font:inherit; font-weight:700; padding:14px 18px; }
.setup-actions .secondary-button { border:1px solid var(--line); background:#0e151c; color:var(--muted); }
.form-error, .connect-status { border-radius: 12px; margin-top: 20px; padding: 14px 16px; }
.form-error { background: #351817; color: #ffaaa3; }
.connect-status { background: #102d25; color: #82e8c1; }
.status-pill { display:flex; align-items:center; gap:8px; }
.status-pill[hidden] { display:none; }
.status-pill.error { border-color:color-mix(in srgb,var(--danger) 55%,var(--line)); color:#ffaaa3; background:#35181766; }
#status-dot { background:var(--amber); width:8px; height:8px; border-radius:50%; }
#status-dot.live { background:var(--accent); box-shadow:0 0 0 5px #66e1b21c; }
#status-dot.error { background:var(--danger); box-shadow:0 0 0 5px #ff6b701c; }
.history-controls { display:flex; flex-wrap:wrap; align-items:end; gap:9px; margin-top:34px; }
.history-controls button,.history-controls input { border:1px solid var(--line); background:#111820; color:var(--text); border-radius:10px; min-height:42px; font:500 12px 'DM Mono',monospace; }
.history-controls button { padding:0 15px; cursor:pointer; }
.history-controls button:hover:not(:disabled),.history-controls button.active { border-color:#2c8067; background:#153129; color:var(--accent); }
.history-controls button:disabled { opacity:.35; cursor:not-allowed; }
.history-controls label { display:grid; gap:5px; color:var(--muted); font:10px 'DM Mono',monospace; }
.history-controls input { padding:0 12px; color-scheme:dark; }
.history-controls .today-button { display:flex; align-items:center; gap:7px; }
.history-controls .today-button i { width:7px; height:7px; border-radius:50%; background:var(--accent); }
.history-controls .report-button { border-color:#397b68; background:#153129; color:var(--accent); }
.history-controls .report-button:hover { border-color:var(--accent); background:#1b3b30; }
.run-list-controls { position:relative; }
.history-controls .run-lists-toggle { border-color:#397b68; color:var(--accent); }
.history-controls .run-lists-toggle[aria-expanded="true"] { border-color:var(--accent); background:#1b3b30; }
.run-lists-toggle span { display:inline-block; margin-left:4px; transition:transform .18s ease; }
.run-lists-toggle[aria-expanded="true"] span { transform:rotate(180deg); }
.run-lists-menu { position:absolute; z-index:55; top:calc(100% + 9px); left:0; display:grid; width:230px; gap:6px; padding:8px; border:1px solid #397b68; border-radius:13px; background:#101820f5; box-shadow:0 18px 52px #000a,0 0 0 1px #66e1b214; backdrop-filter:blur(16px); }
.run-lists-menu[hidden] { display:none; }
.history-controls .run-lists-menu button { display:grid; min-height:54px; align-content:center; gap:3px; padding:8px 12px; text-align:left; }
.run-lists-menu button span { color:#d5e1e4; font:700 12px Manrope,sans-serif; }
.run-lists-menu button small { color:var(--muted); font:8px 'DM Mono',monospace; letter-spacing:.08em; text-transform:uppercase; }
.history-controls .run-lists-menu .run-lists-link-button { margin-top:2px; border-top:1px solid var(--line); border-radius:0 0 8px 8px; color:var(--accent); }
.period-switch,.metric-switch { display:flex; padding:3px; border:1px solid var(--line); border-radius:12px; background:#0e141b; }
.history-controls .period-switch button,.history-controls .period-switch select,.history-controls .metric-switch button { min-height:34px; padding:0 11px; border:0; border-radius:8px; background:transparent; color:var(--muted); font:inherit; }
.history-controls .period-switch select { cursor:pointer; color-scheme:dark; }
.history-controls .period-switch button.active,.history-controls .period-switch select.active,.history-controls .metric-switch button.active { background:#1a3029; color:var(--accent); box-shadow:inset 0 0 0 1px #2c6f5b; }
.layout-controls { position:relative; display:flex; gap:9px; margin-left:auto; }
.dashboard-settings-toggle { border-color:#397b68!important; color:var(--accent)!important; }
.dashboard-settings-toggle[aria-expanded="true"] { border-color:var(--accent)!important; background:#1b3b30!important; }
.dashboard-settings-menu { position:fixed; z-index:50; top:18px; right:18px; display:grid; width:min(350px,calc(100% - 36px)); max-height:calc(100% - 36px); overflow:auto; gap:9px; padding:14px; border:1px solid #397b68; border-radius:14px; background:#101820f5; box-shadow:0 18px 52px #000a,0 0 0 1px #66e1b214; backdrop-filter:blur(16px); }
.dashboard-settings-menu[hidden] { display:none; }
.dashboard-settings-title { margin:0 0 2px; color:var(--muted); font:500 9px 'DM Mono',monospace; letter-spacing:.14em; text-transform:uppercase; }
.dashboard-settings-menu:has(.report-email-settings[open]) { width:min(620px,calc(100% - 36px)); overflow:hidden; padding:18px; }
.dashboard-settings-menu:has(.report-email-settings[open]) > :not(.report-email-settings) { display:none!important; }
.report-email-settings { border-top:1px solid #34434d; border-bottom:1px solid #34434d; }
.report-email-settings[open] { display:grid; gap:10px; padding:0; border:0; }
.report-email-settings > summary { cursor:pointer; list-style:none; padding:9px 0; }
.report-email-settings > summary::-webkit-details-marker { display:none; }
.report-email-settings > summary::after { content:'＋'; float:right; color:var(--accent); font-size:14px; line-height:9px; }
.report-email-settings[open] > summary::after { content:'Stäng'; font-size:9px; line-height:normal; }
.report-email-admin input[type="file"] { min-height:30px; padding:0 8px; border:1px solid #34434d; border-radius:7px; background:#0c1319; color:var(--text); font:10px 'DM Mono',monospace; }
.report-email-admin { display:grid; gap:7px; }
.dashboard-settings-menu:has(.report-email-settings[open]) .report-email-admin { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 10px; }
.dashboard-settings-menu:has(.report-email-settings[open]) .report-email-admin > :is(.settings-help,.report-email-schedule,.report-email-actions,label:first-of-type) { grid-column:1/-1; }
.dashboard-settings-menu:has(.report-email-settings[open]) .report-email-schedule { grid-template-columns:repeat(2,minmax(0,1fr)); }
.report-email-admin[hidden] { display:none; }
.report-email-settings label { display:grid; gap:4px; color:var(--text); font-size:11px; }
.report-email-settings input[type="text"] { min-height:30px; padding:0 8px; border:1px solid #34434d; border-radius:7px; background:#0c1319; color:var(--text); font:10px 'DM Mono',monospace; }
.report-email-settings input[type="text"]:focus { border-color:var(--accent); outline:2px solid #66e1b233; outline-offset:1px; }
.report-email-schedule { display:grid; gap:4px; color:var(--text); font-size:10px; }
.report-email-actions { display:flex; flex-wrap:wrap; gap:5px; }
.settings-help { margin:0; color:var(--muted); font-size:10px; line-height:1.35; }
.history-controls .dashboard-settings-menu > button { width:100%; }
.canvas-width-control,.slideshow-interval-control { display:grid!important; grid-template-columns:auto auto; grid-template-rows:auto 20px; align-items:center; gap:1px 8px!important; width:100%; min-width:0; padding:7px 10px 5px; border:1px solid var(--line); border-radius:10px; background:#111820; }
.canvas-width-control > span,.slideshow-interval-control > span { color:var(--muted); font:9px 'DM Mono',monospace; }
.canvas-width-control output,.slideshow-interval-control output { color:var(--accent); font:9px 'DM Mono',monospace; text-align:right; }
.history-controls .canvas-width-control input,.history-controls .slideshow-interval-control input { grid-column:1/-1; width:100%; min-height:20px; height:20px; padding:0; border:0; border-radius:0; background:transparent; accent-color:var(--accent); cursor:pointer; }
.history-controls .slideshow-start { border-color:#397b68; background:#153129; color:var(--accent); }
.dashboard-pages-manager { display:grid; gap:8px; padding:11px; border:1px solid var(--line); border-radius:11px; background:#0d141b; }
.dashboard-pages-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.dashboard-pages-heading .dashboard-settings-title { margin:0; }
.dashboard-pages-heading > span { min-width:25px; padding:3px 7px; border-radius:99px; background:#1a2a26; color:var(--accent); font:9px 'DM Mono',monospace; text-align:center; }
.slideshow-page-count { margin:-3px 0 1px; color:#7f908f; font:9px 'DM Mono',monospace; }
.dashboard-pages-list { display:grid; gap:6px; }
.dashboard-page-row { display:grid; grid-template-columns:minmax(0,1fr) repeat(4,28px); gap:5px; align-items:center; padding:6px; border:1px solid #1d2932; border-radius:9px; background:#0b1218; }
.dashboard-page-row input[type="text"] { width:100%; min-width:0; min-height:34px; padding:0 9px; border:1px solid var(--line); border-radius:8px; background:#111820; color:#cbd7db; font:10px 'DM Mono',monospace; }
.dashboard-page-row.active input[type="text"] { border-color:#397b68; background:#13221e; color:var(--accent); }
.dashboard-page-slideshow-toggle { grid-column:1/-1; display:flex!important; align-items:center; gap:7px!important; width:max-content!important; padding:2px 3px; color:#7f908f; cursor:pointer; font:9px 'DM Mono',monospace; }
.dashboard-page-slideshow-toggle input { width:14px!important; height:14px!important; min-height:14px!important; margin:0; accent-color:var(--accent); cursor:pointer; }
.dashboard-page-slideshow-toggle:has(input:checked) { color:var(--accent); }
.dashboard-page-slideshow-toggle:has(input:disabled) { opacity:.65; cursor:not-allowed; }
.dashboard-page-slideshow-toggle input:disabled { cursor:not-allowed; }
.history-controls .dashboard-page-row button { width:28px!important; min-height:28px; padding:0; border-radius:7px; color:var(--muted); font-size:10px; }
.history-controls .dashboard-page-row .dashboard-page-delete { color:#ff8c91; }
.dashboard-pages-create { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.history-controls .dashboard-pages-create button { min-height:34px; padding:0 8px; font-size:9px; }
.dashboard-page-navigation { display:flex; align-items:center; justify-content:center; gap:8px; margin:18px auto -24px; }
.dashboard-page-navigation button { min-height:34px; padding:0 12px; border:1px solid var(--line); border-radius:10px; background:#0f171e; color:var(--muted); cursor:pointer; font:500 11px 'DM Mono',monospace; }
.dashboard-page-navigation button:hover:not(:disabled),.dashboard-page-navigation button:focus-visible { border-color:#397b68; color:var(--accent); outline:none; }
.dashboard-page-navigation button:disabled { opacity:.35; cursor:not-allowed; }
.dashboard-page-navigation .dashboard-page-current { min-width:150px; color:#cbd7db; }
.dashboard-page-navigation > span { min-width:42px; color:#64727d; font:9px 'DM Mono',monospace; text-align:center; }
.history-controls .layout-toggle { border-color:#2c6f5b; color:var(--accent); }
.history-controls .rotation-toggle { border-color:#397b68; color:var(--accent); }
.history-controls .desktop-quit { border-color:#7d343a; background:#2b1519; color:#ffaaa3; }
.history-controls .card-manager { border-color:#397b68; color:var(--accent); }
.history-controls .layout-reset { color:var(--amber); }
.history-controls button:focus-visible,.history-controls input:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.card-settings-panel { position:fixed; z-index:100; right:24px; bottom:24px; width:min(340px,calc(100vw - 32px)); max-height:calc(100vh - 48px); overflow:auto; padding:22px; border:1px solid #397b68; border-radius:18px; background:#101820f5; box-shadow:0 24px 70px #000b,0 0 0 1px #66e1b21c; backdrop-filter:blur(16px); }
.card-settings-panel[hidden] { display:none; }
.card-settings-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.card-settings-head h2 { font-size:22px; }
.card-settings-close { width:34px; height:34px; border:1px solid var(--line); border-radius:9px; background:#111820; color:var(--muted); cursor:pointer; font:22px/1 Manrope,sans-serif; }
.card-settings-close:hover,.card-settings-close:focus-visible { border-color:var(--accent); color:var(--accent); outline:none; }
.card-settings-help { margin:12px 0 20px; color:var(--muted); font-size:11px; line-height:1.5; }
.card-settings-controls { display:grid; gap:16px; }
.card-settings-controls[hidden],.card-settings-controls label[hidden] { display:none; }
.card-settings-controls label { display:grid; grid-template-columns:1fr auto; gap:7px 12px; color:#bcc7ce; font-size:12px; }
.card-settings-controls output { color:var(--accent); font:10px 'DM Mono',monospace; }
.card-settings-controls input { grid-column:1/-1; width:100%; accent-color:var(--accent); cursor:pointer; }
.card-settings-controls input:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.order-rolls-panel { position:fixed; z-index:120; top:50%; left:50%; display:flex; width:max-content; min-width:min(540px,calc(100vw - 32px)); max-width:calc(100vw - 32px); max-height:calc(100vh - 48px); flex-direction:column; overflow:hidden; padding:22px; transform:translate(-50%,-50%); border:1px solid #397b68; border-radius:18px; background:#101820f5; box-shadow:0 24px 70px #000b,0 0 0 1px #66e1b21c; backdrop-filter:blur(16px); }
.order-rolls-panel[hidden] { display:none; }
.order-rolls-head { display:flex; flex:none; align-items:flex-start; justify-content:space-between; gap:18px; }
.order-rolls-head h2 { margin:2px 0 0; font-size:25px; }
.order-rolls-machine { margin:4px 0 0; color:var(--muted); font-size:11px; }
.order-rolls-close { width:34px; height:34px; flex:none; border:1px solid var(--line); border-radius:9px; background:#111820; color:var(--muted); cursor:pointer; font:22px/1 Manrope,sans-serif; }
.order-rolls-close:hover,.order-rolls-close:focus-visible { border-color:var(--accent); color:var(--accent); outline:none; }
.order-rolls-content { min-height:150px; overflow:auto; margin-top:18px; padding-right:4px; }
.order-rolls-loading,.order-rolls-empty { display:grid; min-height:150px; place-items:center; margin:0; color:var(--muted); font:10px 'DM Mono',monospace; }
.order-rolls-warning { display:flex; gap:9px; margin:0 0 14px; padding:10px 12px; border:1px solid #6f5833; border-radius:10px; background:#2b2115; color:#e8c98f; font-size:10px; line-height:1.45; }
.order-rolls-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-bottom:14px; }
.order-rolls-summary article { padding:11px 12px; border:1px solid var(--line); border-radius:11px; background:#0d141a; }
.order-rolls-summary span { display:block; color:var(--muted); font:8px 'DM Mono',monospace; letter-spacing:.08em; text-transform:uppercase; white-space:nowrap; }
.order-rolls-summary strong { display:block; margin-top:4px; color:var(--text); font-size:18px; white-space:nowrap; }
.order-rolls-legend { display:flex; flex-wrap:wrap; gap:7px; margin:0 0 12px; }
.order-rolls-list { display:grid; gap:8px; }
.order-roll { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 14px; padding:12px 13px; border:1px solid var(--line); border-radius:12px; background:#0d141a; }
.order-roll-main { min-width:0; }
.order-roll-main strong { display:block; overflow:hidden; color:var(--text); font:700 13px 'DM Mono',monospace; text-overflow:ellipsis; white-space:nowrap; }
.order-roll-main time { display:block; margin-top:4px; color:var(--muted); font:9px 'DM Mono',monospace; }
.order-roll-values { display:flex; align-items:flex-start; gap:9px; color:#b9c4cb; font-size:11px; white-space:nowrap; }
.order-roll-measurements { display:grid; grid-template-columns:auto auto; gap:2px 9px; justify-items:start; }
.roll-duration { grid-column:1/-1; color:#dbe5e7; font-size:10px; }
.order-roll-operator { grid-column:1/-1; color:#6f7c87; font-size:9px; }
.order-roll-barrier { grid-column:1/-1; color:#8fc7b0; font-size:10px; }
.run-list-open { overflow:hidden; }
.run-list-overlay { position:fixed; z-index:130; inset:0; display:grid; place-items:center; padding:24px; background:#05090db8; backdrop-filter:blur(5px); }
.run-list-overlay[hidden] { display:none; }
.run-list-panel { display:flex; width:min(1120px,100%); max-height:calc(100vh - 48px); flex-direction:column; overflow:hidden; border:1px solid #397b68; border-radius:20px; background:#101820fa; box-shadow:0 30px 90px #000d,0 0 0 1px #66e1b21c; }
.run-list-head { display:flex; flex:none; align-items:flex-start; justify-content:space-between; gap:24px; padding:26px 30px 22px; border-bottom:1px solid var(--line); }
.run-list-head h2 { margin:2px 0 0; font-size:clamp(26px,4vw,42px); }
.run-list-period { margin:10px 0 0; color:var(--muted); font:12px 'DM Mono',monospace; }
.run-list-actions { display:flex; flex:none; align-items:center; gap:8px; }
.run-list-actions button { min-height:42px; padding:0 16px; border:1px solid #397b68; border-radius:12px; background:#12231e; color:var(--accent); cursor:pointer; font:600 12px 'DM Mono',monospace; }
.run-list-actions button:hover,.run-list-actions button:focus-visible { border-color:var(--accent); outline:2px solid #66e1b233; outline-offset:2px; }
.run-list-actions .run-list-close { width:38px; padding:0; border-color:var(--line); background:#111820; color:var(--muted); font:24px/1 Manrope,sans-serif; }
.run-list-content { min-height:260px; overflow:auto; padding:24px 30px 32px; }
.run-list-loading,.run-list-empty { display:grid; min-height:220px; place-items:center; margin:0; color:var(--muted); font:12px 'DM Mono',monospace; }
.run-list-error { display:grid; min-height:220px; place-items:center; text-align:center; }
.run-list-error div { max-width:500px; padding:22px; border:1px solid #744349; border-radius:14px; background:#281619; }
.run-list-error strong { display:block; color:#ff9da0; font-size:16px; }
.run-list-error p { margin:8px 0 16px; color:#d5a9aa; font-size:11px; line-height:1.5; }
.run-list-error button { min-height:36px; padding:0 13px; border:1px solid #9a5c60; border-radius:9px; background:#351d21; color:#ffb3b5; cursor:pointer; font:10px 'DM Mono',monospace; }
.run-list-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:20px; }
.run-list-summary article { padding:18px; border:1px solid var(--line); border-radius:16px; background:#0d141a; }
.run-list-summary span { display:block; color:var(--muted); font:11px 'DM Mono',monospace; letter-spacing:.09em; text-transform:uppercase; }
.run-list-summary strong { display:block; margin-top:5px; color:#e0e9eb; font-size:30px; }
.run-list-source { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 18px; margin:0 0 16px; color:#71808a; font:10px 'DM Mono',monospace; }
.run-list-rows { display:grid; gap:12px; }
.run-list-order,.run-list-information { border:1px solid var(--line); border-radius:13px; background:#0c1319; }
.run-list-order { padding:18px; }
.run-list-order-head { display:grid; grid-template-columns:68px minmax(0,1fr) auto; align-items:center; gap:16px; }
.run-list-sequence { color:var(--accent); font:700 13px 'DM Mono',monospace; }
.run-list-order-title { min-width:0; }
.run-list-order-title strong { display:block; overflow:hidden; color:#e2eaec; font-size:17px; text-overflow:ellipsis; white-space:nowrap; }
.run-list-order-title span { display:block; overflow:hidden; margin-top:5px; color:#94a2aa; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.run-list-finished { display:inline-flex; min-height:26px; align-items:center; padding:0 10px; border:1px solid #31594d; border-radius:999px; background:#10211d; color:var(--accent); font:700 10px 'DM Mono',monospace; letter-spacing:.06em; text-transform:uppercase; }
.run-list-order-details { display:grid; grid-template-columns:repeat(6,minmax(86px,1fr)); gap:12px 16px; margin:16px 0 0 84px; }
.run-list-detail { min-width:0; }
.run-list-detail.wide { grid-column:span 2; }
.run-list-detail span { display:block; color:#65737d; font:10px 'DM Mono',monospace; letter-spacing:.08em; text-transform:uppercase; }
.run-list-detail strong { display:block; overflow:hidden; margin-top:4px; color:#bac6cb; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.run-list-order.completed { border-color:#2a3d39; opacity:.55; }
.run-list-order.completed .run-list-order-title strong,.run-list-order.completed .run-list-order-title span,.run-list-order.completed .run-list-detail strong { text-decoration:line-through; text-decoration-thickness:1px; }
.run-list-information { display:grid; grid-template-columns:68px minmax(0,1fr); gap:16px; padding:18px; border-color:#765d34; background:#211b12; color:#e6c687; font-size:13px; }
.run-list-config-overlay { position:fixed; z-index:145; inset:0; display:grid; place-items:center; padding:24px; background:#05090dcf; backdrop-filter:blur(7px); }
.run-list-config-overlay[hidden] { display:none; }
.run-list-config-panel { width:min(720px,100%); overflow:hidden; border:1px solid #397b68; border-radius:20px; background:#101820fa; box-shadow:0 30px 90px #000d,0 0 0 1px #66e1b21c; }
.run-list-config-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:24px 26px 20px; border-bottom:1px solid var(--line); }
.run-list-config-head h2 { margin:2px 0 0; font-size:30px; }
.run-list-config-head button { width:42px; height:42px; border:1px solid var(--line); border-radius:12px; background:#111820; color:var(--muted); cursor:pointer; font:28px/1 Manrope,sans-serif; }
.run-list-config-head button:hover,.run-list-config-head button:focus-visible { border-color:var(--accent); color:var(--accent); outline:2px solid #66e1b233; outline-offset:2px; }
.run-list-config-form { display:grid; gap:18px; padding:24px 26px 26px; }
.run-list-config-form > p:first-child { margin:0; color:#93a2aa; font-size:13px; line-height:1.55; }
.run-list-config-form label { display:grid; gap:7px; }
.run-list-config-form label > span { color:#dbe5e7; font-size:14px; font-weight:750; }
.run-list-config-form input { width:100%; min-height:46px; padding:0 13px; border:1px solid #34434d; border-radius:10px; background:#0c1319; color:var(--text); font:12px 'DM Mono',monospace; }
.run-list-config-form input:focus { border-color:var(--accent); outline:2px solid #66e1b233; outline-offset:2px; }
.run-list-config-form input:disabled { opacity:.65; cursor:not-allowed; }
.run-list-config-form label small { color:#74838c; font:10px 'DM Mono',monospace; }
.run-list-config-form label small.available { color:var(--accent); }
.run-list-config-form label small.missing { color:var(--amber); }
.run-list-config-message { min-height:20px; margin:0; color:var(--accent); font:11px 'DM Mono',monospace; }
.run-list-config-message.error { color:#ff9da0; }
.run-list-config-actions { display:flex; justify-content:flex-end; gap:10px; }
.run-list-config-actions button { min-height:42px; padding:0 15px; border:1px solid var(--line); border-radius:10px; background:#111820; color:#aebbc1; cursor:pointer; font:600 11px 'DM Mono',monospace; }
.run-list-config-actions button[type="submit"] { border-color:#397b68; background:#153129; color:var(--accent); }
.run-list-config-actions button:hover,.run-list-config-actions button:focus-visible { border-color:var(--accent); outline:2px solid #66e1b233; outline-offset:2px; }
.roll-status { display:inline-flex; align-items:center; min-height:20px; padding:0 7px; border:1px solid #3a4650; border-radius:999px; color:#9ba8b2; font:700 8px 'DM Mono',monospace; letter-spacing:.06em; text-transform:uppercase; }
.roll-status.prima { border-color:#31594d; background:#10211d; color:var(--accent); }
.roll-status.waste { border-color:#744349; background:#281619; color:#ff8589; }
.roll-status.investigation { border-color:#765d34; background:#2a2114; color:var(--amber); }
.sensor-card-controls { display:grid; gap:10px; margin:0 0 20px; padding:14px; border:1px solid #31584d; border-radius:12px; background:#0e1b18; }
.sensor-card-controls[hidden] { display:none; }
.sensor-card-controls label { display:grid; gap:7px; color:#bcc7ce; font-size:12px; }
.sensor-card-controls select { width:100%; min-height:38px; padding:0 10px; border:1px solid var(--line); border-radius:9px; background:#111820; color:var(--text); font:10px 'DM Mono',monospace; }
.sensor-card-remove { min-height:34px; border:1px solid #704148; border-radius:9px; background:#24161a; color:#ff8c91; cursor:pointer; font:10px 'DM Mono',monospace; }
.sensor-catalog-section { margin-top:24px; padding-top:18px; border-top:1px solid var(--line); }
.sensor-catalog-help { margin:-2px 0 11px; color:var(--muted); font-size:10px; line-height:1.45; }
.sensor-catalog-list { display:grid; gap:7px; }
.sensor-catalog-list > p { margin:0; color:var(--muted); font-size:11px; }
.sensor-catalog-list > div { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px; border:1px solid var(--line); border-radius:9px; background:#0d141b; }
.sensor-catalog-list span { display:grid; min-width:0; gap:2px; }
.sensor-catalog-list b { overflow:hidden; color:#d6e1e4; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.sensor-catalog-list small { overflow:hidden; color:var(--muted); font:8px 'DM Mono',monospace; text-overflow:ellipsis; white-space:nowrap; }
.sensor-catalog-list button { flex:0 0 auto; padding:6px 8px; border:1px solid #397b68; border-radius:7px; background:#14251f; color:var(--accent); cursor:pointer; font:9px 'DM Mono',monospace; }
.hidden-cards-section { margin-top:24px; padding-top:18px; border-top:1px solid var(--line); }
.hidden-cards-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.hidden-cards-head h3 { font-size:14px; }
.hidden-cards-head span { min-width:25px; padding:3px 7px; border-radius:99px; background:#1a2a26; color:var(--accent); font:10px 'DM Mono',monospace; text-align:center; }
.hidden-card-list { display:grid; gap:7px; }
.hidden-card-list p { margin:0; color:var(--muted); font-size:11px; }
.hidden-card-list > div { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 9px; border:1px solid var(--line); border-radius:9px; background:#0d141b; color:#c4d0d5; font-size:11px; }
.hidden-card-list button { flex:0 0 auto; padding:6px 8px; border:1px solid #397b68; border-radius:7px; background:#14251f; color:var(--accent); cursor:pointer; font:9px 'DM Mono',monospace; }
.history-bootstrap { display:grid; grid-template-columns:minmax(190px,1fr) minmax(150px,320px) auto; align-items:center; gap:18px; margin-top:18px; padding:12px 14px; border:1px solid #2b4c42; border-radius:14px; background:#0f1d1a; }
.history-bootstrap[hidden] { display:none; }
.history-bootstrap-copy { display:flex; min-width:0; flex-direction:column; gap:3px; }
.history-bootstrap-copy strong { font-size:12px; }
.history-bootstrap-copy span { overflow:hidden; color:var(--muted); font:500 11px Manrope,sans-serif; text-overflow:ellipsis; white-space:nowrap; }
.history-bootstrap-progress { height:7px; overflow:hidden; border-radius:99px; background:#253039; }
.history-bootstrap-progress i { display:block; width:0; height:100%; border-radius:inherit; background:var(--accent); transition:width .3s ease; }
.history-bootstrap-actions { display:flex; gap:7px; }
.history-bootstrap-actions button { min-height:32px; padding:0 10px; border:1px solid #2c6f5b; border-radius:8px; background:#13271f; color:var(--accent); cursor:pointer; font:500 10px 'DM Mono',monospace; }
.history-bootstrap.failed { border-color:#74582e; background:#261e11; }
.history-bootstrap.failed .history-bootstrap-progress i { background:var(--amber); }
.summary-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:54px 0 24px; }
.summary-card, .machine-card, .sensor-card { background:linear-gradient(140deg, #151e27, #10161d); border:1px solid var(--line); border-radius:18px; }
.summary-card { min-height:160px; padding:22px; display:flex; flex-direction:column; justify-content:space-between; }
.summary-card.accent { border-color:#2c6f5b; background:linear-gradient(140deg,#153129,#111d1d); }
.label, .unit { color:var(--muted); font-size:13px; }
.summary-card strong { font-size:38px; letter-spacing:-.06em; margin-top:18px; }
.dashboard-grid :is(#total-meters,#total-weight,#total-square-meters,#total-rolls,[data-animate-value],[data-sensor-value]) { transition:color .3s ease; }
.dashboard-grid .value-increasing { color:var(--accent)!important; }
.dashboard-grid .value-decreasing { color:var(--danger)!important; }
.number-change-delta { position:absolute; z-index:20; right:18px; max-width:calc(100% - 36px); padding:6px 11px; overflow:hidden; opacity:0; transform:translateY(-145%) scale(.96); border:1px solid #66e1b288; border-radius:10px; background:#10231dee; box-shadow:0 8px 28px #0008,0 0 24px #66e1b244; color:var(--accent); font:700 clamp(17px,2vw,28px) Manrope,sans-serif; letter-spacing:-.04em; line-height:1; pointer-events:none; text-overflow:ellipsis; white-space:nowrap; animation:number-delta-rise 10s cubic-bezier(.2,.75,.2,1) forwards; }
.number-change-delta.decreasing { border-color:#ff6b7388; background:#2b1519ee; box-shadow:0 8px 28px #0008,0 0 24px #ff6b7344; color:var(--danger); }
@keyframes number-delta-rise { 0%{opacity:0;transform:translateY(-35%) scale(.82)} 3%{opacity:1;transform:translateY(-75%) scale(1.05)} 12%{opacity:1;transform:translateY(-100%) scale(1)} 85%{opacity:1;transform:translateY(-100%) scale(1)} 100%{opacity:0;transform:translateY(-145%) scale(.96)} }
@media (prefers-reduced-motion:reduce) { .dashboard-grid :is(#total-meters,#total-weight,#total-square-meters,#total-rolls,[data-animate-value],[data-sensor-value]){transition:none}.number-change-delta,.sensor-change{display:none!important;animation:none} }
.unit { font:12px 'DM Mono', monospace; }
.quality-panel { margin:0; }
.quality-bar { display:flex; height:13px; margin:24px 0 18px; overflow:hidden; background:#1a232c; border-radius:99px; }
.quality-segment { display:block; height:100%; min-width:0; background:var(--quality-color); transition:width .7s cubic-bezier(.2,.8,.2,1); }
.quality-segment + .quality-segment { border-left:2px solid #111820; }
.quality-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.quality-grid article { display:grid; grid-template-columns:1fr auto; gap:4px 14px; padding:13px 15px; background:#0e151c; border:1px solid #202b35; border-radius:12px; }
.quality-name { display:flex; align-items:center; gap:8px; color:#aeb9c2; font-size:12px; }
.quality-name i { width:8px; height:8px; border-radius:50%; }
.quality-grid strong { font-size:18px; }
.quality-grid small { grid-column:1/-1; color:var(--muted); font:10px 'DM Mono',monospace; }
.width-waste-content { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; margin-top:18px; }
.width-waste-metric,.width-waste-process { min-width:0; padding:12px 14px; border:1px solid #3d3429; border-radius:12px; background:linear-gradient(140deg,#201b16,#12171b); }
.width-waste-metric span,.width-waste-process span { display:block; overflow:hidden; color:#aeb9c2; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.width-waste-metric strong,.width-waste-process strong { display:block; margin-top:4px; color:var(--amber); font-size:19px; }
.width-waste-process small { display:block; overflow:hidden; margin-top:3px; color:var(--muted); font:9px 'DM Mono',monospace; text-overflow:ellipsis; white-space:nowrap; }
.performance-panel { justify-content:space-between; }
.performance-trend { flex:0 0 auto; border:1px solid var(--line); border-radius:99px; color:var(--muted); padding:6px 9px; font:500 9px 'DM Mono',monospace; text-transform:uppercase; }
.performance-trend.ahead { border-color:#2c6f5b; color:var(--accent); background:#10271f; }
.performance-trend.behind { border-color:#74582e; color:var(--amber); background:#261e11; }
.performance-content { display:flex; min-height:0; flex:1; flex-direction:column; justify-content:flex-end; gap:13px; margin-top:14px; }
.performance-primary { display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 8px; }
.performance-primary strong { font-size:27px; letter-spacing:-.055em; }
.performance-primary span,.performance-stats span { color:var(--muted); font-size:10px; }
.performance-stats { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.performance-stats.single { grid-template-columns:1fr; }
.performance-stats div { display:flex; min-width:0; flex-direction:column; gap:2px; border-top:1px solid var(--line); padding-top:9px; }
.performance-stats strong { overflow:hidden; font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
.performance-stats small { overflow:hidden; color:#697681; font:500 9px Manrope,sans-serif; text-overflow:ellipsis; white-space:nowrap; }
.performance-empty { margin:0; color:var(--muted); font-size:11px; line-height:1.45; }
.product-ranking-panel { min-height:0; overflow:hidden; }
.product-ranking-head { align-items:flex-end; flex-wrap:wrap; }
.product-ranking-controls { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.product-ranking-controls label { display:grid; gap:4px; }
.product-ranking-controls label > span { color:var(--muted); font:8px 'DM Mono',monospace; letter-spacing:.08em; text-transform:uppercase; }
.product-ranking-controls select { min-height:34px; padding:0 30px 0 10px; border:1px solid var(--line); border-radius:9px; background:#111a21; color:var(--text); font:10px 'DM Mono',monospace; }
.product-ranking-controls select:focus-visible { border-color:var(--accent); outline:2px solid #66e1b233; outline-offset:2px; }
.product-ranking-content { min-height:0; flex:1; overflow:auto; margin-top:14px; border:1px solid var(--line); border-radius:12px; background:#0d141a; }
.product-ranking-content .performance-empty { padding:24px; }
.product-ranking-content table { width:100%; min-width:720px; border-collapse:collapse; font-size:11px; }
.product-ranking-content thead { position:sticky; z-index:1; top:0; background:#152129; }
.product-ranking-content th,.product-ranking-content td { padding:9px 12px; border-bottom:1px solid #202b34; text-align:right; white-space:nowrap; }
.product-ranking-content thead th { color:#81909a; font:8px 'DM Mono',monospace; letter-spacing:.08em; text-transform:uppercase; }
.product-ranking-content thead th:nth-child(2),.product-ranking-content tbody th { text-align:left; }
.product-ranking-content tbody th { max-width:460px; overflow:hidden; color:var(--text); font-weight:650; text-overflow:ellipsis; }
.product-ranking-content tbody td { color:#acb9c1; font-family:'DM Mono',monospace; }
.product-ranking-content tbody tr:last-child > * { border-bottom:0; }
.product-ranking-position { width:42px; color:var(--accent)!important; text-align:center!important; }
.panel { background:linear-gradient(145deg,#131b24,#0f151c); border:1px solid var(--line); border-radius:20px; padding:24px; overflow:hidden; }
.panel-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.live-grid { display:grid; grid-template-columns:minmax(0,2fr) minmax(280px,.8fr); gap:14px; margin-bottom:14px; }
.detail-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(320px,.85fr); align-items:stretch; gap:14px; margin-bottom:14px; }
.chart-panel { min-height:370px; }
.chart-panel .panel-head { flex-wrap:wrap; }
.chart-panel .panel-head > div:first-child { flex:0 0 auto; }
.chart-legend { display:grid; flex:1 1 500px; grid-template-columns:repeat(auto-fit,minmax(155px,1fr)); width:100%; gap:10px 16px; color:var(--muted); font:10px 'DM Mono',monospace; }
.chart-legend > span { display:flex; min-width:0; align-items:flex-start; gap:7px; white-space:normal; }
.chart-legend i { width:7px; height:7px; border-radius:50%; }
.chart-legend .legend-copy { display:flex; flex-direction:column; gap:3px; min-width:0; }
.chart-legend b { color:#b9c4cd; font:650 11px Manrope,sans-serif; }
.chart-legend .legend-shifts { display:flex; flex-direction:column; gap:2px; }
.chart-legend small { display:grid; grid-template-columns:auto minmax(0,1fr); gap:5px; overflow:visible; color:#7d8993; font:500 10px/1.35 Manrope,sans-serif; overflow-wrap:anywhere; white-space:normal; }
.chart-legend small em { flex:0 0 auto; color:#92a0ab; font:9px/1.35 'DM Mono',monospace; font-style:normal; }
.production-chart { margin-top:22px; }
.production-chart svg { display:block; width:100%; height:auto; overflow:visible; }
.chart-grid { stroke:#26323d; stroke-width:1; stroke-dasharray:3 6; }
.axis-y,.axis-x { fill:#66737e; font:9px 'DM Mono',monospace; }
.axis-y { text-anchor:end; }
.axis-x { text-anchor:middle; }
.machine-line { fill:none; stroke:var(--line-color); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 5px color-mix(in srgb,var(--line-color) 35%,transparent)); }
.machine-line.chart-updated { animation:draw-line 5s ease-out both; }
.chart-point { fill:var(--line-color); stroke:#10161d; stroke-width:3; }
.normal-line { fill:none; stroke:#a4afb8; stroke-width:2; stroke-dasharray:7 7; stroke-linecap:round; opacity:.58; }
.machine-normal-line { fill:none; stroke:var(--line-color); stroke-width:2; stroke-dasharray:7 7; stroke-linecap:round; opacity:.48; }
.chart-legend .normal-legend > i { border-radius:0; background:repeating-linear-gradient(90deg,#a4afb8 0 5px,transparent 5px 9px); width:18px; height:2px; margin-top:4px; }
.chart-legend .normal-legend small { display:block; color:#7d8993; }
.now-line { stroke:#768492; stroke-width:1; stroke-dasharray:3 5; opacity:.7; }
@keyframes draw-line { from { stroke-dasharray:1200; stroke-dashoffset:1200; } to { stroke-dasharray:1200; stroke-dashoffset:0; } }
.live-badge { color:var(--accent); border:1px solid #2c6f5b; border-radius:99px; padding:7px 9px; font:9px 'DM Mono',monospace; letter-spacing:.08em; }
.live-badge i,.pulse-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 0 #66e1b270; animation:pulse 1.8s infinite; }
@keyframes pulse { 70% { box-shadow:0 0 0 8px #66e1b200; } 100% { box-shadow:0 0 0 0 #66e1b200; } }
.shift-progress-wrap { display:grid; place-items:center; padding:24px 0 18px; }
.shift-ring { --progress:0deg; width:146px; height:146px; border-radius:50%; padding:11px; background:conic-gradient(var(--accent) var(--progress),#202b34 0); transition:background .7s ease; }
.shift-ring>div { width:100%; height:100%; border-radius:50%; background:#111820; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.shift-ring strong { font-size:32px; letter-spacing:-.06em; }
.shift-ring span,.shift-times span,.shift-stats span,.shift-operators span { color:var(--muted); font-size:11px; }
.shift-times { display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); padding-bottom:16px; }
.shift-times strong { font-size:12px; }
.shift-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:16px 0; }
.shift-stats div { display:flex; flex-direction:column; gap:5px; }
.shift-stats strong { overflow:hidden; font-size:19px; letter-spacing:-.04em; text-overflow:ellipsis; }
.shift-operators { border-top:1px solid var(--line); padding-top:14px; display:flex; flex-direction:column; gap:5px; }
.shift-operators strong { font-size:12px; line-height:1.5; }
.live-grid:has(.history-shifts) { grid-template-columns:1fr; }
.history-shift-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:22px; }
.history-shift { border:1px solid var(--line); border-radius:15px; padding:18px; background:#0e151c; }
.history-shift h3 { margin:0; font-size:15px; }
.history-shift-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:20px 0 16px; }
.history-shift-stats span { display:flex; flex-direction:column; gap:4px; }
.history-shift-stats small { color:var(--muted); font-size:10px; }
.history-shift-stats strong { font-size:22px; }
.panel-note { color:var(--muted); font:10px 'DM Mono',monospace; }
.hourly-bars { height:300px; display:grid; grid-template-columns:repeat(24,1fr); align-items:end; gap:5px; margin-top:25px; }
.bar-column { height:100%; min-width:0; display:grid; grid-template-rows:20px 1fr 18px; gap:5px; align-items:end; }
.bar-track { height:100%; display:flex; align-items:flex-end; background:#19222b; border-radius:5px 5px 2px 2px; overflow:hidden; }
.bar-stack { width:100%; display:flex; flex-direction:column-reverse; overflow:hidden; border-radius:5px 5px 2px 2px; transform-origin:center bottom; transition:height .7s cubic-bezier(.2,.8,.2,1); }
.bar-stack.chart-updated { animation:grow-bar 5s ease-out both; }
.bar-stack i { display:block; width:100%; min-height:2px; opacity:.92; }
.bar-stack i + i { border-bottom:1px solid #0b0f1466; }
.bar-column.current .bar-track { outline:1px solid #66e1b260; box-shadow:0 0 16px #66e1b218; }
.bar-column.future { opacity:.2; }
.bar-value { overflow:visible; color:#aeb9c2; font:8px 'DM Mono',monospace; text-align:center; writing-mode:vertical-rl; transform:rotate(180deg); max-height:18px; }
.bar-label { color:#66737e; font:9px 'DM Mono',monospace; text-align:center; }
@keyframes grow-bar { from { transform:scaleY(0); } to { transform:scaleY(1); } }
.activity-feed { margin-top:16px; }
.feed-item { display:grid; grid-template-columns:7px minmax(0,1fr) auto; align-items:center; gap:11px; height:var(--feed-row-height); padding:8px 0; border-bottom:1px solid #202a34; }
.feed-item:last-child { border-bottom:0; }
.feed-item>i { width:7px; height:7px; border-radius:50%; }
.feed-item div { display:flex; flex-direction:column; min-width:0; }
.feed-item strong { font-size:12px; }
.feed-item span { color:var(--muted); font-size:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.feed-item .feed-order { margin-top:3px; color:#aeb9c2; font:9px 'DM Mono',monospace; }
.feed-item .feed-order.missing { color:#65727d; }
.feed-item time { color:#6f7c87; font:9px 'DM Mono',monospace; white-space:nowrap; }
.empty-feed { color:var(--muted); padding:30px 0; text-align:center; }
.section-head { align-items:center; margin-bottom:18px; }
.machine-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.machine-card { padding:var(--machine-card-padding); min-height:290px; }
.machine-card.is-active { border-color:#2c5047; }
.machine-title { display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; }
.machine-title h3 { margin:0; font-size:var(--machine-title-size); }
.machine-area { color:var(--muted); font:500 clamp(9px,calc(var(--machine-detail-size) - 1px),15px) Manrope,sans-serif; margin-top:5px; }
.machine-title-status { display:flex; align-items:center; gap:14px; }
.machine-active-order { min-width:92px; padding:6px 10px; border:1px solid #293640; border-radius:9px; background:#0d141a99; text-align:left; }
.machine-active-order span { display:block; color:#65727d; font:600 8px 'DM Mono',monospace; letter-spacing:.11em; text-transform:uppercase; }
.machine-active-order strong { display:block; margin-top:1px; color:#72808b; font:700 clamp(11px,calc(var(--machine-detail-size) + 1px),17px) Manrope,sans-serif; line-height:1.1; }
.machine-active-order.has-order { border-color:#31594d; background:#10211d; }
.machine-active-order.has-order span { color:#72a997; }
.machine-active-order.has-order strong { color:var(--accent); }
button.machine-active-order { appearance:none; cursor:pointer; font:inherit; transition:border-color .2s,background .2s,transform .2s; }
button.machine-active-order:hover { border-color:var(--accent); background:#173128; transform:translateY(-1px); }
button.machine-active-order:focus-visible { border-color:var(--accent); outline:2px solid #66e1b23d; outline-offset:3px; }
.machine-state { width:9px; height:9px; border-radius:50%; background:var(--machine-color,#53606b); opacity:.45; }
.machine-state.active { background:var(--machine-color,var(--accent)); box-shadow:0 0 0 5px color-mix(in srgb,var(--machine-color,var(--accent)) 15%,transparent); opacity:1; }
.machine-metric strong { font-size:var(--machine-primary-size); letter-spacing:-.07em; }
.machine-metric span { color:var(--muted); font-size:var(--machine-detail-size); margin-left:6px; }
.machine-square-meters { display:flex; align-items:baseline; gap:5px; margin-top:2px; color:#aeb9c2; }
.machine-square-meters strong { font-size:clamp(12px,calc(var(--machine-detail-size) + 3px),19px); letter-spacing:-.03em; }
.machine-square-meters span { color:var(--muted); font:clamp(8px,calc(var(--machine-detail-size) - 2px),14px) 'DM Mono',monospace; }
.sparkline { display:block; width:100%; height:var(--machine-sparkline-height); margin:10px 0 6px; overflow:visible; }
.sparkline polyline { fill:none; stroke:var(--spark); stroke-width:2; vector-effect:non-scaling-stroke; opacity:.85; }
.sparkline.chart-updated polyline { animation:draw-line 5s ease-out both; }
.machine-activity { display:flex; align-items:center; justify-content:space-between; color:var(--muted); font:clamp(8px,calc(var(--machine-detail-size) - 2px),14px) 'DM Mono',monospace; }
.machine-activity span:last-child { font-family:Manrope,sans-serif; font-weight:600; }
.machine-card.is-active .machine-activity span:last-child { color:var(--accent); }
.machine-details { border-top:1px solid var(--line); margin-top:14px; padding-top:12px; display:flex; justify-content:space-between; color:var(--muted); font-size:var(--machine-detail-size); }
.machine-details b { color:var(--text); font-weight:600; }
.sensor-card { position:relative; display:flex; height:100%; flex-direction:column; overflow:hidden; padding:22px; }
.sensor-card .machine-title { margin-bottom:4px; }
.sensor-card .machine-title h3 { margin-top:2px; font-size:19px; }
.sensor-card .machine-area { margin-top:3px; }
.sensor-title-status { display:flex; align-items:center; gap:13px; }
.sensor-measurement-status { padding:5px 9px; border:1px solid currentColor; border-radius:999px; font:700 9px 'DM Mono',monospace; letter-spacing:.08em; text-transform:uppercase; }
.sensor-measurement-status[hidden] { display:none; }
.sensor-measurement-status.is-ok { background:#10251e; color:var(--accent); }
.sensor-measurement-status.is-elevated { background:#2a2113; color:var(--amber); }
.sensor-measurement-status.is-warning { background:#2b1519; color:var(--danger); }
.sensor-card.is-live { border-color:#2c5047; }
.sensor-card.is-history { border-color:#35556d; }
.sensor-card.is-stale { border-color:#6b5634; }
.sensor-card.is-error { border-color:#67363a; }
.sensor-card.is-empty { border-color:#3b4650; }
.sensor-card.is-unconfigured { border-color:#3b4650; background:linear-gradient(140deg,#151b22,#10151b); }
.sensor-card .machine-state { --machine-color:#66e1b2; }
.sensor-card.is-history .machine-state { --machine-color:#72b7e8; }
.sensor-card.is-stale .machine-state { --machine-color:#ffc46b; }
.sensor-card.is-error .machine-state { --machine-color:#ff6b70; }
.sensor-card.is-unconfigured .machine-state { --machine-color:#71808b; }
.sensor-metric { display:flex; align-items:baseline; gap:7px; margin-top:auto; }
.sensor-metric strong { font-size:43px; line-height:1; letter-spacing:-.065em; }
.sensor-metric span { color:var(--muted); font-size:13px; }
.dashboard-grid .grid-stack-item .sensor-metric .sensor-change { position:absolute; z-index:20; top:50%; right:18px; max-width:calc(100% - 36px); margin:0; padding:6px 11px; overflow:hidden; opacity:0; transform:translateY(-145%) scale(.96); border:1px solid #66e1b288; border-radius:10px; background:#10231dee; box-shadow:0 8px 28px #0008,0 0 24px #66e1b244; color:var(--accent); font:700 clamp(17px,2vw,28px) Manrope,sans-serif; letter-spacing:-.04em; line-height:1; pointer-events:none; text-overflow:ellipsis; white-space:nowrap; }
.dashboard-grid .grid-stack-item .sensor-metric .sensor-change.decreasing { border-color:#ff6b7388; background:#2b1519ee; box-shadow:0 8px 28px #0008,0 0 24px #ff6b7344; color:var(--danger); }
.dashboard-grid .grid-stack-item .sensor-metric .sensor-change.steady { border-color:#3b4650; background:#151c23cc; color:#87949e; }
.dashboard-grid .grid-stack-item .sensor-metric .sensor-change.is-animating { animation:sensor-change-rise 10s cubic-bezier(.2,.75,.2,1) forwards; }
.dashboard-grid .grid-stack-item .sensor-metric .sensor-change[hidden] { display:none; }
@keyframes sensor-change-rise { 0%{opacity:0;transform:translateY(-35%) scale(.82)} 3%{opacity:1;transform:translateY(-75%) scale(1.05)} 12%{opacity:1;transform:translateY(-100%) scale(1)} 85%{opacity:1;transform:translateY(-100%) scale(1)} 100%{opacity:0;transform:translateY(-145%) scale(.96)} }
.sensor-chart { display:flex; min-height:38px; flex:1; align-items:center; margin:6px 0 4px; }
.sensor-chart svg { display:block; width:100%; height:42px; overflow:visible; }
.sensor-chart polyline { fill:none; stroke:#66e1b2; stroke-width:2; vector-effect:non-scaling-stroke; }
.sensor-chart svg.chart-updated polyline { animation:draw-line 5s ease-out both; }
.sensor-chart line { stroke:#263540; stroke-width:1; vector-effect:non-scaling-stroke; }
.sensor-details { display:flex; justify-content:space-between; gap:12px; border-top:1px solid var(--line); padding-top:8px; color:var(--muted); font-size:10px; }
.sensor-details time { white-space:nowrap; }
.shift-comparison-card { display:flex; flex-direction:column; }
.shift-comparison-card .machine-title { margin-bottom:12px; }
.machine-shift-comparison { display:grid; grid-template-columns:1fr; min-height:0; }
.machine-shift-column { display:grid; min-width:0; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); align-items:center; gap:6px 12px; padding:4px 0 13px; }
.machine-shift-column.current { border-top:1px solid #34414d; padding:13px 0 2px; }
.machine-shift-head { display:flex; align-items:center; justify-content:space-between; gap:6px; grid-column:1/-1; color:var(--muted); font:500 clamp(8px,calc(var(--machine-detail-size) - 3px),13px) 'DM Mono',monospace; letter-spacing:.12em; }
.machine-shift-head small { color:#65727e; font:clamp(8px,calc(var(--machine-detail-size) - 4px),12px) 'DM Mono',monospace; letter-spacing:0; }
.machine-shift-column.current .machine-shift-head span,.machine-shift-column.current .machine-shift-head small { color:var(--accent); }
.machine-shift-values { display:flex; min-width:0; flex-direction:column; gap:1px; }
.machine-shift-metric { display:flex; min-width:0; align-items:baseline; gap:5px; }
.machine-shift-metric strong { overflow:hidden; font-size:var(--machine-primary-size); letter-spacing:-.065em; text-overflow:ellipsis; }
.machine-shift-metric span { color:var(--muted); font:clamp(8px,calc(var(--machine-detail-size) - 2px),14px) 'DM Mono',monospace; }
.machine-shift-secondary { overflow:hidden; color:#aeb9c2; font:clamp(8px,calc(var(--machine-detail-size) - 2px),14px) 'DM Mono',monospace; text-overflow:ellipsis; white-space:nowrap; }
.machine-shift-footer { display:flex; min-width:0; flex-direction:column; align-items:flex-end; gap:2px; color:var(--muted); font-size:clamp(8px,calc(var(--machine-detail-size) - 3px),13px); text-align:right; }
.machine-shift-footer b { overflow:hidden; color:var(--text); font-size:clamp(8px,calc(var(--machine-detail-size) - 2px),14px); font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.shift-comparison-card .sparkline { height:var(--machine-sparkline-height); margin:10px 0 4px; }
.shift-rolls { white-space:nowrap; }
.shift-rolls i { color:#56636f; font-style:normal; padding:0 3px; }
.empty { grid-column:1/-1; border:1px dashed var(--line); border-radius:18px; padding:50px; text-align:center; color:var(--muted); }
.notice { margin-top:20px; color:var(--amber); border:1px solid #5e492a; background:#211b10; border-radius:12px; padding:14px 16px; font-size:13px; }
.notice button { margin-left:12px; border:1px solid #896b36; border-radius:8px; background:#30230f; color:#ffd07a; cursor:pointer; padding:7px 10px; font:inherit; font-weight:700; }
footer { color:#68737e; font:11px 'DM Mono',monospace; margin-top:42px; text-align:center; }
.snapshot-warmup-status { display:inline-flex; align-items:center; gap:7px; min-height:34px; padding:0 11px; border:1px solid color-mix(in srgb,var(--accent) 35%,transparent); border-radius:999px; background:color-mix(in srgb,var(--accent) 10%,transparent); color:var(--accent); font:10px 'DM Mono',monospace; white-space:nowrap; }
.snapshot-warmup-status::before { width:7px; height:7px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; content:''; animation:snapshot-warmup-spin .8s linear infinite; }
.snapshot-warmup-status[hidden] { display:none; }
@keyframes snapshot-warmup-spin { to { transform:rotate(360deg); } }
.report-open { overflow:hidden; }
.report-overlay { position:fixed; z-index:200; inset:0; display:grid; place-items:center; padding:28px; background:#05080cd9; backdrop-filter:blur(12px); }
.report-overlay[hidden] { display:none; }
.report-dialog { display:flex; width:min(1180px,100%); max-height:min(900px,calc(100vh - 56px)); flex-direction:column; overflow:hidden; border:1px solid #397b68; border-radius:24px; background:linear-gradient(145deg,#131e26,#0d141b); box-shadow:0 28px 100px #000d,0 0 0 1px #66e1b21c; }
.report-head { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; padding:26px 30px 22px; border-bottom:1px solid var(--line); background:linear-gradient(120deg,#16372d,#12232a); }
.report-head h2 { font-size:clamp(26px,4vw,42px); }
.report-period { margin:10px 0 0; color:#b9c8cd; font:12px 'DM Mono',monospace; }
.report-actions { display:flex; align-items:center; gap:10px; }
.report-pdf-button { display:inline-flex; min-height:42px; align-items:center; justify-content:center; padding:0 16px; border:1px solid #9ddbc5; border-radius:12px; background:#f5fbf8; color:#123c30; text-decoration:none; font-size:12px; font-weight:800; }
.report-pdf-button::before { content:'↓'; margin-right:8px; font:18px/1 'DM Mono',monospace; }
.report-pdf-button:hover,.report-pdf-button:focus-visible { border-color:#fff; background:#fff; outline:2px solid #66e1b244; outline-offset:2px; }
.report-pdf-button:not([href]) { pointer-events:none; opacity:.45; }
.report-close { flex:0 0 auto; width:42px; height:42px; border:1px solid #4c7568; border-radius:12px; background:#10231f99; color:var(--text); cursor:pointer; font:28px/1 Manrope,sans-serif; }
.report-close:hover,.report-close:focus-visible { border-color:var(--accent); color:var(--accent); outline:2px solid #66e1b233; outline-offset:2px; }
.report-content { min-height:0; overflow:auto; padding:24px 30px 32px; }
.report-loading,.report-empty { color:var(--muted); }
.report-warning { display:flex; gap:12px; align-items:flex-start; margin-bottom:20px; padding:13px 15px; border:1px solid #74582e; border-radius:13px; background:#261e11; color:#ffd07a; }
.report-warning strong { flex:0 0 auto; }
.report-warning span { color:#c9a86c; }
.report-kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:30px; }
.report-kpis article { display:flex; min-height:120px; flex-direction:column; justify-content:space-between; padding:18px; border:1px solid var(--line); border-radius:16px; background:#0e171e; }
.report-kpis span,.report-quality-card span { color:var(--muted); font-size:11px; }
.report-kpis strong { color:var(--accent); font-size:30px; letter-spacing:-.06em; }
.report-kpis small,.report-quality-card small,.report-muted { color:#71808b; font:10px 'DM Mono',monospace; }
.report-section-head { display:flex; align-items:end; justify-content:space-between; gap:18px; margin:26px 0 12px; }
.report-section-head .eyebrow { margin-bottom:5px; }
.report-section-head h3 { margin:0; font-size:19px; }
.report-quality { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.report-quality-card { display:flex; min-height:100px; flex-direction:column; justify-content:space-between; padding:15px; border:1px solid var(--line); border-radius:13px; background:#0e151c; }
.report-quality-card strong { font-size:23px; }
.report-quality-card.waste { border-color:#7b3941; background:#24151a; }
.report-quality-card.waste strong,.report-deviation.waste,.report-order-deviation.waste { color:var(--danger); }
.report-quality-card.investigation { border-color:#76602f; background:#251f13; }
.report-quality-card.investigation strong,.report-deviation.investigation,.report-order-deviation.investigation { color:var(--amber); }
.report-process-label { display:flex; justify-content:space-between; margin:18px 2px 8px; color:var(--accent); font:10px 'DM Mono',monospace; letter-spacing:.14em; }
.report-process-label span { color:#71808b; letter-spacing:0; }
.report-process-summary { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.report-process-card { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:15px 17px; border:1px solid var(--line); border-radius:13px; background:linear-gradient(135deg,#101c23,#0c151b); }
.report-process-card > span { color:#c8d5d9; font-size:13px; font-weight:750; }
.report-process-card div { display:flex; align-items:baseline; gap:13px; text-align:right; }
.report-process-card strong { color:var(--accent); font-size:20px; }
.report-process-card small { color:#829099; font:10px 'DM Mono',monospace; }
.report-orders { display:grid; gap:12px; }
.report-order { padding:18px; border:1px solid var(--line); border-radius:16px; background:#0e151c; }
.report-order-main { display:flex; align-items:flex-start; justify-content:space-between; gap:15px; }
.report-order-number { color:var(--accent); font:11px 'DM Mono',monospace; }
.report-order h3 { margin:5px 0 0; font-size:17px; }
.report-status { padding:5px 9px; border:1px solid #3b4a53; border-radius:99px; color:#b8c4ca; font:10px 'DM Mono',monospace; }
.report-status.pending { border-color:#ff5b62; color:#fff; background:#b92931; }
.report-status.approved { border-color:#ffeb3b; color:#fff3a3; background:#594f09; }
.report-status.active { border-color:#48c90f; color:#b8ff9a; background:#183f0b; }
.report-status.completed { border-color:#aaa; color:#e2e2e2; background:#4b4f52; }
.report-status.delivered { border-color:#777; color:#eee; background:#303336; }
.report-order-meta { display:flex; flex-wrap:wrap; gap:7px 22px; margin:16px 0; color:var(--muted); font:10px 'DM Mono',monospace; }
.report-order-meta b { color:var(--text); font-weight:500; }
.report-order-barrier { flex:1 0 100%; display:grid; gap:3px; padding-top:5px; border-top:1px solid var(--line); }
.report-order-barrier > span { color:var(--accent); font-weight:700; }
.report-order-barrier b,.report-order-barrier small { display:block; }
.report-order-barrier small { color:var(--muted); }
.report-order-deviation { font-weight:500; }
.report-order-deviation.waste b { color:var(--danger); }
.report-order-deviation.investigation b { color:var(--amber); }
.report-machines { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:8px; }
.report-machine-cell { display:flex; min-width:0; flex-direction:column; gap:4px; padding:12px; border-top:1px solid #2a3741; background:#101920; }
.report-machine-cell strong { font-size:12px; }
.report-machine-quantity { color:#d9e5e8; font:12px 'DM Mono',monospace; }
.report-speed-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-top:3px; }
.report-speed-grid span { display:flex; min-width:0; flex-direction:column; gap:3px; }
.report-speed-grid small { color:#71808b; font:8px 'DM Mono',monospace; white-space:nowrap; }
.report-speed-grid b { overflow:hidden; color:#d9e5e8; font:11px 'DM Mono',monospace; text-overflow:ellipsis; white-space:nowrap; }
.report-speed-grid b.negative { color:var(--danger); }
.report-speed-grid b.positive { color:var(--accent); }
.report-machine-cell small { color:var(--muted); font:9px 'DM Mono',monospace; }
.report-machine-average { color:var(--muted); font:9px 'DM Mono',monospace; }
.report-machine-average b { color:var(--text); font-weight:600; }
.report-machine-cell .report-deviation { color:var(--danger); overflow-wrap:anywhere; }
.report-machine-cell .report-deviation.investigation { color:var(--amber); }

.dashboard-grid { margin:47px -7px 0; }
.dashboard-grid > .grid-stack-item { --widget-scale:1; }
.dashboard-grid > .grid-stack-item.widget-hidden { display:none!important; }
.dashboard-grid { opacity:1; transition:opacity .15s ease; }
.dashboard-grid.dashboard-page-switching { opacity:0; }
.dashboard-grid > .grid-stack-item > .grid-stack-item-content { overflow:hidden; transition:outline-color .2s,box-shadow .2s; }
.dashboard-grid .summary-card,.dashboard-grid .panel,.dashboard-grid .machine-card,.dashboard-grid .sensor-card { cursor:zoom-in; transition:border-color .25s,box-shadow .25s,transform .25s; }
.dashboard-grid .summary-card:hover,.dashboard-grid .panel:hover,.dashboard-grid .machine-card:hover,.dashboard-grid .sensor-card:hover { transform:translateY(-2px); box-shadow:0 12px 30px #0005; }
.card-focus-open .rotation-stage { overflow:hidden; }
.card-focus-backdrop { position:fixed; z-index:1000; inset:0; display:flex; align-items:flex-end; justify-content:center; border:0; background:#05090dcc; color:#91a09f; cursor:zoom-out; font:500 10px 'DM Mono',monospace; letter-spacing:.04em; padding:0 18px 16px; backdrop-filter:blur(8px); }
.dashboard-grid > .grid-stack-item.card-focused { z-index:1001!important; cursor:zoom-out; outline:none; transform:translate(var(--card-focus-x),var(--card-focus-y)) scale(var(--card-focus-scale))!important; transform-origin:top left; transition:transform .34s cubic-bezier(.2,.8,.2,1)!important; }
.dashboard-grid > .grid-stack-item.card-focused > .grid-stack-item-content { box-shadow:0 28px 90px #000e,0 0 0 1px color-mix(in srgb,var(--accent) 58%,transparent); }
.dashboard-grid > .grid-stack-item.card-focused .summary-card,.dashboard-grid > .grid-stack-item.card-focused .panel,.dashboard-grid > .grid-stack-item.card-focused .machine-card,.dashboard-grid > .grid-stack-item.card-focused .sensor-card { cursor:zoom-out; transform:none; box-shadow:none; }
.dashboard-grid .summary-card,.dashboard-grid .panel,.dashboard-grid .machine-card,.dashboard-grid .sensor-card,.dashboard-grid .section-head { width:100%; height:100%; margin:0; }
.dashboard-grid .summary-card { min-height:0; }
.dashboard-grid .panel { display:flex; flex-direction:column; }
.dashboard-grid .production-chart { min-height:0; flex:1; display:flex; align-items:stretch; }
.dashboard-grid .production-chart svg { width:100%; height:100%; max-height:none; }
.dashboard-grid .hourly-panel .hourly-bars { min-height:0; height:auto; flex:1; }
.dashboard-grid .feed-panel .activity-feed { min-height:0; flex:1; overflow:hidden; }
.dashboard-grid .shift-panel { overflow:auto; }
.dashboard-grid .shift-panel.history-shifts { padding:12px 16px; }
.dashboard-grid .shift-panel.history-shifts .panel-head h2 { font-size:22px; }
.dashboard-grid .shift-panel.history-shifts .history-shift-grid { grid-template-columns:1fr; gap:6px; margin-top:6px; }
.dashboard-grid .shift-panel.history-shifts .history-shift { padding:8px 10px; }
.dashboard-grid .shift-panel.history-shifts .history-shift .eyebrow { margin-bottom:3px; }
.dashboard-grid .shift-panel.history-shifts .history-shift-stats { gap:5px; margin:7px 0 6px; }
.dashboard-grid .shift-panel.history-shifts .history-shift-stats strong { font-size:14px; }
.dashboard-grid .shift-panel.history-shifts .shift-operators { gap:3px; padding-top:7px; }
.dashboard-grid .shift-panel.history-shifts .shift-operators strong { font-size:10px; line-height:1.25; }
.dashboard-grid .chart-panel { min-height:0; }
.dashboard-grid .machine-card { display:flex; min-height:0; flex-direction:column; overflow:hidden; }
.dashboard-grid .machine-widget .machine-title { flex:0 0 auto; }
.dashboard-grid .machine-widget .machine-metric { flex:0 0 auto; }
.dashboard-grid .machine-widget .machine-square-meters { flex:0 0 auto; }
.dashboard-grid .machine-widget .machine-shift-comparison { min-height:0; flex:1 1 auto; align-content:stretch; }
.dashboard-grid .machine-widget .machine-activity { flex:0 0 auto; }
.dashboard-grid .machine-widget .machine-details { flex:0 0 auto; }
.dashboard-grid .machine-widget .sparkline { min-height:calc(24px * var(--widget-scale,1)); flex:1 1 auto; height:auto; }
.dashboard-grid .machine-widget .machine-card.shift-comparison-card .sparkline { min-height:calc(20px * var(--widget-scale,1)); flex:0 1 auto; }
.dashboard-grid .quality-panel .quality-grid { min-height:0; flex:1 1 auto; align-content:stretch; }
.dashboard-grid .width-waste-panel .width-waste-content { min-height:0; flex:1 1 auto; align-content:stretch; }
.dashboard-grid .machine-widget[data-auto-expanded-from] { height:calc(5 * var(--gs-cell-height))!important; transition:none!important; }
.dashboard-grid .section-head { padding:8px 10px; }
.dashboard-grid .quality-grid { min-height:0; }
.widget-drag-handle { position:absolute; z-index:9; bottom:7px; left:50%; display:none; width:46px; height:15px; border:1px solid #4d665e; border-radius:99px; background:#15231f; cursor:grab; transform:translateX(-50%); }
.widget-drag-handle::after { content:'•••'; position:absolute; inset:-6px 0 0; color:var(--accent); font:12px 'DM Mono',monospace; letter-spacing:3px; text-align:center; }
.widget-drag-handle:active { cursor:grabbing; }
.layout-editing .dashboard-grid { border-radius:22px; background-image:radial-gradient(circle,#30433d 1px,transparent 1px); background-size:20px 20px; box-shadow:0 0 0 12px #66e1b208; }
.layout-editing .dashboard-grid > .grid-stack-item > .grid-stack-item-content { outline:1px dashed #66e1b280; outline-offset:-2px; box-shadow:0 8px 28px #0005; }
.layout-editing .widget-drag-handle { display:block; }
.widget-actions { position:absolute; z-index:8; top:8px; right:8px; display:none; gap:5px; }
.layout-editing .widget-actions { display:flex; }
.widget-actions button { min-height:29px; padding:0 8px; border:1px solid #3a6659; border-radius:8px; background:#10231fee; color:var(--accent); cursor:pointer; font:500 8px 'DM Mono',monospace; }
.widget-actions .widget-hide-button { border-color:#6f5833; color:var(--amber); }
.widget-actions button:hover,.widget-actions button:focus-visible { border-color:currentColor; background:#18362d; outline:2px solid #66e1b233; outline-offset:2px; }
.layout-editing .grid-stack-item.ui-draggable-dragging > .grid-stack-item-content { box-shadow:0 18px 48px #000a,0 0 0 1px var(--accent); }
.layout-editing .ui-resizable-handle { opacity:1; }
.grid-stack-placeholder > .placeholder-content { border:1px dashed var(--accent); border-radius:18px; background:#66e1b218; }
.machine-widget .grid-stack-item-content { border-radius:18px; }
.solar-widget .grid-stack-item-content { border-radius:18px; }
.solar-widget .sensor-details [data-sensor-range] { line-height:1.55; }
.solar-card .sensor-metric { margin-bottom:4px; }
.solar-card .sensor-metric > strong { font-size:clamp(32px, 5vw, 64px); }
.solar-heading { color:var(--muted); font-size:calc(var(--widget-detail-size) * var(--widget-scale,1)); font-weight:600; letter-spacing:.03em; margin-top:2px; }
.solar-yield { display:flex; flex-direction:column; align-items:flex-start; gap:0; margin-top:5px; color:var(--muted); }
.solar-yield .solar-heading { margin-top:0; }
.solar-yield-value { display:flex; align-items:baseline; gap:9px; }
.solar-yield strong { color:var(--text); font-size:clamp(22px, 3vw, 38px); }
.solar-yield span { font-size:calc(var(--widget-detail-size) * var(--widget-scale,1)); }

.dashboard-grid .grid-stack-item .summary-card,
.dashboard-grid .grid-stack-item .panel,
.dashboard-grid .grid-stack-item .machine-card,
.dashboard-grid .grid-stack-item .sensor-card,
.dashboard-grid .grid-stack-item .section-head { padding:calc(var(--widget-padding) * var(--widget-scale,1)); }
.dashboard-grid .grid-stack-item .summary-card .label,
.dashboard-grid .grid-stack-item .panel-head h2,
.dashboard-grid .grid-stack-item .machine-title h3,
.dashboard-grid .grid-stack-item .section-head h2 { font-size:calc(var(--widget-title-size) * var(--widget-scale,1)); }
.dashboard-grid .grid-stack-item .summary-card .label { color:var(--text); font-weight:700; }
.dashboard-grid .grid-stack-item .summary-card > strong,
.dashboard-grid .grid-stack-item .machine-metric > strong,
.dashboard-grid .grid-stack-item .machine-shift-metric strong,
.dashboard-grid .grid-stack-item .sensor-metric > strong,
.dashboard-grid .grid-stack-item .quality-grid strong,
.dashboard-grid .grid-stack-item .performance-stats strong { font-size:calc(var(--widget-primary-size) * var(--widget-scale,1)); }
.dashboard-grid .grid-stack-item .quality-name { font-size:calc(12px * var(--widget-scale,1)); }
.dashboard-grid .grid-stack-item .summary-card .unit,
.dashboard-grid .grid-stack-item .machine-area,
.dashboard-grid .grid-stack-item .machine-details,
.dashboard-grid .grid-stack-item .machine-metric span,
.dashboard-grid .grid-stack-item .machine-activity,
.dashboard-grid .grid-stack-item .sensor-details,
.dashboard-grid .grid-stack-item .sensor-metric span,
.dashboard-grid .grid-stack-item .quality-grid small,
.dashboard-grid .grid-stack-item .panel-note { font-size:calc(var(--widget-detail-size) * var(--widget-scale,1)); }
.dashboard-grid .machine-widget .sparkline { height:calc(var(--widget-visual-height) * var(--widget-scale,1)); }
.dashboard-grid .sensor-widget .sensor-chart svg { height:calc(var(--widget-visual-height) * var(--widget-scale,1)); }
.dashboard-grid [data-widget-id="chart-production"] .production-chart { min-height:0; height:auto; max-height:none; flex:1 1 auto; }
.dashboard-grid [data-widget-id="hourly-production"] .hourly-bars { height:calc(var(--widget-visual-height) * var(--widget-scale,1)); flex:none; }

@container dashboard-viewport (max-width:899px) {
  .layout-controls { display:flex; margin-left:0; }
  .dashboard-settings-menu > :not(.dashboard-settings-title):not(.rotation-toggle):not(.report-email-settings) { display:none!important; }
  .widget-actions,.card-settings-panel { display:none!important; }
  .machine-card { padding:min(calc(var(--widget-padding) * var(--widget-scale,1)),22px); }
  .machine-title h3 { font-size:min(calc(var(--widget-title-size) * var(--widget-scale,1)),22px); }
  .machine-metric strong,.machine-shift-metric strong { font-size:min(calc(var(--widget-primary-size) * var(--widget-scale,1)),48px); }
  .machine-details,.machine-metric span { font-size:min(calc(var(--widget-detail-size) * var(--widget-scale,1)),13px); }
  .sparkline,.shift-comparison-card .sparkline { height:min(calc(var(--widget-visual-height) * var(--widget-scale,1)),64px); }
  .dashboard-grid { margin-top:36px; }
  .dashboard-grid .chart-legend { display:none; }
  .dashboard-grid .quality-grid { grid-template-columns:1fr 1fr; }
  .dashboard-grid .history-shift-grid { grid-template-columns:1fr; }
}
@container dashboard-viewport (max-width:899px) { .live-grid,.detail-grid{grid-template-columns:1fr}.shift-panel{display:grid;grid-template-columns:1fr 180px 1fr;gap:18px;align-items:center}.shift-panel .panel-head{grid-column:1/-1}.shift-progress-wrap{grid-column:2;grid-row:2/5}.shift-times,.shift-stats,.shift-operators{grid-column:1}.machine-grid{grid-template-columns:repeat(2,1fr)} }
@container dashboard-viewport (max-width:800px) { .shell{padding:30px 18px}.topbar{display:block}.status-pill{display:inline-flex;margin-top:24px}.summary-grid{grid-template-columns:repeat(2,1fr);margin:38px 0 22px}.machine-grid{grid-template-columns:1fr}.chart-legend{display:none}.shift-panel{display:block}.hourly-bars{height:250px;gap:2px}.bar-value{display:none}.detail-grid{margin-bottom:14px}.history-controls{flex-wrap:wrap}.history-bootstrap{grid-template-columns:1fr}.history-bootstrap-progress{order:3}.history-bootstrap-actions{justify-content:flex-start}.history-shift-grid{grid-template-columns:1fr}.quality-panel{margin-bottom:50px}.quality-grid{grid-template-columns:1fr 1fr} }
@container dashboard-viewport (max-width:800px) { .width-waste-content{grid-template-columns:repeat(2,minmax(0,1fr))} }
@container dashboard-viewport (max-width:520px) { .summary-grid{grid-template-columns:1fr 1fr}.summary-card{min-height:130px;padding:17px}.summary-card strong{font-size:31px}.panel{padding:18px}.hourly-bars{height:170px}.date-chip{font-size:10px}.history-controls label{order:-1;width:100%}.history-controls input{width:100%}.history-controls>button{flex:1}.period-switch,.metric-switch{width:100%}.period-switch button,.period-switch select,.metric-switch button{flex:1;min-width:0}.history-shift-stats strong{font-size:18px} }
@media (max-width:620px) {
  .order-rolls-panel { inset:12px; width:auto; max-height:none; padding:18px; transform:none; border-radius:16px; }
  .order-rolls-summary { grid-template-columns:1fr 1fr; }
  .order-roll { grid-template-columns:1fr; }
  .order-roll-values { justify-content:space-between; }
  .order-roll-operator { grid-column:auto; }
  .run-list-overlay { padding:0; }
  .run-list-panel { width:100%; max-height:100vh; min-height:100vh; border-width:0; border-radius:0; }
  .run-list-head { padding:18px; }
  .run-list-head h2 { font-size:28px; }
  .run-list-actions #run-list-refresh { width:38px; overflow:hidden; padding:0; font-size:0; }
  .run-list-actions #run-list-refresh::before { content:'↻'; font-size:18px; }
  .run-list-content { padding:16px 14px 22px; }
  .run-list-summary { grid-template-columns:repeat(3,1fr); }
  .run-list-summary article { padding:12px; }
  .run-list-summary strong { font-size:24px; }
  .run-list-order-head { grid-template-columns:48px minmax(0,1fr); }
  .run-list-order-head .run-list-finished { grid-column:2; justify-self:start; }
  .run-list-order-details { grid-template-columns:repeat(2,minmax(0,1fr)); margin-left:0; }
  .run-list-detail.wide { grid-column:1/-1; }
  .run-list-information { grid-template-columns:48px minmax(0,1fr); }
  .run-list-config-overlay { padding:0; }
  .run-list-config-panel { width:100%; min-height:100vh; border-width:0; border-radius:0; }
  .run-list-config-head { padding:20px 18px; }
  .run-list-config-head h2 { font-size:26px; }
  .run-list-config-form { padding:20px 18px; }
  .run-list-config-actions { display:grid; grid-template-columns:1fr 1fr; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
}

.presentation-controls { position:fixed; z-index:90; left:50%; bottom:18px; display:flex; width:min(760px,calc(100% - 36px)); min-height:54px; align-items:center; gap:9px; padding:8px 10px; transform:translateX(-50%); border:1px solid #397b68; border-radius:15px; background:#0d151cf2; box-shadow:0 18px 52px #000a; opacity:1; backdrop-filter:blur(14px); transition:opacity .25s ease; }
.presentation-controls[hidden] { display:none; }
.presentation-controls.presentation-controls-hidden { opacity:0; pointer-events:none; }
.presentation-controls button { min-height:36px; padding:0 12px; border:1px solid var(--line); border-radius:9px; background:#111b22; color:#bdc9ce; cursor:pointer; font:10px 'DM Mono',monospace; }
.presentation-controls button:hover,.presentation-controls button:focus-visible { border-color:#397b68; color:var(--accent); outline:none; }
.presentation-page-copy { display:grid; min-width:125px; gap:2px; }
.presentation-page-copy strong { overflow:hidden; color:var(--text); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.presentation-page-copy span,.presentation-controls > span { color:var(--muted); font:9px 'DM Mono',monospace; }
.presentation-progress { height:5px; min-width:80px; flex:1; overflow:hidden; border-radius:99px; background:#26323a; }
.presentation-progress i { display:block; width:0; height:100%; border-radius:inherit; background:var(--accent); transition:width .25s linear; }
.dashboard-page-navigation[hidden] { display:none!important; }
html:fullscreen .dashboard-page-navigation { display:none!important; }
.presentation-mode .topbar,.presentation-mode .history-controls,.presentation-mode .dashboard-page-navigation,.presentation-mode .history-bootstrap,.presentation-mode footer,.presentation-mode .card-settings-panel { display:none!important; }
.presentation-mode .shell { padding-top:24px; padding-bottom:94px; }
.presentation-mode .dashboard-grid { margin-top:28px; }
.presentation-mode .widget-actions { display:none!important; }

@media (max-width:700px) {
  .presentation-controls { right:12px; bottom:12px; left:12px; width:auto; transform:none; }
  .presentation-progress { display:none; }
  .presentation-page-copy { min-width:0; flex:1; }
}
@container dashboard-viewport (max-width:700px) {
  .report-overlay { padding:0; }
  .report-dialog { max-height:100vh; border-radius:0; border-width:0; }
  .report-head,.report-content { padding-left:18px; padding-right:18px; }
  .report-head { gap:10px; }
  .report-actions { gap:6px; }
  .report-pdf-button { min-height:38px; padding:0 10px; font-size:10px; }
  .report-close { width:38px; height:38px; }
  .report-kpis,.report-quality,.report-process-summary { grid-template-columns:1fr; }
  .report-process-card { align-items:flex-start; flex-direction:column; }
  .report-section-head { align-items:flex-start; flex-direction:column; gap:6px; }
  .report-order-meta { display:grid; grid-template-columns:1fr 1fr; }
  .report-machines { grid-template-columns:1fr; }
  .report-warning { flex-direction:column; gap:4px; }
}