/* OmniaIQ Savings Model · OmniaIQ look (omnia.css v3, 2026-10-18).
   Every rule is scoped to #oiq-roi: it can't affect the theme, and the ID outranks theme button/input styles.
   One weight only, eight type sizes, square corners, hairline borders, bronze for lines and markers only. */

@font-face{font-family:"Abel";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/abel-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2")}

#oiq-roi{
  --ground:#F4F3EF; --surface:#FBFAF7; --ink:#1F2937; --ink-2:#4B5563; --ink-3:#6B7280;
  --line:#DCD9D1; --line-2:#B7B2A7; --bronze:#88704F; --link:#3F6385;
  --ok:#3E5233; --warn:#8A5A00; --bad:#9B2C2C;
  --field:#FFFFFF; --bar:#1F2937; --btn-bg:#1F2937; --btn-fg:#FFFFFF; --btn-hover:#111827;
  --panel:#1F2937; --panel-line:rgba(255,255,255,.16); --panel-muted:rgba(255,255,255,.72); --panel-ok:#9CC78F; --panel-bad:#F08A8A;
  --shadow:rgba(31,41,55,.18);
  --f-sans:"Abel","Arial Narrow",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  background:var(--ground); color:var(--ink); font:400 14.5px/1.5 var(--f-sans);
  width:100%; max-width:1180px; margin-left:auto; margin-right:auto; text-align:left;
  border:1px solid var(--line);
}

/* dark mode (default): tokens from the OmniaIQ handoff */
#oiq-roi[data-theme="dark"]{
  --ground:#111821; --surface:#17212C; --ink:#E6E8EB; --ink-2:#B6BBC2; --ink-3:#8E949C;
  --line:#283341; --line-2:#3E4B5C; --bronze:#C2A57C; --link:#9DB8D3;
  --ok:#9CC78F; --warn:#E0B25C; --bad:#F08A8A;
  --field:#0D131A; --bar:#0B1118; --btn-bg:#E6E8EB; --btn-fg:#0F1113; --btn-hover:#FFFFFF;
  --panel:#1F2937; --panel-line:rgba(255,255,255,.14); --panel-muted:rgba(255,255,255,.70);
  --shadow:rgba(0,0,0,.5);
  color-scheme:dark;
}

/* resets against theme styles */
#oiq-roi,#oiq-roi *,#oiq-roi *::before,#oiq-roi *::after{box-sizing:border-box;border-radius:0}
#oiq-roi *{font-weight:400}
#oiq-roi h1,#oiq-roi h2,#oiq-roi h3,#oiq-roi b,#oiq-roi strong,#oiq-roi th{font-weight:400}
#oiq-roi p{margin:0;max-width:72ch}
#oiq-roi ul,#oiq-roi li{margin:0}
#oiq-roi table{margin:0;border-spacing:0}
#oiq-roi td,#oiq-roi th{border-left:0;border-right:0;border-top:0}
#oiq-roi input{margin:0;box-shadow:none;height:auto;line-height:1.3;min-height:0}
#oiq-roi button{text-transform:none;letter-spacing:normal;line-height:1.3;box-shadow:none;min-height:0;margin:0;font-weight:400}
#oiq-roi a{color:var(--link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
#oiq-roi .num{font-family:var(--f-mono);font-variant-numeric:tabular-nums}

/* top bar */
#oiq-roi .bar{height:56px;display:flex;align-items:center;gap:16px;padding:0 24px;background:var(--bar);color:#fff;border-bottom:2px solid var(--bronze)}
#oiq-roi .bar-logo{display:inline-flex;align-items:center;justify-content:center;background:#fff;padding:3px 6px;height:40px}
#oiq-roi .bar-logo img{display:block;height:34px;width:auto;max-width:none}
#oiq-roi .bar-name{font:400 14.5px var(--f-sans);text-transform:uppercase;letter-spacing:.06em}
#oiq-roi .bar-mode{margin-left:auto;background:none;border:0;padding:0;color:#fff;opacity:.85;font:400 13px var(--f-sans);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;cursor:pointer;min-height:34px}
#oiq-roi .bar-mode:hover{opacity:1}
#oiq-roi .bar-mode:focus:not(:focus-visible){outline:none;box-shadow:none}
#oiq-roi .bar-mode:focus-visible{outline:2px solid var(--bronze);outline-offset:2px}

/* layout */
#oiq-roi .wrap{padding:32px 24px 32px;display:grid;gap:32px}
#oiq-roi section{display:grid;gap:12px}
#oiq-roi header{display:grid;gap:12px}

