/* Sverka adapter for the unmodified Finmonitor public/css/ds.css.
   Component metrics come from that system. Only legacy hooks and the
   domain-specific layouts/charts remain here; the palette lives in ds.css. */
body.ios.sverka-app {
  --bg:var(--page); --panel:var(--surface); --soft:var(--surface-2);
  --line-soft:var(--line); --ink-3:var(--faint); --hint:var(--muted);
  --primary:var(--accent); --primary-ink:var(--accent-ink);
  --good:var(--ok); --bad:var(--err); --warn:var(--wait); --off:var(--faint);
  --p1:var(--err); --p1-bg:var(--err-soft);
  --p2:var(--wait); --p2-bg:var(--wait-soft);
  --p3:var(--muted); --p3-bg:var(--surface-2); --ok-bg:var(--ok-soft);
  --r:var(--r-card); --r-sm:var(--r-ctl); --font:var(--fs);
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --shadow:var(--shadow-sm); --grid:var(--line); --muted-line:var(--line-2);
  /* Stable categorical chart series. These encode channels, not statuses. */
  --s1:#2a78d6; --s2:#eb6834; --s3:#1baf7a; --s4:#eda100;
  --s5:#e87ba4; --s6:#008300; --s7:#4a3aa7; --s8:#e34948;
  --lime:var(--ok); --orange:var(--wait);
  font-feature-settings:normal;
}
:root[data-theme="dark"] body.ios.sverka-app {
  --s1:#3987e5; --s2:#d95926; --s3:#199e70; --s4:#c98500;
  --s5:#d55181; --s6:#008300; --s7:#9085e9; --s8:#e66767;
}
@media(prefers-color-scheme:dark){
  :root:not([data-theme="light"]) body.ios.sverka-app {
    --s1:#3987e5; --s2:#d95926; --s3:#199e70; --s4:#c98500;
    --s5:#d55181; --s6:#008300; --s7:#9085e9; --s8:#e66767;
  }
}
body.ios .sverka-app ::selection {background:var(--tint-soft);color:var(--ink)}
body.ios .sverka-app input,body.ios .sverka-app textarea {caret-color:var(--tint)}
body.ios .sverka-app a {text-decoration:none}
body.ios .sverka-app a:not(.btn,.ui-chip,.fchip,.act,.abtn,.linkbtn,.tab,.ns-item,.seg a):hover {text-decoration:underline;text-underline-offset:3px}
body.ios .sverka-app img,body.ios .sverka-app svg {max-width:100%}
body.ios .sverka-app .sr {position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
body.ios .sverka-app .num {font-variant-numeric:tabular-nums;font-feature-settings:'tnum' 1;letter-spacing:-.01em}
body.ios .sverka-app .mono {font-family:var(--fs);font-variant-numeric:tabular-nums}
body.ios .sverka-app code,body.ios .sverka-app pre {font-family:var(--mono)}
body.ios .sverka-app h2:not(.treason,.zone-h,.section-t) {font-size:20px;font-weight:700;letter-spacing:-.02em;color:var(--ink);margin:32px 2px 14px;scroll-margin-top:76px}
body.ios .sverka-app h3 {font-size:16px;font-weight:600;letter-spacing:-.01em;margin:0}
body.ios .sverka-app .ui-head:not(.pagehead) {display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
body.ios .sverka-app .ui-head:not(.pagehead) h1 {font-size:clamp(27px,3.3vw,37px);font-weight:700;letter-spacing:-.032em;line-height:1.04;margin:0}
body.ios .sverka-app .ui-head:not(.pagehead) p {margin:9px 0 0;color:var(--muted);font-size:13.5px;max-width:70ch}
body.ios .sverka-app .ui-sub {font-size:13px;line-height:1.45;color:var(--muted);margin:7px 0 18px;max-width:75ch}
body.ios .sverka-app .ui-hint,body.ios .sverka-app .hint {font-size:11.5px;color:var(--muted)}
body.ios .sverka-app .muted,body.ios .sverka-app .dim:not(.fchip.on .dim) {color:var(--muted)}
body.ios .sverka-app .s:not(.empty .s,.dashq .s,.statecard .s) {font-size:13px}
body.ios .sverka-app .xs {font-size:12px}
body.ios .sverka-app .flex {display:flex;gap:10px;align-items:center;flex-wrap:wrap}
body.ios .sverka-app .ui-card:not(.panel) {min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--shadow-sm);-webkit-backdrop-filter:none;backdrop-filter:none}
body.ios .sverka-app .ui-pad {padding:20px}
body.ios .sverka-app .rows > * + * {border-top:1px solid var(--line)}
body.ios .sverka-app .rows > .row {padding:15px 20px}
body.ios .sverka-app .ui-grid2 {display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:24px;align-items:start}
body.ios .sverka-app .ui-grid2.even {grid-template-columns:repeat(2,minmax(0,1fr))}
body.ios .sverka-app .ui-kpis {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));gap:16px}
body.ios .sverka-app .ui-kpi:not(.kpi) {display:flex;flex-direction:column;gap:6px;padding:20px}
body.ios .sverka-app .ui-kpi:not(.kpi) .label {font-size:12px;font-weight:600;color:var(--muted)}
body.ios .sverka-app .ui-kpi:not(.kpi) .value {font-size:clamp(26px,3vw,34px);font-weight:650;letter-spacing:-.038em;line-height:1;font-variant-numeric:tabular-nums}
body.ios .sverka-app .ui-kpi:not(.kpi) .value.muted {color:var(--faint)}
body.ios .sverka-app .ui-kpi:not(.kpi) .foot {display:flex;justify-content:space-between;align-items:flex-end;gap:8px;min-height:30px;flex-wrap:wrap}
body.ios .sverka-app .delta {font-size:12px;display:inline-flex;align-items:center;gap:3px}
body.ios .sverka-app .delta.good {color:var(--ok)}
body.ios .sverka-app .delta.bad {color:var(--err)}
body.ios .sverka-app .delta.flat {color:var(--faint)}
body.ios .sverka-app .ui-urgent {background:var(--surface);border-color:var(--line);box-shadow:var(--shadow-sm)}
body.ios .sverka-app .ui-urgent b.ttl {font-weight:600;color:var(--ink)}

