/* Колесо бізнесу · фірмовий стиль «Контури», ДС Yolt v13 (як живий yolt.cloud, landing-evergreen4/hub.css).
   Колесо й гейдж — за еталонами docs/produkt/kolesa (koleso_balansu, zdorovia_biznesu) і Block 0 Дена.
   Тільки токени oklch; hex і rgba не додавати. */
@font-face{font-family:'Commissioner';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/commissioner-cyrillic-ext.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:'Commissioner';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/commissioner-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Commissioner';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/commissioner-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Commissioner';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/commissioner-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/public-sans-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/public-sans-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --page:oklch(0.94 0.018 80);
  --paper:oklch(0.99 0.003 82);
  --paper-2:oklch(0.96 0.010 82);
  --line:oklch(0.86 0.008 80);
  --line-soft:oklch(0.91 0.008 80);
  --ink-0:oklch(0.20 0.005 80);
  --ink-1:oklch(0.36 0.005 80);
  --ink-2:oklch(0.54 0.005 80);
  --ink-3:oklch(0.68 0.005 80);
  --sage-0:oklch(0.43 0.060 155);
  --sage-bg:oklch(0.91 0.025 155);
  --sage-bg-2:oklch(0.94 0.018 155);
  --on-sage:oklch(0.97 0.020 155);
  --good:oklch(0.48 0.060 155);
  --warn:oklch(0.62 0.095 70);
  --bad:oklch(0.50 0.140 25);
  --ring:oklch(0.88 0.010 80);
  --sh-low:0 1px 2px oklch(0.20 0.005 80/0.04),0 2px 6px oklch(0.20 0.005 80/0.04);
  --sh-mid:0 6px 20px -8px oklch(0.20 0.005 80/0.12);
  --sh-pop:0 24px 56px -20px oklch(0.20 0.005 80/0.35);
  --focus-ring:0 0 0 2px var(--paper),0 0 0 4.5px oklch(0.43 0.060 155/0.55);
  --font-ui:'Commissioner',system-ui,sans-serif;
  --font-num:'Public Sans','Commissioner',system-ui,sans-serif;
  --r-card:22px; --r-tile:14px;
  --space-xs:4px; --space-sm:8px; --space-md:12px; --space-lg:16px; --space-xl:24px; --space-xxl:32px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--page);color:var(--ink-1);font-family:var(--font-ui);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:clip}
button,input{font-family:inherit;font-size:inherit;color:inherit}
a{color:var(--sage-0)}
[hidden]{display:none!important}
h1,h2,h3,p{margin:0}
:where(a,button,input,[tabindex]):focus-visible{outline:none;box-shadow:var(--focus-ring);border-radius:10px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ── каркас ── */
.k-top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);max-width:760px;margin:0 auto;padding:var(--space-lg) var(--space-lg) 0}
.k-logo{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:19px;letter-spacing:-.02em;color:var(--ink-0);text-decoration:none}
.k-logo svg{width:22px;height:22px}
.k-top-note{font-family:var(--font-num);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2)}
#app{max-width:760px;margin:0 auto;padding:var(--space-xl) var(--space-lg) 64px}
.k-screen{animation:k-in .32s cubic-bezier(.2,.8,.2,1) both}
@keyframes k-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.k-kicker{font-family:var(--font-num);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2)}
.k-kicker.sage{color:var(--sage-0)}
.k-kicker.bad{color:var(--bad)}
.k-h1{font-size:clamp(36px,9vw,64px);line-height:1;font-weight:800;letter-spacing:-.04em;color:var(--ink-0)}
.k-h2{font-size:clamp(24px,5.4vw,32px);line-height:1.12;font-weight:800;letter-spacing:-.025em;color:var(--ink-0)}
.k-h3{font-size:19px;line-height:1.25;font-weight:800;letter-spacing:-.015em;color:var(--ink-0)}
.k-lead{font-size:18px;line-height:1.55;color:var(--ink-1)}
.k-muted{color:var(--ink-2)}
.k-small{font-size:13.5px;color:var(--ink-2)}
.k-stack{display:flex;flex-direction:column;gap:var(--space-lg)}
.k-stack-lg{display:flex;flex-direction:column;gap:var(--space-xl)}