/* titles */
#oiq-roi .title,#oiq-roi h1{font:400 27px/1.05 var(--f-sans);text-transform:uppercase;letter-spacing:.06em;margin:0;color:var(--ink);text-wrap:balance}
#oiq-roi h2{font:400 17px/1.15 var(--f-sans);text-transform:uppercase;letter-spacing:.06em;margin:0;color:var(--ink)}
#oiq-roi h1::after,#oiq-roi h2::after{content:"";display:block;width:24px;height:2px;margin-top:6px;background:var(--bronze)}
#oiq-roi .ctx{font-size:13px;color:var(--ink-2);font-family:var(--f-mono);font-size:11.5px}
#oiq-roi .lede{color:var(--ink-2)}

/* notices: one plain line in a hairline box */
#oiq-roi .notice{border:1px solid var(--line-2);background:var(--surface);color:var(--ink-2);padding:8px 12px;font-size:13px;width:fit-content;max-width:100%}

/* actions: one solid button, the rest are text links */
#oiq-roi .toolbar{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between}
#oiq-roi .actions{display:flex;flex-wrap:wrap;gap:16px;align-items:center}
#oiq-roi .btn{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 16px;border:0;background:var(--btn-bg);color:var(--btn-fg);font:400 14.5px var(--f-sans);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;cursor:pointer;text-decoration:none}
#oiq-roi .btn:hover{background:var(--btn-hover)}
#oiq-roi .btn:disabled{opacity:.5;cursor:not-allowed}
#oiq-roi .link{background:none;border:0;padding:0;color:var(--link);font:400 14.5px var(--f-sans);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;cursor:pointer;min-height:34px;display:inline-flex;align-items:center}
#oiq-roi .btn:focus-visible,#oiq-roi .link:focus-visible,#oiq-roi a:focus-visible{outline:2px solid var(--bronze);outline-offset:2px}
#oiq-roi .msg{font:400 11.5px var(--f-mono);color:var(--ink-2);min-height:1.2em}
#oiq-roi .msg:empty{min-height:0}

/* headline numbers: one big readout, then the summary strip */
#oiq-roi .readout{background:var(--panel);color:#fff;border:1px solid var(--panel);border-bottom:2px solid var(--bronze);padding:20px 24px;display:grid;gap:12px}
#oiq-roi .readout .k{display:block;font:400 10px var(--f-mono);color:var(--panel-muted)}
#oiq-roi .readout .n{display:block;font-size:11.5px;color:var(--panel-muted)}
#oiq-roi .big .v{display:block;font:400 36px/1.1 var(--f-mono);font-variant-numeric:tabular-nums;margin:2px 0}
#oiq-roi .summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--panel-line);border-left:0}
#oiq-roi .summary > *{padding:9px 12px;border-left:1px solid var(--panel-line);min-width:0}
#oiq-roi .summary .v{display:block;font:400 17px/1.2 var(--f-mono);font-variant-numeric:tabular-nums;margin:2px 0}
#oiq-roi .is-ok{color:var(--ok)}
#oiq-roi .is-bad{color:var(--bad)}
#oiq-roi .readout .is-ok{color:var(--panel-ok)}
#oiq-roi .readout .is-bad{color:var(--panel-bad)}
#oiq-roi .readout .note{font-size:13px;color:var(--panel-muted)}

/* profile inputs */
#oiq-roi .profile{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px 24px;background:var(--surface);border:1px solid var(--line);padding:16px 20px}
#oiq-roi .field{display:grid;grid-row:span 3;grid-template-rows:subgrid;row-gap:4px;min-width:0}
#oiq-roi .field label,#oiq-roi .lab-row label{font:400 10px var(--f-mono);color:var(--ink-3);align-self:end}
#oiq-roi .lab-row{display:flex;align-items:flex-end;gap:8px;align-self:end}
#oiq-roi .field small{align-self:start;color:var(--ink-3);font-size:11.5px;line-height:1.35}
#oiq-roi input[type=number],#oiq-roi input.money{font:400 14.5px var(--f-mono);color:var(--ink);background:var(--field);border:1px solid var(--line-2);padding:0 12px;min-height:44px;width:100%;font-variant-numeric:tabular-nums}
#oiq-roi input:focus-visible{outline:2px solid var(--bronze);outline-offset:2px}
#oiq-roi .subhead{grid-column:1/-1;font:400 11.5px var(--f-mono);color:var(--ink-2);border-top:1px solid var(--line);padding-top:12px}
#oiq-roi .subhead:first-child{border-top:0;padding-top:0}
#oiq-roi .tier-now{display:block;margin-top:3px;font:400 11.5px var(--f-mono);color:var(--ink-2)}
#oiq-roi .tier-now.inline{display:inline;margin:0}