/* Default legacy button is Finmonitor secondary; primary/tint/ghost/danger
   keep the genuine rules from ds.css. Old xs is its sm size. */
body.ios .sverka-app .btn:not(.primary,.tint,.ghost,.danger) {background:var(--surface);border-color:var(--line-2);color:var(--ink-2);-webkit-backdrop-filter:none;backdrop-filter:none}
body.ios .sverka-app .btn:not(.primary,.tint,.ghost,.danger):hover {background:color-mix(in srgb,var(--ink) 4%,transparent)}
body.ios .sverka-app .btn.xs:not(.sm) {height:32px;min-height:32px;padding:0 14px;font-size:12.5px}
body.ios .sverka-app .btn {font-family:var(--fs);line-height:20px;letter-spacing:normal}
body.ios .sverka-app .btn.primary {border-color:transparent}
body.ios .sverka-app .btn .ph {font-size:16px}
body.ios .sverka-app .btn.xs:not(.sm) .ph {font-size:15px}
body.ios .sverka-app .ui-chip:not(.fchip) {display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:32px;padding:0 13px;font:600 12.5px/20px var(--fs);border-radius:var(--r-pill);border:1px solid var(--line);background:color-mix(in srgb,var(--surface) 70%,transparent);color:var(--muted);cursor:pointer;max-width:100%;text-decoration:none;white-space:nowrap}
body.ios .sverka-app .ui-chip:not(.fchip):hover {background:var(--surface);color:var(--ink-2)}
body.ios .sverka-app .ui-chip:not(.fchip).on,body.ios .sverka-app .ui-chip:not(.fchip)[aria-pressed="true"],body.ios .sverka-app .ui-chip:not(.fchip)[aria-current="true"] {background:var(--tint-soft);border-color:var(--tint-soft);color:var(--tint);box-shadow:none}
body.ios .sverka-app .ui-chip:not(.fchip):disabled {opacity:.45;pointer-events:none}
body.ios .sverka-app .ui-tag {display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:500;line-height:16px;padding:0;border:0;background:transparent;color:var(--muted);max-width:100%;overflow-wrap:anywhere}
body.ios .sverka-app .ui-per {font-size:11.5px;font-weight:450;line-height:16px;color:var(--faint);border:0;background:transparent;border-radius:0;padding:0;font-variant-numeric:tabular-nums;vertical-align:middle}
body.ios .sverka-app .ui-prio,body.ios .sverka-app .sev {display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:500;line-height:16px;color:var(--faint);white-space:nowrap;padding:0;border:0;background:transparent;border-radius:0}
body.ios .sverka-app .ui-prio::before,body.ios .sverka-app .sev::before {content:"";width:5px;height:5px;border-radius:50%;background:currentColor;flex:none}
body.ios .sverka-app .ui-prio.p1,body.ios .sverka-app .sev.p1 {color:var(--err);font-weight:650}
body.ios .sverka-app .ui-prio.p1::before,body.ios .sverka-app .sev.p1::before {width:6px;height:6px}
body.ios .sverka-app .ui-prio.p2,body.ios .sverka-app .sev.p2 {color:var(--muted)}
body.ios .sverka-app .ui-prio.p2::before,body.ios .sverka-app .sev.p2::before {background:var(--wait)}
body.ios .sverka-app .ui-prio.p3,body.ios .sverka-app .sev.p3 {color:var(--faint)}
body.ios .sverka-app .st-ok {color:var(--ok)}
body.ios .sverka-app .st-warn {color:var(--wait)}
body.ios .sverka-app .st-bad {color:var(--err)}
body.ios .sverka-app .st-off {color:var(--faint)}
body.ios .sverka-app .ui-sq {display:inline-block;width:9px;height:9px;border-radius:2px;flex:none}