/* ── картки ── */
.k-card{background:var(--paper);border-radius:var(--r-card);box-shadow:var(--sh-low);padding:clamp(20px,4.5vw,28px)}
.k-tile{background:var(--page);border-radius:var(--r-tile);padding:var(--space-lg)}
.k-insight{background:var(--sage-bg-2)}

/* ── кнопки (як qz-37 / qz-34 сайту) ── */
.k-btn{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;height:56px;padding:0 28px;border-radius:999px;font-size:16.5px;font-weight:700;text-align:center;transition:transform 140ms,background 140ms}
.k-btn:hover{transform:translateY(-1px)}
.k-btn:active{transform:none}
.k-btn[aria-disabled="true"]{opacity:.45;cursor:default;transform:none}
.k-btn-main{background:var(--sage-0);color:var(--on-sage)}
.k-btn-dark{background:var(--ink-0);color:var(--paper)}
.k-btn-line{border:1px dashed var(--ink-3);color:var(--ink-0);background:transparent}
.k-btn-line:hover{border-style:solid}
.k-btn-text{height:44px;padding:0 14px;color:var(--ink-1);font-weight:700}
.k-btn-text:hover{background:var(--paper-2);transform:none}
.k-btn-wide{width:100%}
.k-btn .arr{font-family:var(--font-num)}

/* ── вхід ── */
.k-intro{display:flex;flex-direction:column;gap:var(--space-xl)}
.k-points{display:flex;flex-wrap:wrap;gap:var(--space-sm)}
.k-chip-static{display:inline-flex;align-items:center;height:34px;padding:0 14px;border:1px dashed var(--ink-3);border-radius:999px;font-family:var(--font-num);font-size:12px;font-weight:600;letter-spacing:.06em;color:var(--ink-1)}
.k-intro-wheel{max-width:420px;width:100%;margin:0 auto}

/* ── питання (як qz-13) ── */
.k-q{display:flex;flex-direction:column;gap:var(--space-xl)}
.k-q-head{display:flex;flex-direction:column;gap:var(--space-md)}
.k-bars{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:6px}
.k-bars span{height:4px;border-radius:2px;background:var(--line);transition:background 220ms}
.k-bars span.on{background:var(--sage-0)}
.k-opts{display:flex;flex-direction:column;gap:10px}
.k-opt{all:unset;box-sizing:border-box;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--space-md);min-height:60px;padding:12px 20px;border-radius:14px;border:1px dashed var(--ink-3);color:var(--ink-0);font-size:17px;font-weight:700;transition:background 140ms}
.k-opt:hover{border-style:solid}
.k-opt[aria-pressed="true"]{border:1px solid var(--ink-0);background:var(--ink-0);color:var(--paper)}
.k-opt-sub{font-family:var(--font-num);font-size:12.5px;font-weight:600;color:var(--ink-2);text-align:right}
.k-opt[aria-pressed="true"] .k-opt-sub{color:var(--ink-3)}
.k-opt.soft{border-color:var(--line);color:var(--ink-1)}
.k-q-foot{display:flex;justify-content:space-between;align-items:center;gap:var(--space-md);padding-top:var(--space-sm);border-top:1px solid var(--line-soft)}