/* help buttons */
#oiq-roi .info{flex:none;width:20px;height:20px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink-2);font:400 11.5px var(--f-mono);line-height:1;padding:0;cursor:pointer;display:inline-grid;place-items:center}
#oiq-roi .info:hover,#oiq-roi .info[aria-expanded="true"]{border-color:var(--ink);color:var(--ink)}
#oiq-roi .info:focus-visible{outline:2px solid var(--bronze);outline-offset:2px}
#oiq-roi .lv-help{display:flex;align-items:center;gap:8px;margin-top:8px}

/* headcount table */
#oiq-roi .hc{grid-column:1/-1;display:grid;gap:4px;min-width:0}
#oiq-roi table.hc-t{min-width:560px}
#oiq-roi .hc-t th[scope=row]{font:400 13px var(--f-sans);color:var(--ink);background:none}
#oiq-roi .hc-t th[scope=row] small{display:block;color:var(--ink-3);font-size:11.5px;margin-top:2px}
#oiq-roi .hc-t td{white-space:nowrap}
#oiq-roi .hc-t input{width:8ch;min-height:34px;padding:0 8px;text-align:right}
#oiq-roi .hc-t input.sal{width:11ch}
#oiq-roi .hc-t .pre,#oiq-roi .hc-t .post{color:var(--ink-3);font:400 11.5px var(--f-mono);margin:0 4px}
#oiq-roi .hc-t tfoot th,#oiq-roi .hc-t tfoot td{background:var(--ground)}
#oiq-roi .plan-k{font:400 10px var(--f-mono);color:var(--ink-3);margin-right:8px}
#oiq-roi .hc-note{color:var(--ink-3);font-size:11.5px}

/* tables */
#oiq-roi .tbl{overflow-x:auto;background:var(--surface);border:1px solid var(--line)}
#oiq-roi table{width:100%;border-collapse:collapse;font-size:13px;min-width:860px}
#oiq-roi th{text-align:left;font:400 11.5px var(--f-mono);color:var(--ink-3);text-transform:none;letter-spacing:0;padding:8px 12px;border-bottom:1px solid var(--line-2);background:var(--surface);vertical-align:bottom}
#oiq-roi td{padding:8px 12px;border-bottom:1px solid var(--line);vertical-align:top}
#oiq-roi td.n,#oiq-roi th.n,#oiq-roi td.num{font-family:var(--f-mono);text-align:right;font-variant-numeric:tabular-nums}
#oiq-roi tfoot td{border-bottom:0;background:var(--ground)}
#oiq-roi .lever{font-size:14.5px}
#oiq-roi .lever small{display:block;color:var(--ink-3);font-size:11.5px;margin-top:2px;max-width:42ch}
#oiq-roi .dash{color:var(--line-2)}
#oiq-roi td.fx{font-size:13px;color:var(--ink-2);line-height:2.1;min-width:0}
#oiq-roi .fx b{font:400 13px var(--f-mono);color:var(--ink)}
#oiq-roi .fx b.res{color:var(--ok)}
#oiq-roi input.link{font:400 13px var(--f-mono);color:var(--ink);background:var(--field);border:1px solid var(--line-2);padding:1px 4px;min-height:0;width:3ch;box-sizing:content-box;text-align:center;font-variant-numeric:tabular-nums;-moz-appearance:textfield;appearance:textfield;text-decoration:none;display:inline-block}
#oiq-roi input.link::-webkit-outer-spin-button,#oiq-roi input.link::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* status chips: fixed width, hollow square = estimate */
#oiq-roi .chip{display:inline-flex;align-items:center;gap:6px;width:22ch;max-width:100%;padding:1px 7px;margin-top:8px;font:400 10px var(--f-mono);border:1px solid currentColor;white-space:nowrap;overflow:hidden}
#oiq-roi .chip::before{content:"";width:7px;height:7px;background:currentColor;flex:none}
#oiq-roi .chip--ok{color:var(--ok)}
#oiq-roi .chip--warn{color:var(--warn)}
#oiq-roi .chip--bad{color:var(--bad)}
#oiq-roi .chip--est::before{background:transparent;box-shadow:inset 0 0 0 1px currentColor}

/* lists and sources */
#oiq-roi ul.plain{padding-left:16px;display:grid;gap:4px;max-width:80ch}
#oiq-roi .src li{font-size:13px;color:var(--ink-2)}
#oiq-roi .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px}
#oiq-roi .cols > div{display:grid;gap:12px;align-content:start;min-width:0}

/* jump to the lever detail */
#oiq-roi .jump{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;background:var(--surface);border:1px solid var(--line);border-left:2px solid var(--bronze);padding:16px 20px}
#oiq-roi .jump-txt{display:grid;gap:2px;max-width:62ch}
#oiq-roi .jump-txt .jt{font:400 17px var(--f-sans);color:var(--ink)}
#oiq-roi .jump-txt > span:last-child{font-size:13px;color:var(--ink-2)}
#oiq-roi #oiq-jumpTotal{font-family:var(--f-mono);color:var(--ok)}
#oiq-roi .sec-head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:8px}
#oiq-roi #oiq-levers-sec:focus,#oiq-roi #oiq-summary:focus{outline:none}