/* Native forms use the same input/select/label metrics as Finmonitor. */
body.ios .sverka-app input.in,body.ios .sverka-app select.in,body.ios .sverka-app textarea.in,
body.ios .sverka-app .rp-bar select,body.ios .sverka-app .rp-bar input[type=date] {width:100%;min-width:0;height:40px;padding:0 14px;border:1px solid var(--line-2);border-radius:var(--r-ctl);background-color:var(--surface);color:var(--ink);font:inherit;font-size:13.5px;transition:border-color .15s,box-shadow .15s}
body.ios .sverka-app select.in {appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238a8a8e' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:34px}
body.ios .sverka-app textarea.in {height:auto;padding:11px 14px;line-height:1.5}
body.ios .sverka-app .in:focus {border-color:var(--focus);outline:none;box-shadow:0 0 0 4px color-mix(in srgb,var(--focus) 18%,transparent)}
body.ios .sverka-app .in::placeholder {color:var(--faint)}
body.ios .sverka-app .in[readonly] {background:var(--surface-2);color:var(--ink-2)}
body.ios .sverka-app .in:disabled {opacity:.45;cursor:not-allowed}
body.ios .sverka-app .in[aria-invalid="true"] {border-color:var(--err)}
body.ios .sverka-app label.lb {display:block;font-size:12px;font-weight:600;color:var(--muted);margin:0 0 6px}
body.ios .sverka-app input[type=checkbox],body.ios .sverka-app input[type=radio] {accent-color:var(--accent);cursor:pointer}
body.ios .sverka-app input[type=checkbox] {width:18px;height:18px;vertical-align:middle;border-radius:6px}
body.ios .sverka-app pre {background:var(--surface-2);border:1px solid var(--line);color:var(--ink-2);padding:14px 16px;border-radius:var(--r-ctl);overflow:auto;font-size:12px;line-height:1.6;margin:0}

/* All domain tables inherit the same typography and row spacing. */
body.ios .sverka-app table {width:100%;border-collapse:collapse}
body.ios .sverka-app table:not(.tbl) th {font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--faint);font-weight:500;text-align:left;padding:14px 16px 10px;background:transparent;border-bottom:1px solid var(--line);white-space:nowrap}
body.ios .sverka-app table:not(.tbl) td {padding:13px 16px;border-bottom:1px solid var(--line);font-size:13.5px;vertical-align:middle}
body.ios .sverka-app table:not(.tbl) tr:last-child td {border-bottom:0}
body.ios .sverka-app table:not(.tbl) tbody tr:hover {background:var(--surface-2)}
body.ios .sverka-app table:not(.tbl) td.r,body.ios .sverka-app table:not(.tbl) th.r {text-align:right}
body.ios .sverka-app table:not(.tbl) td.num {white-space:nowrap}
body.ios .sverka-app table:not(.tbl) tfoot td {padding:11px 16px;border-top:1px solid var(--line-2);font-weight:700;background:transparent}
body.ios .sverka-app .ui-scroll {overflow-x:auto;-webkit-overflow-scrolling:touch;min-width:0}
body.ios .sverka-app .ui-scroll > .chart {min-width:520px}
body.ios .sverka-app .ui-scroll :focus-visible {outline-offset:-2px}
body.ios .sverka-app details.ui-fold {scroll-margin-top:76px}
body.ios .sverka-app details.ui-fold > summary {cursor:pointer;list-style:none;padding:15px 20px;font-weight:600;font-size:13px;color:var(--ink-2);display:flex;justify-content:space-between;align-items:center;gap:10px}
body.ios .sverka-app details.ui-fold > summary:hover {background:var(--surface-2)}
body.ios .sverka-app details.ui-fold > summary::-webkit-details-marker {display:none}
body.ios .sverka-app details.ui-fold > summary::after {content:"";width:8px;height:8px;border-right:1.6px solid var(--muted);border-bottom:1.6px solid var(--muted);transform:rotate(45deg);transition:transform .2s;flex:none;margin-right:4px}
body.ios .sverka-app details.ui-fold[open] > summary::after {transform:rotate(225deg)}
body.ios .sverka-app details.ui-fold[open] > summary {border-bottom:1px solid var(--line)}
body.ios .sverka-app .ui-empty:not(.empty) {padding:38px 22px;text-align:center;color:var(--muted);font-size:13px;display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}
body.ios .sverka-app .ui-empty:not(.empty) i {font-size:32px;color:var(--faint)}
body.ios .sverka-app .ui-empty:not(.empty) strong {font-size:15px;font-weight:700;color:var(--ink)}
body.ios.sverka-app .ui-toast:not(.toast) {position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--glass-bg-strong);color:var(--ink);padding:12px 18px;border:1px solid var(--glass-edge);border-radius:var(--r-card);font-size:13px;z-index:60;box-shadow:var(--shadow-pop);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);max-width:calc(100vw - 32px)}
body.ios .sverka-app .ui-sticky {position:sticky;bottom:0;z-index:10;background:var(--glass-bg-strong);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-top:1px solid var(--glass-edge);padding:12px 20px;display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
body.ios.sverka-app .ui-tip {position:fixed;z-index:80;pointer-events:none;background:var(--ink);color:var(--surface);font-size:12px;padding:6px 9px;border-radius:var(--r-chip);width:max-content;max-width:min(320px,calc(100vw - 16px));opacity:0;transition:opacity .12s}
body.ios .sverka-app [data-tip]:not(a,button,input,select) {cursor:help}
body.ios .sverka-app dialog:not(.modal) {border:1px solid var(--glass-edge);border-radius:var(--r-card);background:var(--glass-bg-strong);color:var(--ink);box-shadow:var(--shadow-pop);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}
body.ios .sverka-app .rp-pop,body.ios .sverka-app #rgPop {background:var(--glass-bg-strong);border-color:var(--glass-edge);border-radius:var(--r-card);box-shadow:var(--shadow-pop);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}

/* Charts: retain width/series/semantic drawing and add shared legend roles. */
body.ios .sverka-app .chart {width:100%;height:auto;display:block}
body.ios .sverka-app .chart .grid {stroke:var(--line);stroke-width:1}
body.ios .sverka-app .chart .tick {font-size:12px;fill:var(--muted);font-family:var(--fs)}
body.ios .sverka-app .chart .xh {stroke:var(--muted);stroke-width:1;opacity:0}
body.ios .sverka-app .chart .col:hover .xh,body.ios .sverka-app .chart .col.on .xh {opacity:.6}
body.ios .sverka-app .chart .col:hover rect:first-child,body.ios .sverka-app .chart .col.on rect:first-child {fill:var(--surface-2)}
body.ios .sverka-app .ui-legend {display:flex;gap:6px 16px;flex-wrap:wrap;font-size:11.5px;color:var(--muted);margin:8px 0 12px}
body.ios .sverka-app .ui-legend span {display:inline-flex;align-items:center;gap:6px}
body.ios .sverka-app .ui-meter {height:10px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--ink) 6%,transparent);overflow:hidden;box-shadow:none}
body.ios .sverka-app .ui-meter i {display:block;height:100%;background:var(--ink)}
body.ios .sverka-app .ui-stack {display:flex;gap:2px;height:10px;border-radius:var(--r-pill);overflow:hidden}
body.ios .sverka-app .ui-stack > div {height:100%}
body.ios .sverka-app .ui-hbar {display:grid;grid-template-columns:minmax(96px,200px) minmax(0,1fr) auto;gap:10px;align-items:center;padding:5px 0;font-size:12.5px}
body.ios .sverka-app .ui-hbar .fill {display:block;height:10px;border-radius:var(--r-pill);background:var(--ink);opacity:.8;min-width:3px}
body.ios .sverka-app .ui-hbar .val {white-space:nowrap;color:var(--muted);font-variant-numeric:tabular-nums}

