@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("/fonts/manrope-latin.woff2") format("woff2");
}

html.vynor-next-booting body > main,
html.vynor-next-ready body > main,
html.vynor-next-failed body > main { display: none !important; }
body { margin: 0 !important; background: var(--os-canvas, #f8fafc) !important; color: var(--os-text, #111827) !important; font-family: "Manrope", "Segoe UI", Arial, sans-serif !important; }
#vynorNextApp {
  --os-layer-content: 1; --os-layer-chrome: 700; --os-layer-popover: 1600; --os-layer-backdrop: 1800; --os-layer-drawer: 1801; --os-layer-modal: 1900; --os-layer-nested-backdrop: 2000; --os-layer-nested-modal: 2001;
  --os-canvas: #f8fafc; --os-surface: #ffffff; --os-surface-raised: #fbfcfe; --os-surface-hover: #f1f5f9; --os-control: #ffffff;
  --os-text: #111827; --os-text-strong: #162033; --os-text-muted: #64748b; --os-border: #e1e6ef; --os-border-strong: #cfd6e3;
  --os-shadow: 0 12px 28px rgba(15,23,42,.08); --os-overlay: rgba(15,23,42,.28); --os-accent: #D6A84A; --os-accent-hover: #E5C06B; --os-accent-soft: #F8EDCF;
  min-height: 100vh; display: grid; grid-template-columns: 280px minmax(0, 1fr); background: var(--os-canvas); color: var(--os-text); overflow: visible; isolation: isolate;
}
#vynorNextApp[data-os-density="compact"] .os-page { gap: 11px; padding-top: 13px; padding-bottom: 18px; }
#vynorNextApp[data-os-density="compact"] .os-sidebar { gap: 15px; padding-top: 18px; padding-bottom: 18px; }
#vynorNextApp[data-os-density="compact"] .os-nav { gap: 2px; }
#vynorNextApp[data-os-density="compact"] .os-nav button { min-height: 42px; }
#vynorNextApp[data-os-density="compact"] .os-panel-card,
#vynorNextApp[data-os-density="compact"] .os-stat-card { box-shadow: 0 5px 14px rgba(15,23,42,.03); }
#vynorNextApp[data-os-theme="dark"] {
  --os-canvas: #0b1220; --os-surface: #111b2c; --os-surface-raised: #152235; --os-surface-hover: #1b2b43; --os-control: #0d1727;
  --os-text: #e5edf7; --os-text-strong: #f4f8fc; --os-text-muted: #aebdd0; --os-border: #2a3950; --os-border-strong: #41536d;
  --os-shadow: 0 16px 34px rgba(0,0,0,.25); --os-overlay: rgba(2,6,15,.66);
  background: var(--os-canvas); color: var(--os-text);
}
#vynorNextApp[data-os-theme="dark"] .os-main,
#vynorNextApp[data-os-theme="dark"] .os-page { background: var(--os-canvas); }
#vynorNextApp[data-os-theme="dark"] .os-production-toolbar-search,
#vynorNextApp[data-os-theme="dark"] .os-production-select,
#vynorNextApp[data-os-theme="dark"] .os-production-filter,
#vynorNextApp[data-os-theme="dark"] .os-production-team-panel,
#vynorNextApp[data-os-theme="dark"] .os-production-popover { border-color: #2d3c52 !important; background: #111b2c !important; color: #e5edf7 !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-toolbar-search input,
#vynorNextApp[data-os-theme="dark"] .os-production-toolbar-search input::placeholder,
#vynorNextApp[data-os-theme="dark"] .os-production-select,
#vynorNextApp[data-os-theme="dark"] .os-production-filter,
#vynorNextApp[data-os-theme="dark"] .os-production-select svg,
#vynorNextApp[data-os-theme="dark"] .os-production-filter svg { color: #d8e2ef !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-column { border-color: #2a3950 !important; background: #111b2c !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-column.is-drag-over { border-color: #4c6586 !important; background: #16243a !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-column > header strong { color: #edf3fb !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-column > header em { background: #1c2b40 !important; color: #b9c7d8 !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-column > header span { box-shadow: inset 0 0 0 3px #24344a !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-task { border-color: #2a3950 !important; background: #16243a !important; box-shadow: 0 8px 20px rgba(0,0,0,.2) !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-task:hover { border-color: #49617f !important; background: #192a43 !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-task h3 { color: #f1f5f9 !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-task :is(.os-production-tag, footer, footer span, .os-production-add) { color: #aebdd0 !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-task-progress { background: #2a3950 !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-task header button { color: #aebdd0 !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-task header button:hover { background: #34202a !important; color: #fca5a5 !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-add { color: #b4c5d9 !important; }
#vynorNextApp .os-startup-failure { min-height: 100vh; display: grid; place-content: center; gap: 14px; color: var(--os-text-strong); text-align: center; background: var(--os-surface-hover); }
#vynorNextApp .os-startup-failure button { justify-self: center; border: 1px solid #cbd5e1; border-radius: 6px; padding: 9px 14px; color: var(--os-text-strong); background: var(--os-surface); font: inherit; cursor: pointer; }
#vynorNextApp svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.os-sidebar { position: fixed; top: 0; left: 0; z-index: var(--os-layer-chrome); box-sizing: border-box; width: 280px; height: 100vh; min-height: 100vh; display: grid; grid-template-rows: auto auto 1fr auto; gap: 22px; padding: 24px 20px; background: #011128; color: #fff; overflow-x: visible; overflow-y: auto; }
.os-sidebar:has(.os-account-list:not([hidden])) { z-index: var(--os-layer-modal); }
.os-logo { display: flex; align-items: center; min-height: 64px; }
.os-logo img { width: min(100%, 218px); height: 64px; display: block; object-fit: contain; object-position: center; border-radius: 0; }
.os-logo strong { color: #fff; font-size: 20px; font-weight: 800; line-height: 1; letter-spacing: 0; }
.os-accounts { position: relative; border: 1px solid rgba(255,255,255,.28); border-radius: 8px; overflow: visible; background: rgba(255,255,255,.04); }
.os-account-main, .os-account-list button, .os-nav button, .os-settings { width: 100%; border: 0; background: transparent; color: inherit; font: inherit; text-align: left; box-shadow: none !important; }
.os-account-main { min-height: 40px; display: grid; grid-template-columns: 20px minmax(0, 1fr) 16px; gap: 8px; align-items: center; padding: 8px 10px; }
.os-account-main { transition: background .16s ease, border-color .16s ease; }
.os-account-main:hover { background: rgba(255,255,255,.09); }
.os-account-main:hover svg { color: var(--os-accent-hover); }
.os-account-main svg { color: var(--os-accent); }
.os-account-chevron { display: grid; place-items: center; color: rgba(255,255,255,.7); font-size: 14px; line-height: 1; }
.os-account-main strong, .os-account-list strong { font-size: 13px; }
.os-account-list { position: fixed; left: 294px; top: 98px; z-index: var(--os-layer-popover); width: min(420px, calc(100vw - 318px)); min-height: 250px; max-height: min(520px, calc(100vh - 122px)); display: grid; grid-template-rows: auto auto auto minmax(0, 1fr); gap: 12px; padding: 16px; overflow-y: auto; border: 1px solid #d9dee8; border-radius: 8px; background: var(--os-surface); color: var(--os-text); box-shadow: 0 24px 60px rgba(15,23,42,.22); }
.os-account-list[hidden] { display: none; }
.os-account-search { height: 38px; display: grid; grid-template-columns: 18px 1fr; align-items: center; gap: 9px; padding: 0 12px; border: 1px solid #cfd6e3; border-radius: 6px; background: var(--os-surface); color: var(--os-text-muted); }
.os-account-search input { min-width: 0; border: 0; outline: 0; background: transparent; color: var(--os-text); font: inherit; }
.os-account-search input::placeholder { color: var(--os-text-muted); }
.os-account-heading { color: var(--os-text-muted); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.os-agency-link { width: fit-content !important; min-height: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: #0ea5e9 !important; font-size: 12px !important; font-weight: 800 !important; text-align: left !important; box-shadow: none !important; }
#vynorNextApp .os-account-list .os-agency-link,
#vynorNextApp .os-subaccount-list .os-agency-link { color: #0ea5e9 !important; background: transparent !important; border: 0 !important; }
.os-account-list button:not(.os-agency-link) { min-height: 48px; display: grid; grid-template-columns: 26px minmax(0, 1fr) 14px; align-items: center; gap: 9px; padding: 7px 9px; border: 1px solid #e1e6ef !important; border-radius: 6px; background: var(--os-surface) !important; color: var(--os-text) !important; }
.os-account-list button:not(.os-agency-link):hover { background: var(--os-surface-hover) !important; }
.os-account-list button.is-selected:not(.os-agency-link) { background: var(--os-surface-hover) !important; border-color: var(--os-text-muted) !important; }
.os-account-list button span:nth-child(2) { min-width: 0; }
.os-account-list button strong, .os-account-list button small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.os-account-list button small { margin-top: 2px; color: var(--os-text-muted); font-size: 11px; }
.os-account-list button i { min-height: 12px; display: grid; place-items: center; color: #38bdf8; font-style: normal; font-size: 17px; line-height: 1; text-align: center; }
.os-account-empty { padding: 10px; color: rgba(255,255,255,.58); font-size: 12px; line-height: 1.45; }
.os-avatar { width: 24px; height: 24px; display: inline-grid; place-items: center; border-radius: 999px; font-size: 11px; font-weight: 800; border: 1px solid currentColor; }
.os-avatar.agency { color: var(--os-accent); } .os-avatar.green { color: #22c55e; } .os-avatar.blue { color: #3b82f6; } .os-avatar.purple { color: #8b5cf6; } .os-avatar.pink { color: #ec4899; } .os-avatar.orange { color: #f97316; }
.os-nav { display: grid; align-content: start; gap: 5px; }
.os-nav button { min-height: 47px; display: grid; grid-template-columns: 26px 1fr; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 7px; color: rgba(255,255,255,.84); position: relative; }
.os-nav button.active { background: rgba(255,255,255,.08); color: #fff; }
.os-nav button.active::before { content: ""; position: absolute; left: -20px; top: 8px; bottom: 8px; width: 4px; border-radius: 999px; background: var(--os-accent); }
.os-nav strong { display: block; font-size: 14px; font-weight: 500; line-height: 1.18; letter-spacing: 0; } .os-nav small { display: block; color: rgba(255,255,255,.64); font-size: 11px; font-weight: 400; line-height: 1.18; margin-top: 2px; }
.os-settings { min-height: 46px; display: grid; grid-template-columns: 24px minmax(0, 1fr) 14px; align-items: center; gap: 10px; padding: 0 12px; margin-top: 8px; border-top: 1px solid rgba(255,255,255,.16); border-radius: 7px; font-size: 14px; font-weight: 500; line-height: 1; }
.os-settings svg { width: 18px !important; height: 18px !important; align-self: center; justify-self: center; }
.os-settings span { min-width: 0; display: block; align-self: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.15; }
.os-settings strong { display: grid; place-items: center; align-self: center; justify-self: end; width: 14px; color: rgba(255,255,255,.72); font-size: 16px; line-height: 1; }
.os-main { grid-column: 2; min-width: 0; display: grid; grid-template-rows: 76px 1fr; overflow: visible; }
.os-topbar { position: relative; z-index: var(--os-layer-chrome); overflow: visible; display: grid; grid-template-columns: minmax(230px, auto) auto; justify-content: space-between; gap: 22px; align-items: center; padding: 0 22px 0 26px; border-bottom: 1px solid #e5e7eb; background: rgba(255,255,255,.92); backdrop-filter: blur(12px); }
.os-context { display: flex; align-items: center; gap: 12px; } .os-context svg { color: var(--os-accent); width: 26px !important; height: 26px !important; }
.os-context strong { display: block; font-size: 15px; } .os-context span { display: block; color: var(--os-text-muted); font-size: 12px; margin-top: 3px; }
.os-top-actions { position: relative; z-index: 720; display: flex; align-items: center; gap: 12px; overflow: visible; } .os-top-actions button { width: 34px; height: 34px; display: grid; place-items: center; border: 0; background: transparent; color: var(--os-text); position: relative; box-shadow: none !important; }
.os-top-actions button em { position: absolute; top: -4px; right: -2px; min-width: 16px; height: 16px; display: grid; place-items: center; border-radius: 999px; background: #d8414a; color: #fff; font-size: 10px; font-style: normal; font-weight: 800; }
.os-top-menu { position: relative; z-index: 730; display: grid; place-items: center; overflow: visible; }
.os-user { width: auto !important; height: auto !important; display: flex !important; align-items: center; gap: 10px; padding: 0 !important; color: var(--os-text) !important; }
.os-user > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 999px; background: #0f172a; color: #fff; font-weight: 800; overflow: hidden; } .os-user strong, .os-user small { display: block; } .os-user strong { font-size: 13px; } .os-user small { color: var(--os-text-muted); font-size: 12px; } .os-user svg { width: 16px !important; height: 16px !important; color: var(--os-text); }
.os-user-avatar img, .os-user-avatar-upload img { width: 100%; height: 100%; display: block; object-fit: cover; }
.os-top-panel { position: absolute; top: calc(100% + 12px); right: 0; z-index: var(--os-layer-popover); width: 306px; padding: 10px; border: 1px solid var(--os-border); border-radius: 8px; background: var(--os-surface-raised); color: var(--os-text); box-shadow: var(--os-shadow); animation: osFadeIn .16s ease both; }
.os-user-menu .os-top-panel { width: 276px; }
.os-top-panel header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 5px 8px 10px; color: var(--os-text); font-size: 13px; font-weight: 750; }
#vynorNextApp .os-top-actions .os-top-panel header button { width: auto !important; height: 25px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: #2563eb !important; font: inherit !important; font-size: 12px !important; font-weight: 600 !important; box-shadow: none !important; }
#vynorNextApp .os-top-actions .os-top-panel header button:hover:not(:disabled) { color: #1d4ed8 !important; text-decoration: underline; }
#vynorNextApp .os-top-actions .os-top-panel header button:disabled { color: var(--os-text-muted) !important; cursor: default; }
.os-top-panel-list { display: grid; gap: 3px; }
#vynorNextApp .os-top-actions .os-top-panel-list button { width: 100% !important; height: auto !important; min-height: 58px !important; display: grid !important; place-items: initial !important; align-items: center !important; justify-items: start !important; padding: 10px 12px !important; border: 0 !important; border-radius: 7px !important; background: transparent !important; color: var(--os-text) !important; text-align: left !important; box-shadow: none !important; }
#vynorNextApp .os-top-actions .os-top-panel-list button:hover { background: var(--os-surface-hover) !important; }
.os-top-panel-list strong { display: block; color: var(--os-text); font-size: 13px; font-weight: 650; line-height: 1.25; }
.os-top-panel-list span { display: block; margin-top: 4px; color: var(--os-text-muted); font-size: 12px; line-height: 1.35; }
.os-user-current-card { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; align-items: center; margin: 2px 2px 9px; padding: 10px; border: 1px solid var(--os-border); border-radius: 8px; background: var(--os-surface); }
.os-user-current-card > span, .os-user-switch-list button > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 999px; background: #0f172a; color: #fff; font-size: 11px; font-weight: 800; overflow: hidden; }
.os-user-current-card strong, .os-user-current-card small { min-width: 0; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.os-user-current-card strong { color: var(--os-text-strong); font-size: 13px; font-weight: 700; }
.os-user-current-card small { margin-top: 3px; color: var(--os-text-muted); font-size: 12px; }
.os-user-login-another { margin: 0 2px 9px; }
#vynorNextApp .os-top-actions .os-user-login-another button { width: fit-content !important; min-height: 0 !important; display: inline-flex !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: #0ea5e9 !important; font: inherit !important; font-size: 12px !important; font-weight: 800 !important; text-align: left !important; box-shadow: none !important; }
#vynorNextApp .os-top-actions .os-user-login-another button:hover { color: #0284c7 !important; text-decoration: underline; }
.os-user-switch-list { display: grid; gap: 3px; margin-bottom: 8px; }
#vynorNextApp .os-top-actions .os-user-switch-list button { width: 100% !important; height: auto !important; min-height: 48px !important; display: grid !important; grid-template-columns: 34px minmax(0, 1fr) !important; align-items: center !important; gap: 10px !important; padding: 7px 9px !important; border: 1px solid transparent !important; border-radius: 7px !important; background: transparent !important; color: var(--os-text) !important; text-align: left !important; box-shadow: none !important; }
#vynorNextApp .os-top-actions .os-user-switch-list button:hover, #vynorNextApp .os-top-actions .os-user-switch-list button.is-selected { border-color: var(--os-text-muted) !important; background: var(--os-surface-hover) !important; }
.os-user-switch-list strong, .os-user-switch-list small { min-width: 0; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.os-user-switch-list strong { font-size: 13px; font-weight: 650; }
.os-user-switch-list small { margin-top: 2px; color: var(--os-text-muted); font-size: 11px; }
.os-empty-panel { min-height: 86px; display: grid; place-items: center; padding: 18px; color: var(--os-text-muted); font-size: 13px; text-align: center; }
.os-page { --os-content-align-offset: 16px; position: relative; z-index: var(--os-layer-content); overflow: visible; padding: 18px 26px 26px; display: grid; gap: 16px; }
#vynorNextApp .os-page:has(.os-production-popover:not([hidden]), .os-production-sort-panel:not([hidden]), .os-production-filter-drawer, .os-production-composer, .os-production-template-panel, .os-settings-center, .os-widget-drawer, .os-dashboard-preview, .os-production-task-spotlight) { z-index: var(--os-layer-modal); }
.os-page-header { margin-left: var(--os-content-align-offset); width: calc(100% - var(--os-content-align-offset)); display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; } .os-page-header h1 { margin: 0; font-size: 26px; letter-spacing: -0.02em; } .os-page-header p { margin: 6px 0 0; color: var(--os-text-muted); }
.os-page-header-actions-only { justify-content: flex-end; margin-bottom: -4px; }
.os-page-actions { display: flex; align-items: center; gap: 12px; } .os-primary, .os-date-filter, .os-mini-select { border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; box-shadow: none !important; }
.os-primary { min-height: 40px; display: inline-flex; align-items: center; gap: 8px; padding: 0 16px; border-color: var(--os-accent); background: var(--os-accent); color: #fff; font-weight: 700; } .os-primary svg { width: 18px !important; height: 18px !important; }
.os-date-filter { min-height: 40px; display: flex; align-items: center; gap: 10px; padding: 0 12px; } .os-date-filter strong, .os-date-filter small { display: block; text-align: left; } .os-date-filter small { color: var(--os-text-muted); }
.os-gear-button { width: 40px; height: 40px; display: inline-grid; place-items: center; border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text-muted); box-shadow: none !important; transition: transform .16s ease, color .16s ease, border-color .16s ease, background .16s ease; }
.os-gear-button:hover, .os-gear-button.is-active { transform: translateY(-1px); border-color: var(--os-text-muted); background: var(--os-surface-hover); color: var(--os-text); }
.os-gear-button svg { width: 18px !important; height: 18px !important; }
#vynorNextApp .os-submenu-tabs { justify-self: start; margin-left: var(--os-content-align-offset); display: grid; grid-auto-flow: column; grid-auto-columns: minmax(104px, 1fr); width: fit-content; max-width: calc(100% - var(--os-content-align-offset)); overflow: hidden; border: 1px solid #e1e6ef; border-radius: 8px; background: var(--os-surface) !important; box-shadow: 0 4px 12px rgba(15,23,42,.045); }
#vynorNextApp .os-submenu-tabs button { min-width: 104px; min-height: 34px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 0 10px; border: 0 !important; border-right: 1px solid #e5e7eb !important; border-radius: 0 !important; background: var(--os-surface) !important; color: var(--os-text-strong) !important; font: inherit; font-size: 13px; font-weight: 700; box-shadow: none !important; transition: background .18s ease, color .18s ease; }
#vynorNextApp .os-submenu-tabs button:last-child { border-right: 0 !important; }
#vynorNextApp .os-submenu-tabs button svg { width: 16px !important; height: 16px !important; stroke-width: 2; flex: 0 0 auto; color: currentColor !important; }
#vynorNextApp .os-submenu-tabs button:hover:not(.is-active) { background: var(--os-surface-hover) !important; color: var(--os-text-strong) !important; }
#vynorNextApp .os-submenu-tabs button.is-active { background: var(--os-accent) !important; color: #fff !important; }
.os-stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.os-stat-card, .os-panel-card { border: 1px solid var(--os-border); border-radius: 8px; background: var(--os-surface); color: var(--os-text); box-shadow: 0 8px 20px rgba(15,23,42,.035); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease; }
.os-stat-card:hover, .os-panel-card:hover { transform: translateY(-3px); border-color: var(--os-border-strong); background: var(--os-surface-raised); box-shadow: var(--os-shadow); }
.os-stat-card:hover figure { transform: scale(1.06); }
.os-stat-card { min-height: 124px; display: flex; justify-content: space-between; gap: 14px; padding: 22px; } .os-stat-card span { display: block; color: var(--os-text-muted); font-size: 14px; } .os-stat-card strong { display: block; margin-top: 14px; font-size: 25px; letter-spacing: -0.02em; } .os-stat-card em { display: block; margin-top: 13px; color: #16a34a; font-style: normal; font-size: 13px; } .os-stat-card em.red { color: #ff2a0a; } .os-stat-card figure { width: 48px; height: 48px; display: grid; place-items: center; margin: 0; border-radius: 999px; background: #dcfce7; color: #16a34a; transition: transform .18s ease; } .os-stat-card figure.red { background: #fee2e2; color: #ff2a0a; } .os-stat-card figure.purple { background: #ede9fe; color: #7c3aed; }
.os-production-toolbar { position: relative; z-index: 420; overflow: visible; margin-left: var(--os-content-align-offset); width: calc(100% - var(--os-content-align-offset)); display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 2px 0; }
.os-production-toolbar > div { display: flex; align-items: center; gap: 12px; }
.os-production-toolbar-left { min-width: 0; }
.os-production-toolbar-search { width: min(300px, 32vw); height: 36px; display: grid; grid-template-columns: 17px minmax(0, 1fr); align-items: center; gap: 8px; padding: 0 11px; border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text-muted); box-shadow: none !important; }
.os-production-toolbar-search svg { width: 17px !important; height: 17px !important; color: var(--os-text-muted); }
.os-production-toolbar-search input { min-width: 0; border: 0 !important; outline: 0 !important; background: transparent !important; color: var(--os-text); font: inherit; font-size: 13px; padding: 0 !important; box-shadow: none !important; }
.os-production-toolbar-search input::placeholder { color: var(--os-text-muted); }
.os-production-team-menu { position: relative; z-index: 440; overflow: visible; }
.os-production-menu { position: relative; z-index: 430; overflow: visible; }
.os-production-select, .os-production-filter { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 0 14px; border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 14px; font-weight: 600; box-shadow: none !important; }
.os-production-team-panel { position: absolute; left: 0; top: calc(100% + 10px); z-index: 920; width: min(320px, calc(100vw - 32px)); min-height: 190px; max-height: 360px; overflow: auto; padding: 10px; border: 1px solid #e1e6ef; border-radius: 8px; background: var(--os-surface); box-shadow: 0 20px 48px rgba(15,23,42,.14); }
.os-production-team-panel[hidden] { display: none !important; }
.os-production-team-list { display: grid; gap: 4px; }
.os-production-team-list button { width: 100% !important; min-height: 46px !important; display: grid !important; grid-template-columns: 30px minmax(0, 1fr); align-items: center !important; gap: 10px !important; padding: 7px 9px !important; border: 0 !important; border-radius: 7px !important; background: transparent !important; color: var(--os-text) !important; font: inherit !important; text-align: left !important; box-shadow: none !important; }
.os-production-team-list button:hover { background: var(--os-surface-hover) !important; }
.os-production-team-list button.is-selected { background: var(--os-surface-hover) !important; }
.os-production-team-list button > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 999px; background: var(--os-surface-hover); color: var(--os-text-muted); font-size: 11px; font-weight: 700; }
.os-production-team-list strong, .os-production-team-list small { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.os-production-team-list strong { font-size: 13px; font-weight: 500; }
.os-production-team-list small { margin-top: 2px; color: var(--os-text-muted); font-size: 11px; font-weight: 400; }
.os-production-team-empty { min-height: 156px; display: grid; place-items: center; border-radius: 7px; background: var(--os-surface); }
.os-production-filter.is-active, .os-production-select.is-active { border-color: var(--os-text-muted); background: var(--os-surface-hover); }
.os-production-sort-trigger.is-active { border-color: #93c5fd; background: #eff6ff; color: #2563eb; }
.os-production-select svg, .os-production-filter svg { width: 17px !important; height: 17px !important; color: var(--os-text-strong); }
.os-production-sort-trigger.is-active svg { color: #2563eb !important; }
.os-production-popover { position: absolute; top: calc(100% + 10px); right: 0; z-index: var(--os-layer-popover); width: 260px; display: grid; gap: 10px; padding: 12px; border: 1px solid #e1e6ef; border-radius: 8px; background: var(--os-surface); box-shadow: 0 20px 48px rgba(15,23,42,.14); }
.os-production-popover[hidden] { display: none !important; }
.os-production-popover label { display: grid; gap: 5px; color: var(--os-text-muted); font-size: 12px; font-weight: 700; }
.os-production-popover select { width: 100%; height: 34px; border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 13px; }
.os-production-popover > button { min-height: 34px; padding: 0 10px; border: 0; border-radius: 7px; background: var(--os-surface-hover); color: var(--os-text-muted); font: inherit; font-size: 13px; font-weight: 700; box-shadow: none !important; text-align: left; }
.os-production-sort-panel { position: fixed !important; top: 202px !important; right: max(16px, calc((100vw - 1280px) / 2 + 24px)) !important; z-index: var(--os-layer-popover) !important; width: min(284px, calc(100vw - 32px)); gap: 12px; padding: 14px; border-radius: 8px; }
.os-production-sort-panel header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.os-production-sort-panel header strong { color: var(--os-text); font-size: 13px; font-weight: 750; line-height: 1.25; }
.os-production-sort-panel header button { width: auto !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--os-text-muted) !important; font: inherit !important; font-size: 12px !important; font-weight: 650 !important; line-height: 1.2 !important; text-align: right !important; box-shadow: none !important; }
.os-production-sort-panel header button:hover { color: var(--os-text) !important; text-decoration: underline; background: transparent !important; }
.os-production-sort-row { display: grid; grid-template-columns: 1fr 32px; gap: 8px; align-items: center; }
.os-production-sort-row select { width: 100%; height: 34px; border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text-muted); font: inherit; font-size: 13px; }
.os-production-sort-direction { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid #dbeafe; border-radius: 999px; background: #eff6ff; color: #3b82f6; box-shadow: none !important; }
.os-production-sort-direction svg { width: 15px !important; height: 15px !important; }
.os-production-filter-backdrop { position: fixed; inset: 0; z-index: var(--os-layer-nested-backdrop); background: rgba(15,23,42,.14); backdrop-filter: blur(1px); }
.os-production-filter-drawer { position: fixed; top: 0; right: 0; bottom: 0; z-index: var(--os-layer-nested-modal); width: min(460px, calc(100vw - 18px)); display: grid; grid-template-rows: auto 1fr auto; background: var(--os-surface); border-left: 1px solid #e5e7eb; box-shadow: -24px 0 60px rgba(15,23,42,.16); animation: osDrawerIn .22s ease both; }
.os-production-filter-drawer header { min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 20px; border-bottom: 1px solid #eef2f7; }
.os-production-filter-drawer header span { display: block; color: var(--os-text-muted); font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.os-production-filter-drawer header strong { display: block; margin-top: 4px; color: var(--os-text); font-size: 18px; letter-spacing: -0.02em; }
.os-production-filter-drawer header button { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid #e5e7eb; border-radius: 6px; background: var(--os-surface-hover); color: var(--os-text-muted); font: inherit; font-size: 20px; line-height: 1; box-shadow: none !important; }
.os-production-filter-stack { display: grid; align-content: start; gap: 14px; padding: 20px; overflow: auto; }
.os-production-filter-rule { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 12px; border: 1px solid #e5e7eb; border-radius: 8px; background: var(--os-surface-raised); }
.os-production-filter-rule label { display: grid; gap: 7px; min-width: 0; color: var(--os-text-muted); font-size: 12px; font-weight: 750; }
.os-production-filter-rule select { width: 100%; min-height: 38px; border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 13px; box-shadow: none !important; }
.os-production-filter-drawer footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 20px; border-top: 1px solid #eef2f7; background: var(--os-surface); }
.os-production-filter-drawer footer div { display: flex; align-items: center; gap: 10px; }
.os-production-filter-clear, .os-production-filter-secondary, .os-production-filter-apply { min-height: 36px; padding: 0 14px; border-radius: 7px; font: inherit; font-size: 13px; font-weight: 700; box-shadow: none !important; }
.os-production-filter-clear { border: 0; background: transparent; color: var(--os-text-muted); }
.os-production-filter-secondary { border: 1px solid #dfe3ea; background: var(--os-surface); color: var(--os-text-muted); }
.os-production-filter-apply { border: 1px solid #111827; background: #111827; color: #fff; }
.os-production-board { position: relative; z-index: 1; margin-top: 0; margin-left: var(--os-content-align-offset); width: calc(100% - var(--os-content-align-offset)); display: grid; grid-template-columns: repeat(4, minmax(240px, 1fr)); gap: 18px; align-items: start; overflow-x: auto; padding-bottom: 6px; }
.os-production-column { min-height: 620px; display: grid; grid-template-rows: auto 1fr auto; gap: 10px; padding: 14px; border: 1px solid #e1e6ef; border-radius: 8px; background: rgba(255,255,255,.72); transition: border-color .16s ease, background .16s ease; }
.os-production-column.is-drag-over { border-color: var(--os-text-muted); background: var(--os-surface-hover); }
.os-production-column > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 2px 8px; }
.os-production-column > header div { display: flex; align-items: center; gap: 10px; min-width: 0; }
.os-production-column > header span { width: 14px; height: 14px; border-radius: 999px; background: #cbd5e1; box-shadow: inset 0 0 0 3px #e5e7eb; }
.os-production-column.blue > header span { background: #3b82f6; box-shadow: 0 0 0 4px #dbeafe; }
.os-production-column.amber > header span { background: #d97706; box-shadow: 0 0 0 4px #fef3c7; opacity: .78; }
.os-production-column.green > header span { background: #16a34a; box-shadow: 0 0 0 4px #dcfce7; }
.os-production-column > header strong { font-size: 15px; font-weight: 750; color: var(--os-text); }
.os-production-column > header em { min-width: 24px; height: 24px; display: grid; place-items: center; border-radius: 999px; background: var(--os-surface-hover); color: var(--os-text-muted); font-size: 13px; font-style: normal; font-weight: 750; }
.os-production-task-list { display: grid; align-content: start; gap: 8px; }
.os-production-task { display: grid; gap: 10px; padding: 12px; border: 1px solid #e5e7eb; border-radius: 8px; background: var(--os-surface); box-shadow: 0 8px 18px rgba(15,23,42,.035); cursor: grab; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, opacity .18s ease; }
.os-production-task:active { cursor: grabbing; }
.os-production-task.is-dragging { opacity: .48; transform: scale(.99); }
.os-production-task:hover { transform: translateY(-2px); border-color: var(--os-text-muted); box-shadow: 0 14px 28px rgba(15,23,42,.08); }
.os-production-task header { display: grid; grid-template-columns: 1fr 24px; align-items: start; gap: 8px; }
.os-production-task h3 { margin: 0; color: var(--os-text); font-size: 14px; line-height: 1.35; letter-spacing: 0; }
.os-production-task header button { width: 24px; height: 24px; display: grid; place-items: center; border: 0; background: transparent; color: var(--os-text-muted); box-shadow: none !important; }
.os-production-task header button:hover { color: #b91c1c; background: #fef2f2; border-radius: 6px; }
.os-production-task header svg { width: 16px !important; height: 16px !important; }
.os-production-card-row { display: grid; grid-template-columns: minmax(0, auto) minmax(72px, 116px); align-items: center; justify-content: space-between; gap: 12px; }
.os-production-tag { width: fit-content; display: inline-flex; align-items: center; min-height: 20px; padding: 0 0 0 8px; border-left: 2px solid #cbd5e1; border-radius: 0; background: transparent; color: var(--os-text-muted); font-size: 11px; font-weight: 560; letter-spacing: 0; }
.os-production-situation { width: fit-content; display: inline-flex; align-items: center; min-height: 20px; padding: 0 0 0 8px; border-left: 2px solid #93c5fd; border-radius: 0; background: transparent; color: #2563eb; font-size: 11px; font-weight: 560; }
.os-production-situation.waiting-approval { border-left-color: #f59e0b; color: #b45309; }
.os-production-situation.approved { border-left-color: #16a34a; color: #15803d; }
.os-production-situation.rejected { border-left-color: #ef4444; color: #dc2626; }
.os-production-task-progress { height: 4px; position: relative; overflow: visible; border-radius: 999px; background: var(--os-surface-hover); }
.os-production-task-progress span { position: absolute; inset: 0 auto 0 0; border-radius: inherit; background: #94a3b8; transition: width .18s ease, background .18s ease; }
.os-production-task-progress em { position: absolute; right: 0; top: -17px; color: var(--os-text-muted); font-size: 10px; font-style: normal; font-weight: 650; line-height: 1; }
.os-production-task-progress.is-low span { background: #94a3b8; }
.os-production-task-progress.is-medium span { background: #f59e0b; }
.os-production-task-progress.is-strong span { background: #2563eb; }
.os-production-task-progress.is-complete span { background: #16a34a; }
.os-production-task-progress.is-medium em { color: #b7791f; }
.os-production-task-progress.is-strong em { color: #2563eb; }
.os-production-task-progress.is-complete em { color: #16a34a; }
.os-production-task footer { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 10px; color: var(--os-text-muted); font-size: 12px; }
.os-production-task footer strong { font-size: 12px; font-weight: 750; }
.os-production-task footer strong.high { color: #ff2a0a; }
.os-production-task footer strong.medium { color: #b7791f; }
.os-production-task footer strong.low { color: #16a34a; }
.os-production-task footer span { display: inline-flex; align-items: center; gap: 5px; }
.os-production-task footer span svg { width: 14px !important; height: 14px !important; }
.os-production-task footer em { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 999px; background: #ede9fe; color: #5b21b6; font-size: 11px; font-style: normal; font-weight: 800; }
.os-production-task footer em.green { background: #dcfce7; color: #166534; } .os-production-task footer em.orange { background: var(--os-surface)7ed; color: #9a3412; } .os-production-task footer em.pink { background: #fee2e2; color: #b91c1c; } .os-production-task footer em.dark { background: #0f172a; color: #fff; }
.os-production-add { min-height: 36px; display: inline-flex; align-items: center; gap: 8px; border: 0; border-radius: 7px; background: transparent; color: var(--os-text-muted); font: inherit; font-weight: 500; box-shadow: none !important; cursor: pointer; }
.os-production-add svg { width: 17px !important; height: 17px !important; }
.os-production-empty { margin-left: var(--os-content-align-offset); width: min(720px, calc(100% - var(--os-content-align-offset))); }
.os-production-task-spotlight-backdrop { position: fixed; inset: 0; z-index: var(--os-layer-backdrop); background: rgba(15,23,42,.32); backdrop-filter: blur(3px); animation: osFadeIn .16s ease both; }
.os-production-task-spotlight { position: fixed; left: 50%; top: 50%; z-index: var(--os-layer-modal); width: min(720px, calc(100vw - 40px)); height: min(760px, calc(100vh - 32px)); overflow: hidden; display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto; gap: 18px; padding: 24px; border: 1px solid var(--os-border); border-radius: 10px; background: var(--os-surface); color: var(--os-text); box-shadow: 0 32px 90px rgba(15,23,42,.24); transform: translate(-50%, -50%); animation: osTaskSpotlightIn .18s ease both; }
.os-production-task-spotlight.is-static { animation: none !important; }
.os-production-task-spotlight header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.os-production-task-spotlight header span { display: block; color: var(--os-text-muted); font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.os-production-task-spotlight header strong { display: block; max-width: 560px; margin-top: 8px; color: #162033; font-size: 17px; line-height: 1.38; letter-spacing: 0; font-weight: 600; text-wrap: balance; }
.os-production-task-title { cursor: text; transition: color .16s ease; }
.os-production-task-title:hover { color: var(--os-text-muted); }
.os-production-task-title-input { display: block; width: min(560px, 100%); margin-top: 5px; padding: 3px 0; border: 0; border-bottom: 1px solid #94a3b8; border-radius: 0; outline: 0; background: transparent; color: #162033; font: inherit; font-size: 17px; line-height: 1.38; font-weight: 600; }
.os-production-task-title-input:focus { border-bottom-color: #2563eb; }
.os-production-task-spotlight-actions { display: inline-flex; align-items: center; gap: 6px; }
.os-production-task-delete { min-height: 34px; display: inline-flex; align-items: center; gap: 7px; padding: 0 10px; border: 1px solid #e5e7eb; border-radius: 8px; background: var(--os-surface); color: var(--os-text-muted); font: inherit; font-size: 12px; font-weight: 600; box-shadow: 0 4px 10px rgba(15,23,42,.025) !important; }
.os-production-task-delete:hover { border-color: #fecaca; background: #fef2f2; color: #b91c1c; }
.os-production-task-delete svg { width: 15px !important; height: 15px !important; }
.os-production-task-delete span { color: inherit !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: 0 !important; text-transform: none !important; }
.os-production-task-spotlight .os-drawer-close { width: 34px !important; height: 34px !important; min-width: 34px !important; min-height: 34px !important; display: grid !important; place-items: center !important; padding: 0 0 2px !important; border: 1px solid #e2e8f0 !important; border-radius: 8px !important; background: var(--os-surface) !important; color: var(--os-text-muted) !important; font: inherit !important; font-size: 20px !important; font-weight: 400 !important; line-height: 1 !important; box-shadow: 0 4px 10px rgba(15,23,42,.035) !important; }
.os-production-task-spotlight .os-drawer-close:hover { border-color: var(--os-text-muted) !important; background: var(--os-surface-hover) !important; color: var(--os-text) !important; }
.os-production-task-spotlight-meta { display: flex; flex-wrap: wrap; gap: 10px; }
.os-production-task-spotlight-meta span { min-height: 24px; display: inline-flex; align-items: center; gap: 6px; padding: 0 8px; border-left: 2px solid #cbd5e1; border-radius: 0; background: transparent; color: var(--os-text-muted); font-size: 12px; font-weight: 550; }
.os-production-task-spotlight-meta span.high { border-left-color: #ef4444; color: #991b1b; background: transparent; }
.os-production-task-spotlight-meta span.medium { border-left-color: #f59e0b; color: #92400e; background: transparent; }
.os-production-task-spotlight-meta span.low { border-left-color: #16a34a; color: #166534; background: transparent; }
.os-production-task-spotlight-meta svg { width: 14px !important; height: 14px !important; }
.os-production-task-spotlight-body { min-height: 0; overflow-y: auto; padding-right: 2px; scrollbar-gutter: stable; }
.os-production-task-spotlight-footer { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding-top: 14px; border-top: 1px solid #edf0f3; }
.os-production-save-action { min-height: 34px; display: inline-flex; align-items: center; justify-content: center; padding: 0 14px; border: 1px solid #111827; border-radius: 7px; background: #111827; color: #fff; font: inherit; font-size: 13px; font-weight: 650; line-height: 1; box-shadow: 0 8px 18px rgba(15,23,42,.12) !important; }
.os-production-save-action:hover { transform: translateY(-1px); background: #0b1220; border-color: #0b1220; }
.os-production-task-spotlight section { display: grid; gap: 8px; padding: 16px; border: 1px solid #edf0f3; border-radius: 8px; background: var(--os-surface-raised); }
.os-production-task-spotlight section h3 { margin: 0; color: var(--os-text); font-size: 14px; }
.os-production-task-spotlight section p { margin: 0; color: var(--os-text-muted); line-height: 1.55; }
.os-production-task-tabs { display: inline-grid; grid-auto-flow: column; justify-content: start; width: fit-content; overflow: hidden; border: 1px solid #e1e6ef; border-radius: 8px; background: var(--os-surface); box-shadow: 0 4px 12px rgba(15,23,42,.035); }
.os-production-task-tabs button { min-height: 34px; min-width: 112px; display: inline-flex; align-items: center; justify-content: center; padding: 0 13px; border: 0; border-right: 1px solid #e5e7eb; background: var(--os-surface); color: var(--os-text-muted); font: inherit; font-size: 13px; font-weight: 600; box-shadow: none !important; }
.os-production-task-tabs button:last-child { border-right: 0; }
.os-production-task-tabs button:hover:not(.is-active) { background: var(--os-surface-hover); color: var(--os-text); }
.os-production-task-tabs button.is-active { background: #111827; color: #fff; }
#vynorNextApp .os-production-task-spotlight .os-production-task-tabs button {
  min-height: 34px !important;
  min-width: 112px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 13px !important;
  border: 0 !important;
  border-right: 1px solid #e5e7eb !important;
  border-radius: 0 !important;
  background: var(--os-surface) !important;
  color: var(--os-text-muted) !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  box-shadow: none !important;
}
#vynorNextApp .os-production-task-spotlight .os-production-task-tabs button:last-child { border-right: 0 !important; }
#vynorNextApp .os-production-task-spotlight .os-production-task-tabs button:hover:not(.is-active) {
  background: var(--os-surface-hover) !important;
  color: var(--os-text) !important;
}
#vynorNextApp .os-production-task-spotlight .os-production-task-tabs button.is-active {
  background: #111827 !important;
  color: #fff !important;
}
.os-production-task-section { gap: 14px !important; background: var(--os-surface) !important; }
.os-production-task-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.os-production-task-form-grid label, .os-production-update-form, .os-production-checkpoint-form { display: grid; gap: 6px; color: var(--os-text-muted); font-size: 12px; font-weight: 600; }
.os-production-task-form-grid input, .os-production-task-form-grid select, .os-production-checkpoint-form input { width: 100%; min-height: 38px; padding: 0 12px; border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 13px; font-weight: 400; line-height: 1.35; box-shadow: none !important; }
.os-production-update-editor { overflow: hidden; display: grid; border: 1px solid #cfd6e3; border-radius: 8px; background: var(--os-surface); box-shadow: 0 4px 12px rgba(15,23,42,.025); transition: border-color .16s ease, box-shadow .16s ease; }
.os-production-update-editor:focus-within { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.08); }
.os-production-update-toolbar { min-height: 40px; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 4px; padding: 6px 8px; border-bottom: 1px solid #edf0f3; background: var(--os-surface-raised); }
.os-production-format-toggle, .os-production-align-option { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; padding: 0; border-radius: 5px; color: var(--os-text-muted); font-size: 12px; font-weight: 650; cursor: pointer; }
.os-production-format-toggle input, .os-production-align-option input { position: absolute; opacity: 0; pointer-events: none; }
.os-production-format-toggle span, .os-production-align-option span, .os-production-update-link-field > span, .os-production-update-file-field > span { display: inline-flex; align-items: center; justify-content: center; }
.os-production-format-toggle svg, .os-production-align-option svg, .os-production-update-link-field svg, .os-production-update-file-field svg { width: 15px !important; height: 15px !important; stroke-width: 2; }
.os-production-format-toggle:has(input:checked), .os-production-align-option:has(input:checked) { background: #111827; color: #fff; }
.os-production-format-select { min-height: 28px; display: inline-flex; align-items: center; gap: 5px; margin-left: 2px; padding: 0 5px 0 7px; border-left: 1px solid #e5e7eb; color: var(--os-text-muted); font-size: 11px; font-weight: 650; }
.os-production-format-select select { width: 48px; min-height: 26px; padding: 0 4px; border: 0; border-radius: 5px; background: var(--os-surface-hover); color: var(--os-text); font: inherit; font-size: 12px; box-shadow: none !important; }
.os-production-update-form textarea { width: 100%; min-height: 132px; padding: 14px; border: 0; outline: 0; resize: vertical; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 14px; font-weight: 400; line-height: 1.5; box-shadow: none !important; }
.os-production-update-attachments { display: flex; justify-content: flex-end; align-items: center; gap: 8px; padding: 8px; border-top: 1px solid #edf0f3; background: var(--os-surface-raised); }
.os-production-update-link-field { width: 28px; height: 28px; display: grid; grid-template-columns: 18px 0; align-items: center; justify-content: center; gap: 0; margin-left: 4px; padding: 0; border-left: 1px solid #e5e7eb; color: var(--os-text-muted); font-size: 11px; font-weight: 650; cursor: pointer; }
.os-production-update-link-field:hover { background: var(--os-surface-hover); border-radius: 5px; }
.os-production-update-link-field.is-open, .os-production-update-link-field:focus-within { width: auto; grid-template-columns: 18px minmax(74px, 120px); justify-content: start; gap: 6px; padding: 0 7px; color: var(--os-text-muted); background: transparent; }
.os-production-update-link-field:not(.is-open):not(:focus-within) input { display: none; }
.os-production-update-link-field input { min-width: 0; width: 100%; min-height: 26px; padding: 0 7px; border: 1px solid #e5e7eb; border-radius: 5px; outline: 0; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 12px; box-shadow: none !important; }
.os-production-update-file-field { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; padding: 0; border-radius: 5px; background: transparent; color: var(--os-text-muted); font-size: 12px; font-weight: 650; cursor: pointer; }
.os-production-update-file-field.has-file { width: auto; min-width: 28px; padding: 0 8px; color: #2563eb; background: #eff6ff; }
.os-production-update-file-field input { position: absolute; opacity: 0; pointer-events: none; width: 1px; height: 1px; }
.os-production-update-file-field:hover { background: var(--os-surface-hover); }
.os-production-update-form button, .os-production-checkpoint-form button { width: fit-content; min-height: 34px; display: inline-flex; align-items: center; justify-content: center; padding: 0 12px; border: 1px solid #111827; border-radius: 7px; background: #111827; color: #fff; font: inherit; font-size: 13px; font-weight: 650; box-shadow: none !important; }
.os-production-update-attachments button { min-height: 32px; border-color: #2563eb; background: #2563eb; border-radius: 6px; font-size: 12px; }
.os-production-update-list, .os-production-checkpoint-list { display: grid; gap: 8px; }
.os-production-update-list article { display: grid; gap: 9px; padding: 12px; border: 1px solid #e5e7eb; border-radius: 8px; background: var(--os-surface); }
.os-production-update-list article.is-pinned { border-color: #bfdbfe; background: var(--os-surface-raised); }
.os-production-update-link { width: fit-content; color: #2563eb; font-size: 12px; text-decoration: none; overflow-wrap: anywhere; }
.os-production-update-link:hover { text-decoration: underline; }
.os-production-update-image { max-width: 100%; max-height: 220px; width: fit-content; border: 1px solid #e5e7eb; border-radius: 8px; object-fit: contain; background: var(--os-surface-hover); }
.os-production-update-list footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--os-text-muted); font-size: 12px; }
.os-production-update-list footer div { display: inline-flex; align-items: center; gap: 10px; }
.os-production-update-list footer button { border: 0; background: transparent; color: #2563eb; font: inherit; font-size: 12px; font-weight: 500; box-shadow: none !important; }
#vynorNextApp .os-production-task-spotlight [data-production-toggle-update],
#vynorNextApp .os-production-task-spotlight [data-production-delete-update] {
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #2563eb !important;
  font: inherit !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
}
#vynorNextApp .os-production-task-spotlight [data-production-delete-update] {
  color: var(--os-text-muted) !important;
}
#vynorNextApp .os-production-task-spotlight [data-production-toggle-update]:hover,
#vynorNextApp .os-production-task-spotlight [data-production-delete-update]:hover {
  color: #1d4ed8 !important;
  text-decoration: underline;
}
.os-production-sprint-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; }
.os-production-sprint-head span { display: block; margin-top: 4px; color: var(--os-text-muted); font-size: 12px; }
.os-production-sprint-head strong { color: var(--os-text); font-size: 24px; letter-spacing: -0.02em; }
.os-production-sprint-bar { height: 8px; overflow: hidden; border-radius: 999px; background: var(--os-surface-hover); }
.os-production-sprint-bar span { display: block; height: 100%; border-radius: inherit; background: #94a3b8; transition: width .18s ease, background .18s ease; }
.os-production-sprint-bar.is-medium span { background: #f59e0b; }
.os-production-sprint-bar.is-strong span { background: #2563eb; }
.os-production-sprint-bar.is-complete span { background: #16a34a; }
.os-production-checkpoint-form { grid-template-columns: 1fr auto; align-items: end; }
.os-production-checkpoint-form button { width: 38px; padding: 0; border-radius: 7px; }
.os-production-checkpoint-form button svg { width: 15px; height: 15px; }
.os-production-checkpoint-timeline { position: relative; display: grid; gap: 2px; padding: 2px 0 2px 12px; }
.os-production-checkpoint-timeline::before { position: absolute; top: 17px; bottom: 17px; left: 22px; width: 1px; background: #dbe3ec; content: ""; }
.os-production-checkpoint { position: relative; min-width: 0; padding: 0; }
.os-production-checkpoint-row { position: relative; display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; align-items: center; min-height: 47px; }
.os-production-checkpoint-complete { position: relative; z-index: 1; display: grid; width: 18px; height: 18px; box-sizing: border-box; place-self: center; place-items: center; padding: 0; border: 1px solid #cbd5e1; border-radius: 50%; background: var(--os-surface); color: transparent; line-height: 1; box-shadow: 0 0 0 3px #fff; cursor: pointer; }
.os-production-checkpoint-complete:hover { border-color: #2563eb; background: #eff6ff; }
.os-production-checkpoint-complete svg { width: 10px; height: 10px; display: block; flex: 0 0 10px; stroke-width: 2.5; }
.os-production-checkpoint.is-done .os-production-checkpoint-complete { border-color: #16a34a; background: #16a34a; color: #fff; }
.os-production-checkpoint-toggle { width: 100%; min-height: 42px; display: grid; grid-template-columns: 30px minmax(0, 1fr) 16px; align-items: center; gap: 10px; padding: 7px 8px 7px 2px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--os-text); text-align: left; transition: background .16s ease, border-color .16s ease; }
.os-production-checkpoint-toggle:hover, .os-production-checkpoint.is-expanded .os-production-checkpoint-toggle { border-color: var(--os-text-muted); background: var(--os-surface-hover); }
.os-production-checkpoint-toggle strong { width: 26px; height: 22px; display: grid; place-items: center; border-radius: 5px; background: var(--os-surface-hover); color: var(--os-text-muted); font-size: 10px; font-weight: 750; }
.os-production-checkpoint-toggle span { min-width: 0; display: grid; gap: 2px; }
.os-production-checkpoint-toggle b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--os-text); font-size: 12px; font-weight: 650; line-height: 1.25; }
.os-production-checkpoint-toggle small { color: var(--os-text-muted); font-size: 10px; font-weight: 500; line-height: 1.2; }
.os-production-checkpoint-toggle i { display: grid; place-items: center; color: var(--os-text-muted); transition: transform .16s ease; }
.os-production-checkpoint-toggle i svg { width: 14px; height: 14px; }
.os-production-checkpoint.is-expanded .os-production-checkpoint-toggle i { transform: rotate(180deg); }
.os-production-checkpoint.is-done .os-production-checkpoint-toggle strong { background: #e7f7ed; color: #15803d; }
.os-production-checkpoint.is-done .os-production-checkpoint-toggle b { color: var(--os-text-muted); text-decoration: line-through; text-decoration-color: var(--os-text-muted); }
.os-production-checkpoint-details { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: 10px; margin: 3px 0 10px 28px; padding: 11px 12px; border-left: 1px solid #dbe3ec; background: var(--os-surface-raised); }
.os-production-checkpoint-details label { display: grid; gap: 5px; color: var(--os-text-muted); font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.os-production-checkpoint-details select, .os-production-checkpoint-details input, .os-production-checkpoint-details textarea { width: 100%; min-height: 34px; padding: 0 9px; border: 1px solid #dfe3ea; border-radius: 5px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 12px; font-weight: 400; text-transform: none; letter-spacing: 0; }
.os-production-checkpoint-details textarea { min-height: 58px; padding: 8px 9px; resize: vertical; }
.os-production-checkpoint-note { grid-column: 1 / -1; }
#vynorNextApp .os-production-task-spotlight .os-production-checkpoint-toggle {
  border-color: var(--os-text-muted) !important;
  background: var(--os-surface) !important;
  color: var(--os-text) !important;
  box-shadow: none !important;
}
#vynorNextApp .os-production-task-spotlight .os-production-checkpoint-toggle:hover,
#vynorNextApp .os-production-task-spotlight .os-production-checkpoint.is-expanded .os-production-checkpoint-toggle {
  border-color: var(--os-text-muted) !important;
  background: var(--os-surface-hover) !important;
  color: var(--os-text) !important;
}
#vynorNextApp .os-production-task-spotlight .os-production-checkpoint-complete {
  border-color: var(--os-text-muted) !important;
  background: var(--os-surface) !important;
  color: transparent !important;
  line-height: 1 !important;
  box-shadow: 0 0 0 3px #fff !important;
}
#vynorNextApp .os-production-task-spotlight .os-production-checkpoint-complete svg {
  width: 10px !important;
  height: 10px !important;
  display: block !important;
  flex: 0 0 10px !important;
  stroke-width: 2.5 !important;
}
#vynorNextApp .os-production-task-spotlight .os-production-checkpoint.is-done .os-production-checkpoint-complete {
  border-color: #16a34a !important;
  background: #16a34a !important;
  color: #fff !important;
}
#vynorNextApp .os-production-task-spotlight .os-production-checkpoint-form button {
  border-color: var(--os-text) !important;
  background: #111827 !important;
  color: #fff !important;
  box-shadow: none !important;
}
#vynorNextApp .os-production-task-spotlight .os-production-task-delete {
  border-color: var(--os-text-muted) !important;
  background: var(--os-surface) !important;
  color: var(--os-text-muted) !important;
}
#vynorNextApp .os-production-task-spotlight .os-production-task-delete:hover {
  border-color: #fecaca !important;
  background: #fef2f2 !important;
  color: #b91c1c !important;
}
#vynorNextApp .os-production-task-spotlight .os-production-save-action {
  border-color: var(--os-text) !important;
  background: #111827 !important;
  color: #fff !important;
}
.os-production-composer-backdrop { position: fixed; inset: 0; z-index: var(--os-layer-backdrop); background: rgba(15,23,42,.18); backdrop-filter: blur(2px); }
.os-production-composer { position: fixed; top: 0; right: 0; bottom: 0; z-index: var(--os-layer-drawer); width: min(430px, calc(100vw - 24px)); display: grid; align-content: start; gap: 14px; padding: 22px; border-left: 1px solid #e5e7eb; background: var(--os-surface); box-shadow: -24px 0 60px rgba(15,23,42,.16); animation: osDrawerIn .22s ease both; }
.os-production-composer header { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 4px; }
.os-production-composer header span { display: block; color: var(--os-text-muted); font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.os-production-composer header strong { display: block; margin-top: 5px; color: var(--os-text); font-size: 20px; letter-spacing: -0.02em; }
.os-production-composer header button { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid #e5e7eb; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 22px; line-height: 1; box-shadow: none !important; }
.os-production-composer header .os-drawer-close { width: 34px !important; height: 34px !important; min-width: 34px !important; min-height: 34px !important; display: grid !important; place-items: center !important; padding: 0 0 2px !important; border: 1px solid #e2e8f0 !important; border-radius: 8px !important; background: var(--os-surface) !important; color: var(--os-text-muted) !important; font: inherit !important; font-size: 20px !important; font-weight: 400 !important; line-height: 1 !important; box-shadow: 0 4px 10px rgba(15,23,42,.035) !important; transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease; }
.os-production-composer header .os-drawer-close:hover { transform: translateY(-1px); border-color: var(--os-text-muted) !important; background: var(--os-surface-hover) !important; color: var(--os-text) !important; box-shadow: 0 8px 18px rgba(15,23,42,.08) !important; }
.os-production-composer header .os-drawer-close:focus-visible { outline: 2px solid #bfdbfe; outline-offset: 2px; }
.os-production-composer label { display: grid; gap: 6px; color: var(--os-text-muted); font-size: 12px; font-weight: 600; }
.os-production-composer input, .os-production-composer select { width: 100%; min-height: 38px; padding: 0 12px; border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 13px; font-weight: 400; line-height: 1.35; box-shadow: none !important; }
.os-production-composer input::placeholder { color: var(--os-text-muted); opacity: 1; }
.os-production-template-panel { position: fixed; top: 0; right: 0; bottom: 0; z-index: var(--os-layer-drawer); width: min(400px, calc(100vw - 24px)); display: grid; grid-template-rows: auto 1fr; gap: 12px; padding: 18px; border-left: 1px solid #e5e7eb; background: var(--os-surface); box-shadow: -24px 0 60px rgba(15,23,42,.16); animation: osDrawerIn .22s ease both; }
.os-production-template-panel header { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.os-production-template-panel header span { display: block; color: var(--os-text-muted); font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.os-production-template-panel header strong { display: block; margin-top: 4px; color: var(--os-text); font-size: 18px; letter-spacing: -0.015em; }
.os-production-template-panel header .os-drawer-close { width: 30px !important; height: 30px !important; min-width: 30px !important; min-height: 30px !important; display: grid !important; place-items: center !important; padding: 0 0 2px !important; border: 1px solid #e2e8f0 !important; border-radius: 7px !important; background: var(--os-surface) !important; color: var(--os-text-muted) !important; font: inherit !important; font-size: 18px !important; font-weight: 400 !important; line-height: 1 !important; box-shadow: 0 4px 10px rgba(15,23,42,.035) !important; }
.os-production-template-sections { display: grid; align-content: start; gap: 10px; overflow: auto; padding-right: 2px; }
.os-production-template-sections section { display: grid; gap: 8px; padding: 10px; border: 1px solid #e5e7eb; border-radius: 7px; background: var(--os-surface-raised); }
.os-production-template-sections h3 { margin: 0; color: var(--os-text); font-size: 13px; }
.os-production-template-steps { display: grid; gap: 4px; }
.os-production-template-steps div { min-height: 28px; display: grid; grid-template-columns: minmax(0, 1fr) 24px; align-items: center; gap: 6px; padding: 3px 4px 3px 8px; border: 1px solid #edf0f3; border-radius: 6px; background: var(--os-surface); color: var(--os-text-muted); font-size: 12px; line-height: 1.25; }
.os-production-template-steps div[draggable="true"] { cursor: grab; }
.os-production-template-steps div.is-dragging { opacity: .45; }
.os-production-template-steps div.is-drop-target { border-color: var(--os-text-muted); background: var(--os-surface-hover); box-shadow: inset 0 2px 0 var(--os-text-muted); }
.os-production-template-steps button { width: 24px !important; height: 24px !important; min-height: 24px !important; display: grid !important; place-items: center !important; padding: 0 !important; border: 0 !important; border-radius: 5px !important; background: transparent !important; color: var(--os-text-muted) !important; box-shadow: none !important; }
.os-production-template-steps button:hover { background: var(--os-surface-hover) !important; color: var(--os-text) !important; }
.os-production-template-steps svg { width: 13px !important; height: 13px !important; }
.os-production-template-sections form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; align-items: center; }
.os-production-template-sections input { min-height: 30px; padding: 0 8px; border: 1px solid #dfe3ea; border-radius: 6px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 12px; box-shadow: none !important; }
.os-production-template-sections form button { min-height: 30px !important; display: inline-flex !important; align-items: center !important; gap: 5px !important; padding: 0 8px !important; border: 1px solid #dfe3ea !important; border-radius: 6px !important; background: var(--os-surface) !important; color: var(--os-text) !important; font: inherit !important; font-size: 12px !important; font-weight: 600 !important; box-shadow: none !important; }
.os-production-template-sections form button:hover { background: var(--os-surface-hover) !important; border-color: var(--os-text-muted) !important; }
.os-settings-backdrop { position: fixed; inset: 0; z-index: var(--os-layer-backdrop); background: rgba(15,23,42,.18); backdrop-filter: blur(2px); }
.os-settings-center { position: fixed; left: 50%; top: 50%; z-index: var(--os-layer-modal); width: min(980px, calc(100vw - 48px)); height: min(720px, calc(100vh - 48px)); display: grid; grid-template-rows: auto minmax(0, 1fr); overflow: hidden; border: 1px solid #e5e7eb; border-radius: 10px; background: var(--os-surface); box-shadow: 0 30px 90px rgba(15,23,42,.22); transform: translate(-50%, -50%); animation: osModalIn .18s ease both; }
.os-settings-center.is-static { animation: none !important; }
#vynorNextApp .os-settings-center button { background: var(--os-surface) !important; color: var(--os-text) !important; border-color: var(--os-text-muted) !important; box-shadow: none !important; }
#vynorNextApp .os-settings-center button:hover { background: var(--os-surface-hover) !important; border-color: var(--os-text-muted) !important; color: var(--os-text) !important; }
.os-settings-center-head { min-height: 66px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 18px; border-bottom: 1px solid #e5e7eb; background: var(--os-surface); }
.os-settings-center-head span, .os-settings-content-head span { display: block; color: var(--os-text-muted); font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.os-settings-center-head strong { display: block; margin-top: 4px; color: var(--os-text); font-size: 20px; letter-spacing: -0.018em; }
.os-settings-center .os-drawer-close { width: 30px !important; height: 30px !important; min-width: 30px !important; min-height: 30px !important; display: grid !important; place-items: center !important; padding: 0 0 2px !important; border: 1px solid #e2e8f0 !important; border-radius: 7px !important; background: var(--os-surface) !important; color: var(--os-text-muted) !important; font: inherit !important; font-size: 18px !important; font-weight: 400 !important; line-height: 1 !important; box-shadow: 0 4px 10px rgba(15,23,42,.035) !important; }
.os-settings-center-body { min-height: 0; display: grid; grid-template-columns: 280px minmax(0, 1fr); background: var(--os-surface-hover); }
.os-settings-nav { min-height: 0; display: grid; align-content: start; gap: 6px; overflow: auto; padding: 14px; border-right: 1px solid #e5e7eb; background: var(--os-surface-raised); }
.os-settings-nav button { width: 100%; min-height: 58px; display: grid; gap: 4px; padding: 10px 12px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--os-text); font: inherit; text-align: left; box-shadow: none !important; }
.os-settings-nav button:hover { background: var(--os-surface); border-color: var(--os-text-muted); }
.os-settings-nav button.is-active { background: var(--os-surface); border-color: var(--os-text-muted); box-shadow: 0 8px 18px rgba(15,23,42,.035) !important; }
.os-settings-nav strong { font-size: 13px; font-weight: 750; line-height: 1.15; }
.os-settings-nav span { color: var(--os-text-muted); font-size: 11px; font-weight: 400; line-height: 1.25; }
.os-settings-content { min-width: 0; min-height: 0; display: grid; grid-template-rows: minmax(0, 1fr); gap: 12px; overflow-y: auto; overflow-x: hidden; padding: 18px; background: var(--os-surface); }
.os-settings-content-head { display: grid; gap: 4px; }
.os-settings-content-head strong { color: var(--os-text); font-size: 18px; letter-spacing: -0.015em; }
.os-settings-production-panel { display: grid; align-content: start; gap: 12px; min-height: 0; }
.os-settings-block-head { display: grid; gap: 4px; }
.os-settings-block-head strong { color: var(--os-text); font-size: 15px; letter-spacing: -0.01em; }
.os-settings-block-head span { color: var(--os-text-muted); font-size: 12px; line-height: 1.35; }
.os-settings-save-feedback { justify-self: end; align-self: start; min-height: 24px; display: inline-flex; align-items: center; padding: 0 9px; border: 1px solid #bbf7d0; border-radius: 999px; background: #f0fdf4; color: #15803d; font-size: 11px; font-weight: 650; }
.os-settings-placeholder { min-height: 220px; display: grid; place-content: center; gap: 6px; border: 1px dashed #d8dee8; border-radius: 8px; background: var(--os-surface-raised); color: var(--os-text-muted); text-align: center; }
.os-settings-placeholder strong { color: var(--os-text); font-size: 15px; }
.os-settings-placeholder span { font-size: 12px; }
.os-settings-generic-panel, .os-settings-panel-grid { min-height: 0; display: grid; align-content: start; gap: 10px; }
.os-settings-compact-card { min-height: 0; display: grid; gap: 10px; padding: 10px; border: 1px solid #e5e7eb; border-radius: 8px; background: var(--os-surface); box-shadow: 0 8px 18px rgba(15,23,42,.03); transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.os-settings-compact-card:hover { transform: translateY(-1px); border-color: var(--os-text-muted); box-shadow: 0 14px 26px rgba(15,23,42,.06); }
.os-settings-compact-card > div:first-child { min-width: 0; }
.os-settings-compact-card strong { color: var(--os-text); font-size: 13px; font-weight: 750; line-height: 1.2; }
.os-settings-compact-card small { display: block; margin-top: 2px; color: var(--os-text-muted); font-size: 11px; line-height: 1.3; }
.os-settings-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.os-settings-form-grid label { display: grid; gap: 6px; color: var(--os-text-muted); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.os-settings-form-grid input, .os-settings-form-grid select, .os-settings-toggle-list input { min-width: 0; min-height: 32px; padding: 0 9px; border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 12px; font-weight: 400; letter-spacing: 0; text-transform: none; box-shadow: none !important; }
.os-settings-compact-card footer { display: flex; justify-content: flex-end; }
.os-settings-compact-card footer button, .os-settings-panel-actions button, .os-settings-action-button { min-height: 30px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 10px !important; border: 1px solid #dfe3ea !important; border-radius: 7px !important; background: var(--os-surface) !important; color: var(--os-text) !important; font: inherit !important; font-size: 11px !important; font-weight: 650 !important; box-shadow: none !important; }
.os-settings-panel-actions { display: flex; justify-content: flex-end; }
.os-settings-finance-picker { position: relative; display: grid; gap: 6px; color: var(--os-text-muted); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.os-settings-finance-trigger { width: 100% !important; min-height: 32px !important; display: grid !important; grid-template-columns: minmax(0, 1fr) 14px !important; align-items: center !important; gap: 8px !important; padding: 0 9px !important; border: 1px solid #dfe3ea !important; border-radius: 7px !important; background: var(--os-surface) !important; color: var(--os-text) !important; font: inherit !important; font-size: 12px !important; font-weight: 400 !important; letter-spacing: 0 !important; text-transform: none !important; text-align: left !important; box-shadow: none !important; }
.os-settings-finance-trigger span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.os-settings-finance-trigger svg { width: 13px !important; height: 13px !important; color: var(--os-text-muted) !important; }
.os-settings-finance-menu { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: var(--os-layer-popover); display: grid; gap: 2px; max-height: 190px; overflow-y: auto; padding: 6px; border: 1px solid #e1e6ef; border-radius: 8px; background: var(--os-surface); box-shadow: 0 16px 34px rgba(15,23,42,.12); }
.os-settings-finance-menu[hidden] { display: none !important; }
.os-settings-finance-menu button:not(.os-settings-finance-add) { width: 100% !important; min-height: 30px !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; padding: 0 8px !important; border: 0 !important; border-radius: 6px !important; background: transparent !important; color: var(--os-text) !important; font: inherit !important; font-size: 12px !important; font-weight: 400 !important; letter-spacing: 0 !important; text-align: left !important; text-transform: none !important; box-shadow: none !important; }
.os-settings-finance-menu button:not(.os-settings-finance-add):hover, .os-settings-finance-menu button[aria-selected="true"] { background: var(--os-surface-hover) !important; }
.os-settings-finance-add { width: fit-content !important; min-height: 0 !important; display: inline-flex !important; justify-content: flex-start !important; margin: 5px 8px 2px !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: #2563eb !important; font: inherit !important; font-size: 12px !important; font-weight: 400 !important; letter-spacing: 0 !important; text-align: left !important; text-transform: none !important; box-shadow: none !important; }
.os-settings-finance-add:hover { text-decoration: underline; }
.os-settings-toggle-list, .os-settings-integration-list { min-height: 0; display: grid; align-content: start; gap: 8px; overflow: auto; padding-right: 2px; }
.os-settings-toggle-list article, .os-settings-integration-list article { grid-template-columns: minmax(0, 1fr) minmax(150px, .55fr) auto; align-items: center; }
.os-settings-integration-list article { grid-template-columns: minmax(0, 1fr) 86px 126px; }
.os-settings-status-tag { min-height: 24px; display: inline-grid; place-items: center; padding: 0 8px; border: 1px solid #e5e7eb; border-radius: 999px; background: var(--os-surface-hover); color: var(--os-text-muted); font-size: 10px; font-weight: 750; line-height: 1; }
.os-settings-status-tag.is-connected { border-color: #bbf7d0; background: #f0fdf4; color: #15803d; }
.os-settings-status-tag.is-paused { border-color: #fde68a; background: var(--os-surface)beb; color: #a16207; }
.os-settings-action-button:hover, .os-settings-panel-actions button:hover { background: var(--os-surface-hover) !important; border-color: var(--os-text-muted) !important; }
.os-settings-switch { width: 38px; height: 22px; position: relative; display: inline-grid; align-items: center; }
.os-settings-switch input { position: absolute; opacity: 0; pointer-events: none; }
.os-settings-switch span { width: 38px; height: 22px; border: 1px solid #cfd6e3; border-radius: 999px; background: var(--os-surface-hover); transition: background .16s ease, border-color .16s ease; }
.os-settings-switch span::after { content: ""; position: absolute; left: 3px; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: var(--os-surface); box-shadow: 0 2px 6px rgba(15,23,42,.18); transition: transform .16s ease; }
.os-settings-switch input:checked + span { border-color: var(--os-text-strong); background: #0f172a; }
.os-settings-switch input:checked + span::after { transform: translateX(16px); }
.os-settings-sector-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: end; padding: 10px; border: 1px solid #e5e7eb; border-radius: 8px; background: var(--os-surface-raised); }
.os-settings-sector-form label { display: grid; gap: 6px; color: var(--os-text-muted); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.os-settings-sector-form input { min-height: 34px; padding: 0 10px; border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 13px; font-weight: 400; letter-spacing: 0; text-transform: none; box-shadow: none !important; }
.os-settings-sector-form button { min-height: 34px !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; padding: 0 10px !important; border: 1px solid #dfe3ea !important; border-radius: 7px !important; background: var(--os-surface) !important; color: var(--os-text) !important; font: inherit !important; font-size: 12px !important; font-weight: 650 !important; box-shadow: none !important; }
.os-settings-sector-form button:hover { background: var(--os-surface-hover) !important; border-color: var(--os-text-muted) !important; }
.os-settings-sector-form svg { width: 14px !important; height: 14px !important; }
.os-settings-sector-list { display: grid; align-content: start; gap: 8px; min-height: 0; overflow: auto; padding-right: 2px; }
.os-settings-sector-list article { min-height: 44px; display: grid; grid-template-columns: minmax(0, 1fr) 82px 58px 30px; align-items: center; gap: 8px; padding: 8px; border: 1px solid #e5e7eb; border-radius: 8px; background: var(--os-surface); }
.os-settings-sector-list input { min-width: 0; min-height: 32px; padding: 0 8px; border: 1px solid #edf0f3; border-radius: 6px; background: var(--os-surface-raised); color: var(--os-text); font: inherit; font-size: 13px; box-shadow: none !important; }
.os-settings-sector-list small { color: var(--os-text-muted); font-size: 10px; font-weight: 700; line-height: 1.15; text-align: right; }
.os-settings-sector-list button { min-height: 28px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 8px !important; border: 1px solid #dfe3ea !important; border-radius: 6px !important; background: var(--os-surface) !important; color: var(--os-text) !important; font: inherit !important; font-size: 11px !important; font-weight: 650 !important; box-shadow: none !important; }
.os-settings-sector-list button:hover { background: var(--os-surface-hover) !important; border-color: var(--os-text-muted) !important; }
.os-settings-sector-list button[aria-label] { width: 28px !important; min-width: 28px !important; padding: 0 !important; color: var(--os-text-muted) !important; }
.os-settings-sector-list button[aria-label]:hover { color: #b91c1c !important; background: #fef2f2 !important; border-color: #fecaca !important; }
.os-settings-sector-list svg { width: 13px !important; height: 13px !important; }
.os-settings-users-panel { display: grid; align-content: start; gap: 10px; min-height: 0; }
.os-settings-user-form { display: grid; gap: 12px; padding: 14px; border: 1px solid #e1e7ef; border-radius: 8px; background: var(--os-surface-raised); }
.os-settings-user-form-fields { display: grid; grid-template-columns: minmax(170px, 1fr) minmax(220px, 1.25fr) minmax(150px, .7fr); gap: 10px; }
.os-settings-user-form label, .os-settings-user-fields label { display: grid; gap: 6px; color: var(--os-text-muted); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.os-settings-user-form input, .os-settings-user-form select, .os-settings-user-fields input, .os-settings-user-fields select { min-width: 0; min-height: 30px; padding: 0 9px; border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 12px; font-weight: 400; letter-spacing: 0; text-transform: none; box-shadow: none !important; }
.os-settings-user-form button, .os-settings-user-card footer button { min-height: 30px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; padding: 0 9px !important; border: 1px solid #dfe3ea !important; border-radius: 7px !important; background: var(--os-surface) !important; color: var(--os-text) !important; font: inherit !important; font-size: 11px !important; font-weight: 650 !important; box-shadow: none !important; }
.os-settings-user-form button:hover, .os-settings-user-card footer button:hover { background: var(--os-surface-hover) !important; border-color: var(--os-text-muted) !important; }
.os-settings-user-form svg { width: 14px !important; height: 14px !important; }
.os-settings-user-workspaces { min-width: 0; margin: 0; padding: 0; border: 0; }
.os-settings-user-workspaces legend { display: block; margin: 0 0 7px; padding: 0; color: var(--os-text-muted); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.os-settings-user-workspace-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.os-settings-user-workspace-grid label { min-width: 0; min-height: 34px; display: flex; align-items: center; gap: 8px; padding: 0 9px; border: 1px solid #e7ebf0; border-radius: 6px; background: var(--os-surface); color: var(--os-text-muted); font-size: 11px; font-weight: 550; letter-spacing: 0; text-transform: none; cursor: pointer; }
.os-settings-user-workspace-grid label:hover { border-color: var(--os-text-muted); background: var(--os-surface-hover); }
.os-settings-user-workspace-grid input { width: 13px; height: 13px; flex: 0 0 auto; margin: 0; accent-color: var(--os-text-strong); }
.os-settings-user-workspace-grid span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.os-settings-user-form-actions { display: flex; justify-content: flex-end; padding-top: 1px; }
.os-settings-user-workspace-form { display: grid; gap: 9px; }
.os-settings-user-list { min-height: 0; display: grid; align-content: start; gap: 8px; overflow: auto; padding-right: 2px; }
.os-settings-user-card { display: grid; gap: 0; padding: 9px; border: 1px solid #e5e7eb; border-radius: 8px; background: var(--os-surface); box-shadow: 0 8px 18px rgba(15,23,42,.03); transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.os-settings-user-card:hover { transform: translateY(-1px); border-color: var(--os-text-muted); box-shadow: 0 14px 26px rgba(15,23,42,.06); }
.os-settings-user-card.is-active { border-color: var(--os-text-muted); background: var(--os-surface-raised); }
.os-settings-user-card-head { width: 100% !important; min-height: 32px !important; display: grid !important; grid-template-columns: 30px minmax(0, 1fr) 22px !important; align-items: center !important; gap: 9px !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--os-text) !important; font: inherit !important; text-align: left !important; box-shadow: none !important; cursor: pointer; }
.os-settings-user-card-head > span, .os-user-avatar-upload { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 999px; background: #0f172a; color: #fff; font-size: 10px; font-weight: 800; overflow: hidden; }
.os-user-avatar-upload { position: relative; cursor: pointer; }
.os-user-avatar-upload input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.os-user-avatar-upload:hover { outline: 2px solid rgba(15, 23, 42, .12); outline-offset: 2px; }
.os-settings-user-card-head strong, .os-settings-user-card-head small { min-width: 0; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.os-settings-user-card-head strong { color: var(--os-text); font-size: 13px; font-weight: 750; }
.os-settings-user-card-head small { margin-top: 1px; color: var(--os-text-muted); font-size: 11px; }
.os-settings-user-card-head em { width: 22px; height: 22px; display: grid; place-items: center; border: 1px solid #e5e7eb; border-radius: 6px; color: var(--os-text-muted); font-style: normal; font-size: 13px; font-weight: 650; }
.os-settings-user-card-body { display: grid; gap: 12px; padding-top: 12px; }
.os-settings-user-card-body[hidden] { display: none !important; }
.os-settings-user-card form { display: grid; gap: 8px; }
.os-settings-user-fields { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.os-settings-user-summary-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 8px; margin: 0; }
.os-settings-user-summary-grid > div { min-width: 0; padding: 8px 10px; border-left: 2px solid #dbe3ee; background: var(--os-surface-hover); }
.os-settings-user-summary-grid dt { margin: 0 0 3px; color: var(--os-text-muted); font-size: 10px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.os-settings-user-summary-grid dd { margin: 0; color: var(--os-text-strong); font-size: 12px; line-height: 1.35; overflow-wrap: anywhere; }
.os-settings-user-workspace-form { padding-top: 1px; border-top: 1px solid #edf1f5; }
.os-settings-user-workspace-form .os-settings-user-workspaces { padding-top: 11px; }
.os-settings-user-card footer { display: flex; justify-content: flex-end; gap: 8px; }
@media (max-width: 760px) {
  .os-settings-user-form { padding: 11px; gap: 10px; }
  .os-settings-user-form-fields { grid-template-columns: 1fr; gap: 8px; }
  .os-settings-user-workspace-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .os-settings-user-summary-grid { grid-template-columns: 1fr; }
}
.os-production-composer input[type="date"] { color: var(--os-text); }
.os-production-composer-field { align-content: start; position: relative; }
.os-production-sector-picker { position: relative; display: block; }
.os-production-sector-trigger { width: 100% !important; min-height: 38px !important; display: grid !important; grid-template-columns: minmax(0, 1fr) 16px !important; align-items: center !important; gap: 8px !important; padding: 0 10px !important; border: 1px solid #dfe3ea !important; border-radius: 7px !important; background: var(--os-surface) !important; color: var(--os-text) !important; font: inherit !important; font-size: 13px !important; font-weight: 400 !important; text-align: left !important; box-shadow: none !important; }
.os-production-sector-trigger span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.os-production-sector-trigger svg { width: 14px !important; height: 14px !important; color: var(--os-text) !important; }
.os-production-sector-menu { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: var(--os-layer-popover); display: grid; gap: 2px; max-height: 220px; overflow-y: auto; padding: 6px; border: 1px solid #e1e6ef; border-radius: 8px; background: var(--os-surface); box-shadow: 0 18px 42px rgba(15,23,42,.13); }
.os-production-sector-menu[hidden] { display: none !important; }
.os-production-sector-menu button:not(.os-production-inline-link) { width: 100% !important; min-height: 32px !important; display: flex !important; align-items: center !important; padding: 0 8px !important; border: 0 !important; border-radius: 6px !important; background: transparent !important; color: var(--os-text) !important; font: inherit !important; font-size: 13px !important; font-weight: 400 !important; text-align: left !important; box-shadow: none !important; }
.os-production-sector-menu button:not(.os-production-inline-link):hover { background: var(--os-surface-hover) !important; }
.os-production-inline-link { width: fit-content !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; display: inline-flex !important; align-items: center !important; margin: 4px 8px 2px !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: #2563eb !important; font: inherit !important; font-size: 12px !important; font-weight: 400 !important; line-height: 1.2 !important; text-align: left !important; box-shadow: none !important; }
.os-production-inline-link:hover { text-decoration: underline; }
.os-production-composer-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.os-production-composer-client { width: 100%; }
.os-production-client-link { display: flex; align-items: baseline; gap: 6px; min-width: 0; padding-left: 8px; border-left: 2px solid #cbd5e1; color: var(--os-text-muted); font-size: 11px; }
.os-production-client-link span { flex: 0 0 auto; }
.os-production-client-link strong { overflow: hidden; color: var(--os-text); font-size: 11px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.os-production-composer footer { display: flex; justify-content: flex-end; gap: 10px; padding-top: 8px; }
.os-traffic-report-page { width: 100%; min-height: 0; display: grid; align-content: start; gap: 16px; }
.os-traffic-reports { align-self: start; margin-left: var(--os-content-align-offset); width: calc(100% - var(--os-content-align-offset)); display: grid; gap: 16px; }
.os-traffic-reports-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.os-traffic-reports-head > div:first-child { display: grid; gap: 5px; }
.os-traffic-reports-head span { color: var(--os-text-muted); font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.os-traffic-reports-head h1 { margin: 0; color: var(--os-text); font-size: 26px; letter-spacing: -0.02em; }
.os-traffic-reports-head p { max-width: 720px; margin: 0; color: var(--os-text-muted); line-height: 1.55; }
.os-traffic-report-stats { display: grid; grid-template-columns: repeat(3, minmax(112px, 1fr)); gap: 10px; min-width: min(420px, 100%); }
.os-traffic-report-stats article { min-height: 72px; display: grid; align-content: center; gap: 5px; padding: 12px; border: 1px solid #e5e7eb; border-radius: 8px; background: var(--os-surface); box-shadow: 0 8px 18px rgba(15,23,42,.035); }
.os-traffic-report-stats strong { color: var(--os-text); font-size: 24px; letter-spacing: -0.02em; }
.os-traffic-report-stats span { color: var(--os-text-muted); font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; }
.os-traffic-report-layout { align-self: start; display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 16px; align-items: start; }
.os-traffic-client-list, .os-traffic-report-detail { border: 1px solid #e5e7eb; border-radius: 8px; background: var(--os-surface); box-shadow: 0 8px 20px rgba(15,23,42,.035); }
.os-traffic-client-list { display: grid; gap: 10px; padding: 12px; }
.os-traffic-client-list label { min-height: 38px; display: grid; grid-template-columns: 18px 1fr; align-items: center; gap: 9px; padding: 0 11px; border: 1px solid #dfe3ea; border-radius: 7px; color: var(--os-text-muted); }
.os-traffic-client-list label svg { width: 16px !important; height: 16px !important; }
.os-traffic-client-list input { min-width: 0; border: 0; outline: 0; background: transparent; color: var(--os-text); font: inherit; font-size: 13px; box-shadow: none !important; }
.os-traffic-client-list > div { display: grid; gap: 7px; max-height: 560px; overflow: auto; padding-right: 2px; }
.os-traffic-client-list button { min-height: 58px; display: grid; grid-template-columns: 34px 1fr; align-items: center; column-gap: 10px; padding: 9px 10px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--os-text); font: inherit; text-align: left; box-shadow: none !important; }
.os-traffic-client-list button:hover { border-color: var(--os-text-muted); background: var(--os-surface-hover); }
.os-traffic-client-list button.is-selected { border-color: var(--os-text-muted); background: var(--os-surface-hover); }
.os-traffic-client-list button > span { grid-row: span 2; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 999px; background: #0f172a; color: #fff; font-size: 11px; font-weight: 800; }
.os-traffic-client-list strong, .os-traffic-client-list small { min-width: 0; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.os-traffic-client-list strong { font-size: 13px; line-height: 1.2; }
.os-traffic-client-list small { color: var(--os-text-muted); font-size: 12px; line-height: 1.2; }
.os-traffic-report-detail { display: grid; gap: 14px; padding: 18px; }
.os-traffic-report-detail > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding-bottom: 14px; border-bottom: 1px solid #eef2f7; }
.os-traffic-report-detail > header span { color: var(--os-text-muted); font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.os-traffic-report-detail h2 { margin: 5px 0 0; color: var(--os-text); font-size: 24px; letter-spacing: -0.02em; }
.os-traffic-report-detail p { margin: 4px 0 0; color: var(--os-text-muted); }
.os-traffic-copy { min-height: 38px; display: inline-flex; align-items: center; gap: 8px; padding: 0 13px; border: 1px solid #111827; border-radius: 7px; background: #111827; color: #fff; font: inherit; font-size: 13px; font-weight: 650; box-shadow: none !important; white-space: nowrap; }
.os-traffic-copy svg { width: 16px !important; height: 16px !important; }
.os-traffic-platforms, .os-traffic-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.os-traffic-platforms article, .os-traffic-metrics article { display: grid; gap: 6px; padding: 13px; border: 1px solid #edf0f3; border-radius: 8px; background: var(--os-surface-raised); }
.os-traffic-platforms article { grid-column: span 2; }
.os-traffic-platforms span, .os-traffic-metrics span { color: var(--os-text-muted); font-size: 11px; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; }
.os-traffic-platforms strong { color: var(--os-text); font-size: 13px; line-height: 1.3; }
.os-traffic-platforms small { color: var(--os-text-muted); font-size: 12px; }
.os-traffic-metrics strong { color: var(--os-text); font-size: 22px; letter-spacing: -0.02em; }
.os-traffic-report-copy { display: grid; gap: 10px; padding: 14px; border: 1px solid #e5e7eb; border-radius: 8px; background: var(--os-surface); }
.os-traffic-report-copy header { display: flex; justify-content: space-between; align-items: center; gap: 12px; color: var(--os-text-muted); font-size: 12px; }
.os-traffic-report-copy header strong { color: var(--os-text); font-size: 14px; }
.os-traffic-report-copy pre { min-height: 230px; margin: 0; padding: 14px; overflow: auto; border: 1px solid #edf0f3; border-radius: 8px; background: var(--os-surface-hover); color: var(--os-text-muted); font: inherit; font-size: 13px; line-height: 1.55; white-space: pre-wrap; }
.os-dashboard-grid { display: grid; grid-template-columns: 1.25fr .75fr .7fr; gap: 16px; align-items: start; } .os-dashboard-grid .os-panel-card:first-child { grid-column: span 2; } .os-dashboard-grid .os-panel-card:nth-child(4) { grid-column: span 2; }
.os-dashboard-page { display: grid; gap: 16px; }
.os-dashboard-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-left: var(--os-content-align-offset); max-width: calc(100% - var(--os-content-align-offset)); }
.os-dashboard-actions { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; }
#vynorNextApp .os-workspace-dashboard .os-page { gap: 14px; align-content: start; grid-auto-rows: max-content; }
#vynorNextApp .os-workspace-dashboard .os-dashboard-page { gap: 14px; align-content: start; grid-auto-rows: max-content; }
#vynorNextApp .os-workspace-dashboard .os-dashboard-toolbar { min-height: 40px; margin-top: 0; align-items: center; }
#vynorNextApp .os-workspace-dashboard .os-dashboard-actions { min-height: 40px; align-items: center; }
#vynorNextApp .os-workspace-dashboard .os-submenu-tabs { margin-left: 0; grid-template-columns: repeat(3, 108px); grid-auto-columns: 108px; width: 326px; min-width: 326px; max-width: 326px; height: 36px; align-items: stretch; border-radius: 8px; }
#vynorNextApp .os-workspace-dashboard .os-submenu-tabs button { width: 108px; min-width: 108px; min-height: 34px; height: 34px; padding: 0 10px; gap: 6px; font-size: 12px; font-weight: 720; line-height: 1; }
#vynorNextApp .os-workspace-dashboard .os-submenu-tabs button svg { width: 14px !important; height: 14px !important; }
#vynorNextApp .os-workspace-dashboard .os-date-filter { height: 36px; min-height: 36px; padding: 0 10px; gap: 8px; border-radius: 7px; }
#vynorNextApp .os-workspace-dashboard .os-date-filter svg { width: 15px !important; height: 15px !important; }
#vynorNextApp .os-workspace-dashboard .os-date-filter span { display: grid; gap: 1px; line-height: 1.1; }
#vynorNextApp .os-workspace-dashboard .os-date-filter strong { font-size: 12px; }
#vynorNextApp .os-workspace-dashboard .os-date-filter small { font-size: 10px; color: var(--os-text-muted); }
#vynorNextApp .os-dashboard-date-control { position: relative; }
#vynorNextApp .os-dashboard-date-chevron { width: 14px !important; height: 14px !important; margin-left: 2px; color: var(--os-text-muted); transition: transform .16s ease, color .16s ease; }
#vynorNextApp .os-dashboard-date-chevron path { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
#vynorNextApp .os-dashboard-date-control.is-open .os-dashboard-date-chevron { transform: rotate(180deg); color: var(--os-text); }
#vynorNextApp .os-dashboard-date-popover { position: absolute; top: calc(100% + 8px); right: 0; z-index: 1750; width: 230px; display: grid; gap: 2px; padding: 8px; border: 1px solid #dfe3ea; border-radius: 8px; background: var(--os-surface); box-shadow: 0 18px 42px rgba(15,23,42,.14); }
#vynorNextApp .os-dashboard-date-popover[hidden] { display: none !important; }
#vynorNextApp .os-dashboard-date-popover button { width: 100%; min-height: 34px; display: grid; gap: 1px; padding: 5px 9px; border: 0; border-left: 2px solid transparent; border-radius: 0; background: var(--os-surface); color: var(--os-text); font: inherit; text-align: left; box-shadow: none !important; }
#vynorNextApp .os-dashboard-date-popover button:hover,
#vynorNextApp .os-dashboard-date-popover button[aria-selected="true"] { background: var(--os-surface-hover); border-left-color: var(--os-text); }
#vynorNextApp .os-workspace-dashboard .os-dashboard-date-popover button { min-height: 34px !important; padding: 5px 9px !important; border: 0 !important; border-left: 2px solid transparent !important; border-radius: 0 !important; background: var(--os-surface) !important; color: var(--os-text) !important; box-shadow: none !important; }
#vynorNextApp .os-workspace-dashboard .os-dashboard-date-popover button:hover,
#vynorNextApp .os-workspace-dashboard .os-dashboard-date-popover button[aria-selected="true"] { background: var(--os-surface-hover) !important; border-left-color: var(--os-text) !important; color: var(--os-text) !important; }
#vynorNextApp .os-dashboard-date-popover strong { font-size: 12px; font-weight: 650; }
#vynorNextApp .os-dashboard-date-popover span { color: var(--os-text-muted); font-size: 11px; }
#vynorNextApp .os-dashboard-date-custom { display: grid; gap: 7px; margin-top: 6px; padding: 8px; border-top: 1px solid #eef2f7; }
#vynorNextApp .os-dashboard-date-custom > strong { color: var(--os-text-muted); font-size: 11px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
#vynorNextApp .os-dashboard-date-custom label { display: grid; gap: 3px; color: var(--os-text-muted); font-size: 11px; }
#vynorNextApp .os-dashboard-date-custom input { width: 100%; min-height: 30px; padding: 0 7px; border: 1px solid #dfe3ea; border-radius: 6px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 12px; }
#vynorNextApp .os-workspace-dashboard .os-dashboard-date-custom button { min-height: 30px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 9px !important; border: 1px solid #dfe3ea !important; border-radius: 6px !important; background: var(--os-surface) !important; color: var(--os-text) !important; font: inherit !important; font-size: 12px !important; font-weight: 650 !important; box-shadow: none !important; }
#vynorNextApp .os-workspace-dashboard .os-dashboard-date-custom button:hover { background: var(--os-surface-hover) !important; border-color: var(--os-text-muted) !important; }
#vynorNextApp .os-workspace-dashboard .os-gear-button { width: 36px; height: 36px; min-height: 36px; }
.os-workspace-dashboard .os-submenu-tabs button.is-active { background: #111827 !important; color: #fff !important; }
.os-workspace-dashboard .os-link-button, .os-workspace-dashboard .os-activity button { color: var(--os-text-muted) !important; }
.os-dashboard-stat-grid { align-items: stretch; }
.os-dashboard-card { position: relative; cursor: pointer; text-align: left; }
.os-dashboard-card:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
.os-dashboard-metric-card { min-height: 118px; display: grid; grid-template-columns: minmax(0, 1fr) 48px; align-content: start; gap: 10px 14px; padding: 18px 20px; border: 1px solid #e5e7eb; border-radius: 8px; background: var(--os-surface); color: var(--os-text); font: inherit; box-shadow: 0 8px 20px rgba(15,23,42,.035); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease; }
.os-dashboard-metric-card:hover { transform: translateY(-3px); border-color: var(--os-text-muted); background: linear-gradient(180deg, #fff, #fbfcff); box-shadow: 0 18px 38px rgba(15,23,42,.09); }
.os-dashboard-metric-card > span { grid-column: 1; color: var(--os-text-muted); font-size: 13px; }
.os-dashboard-metric-card > strong { grid-column: 1; display: block; font-size: 25px; letter-spacing: -0.02em; }
.os-dashboard-metric-card > em { grid-column: 1; color: #16a34a; font-size: 12px; font-style: normal; }
.os-dashboard-metric-card.red > em { color: #b91c1c; }
.os-dashboard-metric-card figure { grid-column: 2; grid-row: 1 / span 3; align-self: start; width: 46px; height: 46px; display: grid; place-items: center; margin: 0; border-radius: 999px; background: #dcfce7; color: #16a34a; transition: transform .18s ease; }
.os-dashboard-metric-card:hover figure { transform: scale(1.06); }
.os-dashboard-metric-card.red figure { background: #fee2e2; color: #ef4444; }
.os-dashboard-metric-card.purple figure { background: #ede9fe; color: #7c3aed; }
.os-dashboard-panel-card { overflow: hidden; }
.os-dashboard-panel-card > button { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; border: 0; background: transparent; color: transparent; box-shadow: none !important; }
.os-dashboard-panel-card header, .os-dashboard-panel-card > :not(button) { position: relative; z-index: 1; }
.os-dashboard-card-toggle-list { display: grid; gap: 8px; overflow: auto; padding-right: 2px; }
.os-dashboard-card-toggle { min-height: 42px; display: grid; grid-template-columns: 18px minmax(0, 1fr); align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid #e5e7eb; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font-size: 13px; font-weight: 600; }
.os-dashboard-card-toggle:hover { background: var(--os-surface-hover); border-color: var(--os-text-muted); }
.os-dashboard-card-toggle input { width: 15px; height: 15px; accent-color: var(--os-text); }
.os-dashboard-config-drawer { width: min(360px, calc(100vw - 24px)); grid-template-rows: auto auto minmax(0, 1fr); gap: 14px; padding: 18px; }
.os-dashboard-config-drawer header { gap: 12px; }
.os-dashboard-config-drawer header strong { margin-top: 3px; font-size: 17px; letter-spacing: -0.01em; }
.os-dashboard-config-drawer header button { width: 30px; height: 30px; font-size: 18px; }
.os-dashboard-config-drawer p { font-size: 13px; line-height: 1.45; }
.os-dashboard-config-drawer .os-dashboard-card-toggle-list { display: flex; flex-direction: column; align-content: start; gap: 0; }
.os-dashboard-config-drawer .os-dashboard-card-toggle { min-height: 26px; grid-template-columns: 15px minmax(0, 1fr); gap: 7px; margin: 0; padding: 3px 2px; border: 0; border-bottom: 1px solid #eef2f7; border-radius: 0; background: transparent; font-size: 12px; font-weight: 520; }
.os-dashboard-config-drawer .os-dashboard-card-toggle input { width: 13px; height: 13px; }
.os-dashboard-custom-widget-section { display: grid; gap: 10px; padding-top: 10px; border-top: 1px solid #e5e7eb; }
.os-dashboard-custom-widget-section header { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; overflow: hidden; }
.os-dashboard-custom-widget-section header div { min-width: 0; display: grid; gap: 2px; }
.os-dashboard-custom-widget-section header strong { font-size: 13px; letter-spacing: -0.01em; }
.os-dashboard-custom-widget-section header span { color: var(--os-text-muted); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.os-dashboard-custom-widget-add-toggle { min-height: 32px; width: fit-content; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; padding: 0 11px; border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 12px; font-weight: 650; white-space: nowrap; box-shadow: none !important; }
.os-dashboard-custom-widget-add-toggle:hover { background: var(--os-surface-hover); border-color: var(--os-text-muted); }
.os-dashboard-custom-widget-form { display: grid; gap: 7px; }
.os-dashboard-custom-widget-form[hidden] { display: none !important; }
.os-dashboard-custom-widget-form input,
.os-dashboard-custom-widget-form select { width: 100%; min-height: 31px; padding: 0 9px; border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 12px; }
.os-dashboard-custom-widget-form button,
.os-dashboard-custom-widget-row button { min-height: 28px; padding: 0 10px; border: 1px solid #dfe3ea; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 12px; font-weight: 650; box-shadow: none; }
.os-dashboard-custom-widget-form button:hover,
.os-dashboard-custom-widget-row button:hover { background: var(--os-surface-hover); border-color: var(--os-text-muted); }
.os-dashboard-custom-widget-list { display: grid; gap: 0; }
.os-dashboard-custom-widget-list[hidden] { display: none !important; }
.os-dashboard-custom-widget-row { min-height: 32px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 8px; align-items: center; padding: 5px 0; border-bottom: 1px solid #eef2f7; }
.os-dashboard-custom-widget-row span { font-size: 12px; font-weight: 650; color: var(--os-text); }
.os-dashboard-custom-widget-row small { grid-column: 1; color: var(--os-text-muted); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.os-dashboard-custom-widget-row button { grid-column: 2; grid-row: 1 / span 2; color: var(--os-text-muted); }
.os-dashboard-custom-widget-list p { margin: 0; color: var(--os-text-muted); font-size: 12px; }
.os-workspace-dashboard .os-funnel-shape span:nth-child(1){background:#111827}
.os-workspace-dashboard .os-funnel-shape span:nth-child(2){background:#334155}
.os-workspace-dashboard .os-funnel-shape span:nth-child(3){background:#64748b}
.os-workspace-dashboard .os-funnel-shape span:nth-child(4){background:#93c5fd}
.os-workspace-dashboard .os-funnel-shape span:nth-child(5){background:#22c55e}
.os-workspace-dashboard .os-activity-icon.orange { background: var(--os-surface-hover); color: var(--os-text-muted); }
.os-workspace-dashboard .os-activity-icon.slate { background: var(--os-surface-hover); color: var(--os-text-muted); }
.os-workspace-dashboard .os-table td span { background: var(--os-surface-hover); color: var(--os-text-muted); border-radius: 6px; }
.os-dashboard-preview-backdrop { position: fixed; inset: 0; z-index: var(--os-layer-backdrop); background: rgba(15,23,42,.26); backdrop-filter: blur(2px); animation: osFadeIn .16s ease both; }
.os-dashboard-preview { position: fixed; top: 50%; left: 50%; z-index: var(--os-layer-modal); width: min(640px, calc(100vw - 40px)); height: min(540px, calc(100vh - 40px)); display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 16px; padding: 20px; border: 1px solid #dfe3ea; border-radius: 10px; background: var(--os-surface); box-shadow: 0 32px 90px rgba(15,23,42,.22); transform: translate(-50%, -50%); animation: osTaskSpotlightIn .18s ease both; }
.os-dashboard-preview header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.os-dashboard-preview header span { display: block; color: var(--os-text-muted); font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.os-dashboard-preview header strong { display: block; margin-top: 6px; color: #162033; font-size: 18px; font-weight: 650; }
.os-dashboard-preview header button { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid #e2e8f0; border-radius: 8px; background: var(--os-surface); color: var(--os-text-muted); font: inherit; font-size: 20px; box-shadow: 0 4px 10px rgba(15,23,42,.035) !important; }
.os-dashboard-preview-body { min-height: 0; overflow: auto; display: grid; align-content: start; gap: 14px; padding: 14px; border: 1px solid #edf0f3; border-radius: 8px; background: var(--os-surface-raised); }
.os-dashboard-preview-body p { margin: 0; color: var(--os-text-muted); line-height: 1.55; }
#vynorNextApp .os-workspace-dashboard .os-dashboard-metric-card { background: var(--os-surface) !important; color: var(--os-text) !important; border-color: var(--os-border) !important; border-radius: 8px !important; box-shadow: 0 8px 20px rgba(15,23,42,.035) !important; }
#vynorNextApp .os-workspace-dashboard .os-dashboard-metric-card:hover { background: var(--os-surface-raised) !important; border-color: var(--os-border-strong) !important; box-shadow: var(--os-shadow) !important; }
#vynorNextApp .os-workspace-dashboard .os-dashboard-panel-card > button { background: transparent !important; color: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
#vynorNextApp .os-workspace-dashboard .os-dashboard-panel-card { background: var(--os-surface) !important; color: var(--os-text) !important; border-color: var(--os-border) !important; }
#vynorNextApp .os-workspace-dashboard .os-gear-button { background: var(--os-surface) !important; color: var(--os-text-muted) !important; border-color: var(--os-border) !important; border-radius: 7px !important; box-shadow: none !important; }
#vynorNextApp .os-workspace-dashboard .os-gear-button:hover,
#vynorNextApp .os-workspace-dashboard .os-gear-button.is-active { background: var(--os-surface-hover) !important; color: var(--os-text) !important; border-color: var(--os-border-strong) !important; box-shadow: none !important; }
#vynorNextApp .os-workspace-dashboard .os-widget-drawer-backdrop { z-index: var(--os-layer-backdrop) !important; }
#vynorNextApp .os-page:has(.os-dashboard-config-drawer) { position: relative !important; z-index: var(--os-layer-modal) !important; }
#vynorNextApp .os-dashboard-config-drawer { width: min(320px, calc(100vw - 24px)) !important; z-index: var(--os-layer-drawer) !important; gap: 10px !important; padding: 14px 16px !important; }
#vynorNextApp .os-dashboard-config-drawer header button { width: 30px !important; height: 30px !important; min-height: 30px !important; padding: 0 !important; background: var(--os-control) !important; color: var(--os-text) !important; border-color: var(--os-border) !important; border-radius: 7px !important; box-shadow: none !important; }
#vynorNextApp .os-dashboard-config-drawer .os-dashboard-card-toggle { min-height: 26px !important; margin: 0 !important; padding: 3px 2px !important; background: transparent !important; color: var(--os-text) !important; border: 0 !important; border-bottom: 1px solid var(--os-border) !important; border-radius: 0 !important; box-shadow: none !important; }
#vynorNextApp .os-dashboard-config-drawer .os-dashboard-card-toggle:hover { background: var(--os-surface-hover) !important; }
#vynorNextApp .os-dashboard-config-drawer { width: min(360px, calc(100vw - 24px)) !important; }
.os-dashboard-widget-marketplace { display: grid; gap: 12px; min-height: 0; overflow: auto; padding: 10px 0 2px; border-top: 1px solid #eef2f7; }
.os-dashboard-widget-tabs { display: flex; align-items: center; gap: 10px; min-height: 28px; border-bottom: 1px solid #e5e7eb; overflow-x: auto; }
.os-dashboard-widget-tabs button { min-height: 28px; padding: 0; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; color: var(--os-text-muted); font: inherit; font-size: 11px; font-weight: 620; white-space: nowrap; box-shadow: none; }
.os-dashboard-widget-tabs button.is-active { border-bottom-color: #2563eb; color: #1d4ed8; }
.os-dashboard-widget-search { min-height: 34px; display: grid; grid-template-columns: 16px minmax(0, 1fr); align-items: center; gap: 8px; padding: 0 10px; border: 1px solid #cfd6e3; border-radius: 5px; background: var(--os-surface); color: var(--os-text-muted); }
.os-dashboard-widget-search svg { width: 15px; height: 15px; }
.os-dashboard-widget-search input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--os-text); font: inherit; font-size: 12px; }
.os-dashboard-widget-chart-types { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; }
.os-dashboard-widget-chart-types span { flex-basis: 100%; color: var(--os-text-muted); font-size: 12px; font-weight: 650; }
.os-dashboard-widget-chart-types button { min-width: 26px; min-height: 24px; padding: 0 7px; border: 1px solid #cfd6e3; border-radius: 4px; background: var(--os-surface); color: var(--os-text-muted); font: inherit; font-size: 11px; box-shadow: none; }
.os-dashboard-widget-chart-types button.is-active { border-color: #2563eb; color: #1d4ed8; }
.os-dashboard-widget-categories { display: grid; gap: 0; }
.os-dashboard-widget-category { border-bottom: 1px solid #eef2f7; }
.os-dashboard-widget-category-button { width: 100%; min-height: 36px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 2px; border: 0; border-radius: 0; background: transparent; color: var(--os-text); font: inherit; font-size: 13px; font-weight: 660; text-align: left; box-shadow: none; }
.os-dashboard-widget-category-button span { min-width: 0; display: inline-flex; align-items: center; gap: 7px; }
.os-dashboard-widget-category-button i { width: 12px; display: inline-grid; place-items: center; color: var(--os-text-muted); font-style: normal; font-size: 11px; }
.os-dashboard-widget-category-button:hover { background: var(--os-surface-hover); }
.os-dashboard-widget-category-button em { min-width: 24px; height: 24px; display: grid; place-items: center; border-radius: 999px; background: #dcfce7; color: #059669; font-style: normal; font-size: 11px; font-weight: 760; }
.os-dashboard-widget-template-list { display: grid; gap: 6px; padding: 0 0 10px 0; }
.os-dashboard-widget-template-list p { margin: 0 0 4px; color: var(--os-text-muted); font-size: 12px; }
.os-dashboard-widget-template-card { width: 100%; min-height: 50px; display: grid; grid-template-columns: 32px minmax(0, 1fr); grid-template-rows: auto auto; align-items: center; gap: 1px 8px; padding: 7px 9px; border: 1px solid #e1e7ef; border-radius: 6px; background: var(--os-surface); color: var(--os-text); text-align: left; box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.os-dashboard-widget-template-card:hover { border-color: var(--os-text-muted); transform: translateY(-1px); box-shadow: 0 8px 18px rgba(15,23,42,.08); }
.os-dashboard-widget-template-card > span { grid-row: 1 / span 2; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; background: #dcfce7; color: #059669; }
.os-dashboard-widget-template-card > span svg { width: 16px; height: 16px; }
.os-dashboard-widget-template-card strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--os-text); font-size: 12px; font-weight: 700; }
.os-dashboard-widget-template-card small { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--os-text-muted); font-size: 11px; }
#vynorNextApp .os-dashboard-widget-tabs button { background: transparent !important; color: var(--os-text-muted) !important; border: 0 !important; border-bottom: 2px solid transparent !important; border-radius: 0 !important; box-shadow: none !important; min-height: 30px !important; padding: 0 !important; }
#vynorNextApp .os-dashboard-widget-tabs button.is-active { border-bottom-color: #2563eb !important; color: #1d4ed8 !important; }
#vynorNextApp .os-dashboard-widget-chart-types button { background: var(--os-surface) !important; color: var(--os-text-muted) !important; border: 1px solid #cfd6e3 !important; border-radius: 4px !important; box-shadow: none !important; min-height: 26px !important; padding: 0 8px !important; }
#vynorNextApp .os-dashboard-widget-chart-types button.is-active { border-color: #2563eb !important; color: #1d4ed8 !important; }
#vynorNextApp .os-dashboard-widget-category-button { background: transparent !important; color: var(--os-text) !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; min-height: 40px !important; padding: 0 2px !important; }
#vynorNextApp .os-dashboard-widget-category-button:hover { background: var(--os-surface-hover) !important; }
#vynorNextApp .os-dashboard-widget-template-card { background: var(--os-surface) !important; color: var(--os-text) !important; border: 1px solid #e1e7ef !important; border-radius: 6px !important; box-shadow: 0 1px 2px rgba(15,23,42,.04) !important; }
#vynorNextApp .os-dashboard-widget-template-card:hover { border-color: var(--os-text-muted) !important; box-shadow: 0 8px 18px rgba(15,23,42,.08) !important; }
#vynorNextApp .os-dashboard-custom-widget-form button { background: var(--os-surface) !important; color: var(--os-text) !important; border: 1px solid #dfe3ea !important; border-radius: 7px !important; box-shadow: none !important; }
#vynorNextApp .os-dashboard-custom-widget-add-toggle { background: var(--os-surface) !important; color: var(--os-text) !important; border: 1px solid #dfe3ea !important; border-radius: 7px !important; box-shadow: none !important; }
#vynorNextApp .os-dashboard-custom-widget-section header button.os-dashboard-custom-widget-add-toggle { width: auto !important; min-width: 64px !important; max-width: none !important; height: 32px !important; min-height: 32px !important; padding: 0 11px !important; }
#vynorNextApp .os-dashboard-custom-widget-add-toggle:hover { background: var(--os-surface-hover) !important; border-color: var(--os-text-muted) !important; }
.os-dashboard-widget-panel-list { display: grid; gap: 6px; }
.os-dashboard-widget-panel-list button { width: 100%; min-height: 46px; display: grid; align-content: center; gap: 2px; padding: 7px 9px; border: 1px solid #e1e7ef; border-radius: 6px; background: var(--os-surface); color: var(--os-text); font: inherit; text-align: left; box-shadow: none; }
.os-dashboard-widget-panel-list button:hover,
.os-dashboard-widget-panel-list button.is-selected { background: var(--os-surface-hover); border-color: var(--os-text-muted); }
.os-dashboard-widget-panel-list strong { font-size: 12px; font-weight: 700; }
.os-dashboard-widget-panel-list small { color: var(--os-text-muted); font-size: 11px; line-height: 1.3; }
#vynorNextApp .os-dashboard-widget-panel-list button { background: var(--os-surface) !important; color: var(--os-text) !important; border: 1px solid #e1e7ef !important; border-radius: 6px !important; box-shadow: none !important; }
#vynorNextApp .os-dashboard-widget-panel-list button:hover,
#vynorNextApp .os-dashboard-widget-panel-list button.is-selected { background: var(--os-surface-hover) !important; border-color: var(--os-text-muted) !important; }
.os-panel-card { padding: 18px; } .os-panel-card header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; } .os-panel-card h2 { margin: 0; font-size: 15px; letter-spacing: -0.01em; } .os-mini-select { min-height: 30px; padding: 0 10px; font-size: 12px; }
.os-chart { min-height: 250px; display: grid; grid-template-rows: 1fr auto; }
.os-chart svg { width: 100%; height: 220px; display: block; overflow: visible; }
#vynorNextApp .os-chart .grid line { stroke: #e5e7eb !important; }
#vynorNextApp .os-chart .os-chart-area { fill: url(#vynorChartFill) !important; stroke: none !important; }
#vynorNextApp .os-chart .os-chart-line { fill: none !important; stroke: #2563eb !important; stroke-width: 4 !important; }
#vynorNextApp .os-chart circle { fill: #2563eb !important; stroke: #fff !important; stroke-width: 2 !important; }
.os-chart-labels { display: flex; justify-content: space-between; color: var(--os-text-muted); font-size: 12px; padding: 0 10px; }
.os-ranking { display: grid; gap: 14px; } .os-ranking div { display: grid; grid-template-columns: 28px 1fr auto auto; gap: 10px; align-items: center; padding: 6px; margin: -6px; border-radius: 7px; transition: transform .16s ease, background .16s ease; } .os-ranking div:hover { transform: translateX(3px); background: var(--os-surface-hover); } .os-ranking em { font-style: normal; font-weight: 700; } .os-ranking small { color: #16a34a; }
.os-activity { display: grid; gap: 12px; } .os-activity > div { display: grid; grid-template-columns: 34px 1fr auto; gap: 10px; align-items: center; padding: 6px; margin: -6px; border-radius: 7px; transition: transform .16s ease, background .16s ease; } .os-activity > div:hover { transform: translateX(3px); background: var(--os-surface-hover); } .os-activity p { margin: 0; } .os-activity strong, .os-activity small { display: block; } .os-activity strong { font-size: 12px; } .os-activity small, .os-activity em { color: var(--os-text-muted); font-size: 12px; font-style: normal; } .os-activity button, .os-link-button { border: 0; background: transparent; color: var(--os-accent); font-weight: 700; padding-top: 12px; box-shadow: none !important; }
.os-activity-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: var(--os-surface-hover); } .os-activity-icon.green { background: #dcfce7; color: #16a34a; } .os-activity-icon.blue { background: #dbeafe; color: #2563eb; } .os-activity-icon.orange { background: var(--os-accent-soft); color: var(--os-accent); } .os-activity-icon.purple { background: #ede9fe; color: #7c3aed; }
.os-table { width: 100%; border-collapse: collapse; } .os-table th, .os-table td { padding: 11px 8px; border-bottom: 1px solid #edf0f3; text-align: left; font-size: 13px; } .os-table th { color: var(--os-text-muted); font-weight: 700; } .os-table tbody tr { transition: background .16s ease, transform .16s ease; } .os-table td span { padding: 4px 9px; border-radius: 999px; background: var(--os-accent-soft); color: var(--os-accent); }
.os-funnel { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: center; } .os-funnel-shape { display: grid; gap: 0; } .os-funnel-shape span { height: 34px; clip-path: polygon(0 0,100% 0,88% 100%,12% 100%); } .os-funnel-shape span:nth-child(1){background:#ff2a0a}.os-funnel-shape span:nth-child(2){background:#ff6b1a}.os-funnel-shape span:nth-child(3){background:#f59e0b}.os-funnel-shape span:nth-child(4){background:#60a5fa}.os-funnel-shape span:nth-child(5){background:#22c55e} .os-funnel ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; } .os-funnel li { display: flex; justify-content: space-between; gap: 10px; color: var(--os-text-muted); font-size: 13px; } .os-funnel p { grid-column: 1 / -1; text-align: center; color: var(--os-text-muted); } .os-funnel p strong { color: #16a34a; }
.os-simple-list { display: grid; gap: 12px; } .os-simple-list div { padding: 12px; border: 1px solid #edf0f3; border-radius: 8px; transition: transform .16s ease, border-color .16s ease, background .16s ease; } .os-simple-list div:hover { transform: translateY(-2px); border-color: var(--os-text-muted); background: var(--os-surface-hover); } .os-simple-list strong, .os-simple-list span { display: block; } .os-simple-list span, .os-panel-copy { color: var(--os-text-muted); line-height: 1.6; }
.os-widget-picker { display: flex; flex-wrap: wrap; gap: 10px; }
.os-widget-picker button { min-height: 38px; display: inline-flex; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid #e5e7eb; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 13px; font-weight: 800; box-shadow: none !important; transition: transform .16s ease, border-color .16s ease, background .16s ease; }
.os-widget-picker button:hover:not(:disabled) { transform: translateY(-2px); border-color: var(--os-text-muted); background: var(--os-surface-hover); }
.os-widget-picker button:disabled { opacity: .45; cursor: default; }
.os-widget-picker svg { width: 16px !important; height: 16px !important; color: var(--os-text); }
.os-widget-drawer-backdrop { position: fixed; inset: 0; z-index: var(--os-layer-backdrop); background: rgba(15,23,42,.18); backdrop-filter: blur(2px); animation: osFadeIn .18s ease both; }
.os-widget-drawer { position: fixed; top: 0; right: 0; bottom: 0; z-index: var(--os-layer-drawer); width: min(420px, calc(100vw - 24px)); display: grid; grid-template-rows: auto auto 1fr; gap: 18px; padding: 22px; border-left: 1px solid #e5e7eb; background: var(--os-surface); box-shadow: -24px 0 60px rgba(15,23,42,.16); animation: osDrawerIn .22s ease both; }
.os-widget-drawer header { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.os-widget-drawer header span { display: block; color: var(--os-text-muted); font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.os-widget-drawer header strong { display: block; margin-top: 5px; color: var(--os-text); font-size: 20px; letter-spacing: -0.02em; }
.os-widget-drawer header button { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid #e5e7eb; border-radius: 7px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 22px; line-height: 1; box-shadow: none !important; }
.os-widget-drawer p { margin: 0; color: var(--os-text-muted); line-height: 1.55; }
.os-widget-drawer .os-widget-picker { display: grid; align-content: start; gap: 10px; overflow: auto; padding-right: 2px; }
.os-widget-drawer .os-widget-picker button { width: 100%; min-height: 46px; justify-content: flex-start; padding: 0 14px; }
.os-widget-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.os-widget-remove { border: 0; background: transparent; color: var(--os-text-muted); font: inherit; font-size: 12px; font-weight: 800; box-shadow: none !important; }
.os-widget-kpi { display: grid; gap: 8px; min-height: 96px; align-content: center; }
.os-widget-kpi strong { font-size: 30px; letter-spacing: -0.03em; }
.os-widget-kpi span { color: var(--os-text-muted); line-height: 1.55; }
#vynorNextApp .os-nav button:not(.active):not(.os-settings),
#vynorNextApp .os-account-main {
  background: transparent !important;
  border-color: rgba(255,255,255,.18) !important;
  color: #fff !important;
  box-shadow: none !important;
}
#vynorNextApp .os-settings {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(255,255,255,.16) !important;
  color: rgba(255,255,255,.88) !important;
  box-shadow: none !important;
}
#vynorNextApp .os-settings:hover {
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
}
#vynorNextApp .os-account-main {
  background: rgba(255,255,255,.04) !important;
  border-bottom: 1px solid rgba(255,255,255,.18) !important;
}
#vynorNextApp .os-nav button:not(.active):hover {
  background: rgba(255,255,255,.08) !important;
}
#vynorNextApp .os-nav button.active {
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
  border-color: transparent !important;
}
#vynorNextApp .os-primary {
  background: var(--os-accent) !important;
  border-color: var(--os-accent) !important;
  color: #fff !important;
}
#vynorNextApp .os-date-filter,
#vynorNextApp .os-mini-select,
#vynorNextApp .os-top-actions button {
  background: var(--os-surface) !important;
  border-color: var(--os-text-muted) !important;
  color: var(--os-text) !important;
  box-shadow: none !important;
}
#vynorNextApp .os-top-actions button {
  border: 0 !important;
  background: transparent !important;
}
#vynorNextApp .os-activity button,
#vynorNextApp .os-link-button {
  background: transparent !important;
  border: 0 !important;
  color: #1d4ed8 !important;
}
#vynorNextApp .os-submenu-tabs button.is-active {
  background: #111827 !important;
  color: #fff !important;
}
#vynorNextApp .os-workspace-production .os-page {
  gap: 10px;
  align-content: start;
  grid-auto-rows: max-content;
}
#vynorNextApp .os-workspace-production .os-submenu-tabs button.is-active {
  background: #111827 !important;
  color: #fff !important;
}
#vynorNextApp .os-workspace-production .os-production-select,
#vynorNextApp .os-workspace-production .os-production-filter {
  background: var(--os-surface) !important;
  border-color: var(--os-text-muted) !important;
  color: var(--os-text) !important;
}
#vynorNextApp .os-workspace-production .os-production-filter.is-active,
#vynorNextApp .os-workspace-production .os-production-filter:hover,
#vynorNextApp .os-workspace-production .os-production-select.is-active,
#vynorNextApp .os-workspace-production .os-production-select:hover {
  background: var(--os-surface-hover) !important;
  border-color: var(--os-text-muted) !important;
  color: var(--os-text) !important;
}
#vynorNextApp .os-overlay-root { position: fixed; inset: 0; z-index: var(--os-layer-popover); pointer-events: none; }
#vynorNextApp .os-overlay-root > :is(.os-overlay-popover, .os-overlay-backdrop, .os-overlay-drawer, .os-overlay-modal, .os-overlay-nested-modal) { pointer-events: auto; }
#vynorNextApp .os-overlay-popover { z-index: var(--os-layer-popover); }
#vynorNextApp .os-overlay-backdrop { z-index: var(--os-layer-backdrop); }
#vynorNextApp .os-overlay-drawer { z-index: var(--os-layer-drawer); }
#vynorNextApp .os-overlay-modal { z-index: var(--os-layer-modal); }
#vynorNextApp .os-overlay-nested-modal { z-index: var(--os-layer-nested-modal); }
#vynorNextApp .os-workspace-production .os-production-toolbar :is(.os-production-filter, .os-primary) {
  min-height: 34px !important;
  height: 34px !important;
  gap: 7px !important;
  padding: 0 10px !important;
  font-size: 13px !important;
}
#vynorNextApp .os-workspace-production .os-production-toolbar :is(.os-production-filter, .os-primary) svg {
  width: 16px !important;
  height: 16px !important;
}
#vynorNextApp .os-workspace-production .os-production-sort-trigger.is-active {
  background: #eff6ff !important;
  border-color: #93c5fd !important;
  color: #2563eb !important;
}
#vynorNextApp .os-workspace-production .os-production-sort-direction,
#vynorNextApp .os-workspace-production .os-production-sort-direction:hover {
  background: var(--os-surface-hover) !important;
  border-color: var(--os-text-muted) !important;
  color: var(--os-text-muted) !important;
}
#vynorNextApp .os-workspace-production [data-production-clear-sort] {
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--os-text-muted) !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  box-shadow: none !important;
}
#vynorNextApp .os-workspace-production .os-production-sort-direction svg {
  color: var(--os-text-muted) !important;
}
#vynorNextApp .os-workspace-production [data-production-sector-toggle] {
  width: 100% !important;
  min-height: 38px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 16px !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 10px !important;
  border: 1px solid #dfe3ea !important;
  border-radius: 7px !important;
  background: var(--os-surface) !important;
  color: var(--os-text) !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  box-shadow: none !important;
}
#vynorNextApp .os-workspace-production [data-production-sector-toggle]:hover,
#vynorNextApp .os-workspace-production [data-production-sector-toggle][aria-expanded="true"] {
  border-color: var(--os-text-muted) !important;
  background: var(--os-surface) !important;
  color: var(--os-text) !important;
}
#vynorNextApp .os-workspace-production [data-production-sector-option] {
  width: 100% !important;
  min-height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: 0 9px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  color: var(--os-text) !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  box-shadow: none !important;
}
#vynorNextApp .os-workspace-production [data-production-sector-option]:hover {
  background: var(--os-surface-hover) !important;
  color: var(--os-text) !important;
}
#vynorNextApp .os-workspace-production [data-production-sector-option][aria-selected="true"] {
  background: var(--os-surface-hover) !important;
  color: var(--os-text-strong) !important;
}
#vynorNextApp .os-workspace-production .os-production-composer .os-drawer-close,
#vynorNextApp .os-workspace-production .os-production-composer .os-drawer-close:hover {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 0 2px !important;
  border-radius: 8px !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
}
#vynorNextApp .os-workspace-production .os-production-composer .os-drawer-close {
  border: 1px solid #e2e8f0 !important;
  background: var(--os-surface) !important;
  color: var(--os-text-muted) !important;
  box-shadow: 0 4px 10px rgba(15,23,42,.035) !important;
}
#vynorNextApp .os-workspace-production .os-production-composer .os-drawer-close:hover {
  border-color: var(--os-text-muted) !important;
  background: var(--os-surface-hover) !important;
  color: var(--os-text) !important;
  box-shadow: 0 8px 18px rgba(15,23,42,.08) !important;
}
#vynorNextApp .os-production-task-spotlight .os-production-task-spotlight-actions .os-drawer-close,
#vynorNextApp .os-production-task-spotlight .os-production-task-spotlight-actions .os-drawer-close:hover,
#vynorNextApp .os-production-task-spotlight .os-production-task-spotlight-actions button.os-drawer-close {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 0 2px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  background: var(--os-surface) !important;
  color: var(--os-text-muted) !important;
  font: inherit !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  box-shadow: 0 4px 10px rgba(15,23,42,.035) !important;
}
#vynorNextApp .os-production-task-spotlight .os-production-task-spotlight-actions .os-drawer-close:hover {
  transform: translateY(-1px);
  border-color: var(--os-text-muted) !important;
  background: var(--os-surface-hover) !important;
  color: var(--os-text) !important;
  box-shadow: 0 8px 18px rgba(15,23,42,.08) !important;
}
#vynorNextApp .os-workspace-production .os-production-sector-menu .os-production-inline-link,
#vynorNextApp .os-workspace-production .os-production-sector-menu .os-production-inline-link:hover {
  width: fit-content !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  margin: 4px 8px 2px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #2563eb !important;
  font: inherit !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  box-shadow: none !important;
}
#vynorNextApp .os-workspace-production .os-production-sector-menu .os-production-inline-link:hover {
  text-decoration: underline;
}
#vynorNextApp .os-workspace-production .os-production-task header button {
  background: transparent !important;
  border: 0 !important;
  color: var(--os-text-muted) !important;
}
#vynorNextApp .os-workspace-production .os-production-task header button:hover {
  background: #fef2f2 !important;
  color: #b91c1c !important;
}
#vynorNextApp .os-workspace-production .os-production-add {
  width: fit-content;
  min-height: 34px;
  padding: 0 8px;
  background: transparent !important;
  border: 0 !important;
  color: var(--os-text-muted) !important;
}
#vynorNextApp .os-workspace-production .os-production-add:hover {
  background: var(--os-surface-hover) !important;
  color: var(--os-text) !important;
}
#vynorNextApp .os-workspace-production .os-production-column.amber > header span {
  background: #94a3b8;
  box-shadow: 0 0 0 4px #f1f5f9;
  opacity: 1;
}
#vynorNextApp .os-workspace-production .os-production-task footer strong.high,
#vynorNextApp .os-production-task-spotlight-meta span.high { color: #dc2626; }
#vynorNextApp .os-workspace-production .os-production-task footer strong.high::before { content: "↑"; margin-right: 4px; }
#vynorNextApp .os-workspace-production .os-production-task footer strong.medium,
#vynorNextApp .os-production-task-spotlight-meta span.medium { color: #b45309; }
#vynorNextApp .os-workspace-production .os-production-task footer strong.medium::before { content: "↔"; margin-right: 4px; }
#vynorNextApp .os-workspace-production .os-production-task footer strong.low { color: #15803d; }
#vynorNextApp .os-workspace-production .os-production-task footer strong.low::before { content: "↓"; margin-right: 4px; }
#vynorNextApp .os-workspace-production .os-production-task footer em.orange {
  background: var(--os-surface-hover);
  color: var(--os-text-muted);
}
#vynorNextApp .os-production-system-page {
  display: grid;
  grid-auto-rows: max-content;
  align-content: start;
  gap: 12px;
}
#vynorNextApp .os-production-system-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding: 0 8px;
}
#vynorNextApp .os-production-routines-trigger {
  min-height: 34px;
  padding: 0 11px;
  color: var(--os-text-muted);
  font-size: 13px;
  font-weight: 600;
}
#vynorNextApp .os-production-routines-trigger svg {
  width: 14px !important;
  height: 14px !important;
}
#vynorNextApp .os-production-system-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 0 8px;
  padding: 16px;
  border: 1px solid #dfe3ea;
  border-radius: 8px;
  background: var(--os-surface);
  box-shadow: 0 14px 34px rgba(15,23,42,.045);
}
#vynorNextApp .os-production-system-form label,
#vynorNextApp .os-production-system-form fieldset {
  min-width: 0;
  display: grid;
  gap: 7px;
  margin: 0;
  color: var(--os-text-muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
}
#vynorNextApp .os-production-system-form label.is-wide,
#vynorNextApp .os-production-system-form fieldset.is-wide {
  grid-column: span 2;
}
#vynorNextApp .os-production-system-form input,
#vynorNextApp .os-production-system-form select {
  width: 100%;
  min-height: 38px;
  padding: 0 11px;
  border: 1px solid #dfe3ea;
  border-radius: 7px;
  background: var(--os-surface);
  color: var(--os-text);
  font: inherit;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  outline: 0;
}
#vynorNextApp .os-production-system-form input:focus,
#vynorNextApp .os-production-system-form select:focus {
  border-color: var(--os-text-muted);
  box-shadow: 0 0 0 3px rgba(148,163,184,.16);
}
#vynorNextApp .os-production-system-form fieldset {
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 12px;
}
#vynorNextApp .os-production-system-form legend {
  padding: 0 6px;
}
#vynorNextApp .os-production-system-form fieldset label {
  min-height: 28px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--os-text);
  font-size: 13px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
}
#vynorNextApp .os-production-system-form .os-production-custom-recurrence {
  grid-column: 4;
  align-content: start;
  gap: 8px;
  padding: 10px;
  border-radius: 7px;
  background: var(--os-surface-raised);
}
#vynorNextApp .os-production-recurrence-days {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
#vynorNextApp .os-production-system-form .os-production-recurrence-days label {
  min-height: 26px;
  padding: 0 8px;
  border: 1px solid #dfe3ea;
  border-radius: 5px;
  background: var(--os-surface-hover);
  color: var(--os-text-muted);
  font-size: 11px;
  font-weight: 600;
}
#vynorNextApp .os-production-system-form .os-production-recurrence-days label:has(input:checked) {
  border-color: var(--os-text-strong);
  background: #0f172a;
  color: #fff;
}
#vynorNextApp .os-production-system-form .os-production-recurrence-days input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
#vynorNextApp .os-production-system-form fieldset input {
  width: 15px;
  min-height: 15px;
  height: 15px;
  padding: 0;
}
#vynorNextApp .os-production-system-form footer {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
}
#vynorNextApp .os-production-onboarding-form {
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .65fr);
  align-items: start;
}
#vynorNextApp .os-production-onboarding-client-data {
  align-content: start;
  background: var(--os-surface-raised);
}
#vynorNextApp .os-production-onboarding-client-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
#vynorNextApp .os-production-system-form .os-production-onboarding-client-grid label {
  display: grid;
  min-height: 0;
  align-items: initial;
  gap: 6px;
}
#vynorNextApp .os-production-system-form .os-production-onboarding-client-grid input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 40px;
  height: auto;
  padding: 0 11px;
}
#vynorNextApp .os-production-onboarding-client-grid .os-production-onboarding-address {
  grid-column: span 2;
}
#vynorNextApp .os-production-onboarding-services {
  min-height: 0;
  padding: 12px;
  background: var(--os-surface-raised);
}
#vynorNextApp .os-production-onboarding-services legend {
  color: var(--os-text-muted);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .06em;
  text-transform: uppercase;
}
#vynorNextApp .os-production-onboarding-service-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}
#vynorNextApp .os-production-system-form .os-production-onboarding-service-list label {
  min-height: 38px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 144px;
  gap: 10px;
  align-items: center;
  padding: 0 10px;
  border: 1px solid #e5e7eb;
  border-radius: 7px;
  background: var(--os-surface);
}
#vynorNextApp .os-production-system-form .os-production-onboarding-service-list label:hover {
  border-color: var(--os-text-muted);
  background: var(--os-surface-hover);
}
#vynorNextApp .os-production-onboarding-service-list span {
  color: var(--os-text);
  font-size: 13px;
  font-weight: 600;
}
#vynorNextApp .os-production-onboarding-service-option input[type="text"] {
  width: 100%;
  min-width: 0;
  min-height: 30px;
  padding: 0 8px;
  border: 1px solid var(--os-border);
  border-radius: 5px;
  background: var(--os-control);
  color: var(--os-text);
  font: inherit;
  font-size: 12px;
}
#vynorNextApp .os-production-onboarding-service-option input[type="text"]:disabled {
  visibility: hidden;
}
#vynorNextApp .os-production-onboarding-status-tabs {
  display: inline-flex;
  width: fit-content;
  overflow: hidden;
  border: 1px solid var(--os-border);
  border-radius: 6px;
  background: var(--os-surface);
}
#vynorNextApp .os-production-onboarding-status-tabs button {
  min-height: 30px;
  padding: 0 11px;
  border: 0;
  border-right: 1px solid var(--os-border);
  background: transparent;
  color: var(--os-text-muted);
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
#vynorNextApp .os-production-onboarding-status-tabs button:last-child { border-right: 0; }
#vynorNextApp .os-production-onboarding-status-tabs button[aria-pressed="true"] { background: var(--os-surface-hover); color: var(--os-text-strong); }
#vynorNextApp .os-plain-action {
  width: fit-content !important;
  min-height: 34px !important;
  padding: 0 10px !important;
  border: 1px solid #dfe3ea !important;
  border-radius: 7px !important;
  background: var(--os-surface) !important;
  color: var(--os-text-muted) !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}
#vynorNextApp .os-plain-action:hover {
  background: var(--os-surface-hover) !important;
  color: var(--os-text) !important;
}
#vynorNextApp .os-production-template-trigger,
#vynorNextApp .os-production-routine-delete,
#vynorNextApp .os-production-routine-toggle {
  min-height: 28px !important;
  height: 28px !important;
  padding: 0 7px !important;
  border-color: transparent !important;
  border-radius: 5px !important;
  background: transparent !important;
  color: var(--os-text-muted) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  box-shadow: none !important;
}
#vynorNextApp .os-production-template-trigger svg,
#vynorNextApp .os-production-routine-delete svg,
#vynorNextApp .os-production-routine-toggle svg {
  width: 13px !important;
  height: 13px !important;
}
#vynorNextApp .os-production-template-trigger:hover {
  background: var(--os-surface-hover) !important;
  color: var(--os-text) !important;
}
#vynorNextApp .os-production-routine-delete:hover {
  background: var(--os-surface)4f2 !important;
  color: #b42318 !important;
}
#vynorNextApp .os-production-routine-toggle:hover {
  background: var(--os-surface-hover) !important;
  color: var(--os-text) !important;
}
#vynorNextApp .os-production-system-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 12px;
  padding: 0 8px;
}
#vynorNextApp .os-production-routine-list {
  display: grid;
  gap: 12px;
  padding: 0 8px;
}
#vynorNextApp .os-production-system-card,
#vynorNextApp .os-production-system-empty {
  min-height: 150px;
  border: 1px solid #dfe3ea;
  border-radius: 8px;
  background: var(--os-surface);
  box-shadow: 0 14px 34px rgba(15,23,42,.045);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
#vynorNextApp .os-production-onboarding-card {
  min-height: 0;
  border: 1px solid #dfe3ea;
  border-radius: 8px;
  background: var(--os-surface);
  box-shadow: 0 10px 24px rgba(15,23,42,.04);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
#vynorNextApp .os-production-routine-card:hover,
#vynorNextApp .os-production-onboarding-card:hover,
#vynorNextApp .os-production-onboarding-area:hover,
.os-traffic-report-stats article:hover,
.os-traffic-client-list:hover,
.os-traffic-report-detail:hover,
.os-traffic-platforms article:hover,
.os-traffic-metrics article:hover,
.os-traffic-report-copy:hover {
  transform: translateY(-2px);
  border-color: var(--os-text-muted);
  background: var(--os-surface);
  box-shadow: 0 16px 34px rgba(15,23,42,.075);
}
#vynorNextApp .os-production-system-card {
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 14px;
  padding: 18px;
}
#vynorNextApp .os-production-system-card header,
#vynorNextApp .os-production-onboarding-card > header,
#vynorNextApp .os-production-onboarding-area header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
#vynorNextApp .os-production-system-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
#vynorNextApp .os-production-system-card header > div:first-child {
  min-width: 0;
  display: grid;
  gap: 6px;
}
#vynorNextApp .os-production-routine-title {
  min-width: 0;
  display: grid;
  gap: 7px;
}
#vynorNextApp .os-production-routine-tag {
  width: fit-content;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--os-text-muted);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: none;
}
#vynorNextApp .os-production-system-card header span,
#vynorNextApp .os-production-onboarding-card > header span {
  color: var(--os-text-muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
}
#vynorNextApp .os-production-system-card header .os-production-routine-tag {
  width: fit-content;
  color: var(--os-text-muted);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: none;
}
#vynorNextApp .os-production-system-card header strong,
#vynorNextApp .os-production-onboarding-card > header strong {
  color: var(--os-text-strong);
  font-size: 16px;
  line-height: 1.25;
}
#vynorNextApp .os-production-routine-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}
#vynorNextApp .os-production-routine-actions .os-production-system-action-button {
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 9px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}
#vynorNextApp .os-production-routine-actions .os-production-routine-delete {
  width: 30px !important;
  min-width: 30px !important;
  padding: 0 !important;
  justify-content: center !important;
}
#vynorNextApp .os-production-routine-actions .os-production-routine-toggle {
  width: 30px !important;
  min-width: 30px !important;
  padding: 0 !important;
  justify-content: center !important;
}
#vynorNextApp .os-production-routine-actions .os-production-routine-toggle svg {
  transition: transform .16s ease;
}
#vynorNextApp .os-production-routine-card.is-collapsed {
  min-height: 0;
  padding: 14px;
  box-shadow: 0 8px 18px rgba(15,23,42,.035);
}
#vynorNextApp .os-production-routine-card {
  min-height: 0;
  cursor: pointer;
}
#vynorNextApp .os-production-routine-card.is-collapsed .os-production-routine-toggle svg {
  transform: rotate(-90deg);
}
#vynorNextApp .os-production-system-meta {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  align-content: start;
  gap: 8px 12px;
  color: var(--os-text-muted);
  font-size: 12px;
}
#vynorNextApp .os-production-system-meta strong {
  min-width: 0;
  color: var(--os-text);
  font-weight: 600;
}
#vynorNextApp .os-secondary-action {
  width: fit-content !important;
  min-height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 12px !important;
  border: 1px solid #dfe3ea !important;
  border-radius: 7px !important;
  background: var(--os-surface) !important;
  color: var(--os-text) !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  box-shadow: 0 6px 14px rgba(15,23,42,.04) !important;
}
#vynorNextApp .os-secondary-action:hover {
  transform: translateY(-1px);
  border-color: var(--os-text-muted) !important;
  background: var(--os-surface-hover) !important;
  box-shadow: 0 10px 22px rgba(15,23,42,.08) !important;
}
#vynorNextApp .os-secondary-action svg {
  width: 15px !important;
  height: 15px !important;
}
#vynorNextApp .os-production-system-action-button {
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 34px !important;
  min-height: 34px !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-self: center !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  padding: 0 11px !important;
  border: 1px solid #dfe3ea !important;
  border-radius: 7px !important;
  background: var(--os-surface) !important;
  color: var(--os-text) !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  box-shadow: 0 6px 14px rgba(15,23,42,.04) !important;
}
#vynorNextApp .os-production-system-action-button:hover {
  transform: translateY(-1px);
  border-color: var(--os-text-muted) !important;
  background: var(--os-surface-hover) !important;
  color: var(--os-text) !important;
  box-shadow: 0 10px 22px rgba(15,23,42,.08) !important;
}
#vynorNextApp .os-production-system-action-button svg {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;
  display: block !important;
}
#vynorNextApp .os-production-system-empty {
  display: grid;
  place-items: center;
  grid-column: 1 / -1;
  min-height: 118px;
}
#vynorNextApp .os-production-onboarding-list {
  display: grid;
  gap: 12px;
  padding: 0 8px;
}
#vynorNextApp .os-production-onboarding-card {
  display: grid;
  gap: 12px;
  padding: 14px;
}
#vynorNextApp .os-production-onboarding-card > header em {
  min-width: 34px;
  color: var(--os-text-strong);
  font-style: normal;
  font-size: 13px;
  font-weight: 750;
  text-align: right;
}
#vynorNextApp .os-production-onboarding-progress {
  height: 4px;
  overflow: hidden;
  border-radius: 0;
  background: var(--os-surface-hover);
}
#vynorNextApp .os-production-onboarding-progress span {
  display: block;
  height: 100%;
  background: var(--os-onboarding-progress, #111827);
}
#vynorNextApp .os-production-onboarding-card.is-progressing > header button em {
  color: var(--os-onboarding-progress) !important;
}
#vynorNextApp .os-production-onboarding-card.is-complete > header button em {
  color: var(--os-onboarding-progress) !important;
}
#vynorNextApp .os-production-onboarding-complete-action {
  min-height: 30px !important;
  padding: 0 10px !important;
  border: 1px solid #9ed5ae !important;
  border-radius: 6px !important;
  background: #edf9f0 !important;
  color: #166534 !important;
  font: inherit !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  white-space: nowrap;
  box-shadow: none !important;
}
#vynorNextApp .os-production-onboarding-complete-action:hover {
  border-color: #5ca875 !important;
  background: #e2f5e7 !important;
  color: #14532d !important;
}
#vynorNextApp .os-production-onboarding-progress[hidden],
#vynorNextApp .os-production-onboarding-areas[hidden] {
  display: none !important;
}
#vynorNextApp .os-production-onboarding-areas {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
}
#vynorNextApp .os-production-onboarding-area {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 14px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: var(--os-surface-raised);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
#vynorNextApp .os-production-onboarding-area header strong {
  color: var(--os-text);
  font-size: 14px;
}
#vynorNextApp .os-production-onboarding-area header span {
  color: var(--os-text-muted);
  font-size: 12px;
  font-weight: 700;
}
#vynorNextApp .os-production-onboarding-steps {
  display: grid;
  gap: 8px;
}
#vynorNextApp .os-production-onboarding-step {
  min-height: 38px;
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-top: 1px solid #eef2f7;
}
#vynorNextApp .os-production-onboarding-step:first-child {
  border-top: 0;
}
#vynorNextApp .os-production-onboarding-step > span {
  width: 8px;
  height: 8px;
  background: #94a3b8;
}
#vynorNextApp .os-production-onboarding-step.is-done > span {
  background: #16a34a;
}
#vynorNextApp .os-production-onboarding-step strong {
  min-width: 0;
  color: var(--os-text-muted);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
}
#vynorNextApp .os-production-onboarding-step.is-done strong {
  color: var(--os-text-muted);
  text-decoration: line-through;
}
#vynorNextApp .os-production-onboarding-step button {
  min-height: 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 0 9px !important;
  border: 1px solid #dfe3ea !important;
  border-radius: 7px !important;
  background: var(--os-surface) !important;
  color: var(--os-text-muted) !important;
  font: inherit !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}
#vynorNextApp .os-production-onboarding-step button:hover {
  background: var(--os-surface-hover) !important;
  color: var(--os-text) !important;
}
#vynorNextApp .os-production-onboarding-step button svg {
  width: 14px !important;
  height: 14px !important;
}
#vynorNextApp .os-production-onboarding-actions {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
#vynorNextApp .os-production-onboarding-card > header button:not(.os-production-onboarding-complete-action) {
  width: auto !important;
  height: auto !important;
  min-height: 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  padding: 0 9px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  background: var(--os-surface-hover) !important;
  color: var(--os-text-muted) !important;
  font: inherit !important;
  cursor: pointer;
  box-shadow: none !important;
}
#vynorNextApp .os-production-onboarding-card > header button em {
  font-style: normal;
  font-weight: 750;
  color: var(--os-text-muted) !important;
}
#vynorNextApp .os-production-onboarding-card > header button svg {
  width: 16px !important;
  height: 16px !important;
  color: var(--os-text-muted) !important;
  transition: transform .16s ease;
}
#vynorNextApp .os-production-onboarding-card > header button:not(.os-production-onboarding-complete-action):hover {
  border-color: var(--os-text-muted) !important;
  background: var(--os-surface) !important;
  color: var(--os-text-strong) !important;
}
#vynorNextApp .os-production-onboarding-card > header button.os-production-onboarding-delete {
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  justify-content: center !important;
  padding: 0 !important;
  color: var(--os-text-muted) !important;
}
#vynorNextApp .os-production-onboarding-card > header button.os-production-onboarding-delete:hover {
  border-color: #fecaca !important;
  background: #fef2f2 !important;
  color: #b91c1c !important;
}
#vynorNextApp .os-production-onboarding-card > header button.os-production-onboarding-delete svg {
  width: 13px !important;
  height: 13px !important;
}
#vynorNextApp .os-production-onboarding-card.is-collapsed > header button svg {
  transform: rotate(-90deg);
}
#vynorNextApp .os-production-onboarding-card.is-collapsed {
  min-height: 0;
  padding: 12px 14px;
  box-shadow: 0 8px 18px rgba(15,23,42,.035);
}
#vynorNextApp .os-production-onboarding-sprint {
  gap: 10px;
  padding: 12px;
  border-radius: 7px;
  background: var(--os-surface);
}
#vynorNextApp .os-production-onboarding-sprint > header {
  align-items: center;
}
#vynorNextApp .os-production-onboarding-sprint > header > div {
  display: grid;
  gap: 3px;
}
#vynorNextApp .os-production-onboarding-sprint > header span {
  color: var(--os-text-muted);
  font-size: 10px;
  font-weight: 760;
  letter-spacing: .06em;
  text-transform: uppercase;
}
#vynorNextApp .os-production-onboarding-sprint > header strong {
  color: var(--os-text-strong);
  font-size: 12px;
  font-weight: 650;
}
#vynorNextApp .os-production-onboarding-sprint > header em {
  color: var(--os-text-muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 750;
}
#vynorNextApp .os-production-onboarding-sprint-bar {
  height: 4px;
  overflow: hidden;
  background: var(--os-surface-hover);
}
#vynorNextApp .os-production-onboarding-sprint-bar span {
  display: block;
  height: 100%;
  background: #2563eb;
}
#vynorNextApp .os-production-onboarding-steps {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
#vynorNextApp .os-production-onboarding-sprint-step {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  min-height: 48px;
  border-top: 1px solid #edf1f5;
}
#vynorNextApp .os-production-onboarding-sprint-step:first-child {
  border-top: 0;
}
#vynorNextApp .os-production-onboarding-step-marker {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border: 1px solid #d7dee8;
  border-radius: 50%;
  background: var(--os-surface);
  color: var(--os-text-muted);
  font-size: 9px;
  font-weight: 750;
}
#vynorNextApp .os-production-onboarding-step-marker svg {
  width: 11px !important;
  height: 11px !important;
}
#vynorNextApp button.os-production-onboarding-step-marker {
  padding: 0;
  cursor: pointer;
}
#vynorNextApp button.os-production-onboarding-step-marker:hover {
  border-color: var(--os-text-muted);
  background: var(--os-surface-hover);
}
#vynorNextApp button.os-production-onboarding-step-marker:focus-visible {
  outline: 2px solid var(--os-text-muted);
  outline-offset: 2px;
}
#vynorNextApp .os-production-onboarding-sprint-step.is-done .os-production-onboarding-step-marker {
  border-color: #16a34a;
  background: #16a34a;
  color: #fff;
}
#vynorNextApp .os-production-onboarding-step-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}
#vynorNextApp .os-production-onboarding-step-copy strong {
  overflow: hidden;
  color: var(--os-text-strong);
  font-size: 12px;
  font-weight: 620;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#vynorNextApp .os-production-onboarding-step-copy small {
  color: var(--os-text-muted);
  font-size: 10px;
  line-height: 1.25;
}
#vynorNextApp .os-production-onboarding-step-assignee {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  color: var(--os-text-muted);
  font-size: 10px;
}
#vynorNextApp .os-production-onboarding-step-assignee span {
  white-space: nowrap;
}
#vynorNextApp .os-production-onboarding-step-assignee select {
  min-width: 0;
  max-width: 180px;
  height: 24px;
  padding: 0 22px 0 6px;
  border: 1px solid transparent;
  border-radius: 4px;
  background: var(--os-surface-hover);
  color: var(--os-text-muted);
  font: inherit;
  font-size: 10px;
  cursor: pointer;
}
#vynorNextApp .os-production-onboarding-step-assignee select:hover,
#vynorNextApp .os-production-onboarding-step-assignee select:focus {
  border-color: var(--os-text-muted);
  background: var(--os-surface);
  outline: 0;
}
#vynorNextApp .os-production-onboarding-sprint-step.is-done .os-production-onboarding-step-copy strong {
  color: var(--os-text-muted);
  text-decoration: line-through;
  text-decoration-color: var(--os-text-muted);
}
#vynorNextApp .os-production-onboarding-step-action,
#vynorNextApp .os-production-onboarding-step-state {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 8px;
  border: 1px solid #dfe5ed;
  border-radius: 5px;
  background: var(--os-surface);
  color: var(--os-text-muted);
  font: inherit;
  font-size: 10px;
  font-weight: 620;
  white-space: nowrap;
}
#vynorNextApp .os-production-onboarding-step-action:not(:disabled):hover {
  border-color: var(--os-text-muted);
  background: var(--os-surface-hover);
  color: var(--os-text-strong);
}
#vynorNextApp .os-production-onboarding-step-action:disabled {
  border-color: transparent;
  background: var(--os-surface-hover);
  color: var(--os-text-muted);
  cursor: default;
}
#vynorNextApp .os-production-onboarding-step-action svg {
  width: 12px !important;
  height: 12px !important;
}
#vynorNextApp .os-production-onboarding-step-state.is-done {
  border-color: transparent;
  background: #ecfdf3;
  color: #15803d;
}
#vynorNextApp .os-production-onboarding-step-state.is-active {
  border-color: transparent;
  background: #eff6ff;
  color: #2563eb;
}
#vynorNextApp .os-production-onboarding-badge {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: -2px;
  color: var(--os-text-muted);
  font-size: 11px;
  line-height: 1.2;
}
#vynorNextApp .os-production-onboarding-badge span {
  color: #2563eb;
  font-weight: 700;
}
#vynorNextApp .os-production-onboarding-badge strong {
  color: var(--os-text-muted);
  font-weight: 600;
}
@keyframes osFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes osDrawerIn { from { opacity: .7; transform: translateX(100%); } to { opacity: 1; transform: translateX(0); } }
@keyframes osModalIn { from { opacity: .7; transform: translate(-50%, -48%) scale(.98); } to { opacity: 1; transform: translate(-50%, -50%) scale(1); } }
@keyframes osTaskSpotlightIn { from { opacity: .75; transform: translate(-50%, -48%) scale(.985); } to { opacity: 1; transform: translate(-50%, -50%) scale(1); } }
@media (max-width: 1100px) { #vynorNextApp { grid-template-columns: 72px minmax(0, 1fr); } .os-sidebar { position: fixed; width: 72px; height: 100vh; min-height: 100vh; grid-template-rows: auto auto 1fr auto; gap: 14px; padding: 16px 10px; overflow: visible; } .os-logo { justify-content: center; min-height: 40px; } .os-logo strong, .os-account-main strong, .os-account-main .os-account-chevron, .os-nav button span, .os-settings span, .os-settings strong { display: none; } .os-logo img { width: 38px; height: 38px; object-fit: cover; object-position: 18% center; } .os-account-main { min-height: 42px; grid-template-columns: 1fr; justify-items: center; padding: 8px; } .os-nav { grid-template-columns: 1fr; gap: 6px; } .os-nav button { min-height: 42px; grid-template-columns: 1fr; justify-items: center; padding: 8px; } .os-nav button.active::before { left: -10px; top: 7px; bottom: 7px; } .os-settings { min-height: 42px; grid-template-columns: 1fr; justify-items: center; padding: 8px; margin-top: 0; } .os-main { grid-column: 2; grid-template-rows: 76px 1fr; } .os-topbar { grid-template-columns: minmax(0, 1fr) auto; height: 76px; min-height: 76px; padding: 0 16px; } .os-page { --os-content-align-offset: 8px; padding: 18px; } .os-account-list { left: 86px; right: auto; top: 72px; width: min(400px, calc(100vw - 104px)); max-height: calc(100vh - 96px); } #vynorNextApp .os-submenu-tabs { grid-auto-flow: row; grid-auto-columns: auto; width: min(280px, calc(100% - var(--os-content-align-offset))); } #vynorNextApp .os-submenu-tabs button { min-height: 36px; border-right: 0 !important; border-bottom: 1px solid #e5e7eb !important; font-size: 13px; } #vynorNextApp .os-submenu-tabs button:last-child { border-bottom: 0 !important; } .os-production-toolbar { display: grid; justify-items: start; } .os-production-toolbar > div { flex-wrap: wrap; } .os-production-board { grid-template-columns: repeat(2, minmax(0, 1fr)); overflow-x: visible; } .os-stat-grid, .os-dashboard-grid, .os-widget-grid { grid-template-columns: 1fr; } .os-dashboard-grid .os-panel-card:first-child, .os-dashboard-grid .os-panel-card:nth-child(4) { grid-column: auto; } }
@media (max-width: 640px) { #vynorNextApp { grid-template-columns: 64px minmax(0, 1fr); } .os-sidebar { width: 64px; padding: 14px 8px; } .os-main { grid-column: 2; } .os-account-list { left: 76px; width: min(360px, calc(100vw - 88px)); } .os-topbar { grid-template-columns: 1fr; height: auto; min-height: 76px; padding: 14px; } .os-top-actions { justify-content: flex-start; } .os-production-board { grid-template-columns: 1fr; } }
@media (max-width: 1100px) { .os-account-list { left: 18px; right: 18px; top: 92px; width: auto; max-height: calc(100vh - 116px); } }
/* Production reports: an isolated daily monitoring surface, not the legacy report detail. */
#vynorNextApp .os-traffic-monitoring-layout { width: calc(100% - var(--os-content-align-offset)); margin-left: var(--os-content-align-offset); display: grid; grid-template-columns: 252px minmax(560px, 1fr) 286px; gap: 14px; align-items: start; color: var(--os-text-strong); }
#vynorNextApp .os-traffic-client-list, #vynorNextApp .os-traffic-monitoring-main, #vynorNextApp .os-traffic-monitoring-side > section, #vynorNextApp .os-traffic-monitoring-empty { border: 1px solid #e2e8f0; border-radius: 8px; background: var(--os-surface); box-shadow: 0 10px 26px rgba(15,23,42,.035); }
#vynorNextApp .os-traffic-client-list { min-height: 680px; display: grid; grid-template-rows: auto auto minmax(0, 1fr); gap: 10px; padding: 12px; }
#vynorNextApp .os-traffic-client-list > header, #vynorNextApp .os-traffic-alerts > header, #vynorNextApp .os-traffic-campaigns > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
#vynorNextApp .os-traffic-client-list > header strong, #vynorNextApp .os-traffic-alerts > header strong, #vynorNextApp .os-traffic-campaigns > header strong { color: var(--os-text-strong); font-size: 13px; font-weight: 720; }
#vynorNextApp .os-traffic-client-list > header span, #vynorNextApp .os-traffic-alerts > header span, #vynorNextApp .os-traffic-campaigns > header span { min-width: 20px; height: 20px; display: grid; place-items: center; border-radius: 999px; background: #eaf8f0; color: #15803d; font-size: 11px; font-weight: 700; }
#vynorNextApp .os-traffic-client-list label { min-height: 36px; display: grid; grid-template-columns: 16px minmax(0,1fr); align-items: center; gap: 8px; padding: 0 9px; border: 1px solid #dbe3ee; border-radius: 6px; color: var(--os-text-muted); }
#vynorNextApp .os-traffic-client-list label svg { width: 15px !important; height: 15px !important; }
#vynorNextApp .os-traffic-client-list input { min-width: 0; border: 0; outline: 0; background: transparent; color: var(--os-text-strong); font: inherit; font-size: 12px; box-shadow: none !important; }
#vynorNextApp .os-traffic-client-scroll { min-height: 0; display: grid; align-content: start; gap: 4px; overflow-y: auto; padding-right: 2px; }
#vynorNextApp .os-traffic-client-list button { width: 100% !important; min-height: 58px !important; display: grid !important; grid-template-columns: 32px minmax(0,1fr) 8px; align-items: center; gap: 9px; padding: 8px !important; border: 1px solid transparent !important; border-radius: 6px !important; background: var(--os-surface) !important; color: var(--os-text-strong) !important; font: inherit !important; text-align: left !important; box-shadow: none !important; }
#vynorNextApp .os-traffic-client-list button:hover { border-color: var(--os-text-muted) !important; background: var(--os-surface-hover) !important; }
#vynorNextApp .os-traffic-client-list button.is-selected { border-color: #bfdbfe !important; background: #eff6ff !important; color: #0f3e87 !important; }
#vynorNextApp .os-traffic-client-list button > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 999px; background: #eaf2ff; color: #1d4ed8; font-size: 10px; font-weight: 750; }
#vynorNextApp .os-traffic-client-list button > div { min-width: 0; display: grid; gap: 3px; }
#vynorNextApp .os-traffic-client-list button strong, #vynorNextApp .os-traffic-client-list button small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#vynorNextApp .os-traffic-client-list button strong { color: inherit; font-size: 12px; font-weight: 680; }
#vynorNextApp .os-traffic-client-list button small { color: var(--os-text-muted); font-size: 11px; }
#vynorNextApp .os-traffic-client-list button em { width: 7px; height: 7px; border-radius: 999px; background: #22c55e; }
#vynorNextApp .os-traffic-monitoring-main { min-width: 0; display: grid; gap: 14px; padding: 16px; }
#vynorNextApp .os-traffic-monitoring-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding-bottom: 14px; border-bottom: 1px solid #edf1f6; }
#vynorNextApp .os-traffic-monitoring-head > div:first-child { display: grid; gap: 4px; }
#vynorNextApp .os-traffic-monitoring-head > div:first-child > span { color: var(--os-text-muted); font-size: 10px; font-weight: 720; letter-spacing: .07em; text-transform: uppercase; }
#vynorNextApp .os-traffic-monitoring-head h1 { margin: 0; color: var(--os-text-strong); font-size: 22px; font-weight: 690; letter-spacing: 0; }
#vynorNextApp .os-traffic-monitoring-head p { margin: 0; color: var(--os-text-muted); font-size: 12px; }
#vynorNextApp .os-traffic-platform-tabs { display: inline-flex; align-self: center; overflow: hidden; border: 1px solid #dbe3ee; border-radius: 7px; background: var(--os-surface); }
#vynorNextApp .os-traffic-platform-tabs button { min-height: 32px; display: inline-flex; align-items: center; padding: 0 11px; border: 0; border-right: 1px solid var(--os-border); border-radius: 0; background: transparent; color: var(--os-text-muted); font: inherit; font-size: 12px; font-weight: 620; box-shadow: none; }
#vynorNextApp .os-traffic-platform-tabs button:last-child { border-right: 0; }
#vynorNextApp .os-traffic-platform-tabs button.is-active { border-color: var(--os-border-strong); background: var(--os-surface-hover); color: var(--os-text-strong); }
#vynorNextApp .os-traffic-report-controls { display: inline-flex; align-items: center; gap: 8px; }
#vynorNextApp .os-traffic-health-config { min-height: 32px !important; display: inline-flex !important; align-items: center !important; gap: 6px; padding: 0 9px !important; border: 1px solid #dbe3ee !important; border-radius: 6px !important; background: var(--os-surface) !important; color: var(--os-text-muted) !important; font: inherit !important; font-size: 11px !important; font-weight: 620 !important; box-shadow: none !important; }
#vynorNextApp .os-traffic-health-config:hover { background: var(--os-surface-hover) !important; border-color: #bfdbfe !important; color: #1d4ed8 !important; }
#vynorNextApp .os-traffic-health-config svg { width: 14px !important; height: 14px !important; }
#vynorNextApp .os-traffic-date-comparison { display: flex; align-items: end; flex-wrap: wrap; gap: 8px; padding: 10px; border: 1px solid #e6ebf1; border-radius: 7px; background: var(--os-surface-raised); }
#vynorNextApp .os-traffic-date-comparison label { display: grid; gap: 3px; color: var(--os-text-muted); font-size: 10px; font-weight: 680; letter-spacing: .04em; text-transform: uppercase; }
#vynorNextApp .os-traffic-date-comparison input { width: 138px; min-height: 31px; padding: 0 7px; border: 1px solid #dbe3ee; border-radius: 5px; background: var(--os-surface); color: var(--os-text-strong); font: inherit; font-size: 11px; letter-spacing: 0; }
#vynorNextApp .os-traffic-date-comparison label small { color: var(--os-text-muted); font-size: 10px; font-weight: 580; letter-spacing: 0; text-transform: none; }
#vynorNextApp .os-traffic-date-comparison > span { padding-bottom: 8px; color: var(--os-text-muted); font-size: 11px; }
#vynorNextApp .os-traffic-date-comparison em { min-height: 30px; display: inline-flex; align-items: center; margin-left: auto; padding: 0 8px; border-radius: 4px; font-size: 11px; font-style: normal; font-weight: 650; }
#vynorNextApp .os-traffic-date-comparison em.is-healthy { background: #eaf8f0; color: #15803d; } #vynorNextApp .os-traffic-date-comparison em.is-attention { background: #eff6ff; color: #1d4ed8; } #vynorNextApp .os-traffic-date-comparison em.is-critical { background: #fef2f2; color: #b91c1c; } #vynorNextApp .os-traffic-date-comparison em.is-unconfigured { background: var(--os-surface-hover); color: var(--os-text-muted); }
#vynorNextApp .os-traffic-comparison-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 8px 11px; border-left: 2px solid #2563eb; background: var(--os-surface-raised); color: var(--os-text-muted); font-size: 11px; }
#vynorNextApp .os-traffic-comparison-summary strong { color: var(--os-text-strong); font-size: 11px; } #vynorNextApp .os-traffic-comparison-summary span { white-space: nowrap; }
#vynorNextApp .os-traffic-metrics { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 8px; }
#vynorNextApp .os-traffic-metrics article { min-height: 116px; display: grid; align-content: start; gap: 6px; padding: 11px; border: 1px solid #e6ebf1; border-radius: 7px; background: var(--os-surface); }
#vynorNextApp .os-traffic-metrics span { color: var(--os-text-muted); font-size: 10px; font-weight: 720; letter-spacing: .045em; text-transform: uppercase; }
#vynorNextApp .os-traffic-metrics strong { color: var(--os-text-strong); font-size: 19px; font-weight: 700; letter-spacing: 0; white-space: nowrap; }
#vynorNextApp .os-traffic-metrics small { font-size: 10px; line-height: 1.35; }
#vynorNextApp .os-traffic-metrics small.os-traffic-metric-trend.is-positive { color: #15803d; }
#vynorNextApp .os-traffic-metrics small.os-traffic-metric-trend.is-negative { color: #b91c1c; }
#vynorNextApp .os-traffic-metrics small.os-traffic-metric-trend.is-neutral { color: var(--os-text-muted); }
#vynorNextApp .os-traffic-metrics small.os-traffic-metric-target { font-weight: 620; }
#vynorNextApp .os-traffic-metrics small.os-traffic-metric-target.is-positive { color: #15803d; }
#vynorNextApp .os-traffic-metrics small.os-traffic-metric-target.is-negative { color: #b91c1c; }
#vynorNextApp .os-traffic-metrics small.os-traffic-metric-target.is-neutral { color: var(--os-text-muted); }
#vynorNextApp .os-traffic-daily-table, #vynorNextApp .os-traffic-campaigns { border: 1px solid #e6ebf1; border-radius: 7px; background: var(--os-surface); overflow: hidden; }
#vynorNextApp .os-traffic-daily-table > header, #vynorNextApp .os-traffic-campaigns > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 13px; border-bottom: 1px solid #edf1f6; }
#vynorNextApp .os-traffic-daily-table > header div { display: grid; gap: 3px; }
#vynorNextApp .os-traffic-daily-table > header strong { color: var(--os-text-strong); font-size: 13px; }
#vynorNextApp .os-traffic-daily-table > header span { color: var(--os-text-muted); font-size: 11px; }
#vynorNextApp .os-traffic-table-scroll { overflow-x: auto; }
#vynorNextApp .os-traffic-daily-table table { width: 100%; min-width: 600px; border-collapse: collapse; }
#vynorNextApp .os-traffic-daily-table th, #vynorNextApp .os-traffic-daily-table td { height: 38px; padding: 0 11px; border-bottom: 1px solid #f0f3f7; color: var(--os-text-muted); font-size: 11px; text-align: left; white-space: nowrap; }
#vynorNextApp .os-traffic-daily-table th { height: 30px; color: var(--os-text-muted); font-size: 10px; font-weight: 720; letter-spacing: .05em; text-transform: uppercase; background: var(--os-surface-raised); }
#vynorNextApp .os-traffic-daily-table tr:last-child td { border-bottom: 0; }
#vynorNextApp .os-traffic-daily-table td:first-child { color: var(--os-text-strong); font-weight: 650; }
#vynorNextApp .os-traffic-daily-table td span { display: inline-flex; align-items: center; gap: 5px; font-size: 10px; }
#vynorNextApp .os-traffic-daily-table td span::before { width: 6px; height: 6px; border-radius: 50%; content: ""; }
#vynorNextApp .os-traffic-daily-table td .is-healthy { color: #15803d; } #vynorNextApp .os-traffic-daily-table td .is-healthy::before { background: #22c55e; }
#vynorNextApp .os-traffic-daily-table td .is-watch { color: #1d4ed8; } #vynorNextApp .os-traffic-daily-table td .is-watch::before { background: #3b82f6; }
#vynorNextApp .os-traffic-campaign-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 9px; padding: 11px; }
#vynorNextApp .os-traffic-campaign-grid article { min-width: 0; display: grid; gap: 11px; padding: 11px; border: 1px solid #e6ebf1; border-radius: 7px; background: var(--os-surface-raised); }
#vynorNextApp .os-traffic-campaign-grid article > div { display: grid; gap: 4px; } #vynorNextApp .os-traffic-campaign-grid strong { color: var(--os-text-strong); font-size: 12px; line-height: 1.35; } #vynorNextApp .os-traffic-campaign-grid article > div > span { color: var(--os-text-muted); font-size: 10px; }
#vynorNextApp .os-traffic-campaign-grid em { width: fit-content; padding: 3px 6px; border-radius: 4px; background: #eaf8f0; color: #15803d; font-size: 10px; font-style: normal; }
#vynorNextApp .os-traffic-campaign-grid dl { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin: 0; } #vynorNextApp .os-traffic-campaign-grid dl div { display: grid; gap: 2px; } #vynorNextApp .os-traffic-campaign-grid dt { color: var(--os-text-muted); font-size: 10px; } #vynorNextApp .os-traffic-campaign-grid dd { margin: 0; color: var(--os-text-strong); font-size: 12px; font-weight: 680; }
#vynorNextApp .os-traffic-monitoring-side { min-width: 0; display: grid; gap: 14px; }
#vynorNextApp .os-traffic-health-form { display: grid; gap: 11px; padding: 13px; border: 1px solid #bfdbfe; border-radius: 8px; background: var(--os-surface-raised); box-shadow: 0 12px 28px rgba(37,99,235,.08); }
#vynorNextApp .os-traffic-health-form header { display: flex; align-items: start; justify-content: space-between; gap: 10px; } #vynorNextApp .os-traffic-health-form header div { display: grid; gap: 3px; } #vynorNextApp .os-traffic-health-form header strong { color: var(--os-text-strong); font-size: 13px; } #vynorNextApp .os-traffic-health-form header span { color: var(--os-text-muted); font-size: 11px; }
#vynorNextApp .os-traffic-health-form header button { width: 25px !important; height: 25px !important; min-height: 25px !important; padding: 0 !important; border: 0 !important; border-radius: 5px !important; background: transparent !important; color: var(--os-text-muted) !important; font-size: 18px !important; box-shadow: none !important; }
#vynorNextApp .os-traffic-health-form > div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } #vynorNextApp .os-traffic-health-form label { display: grid; gap: 4px; color: var(--os-text-muted); font-size: 10px; font-weight: 680; } #vynorNextApp .os-traffic-health-form input { width: 100%; min-height: 31px; padding: 0 7px; border: 1px solid #dbe3ee; border-radius: 5px; background: var(--os-surface); color: var(--os-text-strong); font: inherit; font-size: 12px; }
#vynorNextApp .os-traffic-alerts, #vynorNextApp .os-traffic-whatsapp { display: grid; gap: 0; overflow: hidden; }
#vynorNextApp .os-traffic-alerts > header, #vynorNextApp .os-traffic-whatsapp > header { padding: 13px; border-bottom: 1px solid #edf1f6; }
#vynorNextApp .os-traffic-alerts article { display: grid; grid-template-columns: 30px minmax(0,1fr); gap: 9px; padding: 12px 13px; border-bottom: 1px solid #edf1f6; }
#vynorNextApp .os-traffic-alerts article:last-child { border-bottom: 0; }
#vynorNextApp .os-traffic-alerts i { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: #eef5ff; color: #2563eb; } #vynorNextApp .os-traffic-alerts i svg { width: 14px !important; height: 14px !important; }
#vynorNextApp .os-traffic-alerts article div { display: grid; gap: 3px; } #vynorNextApp .os-traffic-alerts article strong { color: var(--os-text-strong); font-size: 12px; } #vynorNextApp .os-traffic-alerts article p { margin: 0; color: var(--os-text-muted); font-size: 11px; line-height: 1.45; }
#vynorNextApp .os-traffic-whatsapp { gap: 12px; padding-bottom: 13px; } #vynorNextApp .os-traffic-whatsapp > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; } #vynorNextApp .os-traffic-whatsapp > header > div { display: grid; gap: 3px; } #vynorNextApp .os-traffic-whatsapp > header strong { color: var(--os-text-strong); font-size: 13px; } #vynorNextApp .os-traffic-whatsapp > header span { color: var(--os-text-muted); font-size: 10px; } #vynorNextApp .os-traffic-whatsapp > header > svg { width: 18px !important; height: 18px !important; color: #2563eb; }
#vynorNextApp .os-traffic-whatsapp p { margin: 0 13px; color: var(--os-text-muted); font-size: 11px; line-height: 1.55; }
#vynorNextApp .os-traffic-copy { min-height: 34px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 7px; align-self: start; margin: 0 13px; padding: 0 11px !important; border: 1px solid #0f172a !important; border-radius: 6px !important; background: #0f172a !important; color: #fff !important; font: inherit !important; font-size: 12px !important; font-weight: 650 !important; box-shadow: none !important; }
#vynorNextApp .os-traffic-copy:hover { border-color: #1e3a5f !important; background: #1e3a5f !important; color: #fff !important; }
#vynorNextApp .os-traffic-copy svg { width: 15px !important; height: 15px !important; }
#vynorNextApp .os-traffic-monitoring-empty { min-height: 320px; display: grid; place-items: center; grid-column: span 2; }
@media (max-width: 1360px) { #vynorNextApp .os-traffic-monitoring-layout { grid-template-columns: 232px minmax(520px,1fr); } #vynorNextApp .os-traffic-monitoring-side { grid-column: 2; grid-template-columns: 1fr 1fr; } }
@media (max-width: 920px) { #vynorNextApp .os-traffic-monitoring-layout { grid-template-columns: 1fr; } #vynorNextApp .os-traffic-client-list { min-height: auto; max-height: 280px; } #vynorNextApp .os-traffic-monitoring-side { grid-column: auto; grid-template-columns: 1fr; } #vynorNextApp .os-traffic-monitoring-head { display: grid; } #vynorNextApp .os-traffic-metrics { grid-template-columns: repeat(2, minmax(0,1fr)); } #vynorNextApp .os-traffic-campaign-grid { grid-template-columns: 1fr; } }

/* Dark theme overrides live last so workspace-specific legacy rules cannot restore light surfaces. */
#vynorNextApp[data-os-theme="dark"] .os-panel-card,
#vynorNextApp[data-os-theme="dark"] .os-dashboard-preview,
#vynorNextApp[data-os-theme="dark"] .os-widget-drawer,
#vynorNextApp[data-os-theme="dark"] .os-dashboard-config-drawer,
#vynorNextApp[data-os-theme="dark"] .os-production-task-spotlight,
#vynorNextApp[data-os-theme="dark"] .os-production-composer,
#vynorNextApp[data-os-theme="dark"] .os-production-filter-drawer,
#vynorNextApp[data-os-theme="dark"] .os-production-template-panel { background: #111b2c !important; border-color: #2a3950 !important; color: #e5edf7 !important; }
#vynorNextApp[data-os-theme="dark"] .os-panel-card :is(h2, h3, strong),
#vynorNextApp[data-os-theme="dark"] .os-dashboard-preview :is(h2, h3, strong),
#vynorNextApp[data-os-theme="dark"] .os-production-task-spotlight :is(h2, h3, strong),
#vynorNextApp[data-os-theme="dark"] .os-production-composer :is(h2, h3, strong) { color: #edf3fb !important; }
#vynorNextApp[data-os-theme="dark"] .os-panel-card :is(p, span, small),
#vynorNextApp[data-os-theme="dark"] .os-dashboard-preview :is(p, span, small),
#vynorNextApp[data-os-theme="dark"] .os-production-task-spotlight :is(p, span, small),
#vynorNextApp[data-os-theme="dark"] .os-production-composer :is(p, span, small) { color: var(--os-text-muted) !important; }

#vynorNextApp[data-os-theme="dark"] .os-workspace-dashboard .os-dashboard-metric-card,
#vynorNextApp[data-os-theme="dark"] .os-workspace-dashboard .os-dashboard-panel-card,
#vynorNextApp[data-os-theme="dark"] .os-workspace-dashboard .os-gear-button { background: #152235 !important; border-color: #2a3950 !important; color: #e5edf7 !important; box-shadow: 0 8px 22px rgba(0,0,0,.18) !important; }
#vynorNextApp[data-os-theme="dark"] .os-workspace-dashboard .os-dashboard-metric-card:hover,
#vynorNextApp[data-os-theme="dark"] .os-workspace-dashboard .os-dashboard-panel-card:hover,
#vynorNextApp[data-os-theme="dark"] .os-workspace-dashboard .os-gear-button:hover { background: #192a43 !important; border-color: #49617f !important; }
#vynorNextApp[data-os-theme="dark"] .os-workspace-dashboard .os-dashboard-metric-card :is(strong, span),
#vynorNextApp[data-os-theme="dark"] .os-workspace-dashboard .os-dashboard-panel-card :is(h2, h3, strong) { color: #eef4fb !important; }
#vynorNextApp[data-os-theme="dark"] .os-workspace-dashboard .os-dashboard-metric-card em { color: #4ade80 !important; }
#vynorNextApp[data-os-theme="dark"] .os-workspace-dashboard .os-dashboard-metric-card.red em { color: #fca5a5 !important; }

#vynorNextApp[data-os-theme="dark"] .os-top-panel,
#vynorNextApp[data-os-theme="dark"] .os-user-current-card,
#vynorNextApp[data-os-theme="dark"] .os-top-actions .os-user-switch-list button { background: #111b2c !important; border-color: #2a3950 !important; color: #e5edf7 !important; }
#vynorNextApp[data-os-theme="dark"] .os-top-panel header,
#vynorNextApp[data-os-theme="dark"] .os-top-panel-list strong,
#vynorNextApp[data-os-theme="dark"] .os-user-current-card strong,
#vynorNextApp[data-os-theme="dark"] .os-user-switch-list strong { color: #edf3fb !important; }
#vynorNextApp[data-os-theme="dark"] .os-top-panel-list span,
#vynorNextApp[data-os-theme="dark"] .os-user-current-card small,
#vynorNextApp[data-os-theme="dark"] .os-user-switch-list small,
#vynorNextApp[data-os-theme="dark"] .os-empty-panel { color: var(--os-text-muted) !important; }
#vynorNextApp[data-os-theme="dark"] .os-top-panel-list button,
#vynorNextApp[data-os-theme="dark"] .os-top-actions .os-user-switch-list button { color: #e5edf7 !important; }
#vynorNextApp[data-os-theme="dark"] .os-top-panel-list button:hover,
#vynorNextApp[data-os-theme="dark"] .os-top-actions .os-user-switch-list button:hover { background: #192a43 !important; }

#vynorNextApp[data-os-theme="dark"] .os-production-task-spotlight :is(section, .os-production-task-section, .os-production-update-editor, .os-production-checkpoint, .os-production-checkpoint-details) { background: #152235 !important; border-color: #2a3950 !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-task-spotlight :is(label, .os-production-task-spotlight-meta span, .os-production-update-list footer, .os-production-task-spotlight-footer) { color: #aebdd0 !important; border-color: #2a3950 !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-task-spotlight :is(input, select, textarea, .os-production-task-title-input) { background: #0d1727 !important; border-color: var(--os-text-muted) !important; color: #edf3fb !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-task-spotlight .os-production-task-tabs,
#vynorNextApp[data-os-theme="dark"] .os-production-task-spotlight .os-production-task-tabs button,
#vynorNextApp[data-os-theme="dark"] .os-production-task-spotlight .os-drawer-close,
#vynorNextApp[data-os-theme="dark"] .os-production-task-spotlight .os-production-task-delete { background: #152235 !important; border-color: var(--os-text-muted) !important; color: #d8e2ef !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-task-spotlight .os-production-task-tabs button.is-active,
#vynorNextApp[data-os-theme="dark"] .os-production-task-spotlight .os-production-save-action { background: #263750 !important; border-color: #47627f !important; color: #fff !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-task-spotlight .os-production-task-tabs button:hover:not(.is-active),
#vynorNextApp[data-os-theme="dark"] .os-production-task-spotlight .os-drawer-close:hover { background: #1d304a !important; color: #fff !important; }

/* Shared theme surfaces: all workspaces and floating interfaces consume these tokens. */
#vynorNextApp .os-main,
#vynorNextApp .os-page { background: var(--os-canvas); color: var(--os-text); }
#vynorNextApp :is(
  .os-account-list, .os-top-panel, .os-user-current-card, .os-production-team-panel,
  .os-production-popover, .os-production-sort-panel, .os-production-filter-drawer,
  .os-production-composer, .os-production-template-panel, .os-settings-center,
  .os-settings-compact-card, .os-settings-user-card, .os-settings-user-form,
  .os-widget-drawer, .os-dashboard-config-drawer, .os-dashboard-preview,
  .os-production-task-spotlight, .os-traffic-monitoring-main, .os-traffic-client-list,
  .os-traffic-daily-table, .os-traffic-campaigns, .os-traffic-health-form,
  .os-traffic-alerts, .os-traffic-whatsapp
) { background: var(--os-surface) !important; border-color: var(--os-border) !important; color: var(--os-text) !important; }
#vynorNextApp :is(
  .os-account-search, .os-dashboard-preview-body, .os-production-task-spotlight section,
  .os-production-task-section, .os-production-update-editor, .os-production-checkpoint,
  .os-production-checkpoint-details, .os-traffic-date-comparison, .os-traffic-campaign-grid article
) { background: var(--os-surface-raised) !important; border-color: var(--os-border) !important; color: var(--os-text) !important; }
.os-floating-surface-fonts { font-family: inherit !important; }
#vynorNextApp :is(
  .os-account-list, .os-top-panel, .os-production-team-panel, .os-production-popover,
  .os-production-filter-drawer, .os-production-composer, .os-production-template-panel,
  .os-settings-center, .os-widget-drawer, .os-dashboard-config-drawer, .os-dashboard-preview,
  .os-production-task-spotlight, .os-traffic-monitoring-main
) { font-family: inherit !important; }
#vynorNextApp :is(
  .os-account-list, .os-top-panel, .os-production-team-panel, .os-production-popover,
  .os-production-filter-drawer, .os-production-composer, .os-production-template-panel,
  .os-settings-center, .os-widget-drawer, .os-dashboard-config-drawer, .os-dashboard-preview,
  .os-production-task-spotlight, .os-traffic-monitoring-main
) :is(button, input, select, textarea) { font-family: inherit !important; }
#vynorNextApp :is(
  .os-account-list button:not(.os-agency-link), .os-top-actions .os-top-panel-list button,
  .os-top-actions .os-user-switch-list button, .os-production-team-list button,
  .os-production-task-spotlight .os-production-task-tabs button, .os-production-task-spotlight .os-drawer-close,
  .os-production-task-spotlight .os-production-task-delete, .os-widget-drawer header button,
  .os-dashboard-config-drawer header button, .os-traffic-platform-tabs, .os-traffic-health-config
) { background: var(--os-control) !important; border-color: var(--os-border) !important; color: var(--os-text) !important; }
#vynorNextApp :is(
  .os-account-list button:not(.os-agency-link):hover, .os-top-actions .os-top-panel-list button:hover,
  .os-top-actions .os-user-switch-list button:hover, .os-production-team-list button:hover,
  .os-production-task-spotlight .os-production-task-tabs button:hover:not(.is-active),
  .os-production-task-spotlight .os-drawer-close:hover, .os-dashboard-config-drawer .os-dashboard-card-toggle:hover
) { background: var(--os-surface-hover) !important; }
#vynorNextApp :is(
  .os-account-list, .os-top-panel, .os-user-current-card, .os-production-team-panel,
  .os-production-popover, .os-production-sort-panel, .os-production-filter-drawer,
  .os-production-composer, .os-production-template-panel, .os-settings-center,
  .os-widget-drawer, .os-dashboard-config-drawer, .os-dashboard-preview,
  .os-production-task-spotlight, .os-traffic-monitoring-main
) :is(h1, h2, h3, strong, label, dt, dd) { color: var(--os-text-strong) !important; }
#vynorNextApp :is(
  .os-account-list, .os-top-panel, .os-production-team-panel, .os-production-popover,
  .os-production-filter-drawer, .os-production-composer, .os-settings-center,
  .os-widget-drawer, .os-dashboard-config-drawer, .os-dashboard-preview,
  .os-production-task-spotlight, .os-traffic-monitoring-main
) :is(p, small, .os-empty-panel, .os-panel-copy, .os-production-tag, .os-production-task-spotlight-meta span) { color: var(--os-text-muted) !important; }
#vynorNextApp :is(input, select, textarea, .os-date-filter, .os-mini-select, .os-production-toolbar-search) {
  background: var(--os-control) !important; border-color: var(--os-border) !important; color: var(--os-text) !important;
}
#vynorNextApp :is(input, textarea)::placeholder { color: var(--os-text-muted) !important; opacity: .78; }
#vynorNextApp .os-production-column { background: var(--os-surface) !important; border-color: var(--os-border) !important; color: var(--os-text) !important; }
#vynorNextApp .os-production-task { background: var(--os-surface-raised) !important; border-color: var(--os-border) !important; color: var(--os-text) !important; box-shadow: var(--os-shadow) !important; }
#vynorNextApp .os-production-task:hover { background: var(--os-surface-hover) !important; border-color: var(--os-border-strong) !important; }
#vynorNextApp .os-workspace-dashboard .os-dashboard-metric-card,
#vynorNextApp .os-workspace-dashboard .os-dashboard-panel-card,
#vynorNextApp .os-workspace-dashboard .os-gear-button { background: var(--os-surface) !important; border-color: var(--os-border) !important; color: var(--os-text) !important; }
#vynorNextApp .os-workspace-dashboard :is(.os-dashboard-metric-card, .os-dashboard-panel-card) :is(h2, h3, strong, span) { color: var(--os-text-strong) !important; }

/* Legacy workspace controls migrated to the same token contract. */
#vynorNextApp .os-dashboard-date-popover { background: var(--os-surface) !important; border-color: var(--os-border) !important; color: var(--os-text) !important; }
#vynorNextApp .os-dashboard-date-popover button,
#vynorNextApp .os-workspace-dashboard .os-dashboard-date-popover button { background: var(--os-surface) !important; border-color: var(--os-border) !important; color: var(--os-text) !important; }
#vynorNextApp .os-dashboard-date-popover button:hover { background: var(--os-surface-hover) !important; }
#vynorNextApp .os-settings-center :is(.os-settings-center-head, .os-settings-content),
#vynorNextApp .os-settings-center button,
#vynorNextApp .os-settings-finance-trigger,
#vynorNextApp .os-settings-finance-menu,
#vynorNextApp .os-settings-sector-list article,
#vynorNextApp .os-settings-user-workspace-grid label { background: var(--os-surface) !important; border-color: var(--os-border) !important; color: var(--os-text) !important; }
#vynorNextApp .os-settings-finance-menu button:hover,
#vynorNextApp .os-settings-nav button:hover { background: var(--os-surface-hover) !important; }
#vynorNextApp .os-dashboard-widget-template-card,
#vynorNextApp .os-dashboard-widget-panel-list button,
#vynorNextApp .os-dashboard-widget-chart-types button,
#vynorNextApp .os-dashboard-custom-widget-form button,
#vynorNextApp .os-dashboard-custom-widget-add-toggle,
#vynorNextApp .os-widget-picker button { background: var(--os-surface-raised) !important; border-color: var(--os-border) !important; color: var(--os-text) !important; }
#vynorNextApp .os-dashboard-widget-template-card:hover,
#vynorNextApp .os-dashboard-widget-panel-list button:hover,
#vynorNextApp .os-widget-picker button:hover { background: var(--os-surface-hover) !important; border-color: var(--os-border-strong) !important; }
#vynorNextApp .os-traffic-report-stats article,
#vynorNextApp .os-traffic-report-detail,
#vynorNextApp .os-traffic-report-copy,
#vynorNextApp .os-traffic-monitoring-side > section,
#vynorNextApp .os-traffic-metrics article,
#vynorNextApp .os-traffic-daily-table,
#vynorNextApp .os-traffic-campaigns,
#vynorNextApp .os-traffic-client-list button { background: var(--os-surface) !important; border-color: var(--os-border) !important; color: var(--os-text) !important; }
#vynorNextApp .os-traffic-campaign-grid article,
#vynorNextApp .os-traffic-date-comparison,
#vynorNextApp .os-traffic-daily-table th { background: var(--os-surface-raised) !important; border-color: var(--os-border) !important; color: var(--os-text-muted) !important; }

/* Chrome and toolbar controls are intentionally explicit: their legacy selectors use !important. */
#vynorNextApp[data-os-theme="dark"] .os-topbar { background: var(--os-surface) !important; border-color: var(--os-border) !important; color: var(--os-text) !important; }
#vynorNextApp[data-os-theme="dark"] .os-topbar :is(strong, button, svg) { color: var(--os-text-strong) !important; }
#vynorNextApp[data-os-theme="dark"] .os-topbar :is(span, small) { color: var(--os-text-muted) !important; }
#vynorNextApp[data-os-theme="dark"] .os-submenu-tabs { background: var(--os-surface) !important; border-color: var(--os-border) !important; }
#vynorNextApp[data-os-theme="dark"] .os-submenu-tabs button { background: var(--os-surface) !important; border-color: var(--os-border) !important; color: var(--os-text) !important; }
#vynorNextApp[data-os-theme="dark"] .os-submenu-tabs button.is-active { background: var(--os-surface-raised) !important; color: var(--os-text-strong) !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-filter,
#vynorNextApp[data-os-theme="dark"] .os-production-select,
#vynorNextApp[data-os-theme="dark"] .os-primary,
#vynorNextApp[data-os-theme="dark"] .os-date-filter,
#vynorNextApp[data-os-theme="dark"] .os-mini-select { background: var(--os-control) !important; border-color: var(--os-border) !important; color: var(--os-text) !important; }
#vynorNextApp[data-os-theme="dark"] .os-production-filter svg,
#vynorNextApp[data-os-theme="dark"] .os-production-select svg,
#vynorNextApp[data-os-theme="dark"] .os-date-filter svg { color: var(--os-text-muted) !important; }
#vynorNextApp[data-os-theme="dark"] .os-workspace-dashboard .os-dashboard-metric-card :is(span, strong) { color: var(--os-text-strong) !important; }
#vynorNextApp[data-os-theme="dark"] .os-workspace-dashboard .os-dashboard-metric-card :is(p, small, em) { color: var(--os-text-muted) !important; }
#vynorNextApp[data-os-theme="dark"] .os-stat-card :is(span, strong) { color: var(--os-text-strong) !important; }
#vynorNextApp[data-os-theme="dark"] .os-stat-card em { color: #4ade80 !important; }
#vynorNextApp[data-os-theme="dark"] .os-stat-card em.red { color: #fca5a5 !important; }

/* Seed keeps the client roster and its detail surface at stable, operational proportions. */
#vynorNextApp .os-seed-workspace { min-width: 0; min-height: 0; display: grid; }
#vynorNextApp .os-seed-layout { height: min(680px, calc(100vh - 112px)); min-height: 0; display: grid; grid-template-columns: minmax(230px, 280px) minmax(0, 1fr); gap: 14px; }
#vynorNextApp .os-seed-client-list,
#vynorNextApp .os-seed-client-detail { min-height: 0; overflow: hidden; border: 1px solid var(--os-border); border-radius: 8px; background: var(--os-surface); color: var(--os-text); box-shadow: var(--os-shadow); }
#vynorNextApp .os-seed-client-list { display: grid; grid-template-rows: auto minmax(0, 1fr); }
#vynorNextApp .os-seed-client-list > header { display: flex; align-items: center; justify-content: space-between; min-height: 46px; padding: 0 14px; border-bottom: 1px solid var(--os-border); }
#vynorNextApp .os-seed-client-list > header strong { color: var(--os-text-strong); font-size: 13px; }
#vynorNextApp .os-seed-client-list > header span { color: var(--os-text-muted); font-size: 12px; font-weight: 700; }
#vynorNextApp .os-seed-client-list-scroll,
#vynorNextApp .os-seed-detail-scroll,
#vynorNextApp .os-seed-account-picker-list { min-height: 0; overflow-y: auto; }
#vynorNextApp .os-seed-client-list-scroll { display: grid; align-content: start; gap: 3px; padding: 7px; }
#vynorNextApp .os-seed-client-item { width: 100%; min-height: 64px; display: grid; align-content: center; justify-items: start; gap: 3px; padding: 9px 10px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--os-text); font: inherit; text-align: left; box-shadow: none !important; }
#vynorNextApp .os-seed-client-item:hover,
#vynorNextApp .os-seed-client-item.is-selected { border-color: var(--os-border); background: var(--os-surface-hover); }
#vynorNextApp .os-seed-client-item strong,
#vynorNextApp .os-seed-client-item span { min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#vynorNextApp .os-seed-client-item strong { color: var(--os-text-strong); font-size: 13px; }
#vynorNextApp .os-seed-client-item span { color: var(--os-text-muted); font-size: 11px; }
#vynorNextApp .os-seed-status-tag { width: fit-content; min-height: 18px; display: inline-flex; align-items: center; margin-top: 2px; padding: 0 6px; border: 1px solid var(--os-border); border-radius: 4px; color: var(--os-text-muted); font-size: 10px; font-style: normal; font-weight: 700; }
#vynorNextApp .os-seed-client-detail { display: grid; grid-template-rows: auto auto minmax(0, 1fr); }
#vynorNextApp .os-seed-client-detail > header { min-height: 68px; display: grid; grid-template-columns: minmax(0, 1fr) 34px; align-items: center; gap: 14px; padding: 12px 16px; border-bottom: 1px solid var(--os-border); }
#vynorNextApp .os-seed-detail-actions { display: grid; justify-items: center; gap: 7px; }
#vynorNextApp .os-seed-icon-action { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 1px solid var(--os-border); border-radius: 6px; background: var(--os-surface); color: var(--os-text-muted); box-shadow: none !important; }
#vynorNextApp .os-seed-icon-action svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
#vynorNextApp .os-seed-icon-action:hover { border-color: var(--os-text-muted); background: var(--os-surface-hover); color: var(--os-text-strong); }
#vynorNextApp .os-finance-client-ledger article.is-focused { outline: 2px solid var(--os-text-muted); outline-offset: 2px; background: var(--os-surface-hover); }
#vynorNextApp .os-seed-status-switch { width: 30px; height: 17px; display: inline-flex; align-items: center; padding: 2px; border: 1px solid var(--os-border); border-radius: 999px; background: var(--os-surface-hover); box-shadow: none !important; transition: background .16s ease, border-color .16s ease; }
#vynorNextApp .os-seed-status-switch span { width: 11px; height: 11px; border-radius: 50%; background: var(--os-text-muted); transform: translateX(0); transition: transform .16s ease, background .16s ease; }
#vynorNextApp .os-seed-status-switch.is-active { border-color: #86efac; background: #dcfce7; }
#vynorNextApp .os-seed-status-switch.is-active span { background: #15803d; transform: translateX(13px); }
#vynorNextApp .os-seed-status-switch:hover { border-color: var(--os-text-muted); }
#vynorNextApp .os-seed-client-detail > header span { display: block; color: var(--os-text-muted); font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .06em; }
#vynorNextApp .os-seed-client-detail h2 { display: -webkit-box; margin: 4px 0 0; overflow: hidden; color: var(--os-text-strong); font-size: 17px; line-height: 1.25; letter-spacing: 0; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
#vynorNextApp .os-seed-tabs { display: flex; align-items: center; gap: 2px; padding: 8px 12px; border-bottom: 1px solid var(--os-border); overflow-x: auto; }
#vynorNextApp .os-seed-tabs button { min-width: 104px; min-height: 32px; padding: 0 10px; border: 0; border-radius: 5px; background: transparent; color: var(--os-text-muted); font: inherit; font-size: 12px; font-weight: 700; box-shadow: none !important; }
#vynorNextApp .os-seed-tabs button:hover { background: var(--os-surface-hover); color: var(--os-text); }
#vynorNextApp .os-seed-tabs button.is-active { background: var(--os-surface-hover); color: var(--os-text-strong); }
#vynorNextApp .os-seed-detail-scroll { padding: 16px; }
#vynorNextApp .os-seed-tab-content { display: grid; align-content: start; gap: 14px; }
#vynorNextApp .os-seed-summary-list { display: grid; gap: 0; margin: 0; }
#vynorNextApp .os-seed-summary-list > div { display: grid; grid-template-columns: minmax(140px, 220px) minmax(0, 1fr); gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--os-border); }
#vynorNextApp .os-seed-summary-list > div:first-child { padding-top: 0; }
#vynorNextApp .os-seed-summary-list dt { color: var(--os-text-muted); font-size: 12px; }
#vynorNextApp .os-seed-summary-list dd { margin: 0; color: var(--os-text-strong); font-size: 13px; line-height: 1.45; }
#vynorNextApp .os-seed-services-list > div { padding: 11px 0; border-bottom: 1px solid var(--os-border); }
#vynorNextApp .os-seed-services-list > div:first-child { padding-top: 0; }
#vynorNextApp .os-seed-services-list strong { color: var(--os-text-strong); font-size: 13px; }
#vynorNextApp .os-seed-links { gap: 20px; }
#vynorNextApp .os-seed-linked-section { display: grid; gap: 8px; }
#vynorNextApp .os-seed-linked-section > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
#vynorNextApp .os-seed-section-actions { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; }
#vynorNextApp .os-seed-linked-section h3 { margin: 0; color: var(--os-text-strong); font-size: 13px; line-height: 1.35; }
#vynorNextApp .os-seed-linked-section header span { display: block; margin-top: 3px; color: var(--os-text-muted); font-size: 11px; line-height: 1.35; }
#vynorNextApp .os-seed-linked-section > header > strong { min-width: 22px; min-height: 22px; display: inline-grid; place-items: center; border: 1px solid var(--os-border); border-radius: 50%; color: var(--os-text-muted); font-size: 11px; }
#vynorNextApp .os-seed-linked-list { display: grid; border-top: 1px solid var(--os-border); }
#vynorNextApp .os-seed-linked-row { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--os-border); }
#vynorNextApp .os-seed-linked-row > div { min-width: 0; display: grid; gap: 3px; }
#vynorNextApp .os-seed-linked-row > div:last-child { grid-auto-flow: column; align-items: center; justify-content: end; }
#vynorNextApp .os-seed-linked-row > div:last-child { display: flex; gap: 12px; }
#vynorNextApp .os-seed-linked-row strong { min-width: 0; overflow: hidden; color: var(--os-text-strong); font-size: 12px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
#vynorNextApp .os-seed-linked-row span { color: var(--os-text-muted); font-size: 11px; line-height: 1.35; }
#vynorNextApp .os-seed-linked-row .os-secondary-action { min-height: 30px; padding: 0 9px; font-size: 11px; white-space: nowrap; }
#vynorNextApp .os-seed-integration-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 4px 0 14px; border-bottom: 1px solid var(--os-border); }
#vynorNextApp .os-seed-integration-row > div:first-child { min-width: 0; display: grid; gap: 4px; }
#vynorNextApp .os-seed-integration-row strong { color: var(--os-text-strong); font-size: 14px; }
#vynorNextApp .os-seed-integration-row small,
#vynorNextApp .os-seed-muted { color: var(--os-text-muted); font-size: 12px; line-height: 1.4; }
#vynorNextApp .os-seed-integration-status { width: fit-content; min-height: 20px; display: inline-flex; align-items: center; padding-left: 7px; border-left: 2px solid var(--os-border-strong); color: var(--os-text-muted); font-size: 11px; font-weight: 700; }
#vynorNextApp .os-seed-integration-status.is-connected { border-left-color: #16a34a; color: #15803d; }
#vynorNextApp .os-seed-integration-status.is-error { border-left-color: #dc2626; color: #b91c1c; }
#vynorNextApp .os-seed-integration-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
#vynorNextApp .os-secondary-action { min-height: 34px; display: inline-flex; align-items: center; justify-content: center; padding: 0 11px; border: 1px solid var(--os-border-strong); border-radius: 6px; background: var(--os-surface); color: var(--os-text); font: inherit; font-size: 12px; font-weight: 700; box-shadow: none !important; }
#vynorNextApp .os-secondary-action:hover { border-color: var(--os-text-muted); background: var(--os-surface-hover); }
#vynorNextApp .os-seed-picker-backdrop { position: fixed; inset: 0; z-index: var(--os-layer-backdrop); background: var(--os-overlay); }
#vynorNextApp .os-seed-account-picker { position: fixed; top: 50%; left: 50%; z-index: var(--os-layer-modal); width: min(480px, calc(100vw - 32px)); height: min(620px, calc(100vh - 32px)); min-height: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); border: 1px solid var(--os-border); border-radius: 8px; background: var(--os-surface); color: var(--os-text); box-shadow: 0 28px 72px var(--os-overlay); transform: translate(-50%, -50%); }
#vynorNextApp .os-seed-account-picker > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 16px; border-bottom: 1px solid var(--os-border); }
#vynorNextApp .os-seed-account-picker header span { display: block; color: var(--os-text-muted); font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .06em; }
#vynorNextApp .os-seed-account-picker header strong { display: block; margin-top: 4px; color: var(--os-text-strong); font-size: 16px; }
#vynorNextApp .os-seed-picker-close { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid var(--os-border); border-radius: 6px; background: var(--os-surface); color: var(--os-text-muted); font: inherit; font-size: 18px; line-height: 1; box-shadow: none !important; }
#vynorNextApp .os-seed-picker-close:hover { background: var(--os-surface-hover); color: var(--os-text); }
#vynorNextApp .os-seed-account-picker-list { display: grid; align-content: start; gap: 6px; padding: 10px; }
#vynorNextApp .os-seed-account-option { width: 100%; min-height: 60px; display: grid; align-content: center; justify-items: start; gap: 4px; padding: 10px; border: 1px solid var(--os-border); border-radius: 6px; background: var(--os-surface); color: var(--os-text); font: inherit; text-align: left; box-shadow: none !important; }
#vynorNextApp .os-seed-account-option:hover:not(:disabled) { border-color: var(--os-border-strong); background: var(--os-surface-hover); }
#vynorNextApp .os-seed-account-option:disabled { cursor: not-allowed; opacity: .62; }
#vynorNextApp .os-seed-account-option strong { color: var(--os-text-strong); font-size: 13px; }
#vynorNextApp .os-seed-account-option span { color: var(--os-text-muted); font-size: 12px; }
#vynorNextApp .os-seed-edit-backdrop { position: fixed; inset: 0; z-index: var(--os-layer-backdrop); background: var(--os-overlay); }
#vynorNextApp .os-seed-edit-panel { position: fixed; inset: 0 0 0 auto; z-index: var(--os-layer-modal); width: min(460px, 100vw); display: grid; grid-template-rows: auto minmax(0, 1fr); border-left: 1px solid var(--os-border); background: var(--os-surface); color: var(--os-text); box-shadow: -20px 0 54px var(--os-overlay); }
#vynorNextApp .os-seed-edit-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; border-bottom: 1px solid var(--os-border); }
#vynorNextApp .os-seed-edit-panel header span { display: block; color: var(--os-text-muted); font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .06em; }
#vynorNextApp .os-seed-edit-panel h2 { margin: 4px 0 0; color: var(--os-text-strong); font-size: 17px; letter-spacing: 0; }
#vynorNextApp .os-seed-edit-panel form { min-height: 0; display: grid; align-content: start; gap: 14px; padding: 18px; overflow-y: auto; }
#vynorNextApp .os-seed-edit-panel label { display: grid; gap: 6px; color: var(--os-text-muted); font-size: 11px; font-weight: 700; }
#vynorNextApp .os-seed-edit-panel input,
#vynorNextApp .os-seed-edit-panel select { width: 100%; min-height: 38px; padding: 0 10px; border: 1px solid var(--os-border); border-radius: 5px; outline: none; background: var(--os-control); color: var(--os-text); font: inherit; font-size: 13px; }
#vynorNextApp .os-seed-edit-panel input:focus,
#vynorNextApp .os-seed-edit-panel select:focus { border-color: var(--os-border-strong); box-shadow: 0 0 0 2px var(--os-focus); }
#vynorNextApp .os-seed-edit-panel input[readonly] { color: var(--os-text-muted); cursor: default; }
#vynorNextApp .os-select-trigger { width: 100%; min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 10px; border: 1px solid var(--os-border); border-radius: 5px; background: var(--os-control); color: var(--os-text); font: inherit; font-size: 13px; font-weight: 400; text-align: left; box-shadow: none !important; }
#vynorNextApp .os-select-trigger::after { content: "⌄"; flex: 0 0 auto; color: var(--os-text-muted); font-size: 16px; line-height: 1; }
#vynorNextApp .os-select-trigger:hover { border-color: var(--os-border-strong); background: var(--os-surface-hover); }
#vynorNextApp .os-select-trigger:focus-visible { outline: none; border-color: var(--os-border-strong); box-shadow: 0 0 0 2px var(--os-focus) !important; }
#vynorNextApp .os-seed-finance-note { margin: -4px 0 0; color: var(--os-text-muted); font-size: 12px; line-height: 1.45; }
#vynorNextApp .os-seed-edit-panel footer { display: flex; justify-content: flex-end; gap: 8px; padding-top: 8px; }
#vynorNextApp :is(.os-seed-edit-panel, .os-seed-service-picker) footer .os-primary-action { min-height: 34px; padding: 0 13px; border: 1px solid var(--os-text-strong); border-radius: 6px; background: var(--os-text-strong); color: var(--os-surface); font: inherit; font-size: 12px; font-weight: 700; box-shadow: none !important; }
#vynorNextApp :is(.os-seed-edit-panel, .os-seed-service-picker) footer .os-primary-action:hover { filter: brightness(1.12); }
#vynorNextApp .os-seed-service-picker { position: fixed; top: 50%; left: 50%; z-index: var(--os-layer-modal); width: min(560px, calc(100vw - 32px)); max-height: min(620px, calc(100vh - 32px)); display: grid; grid-template-rows: auto minmax(0, 1fr) auto; border: 1px solid var(--os-border); border-radius: 8px; background: var(--os-surface); color: var(--os-text); box-shadow: 0 28px 72px var(--os-overlay); transform: translate(-50%, -50%); }
#vynorNextApp .os-seed-service-picker-backdrop { z-index: var(--os-layer-nested-backdrop); }
#vynorNextApp .os-seed-service-picker { z-index: var(--os-layer-nested-modal); }
#vynorNextApp .os-seed-service-picker > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 14px 16px 12px; border-bottom: 1px solid var(--os-border); }
#vynorNextApp .os-seed-service-picker header span { display: block; color: var(--os-text-muted); font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .06em; }
#vynorNextApp .os-seed-service-picker header strong { display: block; margin-top: 4px; color: var(--os-text-strong); font-size: 16px; }
#vynorNextApp .os-seed-service-picker-list { min-height: 0; display: grid; align-content: start; padding: 6px 16px; overflow-y: auto; }
#vynorNextApp .os-seed-service-option { min-height: 40px; display: flex; align-items: center; gap: 10px; padding: 0 2px; border: 0; border-bottom: 1px solid var(--os-border); border-radius: 0; background: transparent; color: var(--os-text); font-size: 13px; font-weight: 500; cursor: pointer; }
#vynorNextApp .os-seed-service-option:last-child { border-bottom: 0; }
#vynorNextApp .os-seed-service-option:hover { color: var(--os-text-strong); }
#vynorNextApp .os-seed-service-option:has(input:checked) { color: var(--os-text-strong); font-weight: 650; }
#vynorNextApp .os-seed-service-option input { width: 15px; height: 15px; margin: 0; accent-color: var(--os-text-strong); }
#vynorNextApp .os-seed-service-picker > footer { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--os-border); }
#vynorNextApp .os-seed-services-list { gap: 8px; }
#vynorNextApp .os-seed-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-bottom: 4px; }
#vynorNextApp .os-seed-section-heading h3 { margin: 0; color: var(--os-text-strong); font-size: 13px; }
#vynorNextApp .os-seed-section-heading span { display: block; margin-top: 3px; color: var(--os-text-muted); font-size: 11px; }
#vynorNextApp .os-seed-add-inline { min-height: 28px; flex: 0 0 auto; padding: 0 8px; border: 1px solid var(--os-border); border-radius: 4px; background: transparent; color: var(--os-text-muted); font: inherit; font-size: 11px; font-weight: 650; white-space: nowrap; box-shadow: none !important; }
#vynorNextApp .os-seed-add-inline:hover { border-color: var(--os-border-strong); background: var(--os-surface-hover); color: var(--os-text-strong); }
#vynorNextApp .os-seed-service-row { min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 12px; border: 1px solid var(--os-border); border-radius: 6px; background: var(--os-surface); }
#vynorNextApp .os-seed-service-row > div { min-width: 0; display: grid; gap: 3px; }
#vynorNextApp .os-seed-service-row > div:last-child { grid-auto-flow: column; align-items: center; justify-content: end; }
#vynorNextApp .os-seed-service-row strong { color: var(--os-text-strong); font-size: 12px; }
#vynorNextApp .os-seed-service-status { color: var(--os-text-muted); font-size: 11px; }
#vynorNextApp .os-seed-service-option { display: grid; grid-template-columns: auto minmax(0, 1fr) 132px; gap: 12px; min-height: 48px; }
#vynorNextApp .os-seed-service-amount { min-height: 32px; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 6px; padding: 0 8px; border: 1px solid var(--os-border); border-radius: 5px; background: var(--os-control); }
#vynorNextApp .os-seed-service-amount b { color: var(--os-text-muted); font-size: 12px; font-weight: 600; }
#vynorNextApp .os-seed-service-amount input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--os-text); font: inherit; font-size: 12px; text-align: right; }

/* Client catalogue: information-dense without turning the Seed workspace into a second dashboard. */
#vynorNextApp .os-seed-layout { grid-template-columns: minmax(0, 1fr); }
#vynorNextApp .os-seed-layout > .os-seed-client-detail { display: none; }
#vynorNextApp .os-seed-directory { min-width: 0; min-height: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); overflow: hidden; border: 1px solid var(--os-border); border-radius: 8px; background: var(--os-surface); box-shadow: var(--os-shadow); }
#vynorNextApp .os-seed-catalogue-controls { display: grid; grid-template-columns: minmax(190px, 1fr) minmax(132px, auto) minmax(132px, auto) auto; align-items: center; gap: 8px; padding: 10px; border-bottom: 1px solid var(--os-border); }
#vynorNextApp .os-seed-search { min-width: 0; }
#vynorNextApp .os-seed-search input,
#vynorNextApp .os-seed-catalogue-controls select { width: 100%; min-height: 34px; padding: 0 10px; border: 1px solid var(--os-border); border-radius: 5px; outline: none; background: var(--os-control); color: var(--os-text); font: inherit; font-size: 12px; box-shadow: none; }
#vynorNextApp .os-seed-search input:focus,
#vynorNextApp .os-seed-catalogue-controls select:focus { border-color: var(--os-border-strong); box-shadow: 0 0 0 2px var(--os-focus); }
#vynorNextApp .os-seed-view-switcher { display: inline-flex; align-items: center; overflow: hidden; border: 1px solid var(--os-border); border-radius: 5px; background: var(--os-surface); }
#vynorNextApp .os-seed-view-switcher button { min-width: 56px; min-height: 32px; padding: 0 9px; border: 0; border-right: 1px solid var(--os-border); background: transparent; color: var(--os-text-muted); font: inherit; font-size: 12px; font-weight: 700; box-shadow: none !important; }
#vynorNextApp .os-seed-view-switcher button:last-child { border-right: 0; }
#vynorNextApp .os-seed-view-switcher button:hover { background: var(--os-surface-hover); color: var(--os-text); }
#vynorNextApp .os-seed-view-switcher button.is-active { background: var(--os-surface-raised); color: var(--os-text-strong); box-shadow: inset 0 -2px 0 var(--os-border-strong) !important; }
#vynorNextApp .os-seed-catalogue-scroll { min-height: 0; overflow-y: auto; padding: 10px; }
#vynorNextApp .os-seed-catalogue-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(224px, 1fr)); gap: 10px; align-content: start; }
#vynorNextApp .os-seed-catalogue-list { display: grid; gap: 6px; align-content: start; }
#vynorNextApp .os-seed-catalogue-item { width: 100%; min-width: 0; display: grid; gap: 10px; padding: 12px; border: 1px solid var(--os-border); border-radius: 6px; background: var(--os-surface); color: var(--os-text); font: inherit; text-align: left; box-shadow: none !important; }
#vynorNextApp .os-seed-catalogue-item:hover { border-color: var(--os-border-strong); background: var(--os-surface-hover); }
#vynorNextApp .os-seed-catalogue-item.is-selected { border-color: var(--os-border-strong); background: var(--os-surface-hover); box-shadow: inset 3px 0 0 var(--os-border-strong) !important; }
#vynorNextApp .os-seed-catalogue-item > header { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
#vynorNextApp .os-seed-catalogue-item > header strong { min-width: 0; overflow: hidden; color: var(--os-text-strong); font-size: 13px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
#vynorNextApp .os-seed-catalogue-item dl { display: grid; gap: 7px; margin: 0; }
#vynorNextApp .os-seed-catalogue-item dl > div { min-width: 0; display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 8px; }
#vynorNextApp .os-seed-catalogue-item dt { color: var(--os-text-muted); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
#vynorNextApp .os-seed-catalogue-item dd { min-width: 0; margin: 0; overflow: hidden; color: var(--os-text); font-size: 12px; line-height: 1.35; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
#vynorNextApp .os-seed-catalogue-list .os-seed-catalogue-item { grid-template-columns: minmax(190px, 1.1fr) minmax(0, 2fr); align-items: center; gap: 18px; padding: 10px 12px; }
#vynorNextApp .os-seed-catalogue-list .os-seed-catalogue-item dl { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
#vynorNextApp .os-seed-catalogue-list .os-seed-catalogue-item dl > div { grid-template-columns: 1fr; gap: 3px; }
#vynorNextApp .os-seed-catalogue-list .os-seed-catalogue-item dd { text-align: left; }
#vynorNextApp .os-seed-status-tag.is-active { border-color: color-mix(in srgb, #16a34a 45%, var(--os-border)); color: #15803d; }
#vynorNextApp .os-seed-status-tag.is-inactive { border-color: var(--os-border-strong); color: var(--os-text-muted); }
#vynorNextApp .os-seed-client-backdrop { position: fixed; inset: 0; z-index: var(--os-layer-backdrop); background: var(--os-overlay); }
#vynorNextApp .os-seed-client-modal { position: fixed; top: 50%; left: 50%; z-index: var(--os-layer-modal); width: min(820px, calc(100vw - 40px)); height: min(670px, calc(100vh - 48px)); display: grid; grid-template-rows: auto auto minmax(0, 1fr); overflow: hidden; border: 1px solid var(--os-border); border-radius: 8px; background: var(--os-surface); color: var(--os-text); box-shadow: 0 28px 72px var(--os-overlay); transform: translate(-50%, -50%); }
#vynorNextApp .os-seed-client-modal > header { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 18px; border-bottom: 1px solid var(--os-border); }
#vynorNextApp .os-seed-client-modal > header span { display: block; color: var(--os-text-muted); font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .06em; }
#vynorNextApp .os-seed-client-modal h2 { margin: 4px 0 0; color: var(--os-text-strong); font-size: 19px; line-height: 1.25; letter-spacing: 0; }
#vynorNextApp .os-seed-client-modal .os-seed-detail-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
#vynorNextApp .os-seed-client-modal .os-seed-icon-action { width: 26px; height: 26px; border-color: transparent; border-radius: 4px; background: transparent; }
#vynorNextApp .os-seed-client-modal .os-seed-icon-action:hover { border-color: transparent; background: var(--os-surface-hover); }
#vynorNextApp .os-seed-client-modal .os-seed-icon-action svg { width: 14px; height: 14px; }
#vynorNextApp .os-seed-client-modal .os-seed-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; padding: 0 18px; overflow: visible; }
#vynorNextApp .os-seed-client-modal .os-seed-tabs button { min-width: 0; border-radius: 0; }
#vynorNextApp .os-seed-client-modal .os-seed-tabs button.is-active { box-shadow: inset 0 -2px 0 var(--os-text-strong) !important; }
#vynorNextApp .os-seed-client-modal .os-seed-detail-scroll { padding: 20px 22px; }
#vynorNextApp .os-seed-edit-panel { top: 50%; right: auto; bottom: auto; left: 50%; width: min(620px, calc(100vw - 40px)); max-height: min(560px, calc(100vh - 48px)); border: 1px solid var(--os-border); border-radius: 8px; box-shadow: 0 28px 72px var(--os-overlay); transform: translate(-50%, -50%); }
@media (max-width: 760px) {
  #vynorNextApp .os-seed-client-modal { width: calc(100vw - 24px); height: min(680px, calc(100vh - 24px)); }
  #vynorNextApp .os-seed-client-modal > header { align-items: flex-start; }
  #vynorNextApp .os-seed-client-modal .os-seed-detail-actions { gap: 6px; }
  #vynorNextApp .os-seed-client-modal .os-seed-tabs { padding: 0 10px; }
  #vynorNextApp .os-seed-client-modal .os-seed-tabs button { padding: 0 4px; font-size: 11px; }
  #vynorNextApp .os-seed-client-modal .os-seed-detail-scroll { padding: 16px; }
  #vynorNextApp .os-seed-edit-panel { width: calc(100vw - 24px); }
}
#vynorNextApp .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }

/* Settings is an operational surface: retain the Vynor navy/red identity without weakening form contrast. */
#vynorNextApp .os-settings-center { border-color: #bfd0e8; background: var(--os-surface); box-shadow: 0 30px 90px rgba(9, 27, 53, .28); }
#vynorNextApp .os-settings-center-head { border-color: #1c497d; background: linear-gradient(118deg, #081a33, #123f70 66%, #1a5b92); }
#vynorNextApp .os-settings-center-head span { color: #bcd5f3; }
#vynorNextApp .os-settings-center-head strong { color: #fff; }
#vynorNextApp .os-settings-center .os-drawer-close { border-color: rgba(255,255,255,.28) !important; background: rgba(255,255,255,.1) !important; color: #fff !important; }
#vynorNextApp .os-settings-center-body { background: var(--os-surface-raised); }
#vynorNextApp .os-settings-nav { border-color: #d6e3f4; background: var(--os-surface-raised); }
#vynorNextApp .os-settings-nav button { border-color: transparent !important; background: transparent !important; color: #183456 !important; }
#vynorNextApp .os-settings-nav button:hover { border-color: #c7d9f1 !important; background: var(--os-surface) !important; }
#vynorNextApp .os-settings-nav button.is-active { border-color: #a9c6ee !important; background: #eaf2ff !important; box-shadow: inset 3px 0 0 var(--os-accent), 0 8px 18px rgba(20, 63, 112, .08) !important; }
#vynorNextApp .os-settings-nav button.is-active strong { color: #0e315e; }
#vynorNextApp .os-settings-content { background: var(--os-surface); }
#vynorNextApp .os-settings-user-form { border-color: #cbdcf2; background: var(--os-surface-raised); }
#vynorNextApp .os-settings-user-add { width: fit-content !important; min-height: 32px !important; display: inline-flex !important; align-items: center !important; justify-self: start; gap: 6px !important; padding: 0 11px !important; border: 1px solid #b9d3f2 !important; border-radius: 7px !important; background: var(--os-surface) !important; color: #17477d !important; font: inherit !important; font-size: 11px !important; font-weight: 750 !important; box-shadow: none !important; }
#vynorNextApp .os-settings-user-add:hover { border-color: #8fb6e3 !important; background: #eff6ff !important; }
#vynorNextApp .os-settings-user-add svg { width: 14px !important; height: 14px !important; color: var(--os-accent); }
#vynorNextApp .os-settings-user-card { border-color: #d7e3f2; background: var(--os-surface); }
#vynorNextApp .os-settings-user-card.is-active { border-color: #9fc1eb; background: #eff6ff; box-shadow: 0 12px 28px rgba(24, 76, 135, .08); }
#vynorNextApp .os-settings-user-card-head > span { background: linear-gradient(135deg, #102a4c, #20558d); }
#vynorNextApp .os-settings-user-form-actions button { border-color: var(--os-accent) !important; background: var(--os-accent) !important; color: #fff !important; }
#vynorNextApp .os-settings-user-form-actions button:hover { border-color: var(--os-accent-hover) !important; background: var(--os-accent-hover) !important; }
#vynorNextApp .os-settings-access-link { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 8px; padding: 10px 12px; border: 1px solid #b9d3f2; border-radius: 8px; background: #eff6ff; }
#vynorNextApp .os-settings-access-link label { min-width: 0; display: grid; gap: 5px; color: #31567f; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
#vynorNextApp .os-settings-access-link input { min-width: 0; height: 32px; border: 1px solid #b9d3f2; border-radius: 6px; padding: 0 8px; background: var(--os-control); color: #183456; font: inherit; font-size: 12px; letter-spacing: 0; text-transform: none; }
#vynorNextApp .os-settings-access-link button { min-height: 32px !important; border-color: #315d91 !important; background: var(--os-surface) !important; color: #17477d !important; }
#vynorNextApp .os-settings-access-link button:hover { background: #e1efff !important; }
@media (max-width: 760px) {
  #vynorNextApp .os-seed-layout { height: auto; min-height: 0; grid-template-columns: 1fr; }
  #vynorNextApp .os-seed-catalogue-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #vynorNextApp .os-seed-search { grid-column: 1 / -1; }
  #vynorNextApp .os-seed-view-switcher { justify-self: end; }
  #vynorNextApp .os-seed-catalogue-grid { grid-template-columns: 1fr; }
  #vynorNextApp .os-seed-catalogue-list .os-seed-catalogue-item,
  #vynorNextApp .os-seed-catalogue-list .os-seed-catalogue-item dl { grid-template-columns: 1fr; gap: 8px; }
  #vynorNextApp .os-seed-client-list { max-height: 260px; }
  #vynorNextApp .os-seed-client-detail { min-height: 520px; }
  #vynorNextApp .os-seed-client-detail > header { align-items: flex-start; flex-direction: column; }
  #vynorNextApp .os-seed-detail-actions { justify-content: flex-start; }
  #vynorNextApp .os-seed-summary-list > div { grid-template-columns: 1fr; gap: 5px; }
  #vynorNextApp .os-seed-linked-row { grid-template-columns: 1fr; align-items: start; gap: 8px; }
  #vynorNextApp .os-seed-linked-row > div:last-child { justify-content: start; }
  #vynorNextApp .os-seed-integration-row { grid-template-columns: 1fr; justify-items: start; }
  #vynorNextApp .os-seed-integration-actions { justify-content: flex-start; }
}