/* helper-scale popover: the one floating layer, so it keeps a shadow */
#oiq-roi .pop{position:fixed;z-index:50;top:0;left:0;width:min(440px,calc(100vw - 24px));max-height:calc(100vh - 24px);overflow:auto;background:var(--surface);border:1px solid var(--line-2);box-shadow:0 8px 24px var(--shadow);padding:16px;display:grid;gap:8px}
#oiq-roi .pop[hidden]{display:none}
#oiq-roi .pop-h{font:400 17px var(--f-sans);text-transform:uppercase;letter-spacing:.06em;color:var(--ink)}
#oiq-roi .pop-sub,#oiq-roi .pop-foot{font-size:11.5px;color:var(--ink-3)}
#oiq-roi .tiers{display:grid;gap:4px}
#oiq-roi .tier{display:grid;grid-template-columns:4.4em 1fr;gap:12px;align-items:start;text-align:left;background:var(--surface);border:1px solid var(--line);padding:8px 12px;cursor:pointer;color:var(--ink);font:400 13px/1.4 var(--f-sans);min-height:44px}
#oiq-roi .tier:hover{border-color:var(--line-2)}
#oiq-roi .tier:focus-visible{outline:2px solid var(--bronze);outline-offset:1px}
#oiq-roi .tier.on{border-color:var(--ink);border-left:2px solid var(--bronze)}
#oiq-roi .tv{font:400 17px var(--f-mono);color:var(--ink);font-variant-numeric:tabular-nums}
#oiq-roi .tt b{display:block;font-size:14.5px;color:var(--ink)}

/* lead form dialog */
#oiq-roi .oiq-lead{border:1px solid var(--line-2);padding:0;width:min(460px,calc(100vw - 24px));max-height:calc(100vh - 24px);background:var(--surface);color:var(--ink);box-shadow:0 12px 32px var(--shadow)}
#oiq-roi .oiq-lead::backdrop{background:rgba(31,41,55,.45)}
#oiq-roi .oiq-lead form{display:grid;gap:8px;padding:24px}
#oiq-roi .oiq-lead .notice{width:auto}
#oiq-roi .oiq-lead label{font:400 10px var(--f-mono);color:var(--ink-3);margin-top:4px}
#oiq-roi .oiq-lead input[type=text],#oiq-roi .oiq-lead input[type=email]{font:400 14.5px var(--f-mono);color:var(--ink);background:var(--field);border:1px solid var(--line-2);padding:0 12px;min-height:44px;width:100%}
#oiq-roi .oiq-check{display:flex;gap:8px;align-items:flex-start;font:400 13px/1.45 var(--f-sans) !important;color:var(--ink) !important;margin-top:4px}
#oiq-roi .oiq-check input[type=checkbox]{all:revert;flex:none;width:16px;height:16px;margin:2px 0 0;accent-color:var(--ink);cursor:pointer}
#oiq-roi .oiq-check input[type=checkbox]::before,#oiq-roi .oiq-check input[type=checkbox]::after{content:none;display:none}
#oiq-roi .oiq-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
#oiq-roi .oiq-lead-err{color:var(--bad);font-size:13px;min-height:1.1em}
#oiq-roi .oiq-lead-err:not(:empty){border:1px solid var(--bad);padding:8px 12px}
#oiq-roi .oiq-lead-actions{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
#oiq-roi .oiq-lead-note{font-size:11.5px;color:var(--ink-3)}

/* phone */
@media (max-width:767px){
  #oiq-roi{border:0}
  #oiq-roi .bar{padding:0 16px}
  #oiq-roi .wrap{padding:24px 16px}
  #oiq-roi .title,#oiq-roi h1{font-size:21px}
  #oiq-roi .readout{padding:16px}
  #oiq-roi .profile,#oiq-roi .jump{border:0;padding:0;background:transparent}
  #oiq-roi .jump{border-left:2px solid var(--bronze);padding-left:12px}
  #oiq-roi .summary{grid-template-columns:1fr;border-left:1px solid var(--panel-line)}
  #oiq-roi .summary > *{border-left:0;border-top:1px solid var(--panel-line)}
  #oiq-roi .summary > *:first-child{border-top:0}
  #oiq-roi .actions{width:100%}
  #oiq-roi .actions .btn,#oiq-roi .oiq-lead .btn{width:100%;min-height:44px}
  #oiq-roi .link,#oiq-roi .info{min-height:44px}
  #oiq-roi .info{width:44px;height:44px}
  #oiq-roi .hc-t input{min-height:44px}
}

@media (prefers-reduced-motion:reduce){#oiq-roi *{transition:none!important}}
