:root{
  --nav:#007d6f;--nav-dark:#05695f;--blue:#1769d2;--bg:#f3f6fa;--text:#1b2b3a;
  --muted:#68788d;--line:#dfe6ef;--green:#16865a;--orange:#b85f00;--red:#bd3544;
  --focus:#55d8c8;--shadow:0 8px 30px rgba(32,52,76,.08)
}
*{box-sizing:border-box}
html{color-scheme:light}
body{margin:0;font:14px Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--text);background:var(--bg)}
button,input,select,textarea{font:inherit}
button{touch-action:manipulation}
:where(button,a,input,select,textarea,summary):focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.skip-link{position:fixed;left:12px;top:-60px;z-index:200;background:#fff;padding:10px 14px;border-radius:8px;color:#075f57}
.skip-link:focus{top:12px}
.app{display:grid;grid-template-columns:252px minmax(0,1fr);min-height:100vh;transition:grid-template-columns .2s ease}
.app.sidebar-collapsed{grid-template-columns:0 minmax(0,1fr)}
.side{position:sticky;top:0;height:100vh;width:252px;overflow:auto;background:var(--nav);color:#effffc;padding:18px 8px;transition:transform .2s ease,visibility .2s ease;z-index:60}
.app.sidebar-collapsed .side{transform:translateX(-100%);visibility:hidden}
.brand{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 10px 24px;color:#fff;font-size:24px;font-weight:850}
.brand-mark{display:inline-flex;gap:0;align-items:baseline;color:#fff;letter-spacing:-.7px;white-space:nowrap}.brand-mark span{color:#fff}
.group{margin:20px 4px 7px;color:rgba(235,255,252,.76);font-size:12px;letter-spacing:.055em;text-transform:uppercase}
.nav{display:flex;align-items:center;gap:14px;min-height:54px;margin:1px 0;padding:12px 10px;border-radius:10px;color:#f1fffd;text-decoration:none;cursor:pointer;font-size:16px;font-weight:720;line-height:1.2}
.nav:hover{background:rgba(0,62,56,.25);color:#fff}.nav.active{background:rgba(0,58,53,.38);color:#fff}
.nav[hidden],.group[hidden]{display:none}
.nav-icon{display:grid;place-items:center;width:24px;height:24px;flex:0 0 24px}
.nav-icon svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.nav-label{min-width:0}
.main{min-width:0}
.top{position:sticky;top:0;z-index:45;min-height:74px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:16px;justify-content:space-between;padding:10px 28px}
.top-left{display:flex;align-items:center;gap:12px;min-width:0}
.top h1{font-size:20px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top-tools{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:0;flex:1}
.user{display:flex;align-items:center;gap:8px;color:var(--muted);min-width:0}
.menu-toggle{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:#fff;color:#20384c;font-size:21px;cursor:pointer}
.back-button{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:#f5f8fc;color:#20384c;font-size:24px;line-height:1;cursor:pointer}
.back-button:hover{background:#eaf1fb}
.back-button[hidden]{display:none}
.side-menu-toggle{display:none;background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.sidebar-backdrop{display:none}
.content{width:100%;max-width:1500px;margin:auto;padding:28px}
.toolbar{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:20px}
.btn,.dosis-primary{border:0;background:var(--blue);color:#fff;border-radius:8px;padding:10px 14px;cursor:pointer}
.btn.light{background:#e8f0ff;color:#174fa7}.btn.danger{background:var(--red)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.card,.panel{background:#fff;border:1px solid var(--line);border-radius:13px;padding:18px;box-shadow:0 1px 0 rgba(30,55,75,.02)}
.panel{margin-top:18px}.panel h2{margin:0 0 15px;font-size:17px}
.metric{font-size:27px;font-weight:760;margin-top:7px}.label,.muted{color:var(--muted);font-size:13px}
.up{color:var(--green);font-size:12px}.warning{color:var(--orange)}.danger-text{color:var(--red)}
table{width:100%;border-collapse:collapse}th{text-align:left;color:var(--muted);font-weight:650;font-size:12px}td,th{padding:12px 8px;border-bottom:1px solid var(--line)}
.badge{display:inline-block;padding:4px 9px;border-radius:99px;font-size:12px;background:#fff1df;color:#9a5200}
.badge.green{background:#e4f6ec;color:#087346}.badge.blue{background:#e8f0ff;color:#2454a5}.badge.red{background:#fee9eb;color:#a82233}
.hidden{display:none!important}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form label{display:grid;gap:6px;color:var(--muted)}
input,select,textarea{border:1px solid #c8d4e2;border-radius:8px;padding:10px;background:#fff;color:var(--text)}
textarea{min-height:90px}.full{grid-column:1/-1}.empty{color:var(--muted);padding:32px;text-align:center}
.list{display:grid;gap:10px}.row{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:9px}
.modal{position:fixed;inset:0;z-index:100;background:rgba(15,34,52,.65);display:grid;place-items:center;padding:20px;overflow:auto}
.dialog{max-width:680px;width:100%;max-height:calc(100vh - 40px);overflow:auto;background:#fff;border-radius:14px;padding:22px;box-shadow:var(--shadow)}
.dialog h2{margin-top:0}
.network-status{display:flex;align-items:center;gap:6px;border-radius:99px;padding:7px 10px;background:#edf7f5;color:#14695f;font-size:12px;white-space:nowrap}
.network-status::before{content:"";width:8px;height:8px;border-radius:50%;background:#21a779}
.network-status.offline{background:#fff0e5;color:#984f12}.network-status.offline::before{background:#e27d2e}
.toast-host{position:fixed;right:18px;bottom:18px;z-index:160;display:grid;gap:10px;max-width:min(430px,calc(100vw - 36px))}
.toast{background:#152c42;color:#fff;border-radius:11px;padding:12px 15px;box-shadow:var(--shadow);animation:toast-in .18s ease-out}
.toast.error{background:#9e2937}.toast.success{background:#08705c}
@keyframes toast-in{from{transform:translateY(8px);opacity:0}}
.global-search{position:relative;flex:1;max-width:520px}
.global-search input{width:100%;padding-left:38px;background:#f6f8fb}
.global-search-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none}
.search-hint{position:absolute;right:10px;top:50%;transform:translateY(-50%);border:1px solid var(--line);border-radius:5px;background:#fff;padding:2px 5px;color:var(--muted);font-size:11px}
.search-results{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:90;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:7px;max-height:420px;overflow:auto}
.search-result{width:100%;border:0;background:#fff;border-radius:8px;padding:10px;text-align:left;display:grid;gap:3px;cursor:pointer}
.search-result:hover,.search-result.active{background:#edf5ff}
.search-result small{color:var(--muted)}
.workspace-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}
.workspace-hero h2{font-size:25px;margin:0 0 5px}.workspace-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:flex-end}
.workspace-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}
.workspace-task{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}
.workspace-task button{white-space:nowrap}
.workspace-task-title{font-weight:700}.workspace-task-meta{color:var(--muted);font-size:12px;margin-top:4px}
.workspace-target{display:flex;gap:8px;align-items:center;color:var(--muted)}
.workspace-target strong{color:var(--green)}
.owner-workspace-active .top .global-search{display:none}
.owner-period-panel{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:0 0 16px;padding:12px 14px;background:#fff;border:1px solid var(--line);border-radius:13px}
.owner-period-presets,.owner-period-custom{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.owner-period-chip{border:1px solid var(--line);border-radius:99px;background:#f7f9fc;color:#355069;padding:8px 12px;cursor:pointer}
.owner-period-chip:hover{background:#edf3fb}.owner-period-chip.active{border-color:#1769d2;background:#e8f0ff;color:#174fa7;font-weight:700}
.owner-period-custom label{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:12px}
.owner-period-custom input{width:145px;padding:8px}
.owner-metric-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.owner-metric-card{position:relative;overflow:hidden;min-height:136px}
.owner-metric-card::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--blue)}
.owner-metric-card.turnover::before{background:#13865b}
.owner-metric-card.conversion::before{background:#7756bb}
.owner-metric-card.margin::before{background:#078a86}
.owner-metric-card.debt::before{background:#d17818}
.owner-metric-card.approvals::before{background:#7756bb}
.owner-metric-caption{margin-top:8px;color:var(--muted);font-size:12px;line-height:1.4}
.owner-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:18px}
.owner-charts .branch-chart:last-child:nth-child(odd){grid-column:1/-1}
.branch-chart-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:18px}
.branch-chart-heading h3{margin:0;font-size:16px}.branch-chart-heading span{color:var(--muted);font-size:12px}
.branch-bars{display:grid;gap:15px}.branch-bar-row{display:grid;gap:7px}
.branch-bar-label{display:flex;justify-content:space-between;gap:12px;font-size:13px}
.branch-bar-label span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.branch-bar-label b{white-space:nowrap}
.branch-bar-track{height:9px;border-radius:99px;background:#edf1f6;overflow:hidden}
.branch-bar-track span{display:block;height:100%;border-radius:inherit;background:var(--blue);transition:width .25s ease}
.branch-bar-track span.green{background:#16865a}.branch-bar-track span.teal{background:#078a86}
.branch-bar-track span.orange{background:#d17818}.branch-bar-track span.violet{background:#7756bb}
.branch-bar-track span.negative{background:var(--red)}
.owner-search-panel{position:relative;z-index:3}.owner-search-panel .toolbar{margin-bottom:13px}
.owner-search{position:relative;max-width:820px}
.owner-search input{width:100%;padding:13px 14px 13px 42px;background:#f8fafc}
.owner-search .search-results{top:calc(100% + 7px)}
.draft-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;margin:0 0 14px;border:1px solid #f0ce89;border-radius:9px;background:#fff8e8;color:#775014}
.draft-banner-actions{display:flex;gap:8px;flex-wrap:wrap}
.blocker-panel{border-left:4px solid var(--red)}.blocker-panel.ok{border-left-color:var(--green)}
.blocker-list{display:grid;gap:8px;margin-top:12px}.blocker-item{padding:10px;border-radius:8px;background:#fff0f1;color:#7c2430}
.loading-state{min-height:220px;display:grid;place-items:center;color:var(--muted)}
.video{background:#142b42;color:#fff;padding:18px;border-radius:10px}
.role{display:flex;gap:10px;flex-wrap:wrap}.chip{padding:7px 10px;border-radius:99px;background:#edf2f8}
@media(max-width:1100px){
  .app,.app.sidebar-collapsed{grid-template-columns:1fr}.side{position:fixed;left:0;top:0;width:min(82vw,300px);box-shadow:10px 0 30px rgba(7,21,37,.35)}
  .app.sidebar-collapsed .side{transform:translateX(-105%)}.app:not(.sidebar-collapsed) .side{transform:translateX(0);visibility:visible}
  .side-menu-toggle{display:grid}.sidebar-backdrop{position:fixed;inset:0;z-index:50;border:0;background:rgba(7,21,37,.55)}
  .app:not(.sidebar-collapsed) .sidebar-backdrop{display:block}.top{padding:10px 16px}.content{padding:18px}.grid,.workspace-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .owner-metric-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  .top{align-items:flex-start;flex-wrap:wrap}.top-left{min-height:44px}.top-tools{order:2;flex-basis:100%;flex-wrap:wrap;justify-content:stretch}
  .global-search{max-width:none;min-width:100%}.user{margin-left:auto}.network-status{display:none}.grid,.workspace-metrics,.form{grid-template-columns:1fr}
  .toolbar,.workspace-hero{align-items:stretch;flex-direction:column}.workspace-actions{justify-content:flex-start}.workspace-task{grid-template-columns:1fr}
  .owner-period-panel,.owner-period-custom{align-items:stretch;flex-direction:column}.owner-period-presets{width:100%}
  .owner-period-chip{flex:1 1 auto}.owner-period-custom{width:100%}.owner-period-custom label{justify-content:space-between}.owner-period-custom input{width:min(68%,220px)}
  .owner-metric-grid,.owner-charts{grid-template-columns:1fr}.owner-charts .branch-chart:last-child:nth-child(odd){grid-column:auto}
  .modal{padding:8px;place-items:start center}.dialog{max-height:calc(100vh - 16px);padding:18px 14px}.content{padding:14px}
}
@media(pointer:coarse),(max-width:900px){.btn,.dosis-primary,.nav,.menu-toggle,.back-button{min-height:44px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}