/* ── колесо (еталон koleso_balansu) ── */
.wheel{width:100%;height:auto;display:block;overflow:visible}
.wh-ring{fill:none;stroke:var(--ring);stroke-width:.6}
.wh-ring5{stroke:var(--ink-3);stroke-dasharray:3 3;stroke-width:1}
.wh-bg{fill:var(--line);opacity:.35}
.wh-bg.focus{fill:var(--sage-bg);opacity:1}
.wh-fill{opacity:.92;transform-origin:var(--cx) var(--cy);animation:wh-grow .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes wh-grow{from{transform:scale(.15);opacity:0}to{transform:none;opacity:.92}}
.wh-fill.good{fill:var(--good)} .wh-fill.warn{fill:var(--warn)} .wh-fill.bad{fill:var(--bad)}
.wh-unknown{fill:none;stroke:var(--ink-3);stroke-width:1.2;stroke-dasharray:3 3}
.wh-lbl{font-size:23px;font-weight:700;fill:var(--ink-0)}
.wh-lbl.focus{fill:var(--sage-0)}
.wh-sub{font-family:var(--font-num);font-size:20px;font-weight:600;fill:var(--ink-2)}
.wh-num{font-family:var(--font-num);font-size:21px;font-weight:700;fill:var(--paper)}
.wh-q{font-family:var(--font-num);font-size:20px;font-weight:700;fill:var(--ink-2)}

/* ── гейдж (еталон zdorovia + ScoreGauge Дена) ── */
.k-gauge{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}
.k-gauge svg{width:150px;height:150px}
.k-gauge .g-track{stroke:var(--ring)}
.k-gauge .g-val{transition:stroke-dasharray .9s cubic-bezier(.4,0,.2,1)}
.k-gauge .g-num{font-family:var(--font-num);font-weight:700;fill:var(--ink-0)}
.k-gauge .g-den{font-family:var(--font-num);fill:var(--ink-2)}
.k-gauge .g-state{font-weight:800;font-size:17px}
.good-tx{color:var(--good)} .warn-tx{color:var(--warn)} .bad-tx{color:var(--bad)}

/* ── результат ── */
.k-hero{display:grid;grid-template-columns:1fr;gap:var(--space-xl);align-items:center}
@media (min-width:720px){.k-hero{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}}
.k-legend{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--ink-1)}
.k-legend b{font-family:var(--font-num);color:var(--ink-0)}
.k-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;vertical-align:baseline}
.k-dot.good{background:var(--good)} .k-dot.warn{background:var(--warn)} .k-dot.bad{background:var(--bad)}
.k-dot.unknown{background:transparent;border:1.5px dashed var(--ink-3)}
.k-sec-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 16px;font-size:14.5px}
.k-sec-list li{list-style:none;display:flex;justify-content:space-between;gap:var(--space-sm);padding:6px 0;border-bottom:1px solid var(--line-soft)}
.k-sec-list ul{margin:0;padding:0}
.k-sec-list b{font-family:var(--font-num)}
.k-focus{display:flex;flex-direction:column;gap:var(--space-md)}
.k-step{display:flex;flex-direction:column;gap:4px;background:var(--paper);border-radius:var(--r-tile);padding:var(--space-lg)}
.k-hub{font-size:14.5px;color:var(--ink-1)}
.k-blind{display:flex;flex-wrap:wrap;gap:var(--space-sm)}
.k-blind > span{display:inline-flex;flex-wrap:wrap;align-items:center;gap:0 6px;min-height:36px;padding:6px 14px;border:1px dashed var(--ink-3);border-radius:14px;font-size:14.5px;font-weight:700;color:var(--ink-0)}
.k-lens{display:grid;gap:var(--space-md)}
.k-lens-row{display:grid;grid-template-columns:96px 1fr 44px;gap:var(--space-md);align-items:center;font-size:15px;font-weight:700;color:var(--ink-0)}
.k-lens-row.found{color:var(--ink-1)}
.k-track{height:10px;border-radius:99px;background:var(--paper-2);overflow:hidden}
.k-track i{display:block;height:100%;border-radius:99px;transition:width .8s cubic-bezier(.2,.8,.2,1)}
.k-track i.good{background:var(--good)} .k-track i.warn{background:var(--warn)} .k-track i.bad{background:var(--bad)} .k-track i.none{background:transparent}
.k-lens-v{font-family:var(--font-num);text-align:right}
.k-secs{display:flex;flex-direction:column}
.k-sec{display:grid;grid-template-columns:1fr auto;gap:4px var(--space-md);padding:var(--space-md) 0;border-top:1px solid var(--line-soft)}
.k-sec:first-child{border-top:0;padding-top:0}
.k-sec b{color:var(--ink-0);font-size:16px}
.k-sec p{grid-column:1 / -1;font-size:14.5px;color:var(--ink-1)}
.k-pill{font-family:var(--font-num);font-size:12px;font-weight:700;letter-spacing:.04em;padding:4px 10px;border-radius:999px;white-space:nowrap;align-self:start}
.k-pill.good{background:color-mix(in oklch,var(--good) 16%,transparent);color:var(--good)}
.k-pill.warn{background:color-mix(in oklch,var(--warn) 20%,transparent);color:oklch(0.48 0.095 70)}
.k-pill.bad{background:color-mix(in oklch,var(--bad) 14%,transparent);color:var(--bad)}
.k-pill.none{border:1px dashed var(--ink-3);color:var(--ink-2)}
.k-room{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-md);text-align:center}
.k-room-num{font-family:var(--font-num);font-size:44px;font-weight:700;line-height:1;color:var(--ink-0)}
.k-actions{display:flex;flex-direction:column;gap:var(--space-sm)}
.k-honest{font-size:13.5px;color:var(--ink-2);line-height:1.5}