/* Personal queue uses the same task-row hierarchy as Finmonitor dashq. */
body.ios .sverka-app .project-choice {margin-top:24px}
body.ios .sverka-app .project-choice-links {display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
body.ios .sverka-app .admin-links {max-width:900px}
body.ios .sverka-app .admin-links section {margin:32px 0}
body.ios .sverka-app .admin-links h2:not(.treason,.zone-h,.section-t) {font-size:11.5px;font-weight:600;letter-spacing:.075em;text-transform:uppercase;color:var(--faint);margin:0 0 14px}
body.ios .sverka-app .admin-links a {display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 2px;border-bottom:1px solid var(--line)}
body.ios .sverka-app .admin-links a:hover {background:var(--surface-2);text-decoration:none}
body.ios .sverka-app .admin-links a span {display:grid;gap:4px}
body.ios .sverka-app .admin-links a small {color:var(--muted);font-size:12px}
body.ios .sverka-app .admin-links a i {color:var(--tint)}
body.ios .sverka-app .rp-modes {display:flex;gap:0;background:color-mix(in srgb,var(--surface-2) 70%,transparent);border:1px solid var(--glass-edge);border-radius:var(--r-pill);padding:2px;box-shadow:inset 0 1px 0 var(--glass-hair)}
body.ios .sverka-app .rp-modes button {border:0;background:transparent;color:var(--ink-2);font-size:12.5px;font-weight:600;padding:5px 13px;border-radius:var(--r-pill);min-height:28px;height:auto}
body.ios .sverka-app .rp-modes button.on {background:var(--surface);color:var(--ink);box-shadow:0 2px 6px -2px rgba(20,22,45,.22),0 1px 1px rgba(20,22,45,.12)}
body.ios .sverka-app .rp-quick button {height:32px;font-size:12.5px;font-weight:600;border-color:var(--line);background:color-mix(in srgb,var(--surface) 70%,transparent);color:var(--muted);padding:0 13px}
body.ios .sverka-app .rp-quick button.on {background:var(--tint-soft);color:var(--tint);border-color:var(--tint-soft)}
body.ios .sverka-app .rp-cols > summary {height:40px;padding:0 18px;border-radius:var(--r-pill);font-size:13.5px;font-weight:600;background:var(--surface);border-color:var(--line-2)}
body.ios .sverka-app .i-head h1 {font-size:clamp(27px,3.3vw,37px);letter-spacing:-.032em;line-height:1.04}
body.ios .sverka-app .i-actions .grp {border-radius:var(--r-pill)}
body.ios .sverka-app .i-actions .grp .btn {border-radius:0;padding-inline:4px}
body.ios .sverka-app .i-steps li::before {font-family:var(--fs)}
body.ios .sverka-app .todo {border-left:0;padding-left:0}
body.ios .sverka-app .rb-top h3 {font-size:16px;font-weight:600}
body.ios .sverka-app .pj-name b {font-size:16px;font-weight:600;letter-spacing:-.02em}
@media(max-width:900px){
  body.ios .sverka-app .ui-grid2,body.ios .sverka-app .ui-grid2.even {grid-template-columns:minmax(0,1fr)}
}
@media(max-width:720px){
  body.ios .sverka-app .ui-head:not(.pagehead) {display:block}
  body.ios .sverka-app .ui-head:not(.pagehead) h1,body.ios .sverka-app .i-head h1 {font-size:26px;letter-spacing:-.03em}
  body.ios .sverka-app .ui-head:not(.pagehead) p {font-size:12px;margin-top:6px}
  body.ios .sverka-app .ui-pad,body.ios .sverka-app .ui-kpi:not(.kpi) {padding:16px}
  body.ios .sverka-app .rows > .row {padding:15px 16px}
  body.ios .sverka-app .ui-chip:not(.fchip),body.ios .sverka-app .btn.xs:not(.sm) {min-height:40px;height:40px}
  body.ios .sverka-app .ui-legend button {min-height:40px}
  body.ios .sverka-app details > summary {min-height:40px}
}
@media(prefers-reduced-motion:reduce){
  body.ios.sverka-app .ui-tip,body.ios .sverka-app details.ui-fold > summary::after {transition:none}
}

/* Legacy analyst uses .st for a data table, not a status label. */
body.ios .sverka-app table.st {display:table;white-space:normal;font-size:inherit;color:inherit;line-height:inherit}
body.ios .sverka-app table.st::before {display:none}
/* Sverka's personal queue has no finance-specific right rail. */
body.ios .sverka-app .dashq .ios-ov {grid-template-columns:minmax(0,1fr)}
/* Roistat's mobile table becomes labelled cells rather than table rows. */
@media(max-width:760px){
  body.ios .sverka-app .rb-money td {display:block;border:0;padding:0;min-width:0}
}
