/* polish-p4 finance.white-esd.ru — SSO button READY, not present live yet (app has own login: button.primary «Войти»).
   Scoped to .we-sso / a[href*="/oauth2/"] / a[href*="oidc"] only → no effect on current app. */
:root{--we-brand:#00679E;--we-brand-hover:#00507A}
@media (prefers-color-scheme:dark){:root{--we-brand:#17A2FF;--we-brand-hover:#4DB8FF}}
.we-or{display:flex;align-items:center;gap:12px;color:#5B6670;font-size:14px;margin:16px 0}
.we-or::before,.we-or::after{content:"";flex:1;height:1px;background:#D0D5DB}
.we-sso,a[href*="/oauth2/start"],a[href*="oidc"][href*="login"]{display:flex;align-items:center;justify-content:center;min-height:44px;width:100%;box-sizing:border-box;
 border:1.5px solid var(--we-brand);border-radius:8px;color:var(--we-brand);background:transparent;font:600 15px/1.2 Inter,system-ui,sans-serif;text-decoration:none}
.we-sso:hover{background:rgba(0,103,158,.08)}
.we-sso:focus-visible{outline:3px solid rgba(0,103,158,.35);outline-offset:2px}
/* expected markup when added: <div class="we-or">или</div><a class="we-sso" href="/oauth2/start?rd=/">Войти через White-ESD SSO</a> */

/* ===== polish-p5 (live-p5 hotfix, 30.10 UTC+3) — finance mobile header: title must not truncate to «Лич…», «Выйти» always visible =====
   Targets the header selectors from /workspace/finance-ux/frontend/new/style.css:
   header{display:flex;…} · header h1{font-size:18px;flex:1} · @media(max-width:640px){header{flex-wrap:wrap} header h1{font-size:16px;flex:1 1 auto} header #who{display:none}}
   Markup (index.html): <header><h1>Личные финансы</h1><select id="period"> <span id="who"> <button id="loginBtn"> <button id="logout">Выйти</button></header>
   CSS only: title may wrap/shrink, buttons never shrink, period select yields width. */
@media (max-width:640px){
 html body header{flex-wrap:wrap!important;row-gap:8px}
 html body header h1{flex:1 1 0%!important;min-width:0!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;
  overflow-wrap:anywhere;font-size:clamp(15px,4.4vw,18px)!important;line-height:1.2!important}
 html body header #logout,html body header #loginBtn{flex:0 0 auto!important;white-space:nowrap!important;min-height:44px}
 html body header #period{flex:0 1 auto;min-width:0!important;max-width:46vw;min-height:44px}
}
@media (max-width:400px){
 /* row 1: title + Выйти; row 2: period selector full width */
 html body header h1{order:0}
 html body header #logout,html body header #loginBtn{order:1}
 html body header #period{order:2;flex:1 1 100%!important;max-width:none!important;width:100%}
}

/* ===== polish-p6 (31.10 UTC+3) — finance accent #2563EB → White-ESD #00679E; dark: #17A2FF (same as Jellyfin/KC dark) =====
   Overrides tokens from /workspace/finance-ux/frontend/new/style.css: --acc, --acc-h, --on-acc, --ring
   (:root, @media dark :root, :root[data-theme=light|dark]). Higher specificity via html:root → order-independent.
   Contrast (WCAG 2.x):
     light: #00679E on #fff 6.12:1, on --bg #f6f7f9 5.71:1; #fff text on #00679E 6.12:1; hover #00507A 8.65:1; subs-active text on 14% tint 4.97:1
     dark : #17A2FF on --card #171a21 6.34:1, on --bg #0f1115 6.88:1; --on-acc #0b1220 on #17A2FF 6.82:1; hover #4DB8FF 8.57:1; subs-active 5.15:1
     (old dark #2563EB-family not used; old light #2563EB was 5.17:1) */
html:root{--acc:#00679E;--acc-h:#00507A;--on-acc:#fff;--ring:color-mix(in srgb,#00679E 45%,transparent)}
@media (prefers-color-scheme:dark){html:root{--acc:#17A2FF;--acc-h:#4DB8FF;--on-acc:#0b1220;--ring:color-mix(in srgb,#17A2FF 50%,transparent);--we-brand:#17A2FF;--we-brand-hover:#4DB8FF}}
html:root[data-theme=light]{--acc:#00679E;--acc-h:#00507A;--on-acc:#fff;--ring:color-mix(in srgb,#00679E 45%,transparent);--we-brand:#00679E;--we-brand-hover:#00507A}
html:root[data-theme=dark]{--acc:#17A2FF;--acc-h:#4DB8FF;--on-acc:#0b1220;--ring:color-mix(in srgb,#17A2FF 50%,transparent);--we-brand:#17A2FF;--we-brand-hover:#4DB8FF}
/* components that hard-code #fff on accent in style.css (nav.active / primary) → use --on-acc */
html body button.primary,html body nav button.active,html body nav .groups button.active{background:var(--acc);border-color:var(--acc);color:var(--on-acc)}
html body button.primary:hover{background:var(--acc-h);border-color:var(--acc-h)}
html body button.link,html body .login a,html body a{color:var(--acc)}
html body nav .subs button.active{color:var(--acc);background:color-mix(in srgb,var(--acc) 14%,transparent);border-color:color-mix(in srgb,var(--acc) 45%,transparent)}
html body :focus-visible{outline-color:var(--acc)}
html body input:focus,html body select:focus,html body textarea:focus{border-color:var(--acc);box-shadow:0 0 0 3px var(--ring)}
html body input[type=checkbox],html body input[type=radio]{accent-color:var(--acc)}
/* charts: ext.js writes #2563eb as SVG presentation attributes / inline legend style → CSS can override (no JS change) */
html body .chart [stroke="#2563eb" i]{stroke:var(--acc)}
html body .chart [fill="#2563eb" i]{fill:var(--acc)}
html body .leg i[style*="#2563eb" i]{background:var(--acc)!important}