/* ── форма (як qz-23/qz-25/qz-16) ── */
.k-form{display:flex;flex-direction:column;gap:var(--space-xl)}
.k-field{display:flex;flex-direction:column;gap:8px;font-size:13.5px;font-weight:700;color:var(--ink-1)}
.k-req{color:var(--bad)}
.k-opt-lbl{font-weight:500;color:var(--ink-2)}
.k-input{width:100%;height:52px;padding:0 16px;border-radius:12px;border:1px solid var(--line);background:var(--paper);font-size:16px;font-weight:500;color:var(--ink-0);outline:none;transition:border-color 140ms}
.k-input:focus{border-color:var(--sage-0);box-shadow:var(--focus-ring)}
.k-chips{display:flex;flex-wrap:wrap;gap:8px}
.k-chip{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;height:44px;padding:0 16px;border-radius:999px;border:1px dashed var(--ink-3);color:var(--ink-0);font-size:14.5px;font-weight:700}
.k-chip:hover{border-style:solid}
.k-chip[aria-checked="true"]{border:1px solid var(--ink-0);background:var(--ink-0);color:var(--paper)}
.k-field.miss{color:var(--bad)}
.k-field.miss .k-input,.k-field.miss .k-chip{border-color:var(--bad)}
.k-err{font-size:13.5px;font-weight:700;color:var(--bad)}
.k-grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:var(--space-lg)}

/* ── подяка ── */
.k-check{width:56px;height:56px;border-radius:50%;background:var(--sage-bg);color:var(--sage-0);display:grid;place-items:center;font-size:26px;font-weight:800}
.k-link-box{display:flex;gap:var(--space-sm);align-items:center;background:var(--page);border-radius:12px;padding:var(--space-sm) var(--space-sm) var(--space-sm) var(--space-lg)}
.k-link-box code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--font-num);font-size:14px;color:var(--ink-0)}
.k-btn-sm{height:44px;padding:0 18px;font-size:14.5px}
.k-bonus{display:flex;flex-direction:column;gap:var(--space-md);background:var(--sage-bg-2);border-radius:var(--r-tile);padding:var(--space-xl)}

.k-foot{max-width:760px;margin:0 auto;padding:0 var(--space-lg) var(--space-xxl);font-size:12.5px;color:var(--ink-2)}

@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
[tabindex="-1"]:focus{outline:none;box-shadow:none}