/**
 * import.css — style importowane 1:1 z eksportów Claude Design metodą
 * „droga 4" (docs/instrukcja-importu-widokow.md). Wartości dosłowne
 * z eksportu, przeniesione maszynowo przez narzedzia/prefiksuj-eksport.py
 * — nigdy przepisywane ręcznie. To świadoma strefa wartości dosłownych:
 * zasada „wyłącznie tokeny CSS" z CLAUDE.md dotyczy komponentów własnych
 * aplikacji (components.css), nie tego pliku.
 *
 * Ciemny motyw jest domyślny (bez atrybutu), jasny pod
 * :root[data-theme="light"]. Tokeny obszaru żyją na gołym prefiksie
 * (.imp-a, .imp-b4, ...), dlatego najbardziej zewnętrzny element widoku
 * ma go dodatkowo obok klasy strony.
 *
 * SPRZĄTANIE 30.08.2026: usunięte sekcje „drogi 3" (.imp-wejscie, .imp-b,
 * .imp-c) — 1906 linii i 321 martwych selektorów po widokach, które
 * dawno zastąpiły reimporty drogą 4. Sprawdzone przed usunięciem: żaden
 * widok ich nie używał (zostały wyłącznie wzmianki w komentarzach),
 * a bilans klamer usuwanego bloku był zamknięty.
 */
/* ==========================================================================
   OBSZAR A — WEJŚCIE (gość, logowanie, rejestracja, reset hasła)
   Reimport metodą "droga 4" — 27 sierpnia 2026.
   Instrukcja: docs/instrukcja-importu-widokow.md

   Źródło: "SW - Platforma - Cloud Design/HTML DO WDROŻENIA/obszar A - wejście/"
   (tokens.css + components.css + bloki <style> z 5 plików HTML).

   CAŁOŚĆ PONIŻEJ JEST MASZYNOWĄ KOPIĄ — wygenerowaną przez
   narzedzia/prefiksuj-eksport.py, bez ręcznego przepisywania wartości.
   Nie edytować tych reguł ręcznie: przy kolejnym eksporcie ta sekcja jest
   generowana od nowa tym samym poleceniem:

       python3 narzedzia/prefiksuj-eksport.py a <tokens.css> <components.css> <bloki-style>

   Zastępuje sekcję .imp-wejscie (droga 3, sesja ósma) — tamta obsługiwała
   dokładnie te same 5 ekranów i po tym reimporcie jest martwa. Zostawiona
   nietknięta zgodnie z zasadą "czystka w zbiorczym szlifie, nie w trakcie
   migracji" (docs/instrukcja-importu-widokow.md, rejestr decyzji).
   ========================================================================== */
/* ===== tokens.css -> prefiks .imp-a ===== */
.imp-a{--ink-rgb:28,28,30;
  --paper-rgb:251,251,251;
  --violet-rgb:112,0,255;
  --lime-rgb:203,255,0;

  --ink:#1C1C1E;
  --paper:#FBFBFB;
  --violet:#7000FF;
  --violet-hover:#5800CC;
  --lime:#CBFF00;

  --font-ui:'Inter',system-ui,sans-serif;
  --font-display:'VT323',monospace;
  --font-hand:'Caveat',cursive;
  --tracking-eyebrow:.16em;

  --radius-card:24px;
  --card-padding:24px 22px;
  --input-height:48px;
  --input-radius:16px;
  --radius-btn:16px;
  --input-padding-x:16px;
  --input-font-size:14px;
  --form-gap:16px;
  --btn-height:52px;
  --btn-font-size:16px;
  --btn-border:2px solid transparent;
  --radius-pill:999px;
  --radius-checkbox:7px;
  --eyebrow-size:10px;
  --title-card-size:38px;
  --title-hero-size:78px;
  --hand-size:18px;
  --logo-size:44px;

  

  
  --bg:#1C1C1E;
  --text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --text-accent:#B98CFF;          
  --eyebrow-color:var(--lime);    
  --card-border:rgba(var(--paper-rgb),.15);
  --card-border-top:rgba(255,255,255,.5);
  --card-bg:rgba(var(--ink-rgb),.45);
  --card-blur:44px;
  --card-saturate:1.9;
  --card-shadow:0 24px 64px rgba(0,0,0,.4),0 8px 24px rgba(var(--violet-rgb),.22);
  --input-bg:rgba(var(--paper-rgb),.06);
  --input-border:rgba(var(--paper-rgb),.24);
  --btn-outline-border:rgba(var(--paper-rgb),.3);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.58;
  --gfx-fluid:.42;
  --logo-src:url('assets/logo/samowolnosc_dark.png');
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.45),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.14),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#242427;}
:root[data-theme="light"] .imp-a{--bg:#FBFBFB;
  --text-heading:#1C1C1E;
  --text-body:#6B6870;
  --text-meta:#9A97A0;
  --text-accent:#7000FF;          
  --eyebrow-color:var(--violet);  
  --card-border:rgba(var(--ink-rgb),.1);
  --card-border-top:rgba(255,255,255,.95);
  --card-bg:rgba(255,255,255,.7);
  --card-blur:19px;
  --card-saturate:1.4;
  --card-shadow:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);
  --input-bg:#fff;
  --input-border:rgba(var(--ink-rgb),.14);
  --btn-outline-border:rgba(var(--ink-rgb),.16);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.42;
  --gfx-fluid:.14;
  --logo-src:url('assets/logo/samowolnosc_transparent.png');
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.08),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.1),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#F1EEF7;}
.imp-a-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
:root[data-theme="light"] .imp-a-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
@media (min-width:1024px){
.imp-a{--radius-card:26px;
    --card-padding:34px 32px;
    --input-height:50px;
    --input-padding-x:18px;
    --input-font-size:15px;
    --form-gap:18px;
    --btn-height:54px;
    --title-card-size:42px;
    --title-hero-size:88px;
    --hand-size:26px;
    --logo-size:56px;}
}
@media (prefers-reduced-motion: reduce){
:where(.imp-a), :where(.imp-a) *{transition:none !important; animation:none !important;}
}
@media (prefers-reduced-transparency: reduce){
.imp-a{--card-bg:var(--glass-fallback-bg);
    --card-blur:0px;
    --card-saturate:1;}
.imp-a-card{backdrop-filter:none; -webkit-backdrop-filter:none;}
}

/* ===== components.css -> prefiks .imp-a ===== */
:where(.imp-a), :where(.imp-a) *{box-sizing:border-box}
.imp-a{margin:0;padding:0}
.imp-a{background:var(--bg);font-family:var(--font-ui);color:var(--text-body);-webkit-font-smoothing:antialiased}
:where(.imp-a) a{color:var(--text-accent);text-decoration:none}
:where(.imp-a) a:hover{color:var(--violet-hover)}
:where(.imp-a) button,:where(.imp-a) input{font-family:inherit}
:where(.imp-a) button{border:none;background:none;cursor:pointer;padding:0}
:where(.imp-a) img{max-width:100%}
.imp-a-page{position:relative;overflow:hidden;min-height:100vh;background:var(--bg)}
.imp-a-glow{position:absolute;pointer-events:none;border-radius:50%}
.imp-a-glow--violet{background:var(--glow-violet)}
.imp-a-glow--lime{background:var(--glow-lime)}
.imp-a-logo{width:var(--logo-size);height:var(--logo-size);object-fit:contain;display:block}
.imp-a-logo--light{display:none}
:root[data-theme="light"] .imp-a-logo--dark{display:none}
:root[data-theme="light"] .imp-a-logo--light{display:block}
.imp-a-gfx-fluid{position:absolute;pointer-events:none;opacity:var(--gfx-fluid);z-index:0}
.imp-a-gfx-glass{position:absolute;pointer-events:none;opacity:var(--gfx-glass);z-index:0}
.imp-a-gfx-hand{pointer-events:none;filter:drop-shadow(0 24px 48px rgba(var(--violet-rgb),.45))}
.imp-a-hero{display:flex;flex-direction:column;justify-content:center;position:relative;z-index:1}
.imp-a-hero-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color);margin-bottom:16px}
.imp-a-hero-title{margin:0;font:400 var(--title-hero-size)/.9 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-a-hand-note{margin:16px 0 0;font:500 var(--hand-size)/1.2 var(--font-hand);color:var(--text-body)}
.imp-a-card{position:relative;z-index:1;background:var(--card-bg);backdrop-filter:blur(var(--card-blur)) saturate(var(--card-saturate));-webkit-backdrop-filter:blur(var(--card-blur)) saturate(var(--card-saturate));border:1px solid var(--card-border);border-top-color:var(--card-border-top);border-radius:var(--radius-card);box-shadow:var(--card-shadow);color:var(--text-heading);padding:var(--card-padding)}
.imp-a-card--flat{background:rgba(var(--paper-rgb),.05);backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;border:1px solid var(--card-border)}
.imp-a-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-accent)}
.imp-a-eyebrow-row{display:flex;align-items:center;gap:9px;margin-bottom:10px}
.imp-a-eyebrow-row .imp-a-eyebrow{margin-bottom:0}
.imp-a-title-card{margin:0 0 20px;font:400 var(--title-card-size)/.92 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-a-alert-error{display:flex;gap:12px;padding:14px;border-radius:16px;background:rgba(227,28,65,.16);border:1px solid rgba(227,28,65,.4);margin-bottom:20px}
.imp-a-alert-error svg{flex:none;margin-top:1px}
.imp-a-alert-error p{margin:0;font:500 13px/1.45 var(--font-ui);color:#FF7A93}
.imp-a-form{display:flex;flex-direction:column;gap:var(--form-gap)}
.imp-a-field-label{display:block;font:600 13px/1 var(--font-ui);color:var(--text-heading);margin-bottom:8px}
.imp-a-input{width:100%;min-height:var(--input-height);padding:0 var(--input-padding-x);border-radius:var(--input-radius);border:1px solid var(--input-border);background:var(--input-bg);font:400 var(--input-font-size)/1 var(--font-ui);color:var(--text-heading)}
.imp-a-input::placeholder{color:var(--text-meta)}
.imp-a-input-static{display:flex;align-items:center;gap:10px;min-height:var(--input-height);padding:0 var(--input-padding-x);border-radius:var(--input-radius);border:1px solid var(--card-border);background:rgba(var(--paper-rgb),.04)}
.imp-a-input-static span{flex:1;font:400 var(--input-font-size)/1 var(--font-ui);color:var(--text-body)}
.imp-a-field-hint{font:400 11.5px/1.4 var(--font-ui);color:var(--text-body);margin-top:7px}
.imp-a-field-hint--error{color:#FF7A93;display:flex;align-items:center;gap:7px;font-weight:500}
.imp-a-strength{display:flex;gap:4px;margin-top:10px}
.imp-a-strength-seg{flex:1;height:5px;border-radius:var(--radius-pill);background:rgba(var(--paper-rgb),.1)}
.imp-a-strength-seg--filled{background:var(--text-accent)}
.imp-a-strength-seg--full{background:var(--lime)}
.imp-a-checkbox-row{display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer}
.imp-a-checkbox-row input[type="checkbox"]{width:24px;height:24px;accent-color:var(--lime);border-radius:var(--radius-checkbox);cursor:pointer}
.imp-a-checkbox-row span{font:400 13.5px/1 var(--font-ui);color:var(--text-body)}
.imp-a-btn-primary{width:100%;min-height:var(--btn-height);border:var(--btn-border);border-radius:var(--radius-btn);background:var(--lime);color:#1C1C1E;font:600 var(--btn-font-size)/1 var(--font-ui);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-a-btn-primary:hover{background:var(--violet);color:#FBFBFB;border-color:var(--lime)}
.imp-a-btn-primary:disabled{background:rgba(var(--lime-rgb),.3);color:rgba(var(--paper-rgb),.6);cursor:not-allowed}
.imp-a-btn-secondary{width:100%;min-height:var(--btn-height);border:1px solid var(--btn-outline-border);border-radius:var(--radius-btn);background:transparent;color:var(--btn-outline-text);font:600 var(--btn-font-size)/1 var(--font-ui);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-a-btn-secondary:hover{border-color:var(--text-accent)}
.imp-a-link-accent{font:500 13px/1 var(--font-ui);color:var(--text-accent);cursor:pointer}
.imp-a-link-accent:hover{color:var(--violet-hover)}
.imp-a-foot-note{text-align:center;margin-top:18px;font:400 13px/1.4 var(--font-ui);color:var(--text-body)}
.imp-a-foot-note .imp-a-link-strong{font-weight:600;color:var(--text-accent);cursor:pointer}
.imp-a-notice-eyebrow{font:400 10px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-meta);margin-bottom:12px}
.imp-a-notice{padding:22px;border-radius:24px}
.imp-a-notice--success{background:rgba(var(--lime-rgb),.1);border:1px solid rgba(var(--lime-rgb),.4)}
.imp-a-notice--error{background:rgba(227,28,65,.12);border:1px solid rgba(227,28,65,.4)}
.imp-a-notice-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.imp-a-notice-icon{width:32px;height:32px;border-radius:999px;background:var(--lime);color:#1C1C1E;display:grid;place-items:center;flex:none}
.imp-a-notice p{margin:0;font:400 13px/1.55 var(--font-ui);color:var(--text-body)}
.imp-a-notice-title{font:600 14.5px/1.2 var(--font-ui);color:var(--text-heading)}
.imp-a-notice-title--error{color:#FF7A93}
.imp-a-split{display:flex;flex-direction:column}
.imp-a-split-media{order:2}
.imp-a-split-form{order:1;display:flex;flex-direction:column;justify-content:center;padding:0}
.imp-a-card-wrap{width:100%;max-width:420px;margin:0 auto}
@media (min-width:1024px){
.imp-a-split{display:grid;grid-template-columns:1fr 560px;min-height:100vh}
.imp-a-split--reverse{grid-template-columns:560px 1fr}
.imp-a-split-media,.imp-a-split-form{order:initial;padding:0 100px}
.imp-a-split--reverse .imp-a-split-media{padding:0 100px}
.imp-a-split-form.imp-a-split-form--card-col{display:flex;align-items:center;justify-content:center;padding:40px 64px}
}

/* ===== gosc.css -> prefiks .imp-a ===== */
.imp-a-gs-glow{top:60px;left:50%;transform:translateX(-50%);width:900px;height:900px}
.imp-a-gs-glass-brain{top:130px;left:50%;transform:translateX(-50%);width:560px}
.imp-a-gs-scrim{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(28,28,30,0) 0%,rgba(28,28,30,.45) 40%,rgba(28,28,30,.92) 78%,#1C1C1E 100%);z-index:0}
.imp-a-gs-hero{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:0 24px 60px;text-align:center}
.imp-a-gs-logo-row{position:absolute;top:40px;left:0;right:0;display:flex;align-items:center;justify-content:center;z-index:1}
.imp-a-gs-actions{display:flex;flex-direction:column;gap:10px;width:100%;max-width:340px}
.imp-a-gs-invite{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;margin-top:6px;font:400 13px/1 'Inter';color:var(--text-meta)}
@media (min-width:1024px){
.imp-a-gs-hero{max-width:640px;margin:0 auto}
.imp-a-gs-actions{flex-direction:row;max-width:none;justify-content:center}
.imp-a-gs-actions .imp-a-btn-primary,.imp-a-gs-actions .imp-a-btn-secondary{width:auto;padding:0 32px}
}

/* ===== logowanie.css -> prefiks .imp-a ===== */
.imp-a-lg-glow-1{top:-260px;left:-220px;width:820px;height:820px}
.imp-a-lg-glow-2{bottom:-220px;left:60px;width:600px;height:600px;background:var(--glow-lime)!important}
.imp-a-lg-fluid{top:-110px;right:-150px;width:820px}
.imp-a-lg-glass{bottom:-70px;left:-60px;width:300px}
@media (min-width:1024px){
.imp-a-split-form--card-col .imp-a-card-wrap{max-width:420px}
}
.imp-a-only-mobile{display:block}
@media (min-width:1024px){
.imp-a-split-media{display:flex!important}
.imp-a-only-mobile{display:none}
}

/* ===== rejestracja.css -> prefiks .imp-a ===== */
.imp-a-rj-glow-1{top:-260px;right:-220px;width:820px;height:820px}
.imp-a-rj-glow-2{bottom:-220px;right:60px;width:600px;height:600px;background:var(--glow-lime)!important}
.imp-a-rj-fluid{top:-110px;left:-150px;width:820px}
.imp-a-rj-glass{bottom:-70px;right:-60px;width:300px}
.imp-a-only-mobile{display:block}
@media (min-width:1024px){
.imp-a-split-media{display:flex!important}
.imp-a-only-mobile{display:none}
}

/* ===== reset-prosba.css -> prefiks .imp-a ===== */
.imp-a-rp-glow-1{top:-260px;left:-220px;width:820px;height:820px}
.imp-a-rp-glow-2{bottom:-220px;left:60px;width:600px;height:600px;background:var(--glow-lime)!important}
.imp-a-rp-fluid{top:-110px;right:-150px;width:820px}
.imp-a-rp-glass{bottom:-70px;left:-60px;width:300px}
.imp-a-only-mobile{display:block}
@media (min-width:1024px){
.imp-a-split-media{display:flex!important}
.imp-a-only-mobile{display:none}
}

/* ===== reset-potwierdz.css -> prefiks .imp-a ===== */
.imp-a-rn-glow-1{top:-260px;right:-220px;width:820px;height:820px}
.imp-a-rn-glow-2{bottom:-220px;right:60px;width:600px;height:600px;background:var(--glow-lime)!important}
.imp-a-rn-fluid{top:-110px;left:-150px;width:820px}
.imp-a-rn-glass{bottom:-70px;right:-60px;width:300px}
.imp-a-only-mobile{display:block}
@media (min-width:1024px){
.imp-a-split-media{display:flex!important}
.imp-a-only-mobile{display:none}
}

/* ---- PRZEKŁADY makieta -> żywa strona (Krok 2 instrukcji) ----------------
   Jedyne świadome odstępstwa od kopii wyżej. Osobny blok, żeby zawsze było
   widać, co pochodzi z eksportu, a co zostało dołożone i dlaczego.
   Eksport to sztywny kadr; aplikacja się przewija i działa na iPhonie. */

/* 100dvh — mobilne Safari chowa pasek adresu przy przewijaniu, przez co
   100vh "skacze" i ekran drga. dvh mierzy realnie widoczną wysokość.
   Kolejność ma znaczenie: vh zostaje jako fallback dla starszych silników. */
.imp-a-page{min-height:100vh;min-height:100dvh}
.imp-a-gs-hero{min-height:100vh;min-height:100dvh}
@media (min-width:1024px){
  .imp-a-split{min-height:100vh;min-height:100dvh}
}

/* overflow:clip zamiast hidden — clip nie tworzy kontenera przewijania,
   więc nie może "połknąć" przewijania strony przy treści wyższej niż kadr.
   hidden zostaje jako fallback. */
.imp-a-page{overflow:hidden;overflow:clip}

/* Pasek gestów iPhone'a — przyciski CTA gościa stoją przy dolnej krawędzi
   (justify-content:flex-end), bez tego wpadałyby pod pasek systemowy.
   Wymaga viewport-fit=cover w <meta viewport> (dodane w layoutach). */
.imp-a-gs-hero{padding-bottom:calc(60px + env(safe-area-inset-bottom))}

/* ---- inline style z eksportu -> klasy (Krok 3 pkt 3 instrukcji) ---------
   Każda reguła niżej to KOMPLET właściwości z atrybutu style="" przy danym
   elemencie w pliku źródłowym — przeniesiony w całości, nie wybiórczo.
   Nazwa klasy w komentarzu wskazuje plik i element, z którego pochodzi.
   Powód przeniesienia: zasada "zero inline style w widoku PHP" (CLAUDE.md).
   Wyjątek zostawiony inline: brak — Obszar A nie ma grafik dekoracyjnych
   pozycjonowanych inline (wszystkie mają klasy w blokach <style>). */

/* wszystkie ekrany split: kolumna hero ukryta na mobile, odsłaniana przez
   media query z bloku <style> (display:flex!important). W eksporcie było to
   inline style="display:none" na .split-media. */
.imp-a-split-media{display:none}

/* logowanie/rejestracja/reset-potwierdz: wiersz z logo nad kartą (mobile) */
.imp-a-logo-row-center{text-align:center;margin-bottom:20px}
.imp-a-logo-row-center .imp-a-logo{margin:0 auto}

/* logowanie/reset-*: eyebrow nad tytułem karty (.eyebrow ma już display:block) */
.imp-a-eyebrow--block{margin-bottom:8px}

/* logowanie: wiersz "Nie pamiętasz hasła?" pod formularzem */
.imp-a-card-foot-center{text-align:center;margin-top:18px}

/* rejestracja: odstęp nad przyciskiem "Załóż konto" */
.imp-a-btn--gap-top{margin-top:4px}

/* rejestracja / reset-*: szerokość tytułu w kolumnie hero */
.imp-a-hero-title--narrow{max-width:520px}
.imp-a-hero-title--wide{max-width:560px}

/* reset-prosba/reset-potwierdz: akapit prowadzący pod tytułem karty */
.imp-a-card-lead{margin:0 0 22px;font:400 13.5px/1.55 'Inter',sans-serif;color:var(--text-body)}

/* reset-prosba: pasek mobilny (wróć + logo) — display:flex musi wygrać z
   .imp-a-only-mobile{display:block}, stąd kolejność; ukrycie na desktopie
   powtórzone niżej, bo media query nie podnosi specyficzności. */
.imp-a-mobile-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}
.imp-a-mobile-back{display:flex;align-items:center;gap:8px;min-height:44px}
.imp-a-mobile-logo{width:49px;height:49px}

/* reset-prosba: nota "Nie znasz adresu, na który masz konto?" */
.imp-a-fine-note{margin:22px 0 0;text-align:center;font:400 12.5px/1.5 'Inter',sans-serif;color:var(--text-meta)}

/* reset-potwierdz: treść notki "link wygasł" + przycisk w jej kolorystyce */
.imp-a-notice-body{margin-bottom:16px}
.imp-a-btn-secondary--danger{border-color:rgba(227,28,65,.4);color:#FF7A93}

/* gość: tło ekranu, logo w nagłówku, tytuł, lead, akcent, krycie grafiki */
.imp-a-gs-page{background:#1C1C1E}
.imp-a-gs-logo{width:70px;height:70px}
.imp-a-gs-glass-brain{opacity:.58}
.imp-a-gs-title{font-size:54px;margin-bottom:16px}
.imp-a-gs-lead{margin:0 0 8px;font:400 15px/1.6 'Inter',sans-serif;color:var(--text-body);max-width:480px;text-wrap:pretty}
.imp-a-gs-accent{margin-bottom:28px}

/* powtórzenie ukrycia elementów mobilnych na desktopie — MUSI stać po
   .imp-a-mobile-bar, inaczej pasek mobilny zostałby widoczny na desktopie
   (równa specyficzność, rozstrzyga kolejność w pliku). */
@media (min-width:1024px){
  .imp-a-only-mobile{display:none}
}

/* [hidden] vs display:flex — komponent .field-hint--error z eksportu ustawia
   display:flex, co ma wyższą specyficzność niż `display:none` z arkusza
   przeglądarki dla atrybutu hidden. Bez tej reguły komunikat "Hasła się nie
   zgadzają" byłby widoczny od wejścia na stronę, zanim ktokolwiek cokolwiek
   wpisze (skrypt password-strength.js steruje nim właśnie przez [hidden]).
   Dotyczy każdego elementu sekcji, nie tylko tego komunikatu. */
.imp-a [hidden]{display:none}

/* ==========================================================================
   OBSZAR B — PULPIT I KONTO
   Reimport metodą "droga 4" — 29 sierpnia 2026, eksport 21:34 (pulpit2).
   Trzecia wersja: naprawia rozjazd mobilnego pulpitu. Przyczyna była
   w CSS eksportu — klasy only-mobile/only-desktop USTAWIAŁY display na
   widocznym elemencie (block!important), przez co nadpisywały własny
   display komponentów (flex/grid) i psuły układ. Teraz tylko ukrywają.
   pulpit2.html jest bajt w bajt równy pulpit.html — cała poprawka
   siedzi w components.css/tokens.css, więc widoki PHP bez zmian.
   Instrukcja: docs/instrukcja-importu-widokow.md

   Źródło: "SW - Platforma - Cloud Design/HTML DO WDROŻENIA/Obszar B - Pulpit i Konto/"
   (tokens.css + components.css + bloki <style> z pulpit.html i konto.html).

   Luka tokenów --card-bg-1/-2/-3 z poprzedniego eksportu NAPRAWIONA u źródła
   (tokens.css definiuje komplet, z realnymi wartościami innymi niż wcześniej
   zgadywane) — blok "UZUPEŁNIENIE LUKI" usunięty, wartości idą z kopii niżej.

   CAŁOŚĆ PONIŻEJ (do bloku "PRZEKŁADY") JEST MASZYNOWĄ KOPIĄ — wygenerowaną
   przez narzedzia/prefiksuj-eksport.py, bez ręcznego przepisywania wartości:

       python3 narzedzia/prefiksuj-eksport.py b4 <tokens.css> <components.css> <bloki-style>

   Prefiks `.imp-b4` (sekcja `.imp-b` z drogi 3 usunięta 30.08.2026).
   ========================================================================== */
/* ===== tokens.css -> prefiks .imp-b4 ===== */
.imp-b4{--ink-rgb:28,28,30;
  --paper-rgb:251,251,251;
  --violet-rgb:112,0,255;
  --lime-rgb:203,255,0;

  --ink:#1C1C1E;
  --paper:#FBFBFB;
  --violet:#7000FF;
  --violet-hover:#5800CC;
  --lime:#CBFF00;

  --font-ui:'Inter',system-ui,sans-serif;
  --font-display:'VT323',monospace;
  --font-hand:'Caveat',cursive;
  --tracking-eyebrow:.16em;

  --radius-card:24px;
  --card-padding:24px 22px;
  --input-height:48px;
  --input-radius:16px;
  --radius-btn:16px;
  --input-padding-x:16px;
  --input-font-size:14px;
  --form-gap:16px;
  --btn-height:52px;
  --btn-font-size:16px;
  --btn-border:2px solid transparent;
  --radius-pill:999px;
  --radius-checkbox:7px;
  --eyebrow-size:10px;
  --title-card-size:38px;
  --title-hero-size:78px;
  --hand-size:18px;
  --logo-size:44px;
  --avatar-size:64px;
  --name-size:34px;

  

  
  --bg:#1C1C1E;
  --text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --text-accent:#B98CFF;          
  --eyebrow-color:var(--lime);    
  --card-border:rgba(var(--paper-rgb),.15);
  --card-border-top:rgba(255,255,255,.5);
  --card-bg:rgba(var(--ink-rgb),.45);
  --card-blur:44px;
  --card-saturate:1.9;
  --card-shadow:0 24px 64px rgba(0,0,0,.4),0 8px 24px rgba(var(--violet-rgb),.22);

  
  --card-bg-1:rgba(var(--ink-rgb),.45);   --card-blur-1:48px; --card-saturate-1:2;
  --card-bg-2:rgba(var(--ink-rgb),.45);   --card-blur-2:48px; --card-saturate-2:2;
  --card-bg-3:rgba(var(--paper-rgb),.05);
  --card-bg-4:rgba(var(--paper-rgb),.04);
  --glass-border:rgba(255,255,255,.18);
  --glass-border-top:rgba(255,255,255,.55);
  --shadow-glass:0 24px 64px rgba(0,0,0,.35),0 8px 24px rgba(var(--violet-rgb),.25),inset 0 1px 0 rgba(255,255,255,.5);
  --ring-track:rgba(var(--paper-rgb),.14);
  --divider:rgba(var(--paper-rgb),.12);
  --input-bg:rgba(var(--paper-rgb),.06);
  --input-border:rgba(var(--paper-rgb),.24);
  --btn-outline-border:rgba(var(--paper-rgb),.3);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.58;
  --gfx-fluid:.42;
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.45),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.14),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#242427;}
:root[data-theme="light"] .imp-b4{--bg:#FBFBFB;
  --text-heading:#1C1C1E;
  --text-body:#6B6870;
  --text-meta:#9A97A0;
  --text-accent:#7000FF;          
  --eyebrow-color:var(--violet);  
  --card-border:rgba(var(--ink-rgb),.1);
  --card-border-top:rgba(255,255,255,.95);
  --card-bg:rgba(255,255,255,.45);
  --card-blur:19px;
  --card-saturate:1.4;
  --card-shadow:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);

  
  --card-bg-1:rgba(var(--paper-rgb),.45); --card-blur-1:22px; --card-saturate-1:1.6;
  --card-bg-2:rgba(var(--paper-rgb),.45); --card-blur-2:22px; --card-saturate-2:1.5;
  --card-bg-3:rgba(255,255,255,.55);
  --card-bg-4:rgba(var(--ink-rgb),.02);
  --glass-border:rgba(255,255,255,.5);
  --glass-border-top:rgba(255,255,255,.8);
  --shadow-glass:0 24px 64px rgba(var(--ink-rgb),.18),0 8px 24px rgba(var(--violet-rgb),.22),inset 0 1px 0 rgba(255,255,255,.7);
  --ring-track:rgba(var(--ink-rgb),.1);
  --divider:rgba(var(--ink-rgb),.07);
  --input-bg:#fff;
  --input-border:rgba(var(--ink-rgb),.14);
  --btn-outline-border:rgba(var(--ink-rgb),.16);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.42;
  --gfx-fluid:.14;
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.08),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.1),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#F1EEF7;}
.imp-b4-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
:root[data-theme="light"] .imp-b4-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
@media (min-width:1024px){
.imp-b4{--radius-card:26px;
    --card-padding:34px 32px;
    --input-height:50px;
    --input-padding-x:18px;
    --input-font-size:15px;
    --form-gap:18px;
    --btn-height:54px;
    --title-card-size:42px;
    --title-hero-size:88px;
    --hand-size:26px;
    --logo-size:56px;
    --avatar-size:88px;
    --name-size:56px;}
:root[data-theme="light"] .imp-b4{--shadow-glass:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);}
}
@media (prefers-reduced-motion: reduce){
:where(.imp-b4), :where(.imp-b4) *{transition:none !important; animation:none !important;}
}
@media (prefers-reduced-transparency: reduce){
.imp-b4{--card-bg:var(--glass-fallback-bg);
    --card-blur:0px;
    --card-saturate:1;}
.imp-b4-card{backdrop-filter:none; -webkit-backdrop-filter:none;}
}

/* ===== components.css -> prefiks .imp-b4 ===== */
:where(.imp-b4), :where(.imp-b4) *{box-sizing:border-box}
.imp-b4{margin:0;padding:0}
.imp-b4{background:var(--bg);font-family:var(--font-ui);color:var(--text-body);-webkit-font-smoothing:antialiased}
:where(.imp-b4) a{color:var(--text-accent);text-decoration:none}
:where(.imp-b4) a:hover{color:var(--violet-hover)}
:where(.imp-b4) button,:where(.imp-b4) input{font-family:inherit}
:where(.imp-b4) button{border:none;background:none;cursor:pointer;padding:0}
:where(.imp-b4) img{max-width:100%}
.imp-b4-page{position:relative;overflow:hidden;min-height:100vh;background:var(--bg)}
.imp-b4-glow{position:absolute;pointer-events:none;border-radius:50%}
.imp-b4-glow--violet{background:var(--glow-violet)}
.imp-b4-glow--lime{background:var(--glow-lime)}
.imp-b4-logo{width:var(--logo-size);height:var(--logo-size);object-fit:contain;display:block}
.imp-b4-logo--light{display:none}
:root[data-theme="light"] .imp-b4-logo--dark{display:none}
:root[data-theme="light"] .imp-b4-logo--light{display:block}
.imp-b4-gfx-fluid{position:absolute;pointer-events:none;opacity:var(--gfx-fluid);z-index:0}
.imp-b4-gfx-glass{position:absolute;pointer-events:none;opacity:var(--gfx-glass);z-index:0}
.imp-b4-scrim{position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(178deg,rgba(var(--ink-rgb),0) 0%,rgba(var(--ink-rgb),.45) 9%,rgba(var(--ink-rgb),.88) 20%,var(--bg) 34%)}
:root[data-theme="light"] .imp-b4-scrim{background:linear-gradient(178deg,rgba(var(--paper-rgb),0) 0%,rgba(var(--paper-rgb),.5) 9%,rgba(var(--paper-rgb),.9) 20%,var(--bg) 34%)}
@media (max-width:1023px){
.imp-b4-only-desktop{display:none!important}
}
@media (min-width:1024px){
.imp-b4-only-mobile{display:none!important}
}
.imp-b4-gfx-hand{pointer-events:none;filter:drop-shadow(0 24px 48px rgba(var(--violet-rgb),.45))}
.imp-b4-hero{display:flex;flex-direction:column;justify-content:center;position:relative;z-index:1}
.imp-b4-hero-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color);margin-bottom:16px}
.imp-b4-hero-title{margin:0;font:400 var(--title-hero-size)/.9 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-b4-hand-note{margin:16px 0 0;font:500 var(--hand-size)/1.2 var(--font-hand);color:var(--text-body)}
.imp-b4-card{position:relative;z-index:1;background:var(--card-bg);backdrop-filter:blur(var(--card-blur)) saturate(var(--card-saturate));-webkit-backdrop-filter:blur(var(--card-blur)) saturate(var(--card-saturate));border:1px solid var(--card-border);border-top-color:var(--card-border-top);border-radius:var(--radius-card);box-shadow:var(--card-shadow);color:var(--text-heading);padding:var(--card-padding)}
.imp-b4-card--flat{background:rgba(var(--paper-rgb),.05);backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;border:1px solid var(--card-border)}
.imp-b4-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-accent)}
.imp-b4-eyebrow-row{display:flex;align-items:center;gap:9px;margin-bottom:10px}
.imp-b4-eyebrow-row .imp-b4-eyebrow{margin-bottom:0}
.imp-b4-title-card{margin:0 0 20px;font:400 var(--title-card-size)/.92 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-b4-alert-error{display:flex;gap:12px;padding:14px;border-radius:16px;background:rgba(227,28,65,.16);border:1px solid rgba(227,28,65,.4);margin-bottom:20px}
.imp-b4-alert-error svg{flex:none;margin-top:1px}
.imp-b4-alert-error p{margin:0;font:500 13px/1.45 var(--font-ui);color:#FF7A93}
.imp-b4-form{display:flex;flex-direction:column;gap:var(--form-gap)}
.imp-b4-field-label{display:block;font:600 13px/1 var(--font-ui);color:var(--text-heading);margin-bottom:8px}
.imp-b4-input{width:100%;min-height:var(--input-height);padding:0 var(--input-padding-x);border-radius:var(--input-radius);border:1px solid var(--input-border);background:var(--input-bg);font:400 var(--input-font-size)/1 var(--font-ui);color:var(--text-heading)}
.imp-b4-input::placeholder{color:var(--text-meta)}
.imp-b4-input-static{display:flex;align-items:center;gap:10px;min-height:var(--input-height);padding:0 var(--input-padding-x);border-radius:var(--input-radius);border:1px solid var(--card-border);background:rgba(var(--paper-rgb),.04)}
.imp-b4-input-static span{flex:1;font:400 var(--input-font-size)/1 var(--font-ui);color:var(--text-body)}
.imp-b4-field-hint{font:400 11.5px/1.4 var(--font-ui);color:var(--text-body);margin-top:7px}
.imp-b4-field-hint--error{color:#FF7A93;display:flex;align-items:center;gap:7px;font-weight:500}
.imp-b4-strength{display:flex;gap:4px;margin-top:10px}
.imp-b4-strength-seg{flex:1;height:5px;border-radius:var(--radius-pill);background:rgba(var(--paper-rgb),.1)}
.imp-b4-strength-seg--filled{background:var(--text-accent)}
.imp-b4-strength-seg--full{background:var(--lime)}
.imp-b4-checkbox-row{display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer}
.imp-b4-checkbox-row input[type="checkbox"]{width:24px;height:24px;accent-color:var(--lime);border-radius:var(--radius-checkbox);cursor:pointer}
.imp-b4-checkbox-row span{font:400 13.5px/1 var(--font-ui);color:var(--text-body)}
.imp-b4-btn-primary{width:100%;min-height:var(--btn-height);border:var(--btn-border);border-radius:var(--radius-btn);background:var(--lime);color:#1C1C1E;font:600 var(--btn-font-size)/1 var(--font-ui);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-b4-btn-primary:hover{background:var(--violet);color:#FBFBFB;border-color:var(--lime)}
.imp-b4-btn-primary:disabled{background:rgba(var(--lime-rgb),.3);color:rgba(var(--paper-rgb),.6);cursor:not-allowed}
.imp-b4-btn-secondary{width:100%;min-height:var(--btn-height);border:1px solid var(--btn-outline-border);border-radius:var(--radius-btn);background:transparent;color:var(--btn-outline-text);font:600 var(--btn-font-size)/1 var(--font-ui);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-b4-btn-secondary:hover{border-color:var(--text-accent)}
.imp-b4-link-accent{font:500 13px/1 var(--font-ui);color:var(--text-accent);cursor:pointer}
.imp-b4-link-accent:hover{color:var(--violet-hover)}
.imp-b4-foot-note{text-align:center;margin-top:18px;font:400 13px/1.4 var(--font-ui);color:var(--text-body)}
.imp-b4-foot-note .imp-b4-link-strong{font-weight:600;color:var(--text-accent);cursor:pointer}
.imp-b4-notice-eyebrow{font:400 10px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-meta);margin-bottom:12px}
.imp-b4-notice{padding:22px;border-radius:24px}
.imp-b4-notice--success{background:rgba(var(--lime-rgb),.1);border:1px solid rgba(var(--lime-rgb),.4)}
.imp-b4-notice--error{background:rgba(227,28,65,.12);border:1px solid rgba(227,28,65,.4)}
.imp-b4-notice-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.imp-b4-notice-icon{width:32px;height:32px;border-radius:999px;background:var(--lime);color:#1C1C1E;display:grid;place-items:center;flex:none}
.imp-b4-notice p{margin:0;font:400 13px/1.55 var(--font-ui);color:var(--text-body)}
.imp-b4-notice-title{font:600 14.5px/1.2 var(--font-ui);color:var(--text-heading)}
.imp-b4-notice-title--error{color:#FF7A93}
.imp-b4-split{display:flex;flex-direction:column}
.imp-b4-split-media{order:2}
.imp-b4-split-form{order:1;display:flex;flex-direction:column;justify-content:center;padding:0}
.imp-b4-card-wrap{width:100%;max-width:420px;margin:0 auto}
@media (min-width:1024px){
.imp-b4-split{display:grid;grid-template-columns:1fr 560px;min-height:100vh}
.imp-b4-split--reverse{grid-template-columns:560px 1fr}
.imp-b4-split-media,.imp-b4-split-form{order:initial;padding:0 100px}
.imp-b4-split--reverse .imp-b4-split-media{padding:0 100px}
.imp-b4-split-form.imp-b4-split-form--card-col{display:flex;align-items:center;justify-content:center;padding:40px 64px}
}
.imp-b4-topbar{position:absolute;top:16px;left:24px;right:24px;z-index:3;display:none;align-items:center;gap:24px;padding:10px 14px 10px 18px;border-radius:20px;background:var(--card-bg-2);backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));-webkit-backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
:root[data-theme="light"] .imp-b4-topbar{border-color:var(--card-border);border-top-color:var(--card-border-top)}
.imp-b4-topbar-nav{display:flex;gap:4px}
.imp-b4-nav-item{min-height:44px;display:flex;align-items:center;gap:9px;padding:0 16px;border-radius:14px;color:var(--text-body);cursor:pointer;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-b4-nav-item span{font:600 13px/1 var(--font-ui)}
.imp-b4-nav-item:hover{color:var(--text-accent)}
.imp-b4-nav-item--active{background:var(--lime);color:#1C1C1E}
.imp-b4-nav-item--active:hover{color:#1C1C1E}
.imp-b4-topbar-icon-btn{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--card-border);background:rgba(var(--paper-rgb),.06);border-radius:var(--radius-pill);color:var(--text-heading);cursor:pointer}
.imp-b4-topbar-user{display:flex;align-items:center;gap:10px;padding:5px 14px 5px 5px;border-radius:var(--radius-pill);background:rgba(var(--paper-rgb),.06);border:1px solid var(--card-border)}
.imp-b4-avatar{width:34px;height:34px;border-radius:var(--radius-pill);background:rgba(var(--violet-rgb),.12);display:grid;place-items:center;font:600 12px/1 var(--font-ui);color:var(--text-accent)}
.imp-b4-dock{position:fixed;left:12px;right:12px;bottom:12px;z-index:4;display:flex;gap:4px;padding:6px;border-radius:22px;background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
.imp-b4-dock-item{flex:1;min-height:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border-radius:16px;color:var(--text-body);cursor:pointer}
.imp-b4-dock-item--active{background:var(--lime);color:#1C1C1E}
.imp-b4-dock-item span{font:600 9.5px/1 var(--font-ui);letter-spacing:.08em;text-transform:uppercase}
@media (min-width:1024px){
.imp-b4-topbar{display:flex}
.imp-b4-dock{display:none}
}
.imp-b4-theme-picker{display:flex;gap:8px}
.imp-b4-theme-opt{flex:1;min-height:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:11px 6px;border-radius:14px;border:1px solid var(--card-border);color:var(--text-heading);cursor:pointer;transition:border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-b4-theme-opt:hover{border-color:var(--text-accent)}
.imp-b4-theme-opt--active{background:var(--lime);border-color:transparent;color:#1C1C1E}
.imp-b4-theme-opt span{font:600 10.5px/1 var(--font-ui)}
.imp-b4-data-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px}
.imp-b4-data-row span:first-child{font:400 13px/1.3 var(--font-ui);color:var(--text-body)}
.imp-b4-data-row span:last-child{font:600 13.5px/1.3 var(--font-ui);color:var(--text-heading)}
.imp-b4-data-rule{height:1px;background:var(--divider)}
.imp-b4-btn-danger-outline{display:flex;align-items:center;justify-content:center;gap:9px;min-height:52px;border-radius:16px;border:1px solid rgba(227,28,65,.4);font:600 14px/1 var(--font-ui);color:#B03A2E;cursor:pointer;transition:background 150ms cubic-bezier(.4,0,.2,1)}
.imp-b4-btn-danger-outline:hover{background:rgba(227,28,65,.14)}
:root[data-theme="light"] .imp-b4-btn-danger-outline{background:rgba(227,28,65,.12);color:#B03A2E}
.imp-b4-btn-danger-outline--dark{color:#FF8A80;border-color:rgba(255,107,107,.45);background:transparent}
.imp-b4-program-card{display:block;position:relative;overflow:hidden;padding:22px;border-radius:24px;background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass);color:var(--text-heading);cursor:pointer;transition:transform 150ms cubic-bezier(.4,0,.2,1)}
.imp-b4-program-card:hover{transform:translateY(-4px)}
.imp-b4-progress-ring{flex:none;width:72px;height:72px;border-radius:999px;display:grid;place-items:center;background:conic-gradient(var(--eyebrow-color) var(--pct,37%),var(--ring-track) 0)}
:root[data-theme="light"] .imp-b4-progress-ring{background:conic-gradient(var(--violet) var(--pct,37%),var(--ring-track) 0)}
.imp-b4-progress-ring-inner{width:78%;height:78%;border-radius:999px;background:var(--bg);display:grid;place-items:center;font:400 22px/1 var(--font-display);color:var(--text-heading)}
.imp-b4-resource-card{display:flex;align-items:center;gap:14px;padding:16px;border-radius:20px;background:var(--card-bg-3);border:1px solid var(--card-border);border-top-color:var(--card-border-top);box-shadow:var(--shadow-glass);cursor:pointer;position:relative;overflow:hidden;transition:transform 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-b4-resource-card:hover{transform:translateY(-3px)}
.imp-b4-resource-icon{flex:none;width:52px;height:52px;border-radius:14px;background:var(--violet);display:grid;place-items:center;color:#FBFBFB}
.imp-b4-resource-icon--outline{background:transparent;border:1px dashed rgba(var(--lime-rgb),.5);color:var(--lime)}
:root[data-theme="light"] .imp-b4-resource-icon--outline{border-color:rgba(var(--violet-rgb),.45);color:var(--violet)}
.imp-b4-resource-title{font:600 14px/1.3 var(--font-ui);color:var(--text-heading)}
.imp-b4-resource-meta{font:400 12px/1.4 var(--font-ui);color:var(--text-body);margin-top:3px}
.imp-b4-resource-arrow{font:400 17px/1 var(--font-ui);color:var(--eyebrow-color)}
:root[data-theme="light"] .imp-b4-resource-arrow{color:var(--violet)}
.imp-b4-quiz-card{margin-top:auto;padding:20px;border-radius:20px;background:var(--card-bg-4);border:1px solid var(--card-border)}
.imp-b4-quiz-chip{font:600 10.5px/1 var(--font-ui);padding:4px 8px;border-radius:20px;background:rgba(var(--lime-rgb),.16);color:var(--lime)}
:root[data-theme="light"] .imp-b4-quiz-chip{background:rgba(var(--violet-rgb),.09);color:var(--violet)}
.imp-b4-profile-row{display:flex;align-items:center;gap:16px}
.imp-b4-avatar-lg{flex:none;width:var(--avatar-size);height:var(--avatar-size);border-radius:999px;background:var(--violet);display:grid;place-items:center;font:400 calc(var(--avatar-size)*.47)/1 var(--font-display);color:#FBFBFB}
.imp-b4-profile-name{margin:0;font:400 var(--name-size)/.92 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-b4-profile-email{font:400 12.5px/1.4 var(--font-ui);color:var(--text-body);margin-top:5px}
.imp-b4-konto-grid{display:flex;flex-direction:column;gap:14px}
@media (min-width:1024px){
.imp-b4-konto-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:20px;flex:1;min-height:0}
/* Karty konta nie rozciągają się do wysokości sąsiedniej kolumny — obie
   kolumny to przezroczyste wrappery (kt-side), a karty w środku trzymają
   naturalną wysokość. Wcześniejsza wersja (1.09.2026) rozciągała kartę
   motywu do pustej studni z przyciskami na dnie. */
.imp-b4-konto-grid > .imp-b4-kt-side{align-self:start}
}

/* ===== pulpit2.css -> prefiks .imp-b4 ===== */
.imp-b4-pl-glow-m{top:-120px;right:-160px;width:460px;height:460px;background:var(--glow-violet)}
:root[data-theme="light"] .imp-b4-pl-glow-m{top:-140px;right:-170px}
.imp-b4-pl-fluid-m{top:-56px;right:-150px;width:250px;opacity:.32}
:root[data-theme="light"] .imp-b4-pl-fluid-m{opacity:.55}
.imp-b4-pl-glow-lime-m{bottom:-60px;left:-110px;width:320px;height:320px;background:var(--glow-lime)}
:root[data-theme="light"] .imp-b4-pl-glow-lime-m{top:300px;bottom:auto;left:-140px;width:380px;height:380px;background:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.4),rgba(var(--lime-rgb),0) 70%)}
.imp-b4-pl-underglow{position:absolute;inset:0;z-index:0;pointer-events:none}
:root[data-theme="light"] .imp-b4-pl-underglow{background:radial-gradient(520px 300px at 50% 104%,rgba(var(--violet-rgb),.14),rgba(var(--violet-rgb),0) 70%)}
.imp-b4-pl-glow-d{top:-260px;right:-180px;width:820px;height:820px;background:var(--glow-violet)}
.imp-b4-pl-fluid-d{top:-160px;right:-120px;width:620px}
.imp-b4-pl-glow-lime-d{bottom:-220px;left:-200px;width:700px;height:700px;background:var(--glow-lime)}
.imp-b4-pl-brain{bottom:-120px;left:-90px;width:420px}
.imp-b4-pl-page{position:relative;z-index:1;padding:20px 20px 108px}
.imp-b4-pl-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:34px}
.imp-b4-pl-header-actions{display:flex;gap:8px}
.imp-b4-pl-title{margin:0 0 8px;font:400 40px/.92 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-b4-pl-caveat{margin:0 0 26px;font:500 19px/1.1 var(--font-hand);color:var(--text-body)}
.imp-b4-pl-cross{position:absolute;top:-44px;right:-40px;width:130px;opacity:var(--gfx-glass);pointer-events:none}
:root[data-theme="light"] .imp-b4-pl-cross{top:-56px;width:126px;opacity:.85}
.imp-b4-pl-card-inner{position:relative;display:flex;flex-direction:column;gap:20px}
.imp-b4-pl-program-name{font:400 30px/.94 var(--font-display);letter-spacing:.02em;text-transform:uppercase;max-width:180px}
.imp-b4-pl-session-row{display:flex;align-items:center;gap:16px}
.imp-b4-pl-session-title{font:600 14px/1.35 var(--font-ui);color:var(--text-heading)}
.imp-b4-pl-session-meta{font:400 13px/1.4 var(--font-ui);color:var(--text-body);margin-top:3px}
.imp-b4-pl-cta{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;border-radius:14px;background:var(--lime);border:var(--btn-border);color:#1C1C1E;font:600 15px/1 var(--font-ui);text-decoration:none;transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-b4-pl-cta:hover{background:var(--violet);color:#FBFBFB;border-color:var(--lime)}
.imp-b4-pl-section-row{display:flex;align-items:baseline;justify-content:space-between;margin:30px 0 12px}
.imp-b4-pl-section-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body)}
.imp-b4-pl-section-count{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-meta)}
.imp-b4-pl-resources{display:flex;flex-direction:column;gap:12px}
.imp-b4-pl-fluid-card{position:absolute;top:-26px;right:-26px;width:96px;opacity:var(--gfx-fluid);pointer-events:none}
:root[data-theme="light"] .imp-b4-pl-fluid-card{opacity:.5}
.imp-b4-pl-resource-body{position:relative;display:flex;align-items:center;gap:14px;flex:1;min-width:0}
.imp-b4-pl-stats,.imp-b4-pl-segments,.imp-b4-pl-quiz{display:none}
@media (min-width:1024px){
.imp-b4-pl-page{height:100vh;box-sizing:border-box;padding:120px 140px 40px;display:flex;flex-direction:column}
.imp-b4-pl-header{display:none}
.imp-b4-pl-title{margin:0;font-size:62px}
.imp-b4-pl-caveat{margin:12px 0 0;font-size:24px}
.imp-b4-pl-hero{margin-bottom:28px}
.imp-b4-pl-body-grid{flex:1;display:grid;grid-template-columns:1.35fr 1fr;gap:20px;min-height:0}
.imp-b4-program-card{padding:30px;border-radius:var(--radius-card);display:flex;flex-direction:column}
.imp-b4-pl-cross{top:-70px;right:-60px;width:250px;opacity:var(--gfx-glass)}
:root[data-theme="light"] .imp-b4-pl-cross{top:-70px;width:250px;opacity:var(--gfx-glass)}
.imp-b4-pl-card-inner{height:100%;gap:0}
.imp-b4-pl-program-name{font-size:46px;max-width:280px}
.imp-b4-pl-stats{display:flex;justify-content:flex-start;gap:32px}
.imp-b4-pl-stats-wrap{display:flex;flex:1;flex-direction:column;justify-content:center;min-height:0}
.imp-b4-pl-stat{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.imp-b4-pl-stat-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-meta)}
.imp-b4-pl-stat-value{font:400 32px/1 var(--font-display);color:var(--text-heading)}
.imp-b4-pl-stat-value--accent{color:var(--eyebrow-color)}
.imp-b4-pl-session-row{gap:22px}
.imp-b4-progress-ring{width:104px;height:104px}
.imp-b4-progress-ring-inner{font-size:30px}
.imp-b4-pl-session-title{font-size:17px;line-height:1.3}
.imp-b4-pl-session-meta{font-size:14px;line-height:1.45;margin-top:5px}
.imp-b4-pl-segments{display:flex;gap:5px;margin-top:14px}
.imp-b4-pl-seg{flex:1;height:6px;border-radius:3px;background:var(--ring-track)}
.imp-b4-pl-seg--done{background:var(--eyebrow-color)}
.imp-b4-pl-seg--now{background:rgba(var(--lime-rgb),.4)}
.imp-b4-pl-cta{min-height:52px;margin-top:24px;padding:0 24px;border-radius:var(--radius-btn);font-size:16px}
.imp-b4-pl-aside{display:flex;flex-direction:column;gap:14px;min-height:0}
.imp-b4-pl-section-row{margin:0}
.imp-b4-resource-card{gap:16px;padding:20px}
.imp-b4-resource-icon{width:56px;height:56px;border-radius:16px}
.imp-b4-resource-icon svg{width:24px;height:24px}
.imp-b4-resource-title{font-size:15px}
.imp-b4-resource-meta{font-size:13px;margin-top:4px}
.imp-b4-resource-arrow{font-size:18px}
.imp-b4-pl-resources{gap:14px}
.imp-b4-pl-fluid-card{top:-40px;right:-30px;width:160px;opacity:var(--gfx-fluid)}
:root[data-theme="light"] .imp-b4-pl-fluid-card{opacity:.22}
.imp-b4-pl-quiz{display:block}
}

/* ===== konto.css -> prefiks .imp-b4 ===== */
.imp-b4-kt-glow{top:-90px;right:-150px;width:420px;height:420px}
.imp-b4-kt-glow-lime{bottom:-60px;left:-110px;width:320px;height:320px;background:var(--glow-lime)!important}
.imp-b4-kt-glass-ring{top:-40px;right:-50px;width:180px}
.imp-b4-kt-page{padding:20px 20px 108px}
@media (min-width:1024px){
.imp-b4-kt-page{padding:104px 140px 40px;height:100%;box-sizing:border-box;display:flex;flex-direction:column;max-width:1160px;margin:0 auto}
.imp-b4-kt-glow{top:-260px;right:-180px;width:820px;height:820px}
.imp-b4-kt-glass-ring{top:-80px;right:-60px;width:420px}
.imp-b4-kt-glow-lime{bottom:-220px;left:-200px;width:700px;height:700px}
}
.imp-b4-logo-row-mobile{display:flex;align-items:center;margin-bottom:34px}
@media (min-width:1024px){
.imp-b4-logo-row-mobile{display:none}
}

/* ---- PRZEKŁADY makieta -> żywa strona (Krok 2 instrukcji) ----------------
   Nowy eksport sam ma już dok position:fixed (przejęte z poprzedniej rundy) —
   zostaje z kopii; dokładamy tylko safe-area i resztę tabeli przekładów. */

/* pasek gestów iPhone'a (wymaga viewport-fit=cover — jest w layoutach) */
.imp-b4-dock{bottom:calc(12px + env(safe-area-inset-bottom))}
.imp-b4-pl-page{padding-bottom:calc(108px + env(safe-area-inset-bottom))}
.imp-b4-kt-page{padding-bottom:calc(108px + env(safe-area-inset-bottom))}

/* topbar: w eksporcie absolute w sztywnym kadrze — w aplikacji sticky
   w naturalnym przepływie (zostaje widoczny przy przewijaniu; decyzja
   właściciela z drogi 3, utrzymana). Górny padding treści pomniejszony
   o miejsce, które pasek zajmuje teraz w przepływie (~80px). */
@media (min-width:1024px){
  .imp-b4-topbar{position:sticky;top:16px;margin:16px 24px 0;left:auto;right:auto}
  .imp-b4-pl-page{padding-top:40px}
  .imp-b4-kt-page{padding-top:24px}
  /* Eksport zakłada topbar WYJĘTY z przepływu (absolute) i treść na pełne
     100vh. U nas topbar jest w przepływie (sticky, realnie 78px + 16px
     marginesu), więc pełne 100vh treści dawało stronę ~100vh+94px — to
     dokładnie te ~100px martwego scrolla zgłoszone przez właściciela na
     desktopie (MacBook, 100% zoom). Zamiast zgadywać stałą: wrapper strony
     to jeden ekran (flex kolumna 100dvh), a treść pulpitu wypełnia
     resztę po pasku (flex:1). Gdy treść się mieści — zero przewijania,
     "app feeling". min-height zamiast height (2.09.2026): na niższych
     oknach (MacBook 14" przy 100%, duża czcionka) sztywna wysokość
     ucinała treść BEZ możliwości przewinięcia — teraz strona rośnie
     i przewija się normalnie, a na dużych ekranach nic się nie zmienia.
     :not(--auto) wyklucza konto: tam treść bywa wyższa niż ekran i MA się
     przewijać (wrapper z eksportu ma min-height:auto). */
  .imp-b4-page:not(.imp-b4-page--auto){display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}
  .imp-b4-pl-page{height:auto;flex:1;min-height:0}
}

/* ODSTĘPSTWO od eksportu na prośbę właściciela (29.08.2026): konto nie
   miało żadnej grafiki w lewym dolnym rogu (sama poświata limonkowa).
   Dodany fluid-bg-6 na zasadach pozostałych widoków — klasa gfx-fluid
   (krycie z tokenów: .42 ciemny / .14 jasny), wychodzi za krawędź,
   skala mobile/desktop jak sąsiednie kt-glow-lime i pl-brain.
   DO DODANIA też w Claude Design, żeby weszła do kolejnego eksportu. */
.imp-b4-kt-fluid{bottom:-70px;left:-110px;width:300px}
@media (min-width:1024px){
  .imp-b4-kt-fluid{bottom:-170px;left:-150px;width:560px}
}

/* 100dvh (skaczący pasek adresu w mobilnym Safari) + overflow:clip
   (nie tworzy kontenera przewijania — sticky działa); oba z fallbackiem. */
.imp-b4-page{min-height:100vh;min-height:100dvh;overflow:hidden;overflow:clip}

/* [hidden] vs display:flex komponentów */
.imp-b4 [hidden]{display:none}

/* ---- inline style z eksportu -> klasy (Krok 3 pkt 3 instrukcji) ---------
   Komplet właściwości z atrybutu style="" przy danym elemencie źródła —
   w całości, nie wybiórczo. */

/* konto: wrapper strony ma w eksporcie inline min-height:auto (treść sama
   wyznacza wysokość). Stoi PO przekładzie 100dvh, żeby wygrać kolejnością. */
.imp-b4-page--auto{min-height:auto}

/* pulpit + konto: prawa strona topbara + podpis użytkownika */
.imp-b4-topbar-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.imp-b4-topbar-username{font:600 13px/1 var(--font-ui);color:var(--text-heading)}

/* pulpit: karta programu jest linkiem */
a.imp-b4-program-card{text-decoration:none}
.imp-b4-eyebrow--program{color:var(--eyebrow-color);margin-bottom:10px}

/* pulpit: kolumna tekstu przy pierścieniu / w kartach zasobów */
.imp-b4-flex-min{flex:1;min-width:0}

/* pulpit: strzałka w CTA */
.imp-b4-cta-arrow{font-size:17px}

/* pulpit: karty zasobów są linkami */
a.imp-b4-resource-card{text-decoration:none}

/* konto: karty, nagłówki, odstępy (inline z konto.html) */
.imp-b4-card--column{display:flex;flex-direction:column}
.imp-b4-card-title{font:600 15px/1.3 var(--font-ui);color:var(--text-heading)}
.imp-b4-card-lead{margin:7px 0 16px;font:400 12.5px/1.5 var(--font-ui);color:var(--text-body)}
.imp-b4-card-lead--last{margin-bottom:0}
.imp-b4-eyebrow--tight{margin-bottom:6px}
.imp-b4-eyebrow--wide{margin-bottom:14px}
.imp-b4-profile-row--gap{margin-bottom:28px}
.imp-b4-kt-side{display:flex;flex-direction:column;gap:14px;min-height:0}
.imp-b4-mt-auto{margin-top:auto}

/* EKSPERYMENT właściciela (29.08.2026, tylko pulpit): pasek 15 dni z
   licznikiem "X/15" przy segmentach. Widoczne jak segmenty — wyłącznie
   desktop (mobile nie ma paska, zgodnie z eksportem). Licznik w VT323,
   wzorem liczników tygodni z ekranów Programu. */
.imp-b4-pl-days-row{display:none}
@media (min-width:1024px){
  /* licznik NAD paskiem, do prawej (poprawka właściciela po klikaniu) */
  .imp-b4-pl-days-row{display:flex;flex-direction:column;gap:7px;margin-top:14px}
  .imp-b4-pl-days-row .imp-b4-pl-segments{display:flex;margin-top:0}
  .imp-b4-pl-days-count{font:400 15px/1 'VT323',monospace;color:var(--text-heading);align-self:flex-end}
}

/* Karta programu przestała być linkiem (29.08.2026) — wskaźnik myszy nie
   może sugerować klikalności całości; klikalny jest tylko przycisk. */
.imp-b4-program-card{cursor:default}

/* Hover karty programu: TYLKO ruch karty, bez zmiany koloru tekstu
   (życzenie właściciela, 29.08.2026 — dotyczy obu motywów). Powód
   zjawiska: .pl-program-name nie ma własnego `color`, więc dziedziczyła
   go z <a class="program-card">, a globalny reset `a:hover` przestawiał
   go na fiolet. Kolor akcentu zostaje wyłącznie na hoverze przycisku CTA.
   Specyficzność (0,2,0) bije reset (0,1,1). */
.imp-b4-program-card:hover{color:var(--text-heading)}

/* Akcje będące w eksporcie gołym <button>, w aplikacji formularzem POST
   z CSRF — <form> wchodzi między kolumnę flex a przycisk i psuje
   rozciąganie; przywrócone jawnie. */
.imp-b4-kt-side > form{display:flex;flex-direction:column}
.imp-b4-btn-danger-outline{width:100%}

/* ==========================================================================
   UJEDNOLICENIE JASNEGO SZKŁA — decyzja właściciela z Claude Design
   (29 sierpnia 2026, po klikaniu Obszaru B).

   Ustalenie: WSZYSTKIE jasne powierzchnie szklane (karty, belka, dok)
   dostają krycie 45% i rozmycie 48px — czyli wartości, które ciemny motyw
   miał od zawsze. Zastępuje wcześniejsze, różne per ekran: .7/19px (karty
   Wejścia i Konta), .62/22px (belka i karta programu na desktopie),
   .4/22px (mobile), .92/18px (stare uzupełnienia luki w Obszarze C).

   Jeden blok na KOŃCU pliku zamiast edycji maszynowych kopii — wygrywa
   kaskadą (ta sama specyficzność, późniejszy w źródle, media queries nie
   podnoszą specyficzności) i obejmuje wszystkie żywe sekcje naraz, bez
   reimportu obszarów. Saturate ŚWIADOMIE nietknięty — ustalenie mówiło
   o kryciu i rozmyciu; gdyby jasne szkło wyglądało przesyconie, to tu.

   Claude Design ma już te wartości u siebie — kolejne eksporty przyjdą
   z poprawnymi tokenami i wtedy ten blok stanie się zbędny (do zdjęcia
   przy zbiorczym szlifie, gdy wszystkie obszary przejdą na nowe eksporty).

   STAN 30.08: .imp-b4, .imp-c4 i .imp-c11 mają krycie .45 już w swoich
   tokenach — wypadły z listy. Sekcja .imp-c (droga 3) usunięta przy
   sprzątaniu 30.08. Zostaje wyłącznie .imp-a (Obszar A czeka na nowy
   eksport) — po jego reimporcie cały ten blok znika.
   ========================================================================== */
:root[data-theme="light"] .imp-a{
  --card-bg:rgba(255,255,255,.45);
  --card-blur:48px;
  --card-bg-1:rgba(255,255,255,.45);
  --card-blur-1:48px;
  --card-bg-2:rgba(255,255,255,.45);
  --card-blur-2:48px;
}

/* ==========================================================================
   OBSZAR C — PROGRAM (hub, widok modułu, historia)
   Import metodą drogi 4 — 29 sierpnia 2026, eksport z 16:28.
   Instrukcja: docs/instrukcja-importu-widokow.md

   Źródło: HTML DO WDROŻENIA/Obszar C - Program/ (tokens.css +
   components.css + bloki <style> z program.html, modul-2.html,
   historia.html). Tokeny KOMPLETNE u źródła (dawna luka card-bg-*
   naprawiona w szablonie eksportu; jasne szkło już ujednolicone do
   krycia .45 po stronie Claude Design — sekcja NIE podlega blokowi
   UJEDNOLICENIE JASNEGO SZKŁA wyżej).

   CAŁOŚĆ PONIŻEJ (do bloku PRZEKŁADY) TO MASZYNOWA KOPIA:
       python3 narzedzia/prefiksuj-eksport.py c4 <tokens> <components> <style-bloki>
   Prefiks .imp-c4 — usunięta 30.08.2026 sekcja .imp-c (droga 3) obsługiwała
   poprzednie widoki C i po tym imporcie jest martwa (szlif).
   ========================================================================== */
/* ===== tokens.css -> prefiks .imp-c4 ===== */
.imp-c4{--ink-rgb:28,28,30;
  --paper-rgb:251,251,251;
  --violet-rgb:112,0,255;
  --lime-rgb:203,255,0;

  --ink:#1C1C1E;
  --paper:#FBFBFB;
  --violet:#7000FF;
  --violet-hover:#5800CC;
  --lime:#CBFF00;

  --font-ui:'Inter',system-ui,sans-serif;
  --font-display:'VT323',monospace;
  --font-hand:'Caveat',cursive;
  --tracking-eyebrow:.16em;

  --radius-card:24px;
  --card-padding:24px 22px;
  --input-height:48px;
  --input-radius:16px;
  --radius-btn:16px;
  --input-padding-x:16px;
  --input-font-size:14px;
  --form-gap:16px;
  --btn-height:52px;
  --btn-font-size:16px;
  --btn-border:2px solid transparent;
  --radius-pill:999px;
  --radius-checkbox:7px;
  --eyebrow-size:10px;
  --title-card-size:38px;
  --title-hero-size:78px;
  --hand-size:18px;
  --logo-size:44px;
  --avatar-size:64px;
  --name-size:34px;

  
  --day-chip:44px;
  --radius-module:20px;
  --radius-chip:16px;
  --module-num-size:40px;
  --variant-name-size:22px;

  

  
  --bg:#1C1C1E;
  --text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --text-accent:#B98CFF;          
  --eyebrow-color:var(--lime);    
  --card-border:rgba(var(--paper-rgb),.15);
  --card-border-top:rgba(255,255,255,.5);
  --card-bg:rgba(var(--ink-rgb),.45);
  --card-blur:44px;
  --card-saturate:1.9;
  --card-shadow:0 24px 64px rgba(0,0,0,.4),0 8px 24px rgba(var(--violet-rgb),.22);

  
  --card-bg-1:rgba(var(--ink-rgb),.45);   --card-blur-1:48px; --card-saturate-1:2;
  --card-bg-2:rgba(var(--ink-rgb),.45);   --card-blur-2:48px; --card-saturate-2:2;
  --card-bg-3:rgba(var(--paper-rgb),.05);
  --card-bg-4:rgba(var(--paper-rgb),.04);
  --glass-border:rgba(255,255,255,.18);
  --glass-border-top:rgba(255,255,255,.55);
  --shadow-glass:0 24px 64px rgba(0,0,0,.35),0 8px 24px rgba(var(--violet-rgb),.25),inset 0 1px 0 rgba(255,255,255,.5);
  --ring-track:rgba(var(--paper-rgb),.14);
  --divider:rgba(var(--paper-rgb),.12);
  --input-bg:rgba(var(--paper-rgb),.06);
  --input-border:rgba(var(--paper-rgb),.24);
  --btn-outline-border:rgba(var(--paper-rgb),.3);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.58;
  --gfx-fluid:.42;
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.45),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.14),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#242427;}
:root[data-theme="light"] .imp-c4{--bg:#FBFBFB;
  --text-heading:#1C1C1E;
  --text-body:#6B6870;
  --text-meta:#9A97A0;
  --text-accent:#7000FF;          
  --eyebrow-color:var(--violet);  
  --card-border:rgba(var(--ink-rgb),.1);
  --card-border-top:rgba(255,255,255,.95);
  --card-bg:rgba(255,255,255,.45);
  --card-blur:19px;
  --card-saturate:1.4;
  --card-shadow:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);

  
  --card-bg-1:rgba(var(--paper-rgb),.45); --card-blur-1:22px; --card-saturate-1:1.6;
  --card-bg-2:rgba(var(--paper-rgb),.45); --card-blur-2:22px; --card-saturate-2:1.5;
  --card-bg-3:rgba(255,255,255,.55);
  --card-bg-4:rgba(var(--ink-rgb),.02);
  --glass-border:rgba(255,255,255,.5);
  --glass-border-top:rgba(255,255,255,.8);
  --shadow-glass:0 24px 64px rgba(var(--ink-rgb),.18),0 8px 24px rgba(var(--violet-rgb),.22),inset 0 1px 0 rgba(255,255,255,.7);
  --ring-track:rgba(var(--ink-rgb),.1);
  --divider:rgba(var(--ink-rgb),.07);
  --input-bg:#fff;
  --input-border:rgba(var(--ink-rgb),.14);
  --btn-outline-border:rgba(var(--ink-rgb),.16);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.42;
  --gfx-fluid:.14;
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.08),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.1),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#F1EEF7;}
.imp-c4-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
:root[data-theme="light"] .imp-c4-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
@media (min-width:1024px){
.imp-c4{--radius-card:26px;
    --card-padding:34px 32px;
    --input-height:50px;
    --input-padding-x:18px;
    --input-font-size:15px;
    --form-gap:18px;
    --btn-height:54px;
    --title-card-size:42px;
    --title-hero-size:88px;
    --hand-size:26px;
    --logo-size:56px;
    --avatar-size:88px;
    --name-size:56px;
    --day-chip:36px;
    --radius-module:18px;}
:root[data-theme="light"] .imp-c4{--shadow-glass:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);}
}
@media (prefers-reduced-motion: reduce){
:where(.imp-c4), :where(.imp-c4) *{transition:none !important; animation:none !important;}
}
@media (prefers-reduced-transparency: reduce){
.imp-c4{--card-bg:var(--glass-fallback-bg);
    --card-blur:0px;
    --card-saturate:1;}
.imp-c4-card{backdrop-filter:none; -webkit-backdrop-filter:none;}
}
.imp-c4{--day-done-bg:var(--violet);         --day-done-fg:var(--paper);
  --day-sel-bg:var(--lime);            --day-sel-fg:var(--ink);
  --day-sel-ring:0 0 0 4px rgba(var(--lime-rgb),.22);
  --day-off-bg:rgba(var(--paper-rgb),.06);
  --day-off-border:rgba(var(--paper-rgb),.16);
  --day-off-fg:var(--text-meta);
  --module-bg:#272729;
  --module-shadow:0 6px 18px rgba(var(--ink-rgb),.05);
  --module-on-bg:var(--violet);
  --module-on-shadow:0 16px 40px rgba(var(--violet-rgb),.35);
  --status-done-bg:rgba(var(--lime-rgb),.18);  --status-done-fg:var(--lime);
  --status-now-bg:rgba(185,140,255,.22);       --status-now-fg:#B98CFF;
  --status-next-bg:rgba(var(--paper-rgb),.1);  --status-next-fg:var(--text-body);
  --edge-bg:rgba(185,140,255,.07);   --edge-border:rgba(185,140,255,.32);
  --edge-on-bg:rgba(185,140,255,.16);--edge-on-border:#B98CFF;
  --day-progress:#B98CFF;            
  --danger:#FF8A80; --danger-fg:var(--ink);
  --danger-bg:rgba(227,28,65,.12); --danger-border:rgba(255,107,107,.4);}
:root[data-theme="light"] .imp-c4{--day-off-bg:rgba(var(--ink-rgb),.05);
  --day-off-border:rgba(var(--ink-rgb),.12);
  --day-off-fg:#8B8792;
  --day-sel-ring:0 0 0 4px #F1E5FF;
  --module-bg:#FFFFFF;
  --module-shadow:0 6px 18px rgba(var(--ink-rgb),.06);
  --module-on-shadow:0 16px 40px rgba(var(--violet-rgb),.22);
  --status-done-bg:rgba(var(--lime-rgb),.3);   --status-done-fg:#3F4A00;
  --status-now-bg:rgba(var(--violet-rgb),.1);  --status-now-fg:var(--violet);
  --status-next-bg:rgba(var(--ink-rgb),.05);   --status-next-fg:var(--text-body);
  --edge-bg:rgba(var(--violet-rgb),.04);   --edge-border:rgba(var(--violet-rgb),.28);
  --edge-on-bg:rgba(var(--violet-rgb),.09);--edge-on-border:var(--violet);
  --danger:#B03A2E; --danger-fg:var(--paper);
  --danger-bg:rgba(227,28,65,.06); --danger-border:rgba(227,28,65,.28);}

/* ===== components.css -> prefiks .imp-c4 ===== */
:where(.imp-c4), :where(.imp-c4) *{box-sizing:border-box}
.imp-c4{margin:0;padding:0}
.imp-c4{background:var(--bg);font-family:var(--font-ui);color:var(--text-body);-webkit-font-smoothing:antialiased}
:where(.imp-c4) a{color:var(--text-accent);text-decoration:none}
:where(.imp-c4) a:hover{color:var(--violet-hover)}
:where(.imp-c4) button,:where(.imp-c4) input{font-family:inherit}
:where(.imp-c4) button{border:none;background:none;cursor:pointer;padding:0}
:where(.imp-c4) img{max-width:100%}
.imp-c4-page{position:relative;overflow:hidden;min-height:100vh;background:var(--bg)}
.imp-c4-glow{position:absolute;pointer-events:none;border-radius:50%}
.imp-c4-glow--violet{background:var(--glow-violet)}
.imp-c4-glow--lime{background:var(--glow-lime)}
.imp-c4-logo{width:var(--logo-size);height:var(--logo-size);object-fit:contain;display:block}
.imp-c4-logo--light{display:none}
:root[data-theme="light"] .imp-c4-logo--dark{display:none}
:root[data-theme="light"] .imp-c4-logo--light{display:block}
.imp-c4-gfx-fluid{position:absolute;pointer-events:none;opacity:var(--gfx-fluid);z-index:0}
.imp-c4-gfx-glass{position:absolute;pointer-events:none;opacity:var(--gfx-glass);z-index:0}
.imp-c4-scrim{position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(178deg,rgba(var(--ink-rgb),0) 0%,rgba(var(--ink-rgb),.45) 9%,rgba(var(--ink-rgb),.88) 20%,var(--bg) 34%)}
:root[data-theme="light"] .imp-c4-scrim{background:linear-gradient(178deg,rgba(var(--paper-rgb),0) 0%,rgba(var(--paper-rgb),.5) 9%,rgba(var(--paper-rgb),.9) 20%,var(--bg) 34%)}
.imp-c4-only-desktop{display:none!important}
@media (min-width:1024px){
.imp-c4-only-mobile{display:none!important}
.imp-c4-only-desktop{display:block!important}
}
.imp-c4-gfx-hand{pointer-events:none;filter:drop-shadow(0 24px 48px rgba(var(--violet-rgb),.45))}
.imp-c4-hero{display:flex;flex-direction:column;justify-content:center;position:relative;z-index:1}
.imp-c4-hero-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color);margin-bottom:16px}
.imp-c4-hero-title{margin:0;font:400 var(--title-hero-size)/.9 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-c4-hand-note{margin:16px 0 0;font:500 var(--hand-size)/1.2 var(--font-hand);color:var(--text-body)}
.imp-c4-card{position:relative;z-index:1;background:var(--card-bg);backdrop-filter:blur(var(--card-blur)) saturate(var(--card-saturate));-webkit-backdrop-filter:blur(var(--card-blur)) saturate(var(--card-saturate));border:1px solid var(--card-border);border-top-color:var(--card-border-top);border-radius:var(--radius-card);box-shadow:var(--card-shadow);color:var(--text-heading);padding:var(--card-padding)}
.imp-c4-card--flat{background:rgba(var(--paper-rgb),.05);backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;border:1px solid var(--card-border)}
.imp-c4-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-accent)}
.imp-c4-eyebrow-row{display:flex;align-items:center;gap:9px;margin-bottom:10px}
.imp-c4-eyebrow-row .imp-c4-eyebrow{margin-bottom:0}
.imp-c4-title-card{margin:0 0 20px;font:400 var(--title-card-size)/.92 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-c4-alert-error{display:flex;gap:12px;padding:14px;border-radius:16px;background:rgba(227,28,65,.16);border:1px solid rgba(227,28,65,.4);margin-bottom:20px}
.imp-c4-alert-error svg{flex:none;margin-top:1px}
.imp-c4-alert-error p{margin:0;font:500 13px/1.45 var(--font-ui);color:#FF7A93}
.imp-c4-form{display:flex;flex-direction:column;gap:var(--form-gap)}
.imp-c4-field-label{display:block;font:600 13px/1 var(--font-ui);color:var(--text-heading);margin-bottom:8px}
.imp-c4-input{width:100%;min-height:var(--input-height);padding:0 var(--input-padding-x);border-radius:var(--input-radius);border:1px solid var(--input-border);background:var(--input-bg);font:400 var(--input-font-size)/1 var(--font-ui);color:var(--text-heading)}
.imp-c4-input::placeholder{color:var(--text-meta)}
.imp-c4-input-static{display:flex;align-items:center;gap:10px;min-height:var(--input-height);padding:0 var(--input-padding-x);border-radius:var(--input-radius);border:1px solid var(--card-border);background:rgba(var(--paper-rgb),.04)}
.imp-c4-input-static span{flex:1;font:400 var(--input-font-size)/1 var(--font-ui);color:var(--text-body)}
.imp-c4-field-hint{font:400 11.5px/1.4 var(--font-ui);color:var(--text-body);margin-top:7px}
.imp-c4-field-hint--error{color:#FF7A93;display:flex;align-items:center;gap:7px;font-weight:500}
.imp-c4-strength{display:flex;gap:4px;margin-top:10px}
.imp-c4-strength-seg{flex:1;height:5px;border-radius:var(--radius-pill);background:rgba(var(--paper-rgb),.1)}
.imp-c4-strength-seg--filled{background:var(--text-accent)}
.imp-c4-strength-seg--full{background:var(--lime)}
.imp-c4-checkbox-row{display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer}
.imp-c4-checkbox-row input[type="checkbox"]{width:24px;height:24px;accent-color:var(--lime);border-radius:var(--radius-checkbox);cursor:pointer}
.imp-c4-checkbox-row span{font:400 13.5px/1 var(--font-ui);color:var(--text-body)}
.imp-c4-btn-primary{width:100%;min-height:var(--btn-height);border:var(--btn-border);border-radius:var(--radius-btn);background:var(--lime);color:#1C1C1E;font:600 var(--btn-font-size)/1 var(--font-ui);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-btn-primary:hover{background:var(--violet);color:#FBFBFB;border-color:var(--lime)}
.imp-c4-btn-primary:disabled{background:rgba(var(--lime-rgb),.3);color:rgba(var(--paper-rgb),.6);cursor:not-allowed}
.imp-c4-btn-secondary{width:100%;min-height:var(--btn-height);border:1px solid var(--btn-outline-border);border-radius:var(--radius-btn);background:transparent;color:var(--btn-outline-text);font:600 var(--btn-font-size)/1 var(--font-ui);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-btn-secondary:hover{border-color:var(--text-accent)}
.imp-c4-link-accent{font:500 13px/1 var(--font-ui);color:var(--text-accent);cursor:pointer}
.imp-c4-link-accent:hover{color:var(--violet-hover)}
.imp-c4-foot-note{text-align:center;margin-top:18px;font:400 13px/1.4 var(--font-ui);color:var(--text-body)}
.imp-c4-foot-note .imp-c4-link-strong{font-weight:600;color:var(--text-accent);cursor:pointer}
.imp-c4-notice-eyebrow{font:400 10px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-meta);margin-bottom:12px}
.imp-c4-notice{padding:22px;border-radius:24px}
.imp-c4-notice--success{background:rgba(var(--lime-rgb),.1);border:1px solid rgba(var(--lime-rgb),.4)}
.imp-c4-notice--error{background:rgba(227,28,65,.12);border:1px solid rgba(227,28,65,.4)}
.imp-c4-notice-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.imp-c4-notice-icon{width:32px;height:32px;border-radius:999px;background:var(--lime);color:#1C1C1E;display:grid;place-items:center;flex:none}
.imp-c4-notice p{margin:0;font:400 13px/1.55 var(--font-ui);color:var(--text-body)}
.imp-c4-notice-title{font:600 14.5px/1.2 var(--font-ui);color:var(--text-heading)}
.imp-c4-notice-title--error{color:#FF7A93}
.imp-c4-split{display:flex;flex-direction:column}
.imp-c4-split-media{order:2}
.imp-c4-split-form{order:1;display:flex;flex-direction:column;justify-content:center;padding:0}
.imp-c4-card-wrap{width:100%;max-width:420px;margin:0 auto}
@media (min-width:1024px){
.imp-c4-split{display:grid;grid-template-columns:1fr 560px;min-height:100vh}
.imp-c4-split--reverse{grid-template-columns:560px 1fr}
.imp-c4-split-media,.imp-c4-split-form{order:initial;padding:0 100px}
.imp-c4-split--reverse .imp-c4-split-media{padding:0 100px}
.imp-c4-split-form.imp-c4-split-form--card-col{display:flex;align-items:center;justify-content:center;padding:40px 64px}
}
.imp-c4-topbar{position:absolute;top:16px;left:24px;right:24px;z-index:3;display:none;align-items:center;gap:24px;padding:10px 14px 10px 18px;border-radius:20px;background:var(--card-bg-2);backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));-webkit-backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
:root[data-theme="light"] .imp-c4-topbar{border-color:var(--card-border);border-top-color:var(--card-border-top)}
.imp-c4-topbar-nav{display:flex;gap:4px}
.imp-c4-nav-item{min-height:44px;display:flex;align-items:center;gap:9px;padding:0 16px;border-radius:14px;color:var(--text-body);cursor:pointer;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-nav-item span{font:600 13px/1 var(--font-ui)}
.imp-c4-nav-item:hover{color:var(--text-accent)}
.imp-c4-nav-item--active{background:var(--lime);color:#1C1C1E}
.imp-c4-nav-item--active:hover{color:#1C1C1E}
.imp-c4-topbar-icon-btn{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--card-border);background:rgba(var(--paper-rgb),.06);border-radius:var(--radius-pill);color:var(--text-heading);cursor:pointer}
.imp-c4-topbar-user{display:flex;align-items:center;gap:10px;padding:5px 14px 5px 5px;border-radius:var(--radius-pill);background:rgba(var(--paper-rgb),.06);border:1px solid var(--card-border)}
.imp-c4-avatar{width:34px;height:34px;border-radius:var(--radius-pill);background:rgba(var(--violet-rgb),.12);display:grid;place-items:center;font:600 12px/1 var(--font-ui);color:var(--text-accent)}
.imp-c4-dock{position:fixed;left:12px;right:12px;bottom:12px;z-index:4;display:flex;gap:4px;padding:6px;border-radius:22px;background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
.imp-c4-dock-item{flex:1;min-height:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border-radius:16px;color:var(--text-body);cursor:pointer}
.imp-c4-dock-item--active{background:var(--lime);color:#1C1C1E}
.imp-c4-dock-item span{font:600 9.5px/1 var(--font-ui);letter-spacing:.08em;text-transform:uppercase}
@media (min-width:1024px){
.imp-c4-topbar{display:flex}
.imp-c4-dock{display:none}
}
.imp-c4-theme-picker{display:flex;gap:8px}
.imp-c4-theme-opt{flex:1;min-height:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:11px 6px;border-radius:14px;border:1px solid var(--card-border);color:var(--text-heading);cursor:pointer;transition:border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-theme-opt:hover{border-color:var(--text-accent)}
.imp-c4-theme-opt--active{background:var(--lime);border-color:transparent;color:#1C1C1E}
.imp-c4-theme-opt span{font:600 10.5px/1 var(--font-ui)}
.imp-c4-data-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px}
.imp-c4-data-row span:first-child{font:400 13px/1.3 var(--font-ui);color:var(--text-body)}
.imp-c4-data-row span:last-child{font:600 13.5px/1.3 var(--font-ui);color:var(--text-heading)}
.imp-c4-data-rule{height:1px;background:var(--divider)}
.imp-c4-btn-danger-outline{display:flex;align-items:center;justify-content:center;gap:9px;min-height:52px;border-radius:16px;border:1px solid rgba(227,28,65,.4);font:600 14px/1 var(--font-ui);color:#B03A2E;cursor:pointer;transition:background 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-btn-danger-outline:hover{background:rgba(227,28,65,.14)}
:root[data-theme="light"] .imp-c4-btn-danger-outline{background:rgba(227,28,65,.12);color:#B03A2E}
.imp-c4-btn-danger-outline--dark{color:#FF8A80;border-color:rgba(255,107,107,.45);background:transparent}
.imp-c4-program-card{position:relative;overflow:hidden;padding:22px;border-radius:24px;background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass);color:var(--text-heading);cursor:pointer;transition:transform 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-program-card:hover{transform:translateY(-4px)}
.imp-c4-progress-ring{flex:none;width:72px;height:72px;border-radius:999px;display:grid;place-items:center;background:conic-gradient(var(--eyebrow-color) var(--pct,37%),var(--ring-track) 0)}
:root[data-theme="light"] .imp-c4-progress-ring{background:conic-gradient(var(--violet) var(--pct,37%),var(--ring-track) 0)}
.imp-c4-progress-ring-inner{width:78%;height:78%;border-radius:999px;background:var(--bg);display:grid;place-items:center;font:400 22px/1 var(--font-display);color:var(--text-heading)}
.imp-c4-resource-card{display:flex;align-items:center;gap:14px;padding:16px;border-radius:20px;background:var(--card-bg-3);border:1px solid var(--card-border);border-top-color:var(--card-border-top);box-shadow:var(--shadow-glass);cursor:pointer;position:relative;overflow:hidden;transition:transform 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-resource-card:hover{transform:translateY(-3px)}
.imp-c4-resource-icon{flex:none;width:52px;height:52px;border-radius:14px;background:var(--violet);display:grid;place-items:center;color:#FBFBFB}
.imp-c4-resource-icon--outline{background:transparent;border:1px dashed rgba(var(--lime-rgb),.5);color:var(--lime)}
:root[data-theme="light"] .imp-c4-resource-icon--outline{border-color:rgba(var(--violet-rgb),.45);color:var(--violet)}
.imp-c4-resource-title{font:600 14px/1.3 var(--font-ui);color:var(--text-heading)}
.imp-c4-resource-meta{font:400 12px/1.4 var(--font-ui);color:var(--text-body);margin-top:3px}
.imp-c4-resource-arrow{font:400 17px/1 var(--font-ui);color:var(--eyebrow-color)}
:root[data-theme="light"] .imp-c4-resource-arrow{color:var(--violet)}
.imp-c4-quiz-card{margin-top:auto;padding:20px;border-radius:20px;background:var(--card-bg-4);border:1px solid var(--card-border)}
.imp-c4-quiz-chip{font:600 10.5px/1 var(--font-ui);padding:4px 8px;border-radius:20px;background:rgba(var(--lime-rgb),.16);color:var(--lime)}
:root[data-theme="light"] .imp-c4-quiz-chip{background:rgba(var(--violet-rgb),.09);color:var(--violet)}
.imp-c4-profile-row{display:flex;align-items:center;gap:16px}
.imp-c4-avatar-lg{flex:none;width:var(--avatar-size);height:var(--avatar-size);border-radius:999px;background:var(--violet);display:grid;place-items:center;font:400 calc(var(--avatar-size)*.47)/1 var(--font-display);color:#FBFBFB}
.imp-c4-profile-name{margin:0;font:400 var(--name-size)/.92 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-c4-profile-email{font:400 12.5px/1.4 var(--font-ui);color:var(--text-body);margin-top:5px}
.imp-c4-konto-grid{display:flex;flex-direction:column;gap:14px}
@media (min-width:1024px){
.imp-c4-konto-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:20px;flex:1;min-height:0}
}
.imp-c4-back-link{display:flex;align-items:center;gap:8px;min-height:44px;font:500 13px/1 var(--font-ui);color:var(--text-body);cursor:pointer;margin-bottom:10px;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-back-link:hover{color:var(--text-accent)}
.imp-c4-view-title{margin:0;font:400 40px/.92 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-c4-view-sub{margin:6px 0 22px;font:400 13px/1.5 var(--font-ui);color:var(--text-body)}
@media (min-width:1024px){
.imp-c4-view-title{font-size:54px;line-height:.9}
}
.imp-c4-daybar-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px}
.imp-c4-daybar-count{font:400 18px/1 var(--font-display);color:var(--day-progress)}
.imp-c4-daybar{display:flex;gap:3px}
.imp-c4-daybar-seg{flex:1;height:7px;border-radius:4px;background:var(--ring-track)}
.imp-c4-daybar-seg--done{background:var(--day-progress)}
.imp-c4-daybar-seg--now{background:var(--lime)}
.imp-c4-day-chips{display:flex;gap:8px}
.imp-c4-day-chip{width:var(--day-chip);height:var(--day-chip);flex:none;border-radius:var(--radius-pill);display:grid;place-items:center;font:600 12px/1 var(--font-ui);cursor:pointer;border:2px solid var(--day-off-border);background:var(--day-off-bg);color:var(--day-off-fg);box-shadow:none;transition:transform 120ms cubic-bezier(.4,0,.2,1)}
.imp-c4-day-chip:hover{transform:translateY(-2px)}
.imp-c4-day-chip--done{background:var(--day-done-bg);border-color:var(--day-done-bg);color:var(--day-done-fg)}
.imp-c4-day-chip--selected{background:var(--day-sel-bg);border-color:var(--day-sel-bg);color:var(--day-sel-fg);box-shadow:var(--day-sel-ring)}
.imp-c4-day-legend{font:400 11px/1 var(--font-ui);color:var(--text-meta);margin-top:10px}
.imp-c4-variants{display:flex;flex-direction:column;gap:8px}
.imp-c4-variants--row{flex-direction:row;gap:12px}
.imp-c4-variant{flex:1;display:flex;align-items:center;gap:12px;min-height:46px;padding:11px 15px;border-radius:15px;border:1px solid var(--card-border);background:var(--input-bg);cursor:pointer;transition:transform 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-variant:hover{transform:translateY(-2px)}
.imp-c4-variant-name{font:400 var(--variant-name-size)/1 var(--font-display);color:var(--text-heading)}
.imp-c4-variant-desc{flex:1;font:400 12.5px/1.35 var(--font-ui);color:var(--text-body)}
.imp-c4-variant-time{font:600 13px/1 var(--font-ui);color:var(--text-heading)}
.imp-c4-variant--selected{background:var(--violet);border-color:var(--violet)}
.imp-c4-variant--selected .imp-c4-variant-name,.imp-c4-variant--selected .imp-c4-variant-time{color:var(--paper)}
.imp-c4-variant--selected .imp-c4-variant-desc{color:#E4DDF7}
.imp-c4-session-card{padding:20px 22px;border-radius:var(--radius-card);background:var(--module-bg);border:1px solid var(--card-border);box-shadow:var(--module-shadow)}
.imp-c4-session-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.imp-c4-session-rule{height:1px;background:var(--divider);margin:16px 0 14px}
.imp-c4-btn-start{display:flex;align-items:center;justify-content:center;gap:10px;min-height:50px;margin-top:14px;border-radius:var(--radius-btn);background:var(--lime);border:var(--btn-border);color:#1C1C1E;font:600 15px/1 var(--font-ui);cursor:pointer;transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-btn-start:hover{background:var(--violet);color:var(--paper);border-color:var(--lime)}
.imp-c4-module-card{position:relative;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;padding:0 24px;border-radius:var(--radius-module);background:var(--module-bg);border:1px solid var(--card-border);box-shadow:var(--module-shadow);cursor:pointer;transition:transform 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-module-card:hover{transform:translateY(-3px)}
.imp-c4-module-card--selected{background:var(--module-on-bg);border-color:var(--module-on-bg);box-shadow:var(--module-on-shadow)}
.imp-c4-module-row{display:flex;align-items:center;gap:22px;min-height:84px}
.imp-c4-module-num{position:relative;width:52px;flex:0 0 auto;display:grid;place-items:center;font:400 var(--module-num-size)/1 var(--font-display);color:var(--text-meta)}
.imp-c4-module-num img{position:absolute;opacity:var(--gfx-glass);pointer-events:none}
.imp-c4-module-body{flex:1;min-width:0}
.imp-c4-module-eyebrow{font:600 10px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-accent);margin-bottom:7px}
.imp-c4-module-name{font:600 17px/1.25 var(--font-ui);color:var(--text-heading)}
.imp-c4-module-meta{font:400 13px/1.45 var(--font-ui);color:var(--text-body);margin-top:4px}
.imp-c4-module-card--selected .imp-c4-module-num{color:var(--lime)}
.imp-c4-module-card--selected .imp-c4-module-eyebrow{color:var(--lime)}
.imp-c4-module-card--selected .imp-c4-module-name{color:var(--paper)}
.imp-c4-module-card--selected .imp-c4-module-meta{color:#E4DDF7}
.imp-c4-module-cta{display:none;align-items:center;justify-content:center;min-height:44px;margin:0 0 14px;border-radius:14px;background:var(--lime);border:var(--btn-border);color:#1C1C1E;font:600 14px/1 var(--font-ui);cursor:pointer;transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-module-cta:hover{background:var(--violet);color:var(--paper);border-color:var(--lime)}
.imp-c4-module-card--selected .imp-c4-module-cta{display:flex}
.imp-c4-module-card--selected .imp-c4-status-chip{display:none}
.imp-c4-status-chip{flex:0 0 auto;font:600 11px/1 var(--font-ui);padding:6px 11px;border-radius:20px;background:var(--status-next-bg);color:var(--status-next-fg)}
.imp-c4-status-chip--done{background:var(--status-done-bg);color:var(--status-done-fg)}
.imp-c4-status-chip--now{background:var(--status-now-bg);color:var(--status-now-fg)}
.imp-c4-status-chip--next{background:var(--status-next-bg);color:var(--status-next-fg)}
.imp-c4-module-progress{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;gap:9px;width:136px}
.imp-c4-module-progress-bar{width:100%;display:flex;align-items:center;gap:9px}
.imp-c4-module-progress-track{flex:1;height:6px;border-radius:4px;background:var(--ring-track);overflow:hidden}
.imp-c4-module-progress-fill{display:block;height:100%;border-radius:4px;background:var(--lime)}
.imp-c4-module-progress-pct{flex:0 0 auto;font:400 15px/1 var(--font-display);color:var(--text-heading)}
.imp-c4-edge-card{box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;min-height:58px;padding:12px 18px;border-radius:var(--radius-module);background:var(--edge-bg);border:1px solid var(--edge-border);cursor:pointer;transition:transform 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-edge-card:hover{transform:translateY(-3px)}
.imp-c4-edge-card--selected{background:var(--edge-on-bg);border-color:var(--edge-on-border)}
.imp-c4-edge-head{display:flex;align-items:baseline;gap:10px}
.imp-c4-edge-name{font:400 20px/1 var(--font-display);text-transform:uppercase;letter-spacing:.04em;color:var(--text-heading)}
.imp-c4-edge-note{font:400 10px/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-accent)}
.imp-c4-edge-cta{display:none;align-items:center;justify-content:center;min-height:44px;margin-top:12px;border-radius:13px;background:var(--lime);border:var(--btn-border);color:#1C1C1E;font:600 13.5px/1 var(--font-ui);cursor:pointer;transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-edge-cta:hover{background:var(--violet);color:var(--paper);border-color:var(--lime)}
.imp-c4-edge-card--selected .imp-c4-edge-cta{display:flex}
@media (min-width:1024px){
.imp-c4-edge-card{min-height:52px;padding:12px 24px;border-radius:16px}
.imp-c4-edge-name{font-size:24px}
}
.imp-c4-chip-link{min-height:44px;display:flex;align-items:center;gap:7px;padding:0 16px;border-radius:var(--radius-chip);border:1px solid var(--btn-outline-border);font:500 13px/1 var(--font-ui);color:var(--text-heading);cursor:pointer;transition:background 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-chip-link:hover{background:rgba(var(--paper-rgb),.08);border-color:var(--text-accent)}
:root[data-theme="light"] .imp-c4-chip-link:hover{background:rgba(var(--ink-rgb),.05)}
.imp-c4-chip-link span{margin-left:auto;color:var(--text-accent)}
.imp-c4-chip-links{display:flex;flex-direction:column;gap:8px}
.imp-c4-chip-links--row{flex-direction:row}
.imp-c4-chip-links--row .imp-c4-chip-link{flex:1}
.imp-c4-link-row{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:10px;font:500 13px/1 var(--font-ui);color:var(--text-body);cursor:pointer;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-link-row:hover{color:var(--text-accent)}
.imp-c4-link-row span{color:var(--text-accent)}
.imp-c4-link-row--danger{color:var(--danger)}
.imp-c4-link-row--danger span{color:var(--danger)}
.imp-c4-link-row--danger:hover{color:var(--danger);opacity:.75}
.imp-c4-link-rule{height:1px;background:var(--divider)}
.imp-c4-confirm-card{display:none;flex-direction:column;padding:16px;border-radius:16px;background:var(--danger-bg);border:1px solid var(--danger-border);margin-top:12px}
.imp-c4-confirm-card.imp-c4-is-open{display:flex}
.imp-c4-confirm-title{font:600 13.5px/1.35 var(--font-ui);color:var(--text-heading);margin-bottom:6px}
.imp-c4-confirm-card p{margin:0 0 14px;font:400 12px/1.5 var(--font-ui);color:var(--text-body)}
.imp-c4-confirm-actions{display:flex;gap:8px}
.imp-c4-btn-danger{flex:1;min-height:44px;display:flex;align-items:center;justify-content:center;border-radius:13px;background:var(--danger);color:var(--danger-fg);font:600 12.5px/1 var(--font-ui);cursor:pointer;border:none;transition:opacity 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-btn-danger:hover{opacity:.85}
.imp-c4-btn-ghost{flex:0 0 auto;min-height:44px;display:flex;align-items:center;justify-content:center;padding:0 16px;border-radius:13px;border:1px solid var(--divider);background:transparent;color:var(--text-body);font:600 12.5px/1 var(--font-ui);cursor:pointer;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-btn-ghost:hover{color:var(--text-accent)}
.imp-c4-video-card{position:relative;overflow:hidden;box-sizing:border-box;width:100%;aspect-ratio:16/9;border-radius:16px;background:var(--module-bg);border:1px solid var(--card-border);box-shadow:var(--module-shadow);display:grid;place-items:center}
.imp-c4-video-card img.imp-c4-gfx-glass{position:absolute;top:-60px;right:-40px;width:200px;opacity:var(--gfx-fluid)}
.imp-c4-video-inner{position:relative;display:flex;flex-direction:column;align-items:center;gap:14px}
.imp-c4-video-play{width:64px;height:64px;border-radius:var(--radius-pill);background:var(--lime);display:grid;place-items:center}
.imp-c4-video-note{font:400 13px/1.4 var(--font-ui);color:var(--text-body)}
@media (min-width:1024px){
.imp-c4-video-card{max-width:820px}
.imp-c4-video-play{width:78px;height:78px}
}
.imp-c4-stat-bar{display:flex;align-items:stretch;padding:18px 20px;border-radius:18px;background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--card-border)}
.imp-c4-stat-cell{flex:1;display:flex;flex-direction:column;gap:5px}
.imp-c4-stat-cell + .imp-c4-stat-cell{padding-left:24px;border-left:1px solid var(--divider)}
.imp-c4-stat-cell:not(:last-child){padding-right:24px}
.imp-c4-stat-label{font:400 10px/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body)}
.imp-c4-stat-value{font:400 30px/1 var(--font-display);color:var(--text-heading)}
.imp-c4-stat-value--accent{color:var(--text-accent)}
.imp-c4-log-list{display:flex;flex-direction:column;gap:12px}
.imp-c4-log-card{padding:18px;border-radius:var(--radius-module);background:var(--module-bg);border:1px solid var(--card-border);border-top-color:var(--card-border-top);box-shadow:var(--card-shadow)}
.imp-c4-log-card--older{background:var(--card-bg-4);box-shadow:none}
.imp-c4-log-card--older .imp-c4-log-title,.imp-c4-log-card--older .imp-c4-log-metric-value,.imp-c4-log-card--older .imp-c4-log-tag{color:var(--text-body)}
.imp-c4-log-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:8px}
.imp-c4-log-tag{font:400 10px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-accent)}
.imp-c4-log-date{font:400 12px/1 var(--font-ui);color:var(--text-body)}
.imp-c4-log-title{font:600 14.5px/1.35 var(--font-ui);color:var(--text-heading)}
.imp-c4-log-metrics{display:flex;gap:20px;margin-top:14px}
.imp-c4-log-metric{display:flex;align-items:baseline;gap:7px}
.imp-c4-log-metric-value{font:400 24px/1 var(--font-display);color:var(--text-heading)}
.imp-c4-log-metric-label{font:400 11px/1 var(--font-ui);color:var(--text-body)}
.imp-c4-log-note{display:flex;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid var(--divider)}
.imp-c4-log-note svg{flex:none;margin-top:2px}
.imp-c4-log-note p{margin:0;font:400 12.5px/1.5 var(--font-ui);color:var(--text-body)}
@media (min-width:1024px){
.imp-c4-log-list{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-content:start}
}
.imp-c4-c-page{position:relative;z-index:1;padding:20px 20px 108px}
@media (min-width:1024px){
.imp-c4-c-page{height:100vh;box-sizing:border-box;padding:104px 140px 40px;display:flex;flex-direction:column}
.imp-c4-c-head{padding-top:22px;margin-bottom:26px}
.imp-c4-c-grid{flex:1;display:grid;grid-template-columns:1fr 300px;gap:22px;min-height:0}
.imp-c4-c-grid--wide-rail{grid-template-columns:1fr 320px}
.imp-c4-c-col{display:flex;flex-direction:column;gap:10px;align-content:start;min-width:0}
.imp-c4-c-rail{display:flex;flex-direction:column;gap:12px;min-width:0}
.imp-c4-c-rail-bottom{margin-top:auto;display:flex;flex-direction:column;gap:8px}
}
.imp-c4-card--rail{padding:18px 20px;border-radius:18px;background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--card-border);box-shadow:none}

/* ===== program.css -> prefiks .imp-c4 ===== */
.imp-c4-pr-glow-a{top:200px;right:-180px;width:440px;height:440px;background:var(--glow-violet)}
.imp-c4-pr-glow-b{bottom:-60px;left:-150px;width:400px;height:400px;background:var(--glow-lime)}
@media (min-width:1024px){
.imp-c4-pr-glow-a{top:-200px;right:-160px;width:680px;height:680px}
.imp-c4-pr-glow-b{bottom:-220px;left:-200px;width:700px;height:700px}
}
@media (max-width:1023px){
.imp-c4-module-card{padding:18px}
.imp-c4-module-row{flex-wrap:wrap;gap:16px;min-height:0}
.imp-c4-module-name{font:400 20px/1 var(--font-display);text-transform:uppercase}
.imp-c4-module-progress{width:100%;flex-direction:row-reverse;align-items:center;justify-content:space-between}
.imp-c4-module-progress-bar{width:auto;flex:1}
.imp-c4-module-cta{margin:16px 0 0;min-height:48px}
}

/* ===== modul-2.css -> prefiks .imp-c4 ===== */
.imp-c4-md-glow-a{top:-120px;right:-150px;width:460px;height:460px;background:var(--glow-violet)}
.imp-c4-md-glow-b{bottom:-140px;left:-130px;width:420px;height:420px;background:var(--glow-lime)}
.imp-c4-md-gfx-a{top:200px;left:-70px;width:330px}
.imp-c4-md-gfx-b{bottom:60px;right:-90px;width:300px}
@media (min-width:1024px){
.imp-c4-md-glow-a{top:-200px;right:-160px;width:680px;height:680px}
.imp-c4-md-glow-b{display:none}
.imp-c4-md-gfx-a{top:-150px;right:-130px;left:auto;width:560px}
.imp-c4-md-gfx-b{bottom:-190px;left:-140px;right:auto;width:460px}
}
.imp-c4-md-title-card{position:relative;overflow:hidden;box-sizing:border-box;min-height:104px;display:flex;flex-direction:column;justify-content:center;padding:16px 18px;border-radius:20px;background:var(--edge-bg);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--edge-border)}
.imp-c4-md-title-card img{position:absolute;top:-42px;right:-24px;width:104px;opacity:var(--gfx-glass);pointer-events:none}
.imp-c4-md-title-row{display:flex;align-items:baseline;gap:10px}
.imp-c4-md-title-num{flex:0 0 auto;font:400 40px/.8 var(--font-display);color:var(--text-accent);opacity:.7}
.imp-c4-md-title-name{font:400 22px/1 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-c4-md-stack{display:flex;flex-direction:column;gap:16px;margin-top:20px}
@media (min-width:1024px){
.imp-c4-md-stack{margin-top:0;gap:12px}
}

/* ===== historia.css -> prefiks .imp-c4 ===== */
.imp-c4-hs-glow{top:120px;right:-180px;width:420px;height:420px;background:var(--glow-violet)}
@media (min-width:1024px){
.imp-c4-hs-glow{top:-200px;right:-160px;width:680px;height:680px}
}

/* ---- PRZEKŁADY makieta -> żywa strona (Krok 2 instrukcji) ---------------- */

/* pasek gestów iPhone (dock w eksporcie już position:fixed) */
.imp-c4-dock{bottom:calc(12px + env(safe-area-inset-bottom))}
.imp-c4-c-page{padding-bottom:calc(108px + env(safe-area-inset-bottom))}

/* topbar sticky w przepływie + korekta górnego paddingu treści (104 -> 24;
   pasek zajmuje ~78px + 16px marginesu w przepływie) */
@media (min-width:1024px){
  .imp-c4-topbar{position:sticky;top:16px;margin:16px 24px 0;left:auto;right:auto}
  .imp-c4-c-page{padding-top:24px}
}

/* jeden ekran bez martwego scrolla (wzorzec z pulpitu): wrapper = flex
   kolumna 100dvh, treść flex:1. Historia dostaje --scroll: jej lista
   sesji rośnie bez ograniczeń i MA się przewijać.
   min-height zamiast height (2.09.2026): sztywna wysokość ucinała karty
   modułów bez możliwości przewinięcia na niższych oknach (MacBook 14"
   przy 100%) — gdy treść wyższa niż okno, strona rośnie i się przewija;
   gdy się mieści, wygląda jak dotąd. */
.imp-c4-page{min-height:100vh;min-height:100dvh;overflow:hidden;overflow:clip}
@media (min-width:1024px){
  .imp-c4-page:not(.imp-c4-page--scroll){display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}
  .imp-c4-page:not(.imp-c4-page--scroll) .imp-c4-c-page{height:auto;flex:1;min-height:0}
  .imp-c4-page--scroll .imp-c4-c-page{height:auto}
}

/* [hidden] vs display:flex komponentów */
.imp-c4 [hidden]{display:none}

/* ---- inline style z eksportu -> klasy (Krok 3 pkt 3) --------------------
   Komplet właściwości z style="" danego elementu; inline zostaje tylko
   przy jednorazowym pozycjonowaniu grafik dekoracyjnych. */

/* wspólne: prawa strona topbara + podpis */
.imp-c4-topbar-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.imp-c4-topbar-username{font:600 13px/1 var(--font-ui);color:var(--text-heading)}

/* hub: eyebrow nagłówka i pod-eyebrow pasków */
.imp-c4-eyebrow--head{color:var(--eyebrow-color);margin-bottom:10px}
.imp-c4-eyebrow--body{color:var(--text-body)}

/* hub: wiersz wariantu (mobile pod paskiem dni) */
.imp-c4-variant-inline{margin-top:18px;padding:0 2px}
.imp-c4-variant-inline-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:14px 0 0}
.imp-c4-variant-value{font:400 30px/1 var(--font-display);color:var(--text-accent)}
.imp-c4-variant-since{font:400 12px/1 var(--font-ui);color:var(--text-body)}
.imp-c4-variant-value--rail{font:400 34px/1 var(--font-display);color:var(--text-accent)}
.imp-c4-stat-label--gap{margin-bottom:12px}
.imp-c4-variant-row-rail{display:flex;align-items:baseline;gap:9px}

/* hub: kolumna kart od Startu do Mety */
.imp-c4-c-col--gap{margin-top:20px}
.imp-c4-daybar-count--rail{font-size:22px}
.imp-c4-daybar-count--modul{font-size:20px}

/* hub: mobilne linki słowne pod listą */
.imp-c4-mobile-links{margin-top:24px;display:flex;flex-direction:column;gap:8px}
.imp-c4-mobile-links--tight{margin-top:20px}

/* hub: grafiki fluid w tle (inline pozycje z eksportu — desktop only) */
.imp-c4-pr-fluid-a{top:-140px;right:-120px;width:680px;opacity:var(--gfx-fluid)}
.imp-c4-pr-fluid-b{bottom:-200px;left:-140px;width:600px;opacity:var(--gfx-fluid)}

/* moduł: rząd logo mobile */
.imp-c4-logo-row{display:flex;align-items:center;margin-bottom:26px}

/* moduł: szerokości symboli glass przy numerach kart huba */
.imp-c4-module-gfx{width:76px}
.imp-c4-module-gfx--01{width:65px}
.imp-c4-module-gfx--02{width:87px}

/* moduł: eyebrow nagłówka desktop */
.imp-c4-eyebrow--modul{color:var(--eyebrow-color);margin-bottom:12px}
.imp-c4-eyebrow--modul-card{color:var(--eyebrow-color);margin-bottom:8px}

/* Akcje-formularze (CSRF) nie mogą psuć układu kart */
.imp-c4 form{margin:0}

/* BRAK W EKSPORCIE: .c-col ma display:flex i gap dopiero od 1024px, więc na
   telefonie karty (Start, moduły, Meta) stykały się bez odstępu — zgłoszone
   przez właściciela ze zrzutu. Odstęp 12px, jak w listach kart Obszaru B na
   mobile. DO ZGŁOSZENIA Claude Design. */
@media (max-width:1023px){
  .imp-c4-c-col{display:flex;flex-direction:column;gap:12px}
}

/* ODSTĘPSTWO na życzenie właściciela (29.08, po klikaniu huba):
   1) prawa szyna zaczyna się RÓWNO z kartą Start w lewej kolumnie
      (lewa ma margin-top:20px z inline eksportu — szyna dostaje ten sam),
   2) wszystkie odstępy między kartami szyny = 8px, jak między chipami
      "Historia sesji"/"Testy" (eksport miał 12px między kartami).
   DO PRZENIESIENIA też do Claude Design. Kursor na kartach selekcyjnych:
   wskazują klikalność (selekcja), CTA to zwykłe linki. */
@media (min-width:1024px){
  /* szyna zaczyna się równo z kartą Start; jednakowe odstępy 8px także
     w dolnej grupie (eksport: 12px w szynie, margin-top:auto odpychał
     chipy na dół — stąd nierówne przerwy, które zgłosił właściciel) */
  /* NAPRAWA BŁĘDU EKSPORTU (potwierdzone na oryginalnym pliku): szyna ma
     klasę only-desktop z `display:block!important`, co bije `display:flex`
     z .c-rail — przez to gap nie działał i karty stykały się ze sobą.
     Przywracamy flex z wyższą specyficznością. DO ZGŁOSZENIA Claude Design. */
  .imp-c4-c-rail.imp-c4-only-desktop{display:flex!important;flex-direction:column}
  .imp-c4-c-rail{margin-top:20px;gap:8px}
  .imp-c4-c-rail-bottom{margin-top:0;gap:8px}
}
.imp-c4-module-card,.imp-c4-edge-card{cursor:pointer}

/* Karty Start/Meta: podpis ("wstęp + test") wyrównany do KOLUMNY TEKSTU
   kart modułów i wyśrodkowany w pionie z nazwą (eksport miał
   align-items:baseline + gap:10px, przez co podpis siadał nisko i zaczynał
   się zaraz za nazwą). Szerokość pierwszej kolumny = numer modułu (52px)
   + odstęp wiersza modułu, więc podpis startuje dokładnie tam, co nazwa
   modułu. Życzenie właściciela po klikaniu — do przeniesienia w Claude Design. */
.imp-c4-edge-head{display:grid;grid-template-columns:68px 1fr;align-items:center;gap:0}
@media (min-width:1024px){
  .imp-c4-edge-head{grid-template-columns:74px 1fr}
}

/* ==========================================================================
   WIDOK MODUŁU — eksport C11/C12 (29 sierpnia 2026, 22:11)
   Instrukcja: docs/instrukcja-importu-widokow.md

   Źródło: HTML DO WDROŻENIA/eksport-C11-C12/ (tokens.css + components.css
   + blok <style> z modul-2.html). SAMODZIELNY, przeprojektowany zestaw:
   własny system tokenów (--glass-pad, --day-*, --variant-*, --daybar-*,
   --stat-value-size...), inne komponenty niż wcześniejszy Obszar C.
   Dlatego OSOBNY prefiks `.imp-c11` — hub i historia zostają na `.imp-c4`,
   moduł przechodzi tutaj. Tokeny kompletne, fonty z fallbackiem, brak wady
   only-* (tych klas w ogóle nie ma).

   CAŁOŚĆ PONIŻEJ (do bloku PRZEKŁADY) TO MASZYNOWA KOPIA:
       python3 narzedzia/prefiksuj-eksport.py c11 <tokens> <components> <style>
   ========================================================================== */
/* ===== tokens.css -> prefiks .imp-c11 ===== */
.imp-c11{--ink-rgb:28,28,30;
  --paper-rgb:251,251,251;
  --violet-rgb:112,0,255;
  --lime-rgb:203,255,0;

  --ink:#1C1C1E;
  --paper:#FBFBFB;
  --violet:#7000FF;
  --violet-hover:#5800CC;
  --lime:#CBFF00;

  --font-ui:'Inter',system-ui,sans-serif;
  --font-display:'VT323',monospace;
  --font-hand:'Caveat',cursive;
  --tracking-eyebrow:.16em;

  --radius-card:24px;
  --card-padding:24px 22px;
  --input-height:48px;
  --input-radius:16px;
  --radius-btn:16px;
  --input-padding-x:16px;
  --input-font-size:14px;
  --form-gap:16px;
  --btn-height:52px;
  --btn-font-size:16px;
  --btn-border:2px solid transparent;
  --radius-pill:999px;
  --radius-checkbox:7px;
  --eyebrow-size:10px;
  --title-card-size:38px;
  --title-hero-size:78px;
  --hand-size:18px;
  --logo-size:44px;
  --avatar-size:64px;
  --name-size:34px;

  
  --day-chip:44px;
  --radius-module:20px;
  --radius-chip:16px;
  --module-num-size:40px;
  --variant-name-size:22px;

  

  
  --bg:#1C1C1E;
  --text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --text-accent:#B98CFF;          
  --eyebrow-color:var(--lime);    
  --card-border:rgba(var(--paper-rgb),.15);
  --card-border-top:rgba(255,255,255,.5);
  --card-bg:rgba(var(--ink-rgb),.45);
  --card-blur:44px;
  --card-saturate:1.9;
  --card-shadow:0 24px 64px rgba(0,0,0,.4),0 8px 24px rgba(var(--violet-rgb),.22);

  
  --card-bg-1:rgba(var(--ink-rgb),.45);   --card-blur-1:48px; --card-saturate-1:2;
  --card-bg-2:rgba(var(--ink-rgb),.45);   --card-blur-2:48px; --card-saturate-2:2;
  --card-bg-3:rgba(var(--paper-rgb),.05);
  --card-bg-4:rgba(var(--paper-rgb),.04);
  --glass-border:rgba(255,255,255,.18);
  --glass-border-top:rgba(255,255,255,.55);
  --shadow-glass:0 24px 64px rgba(0,0,0,.35),0 8px 24px rgba(var(--violet-rgb),.25),inset 0 1px 0 rgba(255,255,255,.5);
  --ring-track:rgba(var(--paper-rgb),.14);
  --divider:rgba(var(--paper-rgb),.12);
  --input-bg:rgba(var(--paper-rgb),.06);
  --input-border:rgba(var(--paper-rgb),.24);
  --btn-outline-border:rgba(var(--paper-rgb),.3);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.58;
  --gfx-fluid:.42;
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.45),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.14),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#242427;}
:root[data-theme="light"] .imp-c11{--bg:#FBFBFB;
  --text-heading:#1C1C1E;
  --text-body:#6B6870;
  --text-meta:#9A97A0;
  --text-accent:#7000FF;          
  --eyebrow-color:var(--violet);  
  --card-border:rgba(var(--ink-rgb),.1);
  --card-border-top:rgba(255,255,255,.95);
  --card-bg:rgba(255,255,255,.45);
  --card-blur:19px;
  --card-saturate:1.4;
  --card-shadow:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);

  
  --card-bg-1:rgba(var(--paper-rgb),.45); --card-blur-1:22px; --card-saturate-1:1.6;
  --card-bg-2:rgba(var(--paper-rgb),.45); --card-blur-2:22px; --card-saturate-2:1.5;
  --card-bg-3:rgba(255,255,255,.55);
  --card-bg-4:rgba(var(--ink-rgb),.02);
  --glass-border:rgba(255,255,255,.5);
  --glass-border-top:rgba(255,255,255,.8);
  --shadow-glass:0 24px 64px rgba(var(--ink-rgb),.18),0 8px 24px rgba(var(--violet-rgb),.22),inset 0 1px 0 rgba(255,255,255,.7);
  --ring-track:rgba(var(--ink-rgb),.1);
  --divider:rgba(var(--ink-rgb),.07);
  --input-bg:#fff;
  --input-border:rgba(var(--ink-rgb),.14);
  --btn-outline-border:rgba(var(--ink-rgb),.16);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.42;
  --gfx-fluid:.14;
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.08),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.1),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#F1EEF7;}
.imp-c11-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
:root[data-theme="light"] .imp-c11-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
@media (min-width:1024px){
.imp-c11{--radius-card:26px;
    --card-padding:34px 32px;
    --input-height:50px;
    --input-padding-x:18px;
    --input-font-size:15px;
    --form-gap:18px;
    --btn-height:54px;
    --title-card-size:42px;
    --title-hero-size:88px;
    --hand-size:26px;
    --logo-size:56px;
    --avatar-size:88px;
    --name-size:56px;
    --day-chip:36px;
    --radius-module:18px;}
:root[data-theme="light"] .imp-c11{--shadow-glass:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);}
}
@media (prefers-reduced-motion: reduce){
:where(.imp-c11), :where(.imp-c11) *{transition:none !important; animation:none !important;}
}
@media (prefers-reduced-transparency: reduce){
.imp-c11{--card-bg:var(--glass-fallback-bg);
    --card-blur:0px;
    --card-saturate:1;}
.imp-c11-card{backdrop-filter:none; -webkit-backdrop-filter:none;}
}
.imp-c11{--day-done-bg:var(--violet);         --day-done-fg:var(--paper);
  --day-sel-bg:var(--lime);            --day-sel-fg:var(--ink);
  --day-sel-ring:0 0 0 4px rgba(var(--lime-rgb),.22);
  --day-off-bg:rgba(var(--paper-rgb),.06);
  --day-off-border:rgba(var(--paper-rgb),.16);
  --day-off-fg:var(--text-meta);
  --module-bg:#272729;
  --module-shadow:0 6px 18px rgba(var(--ink-rgb),.05);
  --module-on-bg:var(--violet);
  --module-on-shadow:0 16px 40px rgba(var(--violet-rgb),.35);
  --status-done-bg:rgba(var(--lime-rgb),.18);  --status-done-fg:var(--lime);
  --status-now-bg:rgba(185,140,255,.22);       --status-now-fg:#B98CFF;
  --status-next-bg:rgba(var(--paper-rgb),.1);  --status-next-fg:var(--text-body);
  --edge-bg:rgba(185,140,255,.07);   --edge-border:rgba(185,140,255,.32);
  --edge-on-bg:rgba(185,140,255,.16);--edge-on-border:#B98CFF;
  --day-progress:#B98CFF;            
  --danger:#FF8A80; --danger-fg:var(--ink);
  --danger-bg:rgba(227,28,65,.12); --danger-border:rgba(255,107,107,.4);}
:root[data-theme="light"] .imp-c11{--day-off-bg:rgba(var(--ink-rgb),.05);
  --day-off-border:rgba(var(--ink-rgb),.12);
  --day-off-fg:#8B8792;
  --day-sel-ring:0 0 0 4px #F1E5FF;
  --module-bg:#FFFFFF;
  --module-shadow:0 6px 18px rgba(var(--ink-rgb),.06);
  --module-on-shadow:0 16px 40px rgba(var(--violet-rgb),.22);
  --status-done-bg:rgba(var(--lime-rgb),.3);   --status-done-fg:#3F4A00;
  --status-now-bg:rgba(var(--violet-rgb),.1);  --status-now-fg:var(--violet);
  --status-next-bg:rgba(var(--ink-rgb),.05);   --status-next-fg:var(--text-body);
  --edge-bg:rgba(var(--violet-rgb),.04);   --edge-border:rgba(var(--violet-rgb),.28);
  --edge-on-bg:rgba(var(--violet-rgb),.09);--edge-on-border:var(--violet);
  --danger:#B03A2E; --danger-fg:var(--paper);
  --danger-bg:rgba(227,28,65,.06); --danger-border:rgba(227,28,65,.28);}
.imp-c11{--radius-glass:18px;      
  --radius-session:20px;    
  --radius-video:16px;
  --radius-variant:15px;
  --radius-nav-item:14px;
  --radius-topbar:20px;
  --variant-height:46px;
  --start-height:50px;
  --daybar-seg:7px;
  --daybar-gap:5px;
  --video-max:820px;
  --title-view-size:54px;
  --stat-value-size:30px;
  --variant-title-size:21px;
  --glass-pad:18px 20px;
  --session-pad:20px 22px;}

/* ===== components.css -> prefiks .imp-c11 ===== */
:where(.imp-c11), :where(.imp-c11) *{box-sizing:border-box}
.imp-c11{margin:0;padding:0}
.imp-c11{display:block;background:var(--bg);font-family:var(--font-ui);color:var(--text-body);-webkit-font-smoothing:antialiased}
:where(.imp-c11) a{color:var(--text-accent);text-decoration:none}
:where(.imp-c11) a:hover{color:var(--violet-hover)}
:where(.imp-c11) button{font-family:inherit;border:none;background:none;padding:0;cursor:pointer}
:where(.imp-c11) img{max-width:100%}
.imp-c11-page{position:relative;display:block;overflow:hidden;min-height:100vh;background:var(--bg);isolation:isolate}
.imp-c11-glow{position:absolute;pointer-events:none;border-radius:50%;z-index:0}
.imp-c11-gfx-glass{position:absolute;pointer-events:none;opacity:var(--gfx-glass);z-index:0}
.imp-c11-logo{flex:none;width:var(--logo-size);height:var(--logo-size);object-fit:contain;display:block}
.imp-c11-logo--light{display:none}
:root[data-theme="light"] .imp-c11-logo--dark{display:none}
:root[data-theme="light"] .imp-c11-logo--light{display:block}
.imp-c11-topbar{display:none}
.imp-c11-topbar-logo{flex:none;display:flex;align-items:center;gap:11px}
.imp-c11-topbar-nav{display:flex;gap:4px}
.imp-c11-nav-item{min-height:44px;display:flex;align-items:center;gap:9px;padding:0 16px;border-radius:var(--radius-nav-item);color:var(--text-body);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-c11-nav-item:hover{color:var(--text-accent)}
.imp-c11-nav-item span{font:600 13px/1 var(--font-ui)}
.imp-c11-nav-item--active{background:var(--lime);color:var(--ink)}
.imp-c11-nav-item--active:hover{color:var(--ink)}
.imp-c11-topbar-end{margin-left:auto;display:flex;align-items:center;gap:8px}
.imp-c11-c-view{position:relative;z-index:1;display:flex;flex-direction:column}
.imp-c11-c-head{display:block}
.imp-c11-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color)}
.imp-c11-view-title{margin:0;font:400 var(--title-view-size)/.9 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-c11-c-grid{display:grid;min-height:0}
.imp-c11-c-col{display:flex;flex-direction:column;min-width:0;min-height:0}
.imp-c11-c-rail{display:flex;flex-direction:column;min-width:0;min-height:0}
.imp-c11-video-frame{display:flex}
.imp-c11-video-card{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:var(--radius-video);background:var(--module-bg);border:1px solid var(--card-border);box-shadow:var(--module-shadow)}
.imp-c11-video-card .imp-c11-gfx-glass{position:absolute;top:-60px;right:-40px;width:200px;opacity:var(--gfx-fluid)}
.imp-c11-video-inner{position:relative;display:flex;flex-direction:column;align-items:center;gap:14px}
.imp-c11-video-play{display:grid;place-items:center;width:78px;height:78px;border-radius:var(--radius-pill);background:var(--lime)}
.imp-c11-video-note{max-width:520px;text-align:center;font:400 13px/1.4 var(--font-ui);color:var(--text-body)}
.imp-c11-video-spec{position:absolute;bottom:12px;right:14px;font:600 9.5px/1 var(--font-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--text-meta)}
.imp-c11-stat-bar{display:flex;align-items:stretch;padding:var(--glass-pad);border-radius:var(--radius-glass);background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--card-border)}
.imp-c11-stat-cell{flex:1;min-width:0;overflow:hidden;display:flex;flex-direction:column;gap:5px;padding-right:24px}
.imp-c11-stat-cell + .imp-c11-stat-cell{padding-left:24px;border-left:1px solid var(--divider)}
.imp-c11-stat-cell:last-child{padding-right:0}
.imp-c11-stat-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-c11-stat-value{font:400 var(--stat-value-size)/1 var(--font-display);color:var(--text-heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-c11-stat-value--accent{color:var(--text-accent)}
.imp-c11-chip-links{display:flex;flex-direction:column;gap:8px}
.imp-c11-chip-links--row{flex-direction:row}
.imp-c11-chip-link{flex:1;min-width:0;min-height:44px;display:flex;align-items:center;gap:7px;padding:0 16px;border-radius:var(--radius-chip);border:1px solid var(--btn-outline-border);font:500 13px/1 var(--font-ui);color:var(--btn-outline-text);text-decoration:none;transition:background 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-c11-chip-link:hover{background:rgba(var(--paper-rgb),.08);border-color:var(--text-accent)}
:root[data-theme="light"] .imp-c11-chip-link:hover{background:rgba(var(--ink-rgb),.05)}
.imp-c11-chip-link span{margin-left:auto;color:var(--text-accent)}
.imp-c11-card--rail{display:block;padding:var(--glass-pad);border-radius:var(--radius-glass);background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--card-border)}
.imp-c11-daybar-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px}
.imp-c11-daybar-count{flex:0 1 auto;min-width:0;font:400 20px/1 var(--font-display);color:var(--day-progress);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-c11-daybar{display:flex;gap:var(--daybar-gap)}
.imp-c11-daybar-seg{flex:1;min-width:0;height:var(--daybar-seg);border-radius:var(--radius-pill);background:var(--ring-track)}
.imp-c11-daybar-seg--done{background:var(--day-progress)}
.imp-c11-session-card{display:block;padding:var(--session-pad);border-radius:var(--radius-session);background:var(--module-bg);border:1px solid var(--card-border);box-shadow:var(--module-shadow)}
.imp-c11-session-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.imp-c11-session-legend{flex:1;min-width:0;text-align:right;font:400 11px/1 var(--font-ui);color:var(--text-meta);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-c11-session-rule{height:1px;background:var(--divider);margin:16px 0 14px}
.imp-c11-session-label{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body);margin-bottom:12px}
.imp-c11-day-chips{display:flex;gap:8px}
.imp-c11-day-chip{flex:none;width:var(--day-chip);height:var(--day-chip);display:grid;place-items:center;border-radius:var(--radius-pill);border:2px solid var(--day-off-border);background:var(--day-off-bg);color:var(--day-off-fg);font:600 12px/1 var(--font-ui);transition:transform 120ms cubic-bezier(.4,0,.2,1)}
.imp-c11-day-chip:hover{transform:translateY(-2px)}
.imp-c11-day-chip--done{background:var(--day-done-bg);border-color:var(--day-done-bg);color:var(--day-done-fg)}
.imp-c11-day-chip--selected{background:var(--day-sel-bg);border-color:var(--day-sel-bg);color:var(--day-sel-fg);box-shadow:var(--day-sel-ring)}
.imp-c11-variants{display:flex;flex-direction:column;gap:8px}
.imp-c11-variant{display:flex;align-items:center;gap:12px;width:100%;min-height:var(--variant-height);padding:11px 15px;overflow:hidden;border-radius:var(--radius-variant);border:1px solid var(--card-border);background:var(--input-bg);text-align:left;transition:transform 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-c11-variant:hover{transform:translateY(-2px)}
.imp-c11-variant-name{flex:none;font:400 var(--variant-title-size)/1 var(--font-display);color:var(--text-heading)}
.imp-c11-variant-desc{flex:1;min-width:0;font:400 12.5px/1.35 var(--font-ui);color:var(--text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-c11-variant-time{flex:none;font:600 13px/1 var(--font-ui);color:var(--text-heading);white-space:nowrap}
.imp-c11-variant--selected{background:var(--violet);border-color:var(--violet)}
.imp-c11-variant--selected .imp-c11-variant-name,.imp-c11-variant--selected .imp-c11-variant-time{color:var(--paper)}
.imp-c11-variant--selected .imp-c11-variant-desc{color:#E4DDF7}
.imp-c11-btn-start{display:flex;align-items:center;justify-content:center;gap:10px;min-height:var(--start-height);border-radius:var(--radius-nav-item);background:var(--lime);border:var(--btn-border);color:var(--ink);font:600 15px/1 var(--font-ui);text-decoration:none;transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-c11-btn-start:hover{background:var(--violet);color:var(--paper);border-color:var(--lime)}
@media (min-width:1024px){
.imp-c11-video-frame{flex:1;min-height:0;align-items:flex-start}
.imp-c11-video-card{max-height:100%}
.imp-c11-topbar{position:absolute;top:16px;left:24px;right:24px;z-index:3;display:flex;align-items:center;gap:24px;padding:10px 14px 10px 18px;border-radius:var(--radius-topbar);background:var(--card-bg-2);backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));-webkit-backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
}

/* ===== c11-modul.css -> prefiks .imp-c11 ===== */
.imp-c11-md-glow{top:-120px;right:-160px;width:460px;height:460px;background:var(--glow-violet)}
.imp-c11-md-gfx-tr{top:-90px;right:-110px;width:300px}
.imp-c11-md-gfx-bl{display:none}
.imp-c11-c-view{padding:24px 20px 40px;gap:20px}
.imp-c11-c-head{margin-bottom:2px}
.imp-c11-eyebrow{margin-bottom:10px}
.imp-c11-c-grid{grid-template-columns:1fr;gap:16px}
.imp-c11-c-col{gap:12px}
.imp-c11-c-rail{gap:12px}
.imp-c11-btn-start{margin-top:14px}
@media (min-width:1024px){
.imp-c11-md-glow{top:-200px;right:-160px;width:680px;height:680px}
.imp-c11-md-gfx-tr{top:-150px;right:-130px;width:560px}
.imp-c11-md-gfx-bl{display:block;bottom:-190px;left:-140px;width:460px}
.imp-c11-c-view{height:100vh;min-height:900px;padding:104px 140px 40px;gap:0}
.imp-c11-c-head{margin-bottom:26px}
.imp-c11-eyebrow{margin-bottom:12px}
.imp-c11-c-grid{flex:1;grid-template-columns:1fr 320px;gap:22px}
}

/* ---- PRZEKŁADY makieta -> żywa strona (Krok 2 instrukcji) ---------------- */

/* Ekran modułu nie ma dolnej nawigacji ani belki na telefonie — i tak ma
   zostać. Decyzja właściciela z 29 sierpnia 2026: wewnątrz modułu i w trakcie
   sesji pasek rozpraszałby. Wyjście dają linki "Historia / Testy / Wszystkie
   moduły" w treści. Dolny padding bez rezerwy na dok, z paskiem gestów. */
.imp-c11-c-view{padding-bottom:calc(40px + env(safe-area-inset-bottom))}

/* topbar sticky zamiast absolute (zostaje widoczny przy przewijaniu —
   ta sama decyzja co w pozostałych obszarach) + korekta górnego paddingu */
@media (min-width:1024px){
  .imp-c11-topbar{position:sticky;top:16px;margin:16px 24px 0;left:auto;right:auto}
  .imp-c11-c-view{padding-top:24px}
}

/* 100dvh + overflow:clip, oba z fallbackiem (skaczący pasek adresu w Safari,
   clip nie tworzy kontenera przewijania — sticky działa) */
.imp-c11-page{min-height:100vh;min-height:100dvh;overflow:hidden;overflow:clip}

/* [hidden] vs display:flex komponentów */
.imp-c11 [hidden]{display:none}

/* ---- inline style z eksportu -> klasy (Krok 3 pkt 3) ---------------------
   Eksport nie ma inline style w treści widoku — grafiki i geometria siedzą
   w klasach (md-gfx-tr, md-gfx-bl, md-glow). Nic do przeniesienia. */

/* Dzień i wariant to w eksporcie <button>; u nas dzień jest linkiem
   (?dzien=X, działa bez JS), więc <a> musi wyglądać identycznie. */
a.imp-c11-day-chip{text-decoration:none}
a.imp-c11-btn-start{text-decoration:none}

/* ---- poprawki po klikaniu właściciela (29 sierpnia 2026, 22:38) ---------
   Zmiany układu, nie przepisanie eksportu — wartości nadal z tokenów. */

/* Panel dnia: kontener przełączany bez przeładowania. W eksporcie nie ma
   go wcale (makieta pokazywała jeden dzień), więc jest tu, a nie w kopii CSS. */
.imp-c11-day-panel{display:block}

@media (max-width:1023.98px){
  /* Kolejność na telefonie: film -> wybór dnia i wariantu -> statystyki ->
     linki. display:contents rozpuszcza obie kolumny w siatce, dzięki czemu
     order działa w poprzek nich. Pasek „rozpykane sesje" na telefonie
     schowany (właściciel, 1.09.2026) — karta wyboru sesji idzie wyżej,
     a przycisk startu bliżej kciuka; na desktopie pasek zostaje. */
  .imp-c11-c-grid{gap:12px}
  .imp-c11-c-col,.imp-c11-c-rail{display:contents}
  .imp-c11-video-frame{order:1}
  .imp-c11-card--rail{display:none}
  .imp-c11-session-card{order:3}
  .imp-c11-stat-bar{order:4}
  .imp-c11-chip-links{order:5}

  /* Etykiety statystyk łamią się na dwie linie zamiast urywać wielokropkiem —
     na telefonie komórka ma około 90px i „ukończone sesje" się nie mieści. */
  .imp-c11-stat-cell{padding-right:12px}
  .imp-c11-stat-cell + .imp-c11-stat-cell{padding-left:12px}
  .imp-c11-stat-label{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.3}
}

@media (min-width:1024px){
  /* Ramka wideo nie rozpycha lewej kolumny: statystyki siadają tuż pod
     filmem, z tym samym odstępem co karty w prawej szynie. */
  .imp-c11-video-frame{flex:none}
  /* Linki trafiły do prawej szyny (320px) — układają się w kolumnę,
     czyli w bazowy wariant komponentu, nie w rząd. */
  .imp-c11-chip-links--row{flex-direction:column}
}

/* Martwe przewijanie na desktopie (~90px): eksport ma belkę position:absolute
   NAD treścią, a u nas jest sticky, więc jej wysokość dochodzi do 100vh
   ekranu treści. Zamiast sztywnego 100vh + min-height:900px — kolumna, w
   której treść bierze resztę wysokości. Ten sam błąd naprawialiśmy wcześniej
   na pulpicie. */
@media (min-width:1024px){
  .imp-c11-page{display:flex;flex-direction:column}
  .imp-c11-c-view{height:auto;min-height:0;flex:1}
}

/* ===================================================================
   SYSTEM STATUSÓW SESJI + RESET MODUŁU/PROGRAMU (30.08.2026) — ręczny
   blok przekładów, nie z eksportu. Decyzje właściciela z tej sesji:
   kolory kółeczek sesji (rozpykana = limonka, warto powtórzyć = fiolet,
   koniecznie powtórz = czerwona obwódka), mała legenda kolorów,
   przyciski resetu jako przezroczyste z czerwoną obwódką. Wybrane
   kółeczko pokazuje zaznaczenie pierścieniem, a tło zostawia kolorowi
   statusu (odstępstwo od eksportu, gdzie zaznaczenie wypełniało chip
   limonką — limonka jest teraz kolorem statusu "rozpykana").
   DO PRZENIESIENIA do Claude Design przy okazji nowych eksportów C.
   =================================================================== */
.imp-c11-day-chip--selected{background:var(--day-off-bg);border-color:var(--day-off-border);color:var(--day-off-fg);box-shadow:var(--day-sel-ring)}
.imp-c11-day-chip--done{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.imp-c11-day-chip--warto{background:var(--violet);border-color:var(--violet);color:var(--paper)}
.imp-c11-day-chip--koniecznie{background:transparent;border-color:var(--danger);color:var(--danger)}
/* Czwarty stan „w trakcie" (mechanizm sesji, 30.08.2026): sesja
   rozpoczęta i niepotwierdzona — pauza zamiast litery. Limonkowa
   OBWÓDKA celowo rymuje się z limonkowym WYPEŁNIENIEM „rozpykanej":
   zaczęta droga do tego samego koloru. DO PRZENIESIENIA do Claude
   Design razem z resztą tej sekcji. */
.imp-c11-day-chip--wtrakcie{background:transparent;border-color:var(--lime);color:var(--lime)}

.imp-c11-status-legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px}
.imp-c11-status-legend-item{display:inline-flex;align-items:center;gap:6px;font:500 11px/1.3 var(--font-ui);color:var(--text-meta)}
.imp-c11-status-dot{width:10px;height:10px;border-radius:50%;flex:none}
.imp-c11-status-dot--done{background:var(--lime)}
.imp-c11-status-dot--warto{background:var(--violet)}
.imp-c11-status-dot--koniecznie{background:transparent;border:2px solid var(--danger)}
.imp-c11-status-dot--wtrakcie{background:transparent;border:2px solid var(--lime)}

/* Przycisk resetu — przezroczysty, czerwona obwódka; ten sam wygląd na
   hubie (program) i w widoku modułu. min-height 44px = --touch-target. */
.imp-c4-btn-reset,
.imp-c11-btn-reset{display:flex;width:100%;align-items:center;justify-content:center;min-height:44px;padding:0 16px;border-radius:16px;border:1px solid var(--danger-border);background:transparent;color:var(--danger);font:600 12.5px/1 var(--font-ui);cursor:pointer;transition:background 150ms cubic-bezier(.4,0,.2,1)}
.imp-c4-btn-reset:hover,
.imp-c11-btn-reset:hover{background:var(--danger-bg)}

/* Karta potwierdzenia resetu modułu — lustrzana wobec .imp-c4-confirm-* */
.imp-c11-reset-wrap{display:flex;flex-direction:column}
.imp-c11-confirm-card{display:none;flex-direction:column;padding:16px;border-radius:16px;background:var(--danger-bg);border:1px solid var(--danger-border);margin-top:12px}
.imp-c11-confirm-card.imp-c11-is-open{display:flex}
.imp-c11-confirm-title{font:600 13px/1.4 var(--font-ui);color:var(--text-body);margin-bottom:6px}
.imp-c11-confirm-card p{margin:0 0 14px;font:400 12px/1.5 var(--font-ui);color:var(--text-body)}
.imp-c11-confirm-actions{display:flex;gap:8px}
.imp-c11-btn-danger{flex:1;min-height:44px;display:flex;align-items:center;justify-content:center;border-radius:13px;background:var(--danger);color:var(--danger-fg);font:600 12.5px/1 var(--font-ui);cursor:pointer;border:none;transition:opacity 150ms cubic-bezier(.4,0,.2,1)}
.imp-c11-btn-danger:hover{opacity:.85}
.imp-c11-btn-ghost{flex:0 0 auto;min-height:44px;display:flex;align-items:center;justify-content:center;padding:0 16px;border-radius:13px;border:1px solid var(--divider);background:transparent;color:var(--text-body);font:600 12.5px/1 var(--font-ui);cursor:pointer;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-c11-btn-ghost:hover{color:var(--text-accent)}

/* Kolejność na telefonie: kolumny są rozpuszczone (display:contents),
   elementy bez `order` wskoczyłyby na początek — reset idzie na koniec. */
@media (max-width:1023px){
  .imp-c11-reset-wrap{order:6}
}

/* ===================================================================
   POPRAWKI PO KLIKANIU WŁAŚCICIELA (30.08.2026) — ręczny blok.
   1. Czytelność hoverów: eksporty mają regułę
      :where(.imp-X) a:hover{color:var(--violet-hover)}, która maluje na
      fioletowo KAŻDY link w obszarze — chipy sesji i przyciski typu
      "Historia sesji" stawały się nieczytelne. Reguły niżej mają wyższą
      specyficzność (dwie klasy) i przywracają właściwy kolor tekstu.
   2. Subtelny hover na dzwonku i przycisku konta w górnej belce.
   3. "Wyloguj się" na koncie w tej samej czerwieni co przyciski resetu
      (tokeny --danger; wcześniej ciemny #B03A2E także na ciemnym tle).
   DO PRZENIESIENIA do Claude Design przy okazji nowych eksportów.
   =================================================================== */

/* 1a. Przyciski-linki (Historia sesji / Wszystkie moduły / Testy). */
.imp-c4-chip-link:hover{color:var(--text-heading)}
.imp-c11-chip-link:hover{color:var(--btn-outline-text)}

/* 1b. Kółeczka sesji A-F: hover nie zmienia koloru litery (kolor należy
   do statusu). Kolejność luster tej samej co stany wyżej — status
   wygrywa z zaznaczeniem. */
.imp-c11-day-chip:hover{color:var(--day-off-fg)}
.imp-c11-day-chip--selected:hover{color:var(--day-off-fg)}
.imp-c11-day-chip--done:hover{color:var(--ink)}
.imp-c11-day-chip--warto:hover{color:var(--paper)}
.imp-c11-day-chip--koniecznie:hover{color:var(--danger)}
.imp-c11-day-chip--wtrakcie:hover{color:var(--lime)}

/* 2. Górna belka: delikatny hover dzwonka (teraz link do /wiadomosci)
   i przycisku konta; ikona nie fioletowieje od a:hover. */
.imp-b4-topbar-icon-btn,
.imp-c4-topbar-icon-btn,
.imp-b4-topbar-user,
.imp-c4-topbar-user{transition:background 150ms cubic-bezier(.4,0,.2,1)}
.imp-b4-topbar-icon-btn:hover,
.imp-c4-topbar-icon-btn:hover{background:rgba(var(--paper-rgb),.12);color:var(--text-heading)}
.imp-b4-topbar-user:hover,
.imp-c4-topbar-user:hover{background:rgba(var(--paper-rgb),.12)}
:root[data-theme="light"] .imp-b4-topbar-icon-btn:hover,
:root[data-theme="light"] .imp-c4-topbar-icon-btn:hover{background:rgba(var(--ink-rgb),.07);color:var(--text-heading)}
:root[data-theme="light"] .imp-b4-topbar-user:hover,
:root[data-theme="light"] .imp-c4-topbar-user:hover{background:rgba(var(--ink-rgb),.07)}

/* 3. Tokeny danger w obszarze B4 (brakowało ich — miały je tylko C4
   i C11) + "Wyloguj się" w tej samej czerwieni co przyciski resetu. */
.imp-b4{--danger:#FF8A80; --danger-bg:rgba(227,28,65,.12); --danger-border:rgba(255,107,107,.45)}
:root[data-theme="light"] .imp-b4{--danger:#B03A2E; --danger-bg:rgba(227,28,65,.06); --danger-border:rgba(227,28,65,.28)}
.imp-b4-btn-danger-outline{color:var(--danger);border-color:var(--danger-border);background:transparent}
.imp-b4-btn-danger-outline:hover{background:var(--danger-bg)}
:root[data-theme="light"] .imp-b4-btn-danger-outline{color:var(--danger);background:transparent}
:root[data-theme="light"] .imp-b4-btn-danger-outline:hover{background:var(--danger-bg)}

/* ===================================================================
   PRZYCISK CTA NA KARTACH MODUŁÓW — wybrany wariant (30.08.2026)
   Właściciel: przycisk na całą szerokość był za duży i zbyt dominujący.
   Po porównaniu trzech układów wybrany wariant C — przycisk kompaktowy,
   wyrównany do LEWEJ i wcięty do kolumny tekstu (74px = szerokość
   numeru 52px + odstęp 22px), więc startuje dokładnie pod nazwą modułu.
   Rozszerzanie się karty po zaznaczeniu zostaje BEZ ZMIAN — właściciel
   wprost o to poprosił, to zamierzony efekt.
   Zmiana dotyczy wyłącznie samego przycisku (rozmiar i pozycja); kolor,
   treść i hover jak dotąd. Tylko desktop — na telefonie przycisk
   zostaje pełnej szerokości, bo tam jest wygodny pod kciuk.
   DO PRZENIESIENIA do Claude Design przy okazji nowych eksportów C.
   =================================================================== */
@media (min-width:1024px){
  .imp-c4-module-cta{align-self:flex-start;width:auto;min-width:210px;margin:0 0 16px 74px;padding:0 26px;min-height:40px}
}

/* ===================================================================
   STATYSTYKI PROGRAMU W SZYNIE HUBA (30.08.2026, prośba właściciela)
   Te same trzy liczby co na karcie programu na pulpicie, na dole
   drugiej kolumny, pod przyciskiem resetu. Ramka i typografia jak
   w sąsiednich kartach szyny (.imp-c4-card--rail), żeby to był
   element interfejsu, a nie luźny napis.
   Układ wierszowy (etykieta z lewej, wartość z prawej) zamiast trzech
   kolumn: szyna ma ~320px, więc „12 godz. 34 min" w jednej trzeciej
   tej szerokości urywałoby się wielokropkiem. To ten sam wzorzec, co
   wiersz wariantu na mobile (.imp-c4-variant-inline-row).
   DO PRZENIESIENIA do Claude Design przy okazji nowych eksportów C.
   =================================================================== */
.imp-c4-stats-card{display:flex;flex-direction:column}
.imp-c4-stat-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:10px 0}
.imp-c4-stat-row:first-child{padding-top:0}
.imp-c4-stat-row:last-child{padding-bottom:0}
.imp-c4-stat-row + .imp-c4-stat-row{border-top:1px solid var(--divider)}
.imp-c4-stat-row .imp-c4-stat-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-c4-stat-row-value{flex:0 0 auto;font:400 26px/1 var(--font-display);color:var(--text-heading)}
.imp-c4-stat-row-value--accent{color:var(--text-accent)}

/* ===================================================================
   OBSZAR Z — PWA install (import drogą 4, 30 sierpnia 2026)
   Źródło: HTML DO WDROŻENIA/Obszar Z - PWA install/
   (pwa-ios.html, pwa-android.html, tokens.css, components.css)

   ZAKRES: components.css eksportu to pełna wspólna biblioteka Obszaru A
   (146 reguł), z czego PWA dotyczy 30. Reszta to czwarta kopia kart,
   doków i pierścieni, już obecnych jako .imp-a/.imp-b4/.imp-c4/.imp-c11.
   Przez skrypt przepuszczone WYŁĄCZNIE: blok "Obszar Z" (linie 175-koniec)
   plus jego zależności (.logo, .eyebrow, .btn-primary) i całe tokens.css.
   Wycinek zrobiony mechanicznie (sed po numerach linii), nie przepisany
   ręcznie — zasada drogi 4 zachowana. Odstępstwo od litery instrukcji
   ("wklej całość jako jedną sekcję") opisane w docs/STATUS.md.
   =================================================================== */
/* ===== tokens.css -> prefiks .imp-z ===== */
.imp-z{--ink-rgb:28,28,30;
  --paper-rgb:251,251,251;
  --violet-rgb:112,0,255;
  --lime-rgb:203,255,0;

  --ink:#1C1C1E;
  --paper:#FBFBFB;
  --violet:#7000FF;
  --violet-hover:#5800CC;
  --lime:#CBFF00;

  --font-ui:'Inter',system-ui,sans-serif;
  --font-display:'VT323',monospace;
  --font-hand:'Caveat',cursive;
  --tracking-eyebrow:.16em;

  --radius-card:24px;
  --card-padding:24px 22px;
  --input-height:48px;
  --input-radius:16px;
  --radius-btn:16px;
  --input-padding-x:16px;
  --input-font-size:14px;
  --form-gap:16px;
  --btn-height:52px;
  --btn-font-size:16px;
  --btn-border:2px solid transparent;
  --radius-pill:999px;
  --radius-checkbox:7px;
  --eyebrow-size:10px;
  --title-card-size:38px;
  --title-hero-size:78px;
  --hand-size:18px;
  --logo-size:44px;
  --avatar-size:64px;
  --name-size:34px;

  

  
  --bg:#1C1C1E;
  --text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --text-accent:#B98CFF;          
  --eyebrow-color:var(--lime);    
  --card-border:rgba(var(--paper-rgb),.15);
  --card-border-top:rgba(255,255,255,.5);
  --card-bg:rgba(var(--ink-rgb),.45);
  --card-blur:44px;
  --card-saturate:1.9;
  --card-shadow:0 24px 64px rgba(0,0,0,.4),0 8px 24px rgba(var(--violet-rgb),.22);
  --input-bg:rgba(var(--paper-rgb),.06);
  --input-border:rgba(var(--paper-rgb),.24);
  --btn-outline-border:rgba(var(--paper-rgb),.3);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.58;
  --gfx-fluid:.42;
  --logo-src:url('assets/logo/samowolnosc_dark.png');
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.45),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.14),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#242427;}
:root[data-theme="light"] .imp-z{--bg:#FBFBFB;
  --text-heading:#1C1C1E;
  --text-body:#6B6870;
  --text-meta:#9A97A0;
  --text-accent:#7000FF;          
  --eyebrow-color:var(--violet);  
  --card-border:rgba(var(--ink-rgb),.1);
  --card-border-top:rgba(255,255,255,.95);
  --card-bg:rgba(255,255,255,.7);
  --card-blur:19px;
  --card-saturate:1.4;
  --card-shadow:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);
  --input-bg:#fff;
  --input-border:rgba(var(--ink-rgb),.14);
  --btn-outline-border:rgba(var(--ink-rgb),.16);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.42;
  --gfx-fluid:.14;
  --logo-src:url('assets/logo/samowolnosc_transparent.png');
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.08),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.1),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#F1EEF7;}
.imp-z-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
:root[data-theme="light"] .imp-z-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
@media (min-width:1024px){
.imp-z{--radius-card:26px;
    --card-padding:34px 32px;
    --input-height:50px;
    --input-padding-x:18px;
    --input-font-size:15px;
    --form-gap:18px;
    --btn-height:54px;
    --title-card-size:42px;
    --title-hero-size:88px;
    --hand-size:26px;
    --logo-size:56px;
    --avatar-size:88px;
    --name-size:56px;}
}
@media (prefers-reduced-motion: reduce){
:where(.imp-z), :where(.imp-z) *{transition:none !important; animation:none !important;}
}
@media (prefers-reduced-transparency: reduce){
.imp-z{--card-bg:var(--glass-fallback-bg);
    --card-blur:0px;
    --card-saturate:1;}
.imp-z-card{backdrop-filter:none; -webkit-backdrop-filter:none;}
}

/* ===== luki.css -> prefiks .imp-z ===== */
.imp-z{--card-bg-2: rgba(var(--ink-rgb),.45);
  --card-blur-2: 48px;
  --card-saturate-2: 2;}
:root[data-theme="light"] .imp-z{--card-bg-2: rgba(var(--paper-rgb),.45);
  --card-blur-2: 48px;
  --card-saturate-2: 2;}

/* ===== czesciowy.css -> prefiks .imp-z ===== */
.imp-z-logo{width:var(--logo-size);height:var(--logo-size);object-fit:contain;display:block}
.imp-z-logo--light{display:none}
:root[data-theme="light"] .imp-z-logo--dark{display:none}
:root[data-theme="light"] .imp-z-logo--light{display:block}
.imp-z-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-accent)}
.imp-z-btn-primary{width:100%;min-height:var(--btn-height);border:var(--btn-border);border-radius:var(--radius-btn);background:var(--lime);color:#1C1C1E;font:600 var(--btn-font-size)/1 var(--font-ui);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-z-btn-primary:hover{background:var(--violet);color:#FBFBFB;border-color:var(--lime)}
.imp-z-btn-primary:disabled{background:rgba(var(--lime-rgb),.3);color:rgba(var(--paper-rgb),.6);cursor:not-allowed}
.imp-z-pwa-banner{position:fixed;top:0;left:10px;right:10px;max-width:430px;margin:0 auto;z-index:10;padding:22px 18px 22px 16px;border-radius:0 0 24px 24px;background:var(--card-bg-2);backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));-webkit-backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));border:1px solid var(--card-border);box-shadow:0 16px 34px rgba(0,0,0,.22)}
.imp-z-pwa-banner-row{display:flex;align-items:flex-start;gap:14px}
.imp-z-pwa-icon{width:56px;height:56px;object-fit:contain;border-radius:14px;flex:none}
.imp-z-pwa-title{font:600 15px/1.3 'Inter';color:var(--text-heading)}
.imp-z-pwa-subtitle{font:400 12.5px/1.4 'Inter';color:var(--text-body);margin-top:3px}
.imp-z-pwa-close{font:400 16px/1 'Inter';color:var(--text-meta);cursor:pointer;flex:none;padding:4px;border:none;background:none}
.imp-z-pwa-banner .imp-z-btn-primary{margin-top:16px}
.imp-z-pwa-link{font:700 13px/1 'Inter';color:var(--text-accent);cursor:pointer;background:none;border:none;flex:none}
.imp-z-pwa-link:hover{color:var(--violet-hover)}
.imp-z-sheet-scrim{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:20}
:root[data-theme="light"] .imp-z-sheet-scrim{background:rgba(28,28,30,.42)}
.imp-z-sheet{position:fixed;left:0;right:0;bottom:0;max-width:430px;margin:0 auto;z-index:21;padding:26px 22px 30px;border-radius:28px 28px 0 0;background:var(--bg);box-shadow:0 -20px 48px rgba(0,0,0,.4)}
.imp-z-sheet-handle{width:36px;height:4px;border-radius:2px;background:rgba(var(--paper-rgb),.2);margin:0 auto 20px}
:root[data-theme="light"] .imp-z-sheet-handle{background:rgba(var(--ink-rgb),.16)}
.imp-z-sheet-title{margin:0 0 22px;font:400 30px/.94 'VT323',monospace;letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-z-step-row{display:flex;align-items:center;gap:14px}
.imp-z-step-badge{flex:none;width:26px;height:26px;border-radius:999px;background:var(--lime);color:#1C1C1E;display:grid;place-items:center;font:600 12px/1 'Inter'}
.imp-z-step-icon{flex:none;width:44px;height:44px;border-radius:12px;background:rgba(var(--paper-rgb),.08);display:grid;place-items:center}
:root[data-theme="light"] .imp-z-step-icon{background:#F1EEF7}
.imp-z-step-text{flex:1;font:500 14.5px/1.3 'Inter';color:var(--text-heading)}
.imp-z-sheet .imp-z-btn-primary{margin-top:26px}


/* Inline style="" z eksportu przeniesione do klas (Krok 3 pkt 3 instrukcji:
   komplet właściwości, nie „te ważne" — tu zginęło kiedyś display:flex karty
   programu). Nazwy własne, bo eksport nie nadał tym elementom klas. */
.imp-z-pwa-banner-text{flex:1;min-width:0}
.imp-z-sheet-eyebrow{display:block;margin-bottom:6px}
.imp-z-step-list{display:flex;flex-direction:column;gap:16px}
.imp-z-step-icon-add{color:var(--text-heading)}
.imp-z-step-icon-confirm{font:700 11px/1 'Inter';color:#0A84FF}

/* Przekład makieta→żywa strona (Krok 2): baner jest w eksporcie przyklejony
   do samej góry ekranu, a w aplikacji nad nim jest pasek stanu telefonu
   i wcięcie ekranu — bez tego baner wchodziłby pod „notch". */
.imp-z-pwa-banner{top:env(safe-area-inset-top)}

/* ===================================================================
   PRZEKŁAD makieta→żywa strona: BLOKADA AUTOZOOMU iOS (30.08.2026)
   Zgłoszone przez właściciela ze zrzutu z iPhone'a 16 Pro: po dotknięciu
   pola e-mail Safari przybliża stronę i prawa krawędź pola wychodzi poza
   ekran. Przyczyna nie jest w naszym układzie — Safari na iOS przybliża
   KAŻDE pole, którego czcionka jest mniejsza niż 16px, a eksport ma
   --input-font-size:14px (15px od 1024px).
   Rozwiązanie: na dotykowych szerokościach pola dostają 16px. Świadomie
   NIE blokujemy powiększania przez maximum-scale w meta viewport — to
   psuje dostępność osobom, które powiększają celowo.
   DO PRZENIESIENIA do Claude Design (dotyczy każdego eksportu z polami).
   =================================================================== */
@media (max-width: 1023px) {
    .imp-a-input,
    .imp-b4-input,
    .imp-c4-input,
    .imp-a textarea,
    .imp-b4 textarea,
    .imp-c4 textarea {
        font-size: 16px;
    }
}

/* ===================================================================
   EKRAN GOŚCIA — przyciski jak reszta aplikacji (30.08.2026)
   Zgłoszenie właściciela: CTA na ekranie wejścia wyglądały „bardzo
   staro" na tle reszty. Przyczyna: jako jedyne w produkcie były
   PIGUŁKAMI (--radius-pill na desktopie), a każde nowsze CTA
   (.imp-b4-pl-cta, .imp-c4-module-cta, .imp-z-btn-primary) to
   zaokrąglony prostokąt --radius-btn. Zdjęte nadpisanie promienia;
   reszta (kolor, wysokość, hover) była już taka sama.
   DO PRZENIESIENIA do Claude Design przy reimporcie Obszaru A.
   =================================================================== */

/* ===================================================================
   KARTY ZASOBÓW NA PULPICIE — dopracowanie (30.08.2026)
   Prośba właściciela: „traktowaliśmy je po macoszemu, teraz czas je
   dopracować — mają być spójne, ale Praca 1:1 ma się wyróżniać".
   Świadomie BEZ okładek graficznych (decyzja: idziemy w spójność
   aplikacji, nie w miniatury produktów).

   Wspólne dla obu kart: reakcja na kursor przestaje być samym uniesieniem
   — dochodzi limonkowa krawędź, delikatne rozjaśnienie tła i ruch strzałki
   w jej własnym kierunku (e-book pobiera → strzałka w dół, Praca 1:1
   prowadzi dalej → strzałka w prawo). Ikona lekko rośnie.

   Praca 1:1 wyróżniona mocniej: płynna grafika w tle rozjaśnia się
   i powiększa, a karta dostaje miękką limonkową poświatę. To ta sama
   limonka co wszędzie, tylko użyta odważniej — bez nowych kolorów.
   =================================================================== */
.imp-b4-resource-card{transition:transform 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1),box-shadow 150ms cubic-bezier(.4,0,.2,1)}
.imp-b4-resource-card:hover{border-color:rgba(var(--lime-rgb),.55)}
.imp-b4-resource-icon{transition:transform 150ms cubic-bezier(.4,0,.2,1)}
.imp-b4-resource-card:hover .imp-b4-resource-icon{transform:scale(1.06)}
.imp-b4-resource-arrow{transition:transform 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1)}
.imp-b4-resource-card:hover .imp-b4-resource-arrow{color:var(--lime)}

/* Strzałka rusza w swoją stronę: e-book pobiera (w dół), Praca 1:1
   prowadzi dalej (w prawo). Kierunek bierzemy z samej treści strzałki,
   bez dokładania klas do widoku. */
.imp-b4-resource-card:hover .imp-b4-resource-arrow{transform:translateY(2px)}
.imp-b4-pl-resource-body .imp-b4-resource-arrow{transition:transform 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1)}
.imp-b4-resource-card:hover .imp-b4-pl-resource-body .imp-b4-resource-arrow,
.imp-b4-pl-resource-body:hover .imp-b4-resource-arrow{transform:translateX(3px)}

/* Praca 1:1 — mocniejszy akcent. Karta rozpoznawana po tym, że jako
   jedyna ma płynną grafikę w tle (.imp-b4-pl-fluid-card). */
.imp-b4-pl-fluid-card{transition:transform 220ms cubic-bezier(.4,0,.2,1),opacity 220ms cubic-bezier(.4,0,.2,1)}
.imp-b4-resource-card:hover .imp-b4-pl-fluid-card{transform:scale(1.08);opacity:1}
.imp-b4-resource-card:has(.imp-b4-pl-fluid-card):hover{box-shadow:var(--shadow-glass),0 0 0 1px rgba(var(--lime-rgb),.35),0 12px 32px rgba(var(--lime-rgb),.16)}

/* Dostępność: przy „ogranicz ruch" zostaje sama zmiana koloru krawędzi,
   bez przesunięć i skalowania (zasada z CLAUDE.md — reduced-motion
   traktowane poważnie). */
@media (prefers-reduced-motion: reduce){
  .imp-b4-resource-card:hover{transform:none}
  .imp-b4-resource-card:hover .imp-b4-resource-icon,
  .imp-b4-resource-card:hover .imp-b4-resource-arrow,
  .imp-b4-resource-card:hover .imp-b4-pl-fluid-card{transform:none}
}

/* ===================================================================
   PASEK „DODAJ NA EKRAN GŁÓWNY" (30.08.2026)
   Wybrany przez właściciela wariant 2 z trzech porównywanych
   (pozostałe dwa usunięte razem z wyborem).

   Zastępuje baner z eksportu Obszaru Z, który zjeżdżał z góry —
   zasłaniał powitanie na pulpicie i mylił dwoma przyciskami.
   ODSTĘPSTWO OD EKSPORTU, do zgłoszenia Claude Design: sam arkusz
   z instrukcją iOS zostaje 1:1 z eksportu (właściciel: „wychodzi
   bardzo fajnie, czytelnie"), wymieniony jest wyłącznie baner.

   Pasek siedzi TUŻ NAD DOKIEM, w jego języku wizualnym, i NAKŁADA SIĘ
   na treść zamiast ją spychać — wysokość strony bez zmian, więc pulpit
   dalej mieści się bez przewijania (warunek właściciela). Wjeżdża od
   dołu; przy „ogranicz ruch" pojawia się bez animacji.

   Klasy w przestrzeni .imp-z, nie .imp-b4 — partial jest dołączany
   w layout-brand.php na KAŻDYM zalogowanym ekranie, także tam, gdzie
   żyją tokeny .imp-c4 / .imp-c11. Własna przestrzeń = pasek wygląda
   tak samo wszędzie.
   =================================================================== */
.imp-z-add-bar{position:fixed;left:12px;right:12px;bottom:calc(84px + env(safe-area-inset-bottom));z-index:5;display:flex;align-items:center;gap:12px;padding:10px 10px 10px 16px;border-radius:20px;background:var(--card-bg-2);backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));-webkit-backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));border:1px solid var(--card-border);border-top-color:var(--card-border-top);box-shadow:var(--card-shadow);animation:imp-z-add-bar-in 320ms cubic-bezier(.4,0,.2,1)}
.imp-z-add-bar[hidden]{display:none}
.imp-z-add-bar-text{flex:1;min-width:0}
.imp-z-add-bar-title{font:600 13.5px/1.3 var(--font-ui);color:var(--text-heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-z-add-bar-sub{font:400 11.5px/1.35 var(--font-ui);color:var(--text-body);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-z-add-bar-cta{flex:none;min-height:36px;padding:0 16px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:var(--lime);border:var(--btn-border);color:#1C1C1E;font:600 13px/1 var(--font-ui);cursor:pointer;text-decoration:none}
.imp-z-add-bar-close{flex:none;width:28px;height:28px;display:grid;place-items:center;border:none;background:none;color:var(--text-meta);font:400 15px/1 var(--font-ui);cursor:pointer}

@keyframes imp-z-add-bar-in{from{transform:translateY(140%);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion: reduce){
  .imp-z-add-bar{animation:none}
}

/* Na desktopie doku nie ma, więc pasek siada nad dolną krawędzią okna. */
@media (min-width:1024px){
  .imp-z-add-bar{left:auto;right:24px;bottom:24px;max-width:420px}
}

/* ===================================================================
   PRELEKCJA W MODULE — ODTWARZACZ ZAMIAST ZAŚLEPKI (30.08.2026)

   Eksport C11 ma w tym miejscu statyczną kartę z narysowanym przyciskiem
   play. Gdy prelekcja modułu ma podpięty film, w tę samą ramkę wchodzi
   nasz komponent .video-embed (iframe Bunny Stream).

   Karta ma już proporcje 16:9, zaokrąglenie i overflow:hidden, więc
   iframe ma tylko ją wypełnić — własnego zaokrąglenia nie potrzebuje,
   bo dublowałoby się z krawędzią karty.
   =================================================================== */
.imp-c11-video-card .video-embed{width:100%;height:100%;border-radius:0}

/* ===================================================================
   EKRAN MODUŁU MA BYĆ JEDNYM EKRANEM (30.08.2026)

   Zgłoszenie właściciela: pasek statystyk dotykał dolnej krawędzi,
   a stroną dało się przewinąć o kilkadziesiąt pikseli w górę i w dół.
   Zmierzone na makiecie (1440x900): treść była o 24 px wyższa od
   ekranu, a wysokość wymusza PRAWA KOLUMNA (670 px własnej treści) —
   nie film, który i tak ma max-height.

   Dwa ruchy. Po pierwsze odzyskujemy pionowe miejsce tam, gdzie było
   go najwięcej i gdzie nikt tego nie zauważy: dolny padding widoku
   (40 -> 24) i odstęp pod nagłówkiem (26 -> 16). Po drugie zawór
   bezpieczeństwa: strona dostaje sztywną wysokość ekranu, więc nie
   ma jak urosnąć, a gdyby treść i tak się nie zmieściła (niskie okno,
   pasek zakładek, duża czcionka systemowa), przewija się sama prawa
   kolumna zamiast całej strony.
   =================================================================== */
@media (min-width:1024px){
  .imp-c11-page{height:100vh;height:100dvh}
  .imp-c11-c-view{padding-top:20px;padding-bottom:calc(24px + env(safe-area-inset-bottom));min-height:0}
  .imp-c11-c-head{margin-bottom:16px}
  .imp-c11-c-grid{min-height:0}
  .imp-c11-c-rail{min-height:0;overflow-y:auto;scrollbar-width:thin}
}

/* Nadtytuł pod tytułem, nie nad nim (decyzja właściciela 30.08.2026:
   "tam jest miejsce, lepiej tam niż u góry"). Odstęp przenosi się
   z dołu na górę, żeby nie odklejał tytułu od filmu. */
.imp-c11-eyebrow--under{margin:6px 0 0}


/* ==========================================================================
   OBSZAR D — sesja, ocena trudności, wynik
   Eksport: HTML DO WDROŻENIA/eksport-D (31 sierpnia 2026), droga 4.
   Źródło: tokens.css + components.css + geometria ekranu z <style> w HTML.
   CSS przeniesiony maszynowo (narzedzia/prefiksuj-eksport.py), nie ręcznie.

   Paczka niesie ze sobą komplet komponentów obszaru C (dni, warianty,
   pasek dni) — pod prefiksem .imp-d część reguł powtarza się względem
   .imp-c11. Tak działa droga 4: każdy obszar jest samodzielny.
   ========================================================================== */
/* ===== tokens.css -> prefiks .imp-d ===== */
.imp-d{--ink-rgb:28,28,30;
  --paper-rgb:251,251,251;
  --violet-rgb:112,0,255;
  --lime-rgb:203,255,0;

  --ink:#1C1C1E;
  --paper:#FBFBFB;
  --violet:#7000FF;
  --violet-hover:#5800CC;
  --lime:#CBFF00;

  --font-ui:'Inter',system-ui,sans-serif;
  --font-display:'VT323',monospace;
  --font-hand:'Caveat',cursive;
  --tracking-eyebrow:.16em;

  --radius-card:24px;
  --card-padding:24px 22px;
  --input-height:48px;
  --input-radius:16px;
  --radius-btn:16px;
  --input-padding-x:16px;
  --input-font-size:14px;
  --form-gap:16px;
  --btn-height:52px;
  --btn-font-size:16px;
  --btn-border:2px solid transparent;
  --radius-pill:999px;
  --radius-checkbox:7px;
  --eyebrow-size:10px;
  --title-card-size:38px;
  --title-hero-size:78px;
  --hand-size:18px;
  --logo-size:44px;
  --avatar-size:64px;
  --name-size:34px;

  
  --day-chip:44px;
  --radius-module:20px;
  --radius-chip:16px;
  --module-num-size:40px;
  --variant-name-size:22px;

  

  
  --bg:#1C1C1E;
  --text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --text-accent:#B98CFF;          
  --eyebrow-color:var(--lime);    
  --card-border:rgba(var(--paper-rgb),.15);
  --card-border-top:rgba(255,255,255,.5);
  --card-bg:rgba(var(--ink-rgb),.45);
  --card-blur:44px;
  --card-saturate:1.9;
  --card-shadow:0 24px 64px rgba(0,0,0,.4),0 8px 24px rgba(var(--violet-rgb),.22);

  
  --card-bg-1:rgba(var(--ink-rgb),.45);   --card-blur-1:48px; --card-saturate-1:2;
  --card-bg-2:rgba(var(--ink-rgb),.45);   --card-blur-2:48px; --card-saturate-2:2;
  --card-bg-3:rgba(var(--paper-rgb),.05);
  --card-bg-4:rgba(var(--paper-rgb),.04);
  --glass-border:rgba(255,255,255,.18);
  --glass-border-top:rgba(255,255,255,.55);
  --shadow-glass:0 24px 64px rgba(0,0,0,.35),0 8px 24px rgba(var(--violet-rgb),.25),inset 0 1px 0 rgba(255,255,255,.5);
  --ring-track:rgba(var(--paper-rgb),.14);
  --divider:rgba(var(--paper-rgb),.12);
  --input-bg:rgba(var(--paper-rgb),.06);
  --input-border:rgba(var(--paper-rgb),.24);
  --btn-outline-border:rgba(var(--paper-rgb),.3);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.58;
  --gfx-fluid:.42;
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.45),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.14),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#242427;}
:root[data-theme="light"] .imp-d{--bg:#FBFBFB;
  --text-heading:#1C1C1E;
  --text-body:#6B6870;
  --text-meta:#9A97A0;
  --text-accent:#7000FF;          
  --eyebrow-color:var(--violet);  
  --card-border:rgba(var(--ink-rgb),.1);
  --card-border-top:rgba(255,255,255,.95);
  --card-bg:rgba(255,255,255,.45);
  --card-blur:19px;
  --card-saturate:1.4;
  --card-shadow:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);

  
  --card-bg-1:rgba(var(--paper-rgb),.45); --card-blur-1:22px; --card-saturate-1:1.6;
  --card-bg-2:rgba(var(--paper-rgb),.45); --card-blur-2:22px; --card-saturate-2:1.5;
  --card-bg-3:rgba(255,255,255,.55);
  --card-bg-4:rgba(var(--ink-rgb),.02);
  --glass-border:rgba(255,255,255,.5);
  --glass-border-top:rgba(255,255,255,.8);
  --shadow-glass:0 24px 64px rgba(var(--ink-rgb),.18),0 8px 24px rgba(var(--violet-rgb),.22),inset 0 1px 0 rgba(255,255,255,.7);
  --ring-track:rgba(var(--ink-rgb),.1);
  --divider:rgba(var(--ink-rgb),.07);
  --input-bg:#fff;
  --input-border:rgba(var(--ink-rgb),.14);
  --btn-outline-border:rgba(var(--ink-rgb),.16);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.42;
  --gfx-fluid:.14;
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.08),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.1),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#F1EEF7;}
.imp-d-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
:root[data-theme="light"] .imp-d-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
@media (min-width:1024px){
.imp-d{--radius-card:26px;
    --card-padding:34px 32px;
    --input-height:50px;
    --input-padding-x:18px;
    --input-font-size:15px;
    --form-gap:18px;
    --btn-height:54px;
    --title-card-size:42px;
    --title-hero-size:88px;
    --hand-size:26px;
    --logo-size:56px;
    --avatar-size:88px;
    --name-size:56px;
    --day-chip:36px;
    --radius-module:18px;}
:root[data-theme="light"] .imp-d{--shadow-glass:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);}
}
@media (prefers-reduced-motion: reduce){
:where(.imp-d), :where(.imp-d) *{transition:none !important; animation:none !important;}
}
@media (prefers-reduced-transparency: reduce){
.imp-d{--card-bg:var(--glass-fallback-bg);
    --card-blur:0px;
    --card-saturate:1;}
.imp-d-card{backdrop-filter:none; -webkit-backdrop-filter:none;}
}
.imp-d{--day-done-bg:var(--violet);         --day-done-fg:var(--paper);
  --day-sel-bg:var(--lime);            --day-sel-fg:var(--ink);
  --day-sel-ring:0 0 0 4px rgba(var(--lime-rgb),.22);
  --day-off-bg:rgba(var(--paper-rgb),.06);
  --day-off-border:rgba(var(--paper-rgb),.16);
  --day-off-fg:var(--text-meta);
  --module-bg:#272729;
  --module-shadow:0 6px 18px rgba(var(--ink-rgb),.05);
  --module-on-bg:var(--violet);
  --module-on-shadow:0 16px 40px rgba(var(--violet-rgb),.35);
  --status-done-bg:rgba(var(--lime-rgb),.18);  --status-done-fg:var(--lime);
  --status-now-bg:rgba(185,140,255,.22);       --status-now-fg:#B98CFF;
  --status-next-bg:rgba(var(--paper-rgb),.1);  --status-next-fg:var(--text-body);
  --edge-bg:rgba(185,140,255,.07);   --edge-border:rgba(185,140,255,.32);
  --edge-on-bg:rgba(185,140,255,.16);--edge-on-border:#B98CFF;
  --day-progress:#B98CFF;            
  --danger:#FF8A80; --danger-fg:var(--ink);
  --danger-bg:rgba(227,28,65,.12); --danger-border:rgba(255,107,107,.4);}
:root[data-theme="light"] .imp-d{--day-off-bg:rgba(var(--ink-rgb),.05);
  --day-off-border:rgba(var(--ink-rgb),.12);
  --day-off-fg:#8B8792;
  --day-sel-ring:0 0 0 4px #F1E5FF;
  --module-bg:#FFFFFF;
  --module-shadow:0 6px 18px rgba(var(--ink-rgb),.06);
  --module-on-shadow:0 16px 40px rgba(var(--violet-rgb),.22);
  --status-done-bg:rgba(var(--lime-rgb),.3);   --status-done-fg:#3F4A00;
  --status-now-bg:rgba(var(--violet-rgb),.1);  --status-now-fg:var(--violet);
  --status-next-bg:rgba(var(--ink-rgb),.05);   --status-next-fg:var(--text-body);
  --edge-bg:rgba(var(--violet-rgb),.04);   --edge-border:rgba(var(--violet-rgb),.28);
  --edge-on-bg:rgba(var(--violet-rgb),.09);--edge-on-border:var(--violet);
  --danger:#B03A2E; --danger-fg:var(--paper);
  --danger-bg:rgba(227,28,65,.06); --danger-border:rgba(227,28,65,.28);}
.imp-d{--radius-glass:18px;      
  --radius-session:20px;    
  --radius-video:16px;
  --radius-variant:15px;
  --radius-nav-item:14px;
  --radius-topbar:20px;
  --variant-height:46px;
  --start-height:50px;
  --daybar-seg:7px;
  --daybar-gap:5px;
  --video-max:820px;
  --title-view-size:54px;
  --stat-value-size:30px;
  --variant-title-size:21px;
  --glass-pad:18px 20px;
  --session-pad:20px 22px;}
.imp-d{--radius-exercise:16px;
  --radius-sheet:28px;
  --radius-modal:28px;
  --radius-timer:14px;
  --topbar-mobile-h:56px;
  --exercise-pad:13px 14px;
  --timer-size:34px;
  --timer-desktop-size:44px;
  --result-title-size:58px;
  --result-title-desktop-size:72px;
  --result-card-h:492px;
  --result-card-w:600px;
  --hand-mobile-h:340px;
  --hand-desktop-h:330px;
  --scale-col-h:99px;
  --scale-gap:8px;
  --bar-radius:11px 11px 8px 8px;
  --bar-font:12.5px;
  --sheet-pad:10px 20px 22px;
  --modal-pad:32px 34px 28px;
  --progress-h:5px;

  
  --bar-off-bg:#241E31;
  --bar-off-border:rgba(var(--paper-rgb),.22);
  --bar-off-fg:var(--text-meta);
  --bar-under-bg:#4A1BA6;
  --bar-under-border:rgba(185,140,255,.65);
  --bar-under-fg:var(--paper);
  --bar-on-bg:var(--lime);
  --bar-on-border:var(--lime);
  --bar-on-fg:var(--ink);
  --bar-on-shadow:0 0 0 6px rgba(var(--lime-rgb),.16),0 10px 26px rgba(var(--lime-rgb),.3);
  --bar-hover-border:var(--lime);

  
  --sheet-bg:linear-gradient(180deg,rgba(43,33,62,.98),#1C1C1E);
  --sheet-border:rgba(185,140,255,.45);
  --sheet-shadow:0 0 0 1px rgba(185,140,255,.12),0 -30px 90px rgba(var(--violet-rgb),.45);
  --modal-shadow:0 0 0 1px rgba(185,140,255,.12),0 40px 110px rgba(var(--violet-rgb),.45),inset 0 1px 0 rgba(255,255,255,.14);
  --sheet-handle:rgba(var(--paper-rgb),.28);
  --scrim:rgba(10,10,12,.78);
  --box-bg:rgba(var(--paper-rgb),.05);
  --box-border:rgba(var(--paper-rgb),.12);
  --verdict-bg:rgba(185,140,255,.14);
  --verdict-border:rgba(185,140,255,.38);
  --verdict-fg:#E5D5FF;
  --hint-bg:rgba(var(--lime-rgb),.09);
  --hint-border:rgba(var(--lime-rgb),.32);
  --hint-fg:#E7F5B0;
  --hint-idle-bg:rgba(var(--paper-rgb),.05);
  --hint-idle-border:rgba(var(--paper-rgb),.1);
  --hint-idle-fg:var(--text-body);
  --ex-active-bg:rgba(var(--paper-rgb),.07);
  --ex-active-border:rgba(var(--lime-rgb),.34);
  --ex-flat-bg:rgba(var(--paper-rgb),.04);
  --ex-flat-border:rgba(var(--paper-rgb),.12);
  --num-on:var(--lime);
  --hand-glow:drop-shadow(0 18px 40px rgba(var(--violet-rgb),.95)) drop-shadow(0 0 60px rgba(var(--violet-rgb),.55));}
:root[data-theme="light"] .imp-d{--bar-off-bg:#FFFFFF;
  --bar-off-border:rgba(var(--ink-rgb),.16);
  --bar-off-fg:#6B6870;
  --bar-under-bg:#B98CFF;
  --bar-under-border:rgba(var(--violet-rgb),.45);
  --bar-under-fg:#FFFFFF;
  --bar-on-bg:var(--violet);
  --bar-on-border:var(--violet);
  --bar-on-fg:var(--paper);
  --bar-on-shadow:0 0 0 6px rgba(var(--lime-rgb),.42),0 10px 26px rgba(var(--lime-rgb),.5);
  --bar-hover-border:var(--violet);

  --sheet-bg:linear-gradient(180deg,#FFFFFF,#F6F2FD);
  --sheet-border:rgba(var(--violet-rgb),.28);
  --sheet-shadow:0 0 0 1px rgba(var(--violet-rgb),.08),0 -30px 90px rgba(var(--violet-rgb),.28);
  --modal-shadow:0 0 0 1px rgba(var(--violet-rgb),.08),0 40px 110px rgba(var(--violet-rgb),.24),inset 0 1px 0 #FFFFFF;
  --sheet-handle:rgba(var(--ink-rgb),.18);
  --scrim:rgba(var(--ink-rgb),.45);
  --box-bg:rgba(var(--violet-rgb),.05);
  --box-border:rgba(var(--ink-rgb),.1);
  --verdict-bg:rgba(var(--violet-rgb),.06);
  --verdict-border:rgba(var(--violet-rgb),.24);
  --verdict-fg:var(--violet);
  --hint-bg:rgba(var(--violet-rgb),.06);
  --hint-border:rgba(var(--violet-rgb),.24);
  --hint-fg:#3A3740;
  --hint-idle-bg:rgba(var(--ink-rgb),.04);
  --hint-idle-border:rgba(var(--ink-rgb),.1);
  --hint-idle-fg:#6B6870;
  --ex-active-bg:rgba(255,255,255,.86);
  --ex-active-border:rgba(var(--violet-rgb),.28);
  --ex-flat-bg:rgba(255,255,255,.55);
  --ex-flat-border:rgba(var(--ink-rgb),.1);
  --num-on:var(--violet);
  --hand-glow:drop-shadow(0 18px 40px rgba(var(--violet-rgb),.85)) drop-shadow(0 0 60px rgba(var(--violet-rgb),.5));}
@media (min-width:1024px){
.imp-d{--exercise-pad:14px 18px;
    --timer-size:var(--timer-desktop-size);
    --result-title-size:var(--result-title-desktop-size);
    --scale-col-h:99px;}
}
@media (prefers-reduced-transparency: reduce){
.imp-d{--sheet-bg:var(--glass-fallback-bg);}
}

/* ===== components.css -> prefiks .imp-d ===== */
:where(.imp-d), :where(.imp-d) *{box-sizing:border-box}
.imp-d{margin:0;padding:0}
.imp-d{display:block;background:var(--bg);font-family:var(--font-ui);color:var(--text-body);-webkit-font-smoothing:antialiased}
:where(.imp-d) a{color:var(--text-accent);text-decoration:none}
:where(.imp-d) a:hover{color:var(--violet-hover)}
:where(.imp-d) button{font-family:inherit;border:none;background:none;padding:0;cursor:pointer}
:where(.imp-d) img{max-width:100%}
.imp-d-page{position:relative;display:block;overflow:hidden;min-height:100vh;background:var(--bg);isolation:isolate}
.imp-d-glow{position:absolute;pointer-events:none;border-radius:50%;z-index:0}
.imp-d-gfx-glass{position:absolute;pointer-events:none;opacity:var(--gfx-glass);z-index:0}
.imp-d-logo{flex:none;width:var(--logo-size);height:var(--logo-size);object-fit:contain;display:block}
.imp-d-logo--light{display:none}
:root[data-theme="light"] .imp-d-logo--dark{display:none}
:root[data-theme="light"] .imp-d-logo--light{display:block}
.imp-d-topbar{display:none}
.imp-d-topbar-logo{flex:none;display:flex;align-items:center;gap:11px}
.imp-d-topbar-nav{display:flex;gap:4px}
.imp-d-nav-item{min-height:44px;display:flex;align-items:center;gap:9px;padding:0 16px;border-radius:var(--radius-nav-item);color:var(--text-body);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-d-nav-item:hover{color:var(--text-accent)}
.imp-d-nav-item span{font:600 13px/1 var(--font-ui)}
.imp-d-nav-item--active{background:var(--lime);color:var(--ink)}
.imp-d-nav-item--active:hover{color:var(--ink)}
.imp-d-topbar-end{margin-left:auto;display:flex;align-items:center;gap:8px}
.imp-d-c-view{position:relative;z-index:1;display:flex;flex-direction:column}
.imp-d-c-head{display:block}
.imp-d-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color)}
.imp-d-view-title{margin:0;font:400 var(--title-view-size)/.9 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-d-c-grid{display:grid;min-height:0}
.imp-d-c-col{display:flex;flex-direction:column;min-width:0;min-height:0}
.imp-d-c-rail{display:flex;flex-direction:column;min-width:0;min-height:0}
.imp-d-video-frame{display:flex}
.imp-d-video-card{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:var(--radius-video);background:var(--module-bg);border:1px solid var(--card-border);box-shadow:var(--module-shadow)}
.imp-d-video-card .imp-d-gfx-glass{position:absolute;top:-60px;right:-40px;width:200px;opacity:var(--gfx-fluid)}
.imp-d-video-inner{position:relative;display:flex;flex-direction:column;align-items:center;gap:14px}
.imp-d-video-play{display:grid;place-items:center;width:78px;height:78px;border-radius:var(--radius-pill);background:var(--lime)}
.imp-d-video-note{max-width:520px;text-align:center;font:400 13px/1.4 var(--font-ui);color:var(--text-body)}
.imp-d-video-spec{position:absolute;bottom:12px;right:14px;font:600 9.5px/1 var(--font-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--text-meta)}
.imp-d-stat-bar{display:flex;align-items:stretch;padding:var(--glass-pad);border-radius:var(--radius-glass);background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--card-border)}
.imp-d-stat-cell{flex:1;min-width:0;overflow:hidden;display:flex;flex-direction:column;gap:5px;padding-right:24px}
.imp-d-stat-cell + .imp-d-stat-cell{padding-left:24px;border-left:1px solid var(--divider)}
.imp-d-stat-cell:last-child{padding-right:0}
.imp-d-stat-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-d-stat-value{font:400 var(--stat-value-size)/1 var(--font-display);color:var(--text-heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-d-stat-value--accent{color:var(--text-accent)}
.imp-d-chip-links{display:flex;flex-direction:column;gap:8px}
.imp-d-chip-links--row{flex-direction:row}
.imp-d-chip-link{flex:1;min-width:0;min-height:44px;display:flex;align-items:center;gap:7px;padding:0 16px;border-radius:var(--radius-chip);border:1px solid var(--btn-outline-border);font:500 13px/1 var(--font-ui);color:var(--btn-outline-text);text-decoration:none;transition:background 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-d-chip-link:hover{background:rgba(var(--paper-rgb),.08);border-color:var(--text-accent)}
:root[data-theme="light"] .imp-d-chip-link:hover{background:rgba(var(--ink-rgb),.05)}
.imp-d-chip-link span{margin-left:auto;color:var(--text-accent)}
.imp-d-card--rail{display:block;padding:var(--glass-pad);border-radius:var(--radius-glass);background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--card-border)}
.imp-d-daybar-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px}
.imp-d-daybar-count{flex:0 1 auto;min-width:0;font:400 20px/1 var(--font-display);color:var(--day-progress);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-d-daybar{display:flex;gap:var(--daybar-gap)}
.imp-d-daybar-seg{flex:1;min-width:0;height:var(--daybar-seg);border-radius:var(--radius-pill);background:var(--ring-track)}
.imp-d-daybar-seg--done{background:var(--day-progress)}
.imp-d-session-card{display:block;padding:var(--session-pad);border-radius:var(--radius-session);background:var(--module-bg);border:1px solid var(--card-border);box-shadow:var(--module-shadow)}
.imp-d-session-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.imp-d-session-legend{flex:1;min-width:0;text-align:right;font:400 11px/1 var(--font-ui);color:var(--text-meta);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-d-session-rule{height:1px;background:var(--divider);margin:16px 0 14px}
.imp-d-session-label{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body);margin-bottom:12px}
.imp-d-day-chips{display:flex;gap:8px}
.imp-d-day-chip{flex:none;width:var(--day-chip);height:var(--day-chip);display:grid;place-items:center;border-radius:var(--radius-pill);border:2px solid var(--day-off-border);background:var(--day-off-bg);color:var(--day-off-fg);font:600 12px/1 var(--font-ui);transition:transform 120ms cubic-bezier(.4,0,.2,1)}
.imp-d-day-chip:hover{transform:translateY(-2px)}
.imp-d-day-chip--done{background:var(--day-done-bg);border-color:var(--day-done-bg);color:var(--day-done-fg)}
.imp-d-day-chip--selected{background:var(--day-sel-bg);border-color:var(--day-sel-bg);color:var(--day-sel-fg);box-shadow:var(--day-sel-ring)}
.imp-d-variants{display:flex;flex-direction:column;gap:8px}
.imp-d-variant{display:flex;align-items:center;gap:12px;width:100%;min-height:var(--variant-height);padding:11px 15px;overflow:hidden;border-radius:var(--radius-variant);border:1px solid var(--card-border);background:var(--input-bg);text-align:left;transition:transform 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-d-variant:hover{transform:translateY(-2px)}
.imp-d-variant-name{flex:none;font:400 var(--variant-title-size)/1 var(--font-display);color:var(--text-heading)}
.imp-d-variant-desc{flex:1;min-width:0;font:400 12.5px/1.35 var(--font-ui);color:var(--text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-d-variant-time{flex:none;font:600 13px/1 var(--font-ui);color:var(--text-heading);white-space:nowrap}
.imp-d-variant--selected{background:var(--violet);border-color:var(--violet)}
.imp-d-variant--selected .imp-d-variant-name,.imp-d-variant--selected .imp-d-variant-time{color:var(--paper)}
.imp-d-variant--selected .imp-d-variant-desc{color:#E4DDF7}
.imp-d-btn-start{display:flex;align-items:center;justify-content:center;gap:10px;min-height:var(--start-height);border-radius:var(--radius-nav-item);background:var(--lime);border:var(--btn-border);color:var(--ink);font:600 15px/1 var(--font-ui);text-decoration:none;transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-d-btn-start:hover{background:var(--violet);color:var(--paper);border-color:var(--lime)}
@media (min-width:1024px){
.imp-d-video-frame{flex:1;min-height:0;align-items:flex-start}
.imp-d-video-card{max-height:100%}
.imp-d-topbar{position:absolute;top:16px;left:24px;right:24px;z-index:3;display:flex;align-items:center;gap:24px;padding:10px 14px 10px 18px;border-radius:var(--radius-topbar);background:var(--card-bg-2);backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));-webkit-backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
}
.imp-d-appbar{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 16px;min-height:var(--topbar-mobile-h);background:var(--card-bg-2);backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));-webkit-backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));border-bottom:1px solid var(--card-border)}
.imp-d-appbar-back{display:flex;align-items:center;min-height:44px;font:400 13px/1 var(--font-ui);color:var(--text-body);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-d-appbar-back:hover{color:var(--text-accent)}
.imp-d-appbar-title{font:600 12.5px/1 var(--font-ui);color:var(--text-heading)}
.imp-d-badge-variant{padding:5px 9px;border-radius:8px;background:var(--status-now-bg);font:600 10.5px/1 var(--font-ui);letter-spacing:.06em;color:var(--status-now-fg)}
.imp-d-session-view{position:relative;z-index:1;display:flex;flex-direction:column;gap:12px;padding:14px 16px 0;flex:1;min-height:0}
.imp-d-session-foot{position:relative;z-index:1;display:flex;flex-direction:column;gap:5px;padding:10px 16px 14px}
.imp-d-session-note{text-align:center;font:400 11px/1 var(--font-ui);color:var(--text-body)}
.imp-d-sec-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body)}
.imp-d-sec-label--accent{color:var(--num-on)}
.imp-d-props{display:flex;flex-wrap:wrap;gap:8px}
.imp-d-prop{display:flex;flex:0 0 auto;align-items:center;min-height:34px;padding:0 12px;border-radius:var(--radius-chip);background:var(--ex-flat-bg);border:1px dashed var(--input-border);font:400 11.5px/1 var(--font-ui);color:var(--text-body)}
.imp-d-ex-list{display:flex;flex-direction:column;gap:9px}
.imp-d-ex{padding:var(--exercise-pad);border-radius:var(--radius-exercise);background:var(--ex-flat-bg);border:1px solid var(--ex-flat-border);display:flex;align-items:center;gap:10px}
.imp-d-ex--done{opacity:.6}
.imp-d-ex--active{flex-direction:column;align-items:stretch;gap:11px;background:var(--ex-active-bg);border-color:var(--ex-active-border)}
.imp-d-ex-row{display:flex;align-items:flex-start;gap:10px}
.imp-d-ex-num{flex:0 0 auto;width:22px;height:22px;display:grid;place-items:center;border-radius:7px;border:1px solid var(--input-border);font:600 11px/1 var(--font-ui);color:var(--text-body)}
.imp-d-ex-num--done{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.imp-d-ex-num--active{border:2px solid var(--num-on);color:var(--num-on)}
.imp-d-ex-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.imp-d-ex-title{font:600 14px/1.3 var(--font-ui);color:var(--text-heading)}
.imp-d-ex-meta{font:400 11px/1 var(--font-ui);color:var(--text-body)}
.imp-d-ex-desc{margin:0;font:400 12.5px/1.5 var(--font-ui);color:var(--text-body);text-wrap:pretty}
.imp-d-ex-points{display:flex;flex-direction:column;gap:5px;margin-top:2px}
.imp-d-ex-point{display:flex;align-items:flex-start;gap:8px;font:400 12px/1.4 var(--font-ui);color:var(--text-body)}
.imp-d-ex-point::before{content:"";flex:0 0 auto;width:4px;height:4px;margin-top:7px;border-radius:var(--radius-pill);background:var(--num-on)}
.imp-d-timer{display:flex;align-items:baseline;gap:9px;padding:8px 12px;border-radius:var(--radius-timer);background:var(--module-bg);border:1px solid var(--card-border)}
.imp-d-timer-value{font:400 var(--timer-size)/1 var(--font-display);color:var(--text-heading)}
.imp-d-timer-meta{font:400 12px/1 var(--font-ui);color:var(--text-body)}
.imp-d-progress{height:var(--progress-h);border-radius:4px;background:var(--ring-track);overflow:hidden}
.imp-d-progress-fill{display:block;height:100%;background:var(--num-on)}
.imp-d-btn-primary{display:flex;align-items:center;justify-content:center;width:100%;min-height:var(--btn-height);border-radius:var(--radius-btn);background:var(--lime);border:var(--btn-border);color:var(--ink);font:600 15px/1 var(--font-ui);text-decoration:none;box-shadow:0 14px 34px rgba(var(--lime-rgb),.22);transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-d-btn-primary:hover{background:var(--violet);color:var(--paper);border-color:var(--lime)}
.imp-d-btn-primary[disabled]{background:var(--hint-idle-bg);border:1px solid var(--hint-idle-border);color:var(--text-meta);box-shadow:none;cursor:not-allowed}
.imp-d-btn-outline{display:flex;align-items:center;justify-content:center;width:100%;min-height:var(--btn-height);border-radius:var(--radius-btn);background:transparent;border:1px solid var(--btn-outline-border);color:var(--btn-outline-text);font:600 14px/1 var(--font-ui);text-decoration:none;transition:border-color 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1)}
.imp-d-btn-outline:hover{border-color:var(--text-accent);color:var(--text-accent)}
.imp-d-btn-ghost{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;border-radius:var(--radius-chip);background:none;color:var(--text-body);font:500 13.5px/1 var(--font-ui);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-d-btn-ghost:hover{color:var(--text-heading)}
.imp-d-btn-stack{display:flex;flex-direction:column;gap:6px}
.imp-d-scrim{position:fixed;inset:0;z-index:5;background:var(--scrim)}
.imp-d-sheet{position:fixed;z-index:7;left:0;right:0;bottom:0;padding:var(--sheet-pad);border-radius:var(--radius-sheet);background:var(--sheet-bg);border:1px solid var(--sheet-border);box-shadow:var(--sheet-shadow)}
.imp-d-sheet-handle{display:block;width:44px;height:4px;margin:0 auto 14px;border-radius:var(--radius-pill);background:var(--sheet-handle)}
.imp-d-sheet-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}
.imp-d-sheet-meta{font:400 11px/1 var(--font-ui);color:var(--text-meta)}
.imp-d-sheet-title{margin:0;font:700 21px/1.25 var(--font-ui);color:var(--text-heading);text-wrap:pretty}
.imp-d-sheet-lead{margin:8px 0 0;font:400 12.5px/1.55 var(--font-ui);color:var(--text-body);text-wrap:pretty}
.imp-d-scale{display:flex;align-items:flex-end;gap:var(--scale-gap);height:var(--scale-col-h)}
.imp-d-scale-col{flex:1;height:var(--scale-col-h);display:flex;align-items:flex-end;background:none;border:none;padding:0}
.imp-d-bar{width:100%;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;border-radius:var(--bar-radius);border:1px solid var(--bar-off-border);background:var(--bar-off-bg);color:var(--bar-off-fg);font:600 var(--bar-font)/1 var(--font-ui);transition:background 200ms cubic-bezier(.4,0,.2,1),border-color 200ms cubic-bezier(.4,0,.2,1),color 200ms cubic-bezier(.4,0,.2,1),transform 260ms cubic-bezier(.34,1.56,.64,1),box-shadow 260ms cubic-bezier(.4,0,.2,1)}
.imp-d-scale-col:hover .imp-d-bar{border-color:var(--bar-hover-border)}
.imp-d-bar--under{background:var(--bar-under-bg);border-color:var(--bar-under-border);color:var(--bar-under-fg)}
.imp-d-bar--on{background:var(--bar-on-bg);border-color:var(--bar-on-border);color:var(--bar-on-fg);box-shadow:var(--bar-on-shadow)}
.imp-d-scale-col:nth-child(1) .imp-d-bar{height:30%}
.imp-d-scale-col:nth-child(2) .imp-d-bar{height:37%}
.imp-d-scale-col:nth-child(3) .imp-d-bar{height:44%}
.imp-d-scale-col:nth-child(4) .imp-d-bar{height:51%}
.imp-d-scale-col:nth-child(5) .imp-d-bar{height:58%}
.imp-d-scale-col:nth-child(6) .imp-d-bar{height:65%}
.imp-d-scale-col:nth-child(7) .imp-d-bar{height:72%}
.imp-d-scale-col:nth-child(8) .imp-d-bar{height:79%}
.imp-d-scale-col:nth-child(9) .imp-d-bar{height:86%}
.imp-d-scale-col:nth-child(10) .imp-d-bar{height:94%}
.imp-d-scale-legend{display:flex;align-items:center;justify-content:space-between;font:400 11.5px/1 var(--font-ui);color:var(--text-meta)}
.imp-d-hint{display:flex;align-items:center;min-height:48px;padding:11px 14px;border-radius:var(--radius-chip);background:var(--hint-bg);border:1px solid var(--hint-border);font:400 12px/1.45 var(--font-ui);color:var(--hint-fg)}
.imp-d-hint--idle{background:var(--hint-idle-bg);border-color:var(--hint-idle-border);color:var(--hint-idle-fg)}
.imp-d-scale-block{display:flex;flex-direction:column;gap:11px;margin-top:16px}
.imp-d-result-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color);margin-bottom:6px}
.imp-d-result-title{margin:0;font:400 var(--result-title-size)/.86 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-d-result-hand{position:fixed;z-index:6;left:-26px;bottom:302px;height:var(--hand-mobile-h);width:auto;pointer-events:none;filter:var(--hand-glow)}
.imp-d-stat-boxes{display:flex;gap:8px;margin-top:16px}
.imp-d-stat-box{flex:1;padding:11px 13px;border-radius:var(--radius-chip);background:var(--box-bg);border:1px solid var(--box-border)}
.imp-d-stat-box-value{font:400 26px/1 var(--font-display);color:var(--text-heading)}
.imp-d-stat-box-value--accent{color:var(--num-on)}
.imp-d-stat-box-label{font:400 10px/1.3 var(--font-ui);color:var(--text-body);margin-top:3px}
.imp-d-verdict{display:flex;align-items:center;gap:9px;min-height:44px;margin-top:8px;padding:0 13px;border-radius:var(--radius-chip);background:var(--verdict-bg);border:1px solid var(--verdict-border);font:600 12.5px/1.3 var(--font-ui);color:var(--verdict-fg)}
.imp-d-verdict svg{flex:0 0 auto}
@media (min-width:1024px){
.imp-d-appbar{display:none}
.imp-d-session-view{padding:104px 140px 24px;gap:20px}
.imp-d-session-foot{padding:0 140px 40px;max-width:520px}
.imp-d-ex-list{gap:12px}
.imp-d-timer-value{font-size:var(--timer-desktop-size)}
.imp-d-sheet{position:fixed;left:50%;top:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);width:var(--result-card-w);padding:var(--modal-pad);border-radius:var(--radius-modal);box-shadow:var(--modal-shadow)}
.imp-d-sheet-handle{display:none}
.imp-d-sheet-title{font-size:26px}
.imp-d-sheet-lead{font-size:13.5px}
.imp-d-scale-legend{font-size:12.5px}
.imp-d-hint{min-height:52px;font-size:12.5px}
.imp-d-sheet--result{height:var(--result-card-h);overflow:hidden;display:flex;flex-direction:column}
.imp-d-sheet--result .imp-d-result-hand{position:absolute;left:2px;bottom:-84px;height:var(--hand-desktop-h)}
.imp-d-sheet--result .imp-d-result-col{position:relative;z-index:2;margin:auto 0 0 auto;width:308px;display:flex;flex-direction:column;gap:8px}
.imp-d-sheet--result .imp-d-stat-boxes{margin-top:0}
.imp-d-sheet--result .imp-d-verdict{margin-top:0}
.imp-d-result-title{font-size:var(--result-title-desktop-size)}
}

/* ===== d-lokalny.css -> prefiks .imp-d ===== */
.imp-d-d-glow-v{top:-140px;right:-120px;width:440px;height:440px;background:var(--glow-violet)}
.imp-d-d-glow-l{bottom:-160px;left:-140px;width:380px;height:380px;background:var(--glow-lime)}
.imp-d-d-gfx{bottom:-150px;right:-110px;width:380px}
.imp-d-page{display:flex;flex-direction:column;min-height:100vh}
.imp-d-session-view{flex:1;min-height:0;overflow-y:auto}
@media (min-width:1024px){
.imp-d-d-glow-v{top:-220px;right:-180px;width:680px;height:680px}
.imp-d-d-glow-l{bottom:-240px;left:-200px;width:560px;height:560px}
.imp-d-d-gfx{bottom:-220px;right:-100px;width:620px}
.imp-d-session-view{overflow:visible}
.imp-d-session-grid{display:grid;grid-template-columns:1fr 380px;gap:22px;align-items:start}
}


/* ---- PRZEKŁADY makieta -> żywa strona (Krok 2 instrukcji) ---------------- */

/* Ekran sesji nie ma dolnej nawigacji ani belki na telefonie (jest własny
   appbar z „Przerwij") — decyzja właściciela z 29 sierpnia 2026: w trakcie
   sesji pasek nawigacji rozprasza.

   Stopka („Zakończ sesję" + podpis) siedzi u nas w kolumnie z ćwiczeniami,
   nie na końcu strony (decyzja właściciela z 31 sierpnia 2026), więc gubi
   marginesy strony i to treść bierze zapas na pasek gestów. */
.imp-d-session-foot{padding:4px 0 0;max-width:none}
.imp-d-session-view{padding-bottom:calc(20px + env(safe-area-inset-bottom))}
@media (min-width:1024px){
  .imp-d-session-foot{padding:4px 0 0;max-width:none}
  .imp-d-session-view{padding-bottom:calc(40px + env(safe-area-inset-bottom))}
}

/* 100dvh zamiast 100vh — skaczący pasek adresu w Safari; z zapasem dla
   przeglądarek bez dvh. Bez overflow:clip, bo arkusz jest position:fixed. */
.imp-d-page{min-height:100vh;min-height:100dvh}

/* Belka desktopowa: sticky zamiast absolute, jak w pozostałych obszarach. */
@media (min-width:1024px){
  .imp-d-topbar{position:sticky;top:16px;margin:16px 24px 0;left:auto;right:auto}
  .imp-d-session-view{padding-top:24px}
}

/* [hidden] vs jawny display komponentów — arkusz, zasłona i stany ćwiczeń
   chowa i pokazuje JS, więc atrybut musi wygrywać. */
.imp-d [hidden],.imp-d-scrim[hidden],.imp-d-sheet[hidden],.imp-d-result-hand[hidden]{display:none}

/* Dłoń wyniku i zasłona są position:fixed, więc żyją poza .imp-d — reguła
   musi działać także wtedy, gdy element jest bezpośrednio w <body>. */

/* Elementy, których eksport nie pokazuje, a brief ich wymaga (stan
   „wznowiono", błąd audio, „oznacz jako zrobione", okienko „najpierw
   ocena"). Zbudowane z komponentów tego eksportu — bez nowych bytów.
   Tu tylko drobiazgi, których w komponentach nie było. */
.imp-d-ex-collapse{display:contents}
.imp-d-ex-toggle{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:none;border:none;padding:0;cursor:pointer}
.imp-d-btn-mark{background:none;border:none;padding:0;min-height:44px;font:600 13px/1 var(--font-ui);color:var(--text-accent);cursor:pointer}
.imp-d-btn-mark:hover{text-decoration:underline}

/* ---- inline style z eksportu -> klasy (Krok 3 pkt 3) ---------------------
   sesja.html trzyma odstępy kolumn w atrybucie style; przenoszę je na klasy,
   bo wartości wpisane w widok są zakazane. */
.imp-d-col-main{gap:12px}
.imp-d-col-prep{gap:8px}
.imp-d-col-ex{gap:9px}
/* Układ jednokolumnowy (poniżej 1024px): odstęp między kolumną filmu
   a nagłówkiem „MODUŁ · SESJA · WARIANT" — większy niż przerwy między
   kartami niżej (właściciel, 1.09.2026). MUSI siedzieć w media query:
   goła reguła stała w kaskadzie za desktopową i nadpisywała jej
   display:grid — desktop zjeżdżał do jednej kolumny (naprawa 1.09.2026). */
@media (max-width:1023.98px){
  .imp-d-session-grid{display:flex;flex-direction:column;gap:18px}
}

/* ---- elementy, których eksport nie rysuje, a mechanika ich wymaga --------
   Makieta pokazuje jedno ćwiczenie rozwinięte i dwa zwinięte jako gotowe
   stany. U nas ten sam element przechodzi między stanami, więc treść
   rozwinięta („detale") i sterowanie („panel") to osobne pojemniki. Oba
   dziedziczą geometrię z .ex--active — nic nowego wizualnie. */
.imp-d-ex-detale{display:flex;flex-direction:column;gap:5px}
.imp-d-ex-panel{display:flex;flex-direction:column;gap:11px}
.imp-d-ex > .imp-d-ex-row{flex:1;min-width:0}
.imp-d-ex--active > .imp-d-ex-row{align-items:flex-start}

/* Tytuł ćwiczenia rozwija i zwija — musi być przyciskiem (klawiatura,
   czytnik ekranu), a wyglądać dokładnie jak .ex-title z eksportu. */
button.imp-d-ex-title{background:none;border:none;padding:0;text-align:left;cursor:pointer}
button.imp-d-ex-title:hover{color:var(--text-accent)}

/* Odtwarzacz Bunny w ramce filmu: iframe zamiast atrapy .video-card. */
.imp-d-video-frame .video-embed{width:100%;aspect-ratio:16/9;border:0;border-radius:var(--radius-video);background:var(--module-bg)}
.imp-d-video-frame .video-placeholder{width:100%;aspect-ratio:16/9;border-radius:var(--radius-video)}

/* Skala oceny: słupki to radio + label, żeby wybór działał bez JS
   (`required` nie pozwala wysłać pustej oceny). Input jest niewidoczny,
   ale wciąż dostępny z klawiatury — obwódkę pokazuje słupek. */
.imp-d-scale-col{cursor:pointer}
.imp-d-scale-input{position:absolute;width:1px;height:1px;opacity:0;margin:0;pointer-events:none}
.imp-d-scale-input:focus-visible + .imp-d-bar{outline:2px solid var(--text-accent);outline-offset:2px}
/* Bez JS zaznaczony słupek i tak się wyróżnia — te same wartości co --on. */
.imp-d-scale-input:checked + .imp-d-bar{border-color:var(--bar-on-border);background:var(--bar-on-bg);color:var(--bar-on-fg);box-shadow:var(--bar-on-shadow)}

/* Arkusz oceny ma dwa przyciski jeden pod drugim, tak jak w makiecie. */
.imp-d-btn-stack--rate{margin-top:5px}

/* Zasłona i arkusz są position:fixed — muszą leżeć nad treścią strony
   niezależnie od tego, gdzie w drzewie stoją. Dłoni tu NIE ma: na
   desktopie jest pozycjonowana wewnątrz karty (position:absolute
   z eksportu), a wymuszenie fixed wyrzucało ją poza kartę. */
.imp-d-scrim,.imp-d-sheet{position:fixed}
.imp-d-sheet--result{position:fixed}

/* Ptaszek „zrobione" zastępuje numer w kółku — JS podmienia go z numerem.
   Eksport ma go tylko w gotowym stanie .ex-num--done, więc klasa na samym
   svg jest nasza; nic nie stylizuje, służy do znalezienia elementu. */
.imp-d-ex-check{display:block}

/* Arkusz oceny bez JS: kotwica #arkusz-oceny odsłania go, „Wróć do sesji"
   (kotwica ekranu) chowa. Z JS to samo robi skrypt — te reguły są dla
   przeglądarki bez skryptów, żeby sesję dało się zakończyć zawsze. */
.imp-d-sheet[hidden]:target{display:block}
.imp-d-sheet[hidden]:target ~ .imp-d-scrim[hidden]{display:block}

/* Cała zwinięta karta ćwiczenia jest klikalna i reaguje na kursor —
   celowanie w sam tytuł było za trudne (uwaga właściciela, 31 sierpnia
   2026). Karta rozwinięta nie kusi kliknięciem: sama się nie zwija. */
.imp-d-ex{cursor:pointer;transition:border-color 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-d-ex:hover{border-color:var(--ex-active-border);background:var(--ex-active-bg)}
.imp-d-ex--active,.imp-d-ex--active:hover{cursor:default}


/* ==========================================================================
   OBSZAR E — START, META, TEST POMIAROWY, WYNIKI, KARTA
   Import "drogą 4" (docs/instrukcja-importu-widokow.md), 31 sierpnia 2026.
   Źródło: HTML DO WDROŻENIA/obszar E/ (tokens.css + components.css +
   osiem plików HTML + README-eksport.md).

   Prefiks obszaru: .imp-e — na gołym prefiksie żyją tokeny.

   ODSTĘPSTWO OD POPRZEDNICH IMPORTÓW, ŚWIADOME: bloki <style> ośmiu
   ekranów definiują TE SAME klasy geometrii tła (.glow--a, .glow--b,
   .gfx--cross, .gfx--spiral) z RÓŻNYMI wartościami — w siedmiu ekranach
   naraz. Sam prefiks obszaru by nie wystarczył: ostatnia wklejona sekcja
   wygrywałaby dla wszystkich ekranów i poświaty wylądowałyby w złych
   miejscach. Dlatego każdy blok ekranowy jest dodatkowo zakresowany
   klasą .imp-e-ekran-<nazwa>, którą nosi najbardziej zewnętrzny element
   widoku: class="imp-e imp-e-page imp-e-ekran-start". Zakres dokłada
   skrypt, nie człowiek — wartości nietknięte.
   ========================================================================== */

/* ===== tokens.css -> prefiks .imp-e ===== */
.imp-e{--ink-rgb:28,28,30;
  --paper-rgb:251,251,251;
  --violet-rgb:112,0,255;
  --lime-rgb:203,255,0;

  --ink:#1C1C1E;
  --paper:#FBFBFB;
  --violet:#7000FF;
  --violet-hover:#5800CC;
  --lime:#CBFF00;

  --font-ui:'Inter',system-ui,sans-serif;
  --font-display:'VT323',monospace;
  --font-hand:'Caveat',cursive;
  --tracking-eyebrow:.16em;

  --radius-card:24px;
  --card-padding:24px 22px;
  --input-height:48px;
  --input-radius:16px;
  --radius-btn:16px;
  --input-padding-x:16px;
  --input-font-size:14px;
  --form-gap:16px;
  --btn-height:52px;
  --btn-font-size:16px;
  --btn-border:2px solid transparent;
  --radius-pill:999px;
  --radius-checkbox:7px;
  --eyebrow-size:10px;
  --title-card-size:38px;
  --title-hero-size:78px;
  --hand-size:18px;
  --logo-size:44px;
  --avatar-size:64px;
  --name-size:34px;

  
  --day-chip:44px;
  --radius-module:20px;
  --radius-chip:16px;
  --module-num-size:40px;
  --variant-name-size:22px;

  

  
  --bg:#1C1C1E;
  --text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --text-accent:#B98CFF;          
  --eyebrow-color:var(--lime);    
  --card-border:rgba(var(--paper-rgb),.15);
  --card-border-top:rgba(255,255,255,.5);
  --card-bg:rgba(var(--ink-rgb),.45);
  --card-blur:44px;
  --card-saturate:1.9;
  --card-shadow:0 24px 64px rgba(0,0,0,.4),0 8px 24px rgba(var(--violet-rgb),.22);

  
  --card-bg-1:rgba(var(--ink-rgb),.45);   --card-blur-1:48px; --card-saturate-1:2;
  --card-bg-2:rgba(var(--ink-rgb),.45);   --card-blur-2:48px; --card-saturate-2:2;
  --card-bg-3:rgba(var(--paper-rgb),.05);
  --card-bg-4:rgba(var(--paper-rgb),.04);
  --glass-border:rgba(255,255,255,.18);
  --glass-border-top:rgba(255,255,255,.55);
  --shadow-glass:0 24px 64px rgba(0,0,0,.35),0 8px 24px rgba(var(--violet-rgb),.25),inset 0 1px 0 rgba(255,255,255,.5);
  --ring-track:rgba(var(--paper-rgb),.14);
  --divider:rgba(var(--paper-rgb),.12);
  --input-bg:rgba(var(--paper-rgb),.06);
  --input-border:rgba(var(--paper-rgb),.24);
  --btn-outline-border:rgba(var(--paper-rgb),.3);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.58;
  --gfx-fluid:.42;
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.45),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.14),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#242427;}
:root[data-theme="light"] .imp-e{--bg:#FBFBFB;
  --text-heading:#1C1C1E;
  --text-body:#6B6870;
  --text-meta:#9A97A0;
  --text-accent:#7000FF;          
  --eyebrow-color:var(--violet);  
  --card-border:rgba(var(--ink-rgb),.1);
  --card-border-top:rgba(255,255,255,.95);
  --card-bg:rgba(255,255,255,.45);
  --card-blur:19px;
  --card-saturate:1.4;
  --card-shadow:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);

  
  --card-bg-1:rgba(var(--paper-rgb),.45); --card-blur-1:22px; --card-saturate-1:1.6;
  --card-bg-2:rgba(var(--paper-rgb),.45); --card-blur-2:22px; --card-saturate-2:1.5;
  --card-bg-3:rgba(255,255,255,.55);
  --card-bg-4:rgba(var(--ink-rgb),.02);
  --glass-border:rgba(255,255,255,.5);
  --glass-border-top:rgba(255,255,255,.8);
  --shadow-glass:0 24px 64px rgba(var(--ink-rgb),.18),0 8px 24px rgba(var(--violet-rgb),.22),inset 0 1px 0 rgba(255,255,255,.7);
  --ring-track:rgba(var(--ink-rgb),.1);
  --divider:rgba(var(--ink-rgb),.07);
  --input-bg:#fff;
  --input-border:rgba(var(--ink-rgb),.14);
  --btn-outline-border:rgba(var(--ink-rgb),.16);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.42;
  --gfx-fluid:.14;
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.08),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.1),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#F1EEF7;}
.imp-e-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
:root[data-theme="light"] .imp-e-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
@media (min-width:1024px){
.imp-e{--radius-card:26px;
    --card-padding:34px 32px;
    --input-height:50px;
    --input-padding-x:18px;
    --input-font-size:15px;
    --form-gap:18px;
    --btn-height:54px;
    --title-card-size:42px;
    --title-hero-size:88px;
    --hand-size:26px;
    --logo-size:56px;
    --avatar-size:88px;
    --name-size:56px;
    --day-chip:36px;
    --radius-module:18px;}
:root[data-theme="light"] .imp-e{--shadow-glass:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);}
}
@media (prefers-reduced-motion: reduce){
:where(.imp-e), :where(.imp-e) *{transition:none !important; animation:none !important;}
}
@media (prefers-reduced-transparency: reduce){
.imp-e{--card-bg:var(--glass-fallback-bg);
    --card-blur:0px;
    --card-saturate:1;}
.imp-e-card{backdrop-filter:none; -webkit-backdrop-filter:none;}
}
.imp-e{--day-done-bg:var(--violet);         --day-done-fg:var(--paper);
  --day-sel-bg:var(--lime);            --day-sel-fg:var(--ink);
  --day-sel-ring:0 0 0 4px rgba(var(--lime-rgb),.22);
  --day-off-bg:rgba(var(--paper-rgb),.06);
  --day-off-border:rgba(var(--paper-rgb),.16);
  --day-off-fg:var(--text-meta);
  --module-bg:#272729;
  --module-shadow:0 6px 18px rgba(var(--ink-rgb),.05);
  --module-on-bg:var(--violet);
  --module-on-shadow:0 16px 40px rgba(var(--violet-rgb),.35);
  --status-done-bg:rgba(var(--lime-rgb),.18);  --status-done-fg:var(--lime);
  --status-now-bg:rgba(185,140,255,.22);       --status-now-fg:#B98CFF;
  --status-next-bg:rgba(var(--paper-rgb),.1);  --status-next-fg:var(--text-body);
  --edge-bg:rgba(185,140,255,.07);   --edge-border:rgba(185,140,255,.32);
  --edge-on-bg:rgba(185,140,255,.16);--edge-on-border:#B98CFF;
  --day-progress:#B98CFF;            
  --danger:#FF8A80; --danger-fg:var(--ink);
  --danger-bg:rgba(227,28,65,.12); --danger-border:rgba(255,107,107,.4);}
:root[data-theme="light"] .imp-e{--day-off-bg:rgba(var(--ink-rgb),.05);
  --day-off-border:rgba(var(--ink-rgb),.12);
  --day-off-fg:#8B8792;
  --day-sel-ring:0 0 0 4px #F1E5FF;
  --module-bg:#FFFFFF;
  --module-shadow:0 6px 18px rgba(var(--ink-rgb),.06);
  --module-on-shadow:0 16px 40px rgba(var(--violet-rgb),.22);
  --status-done-bg:rgba(var(--lime-rgb),.3);   --status-done-fg:#3F4A00;
  --status-now-bg:rgba(var(--violet-rgb),.1);  --status-now-fg:var(--violet);
  --status-next-bg:rgba(var(--ink-rgb),.05);   --status-next-fg:var(--text-body);
  --edge-bg:rgba(var(--violet-rgb),.04);   --edge-border:rgba(var(--violet-rgb),.28);
  --edge-on-bg:rgba(var(--violet-rgb),.09);--edge-on-border:var(--violet);
  --danger:#B03A2E; --danger-fg:var(--paper);
  --danger-bg:rgba(227,28,65,.06); --danger-border:rgba(227,28,65,.28);}
.imp-e{--radius-glass:18px;      
  --radius-session:20px;    
  --radius-video:16px;
  --radius-variant:15px;
  --radius-nav-item:14px;
  --radius-topbar:20px;
  --variant-height:46px;
  --start-height:50px;
  --daybar-seg:7px;
  --daybar-gap:5px;
  --video-max:820px;
  --title-view-size:54px;
  --stat-value-size:30px;
  --variant-title-size:21px;
  --glass-pad:18px 20px;
  --session-pad:20px 22px;}
.imp-e{--radius-exercise:16px;
  --radius-sheet:28px;
  --radius-modal:28px;
  --radius-timer:14px;
  --topbar-mobile-h:56px;
  --exercise-pad:13px 14px;
  --timer-size:34px;
  --timer-desktop-size:44px;
  --result-title-size:58px;
  --result-title-desktop-size:72px;
  --result-card-h:492px;
  --result-card-w:600px;
  --hand-mobile-h:340px;
  --hand-desktop-h:330px;
  --scale-col-h:99px;
  --scale-gap:8px;
  --bar-radius:11px 11px 8px 8px;
  --bar-font:12.5px;
  --sheet-pad:10px 20px 22px;
  --modal-pad:32px 34px 28px;
  --progress-h:5px;

  
  --bar-off-bg:#241E31;
  --bar-off-border:rgba(var(--paper-rgb),.22);
  --bar-off-fg:var(--text-meta);
  --bar-under-bg:#4A1BA6;
  --bar-under-border:rgba(185,140,255,.65);
  --bar-under-fg:var(--paper);
  --bar-on-bg:var(--lime);
  --bar-on-border:var(--lime);
  --bar-on-fg:var(--ink);
  --bar-on-shadow:0 0 0 6px rgba(var(--lime-rgb),.16),0 10px 26px rgba(var(--lime-rgb),.3);
  --bar-hover-border:var(--lime);

  
  --sheet-bg:linear-gradient(180deg,rgba(43,33,62,.98),#1C1C1E);
  --sheet-border:rgba(185,140,255,.45);
  --sheet-shadow:0 0 0 1px rgba(185,140,255,.12),0 -30px 90px rgba(var(--violet-rgb),.45);
  --modal-shadow:0 0 0 1px rgba(185,140,255,.12),0 40px 110px rgba(var(--violet-rgb),.45),inset 0 1px 0 rgba(255,255,255,.14);
  --sheet-handle:rgba(var(--paper-rgb),.28);
  --scrim:rgba(10,10,12,.78);
  --box-bg:rgba(var(--paper-rgb),.05);
  --box-border:rgba(var(--paper-rgb),.12);
  --verdict-bg:rgba(185,140,255,.14);
  --verdict-border:rgba(185,140,255,.38);
  --verdict-fg:#E5D5FF;
  --hint-bg:rgba(var(--lime-rgb),.09);
  --hint-border:rgba(var(--lime-rgb),.32);
  --hint-fg:#E7F5B0;
  --hint-idle-bg:rgba(var(--paper-rgb),.05);
  --hint-idle-border:rgba(var(--paper-rgb),.1);
  --hint-idle-fg:var(--text-body);
  --ex-active-bg:rgba(var(--paper-rgb),.07);
  --ex-active-border:rgba(var(--lime-rgb),.34);
  --ex-flat-bg:rgba(var(--paper-rgb),.04);
  --ex-flat-border:rgba(var(--paper-rgb),.12);
  --num-on:var(--lime);
  --hand-glow:drop-shadow(0 18px 40px rgba(var(--violet-rgb),.95)) drop-shadow(0 0 60px rgba(var(--violet-rgb),.55));}
:root[data-theme="light"] .imp-e{--bar-off-bg:#FFFFFF;
  --bar-off-border:rgba(var(--ink-rgb),.16);
  --bar-off-fg:#6B6870;
  --bar-under-bg:#B98CFF;
  --bar-under-border:rgba(var(--violet-rgb),.45);
  --bar-under-fg:#FFFFFF;
  --bar-on-bg:var(--violet);
  --bar-on-border:var(--violet);
  --bar-on-fg:var(--paper);
  --bar-on-shadow:0 0 0 6px rgba(var(--lime-rgb),.42),0 10px 26px rgba(var(--lime-rgb),.5);
  --bar-hover-border:var(--violet);

  --sheet-bg:linear-gradient(180deg,#FFFFFF,#F6F2FD);
  --sheet-border:rgba(var(--violet-rgb),.28);
  --sheet-shadow:0 0 0 1px rgba(var(--violet-rgb),.08),0 -30px 90px rgba(var(--violet-rgb),.28);
  --modal-shadow:0 0 0 1px rgba(var(--violet-rgb),.08),0 40px 110px rgba(var(--violet-rgb),.24),inset 0 1px 0 #FFFFFF;
  --sheet-handle:rgba(var(--ink-rgb),.18);
  --scrim:rgba(var(--ink-rgb),.45);
  --box-bg:rgba(var(--violet-rgb),.05);
  --box-border:rgba(var(--ink-rgb),.1);
  --verdict-bg:rgba(var(--violet-rgb),.06);
  --verdict-border:rgba(var(--violet-rgb),.24);
  --verdict-fg:var(--violet);
  --hint-bg:rgba(var(--violet-rgb),.06);
  --hint-border:rgba(var(--violet-rgb),.24);
  --hint-fg:#3A3740;
  --hint-idle-bg:rgba(var(--ink-rgb),.04);
  --hint-idle-border:rgba(var(--ink-rgb),.1);
  --hint-idle-fg:#6B6870;
  --ex-active-bg:rgba(255,255,255,.86);
  --ex-active-border:rgba(var(--violet-rgb),.28);
  --ex-flat-bg:rgba(255,255,255,.55);
  --ex-flat-border:rgba(var(--ink-rgb),.1);
  --num-on:var(--violet);
  --hand-glow:drop-shadow(0 18px 40px rgba(var(--violet-rgb),.85)) drop-shadow(0 0 60px rgba(var(--violet-rgb),.5));}
@media (min-width:1024px){
.imp-e{--exercise-pad:14px 18px;
    --timer-size:var(--timer-desktop-size);
    --result-title-size:var(--result-title-desktop-size);
    --scale-col-h:99px;}
}
@media (prefers-reduced-transparency: reduce){
.imp-e{--sheet-bg:var(--glass-fallback-bg);}
}
.imp-e{--radius-panel:18px;
  --radius-panel-desktop:20px;
  --e-rail-w:360px;
  --panel-pad:16px;
  --panel-pad-desktop:16px 18px;
  --title-e-size:40px;
  --title-e-desktop-size:54px;
  --lead-size:13.5px;
  --lead-desktop-size:14px;
  --metric-size:32px;
  --metric-desktop-size:40px;
  --sign-size:24px;
  --sign-desktop-size:26px;
  --step-num:24px;
  --step-num-desktop:26px;
  --len-name-size:21px;
  --len-name-desktop-size:24px;
  --acc-head-h:58px;
  --acc-head-h-desktop:60px;
  --acc-icon:32px;
  --acc-icon-desktop:34px;
  --acc-title-size:13.5px;
  --acc-title-desktop-size:15.5px;
  --card-title-size:16px;
  --card-title-desktop-size:19px;
  --dock-h:64px;

  
  --dot-size:26px;
  --sw-value-size:44px;
  --sw-value-desktop-size:64px;
  --numbox-value-size:40px;
  --numbox-value-desktop-size:54px;
  --tile-size:52px;
  --tile-desktop-size:96px;
  --radius-tile:12px;
  --radius-tile-desktop:14px;
  --fs-timer-size:104px;
  --fs-timer-desktop-size:168px;

  
  --cmp-name-size:13px;
  --cmp-value-size:15px;
  --trio-value-size:32px;
  --trio-value-desktop-size:44px;}
.imp-e{--panel-bg:var(--card-bg-3);
  --panel-border:var(--divider);
  --panel-flat-bg:var(--card-bg-4);
  --accent-tint-bg:rgba(185,140,255,.14);
  --accent-tint-border:rgba(185,140,255,.34);
  --accent-tint-fg:#B98CFF;
  --len-name-color:var(--lime);
  --tile-bg:#272729;
  --tile-border:rgba(var(--paper-rgb),.14);
  --tile-fg:var(--paper);
  --tile-done-bg:rgba(var(--paper-rgb),.03);
  --tile-done-border:rgba(var(--paper-rgb),.08);
  --tile-done-fg:#4A4650;
  --tile-next-bg:var(--violet);
  --tile-next-fg:var(--paper);
  --dot-bg:rgba(var(--paper-rgb),.08);
  --dot-fg:var(--text-meta);
  --dot-done-bg:#4A1BA6;
  --dot-done-fg:var(--paper);
  --dot-on-bg:var(--lime);
  --dot-on-fg:var(--ink);
  --fs-bg:radial-gradient(1000px 700px at 50% 45%,rgba(var(--violet-rgb),.5),rgba(10,10,12,.98) 72%),#0E0E10;
  --delta-good:var(--lime);
  --delta-bad:#FF8A80;
  --delta-wait:var(--text-meta);
  --card-out-bg:linear-gradient(180deg,rgba(43,33,62,.98),rgba(24,24,27,.99));}
:root[data-theme="light"] .imp-e{--panel-bg:var(--card-bg-3);
  --panel-border:rgba(var(--ink-rgb),.1);
  --panel-flat-bg:rgba(var(--ink-rgb),.02);
  --accent-tint-bg:rgba(var(--violet-rgb),.09);
  --accent-tint-border:rgba(var(--violet-rgb),.28);
  --accent-tint-fg:var(--violet);
  --len-name-color:var(--violet);
  --tile-bg:rgba(255,255,255,.55);
  --tile-border:rgba(var(--ink-rgb),.1);
  --tile-fg:var(--ink);
  --tile-done-bg:rgba(var(--ink-rgb),.02);
  --tile-done-border:rgba(var(--ink-rgb),.06);
  --tile-done-fg:#B4B1BA;
  --tile-next-bg:var(--violet);
  --tile-next-fg:var(--paper);
  --dot-bg:rgba(var(--ink-rgb),.06);
  --dot-fg:var(--text-meta);
  --dot-done-bg:var(--violet);
  --dot-done-fg:var(--paper);
  --dot-on-bg:var(--lime);
  --dot-on-fg:var(--ink);
  --fs-bg:radial-gradient(1000px 700px at 50% 45%,rgba(var(--violet-rgb),.12),rgba(var(--paper-rgb),.98) 72%),#FBFBFB;
  --delta-good:var(--violet);
  --delta-bad:#B03A2E;
  --delta-wait:var(--text-meta);
  --card-out-bg:linear-gradient(180deg,rgba(var(--violet-rgb),.06),rgba(var(--paper-rgb),.96));}
@media (min-width:1024px){
.imp-e{--radius-panel:var(--radius-panel-desktop);
    --panel-pad:var(--panel-pad-desktop);
    --title-e-size:var(--title-e-desktop-size);
    --lead-size:var(--lead-desktop-size);
    --metric-size:var(--metric-desktop-size);
    --sign-size:var(--sign-desktop-size);
    --step-num:var(--step-num-desktop);
    --len-name-size:var(--len-name-desktop-size);
    --acc-head-h:var(--acc-head-h-desktop);
    --acc-icon:var(--acc-icon-desktop);
    --acc-title-size:var(--acc-title-desktop-size);
    --card-title-size:var(--card-title-desktop-size);
    --sw-value-size:var(--sw-value-desktop-size);
    --numbox-value-size:var(--numbox-value-desktop-size);
    --tile-size:var(--tile-desktop-size);
    --radius-tile:var(--radius-tile-desktop);
    --fs-timer-size:var(--fs-timer-desktop-size);
    --trio-value-size:var(--trio-value-desktop-size);}
}
@media (prefers-reduced-transparency: reduce){
.imp-e{--card-out-bg:var(--glass-fallback-bg);}
}

/* ===== components.css -> prefiks .imp-e ===== */
:where(.imp-e), :where(.imp-e) *{box-sizing:border-box}
.imp-e{margin:0;padding:0}
.imp-e{display:block;background:var(--bg);font-family:var(--font-ui);color:var(--text-body);-webkit-font-smoothing:antialiased}
:where(.imp-e) a{color:var(--text-accent);text-decoration:none}
:where(.imp-e) a:hover{color:var(--violet-hover)}
:where(.imp-e) button{font-family:inherit;border:none;background:none;padding:0;cursor:pointer}
:where(.imp-e) img{max-width:100%}
.imp-e-page{position:relative;display:block;overflow:hidden;min-height:100vh;background:var(--bg);isolation:isolate}
.imp-e-glow{position:absolute;pointer-events:none;border-radius:50%;z-index:0}
.imp-e-gfx-glass{position:absolute;pointer-events:none;opacity:var(--gfx-glass);z-index:0}
.imp-e-logo{flex:none;width:var(--logo-size);height:var(--logo-size);object-fit:contain;display:block}
.imp-e-logo--light{display:none}
:root[data-theme="light"] .imp-e-logo--dark{display:none}
:root[data-theme="light"] .imp-e-logo--light{display:block}
.imp-e-topbar{display:none}
.imp-e-topbar-logo{flex:none;display:flex;align-items:center;gap:11px}
.imp-e-topbar-nav{display:flex;gap:4px}
.imp-e-nav-item{min-height:44px;display:flex;align-items:center;gap:9px;padding:0 16px;border-radius:var(--radius-nav-item);color:var(--text-body);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-e-nav-item:hover{color:var(--text-accent)}
.imp-e-nav-item span{font:600 13px/1 var(--font-ui)}
.imp-e-nav-item--active{background:var(--lime);color:var(--ink)}
.imp-e-nav-item--active:hover{color:var(--ink)}
.imp-e-topbar-end{margin-left:auto;display:flex;align-items:center;gap:8px}
.imp-e-c-view{position:relative;z-index:1;display:flex;flex-direction:column}
.imp-e-c-head{display:block}
.imp-e-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color)}
.imp-e-view-title{margin:0;font:400 var(--title-view-size)/.9 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-e-c-grid{display:grid;min-height:0}
.imp-e-c-col{display:flex;flex-direction:column;min-width:0;min-height:0}
.imp-e-c-rail{display:flex;flex-direction:column;min-width:0;min-height:0}
.imp-e-video-frame{display:flex}
.imp-e-video-card{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:var(--radius-video);background:var(--module-bg);border:1px solid var(--card-border);box-shadow:var(--module-shadow)}
.imp-e-video-card .imp-e-gfx-glass{position:absolute;top:-60px;right:-40px;width:200px;opacity:var(--gfx-fluid)}
.imp-e-video-inner{position:relative;display:flex;flex-direction:column;align-items:center;gap:14px}
.imp-e-video-play{display:grid;place-items:center;width:78px;height:78px;border-radius:var(--radius-pill);background:var(--lime)}
.imp-e-video-note{max-width:520px;text-align:center;font:400 13px/1.4 var(--font-ui);color:var(--text-body)}
.imp-e-video-spec{position:absolute;bottom:12px;right:14px;font:600 9.5px/1 var(--font-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--text-meta)}
.imp-e-stat-bar{display:flex;align-items:stretch;padding:var(--glass-pad);border-radius:var(--radius-glass);background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--card-border)}
.imp-e-stat-cell{flex:1;min-width:0;overflow:hidden;display:flex;flex-direction:column;gap:5px;padding-right:24px}
.imp-e-stat-cell + .imp-e-stat-cell{padding-left:24px;border-left:1px solid var(--divider)}
.imp-e-stat-cell:last-child{padding-right:0}
.imp-e-stat-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-e-stat-value{font:400 var(--stat-value-size)/1 var(--font-display);color:var(--text-heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-e-stat-value--accent{color:var(--text-accent)}
.imp-e-chip-links{display:flex;flex-direction:column;gap:8px}
.imp-e-chip-links--row{flex-direction:row}
.imp-e-chip-link{flex:1;min-width:0;min-height:44px;display:flex;align-items:center;gap:7px;padding:0 16px;border-radius:var(--radius-chip);border:1px solid var(--btn-outline-border);font:500 13px/1 var(--font-ui);color:var(--btn-outline-text);text-decoration:none;transition:background 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-e-chip-link:hover{background:rgba(var(--paper-rgb),.08);border-color:var(--text-accent)}
:root[data-theme="light"] .imp-e-chip-link:hover{background:rgba(var(--ink-rgb),.05)}
.imp-e-chip-link span{margin-left:auto;color:var(--text-accent)}
.imp-e-card--rail{display:block;padding:var(--glass-pad);border-radius:var(--radius-glass);background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--card-border)}
.imp-e-daybar-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px}
.imp-e-daybar-count{flex:0 1 auto;min-width:0;font:400 20px/1 var(--font-display);color:var(--day-progress);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-e-daybar{display:flex;gap:var(--daybar-gap)}
.imp-e-daybar-seg{flex:1;min-width:0;height:var(--daybar-seg);border-radius:var(--radius-pill);background:var(--ring-track)}
.imp-e-daybar-seg--done{background:var(--day-progress)}
.imp-e-session-card{display:block;padding:var(--session-pad);border-radius:var(--radius-session);background:var(--module-bg);border:1px solid var(--card-border);box-shadow:var(--module-shadow)}
.imp-e-session-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.imp-e-session-legend{flex:1;min-width:0;text-align:right;font:400 11px/1 var(--font-ui);color:var(--text-meta);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-e-session-rule{height:1px;background:var(--divider);margin:16px 0 14px}
.imp-e-session-label{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body);margin-bottom:12px}
.imp-e-day-chips{display:flex;gap:8px}
.imp-e-day-chip{flex:none;width:var(--day-chip);height:var(--day-chip);display:grid;place-items:center;border-radius:var(--radius-pill);border:2px solid var(--day-off-border);background:var(--day-off-bg);color:var(--day-off-fg);font:600 12px/1 var(--font-ui);transition:transform 120ms cubic-bezier(.4,0,.2,1)}
.imp-e-day-chip:hover{transform:translateY(-2px)}
.imp-e-day-chip--done{background:var(--day-done-bg);border-color:var(--day-done-bg);color:var(--day-done-fg)}
.imp-e-day-chip--selected{background:var(--day-sel-bg);border-color:var(--day-sel-bg);color:var(--day-sel-fg);box-shadow:var(--day-sel-ring)}
.imp-e-variants{display:flex;flex-direction:column;gap:8px}
.imp-e-variant{display:flex;align-items:center;gap:12px;width:100%;min-height:var(--variant-height);padding:11px 15px;overflow:hidden;border-radius:var(--radius-variant);border:1px solid var(--card-border);background:var(--input-bg);text-align:left;transition:transform 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-e-variant:hover{transform:translateY(-2px)}
.imp-e-variant-name{flex:none;font:400 var(--variant-title-size)/1 var(--font-display);color:var(--text-heading)}
.imp-e-variant-desc{flex:1;min-width:0;font:400 12.5px/1.35 var(--font-ui);color:var(--text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-e-variant-time{flex:none;font:600 13px/1 var(--font-ui);color:var(--text-heading);white-space:nowrap}
.imp-e-variant--selected{background:var(--violet);border-color:var(--violet)}
.imp-e-variant--selected .imp-e-variant-name,.imp-e-variant--selected .imp-e-variant-time{color:var(--paper)}
.imp-e-variant--selected .imp-e-variant-desc{color:#E4DDF7}
.imp-e-btn-start{display:flex;align-items:center;justify-content:center;gap:10px;min-height:var(--start-height);border-radius:var(--radius-nav-item);background:var(--lime);border:var(--btn-border);color:var(--ink);font:600 15px/1 var(--font-ui);text-decoration:none;transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-e-btn-start:hover{background:var(--violet);color:var(--paper);border-color:var(--lime)}
@media (min-width:1024px){
.imp-e-video-frame{flex:1;min-height:0;align-items:flex-start}
.imp-e-video-card{max-height:100%}
.imp-e-topbar{position:absolute;top:16px;left:24px;right:24px;z-index:3;display:flex;align-items:center;gap:24px;padding:10px 14px 10px 18px;border-radius:var(--radius-topbar);background:var(--card-bg-2);backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));-webkit-backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
}
.imp-e-appbar{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 16px;min-height:var(--topbar-mobile-h);background:var(--card-bg-2);backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));-webkit-backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));border-bottom:1px solid var(--card-border)}
.imp-e-appbar-back{display:flex;align-items:center;min-height:44px;font:400 13px/1 var(--font-ui);color:var(--text-body);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-e-appbar-back:hover{color:var(--text-accent)}
.imp-e-appbar-title{font:600 12.5px/1 var(--font-ui);color:var(--text-heading)}
.imp-e-badge-variant{padding:5px 9px;border-radius:8px;background:var(--status-now-bg);font:600 10.5px/1 var(--font-ui);letter-spacing:.06em;color:var(--status-now-fg)}
.imp-e-session-view{position:relative;z-index:1;display:flex;flex-direction:column;gap:12px;padding:14px 16px 0;flex:1;min-height:0}
.imp-e-session-foot{position:relative;z-index:1;display:flex;flex-direction:column;gap:5px;padding:10px 16px 14px}
.imp-e-session-note{text-align:center;font:400 11px/1 var(--font-ui);color:var(--text-body)}
.imp-e-sec-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body)}
.imp-e-props{display:flex;flex-wrap:wrap;gap:8px}
.imp-e-prop{display:flex;flex:0 0 auto;align-items:center;min-height:34px;padding:0 12px;border-radius:var(--radius-chip);background:var(--ex-flat-bg);border:1px dashed var(--input-border);font:400 11.5px/1 var(--font-ui);color:var(--text-body)}
.imp-e-ex-list{display:flex;flex-direction:column;gap:9px}
.imp-e-ex{padding:var(--exercise-pad);border-radius:var(--radius-exercise);background:var(--ex-flat-bg);border:1px solid var(--ex-flat-border);display:flex;align-items:center;gap:10px}
.imp-e-ex--done{opacity:.6}
.imp-e-ex--active{flex-direction:column;align-items:stretch;gap:11px;background:var(--ex-active-bg);border-color:var(--ex-active-border)}
.imp-e-ex-row{display:flex;align-items:flex-start;gap:10px}
.imp-e-ex-num{flex:0 0 auto;width:22px;height:22px;display:grid;place-items:center;border-radius:7px;border:1px solid var(--input-border);font:600 11px/1 var(--font-ui);color:var(--text-body)}
.imp-e-ex-num--done{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.imp-e-ex-num--active{border:2px solid var(--num-on);color:var(--num-on)}
.imp-e-ex-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.imp-e-ex-title{font:600 14px/1.3 var(--font-ui);color:var(--text-heading)}
.imp-e-ex-meta{font:400 11px/1 var(--font-ui);color:var(--text-body)}
.imp-e-ex-desc{margin:0;font:400 12.5px/1.5 var(--font-ui);color:var(--text-body);text-wrap:pretty}
.imp-e-ex-points{display:flex;flex-direction:column;gap:5px;margin-top:2px}
.imp-e-ex-point{display:flex;align-items:flex-start;gap:8px;font:400 12px/1.4 var(--font-ui);color:var(--text-body)}
.imp-e-ex-point::before{content:"";flex:0 0 auto;width:4px;height:4px;margin-top:7px;border-radius:var(--radius-pill);background:var(--num-on)}
.imp-e-timer{display:flex;align-items:baseline;gap:9px;padding:8px 12px;border-radius:var(--radius-timer);background:var(--module-bg);border:1px solid var(--card-border)}
.imp-e-timer-value{font:400 var(--timer-size)/1 var(--font-display);color:var(--text-heading)}
.imp-e-timer-meta{font:400 12px/1 var(--font-ui);color:var(--text-body)}
.imp-e-progress{height:var(--progress-h);border-radius:4px;background:var(--ring-track);overflow:hidden}
.imp-e-progress-fill{display:block;height:100%;background:var(--num-on)}
.imp-e-btn-primary{display:flex;align-items:center;justify-content:center;width:100%;min-height:var(--btn-height);border-radius:var(--radius-btn);background:var(--lime);border:var(--btn-border);color:var(--ink);font:600 15px/1 var(--font-ui);text-decoration:none;box-shadow:0 14px 34px rgba(var(--lime-rgb),.22);transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-e-btn-primary:hover{background:var(--violet);color:var(--paper);border-color:var(--lime)}
.imp-e-btn-primary[disabled]{background:var(--hint-idle-bg);border:1px solid var(--hint-idle-border);color:var(--text-meta);box-shadow:none;cursor:not-allowed}
.imp-e-btn-outline{display:flex;align-items:center;justify-content:center;width:100%;min-height:var(--btn-height);border-radius:var(--radius-btn);background:transparent;border:1px solid var(--btn-outline-border);color:var(--btn-outline-text);font:600 14px/1 var(--font-ui);text-decoration:none;transition:border-color 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1)}
.imp-e-btn-outline:hover{border-color:var(--text-accent);color:var(--text-accent)}
.imp-e-btn-ghost{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;border-radius:var(--radius-chip);background:none;color:var(--text-body);font:500 13.5px/1 var(--font-ui);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-e-btn-ghost:hover{color:var(--text-heading)}
.imp-e-btn-stack{display:flex;flex-direction:column;gap:6px}
.imp-e-scrim{position:fixed;inset:0;z-index:5;background:var(--scrim)}
.imp-e-sheet{position:fixed;z-index:7;left:0;right:0;bottom:0;padding:var(--sheet-pad);border-radius:var(--radius-sheet);background:var(--sheet-bg);border:1px solid var(--sheet-border);box-shadow:var(--sheet-shadow)}
.imp-e-sheet-handle{display:block;width:44px;height:4px;margin:0 auto 14px;border-radius:var(--radius-pill);background:var(--sheet-handle)}
.imp-e-sheet-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}
.imp-e-sheet-meta{font:400 11px/1 var(--font-ui);color:var(--text-meta)}
.imp-e-sheet-title{margin:0;font:700 21px/1.25 var(--font-ui);color:var(--text-heading);text-wrap:pretty}
.imp-e-sheet-lead{margin:8px 0 0;font:400 12.5px/1.55 var(--font-ui);color:var(--text-body);text-wrap:pretty}
.imp-e-scale{display:flex;align-items:flex-end;gap:var(--scale-gap);height:var(--scale-col-h)}
.imp-e-scale-col{flex:1;height:var(--scale-col-h);display:flex;align-items:flex-end;background:none;border:none;padding:0}
.imp-e-bar{width:100%;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;border-radius:var(--bar-radius);border:1px solid var(--bar-off-border);background:var(--bar-off-bg);color:var(--bar-off-fg);font:600 var(--bar-font)/1 var(--font-ui);transition:background 200ms cubic-bezier(.4,0,.2,1),border-color 200ms cubic-bezier(.4,0,.2,1),color 200ms cubic-bezier(.4,0,.2,1),transform 260ms cubic-bezier(.34,1.56,.64,1),box-shadow 260ms cubic-bezier(.4,0,.2,1)}
.imp-e-scale-col:hover .imp-e-bar{border-color:var(--bar-hover-border)}
.imp-e-bar--under{background:var(--bar-under-bg);border-color:var(--bar-under-border);color:var(--bar-under-fg)}
.imp-e-bar--on{background:var(--bar-on-bg);border-color:var(--bar-on-border);color:var(--bar-on-fg);box-shadow:var(--bar-on-shadow)}
.imp-e-scale-col:nth-child(1) .imp-e-bar{height:30%}
.imp-e-scale-col:nth-child(2) .imp-e-bar{height:37%}
.imp-e-scale-col:nth-child(3) .imp-e-bar{height:44%}
.imp-e-scale-col:nth-child(4) .imp-e-bar{height:51%}
.imp-e-scale-col:nth-child(5) .imp-e-bar{height:58%}
.imp-e-scale-col:nth-child(6) .imp-e-bar{height:65%}
.imp-e-scale-col:nth-child(7) .imp-e-bar{height:72%}
.imp-e-scale-col:nth-child(8) .imp-e-bar{height:79%}
.imp-e-scale-col:nth-child(9) .imp-e-bar{height:86%}
.imp-e-scale-col:nth-child(10) .imp-e-bar{height:94%}
.imp-e-scale-legend{display:flex;align-items:center;justify-content:space-between;font:400 11.5px/1 var(--font-ui);color:var(--text-meta)}
.imp-e-hint{display:flex;align-items:center;min-height:48px;padding:11px 14px;border-radius:var(--radius-chip);background:var(--hint-bg);border:1px solid var(--hint-border);font:400 12px/1.45 var(--font-ui);color:var(--hint-fg)}
.imp-e-hint--idle{background:var(--hint-idle-bg);border-color:var(--hint-idle-border);color:var(--hint-idle-fg)}
.imp-e-scale-block{display:flex;flex-direction:column;gap:11px;margin-top:16px}
.imp-e-result-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color);margin-bottom:6px}
.imp-e-result-title{margin:0;font:400 var(--result-title-size)/.86 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-e-result-hand{position:fixed;z-index:6;left:-26px;bottom:302px;height:var(--hand-mobile-h);width:auto;pointer-events:none;filter:var(--hand-glow)}
.imp-e-stat-boxes{display:flex;gap:8px;margin-top:16px}
.imp-e-stat-box{flex:1;padding:11px 13px;border-radius:var(--radius-chip);background:var(--box-bg);border:1px solid var(--box-border)}
.imp-e-stat-box-value{font:400 26px/1 var(--font-display);color:var(--text-heading)}
.imp-e-stat-box-value--accent{color:var(--num-on)}
.imp-e-stat-box-label{font:400 10px/1.3 var(--font-ui);color:var(--text-body);margin-top:3px}
.imp-e-verdict{display:flex;align-items:center;gap:9px;min-height:44px;margin-top:8px;padding:0 13px;border-radius:var(--radius-chip);background:var(--verdict-bg);border:1px solid var(--verdict-border);font:600 12.5px/1.3 var(--font-ui);color:var(--verdict-fg)}
.imp-e-verdict svg{flex:0 0 auto}
@media (min-width:1024px){
.imp-e-appbar{display:none}
.imp-e-session-view{padding:104px 140px 24px;gap:20px}
.imp-e-session-foot{padding:0 140px 40px;max-width:520px}
.imp-e-ex-list{gap:12px}
.imp-e-timer-value{font-size:var(--timer-desktop-size)}
.imp-e-sheet{position:fixed;left:50%;top:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);width:var(--result-card-w);padding:var(--modal-pad);border-radius:var(--radius-modal);box-shadow:var(--modal-shadow)}
.imp-e-sheet-handle{display:none}
.imp-e-sheet-title{font-size:26px}
.imp-e-sheet-lead{font-size:13.5px}
.imp-e-scale-legend{font-size:12.5px}
.imp-e-hint{min-height:52px;font-size:12.5px}
.imp-e-sheet--result{height:var(--result-card-h);overflow:hidden;display:flex;flex-direction:column}
.imp-e-sheet--result .imp-e-result-hand{position:absolute;left:2px;bottom:-84px;height:var(--hand-desktop-h)}
.imp-e-sheet--result .imp-e-result-col{position:relative;z-index:2;margin:auto 0 0 auto;width:308px;display:flex;flex-direction:column;gap:8px}
.imp-e-sheet--result .imp-e-stat-boxes{margin-top:0}
.imp-e-sheet--result .imp-e-verdict{margin-top:0}
.imp-e-result-title{font-size:var(--result-title-desktop-size)}
}
.imp-e-e-view{position:relative;z-index:1;display:flex;flex-direction:column;gap:20px;padding:20px 20px 108px}
.imp-e-e-main{display:flex;flex-direction:column;gap:16px;min-width:0}
.imp-e-e-rail{display:flex;flex-direction:column;gap:14px;min-width:0}
.imp-e-e-block{display:flex;flex-direction:column;gap:10px}
.imp-e-e-title{margin:0;font:400 var(--title-e-size)/.94 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-e-e-sub{margin:0;font:600 21px/1.25 var(--font-ui);color:var(--text-heading)}
.imp-e-lead{margin:0;font:400 var(--lead-size)/1.6 var(--font-ui);color:var(--text-body);text-wrap:pretty}
.imp-e-lead--small{font-size:12.5px}
.imp-e-sign{font:400 var(--sign-size)/1 var(--font-hand);color:var(--text-accent)}
.imp-e-appbar--e{justify-content:space-between}
.imp-e-panel{padding:var(--panel-pad);border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border)}
.imp-e-panel--flat{background:var(--panel-flat-bg)}
.imp-e-panel--glass{background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
.imp-e-panel--pad{padding:18px}
.imp-e-panel-stack{display:flex;flex-direction:column;gap:12px}
.imp-e-card-title{font:600 var(--card-title-size)/1.3 var(--font-ui);color:var(--text-heading)}
.imp-e-metrics{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.imp-e-metric{display:flex;flex-direction:column;gap:5px;min-width:0}
.imp-e-metric-value{font:400 var(--metric-size)/1 var(--font-display);color:var(--text-heading)}
.imp-e-metric-label{font:400 9.5px/1.2 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-body)}
.imp-e-steps{display:flex;flex-direction:column;gap:10px}
.imp-e-step{display:flex;gap:12px;align-items:flex-start}
.imp-e-step-num{flex:0 0 auto;width:var(--step-num);height:var(--step-num);display:grid;place-items:center;border-radius:8px;background:var(--accent-tint-bg);border:1px solid var(--accent-tint-border);font:600 11px/1 var(--font-ui);color:var(--accent-tint-fg)}
.imp-e-step-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.imp-e-step-title{font:600 13.5px/1.3 var(--font-ui);color:var(--text-heading)}
.imp-e-step-desc{font:400 12px/1.45 var(--font-ui);color:var(--text-body)}
.imp-e-len-row{display:flex;align-items:center;gap:12px}
.imp-e-len-name{flex:0 0 58px;font:400 var(--len-name-size)/1 var(--font-display);color:var(--len-name-color)}
.imp-e-len-time{flex:0 0 92px;font:600 12.5px/1 var(--font-ui);color:var(--text-heading)}
.imp-e-len-desc{flex:1;min-width:0;font:400 12px/1.35 var(--font-ui);color:var(--text-body)}
.imp-e-acc{border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border);overflow:hidden}
.imp-e-acc[open]{border-color:var(--accent-tint-border)}
.imp-e-acc-head{display:flex;align-items:center;gap:12px;min-height:var(--acc-head-h);padding:0 16px;cursor:pointer;list-style:none;transition:background 150ms cubic-bezier(.4,0,.2,1)}
.imp-e-acc-head::-webkit-details-marker{display:none}
.imp-e-acc-head:hover{background:var(--panel-flat-bg)}
.imp-e-acc-icon{flex:0 0 auto;width:var(--acc-icon);height:var(--acc-icon);border-radius:10px;background:var(--accent-tint-bg);border:1px solid var(--accent-tint-border);display:grid;place-items:center;color:var(--accent-tint-fg)}
.imp-e-acc-title{flex:1;font:600 var(--acc-title-size)/1.35 var(--font-ui);color:var(--text-heading)}
.imp-e-acc-sign{flex:0 0 auto;width:26px;height:26px;border-radius:8px;border:1px solid var(--input-border);display:grid;place-items:center;font:400 15px/1 var(--font-ui);color:var(--accent-tint-fg)}
.imp-e-acc-sign::after{content:"+"}
.imp-e-acc[open] .imp-e-acc-sign::after{content:"\2013"}
.imp-e-acc-body{display:flex;flex-direction:column;gap:10px;padding:0 16px 16px}
.imp-e-def{display:flex;flex-direction:column;gap:3px}
.imp-e-def-term{font:600 13px/1.4 var(--font-ui);color:var(--text-heading)}
.imp-e-def-desc{font:400 12.5px/1.6 var(--font-ui);color:var(--text-body)}
.imp-e-badge-done{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:0 11px;border-radius:11px;background:var(--accent-tint-bg);border:1px solid var(--accent-tint-border);font:600 11px/1 var(--font-ui);color:var(--accent-tint-fg);align-self:flex-start}
.imp-e-badge-done svg{flex:0 0 auto}
.imp-e-dock{position:sticky;bottom:12px;z-index:3;margin:0 12px;display:flex;gap:4px;padding:6px;border-radius:22px;background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
.imp-e-dock-item{flex:1;min-height:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border-radius:16px;color:var(--text-body);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-e-dock-item:hover{color:var(--text-accent)}
.imp-e-dock-item span{font:600 9.5px/1 var(--font-ui);letter-spacing:.08em;text-transform:uppercase}
.imp-e-dock-item--active{background:var(--lime);color:var(--ink)}
.imp-e-dock-item--active:hover{color:var(--ink)}
.imp-e-test-bar{position:relative;z-index:2;display:flex;align-items:center;gap:12px;padding:12px 16px;min-height:var(--topbar-mobile-h)}
.imp-e-test-bar-title{margin-left:auto;font:400 11.5px/1 var(--font-ui);color:var(--text-meta)}
.imp-e-dots{display:flex;align-items:center;gap:6px}
.imp-e-dot{width:var(--dot-size);height:var(--dot-size);display:grid;place-items:center;border-radius:var(--radius-pill);background:var(--dot-bg);color:var(--dot-fg);font:600 11px/1 var(--font-ui)}
.imp-e-dot--done{background:var(--dot-done-bg);color:var(--dot-done-fg)}
.imp-e-dot--on{background:var(--dot-on-bg);color:var(--dot-on-fg)}
.imp-e-dots-label{font:400 10px/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body)}
.imp-e-sw{display:flex;flex-direction:column;gap:6px;padding:16px 18px;border-radius:var(--radius-timer);background:var(--module-bg);border:1px solid var(--card-border)}
.imp-e-sw-value{font:400 var(--sw-value-size)/1 var(--font-display);color:var(--text-heading)}
.imp-e-sw-meta{font:400 11.5px/1 var(--font-ui);color:var(--text-body)}
.imp-e-attempts{display:flex;gap:8px}
.imp-e-attempt{flex:1;padding:11px 13px;border-radius:var(--radius-chip);background:var(--panel-flat-bg);border:1px solid var(--panel-border);display:flex;flex-direction:column;gap:4px}
.imp-e-attempt-label{font:400 10px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-body)}
.imp-e-attempt-value{font:400 20px/1 var(--font-display);color:var(--text-heading)}
.imp-e-attempt--best .imp-e-attempt-value{color:var(--num-on)}
.imp-e-row-between{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.imp-e-num-pair{display:flex;align-items:center;gap:14px}
.imp-e-num-box{flex:1;min-width:0;padding:12px 14px;border-radius:var(--radius-chip);background:var(--panel-flat-bg);border:1px solid var(--panel-border);display:flex;flex-direction:column;gap:4px}
.imp-e-num-label{font:400 10px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-body)}
.imp-e-num-value{font:400 var(--numbox-value-size)/1 var(--font-display);color:var(--text-heading)}
.imp-e-num-arrow{flex:0 0 auto;color:var(--accent-tint-fg)}
.imp-e-fullstop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;min-height:100vh;padding:40px 24px;background:var(--fs-bg);text-align:center;cursor:pointer}
.imp-e-fs-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color)}
.imp-e-fs-timer{font:400 var(--fs-timer-size)/1 var(--font-display);color:var(--text-heading)}
.imp-e-fs-stop{font:400 46px/1 var(--font-display);letter-spacing:.06em;color:var(--num-on)}
.imp-e-fs-note{max-width:520px;font:400 13px/1.6 var(--font-ui);color:var(--text-body)}
.imp-e-tiles{display:grid;grid-template-columns:repeat(6,var(--tile-size));gap:7px;justify-content:center}
.imp-e-tile{width:var(--tile-size);height:var(--tile-size);display:grid;place-items:center;border-radius:var(--radius-tile);background:var(--tile-bg);border:1px solid var(--tile-border);color:var(--tile-fg);font:400 20px/1 var(--font-display)}
.imp-e-tile--done{background:var(--tile-done-bg);border-color:var(--tile-done-border);color:var(--tile-done-fg)}
.imp-e-tile--next{background:var(--tile-next-bg);border-color:var(--tile-next-bg);color:var(--tile-next-fg)}
.imp-e-cmp{border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border);overflow:hidden}
.imp-e-cmp-head,.imp-e-cmp-row{display:grid;grid-template-columns:1fr 92px 92px;align-items:center;gap:10px;padding:12px 16px}
.imp-e-cmp--delta .imp-e-cmp-head,.imp-e-cmp--delta .imp-e-cmp-row{grid-template-columns:1fr 84px 84px 78px}
.imp-e-cmp-row + .imp-e-cmp-row,.imp-e-cmp-head + .imp-e-cmp-row{border-top:1px solid var(--divider)}
.imp-e-cmp-head{background:var(--panel-flat-bg)}
.imp-e-cmp-th{font:400 10px/1.3 var(--font-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--text-body)}
.imp-e-cmp-name{display:flex;flex-direction:column;gap:3px;min-width:0}
.imp-e-cmp-name b{font:600 var(--cmp-name-size)/1.35 var(--font-ui);color:var(--text-heading)}
.imp-e-cmp-name span{font:400 11px/1.3 var(--font-ui);color:var(--text-meta)}
.imp-e-cmp-val{font:400 var(--cmp-value-size)/1 var(--font-display);color:var(--text-heading)}
.imp-e-cmp-wait{font:400 11px/1.3 var(--font-ui);color:var(--delta-wait)}
.imp-e-cmp-delta{font:600 13px/1 var(--font-ui);color:var(--delta-good)}
.imp-e-cmp-delta--bad{color:var(--delta-bad)}
.imp-e-trio{display:grid;grid-template-columns:1fr;gap:10px}
.imp-e-trio-cell{padding:16px 18px;border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border);display:flex;flex-direction:column;gap:5px}
.imp-e-trio-value{font:400 var(--trio-value-size)/1 var(--font-display);color:var(--text-heading)}
.imp-e-trio-label{font:400 10px/1.3 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-body)}
.imp-e-note-block{display:flex;flex-direction:column;gap:8px}
.imp-e-note-block p{margin:0;font:400 12.5px/1.6 var(--font-ui);color:var(--text-body);text-wrap:pretty}
.imp-e-note-block b{color:var(--text-heading)}
@media (min-width:1024px){
.imp-e-e-view{display:grid;grid-template-columns:1fr var(--e-rail-w);gap:28px;align-items:start;padding:158px 140px 70px}
.imp-e-e-view--single{display:block;max-width:1020px;margin:0 auto}
.imp-e-metrics{grid-template-columns:repeat(4,1fr);gap:0}
.imp-e-metric{padding:0 22px}
.imp-e-metric + .imp-e-metric{border-left:1px solid var(--divider)}
.imp-e-metric:first-child{padding-left:0}
.imp-e-metric:last-child{padding-right:0}
.imp-e-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.imp-e-step{flex-direction:column;gap:8px;padding:16px 18px;border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border)}
.imp-e-step-title{font-size:14px}
.imp-e-step-desc{font-size:12.5px}
.imp-e-len-row{gap:16px}
.imp-e-len-name{flex-basis:76px}
.imp-e-len-time{flex-basis:130px;font-size:13.5px}
.imp-e-len-desc{font-size:13px}
.imp-e-acc-body{padding:0 22px 20px;gap:12px}
.imp-e-dock{display:none}
.imp-e-appbar--e{display:none}
.imp-e-test-bar{padding:22px 60px}
.imp-e-trio{grid-template-columns:repeat(3,1fr)}
.imp-e-tiles{gap:10px}
.imp-e-cmp-head,.imp-e-cmp-row{padding:14px 22px}
.imp-e-cmp-head,.imp-e-cmp-row{grid-template-columns:1fr 150px 150px}
.imp-e-cmp--delta .imp-e-cmp-head,.imp-e-cmp--delta .imp-e-cmp-row{grid-template-columns:1fr 150px 150px 130px}
}



/* ===== start.html -> prefiks .imp-e, zakres .imp-e-ekran-start ===== */
.imp-e-ekran-start .imp-e-glow--a{top:-150px;right:-180px;width:620px;height:620px;background:var(--glow-violet)}
.imp-e-ekran-start .imp-e-glow--b{bottom:-160px;left:-180px;width:520px;height:520px;background:var(--glow-lime)}
.imp-e-ekran-start .imp-e-gfx--cross{top:-150px;right:-130px;width:560px}
.imp-e-ekran-start .imp-e-gfx--spiral{bottom:-190px;left:-150px;width:470px}
.imp-e-ekran-start .imp-e-gfx--fluid{top:520px;right:-220px;width:680px;opacity:var(--gfx-fluid)}
@media (max-width:1023px){
.imp-e-ekran-start .imp-e-gfx--cross{top:220px;left:-90px;right:auto;width:320px}
.imp-e-ekran-start .imp-e-gfx--spiral{display:none}
.imp-e-ekran-start .imp-e-gfx--fluid{top:-60px;right:-150px;width:420px}
}

/* ===== meta.html -> prefiks .imp-e, zakres .imp-e-ekran-meta ===== */
.imp-e-ekran-meta .imp-e-glow--a{top:-160px;right:-190px;width:620px;height:620px;background:var(--glow-violet)}
.imp-e-ekran-meta .imp-e-glow--b{bottom:-170px;left:-190px;width:520px;height:520px;background:var(--glow-lime)}
.imp-e-ekran-meta .imp-e-gfx--cross{top:-150px;right:-130px;width:560px}
.imp-e-ekran-meta .imp-e-gfx--spiral{bottom:-190px;left:-150px;width:470px}
@media (max-width:1023px){
.imp-e-ekran-meta .imp-e-gfx--cross{top:180px;right:-120px;width:340px}
.imp-e-ekran-meta .imp-e-gfx--spiral{bottom:-140px;left:-120px;width:320px}
}

/* ===== meta-podsumowanie.html -> prefiks .imp-e, zakres .imp-e-ekran-meta-koniec ===== */
.imp-e-ekran-meta-koniec .imp-e-glow--a{top:-160px;right:-190px;width:620px;height:620px;background:var(--glow-violet)}
.imp-e-ekran-meta-koniec .imp-e-glow--b{bottom:-170px;left:-190px;width:520px;height:520px;background:var(--glow-lime)}
.imp-e-ekran-meta-koniec .imp-e-gfx--cross{top:-150px;right:-130px;width:560px}
.imp-e-ekran-meta-koniec .imp-e-gfx--spiral{bottom:-190px;left:-150px;width:470px}
@media (max-width:1023px){
.imp-e-ekran-meta-koniec .imp-e-gfx--cross{top:180px;right:-120px;width:340px}
.imp-e-ekran-meta-koniec .imp-e-gfx--spiral{bottom:-140px;left:-120px;width:320px}
}

/* ===== test-wprowadzenie.html -> prefiks .imp-e, zakres .imp-e-ekran-test-wstep ===== */
.imp-e-ekran-test-wstep .imp-e-glow--a{top:-170px;right:-190px;width:620px;height:620px;background:var(--glow-violet)}
.imp-e-ekran-test-wstep .imp-e-glow--b{bottom:-180px;left:-190px;width:520px;height:520px;background:var(--glow-lime)}
.imp-e-ekran-test-wstep .imp-e-gfx--cross{top:-150px;right:-130px;width:560px}
@media (max-width:1023px){
.imp-e-ekran-test-wstep .imp-e-gfx--cross{top:auto;bottom:-150px;right:-110px;width:380px}
}

/* ===== test-krok.html -> prefiks .imp-e, zakres .imp-e-ekran-test-krok ===== */
.imp-e-ekran-test-krok .imp-e-glow--a{top:-170px;right:-190px;width:620px;height:620px;background:var(--glow-violet)}
.imp-e-ekran-test-krok .imp-e-glow--b{bottom:-180px;left:-190px;width:520px;height:520px;background:var(--glow-lime)}
.imp-e-ekran-test-krok .imp-e-gfx--cross{top:-150px;right:-130px;width:560px}
@media (max-width:1023px){
.imp-e-ekran-test-krok .imp-e-gfx--cross{top:auto;bottom:-150px;right:-110px;width:380px}
}
.imp-e-ekran-test-krok .imp-e-fullstop{position:fixed;inset:0;z-index:8}

/* ===== test-zapisane.html -> prefiks .imp-e, zakres .imp-e-ekran-test-koniec ===== */
.imp-e-ekran-test-koniec .imp-e-glow--a{top:-170px;right:-190px;width:620px;height:620px;background:var(--glow-violet)}
.imp-e-ekran-test-koniec .imp-e-glow--b{bottom:-180px;left:-190px;width:520px;height:520px;background:var(--glow-lime)}
.imp-e-ekran-test-koniec .imp-e-gfx--cross{top:-150px;right:-130px;width:560px}
@media (max-width:1023px){
.imp-e-ekran-test-koniec .imp-e-gfx--cross{top:auto;bottom:-150px;right:-110px;width:380px}
}
.imp-e-ekran-test-koniec .imp-e-done-view{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;min-height:100vh;padding:40px 24px;text-align:center}
.imp-e-ekran-test-koniec .imp-e-done-hand{width:auto;height:240px;filter:var(--hand-glow)}
@media (min-width:1024px){
.imp-e-ekran-test-koniec .imp-e-done-hand{height:330px}
}

/* ===== wyniki.html -> prefiks .imp-e, zakres .imp-e-ekran-wyniki ===== */
.imp-e-ekran-wyniki .imp-e-glow--a{top:-170px;right:-190px;width:620px;height:620px;background:var(--glow-violet)}
.imp-e-ekran-wyniki .imp-e-glow--b{bottom:-180px;left:-190px;width:520px;height:520px;background:var(--glow-lime)}
.imp-e-ekran-wyniki .imp-e-gfx--spiral{bottom:-190px;left:-150px;width:470px}
@media (max-width:1023px){
.imp-e-ekran-wyniki .imp-e-gfx--spiral{bottom:-130px;left:-110px;width:320px}
}

/* ===== karta-wyniku.html -> prefiks .imp-e, zakres .imp-e-ekran-karta ===== */
.imp-e-ekran-karta .imp-e{display:grid;place-items:start center;background:var(--bg)}
.imp-e-ekran-karta .imp-e-card-out{position:relative;width:1080px;height:1920px;overflow:hidden;box-sizing:border-box;padding:110px 90px 90px;display:flex;flex-direction:column;gap:44px;background:var(--card-out-bg);isolation:isolate}
.imp-e-ekran-karta .imp-e-card-out .imp-e-glow{top:-260px;right:-200px;width:900px;height:900px;background:var(--glow-violet)}
.imp-e-ekran-karta .imp-e-card-out .imp-e-gfx-glass{top:-150px;right:-130px;width:620px}
.imp-e-ekran-karta .imp-e-card-out-head{position:relative;z-index:1;display:flex;flex-direction:column;gap:18px}
.imp-e-ekran-karta .imp-e-card-out-title{margin:0;font:400 190px/.86 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-e-ekran-karta .imp-e-card-out-eyebrow{font:400 26px/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color)}
.imp-e-ekran-karta .imp-e-card-out-date{font:400 30px/1 var(--font-ui);color:var(--text-body)}
.imp-e-ekran-karta .imp-e-card-out .imp-e-cmp{position:relative;z-index:1;border-radius:34px}
.imp-e-ekran-karta .imp-e-card-out .imp-e-cmp-head,
.imp-e-ekran-karta .imp-e-card-out .imp-e-cmp-row{grid-template-columns:1fr 200px 200px;padding:28px 34px;gap:18px}
.imp-e-ekran-karta .imp-e-card-out .imp-e-cmp-name b{font-size:28px}
.imp-e-ekran-karta .imp-e-card-out .imp-e-cmp-name span{font-size:20px}
.imp-e-ekran-karta .imp-e-card-out .imp-e-cmp-val{font-size:44px}
.imp-e-ekran-karta .imp-e-card-out .imp-e-cmp-th{font-size:20px}
.imp-e-ekran-karta .imp-e-card-out .imp-e-trio{position:relative;z-index:1;grid-template-columns:repeat(3,1fr);gap:20px}
.imp-e-ekran-karta .imp-e-card-out .imp-e-trio-value{font-size:64px}
.imp-e-ekran-karta .imp-e-card-out .imp-e-trio-label{font-size:19px}
.imp-e-ekran-karta .imp-e-card-out-foot{position:relative;z-index:1;margin-top:auto;display:flex;align-items:center;gap:22px}
.imp-e-ekran-karta .imp-e-card-out-foot .imp-e-logo{width:104px;height:104px}
.imp-e-ekran-karta .imp-e-card-out-brand{display:flex;flex-direction:column;gap:6px}
.imp-e-ekran-karta .imp-e-card-out-brand b{font:400 20px/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body);font-weight:400}
.imp-e-ekran-karta .imp-e-card-out-brand span{font:400 18px/1 var(--font-ui);color:var(--text-meta)}
.imp-e-ekran-karta .imp-e-card-out-hand{font:400 44px/1 var(--font-hand);color:var(--text-accent)}


/* ---- PRZEKŁADY makieta -> żywa strona (Krok 2 instrukcji) ---------------- */

/* 100dvh zamiast 100vh — skaczący pasek adresu w mobilnym Safari; 100vh
   zostaje jako zapas dla przeglądarek bez dvh. overflow:clip obok hidden,
   żeby nie powstawał kontener przewijania i position:sticky działało. */
.imp-e-page{min-height:100vh;min-height:100dvh;overflow:hidden;overflow:clip}

/* Dok pływa nad przewijaną treścią i musi ominąć pasek gestów iPhone'a. */
@media (max-width:1023px){
  .imp-e-dock{bottom:calc(12px + env(safe-area-inset-bottom))}
  .imp-e-e-view{padding-bottom:calc(108px + env(safe-area-inset-bottom))}
}

/* Belka desktopowa: sticky zamiast absolute, jak w pozostałych obszarach —
   zostaje widoczna przy przewijaniu. Górny padding treści pomniejszony
   o wysokość belki z marginesem (158px -> 78px). */
@media (min-width:1024px){
  .imp-e-topbar{position:sticky;top:16px;left:auto;right:auto;margin:16px 24px 0}
  .imp-e-e-view{padding-top:78px}
}

/* Stany widoków chowa serwer atrybutem [hidden]; komponenty mają jawny
   display, więc atrybut musi wygrywać. */
.imp-e [hidden]{display:none}

/* Pudło w siatce liczb — kafelek mignie i wraca do normy. Eksport nie ma
   tego stanu (makieta pokazuje tylko trafienia), a mechanika przeniesiona
   z „Tabliczki Schulte" go wymaga: pomyłka nie kosztuje nic poza
   sekundami, więc żadnego komunikatu, żadnej kary — samo mrugnięcie.
   Przy prefers-reduced-motion bez animacji, sam kolor. */
.imp-e-tile--miss{border-color:var(--tile-next-bg);color:var(--tile-next-fg);animation:imp-e-miss 220ms ease-out}
@keyframes imp-e-miss{
  0%{transform:scale(1)}
  40%{transform:scale(.94)}
  100%{transform:scale(1)}
}
@media (prefers-reduced-motion:reduce){
  .imp-e-tile--miss{animation:none}
}

/* Podgląd karty wyniku w przeglądarce. Kadr ma sztywne 1080 x 1920, bo
   to wzór obrazka, nie strona — na mniejszym ekranie skalujemy go
   w całości, zamiast pozwolić stronie przewijać się w bok. Dotyczy
   wyłącznie podglądu; plik PNG powstanie w pełnym rozmiarze.
   Drabinka zamiast wyliczenia, bo scale() potrzebuje liczby, a nie
   długości — z samego CSS nie da się podzielić 100vw przez 1080. */
.imp-e-karta-podglad{display:grid;place-items:start center;min-height:100vh;min-height:100dvh;background:var(--paper);overflow-x:hidden}
.imp-e-karta-podglad > .imp-e{transform-origin:top center}
@media (max-width:1140px){ .imp-e-karta-podglad > .imp-e{transform:scale(.86)} }
@media (max-width:960px){  .imp-e-karta-podglad > .imp-e{transform:scale(.72)} }
@media (max-width:820px){  .imp-e-karta-podglad > .imp-e{transform:scale(.60)} }
@media (max-width:680px){  .imp-e-karta-podglad > .imp-e{transform:scale(.46)} }
@media (max-width:520px){  .imp-e-karta-podglad > .imp-e{transform:scale(.36)} }
@media (max-width:420px){  .imp-e-karta-podglad > .imp-e{transform:scale(.30)} }

/* ---- Karta wyniku: pierwsza iteracja z właścicielem (31 sierpnia 2026) ----
   Zmiany wobec eksportu, wszystkie na jego prośbę:
   podpis odręczny to imię UŻYTKOWNIKA, nie autorki · w prawym górnym
   rogu szklany mózg zamiast krzyża · płynne tło przy lewej krawędzi
   w dolnej części kadru · statystyki przeniesione nad tabelę pomiarów
   · pod tabelą zdanie o DTC · napis "SamoWolność" nad adresem usunięty. */

/* Płynne tło: lewa krawędź, poniżej połowy kadru, ale nie w narożniku.
   Wychodzi za kadr jak pozostałe grafiki dekoracyjne obszaru. */
.imp-e-ekran-karta .imp-e-card-out-fluid{position:absolute;left:-180px;bottom:360px;width:620px;opacity:var(--gfx-fluid);pointer-events:none;z-index:0}

/* Zdanie o DTC pod tabelą pomiarów. */
.imp-e-ekran-karta .imp-e-card-out-note{position:relative;z-index:1;margin:0;max-width:820px;font:400 26px/1.5 var(--font-ui);color:var(--text-body)}

/* ---- Karta wyniku: limonkowe akcenty (1 września 2026, prośba właściciela)
   Na karcie było za mało koloru akcentowego marki. Wszystkie akcenty idą
   przez --num-on / --eyebrow-color, które same przełączają się na fiolet
   w motywie jasnym — limonka nigdy nie ląduje jako tekst na jasnym tle
   (zasada z CLAUDE.md). */

/* Druga poświata, limonkowa — równoważy fioletową z prawego górnego rogu. */
.imp-e-ekran-karta .imp-e-card-out-glow-dol{top:auto;right:auto;bottom:-220px;left:-260px;width:820px;height:820px;background:var(--glow-lime)}

/* Trzy liczby programu w kolorze akcentu — to one mają przyciągać oko. */
.imp-e-ekran-karta .imp-e-trio-value{color:var(--num-on)}

/* Poświaty kart: kafle statystyk na przemian limonka / fiolet / limonka,
   tabela pomiarów fioletowo. Cień barwny zamiast obwódki — obwódka na
   każdej karcie robiła się jarmarczna. */
.imp-e-ekran-karta .imp-e-trio-cell{box-shadow:0 0 60px rgba(var(--lime-rgb),.10)}
.imp-e-ekran-karta .imp-e-trio-cell:nth-child(2){box-shadow:0 0 60px rgba(var(--violet-rgb),.16)}
.imp-e-ekran-karta .imp-e-cmp{box-shadow:0 0 90px rgba(var(--violet-rgb),.14)}

/* Wiersz DTC to główny wynik testu — dostaje limonkową krawędź i wartości
   w kolorze akcentu. Reszta wierszy zostaje spokojna. */
.imp-e-ekran-karta .imp-e-cmp-row--dtc{position:relative;background:rgba(var(--lime-rgb),.05)}
.imp-e-ekran-karta .imp-e-cmp-row--dtc::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--num-on)}
.imp-e-ekran-karta .imp-e-cmp-row--dtc .imp-e-cmp-val{color:var(--num-on)}

/* ---- Karta wyniku: mieszczenie się w kadrze (1 września 2026) ------------
   Po przeniesieniu statystyk na górę i dodaniu zdania o DTC treść przestała
   się mieścić w 1920 px. Kadr jest kolumną flex, więc bloki zaczęły się
   KURCZYĆ, a tabela z overflow:hidden ucięła ostatni wiersz w połowie.

   Dwie rzeczy naraz: (1) bloki nie wolno kurczyć — flex:none, dzięki czemu
   ewentualny nadmiar jest widoczny od razu, a nie zjadany po cichu;
   (2) odzyskane miejsce — mniejsze odstępy i niższe wiersze tabeli. */
.imp-e-ekran-karta .imp-e-card-out{gap:34px}
.imp-e-ekran-karta .imp-e-card-out-head,
.imp-e-ekran-karta .imp-e-trio,
.imp-e-ekran-karta .imp-e-cmp,
.imp-e-ekran-karta .imp-e-card-out-note,
.imp-e-ekran-karta .imp-e-card-out-foot{flex:none}
.imp-e-ekran-karta .imp-e-cmp-head,
.imp-e-ekran-karta .imp-e-cmp-row{padding:22px 34px}
.imp-e-ekran-karta .imp-e-cmp-name b{line-height:1.1}
.imp-e-ekran-karta .imp-e-card-out-note{font-size:25px}

/* Poświata u góry limonkowa, dolna fioletowa — odwrotnie niż na starcie
   (prośba właściciela: górna ma być limonkowa). */
.imp-e-ekran-karta .imp-e-card-out .imp-e-glow{background:var(--glow-lime)}
.imp-e-ekran-karta .imp-e-card-out-glow-dol{background:var(--glow-violet)}


/* ---- Prawa strona paska górnego w obszarach C11, E i F (1 września 2026) ----
   Decyzja właściciela: wszystkie ekrany z paskiem menu na desktopie mają
   mieć w prawym rogu przejście do konta i ikonkę wiadomości. Bez
   wylogowania — to zostaje wyłącznie na koncie.

   Eksporty obszarów B i C miały to od początku; C11, D i E dostały puste
   `topbar-end`. Reguły są przepisane z działającego wzoru obszaru C,
   z tokenami danego obszaru — wygląd ma być ten sam wszędzie.

   OBSZAR F DOPISANY 1 września 2026 wieczorem: import wiadomości wszedł
   PO napisaniu tych reguł, więc pasek na ekranie wiadomości rysował się
   bez nich — koperta bez ramki, a awatar i imię jedno pod drugim
   (zgłoszenie właściciela ze zrzutem). Ta sama pułapka co przy klikalnym
   logo: nowy obszar nie dziedziczy poprawek zrobionych wcześniej.
   Kontrola: narzedzia/sprawdz-pasek.py. */
.imp-e-topbar-end,
.imp-f-topbar-end,
.imp-c11-topbar-end{margin-left:auto;display:flex;align-items:center;gap:8px}

.imp-e-topbar-icon-btn,
.imp-f-topbar-icon-btn,
.imp-c11-topbar-icon-btn{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--card-border);background:rgba(var(--paper-rgb),.06);border-radius:var(--radius-pill);color:var(--text-heading);cursor:pointer;text-decoration:none}

.imp-e-topbar-user,
.imp-f-topbar-user,
.imp-c11-topbar-user{display:flex;align-items:center;gap:10px;padding:5px 14px 5px 5px;border-radius:var(--radius-pill);background:rgba(var(--paper-rgb),.06);border:1px solid var(--card-border);text-decoration:none;transition:background 150ms cubic-bezier(.4,0,.2,1)}
.imp-e-topbar-user:hover,
.imp-f-topbar-user:hover,
.imp-c11-topbar-user:hover{background:rgba(var(--paper-rgb),.1)}

.imp-e-avatar,
.imp-c11-avatar{width:34px;height:34px;border-radius:var(--radius-pill);background:rgba(var(--violet-rgb),.12);display:grid;place-items:center;font:600 12px/1 var(--font-ui);color:var(--text-accent)}

.imp-e-topbar-username,
.imp-f-topbar-username,
.imp-c11-topbar-username{font:600 13px/1 var(--font-ui);color:var(--text-heading)}

/* Na wąskim ekranie pasek górny i tak się nie pokazuje (jest dok albo
   własna belka), ale gdyby kiedyś się pokazał — imię ustępuje miejsca. */
@media (max-width:1200px){
  .imp-e-topbar-username,
  .imp-f-topbar-username,
  .imp-c11-topbar-username{display:none}
}


/* ---- Ekran Start: poprawki po klikaniu właściciela (1 września 2026) -----
   Odstępstwa od eksportu obszaru E, mają zostać — właściciel poprawi
   projekt u siebie. Przy następnym imporcie nie przywracać wersji
   z plików (rejestr decyzji importu). */

/* Jeden odstęp rządzi całą prawą szyną: i przerwą MIĘDZY kartami, i przerwą
   między paskiem menu a pierwszą kartą. Dzięki temu są równe z definicji,
   a nie przez trafienie w liczbę. 84px = 16px odsunięcia belki od góry
   + 68px jej wysokości (10 + 46 zawartości + 10 + 2 obramowania). */
@media (min-width:1024px){
  .imp-e-ekran-start{--e-szyna-odstep:20px}
  .imp-e-ekran-start .imp-e-e-rail{
    gap:var(--e-szyna-odstep);
    position:sticky;
    top:calc(84px + var(--e-szyna-odstep));
  }
}

/* Więcej powietrza między sekcjami — właściciel: „wszystko za bardzo
   ściśnięte, na oko 50 pikseli". Na telefonie mniej, bo tam 50px zjada
   pół ekranu. */
.imp-e-ekran-start .imp-e-e-main{gap:34px}
@media (min-width:1024px){
  .imp-e-ekran-start .imp-e-e-main{gap:50px}
}

/* Grafika i poświata przy lewej krawędzi były przypięte do DOŁU strony,
   a strona rośnie i maleje przy rozwijaniu akordeonu — więc wędrowały
   razem z nim. Przypięte do góry stoją w miejscu. */
@media (min-width:1024px){
  .imp-e-ekran-start .imp-e-gfx--spiral{top:1180px;bottom:auto}
  .imp-e-ekran-start .imp-e-glow--b{top:1060px;bottom:auto}
}

/* Wybór motywu: dokładnie ten sam komponent co na koncie — te same
   wymiary, kształt, ikony i kolor zaznaczenia. Różnica jedna: blok jest
   wyśrodkowany i wąski, nie na całą szerokość kolumny. */
.imp-e-motyw{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.imp-e-motyw-zacheta,
.imp-e-motyw-konto{margin:0;max-width:46ch;font:400 13px/1.5 var(--font-ui);color:var(--text-body)}
.imp-e-theme-picker{display:flex;gap:8px;width:min(320px,100%)}
.imp-e-theme-opt{flex:1;min-height:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:11px 6px;border-radius:14px;border:1px solid var(--card-border);background:transparent;color:var(--text-heading);cursor:pointer;transition:border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-e-theme-opt:hover{border-color:var(--text-accent)}
.imp-e-theme-opt--active{background:var(--lime);border-color:transparent;color:#1C1C1E}
.imp-e-theme-opt span{font:600 10.5px/1 var(--font-ui)}

/* „Jak to przebiega" jako linia procesu, wyśrodkowana.

   Kreski łączące były NIERÓWNE, bo każdy krok miał szerokość swojej
   treści (max-width 220px), a treści są różnej długości — kreska liczona
   w procentach własnej szerokości wychodziła więc za każdym razem inna.
   Teraz krok zajmuje całą kolumnę siatki, kolumny są równe, a kreska
   biegnie od krawędzi jednego kółka do krawędzi następnego przez
   left/right zamiast szerokości. Siatka bez przerwy, odstęp robi
   wewnętrzny padding kroku — inaczej „połowa własnej szerokości" nie
   trafiałaby w środek sąsiada. */
.imp-e-proces{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:22px;justify-items:center;text-align:center}
.imp-e-proces-krok{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;max-width:260px}
.imp-e-proces-kolko{width:44px;height:44px;flex:none;border-radius:var(--radius-pill);display:grid;place-items:center;background:rgba(var(--paper-rgb),.06);border:1px solid var(--card-border);font:400 22px/1 var(--font-display);color:var(--num-on)}
.imp-e-proces-tytul{font:600 15px/1.3 var(--font-ui);color:var(--text-heading)}
.imp-e-proces-opis{font:400 13px/1.45 var(--font-ui);color:var(--text-body)}

/* telefon: kreska pionowa pod kółkiem */
.imp-e-proces-krok:not(:last-child)::before{content:"";position:absolute;left:calc(50% - 1px);top:44px;width:2px;height:calc(100% + 22px - 44px);background:var(--divider)}

@media (min-width:1024px){
  .imp-e-proces{grid-template-columns:repeat(4,1fr);gap:0;align-items:start;margin-top:30px}
  .imp-e-proces-krok{max-width:none;padding:0 12px}
  /* od prawej krawędzi tego kółka do lewej krawędzi następnego */
  .imp-e-proces-krok:not(:last-child)::before{
    left:calc(50% + 30px);
    right:calc(-50% + 30px);
    top:21px;
    width:auto;
    height:2px;
  }
}

/* Warianty MINI/MIDI/MAXI: trzy wąskie boksy, wyśrodkowane, z podpisem
   pod spodem też na środku.
   Klasy .len-* z eksportu są pisane pod układ POZIOMY (flex-basis
   i flex:1 na opisie) — w kolumnie rozpychały karty na całą wysokość
   siatki. Stąd zerowanie flexa. */
.imp-e-warianty{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:520px;margin-inline:auto}
.imp-e-wariant{display:flex;flex-direction:column;gap:6px;padding:14px 16px}
.imp-e-wariant .imp-e-len-name,
.imp-e-wariant .imp-e-len-time,
.imp-e-wariant .imp-e-len-desc{flex:none}
.imp-e-wariant .imp-e-len-name{font:400 20px/1 var(--font-display);color:var(--len-name-color);letter-spacing:.04em}
.imp-e-wariant .imp-e-len-time{font:600 13px/1.2 var(--font-ui);color:var(--text-heading)}
.imp-e-wariant .imp-e-len-desc{font:400 12.5px/1.4 var(--font-ui);color:var(--text-body)}
.imp-e-warianty + .imp-e-lead{text-align:center;margin-inline:auto;max-width:52ch}

/* ---- Meta po teście: dopasowanie do Startu (1 września 2026) -------------
   Właściciel: sekcje mają mieć takie same odstępy i takie same nazwy —
   limonkowe nadtytuły, jak na Starcie. */

/* Odstępy między sekcjami jak na Starcie. */
.imp-e-ekran-meta-koniec .imp-e-e-main{gap:34px}
@media (min-width:1024px){
  .imp-e-ekran-meta-koniec .imp-e-e-main{gap:50px}
}

/* Nazwy sekcji w wyglądzie nadtytułu ze Startu. Zostają nagłówkami <h2>,
   zmienia się tylko wygląd — struktura dokumentu ma dalej mówić, że to
   nagłówki sekcji, a nie ozdobniki. */
.imp-e-ekran-meta-koniec .imp-e-e-sub{
  font:400 var(--eyebrow-size)/1 var(--font-ui);
  letter-spacing:var(--tracking-eyebrow);
  text-transform:uppercase;
  color:var(--eyebrow-color);
}

/* ---- Meta: pasek „niżej znajdziesz" (1 września 2026) --------------------
   Ekran kończył się tabelą dokładnie na wysokości załamania strony
   i wyglądał na kompletny, choć niżej jest jeszcze karta wyniku, tryby,
   przepis i rady. Pasek stoi w treści, nie pływa nad nią — pływające
   rozwiązanie zostało odrzucone przy karcie i tutaj byłoby tym samym
   błędem. Mówi też, ILE tego jest, czego sama strzałka „przewiń" nie robi. */
.imp-e-spis{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
/* Kolor akcentu, nie szarość — napis ma być widoczny. --eyebrow-color
   sam przełącza się na fiolet w motywie jasnym, więc limonka nigdy nie
   ląduje jako tekst na jasnym tle. */
.imp-e-spis-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color);margin-right:2px}
.imp-e-spis-link{display:inline-flex;align-items:center;min-height:34px;padding:0 14px;border-radius:var(--radius-pill);border:1px solid var(--card-border);background:rgba(var(--paper-rgb),.05);color:var(--text-body);font:600 13px/1 var(--font-ui);text-decoration:none;transition:border-color 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1)}
.imp-e-spis-link:hover{border-color:var(--num-on);color:var(--text-heading)}

/* Skok do sekcji ma się zatrzymać POD paskiem menu, nie chować nagłówka
   za nim. I ma być płynny — chyba że ktoś prosi o mniej ruchu. */
.imp-e-ekran-meta-koniec [id^="meta-"]{scroll-margin-top:110px}
@media (prefers-reduced-motion:no-preference){
  .imp-e-ekran-meta-koniec{scroll-behavior:smooth}
}

/* ---- Test: poprawki po klikaniu właściciela (1 września 2026) ------------
   Odstępstwa od eksportu, mają zostać (rejestr decyzji importu). */

/* Płynne tło w lewym dolnym rogu — na wszystkich ekranach testu. */
.imp-e-test-fluid{position:absolute;left:-160px;bottom:-140px;width:520px;opacity:var(--gfx-fluid);pointer-events:none;z-index:0}

/* Pasek postępu: w lewej kolumnie, nad nadtytułem kroku. Każda gałąź
   testu ma własny. Kreska między kropkami jest osobnym kawałkiem każdej
   pozycji, więc zmienia kolor razem z nią — widać przebytą drogę,
   a nie tylko gdzie się jest. */
.imp-e-postep{list-style:none;margin:0 0 14px;padding:0;display:flex;align-items:center}
.imp-e-dot-item{flex:1;display:flex;align-items:center;gap:8px;min-width:0}
.imp-e-dot-item:last-child{flex:0 0 auto}
.imp-e-dot-item:not(:last-child)::after{content:"";flex:1;height:3px;border-radius:2px;background:var(--divider)}
.imp-e-dot-item--done::after{background:var(--violet)}
.imp-e-postep .imp-e-dot{flex:none;width:34px;height:34px;font-size:14px;border:1px solid var(--card-border)}
.imp-e-postep .imp-e-dot--done{background:var(--violet);color:var(--paper);border-color:transparent}
.imp-e-postep .imp-e-dot--on{background:var(--lime);color:var(--ink);border-color:transparent}
@media (min-width:1024px){
  .imp-e-postep{margin-bottom:18px}
  .imp-e-postep .imp-e-dot{width:40px;height:40px;font-size:16px}
}

/* Podpowiedź pod spodem miała ikonę wklejoną w tekst — ten sam odstęp co
   w ramce wyżej, i ikona nie kurczy się przy zawijaniu tekstu. */
.imp-e-hint{gap:9px}
.imp-e-hint svg{flex:none}

/* Siatka liczb: kafelka do kliknięcia NIE podświetlamy — całe zadanie
   polega na znalezieniu liczby wzrokiem. Cyfry większe, bo przy 36 polach
   trzeba je odróżniać z odległości ramienia. */
.imp-e-tile{font-size:24px}
@media (min-width:1024px){
  .imp-e-tile{font-size:38px}
}

/* Stoper siatki: jeden szeroki licznik zamiast dwóch wąskich pól —
   „szukana liczba" zniknęła, bo była ułatwieniem. */
.imp-e-attempts--siatka .imp-e-attempt{align-items:center;padding:14px 18px}
.imp-e-attempts--siatka .imp-e-attempt-value{font:400 46px/1 var(--font-display);color:var(--text-heading)}
@media (min-width:1024px){
  .imp-e-attempts--siatka .imp-e-attempt-value{font-size:60px}
}

/* Przycisk po zapisanym teście: zwykła szerokość, nie przez cały ekran. */
.imp-e-btn--auto{width:auto;min-width:220px;padding:0 28px;align-self:center}

/* Kafelek z jedynką mówi, że od niego rusza stoper — w tym kroku nie ma
   przycisku „start" i bez tego człowiek go szuka. Napis rozbity na dwie
   linie wokół cyfry, wersalikami, plus limonkowa obwódka z poświatą.
   Teksty wchodzą z atrybutów, żeby zostały w pliku językowym. */
.imp-e-tile--zacznij{position:relative;border-color:var(--lime);box-shadow:0 0 0 1px var(--lime) inset,0 0 22px rgba(var(--lime-rgb),.38)}
.imp-e-tile--zacznij::before,
.imp-e-tile--zacznij::after{position:absolute;left:0;right:0;font:700 8px/1 var(--font-ui);letter-spacing:.1em;text-transform:uppercase;color:var(--lime)}
.imp-e-tile--zacznij::before{content:attr(data-podpis-gora);top:7px}
.imp-e-tile--zacznij::after{content:attr(data-podpis-dol);bottom:7px}
@media (min-width:1024px){
  .imp-e-tile--zacznij::before,
  .imp-e-tile--zacznij::after{font-size:10px}
  .imp-e-tile--zacznij::before{top:10px}
  .imp-e-tile--zacznij::after{bottom:10px}
}

/* Krok 4 ma się mieścić w ekranie bez przewijania.
   Dwie przyczyny, obie usunięte:
   1. Górny odstęp treści (78px) był przekładem pod belkę desktopową,
      która na ekranie testu w ogóle nie występuje — test ma własną,
      w naturalnym przepływie. Tu był czystą stratą miejsca.
   2. Siatka 6 x 96px to 626px sztywnej wysokości. Teraz kafelek kurczy
      się do tego, co zostało po nagłówku i stoperze, z dolną granicą,
      żeby nie zrobił się nieklikalny. */
@media (min-width:1024px){
  .imp-e-ekran-test-krok .imp-e-e-view{padding-top:12px}
  .imp-e-ekran-test-krok [data-step="4"] .imp-e-tiles{
    --tile-size:clamp(52px, calc((100vh - 360px) / 6 - 10px), 96px);
  }
  .imp-e-ekran-test-krok [data-step="4"] .imp-e-attempts--siatka .imp-e-attempt{padding:10px 18px}
  .imp-e-ekran-test-krok [data-step="4"] .imp-e-attempts--siatka .imp-e-attempt-value{font-size:44px}
  .imp-e-ekran-test-krok [data-step="4"] .imp-e-postep{margin-bottom:12px}
}

/* ---- Ostrzeżenie przed rozpoczęciem testu (1 września 2026) --------------
   Test robi się raz i w całości; przerwanie w połowie znaczy powtórkę
   wszystkich czterech kroków. Trzeba to powiedzieć ZANIM ktoś zacznie.
   Arkusz w barwie ostrzeżenia — nie po to, żeby straszyć, tylko żeby ten
   jeden komunikat nie wyglądał jak każdy inny i został przeczytany. */
.imp-e-sheet--uwaga{border-color:var(--danger-border);box-shadow:var(--sheet-shadow),0 0 0 1px var(--danger-border)}
.imp-e-uwaga-eyebrow{display:block;font:700 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--danger)}
.imp-e-sheet--uwaga .imp-e-sheet-lead{color:var(--text-body)}

/* Ostrzeżenie przed testem: przycisk stał tuż pod tekstem i wyglądał jak
   jego część. Odstęp jak między akapitem a przyciskiem w kartach. */
.imp-e-sheet--uwaga .imp-e-btn-stack{margin-top:18px}

/* Dwie karty obok siebie na ekranie wyników: wejście w moduł i karta do
   pobrania (właściciel, 1.09.2026). Równa wysokość, żeby przyciski stały
   w jednej linii — stąd przycisk dosunięty do dołu karty. Na telefonie
   jedna pod drugą, bo w połowie szerokości nie zmieściłby się tytuł. */
.imp-e-para-kart{display:grid;grid-template-columns:1fr;gap:10px}
.imp-e-para-kart > .imp-e-panel{display:flex;flex-direction:column;gap:8px}
.imp-e-para-kart .imp-e-btn-primary{margin-top:auto}
@media (min-width:1024px){
  .imp-e-para-kart{grid-template-columns:1fr 1fr;gap:18px;align-items:stretch}
}

/* ---- Ekran wyników: mieszczenie się bez przewijania (1 września 2026) ----
   Po usunięciu zdania o kierunku odczytu zrobiło się miejsce u góry;
   reszta ściągnięta tak, żeby całość mieściła się w oknie. Wartości
   dobrane pod typowe wysokości laptopa — przy bardzo niskim oknie ekran
   dalej się przewinie, bo tabela ma pięć wierszy i nie da się jej
   ścisnąć bez szkody dla czytelności. */
@media (min-width:1024px){
  .imp-e-ekran-wyniki .imp-e-e-view{padding-top:64px;padding-bottom:40px}
  .imp-e-ekran-wyniki .imp-e-e-main{gap:14px}
  .imp-e-ekran-wyniki .imp-e-e-block{gap:6px}
  .imp-e-ekran-wyniki .imp-e-panel--pad{padding:16px 20px}
  .imp-e-ekran-wyniki .imp-e-cmp-head,
  .imp-e-ekran-wyniki .imp-e-cmp-row{padding:12px 22px}
  .imp-e-ekran-wyniki .imp-e-note-block{margin-top:2px}
  .imp-e-ekran-wyniki .imp-e-para-kart{gap:14px}
}

/* ---- Test na telefonie: stoper i przyciski na wierzchu (1 września 2026)
   Zgłoszenie właściciela: na telefonie przyciski lądowały na samym dole,
   pod całą instrukcją, a po każdym pomiarze ekran wracał na górę — więc
   przy każdej z trzech prób trzeba było przewijać w dół.

   Kolumna sterowania idzie na początek. Instrukcja zostaje pod spodem:
   czyta się ją raz, a przycisku używa się przy każdej próbie. Na
   desktopie bez zmian — tam obie kolumny widać naraz. */
@media (max-width:1023px){
  .imp-e-ekran-test-krok .imp-e-e-rail{order:-1}
}

/* Logo prowadzi na pulpit (właściciel, 1 września 2026) — dotąd było
   nieklikalne. Opakowanie nie może zmieniać wyglądu belki, więc przejmuje
   układ po elemencie, który zastąpiło. */
.imp-a-logo-link,.imp-b4-logo-link,.imp-c4-logo-link,.imp-c11-logo-link,
.imp-d-logo-link,.imp-e-logo-link,.imp-f-logo-link,.imp-g-logo-link,
.imp-b4-topbar-logo,.imp-c4-topbar-logo,.imp-c11-topbar-logo,.imp-e-topbar-logo{
  display:flex;align-items:center;gap:11px;flex:none;text-decoration:none;
}

/* Obszary D, F i G opakowane 1 września 2026 — przy pierwszym przeglądzie
   F i G jeszcze nie istniały, a ekran sesji był świadomie pominięty.
   Opakowanie stoi tam, gdzie w eksporcie stał sam obrazek, więc musi
   zniknąć z układu: w belkach z `gap` własny odstęp dublowałby przerwę
   między logo a resztą paska. */
.imp-a-logo-link,.imp-d-logo-link,.imp-f-logo-link,.imp-g-logo-link{gap:0}


/* ==========================================================================
   OBSZAR F — WIADOMOŚCI
   Import "drogą 4" (docs/instrukcja-importu-widokow.md), 1 września 2026.
   Źródło: HTML DO WDROŻENIA/obszar F/ (tokens.css + components.css +
   wiadomosci.html + wiadomosci-watek.html + README-eksport.md).

   Prefiks obszaru: .imp-f — na gołym prefiksie żyją tokeny.

   Z paczki NIE importujemy pliku wyniki-testow.html: eksport powstał
   31 sierpnia wieczorem, a 1 września ekran wyników przeszedł turę
   poprawek z właścicielem (karta wejścia w moduł, para kart, ciaśniejszy
   układ). Import cofnąłby te decyzje. Ustalone z właścicielem — wyniki
   zostają w wersji z obszaru E.

   Bloki <style> obu ekranów są identyczne, więc jedna sekcja bez
   zakresów per ekran (inaczej niż w obszarze E, gdzie się różniły).
   ========================================================================== */

/* ===== tokens.css -> prefiks .imp-f ===== */
.imp-f{--ink-rgb:28,28,30;
  --paper-rgb:251,251,251;
  --violet-rgb:112,0,255;
  --lime-rgb:203,255,0;

  --ink:#1C1C1E;
  --paper:#FBFBFB;
  --violet:#7000FF;
  --violet-hover:#5800CC;
  --lime:#CBFF00;

  --font-ui:'Inter',system-ui,sans-serif;
  --font-display:'VT323',monospace;
  --font-hand:'Caveat',cursive;
  --tracking-eyebrow:.16em;

  --radius-card:24px;
  --card-padding:24px 22px;
  --input-height:48px;
  --input-radius:16px;
  --radius-btn:16px;
  --input-padding-x:16px;
  --input-font-size:14px;
  --form-gap:16px;
  --btn-height:52px;
  --btn-font-size:16px;
  --btn-border:2px solid transparent;
  --radius-pill:999px;
  --radius-checkbox:7px;
  --eyebrow-size:10px;
  --title-card-size:38px;
  --title-hero-size:78px;
  --hand-size:18px;
  --logo-size:44px;
  --avatar-size:64px;
  --name-size:34px;

  
  --day-chip:44px;
  --radius-module:20px;
  --radius-chip:16px;
  --module-num-size:40px;
  --variant-name-size:22px;

  

  
  --bg:#1C1C1E;
  --text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --text-accent:#B98CFF;          
  --eyebrow-color:var(--lime);    
  --card-border:rgba(var(--paper-rgb),.15);
  --card-border-top:rgba(255,255,255,.5);
  --card-bg:rgba(var(--ink-rgb),.45);
  --card-blur:44px;
  --card-saturate:1.9;
  --card-shadow:0 24px 64px rgba(0,0,0,.4),0 8px 24px rgba(var(--violet-rgb),.22);

  
  --card-bg-1:rgba(var(--ink-rgb),.45);   --card-blur-1:48px; --card-saturate-1:2;
  --card-bg-2:rgba(var(--ink-rgb),.45);   --card-blur-2:48px; --card-saturate-2:2;
  --card-bg-3:rgba(var(--paper-rgb),.05);
  --card-bg-4:rgba(var(--paper-rgb),.04);
  --glass-border:rgba(255,255,255,.18);
  --glass-border-top:rgba(255,255,255,.55);
  --shadow-glass:0 24px 64px rgba(0,0,0,.35),0 8px 24px rgba(var(--violet-rgb),.25),inset 0 1px 0 rgba(255,255,255,.5);
  --ring-track:rgba(var(--paper-rgb),.14);
  --divider:rgba(var(--paper-rgb),.12);
  --input-bg:rgba(var(--paper-rgb),.06);
  --input-border:rgba(var(--paper-rgb),.24);
  --btn-outline-border:rgba(var(--paper-rgb),.3);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.58;
  --gfx-fluid:.42;
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.45),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.14),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#242427;}
:root[data-theme="light"] .imp-f{--bg:#FBFBFB;
  --text-heading:#1C1C1E;
  --text-body:#6B6870;
  --text-meta:#9A97A0;
  --text-accent:#7000FF;          
  --eyebrow-color:var(--violet);  
  --card-border:rgba(var(--ink-rgb),.1);
  --card-border-top:rgba(255,255,255,.95);
  --card-bg:rgba(255,255,255,.45);
  --card-blur:19px;
  --card-saturate:1.4;
  --card-shadow:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);

  
  --card-bg-1:rgba(var(--paper-rgb),.45); --card-blur-1:22px; --card-saturate-1:1.6;
  --card-bg-2:rgba(var(--paper-rgb),.45); --card-blur-2:22px; --card-saturate-2:1.5;
  --card-bg-3:rgba(255,255,255,.55);
  --card-bg-4:rgba(var(--ink-rgb),.02);
  --glass-border:rgba(255,255,255,.5);
  --glass-border-top:rgba(255,255,255,.8);
  --shadow-glass:0 24px 64px rgba(var(--ink-rgb),.18),0 8px 24px rgba(var(--violet-rgb),.22),inset 0 1px 0 rgba(255,255,255,.7);
  --ring-track:rgba(var(--ink-rgb),.1);
  --divider:rgba(var(--ink-rgb),.07);
  --input-bg:#fff;
  --input-border:rgba(var(--ink-rgb),.14);
  --btn-outline-border:rgba(var(--ink-rgb),.16);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.42;
  --gfx-fluid:.14;
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.08),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.1),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#F1EEF7;}
.imp-f-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
:root[data-theme="light"] .imp-f-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
@media (min-width:1024px){
.imp-f{--radius-card:26px;
    --card-padding:34px 32px;
    --input-height:50px;
    --input-padding-x:18px;
    --input-font-size:15px;
    --form-gap:18px;
    --btn-height:54px;
    --title-card-size:42px;
    --title-hero-size:88px;
    --hand-size:26px;
    --logo-size:56px;
    --avatar-size:88px;
    --name-size:56px;
    --day-chip:36px;
    --radius-module:18px;}
:root[data-theme="light"] .imp-f{--shadow-glass:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);}
}
@media (prefers-reduced-motion: reduce){
:where(.imp-f), :where(.imp-f) *{transition:none !important; animation:none !important;}
}
@media (prefers-reduced-transparency: reduce){
.imp-f{--card-bg:var(--glass-fallback-bg);
    --card-blur:0px;
    --card-saturate:1;}
.imp-f-card{backdrop-filter:none; -webkit-backdrop-filter:none;}
}
.imp-f{--day-done-bg:var(--violet);         --day-done-fg:var(--paper);
  --day-sel-bg:var(--lime);            --day-sel-fg:var(--ink);
  --day-sel-ring:0 0 0 4px rgba(var(--lime-rgb),.22);
  --day-off-bg:rgba(var(--paper-rgb),.06);
  --day-off-border:rgba(var(--paper-rgb),.16);
  --day-off-fg:var(--text-meta);
  --module-bg:#272729;
  --module-shadow:0 6px 18px rgba(var(--ink-rgb),.05);
  --module-on-bg:var(--violet);
  --module-on-shadow:0 16px 40px rgba(var(--violet-rgb),.35);
  --status-done-bg:rgba(var(--lime-rgb),.18);  --status-done-fg:var(--lime);
  --status-now-bg:rgba(185,140,255,.22);       --status-now-fg:#B98CFF;
  --status-next-bg:rgba(var(--paper-rgb),.1);  --status-next-fg:var(--text-body);
  --edge-bg:rgba(185,140,255,.07);   --edge-border:rgba(185,140,255,.32);
  --edge-on-bg:rgba(185,140,255,.16);--edge-on-border:#B98CFF;
  --day-progress:#B98CFF;            
  --danger:#FF8A80; --danger-fg:var(--ink);
  --danger-bg:rgba(227,28,65,.12); --danger-border:rgba(255,107,107,.4);}
:root[data-theme="light"] .imp-f{--day-off-bg:rgba(var(--ink-rgb),.05);
  --day-off-border:rgba(var(--ink-rgb),.12);
  --day-off-fg:#8B8792;
  --day-sel-ring:0 0 0 4px #F1E5FF;
  --module-bg:#FFFFFF;
  --module-shadow:0 6px 18px rgba(var(--ink-rgb),.06);
  --module-on-shadow:0 16px 40px rgba(var(--violet-rgb),.22);
  --status-done-bg:rgba(var(--lime-rgb),.3);   --status-done-fg:#3F4A00;
  --status-now-bg:rgba(var(--violet-rgb),.1);  --status-now-fg:var(--violet);
  --status-next-bg:rgba(var(--ink-rgb),.05);   --status-next-fg:var(--text-body);
  --edge-bg:rgba(var(--violet-rgb),.04);   --edge-border:rgba(var(--violet-rgb),.28);
  --edge-on-bg:rgba(var(--violet-rgb),.09);--edge-on-border:var(--violet);
  --danger:#B03A2E; --danger-fg:var(--paper);
  --danger-bg:rgba(227,28,65,.06); --danger-border:rgba(227,28,65,.28);}
.imp-f{--radius-glass:18px;      
  --radius-session:20px;    
  --radius-video:16px;
  --radius-variant:15px;
  --radius-nav-item:14px;
  --radius-topbar:20px;
  --variant-height:46px;
  --start-height:50px;
  --daybar-seg:7px;
  --daybar-gap:5px;
  --video-max:820px;
  --title-view-size:54px;
  --stat-value-size:30px;
  --variant-title-size:21px;
  --glass-pad:18px 20px;
  --session-pad:20px 22px;}
.imp-f{--radius-exercise:16px;
  --radius-sheet:28px;
  --radius-modal:28px;
  --radius-timer:14px;
  --topbar-mobile-h:56px;
  --exercise-pad:13px 14px;
  --timer-size:34px;
  --timer-desktop-size:44px;
  --result-title-size:58px;
  --result-title-desktop-size:72px;
  --result-card-h:492px;
  --result-card-w:600px;
  --hand-mobile-h:340px;
  --hand-desktop-h:330px;
  --scale-col-h:99px;
  --scale-gap:8px;
  --bar-radius:11px 11px 8px 8px;
  --bar-font:12.5px;
  --sheet-pad:10px 20px 22px;
  --modal-pad:32px 34px 28px;
  --progress-h:5px;

  
  --bar-off-bg:#241E31;
  --bar-off-border:rgba(var(--paper-rgb),.22);
  --bar-off-fg:var(--text-meta);
  --bar-under-bg:#4A1BA6;
  --bar-under-border:rgba(185,140,255,.65);
  --bar-under-fg:var(--paper);
  --bar-on-bg:var(--lime);
  --bar-on-border:var(--lime);
  --bar-on-fg:var(--ink);
  --bar-on-shadow:0 0 0 6px rgba(var(--lime-rgb),.16),0 10px 26px rgba(var(--lime-rgb),.3);
  --bar-hover-border:var(--lime);

  
  --sheet-bg:linear-gradient(180deg,rgba(43,33,62,.98),#1C1C1E);
  --sheet-border:rgba(185,140,255,.45);
  --sheet-shadow:0 0 0 1px rgba(185,140,255,.12),0 -30px 90px rgba(var(--violet-rgb),.45);
  --modal-shadow:0 0 0 1px rgba(185,140,255,.12),0 40px 110px rgba(var(--violet-rgb),.45),inset 0 1px 0 rgba(255,255,255,.14);
  --sheet-handle:rgba(var(--paper-rgb),.28);
  --scrim:rgba(10,10,12,.78);
  --box-bg:rgba(var(--paper-rgb),.05);
  --box-border:rgba(var(--paper-rgb),.12);
  --verdict-bg:rgba(185,140,255,.14);
  --verdict-border:rgba(185,140,255,.38);
  --verdict-fg:#E5D5FF;
  --hint-bg:rgba(var(--lime-rgb),.09);
  --hint-border:rgba(var(--lime-rgb),.32);
  --hint-fg:#E7F5B0;
  --hint-idle-bg:rgba(var(--paper-rgb),.05);
  --hint-idle-border:rgba(var(--paper-rgb),.1);
  --hint-idle-fg:var(--text-body);
  --ex-active-bg:rgba(var(--paper-rgb),.07);
  --ex-active-border:rgba(var(--lime-rgb),.34);
  --ex-flat-bg:rgba(var(--paper-rgb),.04);
  --ex-flat-border:rgba(var(--paper-rgb),.12);
  --num-on:var(--lime);
  --hand-glow:drop-shadow(0 18px 40px rgba(var(--violet-rgb),.95)) drop-shadow(0 0 60px rgba(var(--violet-rgb),.55));}
:root[data-theme="light"] .imp-f{--bar-off-bg:#FFFFFF;
  --bar-off-border:rgba(var(--ink-rgb),.16);
  --bar-off-fg:#6B6870;
  --bar-under-bg:#B98CFF;
  --bar-under-border:rgba(var(--violet-rgb),.45);
  --bar-under-fg:#FFFFFF;
  --bar-on-bg:var(--violet);
  --bar-on-border:var(--violet);
  --bar-on-fg:var(--paper);
  --bar-on-shadow:0 0 0 6px rgba(var(--lime-rgb),.42),0 10px 26px rgba(var(--lime-rgb),.5);
  --bar-hover-border:var(--violet);

  --sheet-bg:linear-gradient(180deg,#FFFFFF,#F6F2FD);
  --sheet-border:rgba(var(--violet-rgb),.28);
  --sheet-shadow:0 0 0 1px rgba(var(--violet-rgb),.08),0 -30px 90px rgba(var(--violet-rgb),.28);
  --modal-shadow:0 0 0 1px rgba(var(--violet-rgb),.08),0 40px 110px rgba(var(--violet-rgb),.24),inset 0 1px 0 #FFFFFF;
  --sheet-handle:rgba(var(--ink-rgb),.18);
  --scrim:rgba(var(--ink-rgb),.45);
  --box-bg:rgba(var(--violet-rgb),.05);
  --box-border:rgba(var(--ink-rgb),.1);
  --verdict-bg:rgba(var(--violet-rgb),.06);
  --verdict-border:rgba(var(--violet-rgb),.24);
  --verdict-fg:var(--violet);
  --hint-bg:rgba(var(--violet-rgb),.06);
  --hint-border:rgba(var(--violet-rgb),.24);
  --hint-fg:#3A3740;
  --hint-idle-bg:rgba(var(--ink-rgb),.04);
  --hint-idle-border:rgba(var(--ink-rgb),.1);
  --hint-idle-fg:#6B6870;
  --ex-active-bg:rgba(255,255,255,.86);
  --ex-active-border:rgba(var(--violet-rgb),.28);
  --ex-flat-bg:rgba(255,255,255,.55);
  --ex-flat-border:rgba(var(--ink-rgb),.1);
  --num-on:var(--violet);
  --hand-glow:drop-shadow(0 18px 40px rgba(var(--violet-rgb),.85)) drop-shadow(0 0 60px rgba(var(--violet-rgb),.5));}
@media (min-width:1024px){
.imp-f{--exercise-pad:14px 18px;
    --timer-size:var(--timer-desktop-size);
    --result-title-size:var(--result-title-desktop-size);
    --scale-col-h:99px;}
}
@media (prefers-reduced-transparency: reduce){
.imp-f{--sheet-bg:var(--glass-fallback-bg);}
}
.imp-f{--radius-panel:18px;
  --radius-panel-desktop:20px;
  --e-rail-w:360px;
  --panel-pad:16px;
  --panel-pad-desktop:16px 18px;
  --title-e-size:40px;
  --title-e-desktop-size:54px;
  --lead-size:13.5px;
  --lead-desktop-size:14px;
  --metric-size:32px;
  --metric-desktop-size:40px;
  --sign-size:24px;
  --sign-desktop-size:26px;
  --step-num:24px;
  --step-num-desktop:26px;
  --len-name-size:21px;
  --len-name-desktop-size:24px;
  --acc-head-h:58px;
  --acc-head-h-desktop:60px;
  --acc-icon:32px;
  --acc-icon-desktop:34px;
  --acc-title-size:13.5px;
  --acc-title-desktop-size:15.5px;
  --card-title-size:16px;
  --card-title-desktop-size:19px;
  --dock-h:64px;

  
  --dot-size:26px;
  --sw-value-size:44px;
  --sw-value-desktop-size:64px;
  --numbox-value-size:40px;
  --numbox-value-desktop-size:54px;
  --tile-size:52px;
  --tile-desktop-size:96px;
  --radius-tile:12px;
  --radius-tile-desktop:14px;
  --fs-timer-size:104px;
  --fs-timer-desktop-size:168px;

  
  --cmp-name-size:13px;
  --cmp-value-size:15px;
  --trio-value-size:32px;
  --trio-value-desktop-size:44px;}
.imp-f{--panel-bg:var(--card-bg-3);
  --panel-border:var(--divider);
  --panel-flat-bg:var(--card-bg-4);
  --accent-tint-bg:rgba(185,140,255,.14);
  --accent-tint-border:rgba(185,140,255,.34);
  --accent-tint-fg:#B98CFF;
  --len-name-color:var(--lime);
  --tile-bg:#272729;
  --tile-border:rgba(var(--paper-rgb),.14);
  --tile-fg:var(--paper);
  --tile-done-bg:rgba(var(--paper-rgb),.03);
  --tile-done-border:rgba(var(--paper-rgb),.08);
  --tile-done-fg:#4A4650;
  --tile-next-bg:var(--violet);
  --tile-next-fg:var(--paper);
  --dot-bg:rgba(var(--paper-rgb),.08);
  --dot-fg:var(--text-meta);
  --dot-done-bg:#4A1BA6;
  --dot-done-fg:var(--paper);
  --dot-on-bg:var(--lime);
  --dot-on-fg:var(--ink);
  --fs-bg:radial-gradient(1000px 700px at 50% 45%,rgba(var(--violet-rgb),.5),rgba(10,10,12,.98) 72%),#0E0E10;
  --delta-good:var(--lime);
  --delta-bad:#FF8A80;
  --delta-wait:var(--text-meta);
  --card-out-bg:linear-gradient(180deg,rgba(43,33,62,.98),rgba(24,24,27,.99));}
:root[data-theme="light"] .imp-f{--panel-bg:var(--card-bg-3);
  --panel-border:rgba(var(--ink-rgb),.1);
  --panel-flat-bg:rgba(var(--ink-rgb),.02);
  --accent-tint-bg:rgba(var(--violet-rgb),.09);
  --accent-tint-border:rgba(var(--violet-rgb),.28);
  --accent-tint-fg:var(--violet);
  --len-name-color:var(--violet);
  --tile-bg:rgba(255,255,255,.55);
  --tile-border:rgba(var(--ink-rgb),.1);
  --tile-fg:var(--ink);
  --tile-done-bg:rgba(var(--ink-rgb),.02);
  --tile-done-border:rgba(var(--ink-rgb),.06);
  --tile-done-fg:#B4B1BA;
  --tile-next-bg:var(--violet);
  --tile-next-fg:var(--paper);
  --dot-bg:rgba(var(--ink-rgb),.06);
  --dot-fg:var(--text-meta);
  --dot-done-bg:var(--violet);
  --dot-done-fg:var(--paper);
  --dot-on-bg:var(--lime);
  --dot-on-fg:var(--ink);
  --fs-bg:radial-gradient(1000px 700px at 50% 45%,rgba(var(--violet-rgb),.12),rgba(var(--paper-rgb),.98) 72%),#FBFBFB;
  --delta-good:var(--violet);
  --delta-bad:#B03A2E;
  --delta-wait:var(--text-meta);
  --card-out-bg:linear-gradient(180deg,rgba(var(--violet-rgb),.06),rgba(var(--paper-rgb),.96));}
@media (min-width:1024px){
.imp-f{--radius-panel:var(--radius-panel-desktop);
    --panel-pad:var(--panel-pad-desktop);
    --title-e-size:var(--title-e-desktop-size);
    --lead-size:var(--lead-desktop-size);
    --metric-size:var(--metric-desktop-size);
    --sign-size:var(--sign-desktop-size);
    --step-num:var(--step-num-desktop);
    --len-name-size:var(--len-name-desktop-size);
    --acc-head-h:var(--acc-head-h-desktop);
    --acc-icon:var(--acc-icon-desktop);
    --acc-title-size:var(--acc-title-desktop-size);
    --card-title-size:var(--card-title-desktop-size);
    --sw-value-size:var(--sw-value-desktop-size);
    --numbox-value-size:var(--numbox-value-desktop-size);
    --tile-size:var(--tile-desktop-size);
    --radius-tile:var(--radius-tile-desktop);
    --fs-timer-size:var(--fs-timer-desktop-size);
    --trio-value-size:var(--trio-value-desktop-size);}
}
@media (prefers-reduced-transparency: reduce){
.imp-f{--card-out-bg:var(--glass-fallback-bg);}
}
.imp-f{--radius-msg:20px;
  --radius-bubble:20px;
  --radius-bubble-tail:6px;
  --msg-avatar:34px;
  --msg-avatar-desktop:32px;
  --thread-avatar:38px;
  --bubble-max:88%;
  --bubble-max-desktop:74%;
  --list-w:360px;
  --composer-min:52px;
  --badge-unread-h:20px;
  --dtc-value-size:44px;
  --dtc-value-desktop-size:40px;}
.imp-f{--msg-bg:var(--card-bg-3);
  --msg-border:var(--divider);
  --msg-border-unread:rgba(185,140,255,.4);
  --msg-border-selected:var(--violet);
  --msg-ring-selected:0 0 0 3px rgba(var(--violet-rgb),.18);
  --avatar-bg:rgba(var(--violet-rgb),.22);
  --avatar-fg:#B98CFF;
  --bubble-me-bg:var(--violet);
  --bubble-me-fg:var(--paper);
  --bubble-me-shadow:0 8px 24px rgba(var(--violet-rgb),.35);
  --bubble-them-bg:var(--card-bg-3);
  --bubble-them-border:rgba(var(--paper-rgb),.13);
  --bubble-them-fg:var(--text-heading);
  --badge-unread-bg:var(--lime);
  --badge-unread-fg:var(--ink);
  --tag-new-bg:rgba(185,140,255,.22);
  --tag-new-fg:#B98CFF;}
:root[data-theme="light"] .imp-f{--msg-bg:var(--card-bg-3);
  --msg-border:rgba(var(--ink-rgb),.1);
  --msg-border-unread:rgba(var(--violet-rgb),.28);
  --avatar-bg:rgba(var(--violet-rgb),.09);
  --avatar-fg:var(--violet);
  --bubble-them-border:rgba(var(--ink-rgb),.11);
  --tag-new-bg:rgba(var(--violet-rgb),.09);
  --tag-new-fg:var(--violet);}
@media (min-width:1024px){
.imp-f{--msg-avatar:var(--msg-avatar-desktop);
    --bubble-max:var(--bubble-max-desktop);
    --dtc-value-size:var(--dtc-value-desktop-size);}
}

/* ===== components.css -> prefiks .imp-f ===== */
:where(.imp-f), :where(.imp-f) *{box-sizing:border-box}
.imp-f{margin:0;padding:0}
.imp-f{display:block;background:var(--bg);font-family:var(--font-ui);color:var(--text-body);-webkit-font-smoothing:antialiased}
:where(.imp-f) a{color:var(--text-accent);text-decoration:none}
:where(.imp-f) a:hover{color:var(--violet-hover)}
:where(.imp-f) button{font-family:inherit;border:none;background:none;padding:0;cursor:pointer}
:where(.imp-f) img{max-width:100%}
.imp-f-page{position:relative;display:block;overflow:hidden;min-height:100vh;background:var(--bg);isolation:isolate}
.imp-f-glow{position:absolute;pointer-events:none;border-radius:50%;z-index:0}
.imp-f-gfx-glass{position:absolute;pointer-events:none;opacity:var(--gfx-glass);z-index:0}
.imp-f-logo{flex:none;width:var(--logo-size);height:var(--logo-size);object-fit:contain;display:block}
.imp-f-logo--light{display:none}
:root[data-theme="light"] .imp-f-logo--dark{display:none}
:root[data-theme="light"] .imp-f-logo--light{display:block}
.imp-f-topbar{display:none}
.imp-f-topbar-logo{flex:none;display:flex;align-items:center;gap:11px}
.imp-f-topbar-nav{display:flex;gap:4px}
.imp-f-nav-item{min-height:44px;display:flex;align-items:center;gap:9px;padding:0 16px;border-radius:var(--radius-nav-item);color:var(--text-body);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-f-nav-item:hover{color:var(--text-accent)}
.imp-f-nav-item span{font:600 13px/1 var(--font-ui)}
.imp-f-nav-item--active{background:var(--lime);color:var(--ink)}
.imp-f-nav-item--active:hover{color:var(--ink)}
.imp-f-topbar-end{margin-left:auto;display:flex;align-items:center;gap:8px}
.imp-f-c-view{position:relative;z-index:1;display:flex;flex-direction:column}
.imp-f-c-head{display:block}
.imp-f-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color)}
.imp-f-view-title{margin:0;font:400 var(--title-view-size)/.9 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-f-c-grid{display:grid;min-height:0}
.imp-f-c-col{display:flex;flex-direction:column;min-width:0;min-height:0}
.imp-f-c-rail{display:flex;flex-direction:column;min-width:0;min-height:0}
.imp-f-video-frame{display:flex}
.imp-f-video-card{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:var(--radius-video);background:var(--module-bg);border:1px solid var(--card-border);box-shadow:var(--module-shadow)}
.imp-f-video-card .imp-f-gfx-glass{position:absolute;top:-60px;right:-40px;width:200px;opacity:var(--gfx-fluid)}
.imp-f-video-inner{position:relative;display:flex;flex-direction:column;align-items:center;gap:14px}
.imp-f-video-play{display:grid;place-items:center;width:78px;height:78px;border-radius:var(--radius-pill);background:var(--lime)}
.imp-f-video-note{max-width:520px;text-align:center;font:400 13px/1.4 var(--font-ui);color:var(--text-body)}
.imp-f-video-spec{position:absolute;bottom:12px;right:14px;font:600 9.5px/1 var(--font-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--text-meta)}
.imp-f-stat-bar{display:flex;align-items:stretch;padding:var(--glass-pad);border-radius:var(--radius-glass);background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--card-border)}
.imp-f-stat-cell{flex:1;min-width:0;overflow:hidden;display:flex;flex-direction:column;gap:5px;padding-right:24px}
.imp-f-stat-cell + .imp-f-stat-cell{padding-left:24px;border-left:1px solid var(--divider)}
.imp-f-stat-cell:last-child{padding-right:0}
.imp-f-stat-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-f-stat-value{font:400 var(--stat-value-size)/1 var(--font-display);color:var(--text-heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-f-stat-value--accent{color:var(--text-accent)}
.imp-f-chip-links{display:flex;flex-direction:column;gap:8px}
.imp-f-chip-links--row{flex-direction:row}
.imp-f-chip-link{flex:1;min-width:0;min-height:44px;display:flex;align-items:center;gap:7px;padding:0 16px;border-radius:var(--radius-chip);border:1px solid var(--btn-outline-border);font:500 13px/1 var(--font-ui);color:var(--btn-outline-text);text-decoration:none;transition:background 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-f-chip-link:hover{background:rgba(var(--paper-rgb),.08);border-color:var(--text-accent)}
:root[data-theme="light"] .imp-f-chip-link:hover{background:rgba(var(--ink-rgb),.05)}
.imp-f-chip-link span{margin-left:auto;color:var(--text-accent)}
.imp-f-card--rail{display:block;padding:var(--glass-pad);border-radius:var(--radius-glass);background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--card-border)}
.imp-f-daybar-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px}
.imp-f-daybar-count{flex:0 1 auto;min-width:0;font:400 20px/1 var(--font-display);color:var(--day-progress);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-f-daybar{display:flex;gap:var(--daybar-gap)}
.imp-f-daybar-seg{flex:1;min-width:0;height:var(--daybar-seg);border-radius:var(--radius-pill);background:var(--ring-track)}
.imp-f-daybar-seg--done{background:var(--day-progress)}
.imp-f-session-card{display:block;padding:var(--session-pad);border-radius:var(--radius-session);background:var(--module-bg);border:1px solid var(--card-border);box-shadow:var(--module-shadow)}
.imp-f-session-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.imp-f-session-legend{flex:1;min-width:0;text-align:right;font:400 11px/1 var(--font-ui);color:var(--text-meta);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-f-session-rule{height:1px;background:var(--divider);margin:16px 0 14px}
.imp-f-session-label{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body);margin-bottom:12px}
.imp-f-day-chips{display:flex;gap:8px}
.imp-f-day-chip{flex:none;width:var(--day-chip);height:var(--day-chip);display:grid;place-items:center;border-radius:var(--radius-pill);border:2px solid var(--day-off-border);background:var(--day-off-bg);color:var(--day-off-fg);font:600 12px/1 var(--font-ui);transition:transform 120ms cubic-bezier(.4,0,.2,1)}
.imp-f-day-chip:hover{transform:translateY(-2px)}
.imp-f-day-chip--done{background:var(--day-done-bg);border-color:var(--day-done-bg);color:var(--day-done-fg)}
.imp-f-day-chip--selected{background:var(--day-sel-bg);border-color:var(--day-sel-bg);color:var(--day-sel-fg);box-shadow:var(--day-sel-ring)}
.imp-f-variants{display:flex;flex-direction:column;gap:8px}
.imp-f-variant{display:flex;align-items:center;gap:12px;width:100%;min-height:var(--variant-height);padding:11px 15px;overflow:hidden;border-radius:var(--radius-variant);border:1px solid var(--card-border);background:var(--input-bg);text-align:left;transition:transform 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-f-variant:hover{transform:translateY(-2px)}
.imp-f-variant-name{flex:none;font:400 var(--variant-title-size)/1 var(--font-display);color:var(--text-heading)}
.imp-f-variant-desc{flex:1;min-width:0;font:400 12.5px/1.35 var(--font-ui);color:var(--text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-f-variant-time{flex:none;font:600 13px/1 var(--font-ui);color:var(--text-heading);white-space:nowrap}
.imp-f-variant--selected{background:var(--violet);border-color:var(--violet)}
.imp-f-variant--selected .imp-f-variant-name,.imp-f-variant--selected .imp-f-variant-time{color:var(--paper)}
.imp-f-variant--selected .imp-f-variant-desc{color:#E4DDF7}
.imp-f-btn-start{display:flex;align-items:center;justify-content:center;gap:10px;min-height:var(--start-height);border-radius:var(--radius-nav-item);background:var(--lime);border:var(--btn-border);color:var(--ink);font:600 15px/1 var(--font-ui);text-decoration:none;transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-f-btn-start:hover{background:var(--violet);color:var(--paper);border-color:var(--lime)}
@media (min-width:1024px){
.imp-f-video-frame{flex:1;min-height:0;align-items:flex-start}
.imp-f-video-card{max-height:100%}
.imp-f-topbar{position:absolute;top:16px;left:24px;right:24px;z-index:3;display:flex;align-items:center;gap:24px;padding:10px 14px 10px 18px;border-radius:var(--radius-topbar);background:var(--card-bg-2);backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));-webkit-backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
}
.imp-f-appbar{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 16px;min-height:var(--topbar-mobile-h);background:var(--card-bg-2);backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));-webkit-backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));border-bottom:1px solid var(--card-border)}
.imp-f-appbar-back{display:flex;align-items:center;min-height:44px;font:400 13px/1 var(--font-ui);color:var(--text-body);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-f-appbar-back:hover{color:var(--text-accent)}
.imp-f-appbar-title{font:600 12.5px/1 var(--font-ui);color:var(--text-heading)}
.imp-f-badge-variant{padding:5px 9px;border-radius:8px;background:var(--status-now-bg);font:600 10.5px/1 var(--font-ui);letter-spacing:.06em;color:var(--status-now-fg)}
.imp-f-session-view{position:relative;z-index:1;display:flex;flex-direction:column;gap:12px;padding:14px 16px 0;flex:1;min-height:0}
.imp-f-session-foot{position:relative;z-index:1;display:flex;flex-direction:column;gap:5px;padding:10px 16px 14px}
.imp-f-session-note{text-align:center;font:400 11px/1 var(--font-ui);color:var(--text-body)}
.imp-f-sec-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body)}
.imp-f-props{display:flex;flex-wrap:wrap;gap:8px}
.imp-f-prop{display:flex;flex:0 0 auto;align-items:center;min-height:34px;padding:0 12px;border-radius:var(--radius-chip);background:var(--ex-flat-bg);border:1px dashed var(--input-border);font:400 11.5px/1 var(--font-ui);color:var(--text-body)}
.imp-f-ex-list{display:flex;flex-direction:column;gap:9px}
.imp-f-ex{padding:var(--exercise-pad);border-radius:var(--radius-exercise);background:var(--ex-flat-bg);border:1px solid var(--ex-flat-border);display:flex;align-items:center;gap:10px}
.imp-f-ex--done{opacity:.6}
.imp-f-ex--active{flex-direction:column;align-items:stretch;gap:11px;background:var(--ex-active-bg);border-color:var(--ex-active-border)}
.imp-f-ex-row{display:flex;align-items:flex-start;gap:10px}
.imp-f-ex-num{flex:0 0 auto;width:22px;height:22px;display:grid;place-items:center;border-radius:7px;border:1px solid var(--input-border);font:600 11px/1 var(--font-ui);color:var(--text-body)}
.imp-f-ex-num--done{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.imp-f-ex-num--active{border:2px solid var(--num-on);color:var(--num-on)}
.imp-f-ex-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.imp-f-ex-title{font:600 14px/1.3 var(--font-ui);color:var(--text-heading)}
.imp-f-ex-meta{font:400 11px/1 var(--font-ui);color:var(--text-body)}
.imp-f-ex-desc{margin:0;font:400 12.5px/1.5 var(--font-ui);color:var(--text-body);text-wrap:pretty}
.imp-f-ex-points{display:flex;flex-direction:column;gap:5px;margin-top:2px}
.imp-f-ex-point{display:flex;align-items:flex-start;gap:8px;font:400 12px/1.4 var(--font-ui);color:var(--text-body)}
.imp-f-ex-point::before{content:"";flex:0 0 auto;width:4px;height:4px;margin-top:7px;border-radius:var(--radius-pill);background:var(--num-on)}
.imp-f-timer{display:flex;align-items:baseline;gap:9px;padding:8px 12px;border-radius:var(--radius-timer);background:var(--module-bg);border:1px solid var(--card-border)}
.imp-f-timer-value{font:400 var(--timer-size)/1 var(--font-display);color:var(--text-heading)}
.imp-f-timer-meta{font:400 12px/1 var(--font-ui);color:var(--text-body)}
.imp-f-progress{height:var(--progress-h);border-radius:4px;background:var(--ring-track);overflow:hidden}
.imp-f-progress-fill{display:block;height:100%;background:var(--num-on)}
.imp-f-btn-primary{display:flex;align-items:center;justify-content:center;width:100%;min-height:var(--btn-height);border-radius:var(--radius-btn);background:var(--lime);border:var(--btn-border);color:var(--ink);font:600 15px/1 var(--font-ui);text-decoration:none;box-shadow:0 14px 34px rgba(var(--lime-rgb),.22);transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-f-btn-primary:hover{background:var(--violet);color:var(--paper);border-color:var(--lime)}
.imp-f-btn-primary[disabled]{background:var(--hint-idle-bg);border:1px solid var(--hint-idle-border);color:var(--text-meta);box-shadow:none;cursor:not-allowed}
.imp-f-btn-outline{display:flex;align-items:center;justify-content:center;width:100%;min-height:var(--btn-height);border-radius:var(--radius-btn);background:transparent;border:1px solid var(--btn-outline-border);color:var(--btn-outline-text);font:600 14px/1 var(--font-ui);text-decoration:none;transition:border-color 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1)}
.imp-f-btn-outline:hover{border-color:var(--text-accent);color:var(--text-accent)}
.imp-f-btn-ghost{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;border-radius:var(--radius-chip);background:none;color:var(--text-body);font:500 13.5px/1 var(--font-ui);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-f-btn-ghost:hover{color:var(--text-heading)}
.imp-f-btn-stack{display:flex;flex-direction:column;gap:6px}
.imp-f-scrim{position:fixed;inset:0;z-index:5;background:var(--scrim)}
.imp-f-sheet{position:fixed;z-index:7;left:0;right:0;bottom:0;padding:var(--sheet-pad);border-radius:var(--radius-sheet);background:var(--sheet-bg);border:1px solid var(--sheet-border);box-shadow:var(--sheet-shadow)}
.imp-f-sheet-handle{display:block;width:44px;height:4px;margin:0 auto 14px;border-radius:var(--radius-pill);background:var(--sheet-handle)}
.imp-f-sheet-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}
.imp-f-sheet-meta{font:400 11px/1 var(--font-ui);color:var(--text-meta)}
.imp-f-sheet-title{margin:0;font:700 21px/1.25 var(--font-ui);color:var(--text-heading);text-wrap:pretty}
.imp-f-sheet-lead{margin:8px 0 0;font:400 12.5px/1.55 var(--font-ui);color:var(--text-body);text-wrap:pretty}
.imp-f-scale{display:flex;align-items:flex-end;gap:var(--scale-gap);height:var(--scale-col-h)}
.imp-f-scale-col{flex:1;height:var(--scale-col-h);display:flex;align-items:flex-end;background:none;border:none;padding:0}
.imp-f-bar{width:100%;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;border-radius:var(--bar-radius);border:1px solid var(--bar-off-border);background:var(--bar-off-bg);color:var(--bar-off-fg);font:600 var(--bar-font)/1 var(--font-ui);transition:background 200ms cubic-bezier(.4,0,.2,1),border-color 200ms cubic-bezier(.4,0,.2,1),color 200ms cubic-bezier(.4,0,.2,1),transform 260ms cubic-bezier(.34,1.56,.64,1),box-shadow 260ms cubic-bezier(.4,0,.2,1)}
.imp-f-scale-col:hover .imp-f-bar{border-color:var(--bar-hover-border)}
.imp-f-bar--under{background:var(--bar-under-bg);border-color:var(--bar-under-border);color:var(--bar-under-fg)}
.imp-f-bar--on{background:var(--bar-on-bg);border-color:var(--bar-on-border);color:var(--bar-on-fg);box-shadow:var(--bar-on-shadow)}
.imp-f-scale-col:nth-child(1) .imp-f-bar{height:30%}
.imp-f-scale-col:nth-child(2) .imp-f-bar{height:37%}
.imp-f-scale-col:nth-child(3) .imp-f-bar{height:44%}
.imp-f-scale-col:nth-child(4) .imp-f-bar{height:51%}
.imp-f-scale-col:nth-child(5) .imp-f-bar{height:58%}
.imp-f-scale-col:nth-child(6) .imp-f-bar{height:65%}
.imp-f-scale-col:nth-child(7) .imp-f-bar{height:72%}
.imp-f-scale-col:nth-child(8) .imp-f-bar{height:79%}
.imp-f-scale-col:nth-child(9) .imp-f-bar{height:86%}
.imp-f-scale-col:nth-child(10) .imp-f-bar{height:94%}
.imp-f-scale-legend{display:flex;align-items:center;justify-content:space-between;font:400 11.5px/1 var(--font-ui);color:var(--text-meta)}
.imp-f-hint{display:flex;align-items:center;min-height:48px;padding:11px 14px;border-radius:var(--radius-chip);background:var(--hint-bg);border:1px solid var(--hint-border);font:400 12px/1.45 var(--font-ui);color:var(--hint-fg)}
.imp-f-hint--idle{background:var(--hint-idle-bg);border-color:var(--hint-idle-border);color:var(--hint-idle-fg)}
.imp-f-scale-block{display:flex;flex-direction:column;gap:11px;margin-top:16px}
.imp-f-result-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color);margin-bottom:6px}
.imp-f-result-title{margin:0;font:400 var(--result-title-size)/.86 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-f-result-hand{position:fixed;z-index:6;left:-26px;bottom:302px;height:var(--hand-mobile-h);width:auto;pointer-events:none;filter:var(--hand-glow)}
.imp-f-stat-boxes{display:flex;gap:8px;margin-top:16px}
.imp-f-stat-box{flex:1;padding:11px 13px;border-radius:var(--radius-chip);background:var(--box-bg);border:1px solid var(--box-border)}
.imp-f-stat-box-value{font:400 26px/1 var(--font-display);color:var(--text-heading)}
.imp-f-stat-box-value--accent{color:var(--num-on)}
.imp-f-stat-box-label{font:400 10px/1.3 var(--font-ui);color:var(--text-body);margin-top:3px}
.imp-f-verdict{display:flex;align-items:center;gap:9px;min-height:44px;margin-top:8px;padding:0 13px;border-radius:var(--radius-chip);background:var(--verdict-bg);border:1px solid var(--verdict-border);font:600 12.5px/1.3 var(--font-ui);color:var(--verdict-fg)}
.imp-f-verdict svg{flex:0 0 auto}
@media (min-width:1024px){
.imp-f-appbar{display:none}
.imp-f-session-view{padding:104px 140px 24px;gap:20px}
.imp-f-session-foot{padding:0 140px 40px;max-width:520px}
.imp-f-ex-list{gap:12px}
.imp-f-timer-value{font-size:var(--timer-desktop-size)}
.imp-f-sheet{position:fixed;left:50%;top:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);width:var(--result-card-w);padding:var(--modal-pad);border-radius:var(--radius-modal);box-shadow:var(--modal-shadow)}
.imp-f-sheet-handle{display:none}
.imp-f-sheet-title{font-size:26px}
.imp-f-sheet-lead{font-size:13.5px}
.imp-f-scale-legend{font-size:12.5px}
.imp-f-hint{min-height:52px;font-size:12.5px}
.imp-f-sheet--result{height:var(--result-card-h);overflow:hidden;display:flex;flex-direction:column}
.imp-f-sheet--result .imp-f-result-hand{position:absolute;left:2px;bottom:-84px;height:var(--hand-desktop-h)}
.imp-f-sheet--result .imp-f-result-col{position:relative;z-index:2;margin:auto 0 0 auto;width:308px;display:flex;flex-direction:column;gap:8px}
.imp-f-sheet--result .imp-f-stat-boxes{margin-top:0}
.imp-f-sheet--result .imp-f-verdict{margin-top:0}
.imp-f-result-title{font-size:var(--result-title-desktop-size)}
}
.imp-f-e-view{position:relative;z-index:1;display:flex;flex-direction:column;gap:20px;padding:20px 20px 108px}
.imp-f-e-main{display:flex;flex-direction:column;gap:16px;min-width:0}
.imp-f-e-rail{display:flex;flex-direction:column;gap:14px;min-width:0}
.imp-f-e-block{display:flex;flex-direction:column;gap:10px}
.imp-f-e-title{margin:0;font:400 var(--title-e-size)/.94 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-f-e-sub{margin:0;font:600 21px/1.25 var(--font-ui);color:var(--text-heading)}
.imp-f-lead{margin:0;font:400 var(--lead-size)/1.6 var(--font-ui);color:var(--text-body);text-wrap:pretty}
.imp-f-lead--small{font-size:12.5px}
.imp-f-sign{font:400 var(--sign-size)/1 var(--font-hand);color:var(--text-accent)}
.imp-f-appbar--e{justify-content:space-between}
.imp-f-panel{padding:var(--panel-pad);border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border)}
.imp-f-panel--flat{background:var(--panel-flat-bg)}
.imp-f-panel--glass{background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
.imp-f-panel--pad{padding:18px}
.imp-f-panel-stack{display:flex;flex-direction:column;gap:12px}
.imp-f-card-title{font:600 var(--card-title-size)/1.3 var(--font-ui);color:var(--text-heading)}
.imp-f-metrics{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.imp-f-metric{display:flex;flex-direction:column;gap:5px;min-width:0}
.imp-f-metric-value{font:400 var(--metric-size)/1 var(--font-display);color:var(--text-heading)}
.imp-f-metric-label{font:400 9.5px/1.2 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-body)}
.imp-f-steps{display:flex;flex-direction:column;gap:10px}
.imp-f-step{display:flex;gap:12px;align-items:flex-start}
.imp-f-step-num{flex:0 0 auto;width:var(--step-num);height:var(--step-num);display:grid;place-items:center;border-radius:8px;background:var(--accent-tint-bg);border:1px solid var(--accent-tint-border);font:600 11px/1 var(--font-ui);color:var(--accent-tint-fg)}
.imp-f-step-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.imp-f-step-title{font:600 13.5px/1.3 var(--font-ui);color:var(--text-heading)}
.imp-f-step-desc{font:400 12px/1.45 var(--font-ui);color:var(--text-body)}
.imp-f-len-row{display:flex;align-items:center;gap:12px}
.imp-f-len-name{flex:0 0 58px;font:400 var(--len-name-size)/1 var(--font-display);color:var(--len-name-color)}
.imp-f-len-time{flex:0 0 92px;font:600 12.5px/1 var(--font-ui);color:var(--text-heading)}
.imp-f-len-desc{flex:1;min-width:0;font:400 12px/1.35 var(--font-ui);color:var(--text-body)}
.imp-f-acc{border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border);overflow:hidden}
.imp-f-acc[open]{border-color:var(--accent-tint-border)}
.imp-f-acc-head{display:flex;align-items:center;gap:12px;min-height:var(--acc-head-h);padding:0 16px;cursor:pointer;list-style:none;transition:background 150ms cubic-bezier(.4,0,.2,1)}
.imp-f-acc-head::-webkit-details-marker{display:none}
.imp-f-acc-head:hover{background:var(--panel-flat-bg)}
.imp-f-acc-icon{flex:0 0 auto;width:var(--acc-icon);height:var(--acc-icon);border-radius:10px;background:var(--accent-tint-bg);border:1px solid var(--accent-tint-border);display:grid;place-items:center;color:var(--accent-tint-fg)}
.imp-f-acc-title{flex:1;font:600 var(--acc-title-size)/1.35 var(--font-ui);color:var(--text-heading)}
.imp-f-acc-sign{flex:0 0 auto;width:26px;height:26px;border-radius:8px;border:1px solid var(--input-border);display:grid;place-items:center;font:400 15px/1 var(--font-ui);color:var(--accent-tint-fg)}
.imp-f-acc-sign::after{content:"+"}
.imp-f-acc[open] .imp-f-acc-sign::after{content:"\2013"}
.imp-f-acc-body{display:flex;flex-direction:column;gap:10px;padding:0 16px 16px}
.imp-f-def{display:flex;flex-direction:column;gap:3px}
.imp-f-def-term{font:600 13px/1.4 var(--font-ui);color:var(--text-heading)}
.imp-f-def-desc{font:400 12.5px/1.6 var(--font-ui);color:var(--text-body)}
.imp-f-badge-done{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:0 11px;border-radius:11px;background:var(--accent-tint-bg);border:1px solid var(--accent-tint-border);font:600 11px/1 var(--font-ui);color:var(--accent-tint-fg);align-self:flex-start}
.imp-f-badge-done svg{flex:0 0 auto}
.imp-f-dock{position:sticky;bottom:12px;z-index:3;margin:0 12px;display:flex;gap:4px;padding:6px;border-radius:22px;background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
.imp-f-dock-item{flex:1;min-height:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border-radius:16px;color:var(--text-body);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-f-dock-item:hover{color:var(--text-accent)}
.imp-f-dock-item span{font:600 9.5px/1 var(--font-ui);letter-spacing:.08em;text-transform:uppercase}
.imp-f-dock-item--active{background:var(--lime);color:var(--ink)}
.imp-f-dock-item--active:hover{color:var(--ink)}
.imp-f-test-bar{position:relative;z-index:2;display:flex;align-items:center;gap:12px;padding:12px 16px;min-height:var(--topbar-mobile-h)}
.imp-f-test-bar-title{margin-left:auto;font:400 11.5px/1 var(--font-ui);color:var(--text-meta)}
.imp-f-dots{display:flex;align-items:center;gap:6px}
.imp-f-dot{width:var(--dot-size);height:var(--dot-size);display:grid;place-items:center;border-radius:var(--radius-pill);background:var(--dot-bg);color:var(--dot-fg);font:600 11px/1 var(--font-ui)}
.imp-f-dot--done{background:var(--dot-done-bg);color:var(--dot-done-fg)}
.imp-f-dot--on{background:var(--dot-on-bg);color:var(--dot-on-fg)}
.imp-f-dots-label{font:400 10px/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body)}
.imp-f-sw{display:flex;flex-direction:column;gap:6px;padding:16px 18px;border-radius:var(--radius-timer);background:var(--module-bg);border:1px solid var(--card-border)}
.imp-f-sw-value{font:400 var(--sw-value-size)/1 var(--font-display);color:var(--text-heading)}
.imp-f-sw-meta{font:400 11.5px/1 var(--font-ui);color:var(--text-body)}
.imp-f-attempts{display:flex;gap:8px}
.imp-f-attempt{flex:1;padding:11px 13px;border-radius:var(--radius-chip);background:var(--panel-flat-bg);border:1px solid var(--panel-border);display:flex;flex-direction:column;gap:4px}
.imp-f-attempt-label{font:400 10px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-body)}
.imp-f-attempt-value{font:400 20px/1 var(--font-display);color:var(--text-heading)}
.imp-f-attempt--best .imp-f-attempt-value{color:var(--num-on)}
.imp-f-row-between{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.imp-f-num-pair{display:flex;align-items:center;gap:14px}
.imp-f-num-box{flex:1;min-width:0;padding:12px 14px;border-radius:var(--radius-chip);background:var(--panel-flat-bg);border:1px solid var(--panel-border);display:flex;flex-direction:column;gap:4px}
.imp-f-num-label{font:400 10px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-body)}
.imp-f-num-value{font:400 var(--numbox-value-size)/1 var(--font-display);color:var(--text-heading)}
.imp-f-num-arrow{flex:0 0 auto;color:var(--accent-tint-fg)}
.imp-f-fullstop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;min-height:100vh;padding:40px 24px;background:var(--fs-bg);text-align:center;cursor:pointer}
.imp-f-fs-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color)}
.imp-f-fs-timer{font:400 var(--fs-timer-size)/1 var(--font-display);color:var(--text-heading)}
.imp-f-fs-stop{font:400 46px/1 var(--font-display);letter-spacing:.06em;color:var(--num-on)}
.imp-f-fs-note{max-width:520px;font:400 13px/1.6 var(--font-ui);color:var(--text-body)}
.imp-f-tiles{display:grid;grid-template-columns:repeat(6,var(--tile-size));gap:7px;justify-content:center}
.imp-f-tile{width:var(--tile-size);height:var(--tile-size);display:grid;place-items:center;border-radius:var(--radius-tile);background:var(--tile-bg);border:1px solid var(--tile-border);color:var(--tile-fg);font:400 20px/1 var(--font-display)}
.imp-f-tile--done{background:var(--tile-done-bg);border-color:var(--tile-done-border);color:var(--tile-done-fg)}
.imp-f-tile--next{background:var(--tile-next-bg);border-color:var(--tile-next-bg);color:var(--tile-next-fg)}
.imp-f-cmp{border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border);overflow:hidden}
.imp-f-cmp-head,.imp-f-cmp-row{display:grid;grid-template-columns:1fr 92px 92px;align-items:center;gap:10px;padding:12px 16px}
.imp-f-cmp--delta .imp-f-cmp-head,.imp-f-cmp--delta .imp-f-cmp-row{grid-template-columns:1fr 84px 84px 78px}
.imp-f-cmp-row + .imp-f-cmp-row,.imp-f-cmp-head + .imp-f-cmp-row{border-top:1px solid var(--divider)}
.imp-f-cmp-head{background:var(--panel-flat-bg)}
.imp-f-cmp-th{font:400 10px/1.3 var(--font-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--text-body)}
.imp-f-cmp-name{display:flex;flex-direction:column;gap:3px;min-width:0}
.imp-f-cmp-name b{font:600 var(--cmp-name-size)/1.35 var(--font-ui);color:var(--text-heading)}
.imp-f-cmp-name span{font:400 11px/1.3 var(--font-ui);color:var(--text-meta)}
.imp-f-cmp-val{font:400 var(--cmp-value-size)/1 var(--font-display);color:var(--text-heading)}
.imp-f-cmp-wait{font:400 11px/1.3 var(--font-ui);color:var(--delta-wait)}
.imp-f-cmp-delta{font:600 13px/1 var(--font-ui);color:var(--delta-good)}
.imp-f-cmp-delta--bad{color:var(--delta-bad)}
.imp-f-trio{display:grid;grid-template-columns:1fr;gap:10px}
.imp-f-trio-cell{padding:16px 18px;border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border);display:flex;flex-direction:column;gap:5px}
.imp-f-trio-value{font:400 var(--trio-value-size)/1 var(--font-display);color:var(--text-heading)}
.imp-f-trio-label{font:400 10px/1.3 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-body)}
.imp-f-note-block{display:flex;flex-direction:column;gap:8px}
.imp-f-note-block p{margin:0;font:400 12.5px/1.6 var(--font-ui);color:var(--text-body);text-wrap:pretty}
.imp-f-note-block b{color:var(--text-heading)}
@media (min-width:1024px){
.imp-f-e-view{display:grid;grid-template-columns:1fr var(--e-rail-w);gap:28px;align-items:start;padding:158px 140px 70px}
.imp-f-e-view--single{display:block;max-width:1020px;margin:0 auto}
.imp-f-metrics{grid-template-columns:repeat(4,1fr);gap:0}
.imp-f-metric{padding:0 22px}
.imp-f-metric + .imp-f-metric{border-left:1px solid var(--divider)}
.imp-f-metric:first-child{padding-left:0}
.imp-f-metric:last-child{padding-right:0}
.imp-f-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.imp-f-step{flex-direction:column;gap:8px;padding:16px 18px;border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border)}
.imp-f-step-title{font-size:14px}
.imp-f-step-desc{font-size:12.5px}
.imp-f-len-row{gap:16px}
.imp-f-len-name{flex-basis:76px}
.imp-f-len-time{flex-basis:130px;font-size:13.5px}
.imp-f-len-desc{font-size:13px}
.imp-f-acc-body{padding:0 22px 20px;gap:12px}
.imp-f-dock{display:none}
.imp-f-appbar--e{display:none}
.imp-f-test-bar{padding:22px 60px}
.imp-f-trio{grid-template-columns:repeat(3,1fr)}
.imp-f-tiles{gap:10px}
.imp-f-cmp-head,.imp-f-cmp-row{padding:14px 22px}
.imp-f-cmp-head,.imp-f-cmp-row{grid-template-columns:1fr 150px 150px}
.imp-f-cmp--delta .imp-f-cmp-head,.imp-f-cmp--delta .imp-f-cmp-row{grid-template-columns:1fr 150px 150px 130px}
}
.imp-f-f-view{position:relative;z-index:1;display:flex;flex-direction:column;gap:16px;padding:20px 20px 108px}
.imp-f-f-head{display:flex;flex-direction:column;gap:6px}
.imp-f-f-title{margin:0;font:400 var(--title-e-size)/.94 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-f-f-back{display:inline-flex;align-items:center;gap:7px;min-height:44px;font:500 12.5px/1 var(--font-ui);color:var(--text-body);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-f-f-back:hover{color:var(--text-accent)}
.imp-f-filters{display:flex;gap:6px}
.imp-f-filter{padding:8px 13px;border-radius:20px;border:1px solid var(--input-border);font:400 11.5px/1 var(--font-ui);color:var(--text-body);text-decoration:none;transition:border-color 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1)}
.imp-f-filter:hover{border-color:var(--text-accent);color:var(--text-accent)}
.imp-f-filter--active{background:var(--lime);border-color:var(--lime);color:var(--ink);font-weight:600}
.imp-f-filter--active:hover{color:var(--ink)}
.imp-f-msg-list{display:flex;flex-direction:column;gap:10px}
.imp-f-msg-row{display:flex;align-items:flex-start;gap:12px;padding:16px 18px;border-radius:var(--radius-msg);background:var(--msg-bg);border:1px solid var(--msg-border);text-decoration:none;transition:transform 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-f-msg-row:hover{transform:translateY(-3px);border-color:var(--msg-border-unread)}
.imp-f-msg-row--unread{border-color:var(--msg-border-unread)}
.imp-f-msg-row--selected{border-color:var(--msg-border-selected);box-shadow:var(--msg-ring-selected)}
.imp-f-avatar{flex:0 0 auto;width:var(--msg-avatar);height:var(--msg-avatar);border-radius:var(--radius-pill);background:var(--avatar-bg);display:grid;place-items:center;font:600 11.5px/1 var(--font-ui);color:var(--avatar-fg)}
.imp-f-avatar--lg{width:var(--thread-avatar);height:var(--thread-avatar);font-size:12.5px}
.imp-f-msg-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.imp-f-msg-top{display:flex;align-items:baseline;gap:10px}
.imp-f-msg-subject{flex:1;min-width:0;font:600 13.5px/1.35 var(--font-ui);color:var(--text-heading);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-f-msg-subject--read{color:var(--text-body)}
.imp-f-msg-time{flex:0 0 auto;font:400 11px/1 var(--font-ui);color:var(--text-meta)}
.imp-f-msg-preview{font:400 12.5px/1.45 var(--font-ui);color:var(--text-body);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-f-msg-meta{font:400 11.5px/1 var(--font-ui);color:var(--text-meta)}
.imp-f-badge-unread{flex:0 0 auto;min-width:var(--badge-unread-h);height:var(--badge-unread-h);padding:0 6px;border-radius:var(--radius-pill);background:var(--badge-unread-bg);color:var(--badge-unread-fg);display:grid;place-items:center;font:600 10.5px/1 var(--font-ui)}
.imp-f-tag-new{font:600 10.5px/1 var(--font-ui);padding:5px 9px;border-radius:20px;background:var(--tag-new-bg);color:var(--tag-new-fg)}
.imp-f-empty{padding:32px 22px;border-radius:var(--radius-msg);background:var(--msg-bg);border:1px solid var(--msg-border);text-align:center}
.imp-f-empty-icon{width:56px;height:56px;margin:0 auto 16px;border-radius:var(--radius-pill);background:var(--avatar-bg);display:grid;place-items:center;color:var(--avatar-fg)}
.imp-f-empty-title{font:400 22px/1 var(--font-display);text-transform:uppercase;color:var(--text-heading)}
.imp-f-empty-text{margin:10px auto 18px;max-width:250px;font:400 12.5px/1.55 var(--font-ui);color:var(--text-body)}
.imp-f-thread-head{display:flex;align-items:center;gap:11px}
.imp-f-thread-who{display:flex;flex-direction:column;gap:3px;min-width:0}
.imp-f-thread-name{font:600 14px/1.2 var(--font-ui);color:var(--text-heading)}
.imp-f-thread-sub{font:400 11px/1 var(--font-ui);color:var(--text-meta)}
.imp-f-thread-subject{margin:0;font:600 18px/1.3 var(--font-ui);color:var(--text-heading);text-wrap:pretty}
.imp-f-thread-meta{margin:0;font:400 11.5px/1 var(--font-ui);color:var(--text-meta)}
.imp-f-thread{display:flex;flex-direction:column;gap:14px}
.imp-f-msg{display:flex;flex-direction:column;gap:7px}
.imp-f-msg--me{align-items:flex-end}
.imp-f-msg--them{align-items:flex-start}
.imp-f-msg-from{display:flex;align-items:center;gap:9px}
.imp-f-msg-from span{font:600 11.5px/1 var(--font-ui);color:var(--text-accent)}
.imp-f-bubble{max-width:var(--bubble-max);padding:15px 17px;border-radius:var(--radius-bubble)}
.imp-f-bubble p{margin:0;font:400 13.5px/1.55 var(--font-ui)}
.imp-f-msg--me .imp-f-bubble{border-bottom-right-radius:var(--radius-bubble-tail);background:var(--bubble-me-bg);color:var(--bubble-me-fg);box-shadow:var(--bubble-me-shadow)}
.imp-f-msg--them .imp-f-bubble{border-bottom-left-radius:var(--radius-bubble-tail);background:var(--bubble-them-bg);border:1px solid var(--bubble-them-border);color:var(--bubble-them-fg)}
.imp-f-msg-stamp{font:400 11px/1 var(--font-ui);color:var(--text-meta)}
.imp-f-composer{padding:18px;border-radius:22px;background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
.imp-f-composer label{display:block;font:600 13px/1 var(--font-ui);color:var(--text-heading);margin-bottom:10px}
.imp-f-composer textarea{width:100%;box-sizing:border-box;padding:14px 16px;border-radius:var(--input-radius);border:1px solid var(--input-border);background:var(--input-bg);font:400 13.5px/1.5 var(--font-ui);color:var(--text-heading);resize:vertical}
.imp-f-composer .imp-f-btn-primary{margin-top:12px}
.imp-f-dtc{display:flex;flex-direction:column;gap:8px}
.imp-f-dtc-value{font:400 var(--dtc-value-size)/1 var(--font-display);color:var(--text-heading)}
.imp-f-dtc-pair{display:flex;align-items:baseline;gap:12px}
.imp-f-dtc-pair .imp-f-dtc-value--from{color:var(--text-body)}
.imp-f-dtc-arrow{font:400 20px/1 var(--font-ui);color:var(--text-meta)}
.imp-f-dtc-delta{font:600 13px/1 var(--font-ui);color:var(--delta-good)}
@media (min-width:1024px){
.imp-f-f-view{display:grid;grid-template-columns:1fr;gap:22px;padding:104px 60px 40px}
.imp-f-f-view--master{grid-template-columns:var(--list-w) 1fr;align-items:start}
.imp-f-f-view--results{grid-template-columns:1fr var(--e-rail-w)}
.imp-f-f-topline{grid-column:1 / -1;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:0 8px}
.imp-f-f-title{font-size:44px}
.imp-f-msg-row{padding:16px}
.imp-f-msg-subject{font-size:13.5px}
.imp-f-thread-panel{display:flex;flex-direction:column;min-width:0;border-radius:var(--radius-panel);background:var(--msg-bg);border:1px solid var(--msg-border);overflow:hidden;height:640px}
.imp-f-thread-panel .imp-f-thread-bar{display:flex;align-items:center;gap:12px;padding:18px 22px;border-bottom:1px solid var(--divider)}
.imp-f-thread-panel .imp-f-thread{flex:1;padding:22px;gap:16px;overflow:hidden;background:var(--card-bg-4)}
.imp-f-thread-panel .imp-f-composer{border-radius:0;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;border:none;border-top:1px solid var(--divider);box-shadow:none;display:flex;gap:10px;align-items:flex-end;padding:16px 22px 20px}
.imp-f-thread-panel .imp-f-composer textarea{flex:1;min-height:var(--composer-min);resize:none}
.imp-f-thread-panel .imp-f-composer .imp-f-btn-primary{margin-top:0;width:auto;padding:0 22px;min-height:var(--composer-min)}
.imp-f-empty--panel{margin:auto;border:1px dashed var(--msg-border);background:none}
}



/* ===== wiadomosci.style.css -> prefiks .imp-f ===== */
.imp-f-glow--a{top:-160px;right:-190px;width:520px;height:520px;background:var(--glow-violet)}
.imp-f-glow--b{bottom:-170px;left:-180px;width:460px;height:460px;background:var(--glow-lime)}
.imp-f-gfx--spiral{bottom:-150px;left:-110px;width:330px}
@media (min-width:1024px){
.imp-f-gfx--spiral{bottom:-190px;left:-150px;width:470px}
}



/* ---- PRZEKŁADY makieta -> żywa strona (Krok 2 instrukcji) ---------------- */

/* Skaczący pasek adresu w mobilnym Safari; 100vh jako zapas dla
   przeglądarek bez dvh. overflow:clip obok hidden, żeby nie powstawał
   kontener przewijania i position:sticky działało. */
.imp-f-page{min-height:100vh;min-height:100dvh;overflow:hidden;overflow:clip}

/* Dok pływa nad przewijaną treścią i musi ominąć pasek gestów iPhone'a. */
@media (max-width:1023px){
  .imp-f-dock{bottom:calc(12px + env(safe-area-inset-bottom))}
}

/* Belka desktopowa: sticky zamiast absolute, jak w pozostałych obszarach. */
@media (min-width:1024px){
  .imp-f-topbar{position:sticky;top:16px;left:auto;right:auto;margin:16px 24px 0}
}

/* Stany widoku chowa serwer atrybutem [hidden]. */
.imp-f [hidden]{display:none}

/* Kropka przy kopercie, gdy czekają nieprzeczytane odpowiedzi (obszar F,
   1 września 2026). Bez liczby — właściciel: wiadomości będzie mało,
   wystarczy sam wskaźnik, bez przesady. Sama kropka jest dekoracją,
   informację niesie tekst alternatywny linku. */
.topbar-koperta{position:relative}
.topbar-nowe{position:absolute;top:8px;right:8px;width:9px;height:9px;border-radius:999px;background:var(--lime,#CBFF00);box-shadow:0 0 0 2px var(--card-bg-2,rgba(0,0,0,.6))}


/* ==========================================================================
   OBSZAR G — OFERTA, PRODUKTY, LANDINGI
   Import "drogą 4" (docs/instrukcja-importu-widokow.md), 1 września 2026.
   Źródło: HTML DO WDROŻENIA/obszar G/ (tokens.css + components.css +
   siedem plików HTML + README-eksport.md).

   Prefiks obszaru: .imp-g — na gołym prefiksie żyją tokeny.

   Jak w obszarze E: bloki <style> ekranów definiują TE SAME klasy
   (poświaty, płynne tła, dłonie) z RÓŻNYMI wartościami — jedenaście
   selektorów powtarza się między siedmioma ekranami. Każdy blok
   ekranowy dostaje więc zakres .imp-g-ekran-<nazwa>, noszony przez
   korzeń widoku. Zakres dokłada skrypt, wartości nietknięte.

   Token --gfx-hand nie ma definicji w eksporcie, ale wszędzie jest
   użyty z wartością zapasową (.72), więc nic się nie psuje —
   zgłoszenie do Cloud Design, nie naprawa po naszej stronie.
   ========================================================================== */

/* ===== tokens.css -> prefiks .imp-g ===== */
.imp-g{--ink-rgb:28,28,30;
  --paper-rgb:251,251,251;
  --violet-rgb:112,0,255;
  --lime-rgb:203,255,0;

  --ink:#1C1C1E;
  --paper:#FBFBFB;
  --violet:#7000FF;
  --violet-hover:#5800CC;
  --lime:#CBFF00;

  --font-ui:'Inter',system-ui,sans-serif;
  --font-display:'VT323',monospace;
  --font-hand:'Caveat',cursive;
  --tracking-eyebrow:.16em;

  --radius-card:24px;
  --card-padding:24px 22px;
  --input-height:48px;
  --input-radius:16px;
  --radius-btn:16px;
  --input-padding-x:16px;
  --input-font-size:14px;
  --form-gap:16px;
  --btn-height:52px;
  --btn-font-size:16px;
  --btn-border:2px solid transparent;
  --radius-pill:999px;
  --radius-checkbox:7px;
  --eyebrow-size:10px;
  --title-card-size:38px;
  --title-hero-size:78px;
  --hand-size:18px;
  --logo-size:44px;
  --avatar-size:64px;
  --name-size:34px;

  
  --day-chip:44px;
  --radius-module:20px;
  --radius-chip:16px;
  --module-num-size:40px;
  --variant-name-size:22px;

  

  
  --bg:#1C1C1E;
  --text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --text-accent:#B98CFF;          
  --eyebrow-color:var(--lime);    
  --card-border:rgba(var(--paper-rgb),.15);
  --card-border-top:rgba(255,255,255,.5);
  --card-bg:rgba(var(--ink-rgb),.45);
  --card-blur:44px;
  --card-saturate:1.9;
  --card-shadow:0 24px 64px rgba(0,0,0,.4),0 8px 24px rgba(var(--violet-rgb),.22);

  
  --card-bg-1:rgba(var(--ink-rgb),.45);   --card-blur-1:48px; --card-saturate-1:2;
  --card-bg-2:rgba(var(--ink-rgb),.45);   --card-blur-2:48px; --card-saturate-2:2;
  --card-bg-3:rgba(var(--paper-rgb),.05);
  --card-bg-4:rgba(var(--paper-rgb),.04);
  --glass-border:rgba(255,255,255,.18);
  --glass-border-top:rgba(255,255,255,.55);
  --shadow-glass:0 24px 64px rgba(0,0,0,.35),0 8px 24px rgba(var(--violet-rgb),.25),inset 0 1px 0 rgba(255,255,255,.5);
  --ring-track:rgba(var(--paper-rgb),.14);
  --divider:rgba(var(--paper-rgb),.12);
  --input-bg:rgba(var(--paper-rgb),.06);
  --input-border:rgba(var(--paper-rgb),.24);
  --btn-outline-border:rgba(var(--paper-rgb),.3);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.58;
  --gfx-fluid:.42;
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.45),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.14),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#242427;}
:root[data-theme="light"] .imp-g{--bg:#FBFBFB;
  --text-heading:#1C1C1E;
  --text-body:#6B6870;
  --text-meta:#9A97A0;
  --text-accent:#7000FF;          
  --eyebrow-color:var(--violet);  
  --card-border:rgba(var(--ink-rgb),.1);
  --card-border-top:rgba(255,255,255,.95);
  --card-bg:rgba(255,255,255,.45);
  --card-blur:19px;
  --card-saturate:1.4;
  --card-shadow:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);

  
  --card-bg-1:rgba(var(--paper-rgb),.45); --card-blur-1:22px; --card-saturate-1:1.6;
  --card-bg-2:rgba(var(--paper-rgb),.45); --card-blur-2:22px; --card-saturate-2:1.5;
  --card-bg-3:rgba(255,255,255,.55);
  --card-bg-4:rgba(var(--ink-rgb),.02);
  --glass-border:rgba(255,255,255,.5);
  --glass-border-top:rgba(255,255,255,.8);
  --shadow-glass:0 24px 64px rgba(var(--ink-rgb),.18),0 8px 24px rgba(var(--violet-rgb),.22),inset 0 1px 0 rgba(255,255,255,.7);
  --ring-track:rgba(var(--ink-rgb),.1);
  --divider:rgba(var(--ink-rgb),.07);
  --input-bg:#fff;
  --input-border:rgba(var(--ink-rgb),.14);
  --btn-outline-border:rgba(var(--ink-rgb),.16);
  --btn-outline-text:var(--text-heading);
  --gfx-glass:.42;
  --gfx-fluid:.14;
  --glow-violet:radial-gradient(circle at 50% 50%,rgba(var(--violet-rgb),.08),rgba(var(--violet-rgb),0) 66%);
  --glow-lime:radial-gradient(circle at 50% 50%,rgba(var(--lime-rgb),.1),rgba(var(--lime-rgb),0) 70%);
  --glass-fallback-bg:#F1EEF7;}
.imp-g-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
:root[data-theme="light"] .imp-g-on-dark-scrim{--text-heading:#FBFBFB;
  --text-body:#C7C5CE;
  --text-meta:#9A97A0;
  --eyebrow-color:var(--lime);}
@media (min-width:1024px){
.imp-g{--radius-card:26px;
    --card-padding:34px 32px;
    --input-height:50px;
    --input-padding-x:18px;
    --input-font-size:15px;
    --form-gap:18px;
    --btn-height:54px;
    --title-card-size:42px;
    --title-hero-size:88px;
    --hand-size:26px;
    --logo-size:56px;
    --avatar-size:88px;
    --name-size:56px;
    --day-chip:36px;
    --radius-module:18px;}
:root[data-theme="light"] .imp-g{--shadow-glass:0 12px 34px rgba(var(--ink-rgb),.1),0 2px 8px rgba(var(--ink-rgb),.05);}
}
@media (prefers-reduced-motion: reduce){
:where(.imp-g), :where(.imp-g) *{transition:none !important; animation:none !important;}
}
@media (prefers-reduced-transparency: reduce){
.imp-g{--card-bg:var(--glass-fallback-bg);
    --card-blur:0px;
    --card-saturate:1;}
.imp-g-card{backdrop-filter:none; -webkit-backdrop-filter:none;}
}
.imp-g{--day-done-bg:var(--violet);         --day-done-fg:var(--paper);
  --day-sel-bg:var(--lime);            --day-sel-fg:var(--ink);
  --day-sel-ring:0 0 0 4px rgba(var(--lime-rgb),.22);
  --day-off-bg:rgba(var(--paper-rgb),.06);
  --day-off-border:rgba(var(--paper-rgb),.16);
  --day-off-fg:var(--text-meta);
  --module-bg:#272729;
  --module-shadow:0 6px 18px rgba(var(--ink-rgb),.05);
  --module-on-bg:var(--violet);
  --module-on-shadow:0 16px 40px rgba(var(--violet-rgb),.35);
  --status-done-bg:rgba(var(--lime-rgb),.18);  --status-done-fg:var(--lime);
  --status-now-bg:rgba(185,140,255,.22);       --status-now-fg:#B98CFF;
  --status-next-bg:rgba(var(--paper-rgb),.1);  --status-next-fg:var(--text-body);
  --edge-bg:rgba(185,140,255,.07);   --edge-border:rgba(185,140,255,.32);
  --edge-on-bg:rgba(185,140,255,.16);--edge-on-border:#B98CFF;
  --day-progress:#B98CFF;            
  --danger:#FF8A80; --danger-fg:var(--ink);
  --danger-bg:rgba(227,28,65,.12); --danger-border:rgba(255,107,107,.4);}
:root[data-theme="light"] .imp-g{--day-off-bg:rgba(var(--ink-rgb),.05);
  --day-off-border:rgba(var(--ink-rgb),.12);
  --day-off-fg:#8B8792;
  --day-sel-ring:0 0 0 4px #F1E5FF;
  --module-bg:#FFFFFF;
  --module-shadow:0 6px 18px rgba(var(--ink-rgb),.06);
  --module-on-shadow:0 16px 40px rgba(var(--violet-rgb),.22);
  --status-done-bg:rgba(var(--lime-rgb),.3);   --status-done-fg:#3F4A00;
  --status-now-bg:rgba(var(--violet-rgb),.1);  --status-now-fg:var(--violet);
  --status-next-bg:rgba(var(--ink-rgb),.05);   --status-next-fg:var(--text-body);
  --edge-bg:rgba(var(--violet-rgb),.04);   --edge-border:rgba(var(--violet-rgb),.28);
  --edge-on-bg:rgba(var(--violet-rgb),.09);--edge-on-border:var(--violet);
  --danger:#B03A2E; --danger-fg:var(--paper);
  --danger-bg:rgba(227,28,65,.06); --danger-border:rgba(227,28,65,.28);}
.imp-g{--radius-glass:18px;      
  --radius-session:20px;    
  --radius-video:16px;
  --radius-variant:15px;
  --radius-nav-item:14px;
  --radius-topbar:20px;
  --variant-height:46px;
  --start-height:50px;
  --daybar-seg:7px;
  --daybar-gap:5px;
  --video-max:820px;
  --title-view-size:54px;
  --stat-value-size:30px;
  --variant-title-size:21px;
  --glass-pad:18px 20px;
  --session-pad:20px 22px;}
.imp-g{--radius-exercise:16px;
  --radius-sheet:28px;
  --radius-modal:28px;
  --radius-timer:14px;
  --topbar-mobile-h:56px;
  --exercise-pad:13px 14px;
  --timer-size:34px;
  --timer-desktop-size:44px;
  --result-title-size:58px;
  --result-title-desktop-size:72px;
  --result-card-h:492px;
  --result-card-w:600px;
  --hand-mobile-h:340px;
  --hand-desktop-h:330px;
  --scale-col-h:99px;
  --scale-gap:8px;
  --bar-radius:11px 11px 8px 8px;
  --bar-font:12.5px;
  --sheet-pad:10px 20px 22px;
  --modal-pad:32px 34px 28px;
  --progress-h:5px;

  
  --bar-off-bg:#241E31;
  --bar-off-border:rgba(var(--paper-rgb),.22);
  --bar-off-fg:var(--text-meta);
  --bar-under-bg:#4A1BA6;
  --bar-under-border:rgba(185,140,255,.65);
  --bar-under-fg:var(--paper);
  --bar-on-bg:var(--lime);
  --bar-on-border:var(--lime);
  --bar-on-fg:var(--ink);
  --bar-on-shadow:0 0 0 6px rgba(var(--lime-rgb),.16),0 10px 26px rgba(var(--lime-rgb),.3);
  --bar-hover-border:var(--lime);

  
  --sheet-bg:linear-gradient(180deg,rgba(43,33,62,.98),#1C1C1E);
  --sheet-border:rgba(185,140,255,.45);
  --sheet-shadow:0 0 0 1px rgba(185,140,255,.12),0 -30px 90px rgba(var(--violet-rgb),.45);
  --modal-shadow:0 0 0 1px rgba(185,140,255,.12),0 40px 110px rgba(var(--violet-rgb),.45),inset 0 1px 0 rgba(255,255,255,.14);
  --sheet-handle:rgba(var(--paper-rgb),.28);
  --scrim:rgba(10,10,12,.78);
  --box-bg:rgba(var(--paper-rgb),.05);
  --box-border:rgba(var(--paper-rgb),.12);
  --verdict-bg:rgba(185,140,255,.14);
  --verdict-border:rgba(185,140,255,.38);
  --verdict-fg:#E5D5FF;
  --hint-bg:rgba(var(--lime-rgb),.09);
  --hint-border:rgba(var(--lime-rgb),.32);
  --hint-fg:#E7F5B0;
  --hint-idle-bg:rgba(var(--paper-rgb),.05);
  --hint-idle-border:rgba(var(--paper-rgb),.1);
  --hint-idle-fg:var(--text-body);
  --ex-active-bg:rgba(var(--paper-rgb),.07);
  --ex-active-border:rgba(var(--lime-rgb),.34);
  --ex-flat-bg:rgba(var(--paper-rgb),.04);
  --ex-flat-border:rgba(var(--paper-rgb),.12);
  --num-on:var(--lime);
  --hand-glow:drop-shadow(0 18px 40px rgba(var(--violet-rgb),.95)) drop-shadow(0 0 60px rgba(var(--violet-rgb),.55));}
:root[data-theme="light"] .imp-g{--bar-off-bg:#FFFFFF;
  --bar-off-border:rgba(var(--ink-rgb),.16);
  --bar-off-fg:#6B6870;
  --bar-under-bg:#B98CFF;
  --bar-under-border:rgba(var(--violet-rgb),.45);
  --bar-under-fg:#FFFFFF;
  --bar-on-bg:var(--violet);
  --bar-on-border:var(--violet);
  --bar-on-fg:var(--paper);
  --bar-on-shadow:0 0 0 6px rgba(var(--lime-rgb),.42),0 10px 26px rgba(var(--lime-rgb),.5);
  --bar-hover-border:var(--violet);

  --sheet-bg:linear-gradient(180deg,#FFFFFF,#F6F2FD);
  --sheet-border:rgba(var(--violet-rgb),.28);
  --sheet-shadow:0 0 0 1px rgba(var(--violet-rgb),.08),0 -30px 90px rgba(var(--violet-rgb),.28);
  --modal-shadow:0 0 0 1px rgba(var(--violet-rgb),.08),0 40px 110px rgba(var(--violet-rgb),.24),inset 0 1px 0 #FFFFFF;
  --sheet-handle:rgba(var(--ink-rgb),.18);
  --scrim:rgba(var(--ink-rgb),.45);
  --box-bg:rgba(var(--violet-rgb),.05);
  --box-border:rgba(var(--ink-rgb),.1);
  --verdict-bg:rgba(var(--violet-rgb),.06);
  --verdict-border:rgba(var(--violet-rgb),.24);
  --verdict-fg:var(--violet);
  --hint-bg:rgba(var(--violet-rgb),.06);
  --hint-border:rgba(var(--violet-rgb),.24);
  --hint-fg:#3A3740;
  --hint-idle-bg:rgba(var(--ink-rgb),.04);
  --hint-idle-border:rgba(var(--ink-rgb),.1);
  --hint-idle-fg:#6B6870;
  --ex-active-bg:rgba(255,255,255,.86);
  --ex-active-border:rgba(var(--violet-rgb),.28);
  --ex-flat-bg:rgba(255,255,255,.55);
  --ex-flat-border:rgba(var(--ink-rgb),.1);
  --num-on:var(--violet);
  --hand-glow:drop-shadow(0 18px 40px rgba(var(--violet-rgb),.85)) drop-shadow(0 0 60px rgba(var(--violet-rgb),.5));}
@media (min-width:1024px){
.imp-g{--exercise-pad:14px 18px;
    --timer-size:var(--timer-desktop-size);
    --result-title-size:var(--result-title-desktop-size);
    --scale-col-h:99px;}
}
@media (prefers-reduced-transparency: reduce){
.imp-g{--sheet-bg:var(--glass-fallback-bg);}
}
.imp-g{--radius-panel:18px;
  --radius-panel-desktop:20px;
  --e-rail-w:360px;
  --panel-pad:16px;
  --panel-pad-desktop:16px 18px;
  --title-e-size:40px;
  --title-e-desktop-size:54px;
  --lead-size:13.5px;
  --lead-desktop-size:14px;
  --metric-size:32px;
  --metric-desktop-size:40px;
  --sign-size:24px;
  --sign-desktop-size:26px;
  --step-num:24px;
  --step-num-desktop:26px;
  --len-name-size:21px;
  --len-name-desktop-size:24px;
  --acc-head-h:58px;
  --acc-head-h-desktop:60px;
  --acc-icon:32px;
  --acc-icon-desktop:34px;
  --acc-title-size:13.5px;
  --acc-title-desktop-size:15.5px;
  --card-title-size:16px;
  --card-title-desktop-size:19px;
  --dock-h:64px;

  
  --dot-size:26px;
  --sw-value-size:44px;
  --sw-value-desktop-size:64px;
  --numbox-value-size:40px;
  --numbox-value-desktop-size:54px;
  --tile-size:52px;
  --tile-desktop-size:96px;
  --radius-tile:12px;
  --radius-tile-desktop:14px;
  --fs-timer-size:104px;
  --fs-timer-desktop-size:168px;

  
  --cmp-name-size:13px;
  --cmp-value-size:15px;
  --trio-value-size:32px;
  --trio-value-desktop-size:44px;}
.imp-g{--panel-bg:var(--card-bg-3);
  --panel-border:var(--divider);
  --panel-flat-bg:var(--card-bg-4);
  --accent-tint-bg:rgba(185,140,255,.14);
  --accent-tint-border:rgba(185,140,255,.34);
  --accent-tint-fg:#B98CFF;
  --len-name-color:var(--lime);
  --tile-bg:#272729;
  --tile-border:rgba(var(--paper-rgb),.14);
  --tile-fg:var(--paper);
  --tile-done-bg:rgba(var(--paper-rgb),.03);
  --tile-done-border:rgba(var(--paper-rgb),.08);
  --tile-done-fg:#4A4650;
  --tile-next-bg:var(--violet);
  --tile-next-fg:var(--paper);
  --dot-bg:rgba(var(--paper-rgb),.08);
  --dot-fg:var(--text-meta);
  --dot-done-bg:#4A1BA6;
  --dot-done-fg:var(--paper);
  --dot-on-bg:var(--lime);
  --dot-on-fg:var(--ink);
  --fs-bg:radial-gradient(1000px 700px at 50% 45%,rgba(var(--violet-rgb),.5),rgba(10,10,12,.98) 72%),#0E0E10;
  --delta-good:var(--lime);
  --delta-bad:#FF8A80;
  --delta-wait:var(--text-meta);
  --card-out-bg:linear-gradient(180deg,rgba(43,33,62,.98),rgba(24,24,27,.99));}
:root[data-theme="light"] .imp-g{--panel-bg:var(--card-bg-3);
  --panel-border:rgba(var(--ink-rgb),.1);
  --panel-flat-bg:rgba(var(--ink-rgb),.02);
  --accent-tint-bg:rgba(var(--violet-rgb),.09);
  --accent-tint-border:rgba(var(--violet-rgb),.28);
  --accent-tint-fg:var(--violet);
  --len-name-color:var(--violet);
  --tile-bg:rgba(255,255,255,.55);
  --tile-border:rgba(var(--ink-rgb),.1);
  --tile-fg:var(--ink);
  --tile-done-bg:rgba(var(--ink-rgb),.02);
  --tile-done-border:rgba(var(--ink-rgb),.06);
  --tile-done-fg:#B4B1BA;
  --tile-next-bg:var(--violet);
  --tile-next-fg:var(--paper);
  --dot-bg:rgba(var(--ink-rgb),.06);
  --dot-fg:var(--text-meta);
  --dot-done-bg:var(--violet);
  --dot-done-fg:var(--paper);
  --dot-on-bg:var(--lime);
  --dot-on-fg:var(--ink);
  --fs-bg:radial-gradient(1000px 700px at 50% 45%,rgba(var(--violet-rgb),.12),rgba(var(--paper-rgb),.98) 72%),#FBFBFB;
  --delta-good:var(--violet);
  --delta-bad:#B03A2E;
  --delta-wait:var(--text-meta);
  --card-out-bg:linear-gradient(180deg,rgba(var(--violet-rgb),.06),rgba(var(--paper-rgb),.96));}
@media (min-width:1024px){
.imp-g{--radius-panel:var(--radius-panel-desktop);
    --panel-pad:var(--panel-pad-desktop);
    --title-e-size:var(--title-e-desktop-size);
    --lead-size:var(--lead-desktop-size);
    --metric-size:var(--metric-desktop-size);
    --sign-size:var(--sign-desktop-size);
    --step-num:var(--step-num-desktop);
    --len-name-size:var(--len-name-desktop-size);
    --acc-head-h:var(--acc-head-h-desktop);
    --acc-icon:var(--acc-icon-desktop);
    --acc-title-size:var(--acc-title-desktop-size);
    --card-title-size:var(--card-title-desktop-size);
    --sw-value-size:var(--sw-value-desktop-size);
    --numbox-value-size:var(--numbox-value-desktop-size);
    --tile-size:var(--tile-desktop-size);
    --radius-tile:var(--radius-tile-desktop);
    --fs-timer-size:var(--fs-timer-desktop-size);
    --trio-value-size:var(--trio-value-desktop-size);}
}
@media (prefers-reduced-transparency: reduce){
.imp-g{--card-out-bg:var(--glass-fallback-bg);}
}
.imp-g{--radius-msg:20px;
  --radius-bubble:20px;
  --radius-bubble-tail:6px;
  --msg-avatar:34px;
  --msg-avatar-desktop:32px;
  --thread-avatar:38px;
  --bubble-max:88%;
  --bubble-max-desktop:74%;
  --list-w:360px;
  --composer-min:52px;
  --badge-unread-h:20px;
  --dtc-value-size:44px;
  --dtc-value-desktop-size:40px;}
.imp-g{--msg-bg:var(--card-bg-3);
  --msg-border:var(--divider);
  --msg-border-unread:rgba(185,140,255,.4);
  --msg-border-selected:var(--violet);
  --msg-ring-selected:0 0 0 3px rgba(var(--violet-rgb),.18);
  --avatar-bg:rgba(var(--violet-rgb),.22);
  --avatar-fg:#B98CFF;
  --bubble-me-bg:var(--violet);
  --bubble-me-fg:var(--paper);
  --bubble-me-shadow:0 8px 24px rgba(var(--violet-rgb),.35);
  --bubble-them-bg:var(--card-bg-3);
  --bubble-them-border:rgba(var(--paper-rgb),.13);
  --bubble-them-fg:var(--text-heading);
  --badge-unread-bg:var(--lime);
  --badge-unread-fg:var(--ink);
  --tag-new-bg:rgba(185,140,255,.22);
  --tag-new-fg:#B98CFF;}
:root[data-theme="light"] .imp-g{--msg-bg:var(--card-bg-3);
  --msg-border:rgba(var(--ink-rgb),.1);
  --msg-border-unread:rgba(var(--violet-rgb),.28);
  --avatar-bg:rgba(var(--violet-rgb),.09);
  --avatar-fg:var(--violet);
  --bubble-them-border:rgba(var(--ink-rgb),.11);
  --tag-new-bg:rgba(var(--violet-rgb),.09);
  --tag-new-fg:var(--violet);}
@media (min-width:1024px){
.imp-g{--msg-avatar:var(--msg-avatar-desktop);
    --bubble-max:var(--bubble-max-desktop);
    --dtc-value-size:var(--dtc-value-desktop-size);}
}
.imp-g{--g-shell-pad:22px 20px 30px;
  --g-shell-pad-desktop:118px 80px 44px;
  --g-shell-max:1440px;
  --g-title-size:52px;
  --g-title-desktop-size:64px;
  --g-title-thanks-size:54px;
  --g-title-thanks-desktop-size:68px;
  --g-hand-size:21px;
  --g-hand-desktop-size:22px;
  --g-hero-max:262px;
  --g-scrim-h:560px;
  --g-num-size:34px;
  --g-num-desktop-size:30px;
  --g-price-size:46px;
  --g-price-desktop-size:46px;
  --g-price-total-size:38px;
  --g-tier-name-size:24px;
  --g-toc-page-size:18px;
  --g-toc-page-desktop-size:19px;
  --g-give-num-size:30px;
  --g-mini-h:36px;
  --g-shape-h:96px;
  --g-rail-w:380px;
  --radius-g-card:20px;
  --radius-g-soft:18px;
  --radius-g-mini:11px;
  --radius-g-input:16px;
  --g-step-dot:32px;
  --g-step-dot-desktop:22px;}
.imp-g{--g-bg:#141416;
  --g-scrim:linear-gradient(180deg,rgba(20,20,22,.35) 0%,rgba(20,20,22,.1) 30%,rgba(20,20,22,.72) 74%,var(--g-bg) 100%);
  --g-card-bg:rgba(var(--paper-rgb),.05);
  --g-card-border:rgba(var(--paper-rgb),.12);
  --g-card-soft-bg:rgba(var(--paper-rgb),.04);
  --g-divider:rgba(var(--paper-rgb),.12);
  --g-leader:rgba(var(--paper-rgb),.3);
  --g-pill-border:rgba(var(--lime-rgb),.35);
  --g-pill-fg:var(--lime);
  --g-accent-tile-bg:rgba(185,140,255,.14);
  --g-accent-tile-border:rgba(185,140,255,.34);
  --g-yes-bg:rgba(185,140,255,.12);
  --g-yes-border:rgba(185,140,255,.34);
  --g-guarantee-bg:rgba(var(--lime-rgb),.12);
  --g-guarantee-border:rgba(var(--lime-rgb),.4);
  --g-guarantee-fg:var(--lime);
  --g-stripe-bg:#202024;
  --g-stripe-border:rgba(var(--paper-rgb),.14);
  --g-field-bg:rgba(var(--paper-rgb),.06);
  --g-field-border:rgba(var(--paper-rgb),.24);
  --g-mini-solid-bg:var(--paper);
  --g-mini-solid-fg:var(--ink);}
:root[data-theme="light"] .imp-g{--g-bg:#FBFBFB;
  --g-scrim:linear-gradient(180deg,rgba(251,251,251,.35) 0%,rgba(251,251,251,.12) 26%,rgba(251,251,251,.72) 62%,rgba(251,251,251,.94) 82%,var(--g-bg) 100%);
  --g-card-bg:rgba(255,255,255,.55);
  --g-card-border:rgba(var(--ink-rgb),.1);
  --g-card-soft-bg:rgba(var(--ink-rgb),.04);
  --g-divider:rgba(var(--ink-rgb),.1);
  --g-leader:rgba(var(--ink-rgb),.3);
  --g-pill-border:rgba(var(--violet-rgb),.3);
  --g-pill-fg:var(--violet);
  --g-accent-tile-bg:rgba(var(--violet-rgb),.09);
  --g-accent-tile-border:rgba(var(--violet-rgb),.28);
  --g-yes-bg:rgba(var(--violet-rgb),.06);
  --g-yes-border:rgba(var(--violet-rgb),.24);
  --g-guarantee-bg:rgba(var(--lime-rgb),.22);
  --g-guarantee-border:rgba(var(--lime-rgb),.7);
  --g-guarantee-fg:var(--ink);
  --g-stripe-bg:#FFFFFF;
  --g-stripe-border:rgba(var(--ink-rgb),.11);
  --g-field-bg:#FFFFFF;
  --g-field-border:rgba(var(--ink-rgb),.14);
  --g-mini-solid-bg:var(--ink);
  --g-mini-solid-fg:var(--paper);}
@media (min-width:1024px){
.imp-g{--g-shell-pad:var(--g-shell-pad-desktop);
    --g-title-size:var(--g-title-desktop-size);
    --g-title-thanks-size:var(--g-title-thanks-desktop-size);
    --g-hand-size:var(--g-hand-desktop-size);
    --g-hero-max:none;
    --g-num-size:var(--g-num-desktop-size);
    --g-price-size:var(--g-price-desktop-size);
    --g-toc-page-size:var(--g-toc-page-desktop-size);
    --g-step-dot:var(--g-step-dot-desktop);}
}
@media (prefers-reduced-transparency: reduce){
.imp-g{--g-scrim:none;}
}

/* ===== components.css -> prefiks .imp-g ===== */
:where(.imp-g), :where(.imp-g) *{box-sizing:border-box}
.imp-g{margin:0;padding:0}
.imp-g{display:block;background:var(--bg);font-family:var(--font-ui);color:var(--text-body);-webkit-font-smoothing:antialiased}
:where(.imp-g) a{color:var(--text-accent);text-decoration:none}
:where(.imp-g) a:hover{color:var(--violet-hover)}
:where(.imp-g) button{font-family:inherit;border:none;background:none;padding:0;cursor:pointer}
:where(.imp-g) img{max-width:100%}
.imp-g-page{position:relative;display:block;overflow:hidden;min-height:100vh;background:var(--bg);isolation:isolate}
.imp-g-glow{position:absolute;pointer-events:none;border-radius:50%;z-index:0}
.imp-g-gfx-glass{position:absolute;pointer-events:none;opacity:var(--gfx-glass);z-index:0}
.imp-g-logo{flex:none;width:var(--logo-size);height:var(--logo-size);object-fit:contain;display:block}
.imp-g-logo--light{display:none}
:root[data-theme="light"] .imp-g-logo--dark{display:none}
:root[data-theme="light"] .imp-g-logo--light{display:block}
.imp-g-topbar{display:none}
.imp-g-topbar-logo{flex:none;display:flex;align-items:center;gap:11px}
.imp-g-topbar-nav{display:flex;gap:4px}
.imp-g-nav-item{min-height:44px;display:flex;align-items:center;gap:9px;padding:0 16px;border-radius:var(--radius-nav-item);color:var(--text-body);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-nav-item:hover{color:var(--text-accent)}
.imp-g-nav-item span{font:600 13px/1 var(--font-ui)}
.imp-g-nav-item--active{background:var(--lime);color:var(--ink)}
.imp-g-nav-item--active:hover{color:var(--ink)}
.imp-g-topbar-end{margin-left:auto;display:flex;align-items:center;gap:8px}
.imp-g-c-view{position:relative;z-index:1;display:flex;flex-direction:column}
.imp-g-c-head{display:block}
.imp-g-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color)}
.imp-g-view-title{margin:0;font:400 var(--title-view-size)/.9 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-g-c-grid{display:grid;min-height:0}
.imp-g-c-col{display:flex;flex-direction:column;min-width:0;min-height:0}
.imp-g-c-rail{display:flex;flex-direction:column;min-width:0;min-height:0}
.imp-g-video-frame{display:flex}
.imp-g-video-card{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:var(--radius-video);background:var(--module-bg);border:1px solid var(--card-border);box-shadow:var(--module-shadow)}
.imp-g-video-card .imp-g-gfx-glass{position:absolute;top:-60px;right:-40px;width:200px;opacity:var(--gfx-fluid)}
.imp-g-video-inner{position:relative;display:flex;flex-direction:column;align-items:center;gap:14px}
.imp-g-video-play{display:grid;place-items:center;width:78px;height:78px;border-radius:var(--radius-pill);background:var(--lime)}
.imp-g-video-note{max-width:520px;text-align:center;font:400 13px/1.4 var(--font-ui);color:var(--text-body)}
.imp-g-video-spec{position:absolute;bottom:12px;right:14px;font:600 9.5px/1 var(--font-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--text-meta)}
.imp-g-stat-bar{display:flex;align-items:stretch;padding:var(--glass-pad);border-radius:var(--radius-glass);background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--card-border)}
.imp-g-stat-cell{flex:1;min-width:0;overflow:hidden;display:flex;flex-direction:column;gap:5px;padding-right:24px}
.imp-g-stat-cell + .imp-g-stat-cell{padding-left:24px;border-left:1px solid var(--divider)}
.imp-g-stat-cell:last-child{padding-right:0}
.imp-g-stat-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-g-stat-value{font:400 var(--stat-value-size)/1 var(--font-display);color:var(--text-heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-g-stat-value--accent{color:var(--text-accent)}
.imp-g-chip-links{display:flex;flex-direction:column;gap:8px}
.imp-g-chip-links--row{flex-direction:row}
.imp-g-chip-link{flex:1;min-width:0;min-height:44px;display:flex;align-items:center;gap:7px;padding:0 16px;border-radius:var(--radius-chip);border:1px solid var(--btn-outline-border);font:500 13px/1 var(--font-ui);color:var(--btn-outline-text);text-decoration:none;transition:background 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-chip-link:hover{background:rgba(var(--paper-rgb),.08);border-color:var(--text-accent)}
:root[data-theme="light"] .imp-g-chip-link:hover{background:rgba(var(--ink-rgb),.05)}
.imp-g-chip-link span{margin-left:auto;color:var(--text-accent)}
.imp-g-card--rail{display:block;padding:var(--glass-pad);border-radius:var(--radius-glass);background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--card-border)}
.imp-g-daybar-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px}
.imp-g-daybar-count{flex:0 1 auto;min-width:0;font:400 20px/1 var(--font-display);color:var(--day-progress);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-g-daybar{display:flex;gap:var(--daybar-gap)}
.imp-g-daybar-seg{flex:1;min-width:0;height:var(--daybar-seg);border-radius:var(--radius-pill);background:var(--ring-track)}
.imp-g-daybar-seg--done{background:var(--day-progress)}
.imp-g-session-card{display:block;padding:var(--session-pad);border-radius:var(--radius-session);background:var(--module-bg);border:1px solid var(--card-border);box-shadow:var(--module-shadow)}
.imp-g-session-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.imp-g-session-legend{flex:1;min-width:0;text-align:right;font:400 11px/1 var(--font-ui);color:var(--text-meta);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-g-session-rule{height:1px;background:var(--divider);margin:16px 0 14px}
.imp-g-session-label{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body);margin-bottom:12px}
.imp-g-day-chips{display:flex;gap:8px}
.imp-g-day-chip{flex:none;width:var(--day-chip);height:var(--day-chip);display:grid;place-items:center;border-radius:var(--radius-pill);border:2px solid var(--day-off-border);background:var(--day-off-bg);color:var(--day-off-fg);font:600 12px/1 var(--font-ui);transition:transform 120ms cubic-bezier(.4,0,.2,1)}
.imp-g-day-chip:hover{transform:translateY(-2px)}
.imp-g-day-chip--done{background:var(--day-done-bg);border-color:var(--day-done-bg);color:var(--day-done-fg)}
.imp-g-day-chip--selected{background:var(--day-sel-bg);border-color:var(--day-sel-bg);color:var(--day-sel-fg);box-shadow:var(--day-sel-ring)}
.imp-g-variants{display:flex;flex-direction:column;gap:8px}
.imp-g-variant{display:flex;align-items:center;gap:12px;width:100%;min-height:var(--variant-height);padding:11px 15px;overflow:hidden;border-radius:var(--radius-variant);border:1px solid var(--card-border);background:var(--input-bg);text-align:left;transition:transform 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-variant:hover{transform:translateY(-2px)}
.imp-g-variant-name{flex:none;font:400 var(--variant-title-size)/1 var(--font-display);color:var(--text-heading)}
.imp-g-variant-desc{flex:1;min-width:0;font:400 12.5px/1.35 var(--font-ui);color:var(--text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-g-variant-time{flex:none;font:600 13px/1 var(--font-ui);color:var(--text-heading);white-space:nowrap}
.imp-g-variant--selected{background:var(--violet);border-color:var(--violet)}
.imp-g-variant--selected .imp-g-variant-name,.imp-g-variant--selected .imp-g-variant-time{color:var(--paper)}
.imp-g-variant--selected .imp-g-variant-desc{color:#E4DDF7}
.imp-g-btn-start{display:flex;align-items:center;justify-content:center;gap:10px;min-height:var(--start-height);border-radius:var(--radius-nav-item);background:var(--lime);border:var(--btn-border);color:var(--ink);font:600 15px/1 var(--font-ui);text-decoration:none;transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-btn-start:hover{background:var(--violet);color:var(--paper);border-color:var(--lime)}
@media (min-width:1024px){
.imp-g-video-frame{flex:1;min-height:0;align-items:flex-start}
.imp-g-video-card{max-height:100%}
.imp-g-topbar{position:absolute;top:16px;left:24px;right:24px;z-index:3;display:flex;align-items:center;gap:24px;padding:10px 14px 10px 18px;border-radius:var(--radius-topbar);background:var(--card-bg-2);backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));-webkit-backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
}
.imp-g-appbar{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 16px;min-height:var(--topbar-mobile-h);background:var(--card-bg-2);backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));-webkit-backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));border-bottom:1px solid var(--card-border)}
.imp-g-appbar-back{display:flex;align-items:center;min-height:44px;font:400 13px/1 var(--font-ui);color:var(--text-body);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-appbar-back:hover{color:var(--text-accent)}
.imp-g-appbar-title{font:600 12.5px/1 var(--font-ui);color:var(--text-heading)}
.imp-g-badge-variant{padding:5px 9px;border-radius:8px;background:var(--status-now-bg);font:600 10.5px/1 var(--font-ui);letter-spacing:.06em;color:var(--status-now-fg)}
.imp-g-session-view{position:relative;z-index:1;display:flex;flex-direction:column;gap:12px;padding:14px 16px 0;flex:1;min-height:0}
.imp-g-session-foot{position:relative;z-index:1;display:flex;flex-direction:column;gap:5px;padding:10px 16px 14px}
.imp-g-session-note{text-align:center;font:400 11px/1 var(--font-ui);color:var(--text-body)}
.imp-g-sec-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body)}
.imp-g-props{display:flex;flex-wrap:wrap;gap:8px}
.imp-g-prop{display:flex;flex:0 0 auto;align-items:center;min-height:34px;padding:0 12px;border-radius:var(--radius-chip);background:var(--ex-flat-bg);border:1px dashed var(--input-border);font:400 11.5px/1 var(--font-ui);color:var(--text-body)}
.imp-g-ex-list{display:flex;flex-direction:column;gap:9px}
.imp-g-ex{padding:var(--exercise-pad);border-radius:var(--radius-exercise);background:var(--ex-flat-bg);border:1px solid var(--ex-flat-border);display:flex;align-items:center;gap:10px}
.imp-g-ex--done{opacity:.6}
.imp-g-ex--active{flex-direction:column;align-items:stretch;gap:11px;background:var(--ex-active-bg);border-color:var(--ex-active-border)}
.imp-g-ex-row{display:flex;align-items:flex-start;gap:10px}
.imp-g-ex-num{flex:0 0 auto;width:22px;height:22px;display:grid;place-items:center;border-radius:7px;border:1px solid var(--input-border);font:600 11px/1 var(--font-ui);color:var(--text-body)}
.imp-g-ex-num--done{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.imp-g-ex-num--active{border:2px solid var(--num-on);color:var(--num-on)}
.imp-g-ex-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.imp-g-ex-title{font:600 14px/1.3 var(--font-ui);color:var(--text-heading)}
.imp-g-ex-meta{font:400 11px/1 var(--font-ui);color:var(--text-body)}
.imp-g-ex-desc{margin:0;font:400 12.5px/1.5 var(--font-ui);color:var(--text-body);text-wrap:pretty}
.imp-g-ex-points{display:flex;flex-direction:column;gap:5px;margin-top:2px}
.imp-g-ex-point{display:flex;align-items:flex-start;gap:8px;font:400 12px/1.4 var(--font-ui);color:var(--text-body)}
.imp-g-ex-point::before{content:"";flex:0 0 auto;width:4px;height:4px;margin-top:7px;border-radius:var(--radius-pill);background:var(--num-on)}
.imp-g-timer{display:flex;align-items:baseline;gap:9px;padding:8px 12px;border-radius:var(--radius-timer);background:var(--module-bg);border:1px solid var(--card-border)}
.imp-g-timer-value{font:400 var(--timer-size)/1 var(--font-display);color:var(--text-heading)}
.imp-g-timer-meta{font:400 12px/1 var(--font-ui);color:var(--text-body)}
.imp-g-progress{height:var(--progress-h);border-radius:4px;background:var(--ring-track);overflow:hidden}
.imp-g-progress-fill{display:block;height:100%;background:var(--num-on)}
.imp-g-btn-primary{display:flex;align-items:center;justify-content:center;width:100%;min-height:var(--btn-height);border-radius:var(--radius-btn);background:var(--lime);border:var(--btn-border);color:var(--ink);font:600 15px/1 var(--font-ui);text-decoration:none;box-shadow:0 14px 34px rgba(var(--lime-rgb),.22);transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-btn-primary:hover{background:var(--violet);color:var(--paper);border-color:var(--lime)}
.imp-g-btn-primary[disabled]{background:var(--hint-idle-bg);border:1px solid var(--hint-idle-border);color:var(--text-meta);box-shadow:none;cursor:not-allowed}
.imp-g-btn-outline{display:flex;align-items:center;justify-content:center;width:100%;min-height:var(--btn-height);border-radius:var(--radius-btn);background:transparent;border:1px solid var(--btn-outline-border);color:var(--btn-outline-text);font:600 14px/1 var(--font-ui);text-decoration:none;transition:border-color 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-btn-outline:hover{border-color:var(--text-accent);color:var(--text-accent)}
.imp-g-btn-ghost{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;border-radius:var(--radius-chip);background:none;color:var(--text-body);font:500 13.5px/1 var(--font-ui);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-btn-ghost:hover{color:var(--text-heading)}
.imp-g-btn-stack{display:flex;flex-direction:column;gap:6px}
.imp-g-scrim{position:fixed;inset:0;z-index:5;background:var(--scrim)}
.imp-g-sheet{position:fixed;z-index:7;left:0;right:0;bottom:0;padding:var(--sheet-pad);border-radius:var(--radius-sheet);background:var(--sheet-bg);border:1px solid var(--sheet-border);box-shadow:var(--sheet-shadow)}
.imp-g-sheet-handle{display:block;width:44px;height:4px;margin:0 auto 14px;border-radius:var(--radius-pill);background:var(--sheet-handle)}
.imp-g-sheet-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}
.imp-g-sheet-meta{font:400 11px/1 var(--font-ui);color:var(--text-meta)}
.imp-g-sheet-title{margin:0;font:700 21px/1.25 var(--font-ui);color:var(--text-heading);text-wrap:pretty}
.imp-g-sheet-lead{margin:8px 0 0;font:400 12.5px/1.55 var(--font-ui);color:var(--text-body);text-wrap:pretty}
.imp-g-scale{display:flex;align-items:flex-end;gap:var(--scale-gap);height:var(--scale-col-h)}
.imp-g-scale-col{flex:1;height:var(--scale-col-h);display:flex;align-items:flex-end;background:none;border:none;padding:0}
.imp-g-bar{width:100%;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;border-radius:var(--bar-radius);border:1px solid var(--bar-off-border);background:var(--bar-off-bg);color:var(--bar-off-fg);font:600 var(--bar-font)/1 var(--font-ui);transition:background 200ms cubic-bezier(.4,0,.2,1),border-color 200ms cubic-bezier(.4,0,.2,1),color 200ms cubic-bezier(.4,0,.2,1),transform 260ms cubic-bezier(.34,1.56,.64,1),box-shadow 260ms cubic-bezier(.4,0,.2,1)}
.imp-g-scale-col:hover .imp-g-bar{border-color:var(--bar-hover-border)}
.imp-g-bar--under{background:var(--bar-under-bg);border-color:var(--bar-under-border);color:var(--bar-under-fg)}
.imp-g-bar--on{background:var(--bar-on-bg);border-color:var(--bar-on-border);color:var(--bar-on-fg);box-shadow:var(--bar-on-shadow)}
.imp-g-scale-col:nth-child(1) .imp-g-bar{height:30%}
.imp-g-scale-col:nth-child(2) .imp-g-bar{height:37%}
.imp-g-scale-col:nth-child(3) .imp-g-bar{height:44%}
.imp-g-scale-col:nth-child(4) .imp-g-bar{height:51%}
.imp-g-scale-col:nth-child(5) .imp-g-bar{height:58%}
.imp-g-scale-col:nth-child(6) .imp-g-bar{height:65%}
.imp-g-scale-col:nth-child(7) .imp-g-bar{height:72%}
.imp-g-scale-col:nth-child(8) .imp-g-bar{height:79%}
.imp-g-scale-col:nth-child(9) .imp-g-bar{height:86%}
.imp-g-scale-col:nth-child(10) .imp-g-bar{height:94%}
.imp-g-scale-legend{display:flex;align-items:center;justify-content:space-between;font:400 11.5px/1 var(--font-ui);color:var(--text-meta)}
.imp-g-hint{display:flex;align-items:center;min-height:48px;padding:11px 14px;border-radius:var(--radius-chip);background:var(--hint-bg);border:1px solid var(--hint-border);font:400 12px/1.45 var(--font-ui);color:var(--hint-fg)}
.imp-g-hint--idle{background:var(--hint-idle-bg);border-color:var(--hint-idle-border);color:var(--hint-idle-fg)}
.imp-g-scale-block{display:flex;flex-direction:column;gap:11px;margin-top:16px}
.imp-g-result-eyebrow{display:block;font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color);margin-bottom:6px}
.imp-g-result-title{margin:0;font:400 var(--result-title-size)/.86 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-g-result-hand{position:fixed;z-index:6;left:-26px;bottom:302px;height:var(--hand-mobile-h);width:auto;pointer-events:none;filter:var(--hand-glow)}
.imp-g-stat-boxes{display:flex;gap:8px;margin-top:16px}
.imp-g-stat-box{flex:1;padding:11px 13px;border-radius:var(--radius-chip);background:var(--box-bg);border:1px solid var(--box-border)}
.imp-g-stat-box-value{font:400 26px/1 var(--font-display);color:var(--text-heading)}
.imp-g-stat-box-value--accent{color:var(--num-on)}
.imp-g-stat-box-label{font:400 10px/1.3 var(--font-ui);color:var(--text-body);margin-top:3px}
.imp-g-verdict{display:flex;align-items:center;gap:9px;min-height:44px;margin-top:8px;padding:0 13px;border-radius:var(--radius-chip);background:var(--verdict-bg);border:1px solid var(--verdict-border);font:600 12.5px/1.3 var(--font-ui);color:var(--verdict-fg)}
.imp-g-verdict svg{flex:0 0 auto}
@media (min-width:1024px){
.imp-g-appbar{display:none}
.imp-g-session-view{padding:104px 140px 24px;gap:20px}
.imp-g-session-foot{padding:0 140px 40px;max-width:520px}
.imp-g-ex-list{gap:12px}
.imp-g-timer-value{font-size:var(--timer-desktop-size)}
.imp-g-sheet{position:fixed;left:50%;top:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);width:var(--result-card-w);padding:var(--modal-pad);border-radius:var(--radius-modal);box-shadow:var(--modal-shadow)}
.imp-g-sheet-handle{display:none}
.imp-g-sheet-title{font-size:26px}
.imp-g-sheet-lead{font-size:13.5px}
.imp-g-scale-legend{font-size:12.5px}
.imp-g-hint{min-height:52px;font-size:12.5px}
.imp-g-sheet--result{height:var(--result-card-h);overflow:hidden;display:flex;flex-direction:column}
.imp-g-sheet--result .imp-g-result-hand{position:absolute;left:2px;bottom:-84px;height:var(--hand-desktop-h)}
.imp-g-sheet--result .imp-g-result-col{position:relative;z-index:2;margin:auto 0 0 auto;width:308px;display:flex;flex-direction:column;gap:8px}
.imp-g-sheet--result .imp-g-stat-boxes{margin-top:0}
.imp-g-sheet--result .imp-g-verdict{margin-top:0}
.imp-g-result-title{font-size:var(--result-title-desktop-size)}
}
.imp-g-e-view{position:relative;z-index:1;display:flex;flex-direction:column;gap:20px;padding:20px 20px 108px}
.imp-g-e-main{display:flex;flex-direction:column;gap:16px;min-width:0}
.imp-g-e-rail{display:flex;flex-direction:column;gap:14px;min-width:0}
.imp-g-e-block{display:flex;flex-direction:column;gap:10px}
.imp-g-e-title{margin:0;font:400 var(--title-e-size)/.94 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-g-e-sub{margin:0;font:600 21px/1.25 var(--font-ui);color:var(--text-heading)}
.imp-g-lead{margin:0;font:400 var(--lead-size)/1.6 var(--font-ui);color:var(--text-body);text-wrap:pretty}
.imp-g-lead--small{font-size:12.5px}
.imp-g-sign{font:400 var(--sign-size)/1 var(--font-hand);color:var(--text-accent)}
.imp-g-appbar--e{justify-content:space-between}
.imp-g-panel{padding:var(--panel-pad);border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border)}
.imp-g-panel--flat{background:var(--panel-flat-bg)}
.imp-g-panel--glass{background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
.imp-g-panel--pad{padding:18px}
.imp-g-panel-stack{display:flex;flex-direction:column;gap:12px}
.imp-g-card-title{font:600 var(--card-title-size)/1.3 var(--font-ui);color:var(--text-heading)}
.imp-g-metrics{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.imp-g-metric{display:flex;flex-direction:column;gap:5px;min-width:0}
.imp-g-metric-value{font:400 var(--metric-size)/1 var(--font-display);color:var(--text-heading)}
.imp-g-metric-label{font:400 9.5px/1.2 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-body)}
.imp-g-steps{display:flex;flex-direction:column;gap:10px}
.imp-g-step{display:flex;gap:12px;align-items:flex-start}
.imp-g-step-num{flex:0 0 auto;width:var(--step-num);height:var(--step-num);display:grid;place-items:center;border-radius:8px;background:var(--accent-tint-bg);border:1px solid var(--accent-tint-border);font:600 11px/1 var(--font-ui);color:var(--accent-tint-fg)}
.imp-g-step-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.imp-g-step-title{font:600 13.5px/1.3 var(--font-ui);color:var(--text-heading)}
.imp-g-step-desc{font:400 12px/1.45 var(--font-ui);color:var(--text-body)}
.imp-g-len-row{display:flex;align-items:center;gap:12px}
.imp-g-len-name{flex:0 0 58px;font:400 var(--len-name-size)/1 var(--font-display);color:var(--len-name-color)}
.imp-g-len-time{flex:0 0 92px;font:600 12.5px/1 var(--font-ui);color:var(--text-heading)}
.imp-g-len-desc{flex:1;min-width:0;font:400 12px/1.35 var(--font-ui);color:var(--text-body)}
.imp-g-acc{border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border);overflow:hidden}
.imp-g-acc[open]{border-color:var(--accent-tint-border)}
.imp-g-acc-head{display:flex;align-items:center;gap:12px;min-height:var(--acc-head-h);padding:0 16px;cursor:pointer;list-style:none;transition:background 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-acc-head::-webkit-details-marker{display:none}
.imp-g-acc-head:hover{background:var(--panel-flat-bg)}
.imp-g-acc-icon{flex:0 0 auto;width:var(--acc-icon);height:var(--acc-icon);border-radius:10px;background:var(--accent-tint-bg);border:1px solid var(--accent-tint-border);display:grid;place-items:center;color:var(--accent-tint-fg)}
.imp-g-acc-title{flex:1;font:600 var(--acc-title-size)/1.35 var(--font-ui);color:var(--text-heading)}
.imp-g-acc-sign{flex:0 0 auto;width:26px;height:26px;border-radius:8px;border:1px solid var(--input-border);display:grid;place-items:center;font:400 15px/1 var(--font-ui);color:var(--accent-tint-fg)}
.imp-g-acc-sign::after{content:"+"}
.imp-g-acc[open] .imp-g-acc-sign::after{content:"\2013"}
.imp-g-acc-body{display:flex;flex-direction:column;gap:10px;padding:0 16px 16px}
.imp-g-def{display:flex;flex-direction:column;gap:3px}
.imp-g-def-term{font:600 13px/1.4 var(--font-ui);color:var(--text-heading)}
.imp-g-def-desc{font:400 12.5px/1.6 var(--font-ui);color:var(--text-body)}
.imp-g-badge-done{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:0 11px;border-radius:11px;background:var(--accent-tint-bg);border:1px solid var(--accent-tint-border);font:600 11px/1 var(--font-ui);color:var(--accent-tint-fg);align-self:flex-start}
.imp-g-badge-done svg{flex:0 0 auto}
.imp-g-dock{position:sticky;bottom:12px;z-index:3;margin:0 12px;display:flex;gap:4px;padding:6px;border-radius:22px;background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
.imp-g-dock-item{flex:1;min-height:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border-radius:16px;color:var(--text-body);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-dock-item:hover{color:var(--text-accent)}
.imp-g-dock-item span{font:600 9.5px/1 var(--font-ui);letter-spacing:.08em;text-transform:uppercase}
.imp-g-dock-item--active{background:var(--lime);color:var(--ink)}
.imp-g-dock-item--active:hover{color:var(--ink)}
.imp-g-test-bar{position:relative;z-index:2;display:flex;align-items:center;gap:12px;padding:12px 16px;min-height:var(--topbar-mobile-h)}
.imp-g-test-bar-title{margin-left:auto;font:400 11.5px/1 var(--font-ui);color:var(--text-meta)}
.imp-g-dots{display:flex;align-items:center;gap:6px}
.imp-g-dot{width:var(--dot-size);height:var(--dot-size);display:grid;place-items:center;border-radius:var(--radius-pill);background:var(--dot-bg);color:var(--dot-fg);font:600 11px/1 var(--font-ui)}
.imp-g-dot--done{background:var(--dot-done-bg);color:var(--dot-done-fg)}
.imp-g-dot--on{background:var(--dot-on-bg);color:var(--dot-on-fg)}
.imp-g-dots-label{font:400 10px/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-body)}
.imp-g-sw{display:flex;flex-direction:column;gap:6px;padding:16px 18px;border-radius:var(--radius-timer);background:var(--module-bg);border:1px solid var(--card-border)}
.imp-g-sw-value{font:400 var(--sw-value-size)/1 var(--font-display);color:var(--text-heading)}
.imp-g-sw-meta{font:400 11.5px/1 var(--font-ui);color:var(--text-body)}
.imp-g-attempts{display:flex;gap:8px}
.imp-g-attempt{flex:1;padding:11px 13px;border-radius:var(--radius-chip);background:var(--panel-flat-bg);border:1px solid var(--panel-border);display:flex;flex-direction:column;gap:4px}
.imp-g-attempt-label{font:400 10px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-body)}
.imp-g-attempt-value{font:400 20px/1 var(--font-display);color:var(--text-heading)}
.imp-g-attempt--best .imp-g-attempt-value{color:var(--num-on)}
.imp-g-row-between{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.imp-g-num-pair{display:flex;align-items:center;gap:14px}
.imp-g-num-box{flex:1;min-width:0;padding:12px 14px;border-radius:var(--radius-chip);background:var(--panel-flat-bg);border:1px solid var(--panel-border);display:flex;flex-direction:column;gap:4px}
.imp-g-num-label{font:400 10px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-body)}
.imp-g-num-value{font:400 var(--numbox-value-size)/1 var(--font-display);color:var(--text-heading)}
.imp-g-num-arrow{flex:0 0 auto;color:var(--accent-tint-fg)}
.imp-g-fullstop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;min-height:100vh;padding:40px 24px;background:var(--fs-bg);text-align:center;cursor:pointer}
.imp-g-fs-label{font:400 var(--eyebrow-size)/1 var(--font-ui);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--eyebrow-color)}
.imp-g-fs-timer{font:400 var(--fs-timer-size)/1 var(--font-display);color:var(--text-heading)}
.imp-g-fs-stop{font:400 46px/1 var(--font-display);letter-spacing:.06em;color:var(--num-on)}
.imp-g-fs-note{max-width:520px;font:400 13px/1.6 var(--font-ui);color:var(--text-body)}
.imp-g-tiles{display:grid;grid-template-columns:repeat(6,var(--tile-size));gap:7px;justify-content:center}
.imp-g-tile{width:var(--tile-size);height:var(--tile-size);display:grid;place-items:center;border-radius:var(--radius-tile);background:var(--tile-bg);border:1px solid var(--tile-border);color:var(--tile-fg);font:400 20px/1 var(--font-display)}
.imp-g-tile--done{background:var(--tile-done-bg);border-color:var(--tile-done-border);color:var(--tile-done-fg)}
.imp-g-tile--next{background:var(--tile-next-bg);border-color:var(--tile-next-bg);color:var(--tile-next-fg)}
.imp-g-cmp{border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border);overflow:hidden}
.imp-g-cmp-head,.imp-g-cmp-row{display:grid;grid-template-columns:1fr 92px 92px;align-items:center;gap:10px;padding:12px 16px}
.imp-g-cmp--delta .imp-g-cmp-head,.imp-g-cmp--delta .imp-g-cmp-row{grid-template-columns:1fr 84px 84px 78px}
.imp-g-cmp-row + .imp-g-cmp-row,.imp-g-cmp-head + .imp-g-cmp-row{border-top:1px solid var(--divider)}
.imp-g-cmp-head{background:var(--panel-flat-bg)}
.imp-g-cmp-th{font:400 10px/1.3 var(--font-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--text-body)}
.imp-g-cmp-name{display:flex;flex-direction:column;gap:3px;min-width:0}
.imp-g-cmp-name b{font:600 var(--cmp-name-size)/1.35 var(--font-ui);color:var(--text-heading)}
.imp-g-cmp-name span{font:400 11px/1.3 var(--font-ui);color:var(--text-meta)}
.imp-g-cmp-val{font:400 var(--cmp-value-size)/1 var(--font-display);color:var(--text-heading)}
.imp-g-cmp-wait{font:400 11px/1.3 var(--font-ui);color:var(--delta-wait)}
.imp-g-cmp-delta{font:600 13px/1 var(--font-ui);color:var(--delta-good)}
.imp-g-cmp-delta--bad{color:var(--delta-bad)}
.imp-g-trio{display:grid;grid-template-columns:1fr;gap:10px}
.imp-g-trio-cell{padding:16px 18px;border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border);display:flex;flex-direction:column;gap:5px}
.imp-g-trio-value{font:400 var(--trio-value-size)/1 var(--font-display);color:var(--text-heading)}
.imp-g-trio-label{font:400 10px/1.3 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-body)}
.imp-g-note-block{display:flex;flex-direction:column;gap:8px}
.imp-g-note-block p{margin:0;font:400 12.5px/1.6 var(--font-ui);color:var(--text-body);text-wrap:pretty}
.imp-g-note-block b{color:var(--text-heading)}
@media (min-width:1024px){
.imp-g-e-view{display:grid;grid-template-columns:1fr var(--e-rail-w);gap:28px;align-items:start;padding:158px 140px 70px}
.imp-g-e-view--single{display:block;max-width:1020px;margin:0 auto}
.imp-g-metrics{grid-template-columns:repeat(4,1fr);gap:0}
.imp-g-metric{padding:0 22px}
.imp-g-metric + .imp-g-metric{border-left:1px solid var(--divider)}
.imp-g-metric:first-child{padding-left:0}
.imp-g-metric:last-child{padding-right:0}
.imp-g-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.imp-g-step{flex-direction:column;gap:8px;padding:16px 18px;border-radius:var(--radius-panel);background:var(--panel-bg);border:1px solid var(--panel-border)}
.imp-g-step-title{font-size:14px}
.imp-g-step-desc{font-size:12.5px}
.imp-g-len-row{gap:16px}
.imp-g-len-name{flex-basis:76px}
.imp-g-len-time{flex-basis:130px;font-size:13.5px}
.imp-g-len-desc{font-size:13px}
.imp-g-acc-body{padding:0 22px 20px;gap:12px}
.imp-g-dock{display:none}
.imp-g-appbar--e{display:none}
.imp-g-test-bar{padding:22px 60px}
.imp-g-trio{grid-template-columns:repeat(3,1fr)}
.imp-g-tiles{gap:10px}
.imp-g-cmp-head,.imp-g-cmp-row{padding:14px 22px}
.imp-g-cmp-head,.imp-g-cmp-row{grid-template-columns:1fr 150px 150px}
.imp-g-cmp--delta .imp-g-cmp-head,.imp-g-cmp--delta .imp-g-cmp-row{grid-template-columns:1fr 150px 150px 130px}
}
.imp-g-f-view{position:relative;z-index:1;display:flex;flex-direction:column;gap:16px;padding:20px 20px 108px}
.imp-g-f-head{display:flex;flex-direction:column;gap:6px}
.imp-g-f-title{margin:0;font:400 var(--title-e-size)/.94 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-g-f-back{display:inline-flex;align-items:center;gap:7px;min-height:44px;font:500 12.5px/1 var(--font-ui);color:var(--text-body);text-decoration:none;transition:color 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-f-back:hover{color:var(--text-accent)}
.imp-g-filters{display:flex;gap:6px}
.imp-g-filter{padding:8px 13px;border-radius:20px;border:1px solid var(--input-border);font:400 11.5px/1 var(--font-ui);color:var(--text-body);text-decoration:none;transition:border-color 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-filter:hover{border-color:var(--text-accent);color:var(--text-accent)}
.imp-g-filter--active{background:var(--lime);border-color:var(--lime);color:var(--ink);font-weight:600}
.imp-g-filter--active:hover{color:var(--ink)}
.imp-g-msg-list{display:flex;flex-direction:column;gap:10px}
.imp-g-msg-row{display:flex;align-items:flex-start;gap:12px;padding:16px 18px;border-radius:var(--radius-msg);background:var(--msg-bg);border:1px solid var(--msg-border);text-decoration:none;transition:transform 150ms cubic-bezier(.4,0,.2,1),border-color 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-msg-row:hover{transform:translateY(-3px);border-color:var(--msg-border-unread)}
.imp-g-msg-row--unread{border-color:var(--msg-border-unread)}
.imp-g-msg-row--selected{border-color:var(--msg-border-selected);box-shadow:var(--msg-ring-selected)}
.imp-g-avatar{flex:0 0 auto;width:var(--msg-avatar);height:var(--msg-avatar);border-radius:var(--radius-pill);background:var(--avatar-bg);display:grid;place-items:center;font:600 11.5px/1 var(--font-ui);color:var(--avatar-fg)}
.imp-g-avatar--lg{width:var(--thread-avatar);height:var(--thread-avatar);font-size:12.5px}
.imp-g-msg-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.imp-g-msg-top{display:flex;align-items:baseline;gap:10px}
.imp-g-msg-subject{flex:1;min-width:0;font:600 13.5px/1.35 var(--font-ui);color:var(--text-heading);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-g-msg-subject--read{color:var(--text-body)}
.imp-g-msg-time{flex:0 0 auto;font:400 11px/1 var(--font-ui);color:var(--text-meta)}
.imp-g-msg-preview{font:400 12.5px/1.45 var(--font-ui);color:var(--text-body);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-g-msg-meta{font:400 11.5px/1 var(--font-ui);color:var(--text-meta)}
.imp-g-badge-unread{flex:0 0 auto;min-width:var(--badge-unread-h);height:var(--badge-unread-h);padding:0 6px;border-radius:var(--radius-pill);background:var(--badge-unread-bg);color:var(--badge-unread-fg);display:grid;place-items:center;font:600 10.5px/1 var(--font-ui)}
.imp-g-tag-new{font:600 10.5px/1 var(--font-ui);padding:5px 9px;border-radius:20px;background:var(--tag-new-bg);color:var(--tag-new-fg)}
.imp-g-empty{padding:32px 22px;border-radius:var(--radius-msg);background:var(--msg-bg);border:1px solid var(--msg-border);text-align:center}
.imp-g-empty-icon{width:56px;height:56px;margin:0 auto 16px;border-radius:var(--radius-pill);background:var(--avatar-bg);display:grid;place-items:center;color:var(--avatar-fg)}
.imp-g-empty-title{font:400 22px/1 var(--font-display);text-transform:uppercase;color:var(--text-heading)}
.imp-g-empty-text{margin:10px auto 18px;max-width:250px;font:400 12.5px/1.55 var(--font-ui);color:var(--text-body)}
.imp-g-thread-head{display:flex;align-items:center;gap:11px}
.imp-g-thread-who{display:flex;flex-direction:column;gap:3px;min-width:0}
.imp-g-thread-name{font:600 14px/1.2 var(--font-ui);color:var(--text-heading)}
.imp-g-thread-sub{font:400 11px/1 var(--font-ui);color:var(--text-meta)}
.imp-g-thread-subject{margin:0;font:600 18px/1.3 var(--font-ui);color:var(--text-heading);text-wrap:pretty}
.imp-g-thread-meta{margin:0;font:400 11.5px/1 var(--font-ui);color:var(--text-meta)}
.imp-g-thread{display:flex;flex-direction:column;gap:14px}
.imp-g-msg{display:flex;flex-direction:column;gap:7px}
.imp-g-msg--me{align-items:flex-end}
.imp-g-msg--them{align-items:flex-start}
.imp-g-msg-from{display:flex;align-items:center;gap:9px}
.imp-g-msg-from span{font:600 11.5px/1 var(--font-ui);color:var(--text-accent)}
.imp-g-bubble{max-width:var(--bubble-max);padding:15px 17px;border-radius:var(--radius-bubble)}
.imp-g-bubble p{margin:0;font:400 13.5px/1.55 var(--font-ui)}
.imp-g-msg--me .imp-g-bubble{border-bottom-right-radius:var(--radius-bubble-tail);background:var(--bubble-me-bg);color:var(--bubble-me-fg);box-shadow:var(--bubble-me-shadow)}
.imp-g-msg--them .imp-g-bubble{border-bottom-left-radius:var(--radius-bubble-tail);background:var(--bubble-them-bg);border:1px solid var(--bubble-them-border);color:var(--bubble-them-fg)}
.imp-g-msg-stamp{font:400 11px/1 var(--font-ui);color:var(--text-meta)}
.imp-g-composer{padding:18px;border-radius:22px;background:var(--card-bg-1);backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));-webkit-backdrop-filter:blur(var(--card-blur-1)) saturate(var(--card-saturate-1));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
.imp-g-composer label{display:block;font:600 13px/1 var(--font-ui);color:var(--text-heading);margin-bottom:10px}
.imp-g-composer textarea{width:100%;box-sizing:border-box;padding:14px 16px;border-radius:var(--input-radius);border:1px solid var(--input-border);background:var(--input-bg);font:400 13.5px/1.5 var(--font-ui);color:var(--text-heading);resize:vertical}
.imp-g-composer .imp-g-btn-primary{margin-top:12px}
.imp-g-dtc{display:flex;flex-direction:column;gap:8px}
.imp-g-dtc-value{font:400 var(--dtc-value-size)/1 var(--font-display);color:var(--text-heading)}
.imp-g-dtc-pair{display:flex;align-items:baseline;gap:12px}
.imp-g-dtc-pair .imp-g-dtc-value--from{color:var(--text-body)}
.imp-g-dtc-arrow{font:400 20px/1 var(--font-ui);color:var(--text-meta)}
.imp-g-dtc-delta{font:600 13px/1 var(--font-ui);color:var(--delta-good)}
@media (min-width:1024px){
.imp-g-f-view{display:grid;grid-template-columns:1fr;gap:22px;padding:104px 60px 40px}
.imp-g-f-view--master{grid-template-columns:var(--list-w) 1fr;align-items:start}
.imp-g-f-view--results{grid-template-columns:1fr var(--e-rail-w)}
.imp-g-f-topline{grid-column:1 / -1;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:0 8px}
.imp-g-f-title{font-size:44px}
.imp-g-msg-row{padding:16px}
.imp-g-msg-subject{font-size:13.5px}
.imp-g-thread-panel{display:flex;flex-direction:column;min-width:0;border-radius:var(--radius-panel);background:var(--msg-bg);border:1px solid var(--msg-border);overflow:hidden;height:640px}
.imp-g-thread-panel .imp-g-thread-bar{display:flex;align-items:center;gap:12px;padding:18px 22px;border-bottom:1px solid var(--divider)}
.imp-g-thread-panel .imp-g-thread{flex:1;padding:22px;gap:16px;overflow:hidden;background:var(--card-bg-4)}
.imp-g-thread-panel .imp-g-composer{border-radius:0;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;border:none;border-top:1px solid var(--divider);box-shadow:none;display:flex;gap:10px;align-items:flex-end;padding:16px 22px 20px}
.imp-g-thread-panel .imp-g-composer textarea{flex:1;min-height:var(--composer-min);resize:none}
.imp-g-thread-panel .imp-g-composer .imp-g-btn-primary{margin-top:0;width:auto;padding:0 22px;min-height:var(--composer-min)}
.imp-g-empty--panel{margin:auto;border:1px dashed var(--msg-border);background:none}
}
.imp-g-g-page{background:var(--g-bg)}
.imp-g-g-shell{position:relative;z-index:1;box-sizing:border-box;width:100%;max-width:var(--g-shell-max);margin:0 auto;padding:var(--g-shell-pad);display:flex;flex-direction:column}
.imp-g-g-scrim{position:absolute;top:0;left:0;right:0;height:var(--g-scrim-h);pointer-events:none;background:var(--g-scrim);z-index:0}
.imp-g-g-figure{position:absolute;pointer-events:none;z-index:0;opacity:var(--gfx-hand,.72);filter:drop-shadow(0 24px 48px rgba(var(--violet-rgb),.5))}
.imp-g-g-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:56px}
.imp-g-g-bar-end{display:flex;align-items:center;gap:14px}
.imp-g-g-topbar{display:none}
.imp-g-g-hero{max-width:var(--g-hero-max)}
.imp-g-g-title{margin:0 0 18px;font:400 var(--g-title-size)/.86 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--text-heading)}
.imp-g-g-title--thanks{font-size:var(--g-title-thanks-size);line-height:.9}
.imp-g-g-hand{margin:0;font:500 var(--g-hand-size)/1.15 var(--font-hand);color:var(--text-accent)}
.imp-g-g-note{margin:0;text-align:center;font:400 12px/1.5 var(--font-ui);color:var(--text-body)}
.imp-g-g-note--left{text-align:left}
.imp-g-g-section{margin-top:34px}
.imp-g-g-section--tight{margin-top:26px}
.imp-g-g-foot{margin:20px 0 0;text-align:center;font:400 12px/1.5 var(--font-ui);color:var(--text-body)}
.imp-g-g-link{color:var(--text-accent);font-weight:600;text-decoration:none}
.imp-g-g-link:hover{text-decoration:underline}
.imp-g-g-steps{display:flex;flex-direction:column}
.imp-g-g-step{display:flex;gap:16px;padding:22px 0;border-bottom:1px solid var(--g-divider)}
.imp-g-g-step:first-child{padding-top:0}
.imp-g-g-step:last-child{border-bottom:0}
.imp-g-g-step-num{flex:none;font:400 var(--g-num-size)/.85 var(--font-display);color:var(--eyebrow-color)}
.imp-g-g-step-body{flex:1;min-width:0}
.imp-g-g-step-title{font:600 15.5px/1.3 var(--font-ui);color:var(--text-heading)}
.imp-g-g-step-desc{margin:8px 0 0;font:400 13.5px/1.6 var(--font-ui);color:var(--text-body)}
.imp-g-g-give{display:flex;flex-direction:column;gap:14px}
.imp-g-g-give-row{display:flex;align-items:baseline;gap:14px}
.imp-g-g-give-num{flex:none;width:38px;font:400 var(--g-give-num-size)/1 var(--font-display);color:var(--text-heading)}
.imp-g-g-give-num--accent{color:var(--eyebrow-color)}
.imp-g-g-give-text{flex:1;font:400 13.5px/1.45 var(--font-ui);color:var(--text-body)}
.imp-g-g-card{padding:14px 16px;border-radius:var(--radius-g-soft);background:var(--g-card-bg);border:1px solid var(--g-card-border)}
.imp-g-g-card-label{font:600 10.5px/1 var(--font-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow-color);margin-bottom:7px}
.imp-g-g-card-text{margin:0;font:400 12px/1.5 var(--font-ui);color:var(--text-body)}
.imp-g-g-duo{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.imp-g-g-defs{display:flex;flex-direction:column;gap:11px}
.imp-g-g-def{display:flex;flex-direction:column;gap:3px}
.imp-g-g-def-term{font:600 13.5px/1.35 var(--font-ui);color:var(--text-heading)}
.imp-g-g-def-desc{font:400 12.5px/1.5 var(--font-ui);color:var(--text-body)}
.imp-g-g-aud{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.imp-g-g-aud-card{padding:18px;border-radius:var(--radius-g-card);background:var(--g-card-soft-bg);border:1px solid var(--g-card-border)}
.imp-g-g-aud-card--yes{background:var(--g-yes-bg);border-color:var(--g-yes-border)}
.imp-g-g-aud-label{font:600 12px/1 var(--font-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--text-body);margin-bottom:12px}
.imp-g-g-aud-card--yes .imp-g-g-aud-label{color:var(--eyebrow-color)}
.imp-g-g-aud-text{margin:0;font:400 12.5px/1.55 var(--font-ui);color:var(--text-body)}
.imp-g-g-aud-card--yes .imp-g-g-aud-text{color:var(--text-heading)}
.imp-g-price-eyebrow{margin-bottom:10px}
.imp-g-price{display:flex;align-items:baseline;gap:12px;margin-bottom:10px}
.imp-g-price-value{font:400 var(--g-price-size)/1 var(--font-display);color:var(--text-heading)}
.imp-g-price-meta{font:400 12.5px/1.3 var(--font-ui);color:var(--text-body)}
.imp-g-price-points{display:flex;flex-direction:column;gap:7px;margin-bottom:14px}
.imp-g-price-point{display:flex;gap:9px;font:400 12.5px/1.5 var(--font-ui);color:var(--text-body)}
.imp-g-price-point::before{content:"·";color:var(--eyebrow-color)}
.imp-g-price-line{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding-bottom:14px;border-bottom:1px solid var(--g-divider)}
.imp-g-price-line-value{font:400 54px/.78 var(--font-display);color:var(--text-heading)}
.imp-g-price-line-meta{text-align:right;font:400 12px/1.5 var(--font-ui);color:var(--text-body)}
.imp-g-g-tiers{display:flex;flex-direction:column;gap:10px}
.imp-g-g-tier{padding:16px 18px;border-radius:var(--radius-g-card);background:var(--g-card-bg);border:1px solid var(--g-card-border);display:flex;flex-direction:column;gap:7px}
.imp-g-g-tier-head{display:flex;align-items:baseline;gap:12px}
.imp-g-g-tier-name{flex:0 0 auto;font:400 var(--g-tier-name-size)/1 var(--font-display);letter-spacing:.04em;color:var(--eyebrow-color)}
.imp-g-g-tier-meta{flex:1;font:400 10.5px/1 var(--font-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--text-body)}
.imp-g-g-tier-price{flex:0 0 auto;font:400 26px/1 var(--font-display);color:var(--text-heading)}
.imp-g-g-tier-desc{margin:0;font:400 12px/1.5 var(--font-ui);color:var(--text-body)}
.imp-g-g-cta{position:relative;overflow:hidden;margin-top:26px;padding:22px 20px;border-radius:var(--radius-card);background:var(--violet);box-shadow:var(--shadow-glass)}
.imp-g-g-cta-inner{position:relative}
.imp-g-g-cta .imp-g-eyebrow{color:var(--lime)}
.imp-g-g-cta-price{display:flex;align-items:baseline;gap:10px;margin-bottom:6px}
.imp-g-g-cta-price-value{font:400 52px/1 var(--font-display);color:var(--paper)}
.imp-g-g-cta-price-unit{font:600 15px/1 var(--font-ui);color:var(--paper)}
.imp-g-g-cta-text{margin:0 0 20px;max-width:240px;font:400 13px/1.5 var(--font-ui);color:rgba(var(--paper-rgb),.88)}
.imp-g-g-cta .imp-g-btn-outline{border-color:rgba(var(--paper-rgb),.5);color:var(--paper)}
.imp-g-g-cta .imp-g-btn-outline:hover{border-color:var(--lime);color:var(--lime)}
.imp-g-g-modules{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.imp-g-g-module{display:flex;flex-direction:column;padding:14px 14px 15px;border-radius:var(--radius-g-card);background:var(--g-card-bg);border:1px solid var(--g-card-border);text-decoration:none;transition:transform 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-g-module:hover{transform:translateY(-4px)}
.imp-g-g-module-shape{position:relative;height:var(--g-shape-h);border-radius:14px;display:grid;place-items:center;margin-bottom:12px}
.imp-g-g-module-shape img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:var(--gfx-glass);pointer-events:none}
.imp-g-g-module-shape--wide img{transform:scale(1.3)}
.imp-g-g-module-num{position:relative;font:400 34px/1 var(--font-display);color:var(--text-heading)}
.imp-g-g-module-name{font:600 14.5px/1.3 var(--font-ui);color:var(--text-heading);margin-bottom:6px}
.imp-g-g-module-desc{font:400 12px/1.5 var(--font-ui);color:var(--text-body)}
.imp-g-g-stepper{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:22px;font:400 12px/1 var(--font-ui);color:var(--text-body)}
.imp-g-g-stepper-item{display:flex;align-items:center;gap:9px}
.imp-g-g-stepper-dot{flex:none;width:var(--g-step-dot);height:var(--g-step-dot);border-radius:var(--radius-pill);display:grid;place-items:center;font:400 16px/1 var(--font-display);background:var(--g-card-soft-bg);color:var(--text-body)}
.imp-g-g-stepper-dot--done{background:var(--lime);color:var(--ink);font:600 10.5px/1 var(--font-ui)}
.imp-g-g-stepper-dot--now{background:var(--violet);color:var(--paper)}
.imp-g-g-stepper-name{font:600 11.5px/1 var(--font-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--text-body)}
.imp-g-g-stepper-item--now .imp-g-g-stepper-name{color:var(--eyebrow-color)}
.imp-g-g-stepper-rule{flex:1;min-width:18px;height:2px;background:var(--g-divider)}
.imp-g-g-stepper-rule--done{background:var(--violet)}
.imp-g-g-form{display:flex;flex-direction:column;gap:var(--form-gap)}
.imp-g-field{display:flex;flex-direction:column;gap:8px}
.imp-g-field-label{font:600 13px/1 var(--font-ui);color:var(--text-heading)}
.imp-g-input{width:100%;box-sizing:border-box;min-height:var(--input-height);padding:0 var(--input-padding-x);border-radius:var(--radius-g-input);border:1px solid var(--g-field-border);background:var(--g-field-bg);font:400 var(--input-font-size)/1 var(--font-ui);color:var(--text-heading)}
.imp-g-input::placeholder{color:var(--text-meta)}
.imp-g-input:focus{outline:none;border-color:var(--text-accent)}
.imp-g-field-hint{font:400 11.5px/1.4 var(--font-ui);color:var(--text-body)}
.imp-g-g-consent{display:flex;align-items:flex-start;gap:11px;padding:14px 15px;border-radius:12px;background:var(--g-card-bg);border:1px solid var(--g-card-border)}
.imp-g-g-consent-box{flex:none;width:18px;height:18px;border-radius:var(--radius-checkbox);background:var(--lime);display:grid;place-items:center;font:600 11px/1 var(--font-ui);color:var(--ink)}
.imp-g-g-consent-text{font:400 12.5px/1.5 var(--font-ui);color:var(--text-body)}
.imp-g-g-order-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:18px;border-bottom:1px solid var(--g-divider);margin-bottom:20px}
.imp-g-g-order-name{font:400 24px/1 var(--font-display);text-transform:uppercase;color:var(--text-heading)}
.imp-g-g-order-price{font:400 30px/1 var(--font-display);color:var(--eyebrow-color);text-align:right}
.imp-g-g-order-unit{font:400 11px/1 var(--font-ui);color:var(--text-body);margin-top:3px;text-align:right}
.imp-g-g-sum-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;font:400 13.5px/1.3 var(--font-ui);color:var(--text-body)}
.imp-g-g-sum-row b{font:600 14px/1 var(--font-ui);color:var(--text-heading)}
.imp-g-g-sum-rule{height:1px;background:var(--g-divider)}
.imp-g-g-sum-total{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-top:18px}
.imp-g-g-sum-total-label{font:600 15px/1 var(--font-ui);color:var(--text-heading)}
.imp-g-g-sum-total-value{font:400 var(--g-price-total-size)/1 var(--font-display);color:var(--eyebrow-color)}
.imp-g-g-secure{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:16px;text-align:center;font:400 11.5px/1.4 var(--font-ui);color:var(--text-body)}
.imp-g-g-stripe{border-radius:var(--radius-g-card);background:var(--g-stripe-bg);border:1px solid var(--g-stripe-border);overflow:hidden}
.imp-g-g-stripe-head{padding:20px 24px;border-bottom:1px solid var(--g-stripe-border);display:flex;flex-direction:column;gap:10px}
.imp-g-g-stripe-body{padding:24px;display:flex;flex-direction:column;gap:16px}
.imp-g-g-stripe-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font:400 13px/1.4 var(--font-ui);color:var(--text-body)}
.imp-g-g-stripe-row b{font:600 13.5px/1 var(--font-ui);color:var(--text-heading)}
.imp-g-g-stripe-pay{min-height:52px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:var(--violet);color:var(--paper);font:600 15px/1 var(--font-ui)}
.imp-g-g-stripe-fine{text-align:center;font:400 11px/1.4 var(--font-ui);color:var(--text-body)}
.imp-g-g-tag{font:400 11px/1 ui-monospace,Menlo,monospace;padding:3px 8px;border-radius:6px;background:var(--violet);color:var(--paper)}
.imp-g-g-badge{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:var(--radius-pill);background:var(--lime);color:var(--ink);font:600 11px/1 var(--font-ui);letter-spacing:.06em;text-transform:uppercase;margin-bottom:16px}
.imp-g-g-toc{display:flex;flex-direction:column;max-width:820px}
.imp-g-g-toc-row{display:flex;align-items:baseline;gap:10px;padding:10px 0;border-top:1px solid var(--g-divider)}
.imp-g-g-toc-row:last-child{border-bottom:1px solid var(--g-divider)}
.imp-g-g-toc-title{flex:0 0 auto;font:600 13.5px/1.35 var(--font-ui);color:var(--text-heading)}
.imp-g-g-toc-leader{flex:1;min-width:12px;border-bottom:1px dotted var(--g-leader);transform:translateY(-4px)}
.imp-g-g-toc-page{flex:0 0 auto;font:400 var(--g-toc-page-size)/1 var(--font-display);color:var(--eyebrow-color)}
.imp-g-g-pills{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}
.imp-g-g-pill{font:400 11px/1 var(--font-ui);padding:7px 11px;border-radius:var(--radius-pill);border:1px solid var(--g-pill-border);color:var(--g-pill-fg)}
.imp-g-g-features{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.imp-g-g-feature{display:flex;flex-direction:column;gap:9px}
.imp-g-g-feature-icon{color:var(--eyebrow-color)}
.imp-g-g-feature-name{font:600 12.5px/1.25 var(--font-ui);color:var(--text-heading)}
.imp-g-g-feature-sub{font:400 11px/1.25 var(--font-ui);color:var(--eyebrow-color)}
.imp-g-g-feature-desc{font:400 11.5px/1.45 var(--font-ui);color:var(--text-body)}
.imp-g-g-files{display:flex;flex-direction:column;gap:10px}
.imp-g-g-file{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 14px;border-radius:14px;background:var(--g-card-bg);border:1px solid var(--g-card-border)}
.imp-g-g-file-body{flex:1;min-width:0}
.imp-g-g-file-name{font:600 13px/1.35 var(--font-ui);color:var(--text-heading)}
.imp-g-g-file-meta{font:400 11.5px/1.4 var(--font-ui);color:var(--text-body)}
.imp-g-btn-mini{flex:0 0 auto;min-height:var(--g-mini-h);display:flex;align-items:center;padding:0 14px;border-radius:var(--radius-g-mini);border:1px solid var(--btn-outline-border);background:none;color:var(--text-heading);font:600 12px/1 var(--font-ui);cursor:pointer;text-decoration:none;transition:border-color 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1)}
.imp-g-btn-mini:hover{border-color:var(--text-accent);color:var(--text-accent)}
.imp-g-btn-mini--solid{background:var(--g-mini-solid-bg);border-color:transparent;color:var(--g-mini-solid-fg)}
.imp-g-btn-mini--solid:hover{background:var(--violet);border-color:transparent;color:var(--paper)}
.imp-g-g-guarantee{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:16px;padding:14px 22px;border-radius:var(--radius-g-card);background:var(--g-guarantee-bg);border:1px solid var(--g-guarantee-border)}
.imp-g-g-guarantee-label{flex:0 0 auto;font:600 11px/1 var(--font-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--g-guarantee-fg)}
.imp-g-g-guarantee-rule{flex:0 0 auto;width:1px;height:16px;background:var(--g-divider)}
.imp-g-g-guarantee-text{font:400 13px/1.4 var(--font-ui);color:var(--text-heading)}
.imp-g-g-next{display:flex;flex-direction:column;gap:12px}
.imp-g-g-next-row{display:flex;align-items:baseline;gap:14px;font:400 13px/1.5 var(--font-ui);color:var(--text-body)}
.imp-g-g-next-num{flex:none;width:24px;font:400 20px/1 var(--font-display);color:var(--text-heading)}
.imp-g-g-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.imp-g-g-actions .imp-g-btn-primary,.imp-g-g-actions .imp-g-btn-outline{width:auto;padding:0 26px;gap:10px}
.imp-g-g-hint-dot{display:flex;align-items:center;gap:9px;margin-top:22px;font:400 12.5px/1.4 var(--font-ui);color:var(--text-body)}
.imp-g-g-hint-dot::before{content:"";flex:none;width:5px;height:5px;border-radius:50%;background:var(--lime)}
@media (min-width:1024px){
.imp-g-g-bar{display:none}
.imp-g-g-topbar{position:sticky;top:16px;z-index:3;display:flex;align-items:center;gap:24px;margin:0 auto 26px;width:calc(100% - 48px);max-width:calc(var(--g-shell-max) - 48px);box-sizing:border-box;padding:10px 14px 10px 18px;border-radius:var(--radius-topbar);background:var(--card-bg-2);backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));-webkit-backdrop-filter:blur(var(--card-blur-2)) saturate(var(--card-saturate-2));border:1px solid var(--glass-border);border-top-color:var(--glass-border-top);box-shadow:var(--shadow-glass)}
.imp-g-g-topbar-end{margin-left:auto;display:flex;align-items:center;gap:14px;font:400 12.5px/1 var(--font-ui);color:var(--text-body)}
.imp-g-g-topbar-end .imp-g-btn-primary{width:auto;min-height:44px;padding:0 20px;font-size:13.5px;border-radius:14px}
.imp-g-g-shell{padding:var(--g-shell-pad-desktop)}
.imp-g-g-lead-grid{display:grid;grid-template-columns:1fr var(--g-rail-w);gap:48px;align-items:start}
.imp-g-g-lead-grid--end{align-items:end}
.imp-g-g-hero{max-width:none}
.imp-g-g-hero .imp-g-lead{max-width:620px}
.imp-g-g-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.imp-g-g-step{padding:14px 18px;border-radius:var(--radius-g-card);background:var(--g-card-bg);border:1px solid var(--g-card-border)}
.imp-g-g-step:first-child{padding-top:14px}
.imp-g-g-step-title{font-size:13.5px}
.imp-g-g-step-desc{margin-top:5px;font-size:12px;line-height:1.5}
.imp-g-g-give{flex-direction:row;padding:11px 20px;border-radius:var(--radius-g-card);background:var(--g-card-bg);border:1px solid var(--g-card-border)}
.imp-g-g-give-row{flex:1;min-width:0;gap:11px;padding-left:20px;border-left:1px solid var(--g-divider)}
.imp-g-g-give-row:first-child{padding-left:0;border-left:0}
.imp-g-g-give-num{width:auto}
.imp-g-g-give-text{font-size:12px;line-height:1.4}
.imp-g-g-duo{grid-template-columns:1fr 1fr;gap:12px}
.imp-g-g-modules{grid-template-columns:repeat(5,1fr)}
.imp-g-g-features{gap:36px}
.imp-g-g-feature-name{font-size:14px}
.imp-g-g-feature-desc{font-size:12.5px;line-height:1.5}
.imp-g-g-cta{margin-top:24px;padding:26px 28px}
.imp-g-g-form--split{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.imp-g-g-form--split .imp-g-field--wide{grid-column:1 / -1}
.imp-g-g-toc-row{gap:12px;padding:11px 0}
.imp-g-g-toc-title{font-size:14px}
.imp-g-g-tiers{gap:12px}
}



/* ===== oferta-landing.html -> prefiks .imp-g, zakres .imp-g-ekran-oferta ===== */
.imp-g-ekran-oferta .imp-g-glow--a{top:40px;left:50%;transform:translateX(-50%);width:520px;height:520px;background:var(--glow-violet)}
.imp-g-ekran-oferta .imp-g-glow--b{bottom:-120px;left:-140px;width:420px;height:420px;background:var(--glow-lime)}
.imp-g-ekran-oferta .imp-g-figure--hand{top:150px;right:-90px;height:400px;width:auto}
.imp-g-ekran-oferta .imp-g-gfx--fluid-a,
.imp-g-ekran-oferta .imp-g-gfx--fluid-b{display:none}
@media (min-width:1024px){
.imp-g-ekran-oferta .imp-g-glow--a{top:-260px;right:-200px;left:auto;transform:none;width:820px;height:820px}
.imp-g-ekran-oferta .imp-g-glow--b{bottom:-220px;left:60px;width:600px;height:600px}
.imp-g-ekran-oferta .imp-g-figure--hand{display:none}
.imp-g-ekran-oferta .imp-g-g-scrim{display:none}
.imp-g-ekran-oferta .imp-g-gfx--fluid-a{display:block;position:absolute;top:-160px;right:-140px;width:700px;opacity:var(--gfx-fluid);z-index:0;pointer-events:none}
.imp-g-ekran-oferta .imp-g-gfx--fluid-b{display:block;position:absolute;bottom:-260px;left:-180px;width:620px;opacity:var(--gfx-fluid);z-index:0;pointer-events:none}
}

/* ===== oferta-konto.html -> prefiks .imp-g, zakres .imp-g-ekran-konto ===== */
.imp-g-ekran-konto .imp-g-glow--a{top:-40px;left:-120px;width:520px;height:520px;background:var(--glow-violet)}
.imp-g-ekran-konto .imp-g-glow--b{bottom:-160px;right:-140px;width:460px;height:460px;background:var(--glow-lime)}
.imp-g-ekran-konto .imp-g-gfx--qube{top:-20px;right:-40px;width:170px}
.imp-g-ekran-konto .imp-g-gfx--fluid-a,
.imp-g-ekran-konto .imp-g-gfx--fluid-b{display:none}
@media (min-width:1024px){
.imp-g-ekran-konto .imp-g-glow--a{top:-240px;right:-180px;left:auto;width:780px;height:780px}
.imp-g-ekran-konto .imp-g-gfx--qube{display:none}
.imp-g-ekran-konto .imp-g-g-scrim{display:none}
.imp-g-ekran-konto .imp-g-gfx--fluid-a{display:block;position:absolute;top:-140px;right:-130px;width:680px;opacity:var(--gfx-fluid);z-index:0;pointer-events:none}
.imp-g-ekran-konto .imp-g-gfx--fluid-b{display:block;position:absolute;bottom:-220px;left:-160px;width:600px;opacity:var(--gfx-fluid);z-index:0;pointer-events:none}
}

/* ===== oferta-platnosc.html -> prefiks .imp-g, zakres .imp-g-ekran-platnosc ===== */
.imp-g-ekran-platnosc .imp-g-glow--a{top:120px;left:50%;transform:translateX(-50%);width:480px;height:480px;background:var(--glow-violet)}
.imp-g-ekran-platnosc .imp-g-glow--b{bottom:-160px;right:-150px;width:460px;height:460px;background:var(--glow-lime)}
.imp-g-ekran-platnosc .imp-g-gfx--fluid-a,
.imp-g-ekran-platnosc .imp-g-gfx--fluid-b,
.imp-g-ekran-platnosc .imp-g-figure--ok{display:none}
@media (min-width:1024px){
.imp-g-ekran-platnosc .imp-g-glow--a{top:-240px;right:-180px;left:auto;transform:none;width:780px;height:780px}
.imp-g-ekran-platnosc .imp-g-gfx--fluid-a{display:block;position:absolute;top:-140px;right:-130px;width:680px;opacity:var(--gfx-fluid);z-index:0;pointer-events:none}
.imp-g-ekran-platnosc .imp-g-gfx--fluid-b{display:block;position:absolute;bottom:-220px;left:-160px;width:600px;opacity:var(--gfx-fluid);z-index:0;pointer-events:none}
.imp-g-ekran-platnosc .imp-g-figure--ok{display:block;position:static;width:250px;margin-top:24px;opacity:var(--gfx-hand,.72);filter:none}
}

/* ===== oferta-dziekujemy.html -> prefiks .imp-g, zakres .imp-g-ekran-dziekujemy ===== */
.imp-g-ekran-dziekujemy .imp-g-glow--a{top:80px;left:50%;transform:translateX(-50%);width:520px;height:520px;background:var(--glow-lime)}
.imp-g-ekran-dziekujemy .imp-g-glow--b{bottom:-160px;right:-150px;width:440px;height:440px;background:var(--glow-violet)}
.imp-g-ekran-dziekujemy .imp-g-figure--peace{top:110px;left:50%;transform:translateX(-46%);height:400px;width:auto}
.imp-g-ekran-dziekujemy .imp-g-gfx--fluid-a,
.imp-g-ekran-dziekujemy .imp-g-gfx--fluid-b,
.imp-g-ekran-dziekujemy .imp-g-figure--peace-desktop{display:none}
@media (min-width:1024px){
.imp-g-ekran-dziekujemy .imp-g-glow--a{top:-200px;width:900px;height:900px}
.imp-g-ekran-dziekujemy .imp-g-figure--peace,
.imp-g-ekran-dziekujemy .imp-g-g-scrim{display:none}
.imp-g-ekran-dziekujemy .imp-g-gfx--fluid-a{display:block;position:absolute;bottom:-240px;right:-160px;width:640px;opacity:var(--gfx-fluid);z-index:0;pointer-events:none}
.imp-g-ekran-dziekujemy .imp-g-gfx--fluid-b{display:block;position:absolute;top:-160px;left:-160px;width:560px;opacity:var(--gfx-fluid);z-index:0;pointer-events:none}
.imp-g-ekran-dziekujemy .imp-g-figure--peace-desktop{display:block;position:static;width:300px;align-self:center;opacity:var(--gfx-hand,.72);filter:none}
.imp-g-ekran-dziekujemy .imp-g-g-shell{justify-content:center}
}

/* ===== praca-1-1-landing.html -> prefiks .imp-g, zakres .imp-g-ekran-praca ===== */
.imp-g-ekran-praca .imp-g-glow--a{top:40px;left:50%;transform:translateX(-50%);width:520px;height:520px;background:var(--glow-violet)}
.imp-g-ekran-praca .imp-g-glow--b{bottom:-120px;left:-140px;width:420px;height:420px;background:var(--glow-lime)}
.imp-g-ekran-praca .imp-g-figure--hand{top:150px;right:-90px;height:400px;width:auto}
.imp-g-ekran-praca .imp-g-gfx--fluid-a,
.imp-g-ekran-praca .imp-g-gfx--fluid-b{display:none}
@media (min-width:1024px){
.imp-g-ekran-praca .imp-g-glow--a{top:-260px;right:-200px;left:auto;transform:none;width:820px;height:820px}
.imp-g-ekran-praca .imp-g-glow--b{bottom:-220px;left:60px;width:600px;height:600px}
.imp-g-ekran-praca .imp-g-figure--hand,
.imp-g-ekran-praca .imp-g-g-scrim{display:none}
.imp-g-ekran-praca .imp-g-gfx--fluid-a{display:block;position:absolute;top:-160px;right:-140px;width:700px;opacity:var(--gfx-fluid);z-index:0;pointer-events:none}
.imp-g-ekran-praca .imp-g-gfx--fluid-b{display:block;position:absolute;bottom:-260px;left:-180px;width:620px;opacity:var(--gfx-fluid);z-index:0;pointer-events:none}
}

/* ===== ebook-landing.html -> prefiks .imp-g, zakres .imp-g-ekran-ebook ===== */
.imp-g-ekran-ebook .imp-g-glow--a{top:40px;left:50%;transform:translateX(-50%);width:520px;height:520px;background:var(--glow-violet)}
.imp-g-ekran-ebook .imp-g-glow--b{bottom:-120px;left:-140px;width:420px;height:420px;background:var(--glow-lime)}
.imp-g-ekran-ebook .imp-g-figure--hand{top:150px;right:-90px;height:400px;width:auto}
.imp-g-ekran-ebook .imp-g-gfx--fluid-a,
.imp-g-ekran-ebook .imp-g-gfx--fluid-b{display:none}
@media (min-width:1024px){
.imp-g-ekran-ebook .imp-g-glow--a{top:-260px;right:-200px;left:auto;transform:none;width:820px;height:820px}
.imp-g-ekran-ebook .imp-g-glow--b{bottom:-220px;left:60px;width:600px;height:600px}
.imp-g-ekran-ebook .imp-g-figure--hand,
.imp-g-ekran-ebook .imp-g-g-scrim{display:none}
.imp-g-ekran-ebook .imp-g-gfx--fluid-a{display:block;position:absolute;top:-160px;right:-140px;width:700px;opacity:var(--gfx-fluid);z-index:0;pointer-events:none}
.imp-g-ekran-ebook .imp-g-gfx--fluid-b{display:block;position:absolute;bottom:-260px;left:-180px;width:620px;opacity:var(--gfx-fluid);z-index:0;pointer-events:none}
}

/* ===== ebook-dziekujemy.html -> prefiks .imp-g, zakres .imp-g-ekran-ebook-dziekujemy ===== */
.imp-g-ekran-ebook-dziekujemy .imp-g-glow--a{top:80px;left:50%;transform:translateX(-50%);width:520px;height:520px;background:var(--glow-lime)}
.imp-g-ekran-ebook-dziekujemy .imp-g-glow--b{bottom:-160px;right:-150px;width:440px;height:440px;background:var(--glow-violet)}
.imp-g-ekran-ebook-dziekujemy .imp-g-gfx--fluid-a,
.imp-g-ekran-ebook-dziekujemy .imp-g-gfx--fluid-b,
.imp-g-ekran-ebook-dziekujemy .imp-g-figure--peace-desktop{display:none}
@media (min-width:1024px){
.imp-g-ekran-ebook-dziekujemy .imp-g-glow--a{top:-200px;width:900px;height:900px}
.imp-g-ekran-ebook-dziekujemy .imp-g-gfx--fluid-a{display:block;position:absolute;bottom:-240px;right:-160px;width:640px;opacity:var(--gfx-fluid);z-index:0;pointer-events:none}
.imp-g-ekran-ebook-dziekujemy .imp-g-gfx--fluid-b{display:block;position:absolute;top:-160px;left:-160px;width:560px;opacity:var(--gfx-fluid);z-index:0;pointer-events:none}
.imp-g-ekran-ebook-dziekujemy .imp-g-figure--peace-desktop{display:block;position:static;width:240px;align-self:center;opacity:var(--gfx-hand,.72);filter:none}
.imp-g-ekran-ebook-dziekujemy .imp-g-g-shell{justify-content:center}
}


/* ---- PRZEKŁADY makieta -> żywa strona (Krok 2 instrukcji) ---------------- */

/* Skaczący pasek adresu w mobilnym Safari; overflow:clip obok hidden,
   żeby nie powstawał kontener przewijania. */
/* Stroną obszaru G jest .g-page (zewnętrzna), nie .g-shell (wewnętrzna).
   Pierwsza wersja celowała w powłokę i nie robiła nic. */
.imp-g-g-page{min-height:100vh;min-height:100dvh;overflow:hidden;overflow:clip}

/* Płynne przewijanie do sekcji pakietów po kliknięciu „Wybierz pakiet" —
   wyłączone u osób, które proszą o mniej ruchu. */
@media (prefers-reduced-motion:no-preference){
  .imp-g-ekran-praca{scroll-behavior:smooth}
}
.imp-g-ekran-praca [id^="pakiet"]{scroll-margin-top:90px}

/* Stany widoków chowa serwer atrybutem [hidden]. */
.imp-g [hidden]{display:none}

/* ---- Ekran płatności: sam formularz Stripe, bez karty (1 września 2026) ----
   Decyzja właściciela: osadzona ramka Stripe'a stoi wprost na tle strony.
   Karta z eksportu (`.g-stripe` — tło, obramowanie, pasek podsumowania)
   zniknęła z widoku, bo ramka wokół ramki zabierała szerokość, a kwotę
   i pozycję zamówienia pokazuje sam formularz w środku.

   Ramka sama zgłasza swoją wysokość, więc niczego jej nie przycinamy.
   Szerokość: to jedyny ekran, na którym użytkownik podaje dane płatnicze,
   więc kolumna formularza jest szersza niż kolumna z opisem — w szynie
   z eksportu (380 px) formularz robił się nieporęczny. */
.imp-g-ekran-platnosc #checkout{min-height:520px}

@media (min-width:1024px){
  .imp-g-ekran-platnosc .imp-g-g-lead-grid{
    grid-template-columns:minmax(0,0.85fr) minmax(520px,1fr);
    gap:36px;
  }

  /* Bez przewijania na desktopie (decyzja właściciela): własna oprawa
     ekranu schodzi do minimum, żeby wysokość strony wyznaczał wyłącznie
     formularz Stripe'a. Dotyczy tylko tego jednego ekranu. */
  .imp-g-ekran-platnosc .imp-g-g-shell{padding-top:16px;padding-bottom:16px}
  .imp-g-ekran-platnosc .imp-g-g-topbar{margin-bottom:14px}
  .imp-g-ekran-platnosc .imp-g-g-stepper{margin-bottom:14px}
  .imp-g-ekran-platnosc .imp-g-g-title{margin-top:8px}
  .imp-g-ekran-platnosc .imp-g-lead{margin-bottom:14px}
  .imp-g-ekran-platnosc .imp-g-g-figure{margin-top:14px;width:200px}
  .imp-g-ekran-platnosc .imp-g-g-secure{margin-top:10px}
  .imp-g-ekran-platnosc .imp-g-g-foot{margin-top:10px}
}

/* Etykiety wyboru na ekranie modułu — kolor akcentu zamiast szarego
   (właściciel, 1 września 2026: „za mało widoczne"). Token
   --eyebrow-color istnieje od pierwszego importu i sam pilnuje motywu:
   limonka na ciemnym, fiolet na jasnym. Odwrotnie niż w pierwszej
   prośbie właściciela — limonka jako tekst na jasnym tle jest
   nieczytelna, opis marki tego zabrania; właściciel wybrał wersję
   zgodną z kontrastem. */
.imp-c11-session-head .imp-c11-stat-label,
.imp-c11-session-label{color:var(--eyebrow-color)}

/* Ekrany wejścia na telefonie: karta formularza odklejona od krawędzi
   (właściciel, 1 września 2026 — „przyklejona do krawędzi ekranu po
   lewej i po prawej"). Eksport daje kolumnie formularza `padding:0`
   poniżej 1024 px, więc karta rozpychała się na całą szerokość.
   20 px to ten sam margines boczny, co na ekranach oferty
   (--g-shell-pad), żeby telefon miał jedną szerokość marginesu.
   Dotyczy wszystkich ekranów wejścia — logowania, rejestracji i obu
   kroków resetu hasła; wszystkie używają tego samego układu. */
@media (max-width:1023px){
  .imp-a-split-form{padding-left:20px;padding-right:20px}
}

/* Awatar w pasku górnym obszaru F — osobna reguła, bo `.imp-f-avatar`
   jest już zajęte przez awatary przy wiadomościach na liście i w wątku
   (mniejsze, inny kolor tła). Selektor z rodzicem `.imp-f-topbar-user`
   wygrywa specyficznością i dotyczy wyłącznie paska. */
.imp-f-topbar-user .imp-f-avatar{
  width:34px;height:34px;border-radius:var(--radius-pill);
  background:rgba(var(--violet-rgb),.12);
  display:grid;place-items:center;
  font:600 12px/1 var(--font-ui);color:var(--text-accent);
}

/* ===== styles.css -> prefiks .imp-h ===== */
.imp-h{--violet:#7000FF; --lime:#CBFF00; --on-violet:#FBFBFB; --on-lime:#1C1C1E;

  --bg:#1C1C1E;
  --rail-bg:#101011;
  --rail-border:rgba(251,251,251,.08);
  --rail-label:rgba(251,251,251,.5);
  --rail-item:rgba(251,251,251,.72);
  --rail-badge-bg:rgba(251,251,251,.1);
  --rail-avatar-bg:rgba(251,251,251,.12);

  --text:#FBFBFB;
  --text-muted:#C7C5CE;
  --text-meta:#9A97A0;
  --accent-text:#B98CFF;

  --surface:rgba(251,251,251,.05);
  --surface-2:rgba(251,251,251,.04);
  --surface-3:rgba(251,251,251,.06);
  --border:rgba(251,251,251,.13);
  --border-strong:rgba(251,251,251,.2);
  --border-input:rgba(251,251,251,.2);
  --hairline:rgba(251,251,251,.1);
  --row-sep:rgba(251,251,251,.08);
  --thead-bg:rgba(251,251,251,.04);

  --btn-ghost-bg:transparent;
  --btn-ghost-border:rgba(251,251,251,.16);
  --btn-ghost-text:#FBFBFB;

  --pos:#B7E86B; --neg:#FF8A80; --neg-border:rgba(255,138,128,.34);
  --tag-lime-bg:rgba(203,255,0,.18); --tag-lime-text:#CBFF00;
  --tag-violet-bg:rgba(112,0,255,.22); --tag-violet-text:#B98CFF;
  --tag-red-bg:rgba(255,138,128,.16); --tag-red-text:#FF8A80;
  --tag-neutral-bg:rgba(251,251,251,.1); --tag-neutral-text:#C7C5CE;
  --tag-empty-bg:rgba(251,251,251,.07);
  --nav-active-bg:rgba(203,255,0,.14); --nav-active-text:#CBFF00;

  --kpi-accent-bg:rgba(203,255,0,.08); --kpi-accent-border:rgba(203,255,0,.28);
  --kpi-accent-label:rgba(251,251,251,.5); --kpi-accent-num:#CBFF00;

  --row-selected:rgba(112,0,255,.14);
  --block-active-bg:rgba(112,0,255,.03);
  --block-active-ring:rgba(112,0,255,.08);
  --block-draft-border:rgba(251,251,251,.22);
  --block-draft-bg:rgba(251,251,251,.04);
  --bar-track:rgba(251,251,251,.1);
  --spark-idle:rgba(112,0,255,.2);
  --impact-bg:#1C1C1E; --impact-label:rgba(251,251,251,.5); --impact-text:rgba(251,251,251,.72);
  --step-violet-bg:rgba(112,0,255,.2);

  
  --scrim:rgba(0,0,0,.55);
  --glass-bg:rgba(28,28,30,.72);
  --glass-blur:24px;
  --glass-border:rgba(251,251,251,.14);
  --glass-shadow:-24px 0 60px rgba(0,0,0,.5);
  --glass-fallback-bg:#232326;

  
  --rail-w:224px; --aside-w:320px; --aside-w-wide:336px; --drawer-w:392px;
  --logo:56px; --grid-gap:12px; --pad-x:28px;

  --r-sm:5px; --r-md:8px; --r-lg:10px; --r-pill:20px; --r-btn:16px;
  --f-ui:'Inter',system-ui,-apple-system,sans-serif;
  --f-num:'VT323',monospace;
  --f-mono:ui-monospace,Menlo,Consolas,monospace;}
:where(.imp-h) html[data-theme="light"]{--bg:#FBFBFB;
  --rail-bg:#1C1C1E;              
  --rail-border:rgba(28,28,30,.08);
  --rail-label:rgba(251,251,251,.55);
  --rail-item:rgba(251,251,251,.72);
  --rail-badge-bg:rgba(251,251,251,.1);
  --rail-avatar-bg:rgba(251,251,251,.12);

  --text:#1C1C1E;
  --text-muted:#6B6870;
  --text-meta:#3A3740;
  --accent-text:#7000FF;

  --surface:#FFFFFF;
  --surface-2:rgba(28,28,30,.02);
  --surface-3:rgba(28,28,30,.04);
  --border:rgba(28,28,30,.1);
  --border-strong:rgba(28,28,30,.16);
  --border-input:rgba(28,28,30,.14);
  --hairline:rgba(28,28,30,.08);
  --row-sep:rgba(28,28,30,.05);
  --thead-bg:rgba(28,28,30,.025);

  --btn-ghost-bg:#FBFBFB;
  --btn-ghost-border:rgba(28,28,30,.14);
  --btn-ghost-text:#1C1C1E;

  --pos:#3D7524; --neg:#B03A2E; --neg-border:rgba(176,58,46,.34);
  --tag-lime-bg:rgba(203,255,0,.3); --tag-lime-text:#3F4A00;
  --tag-violet-bg:rgba(112,0,255,.1); --tag-violet-text:#7000FF;
  --tag-red-bg:rgba(176,58,46,.1); --tag-red-text:#B03A2E;
  --tag-neutral-bg:rgba(28,28,30,.06); --tag-neutral-text:#3A3740;
  --tag-empty-bg:rgba(28,28,30,.04);

  --kpi-accent-bg:#1C1C1E; --kpi-accent-border:rgba(28,28,30,.1);
  --kpi-accent-label:rgba(251,251,251,.5); --kpi-accent-num:#CBFF00;

  --row-selected:rgba(112,0,255,.06);
  --block-active-bg:rgba(112,0,255,.03);
  --block-active-ring:rgba(112,0,255,.08);
  --block-draft-border:rgba(28,28,30,.18);
  --block-draft-bg:rgba(28,28,30,.02);
  --bar-track:rgba(28,28,30,.08);
  --spark-idle:rgba(112,0,255,.18);
  --impact-bg:#1C1C1E; --impact-label:rgba(251,251,251,.5); --impact-text:rgba(251,251,251,.72);
  --step-violet-bg:rgba(112,0,255,.1);

  --scrim:rgba(28,28,30,.4);
  --glass-bg:rgba(251,251,251,.86);
  --glass-blur:20px;
  --glass-border:rgba(28,28,30,.12);
  --glass-shadow:-24px 0 60px rgba(28,28,30,.18);
  --glass-fallback-bg:#F2F1F4;}
:where(.imp-h), :where(.imp-h) *,:where(.imp-h) *::before,:where(.imp-h) *::after{box-sizing:border-box}
.imp-h{margin:0;padding:0}
.imp-h{background:var(--bg);color:var(--text);font:400 13px/1.45 var(--f-ui);-webkit-font-smoothing:antialiased;text-wrap:pretty}
:where(.imp-h) h1,:where(.imp-h) h2,:where(.imp-h) h3,:where(.imp-h) p{margin:0}
:where(.imp-h) button{font-family:inherit}
:where(.imp-h) img{max-width:100%}
:where(.imp-h) a{color:var(--accent-text);text-decoration:none}
:where(.imp-h) a:hover{color:var(--violet)}
:where(.imp-h) html[data-theme="light"] a:hover{color:#5200BF}
.imp-h-adm{display:flex;min-height:100vh;background:var(--bg);overflow:hidden}
.imp-h-adm-rail{flex:0 0 var(--rail-w);display:flex;flex-direction:column;background:var(--rail-bg);border-right:1px solid var(--rail-border);padding:22px 0}
.imp-h-adm-main{flex:1;display:flex;flex-direction:column;min-width:0}
.imp-h-adm-body{flex:1;display:grid;grid-template-columns:minmax(0,1fr) var(--aside-w);min-height:0}
.imp-h-adm-body--wide{grid-template-columns:minmax(0,1fr) var(--aside-w-wide)}
.imp-h-adm-col{padding:22px 24px 24px;display:flex;flex-direction:column;gap:20px;min-width:0;overflow:hidden}
.imp-h-adm-col--tight{padding:20px 24px;gap:var(--grid-gap)}
.imp-h-adm-aside{border-left:1px solid var(--hairline);background:var(--surface-2);padding:22px 20px;display:flex;flex-direction:column;gap:14px;min-width:0;overflow:hidden}
.imp-h-adm-aside--wide{padding:20px;gap:16px}
.imp-h-rail-brand{display:flex;align-items:center;gap:10px;padding:0 20px 22px}
.imp-h-rail-logo{flex:0 0 auto;width:var(--logo);height:var(--logo);object-fit:contain;display:block}
.imp-h-rail-brand span{font:400 12px/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--rail-item)}
.imp-h-rail-nav{display:flex;flex-direction:column;gap:2px;padding:0 12px}
.imp-h-rail-group{display:flex;flex-direction:column;gap:2px;padding:14px 12px 6px}
.imp-h-rail-group span{font:400 10.5px/1 var(--f-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--rail-label)}
.imp-h-nav-item{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;padding:9px 12px;border-radius:var(--r-md);font:400 13px/1 var(--f-ui);color:var(--rail-item);cursor:pointer;text-decoration:none;transition:background 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1)}
.imp-h-nav-item:hover{background:rgba(251,251,251,.07);color:#FBFBFB}
.imp-h-nav-item--active{justify-content:flex-start;background:var(--nav-active-bg);font-weight:600;color:var(--nav-active-text)}
.imp-h-nav-item--active:hover{background:var(--nav-active-bg);color:var(--nav-active-text)}
.imp-h-nav-dot{flex:0 0 auto;width:5px;height:5px;border-radius:50%;background:currentColor}
.imp-h-nav-badge{flex:0 0 auto;font:400 11px/1 var(--f-mono);padding:2px 6px;border-radius:var(--r-pill);background:var(--rail-badge-bg);color:var(--rail-item)}
.imp-h-nav-badge--violet{background:var(--violet);color:var(--on-violet)}
.imp-h-rail-user{margin-top:auto;padding:20px 20px 0;display:flex;align-items:center;gap:10px}
.imp-h-avatar{flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:var(--rail-avatar-bg);display:grid;place-items:center;font:600 11px/1 var(--f-ui);color:#FBFBFB;overflow:hidden;white-space:nowrap;text-overflow:clip}
.imp-h-rail-user-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.imp-h-rail-user-txt strong{font:600 12px/1 var(--f-ui);color:#FBFBFB;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-h-rail-user-txt a{font:400 10.5px/1 var(--f-ui);color:var(--rail-item)}
.imp-h-topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px var(--pad-x) 18px;border-bottom:1px solid var(--hairline)}
.imp-h-topbar--start{align-items:flex-start;padding-bottom:16px}
.imp-h-topbar-txt{display:flex;flex-direction:column;gap:4px;min-width:0}
.imp-h-topbar-txt--gap{gap:7px}
.imp-h-h-view{font:400 30px/1 var(--f-num);letter-spacing:.01em;color:var(--text)}
.imp-h-sub{font:400 12px/1.3 var(--f-ui);color:var(--text-muted)}
.imp-h-crumb{font:400 11.5px/1.3 var(--f-ui);color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-h-title-row{display:flex;align-items:baseline;flex-wrap:wrap;gap:12px}
.imp-h-actions{display:flex;flex:none;gap:8px}
.imp-h-btn{display:inline-flex;align-items:center;justify-content:center;min-height:38px;font:600 12.5px/1 var(--f-ui);padding:9px 14px;border-radius:var(--r-btn);border:0;cursor:pointer;transition:filter 150ms cubic-bezier(.4,0,.2,1),background 150ms cubic-bezier(.4,0,.2,1)}
.imp-h-btn--primary{background:var(--violet);color:var(--on-violet)}
.imp-h-btn--primary:hover{filter:brightness(1.12)}
.imp-h-btn--ghost{background:var(--btn-ghost-bg);border:1px solid var(--btn-ghost-border);color:var(--btn-ghost-text)}
.imp-h-btn--ghost:hover{border-color:var(--accent-text);color:var(--accent-text)}
.imp-h-btn--danger{background:transparent;border:1px solid var(--neg-border);color:var(--neg);padding:11px 14px}
.imp-h-btn--danger:hover{background:var(--tag-red-bg)}
.imp-h-btn--block{width:100%}
.imp-h-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--grid-gap)}
.imp-h-kpi{display:flex;flex-direction:column;padding:14px 16px;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);min-width:0;overflow:hidden}
.imp-h-kpi--accent{border-color:var(--kpi-accent-border);background:var(--kpi-accent-bg)}
.imp-h-kpi-label{font:400 10.5px/1 var(--f-ui);letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin-bottom:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-h-kpi--accent .imp-h-kpi-label{color:var(--kpi-accent-label)}
.imp-h-kpi-row{display:flex;align-items:baseline;gap:6px;min-width:0}
.imp-h-kpi-num{font:400 34px/1 var(--f-num);color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-h-kpi--accent .imp-h-kpi-num{color:var(--kpi-accent-num)}
.imp-h-kpi-delta{flex:none;font:600 11px/1 var(--f-ui)}
.imp-h-kpi-delta.imp-h-is-up{color:var(--pos)}
.imp-h-kpi-delta.imp-h-is-down{color:var(--neg)}
.imp-h-panel{display:block;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);overflow:hidden;min-width:0}
.imp-h-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 16px;border-bottom:1px solid var(--hairline)}
.imp-h-panel-title{font:600 13px/1 var(--f-ui);color:var(--text)}
.imp-h-panel-link{font:400 12px/1 var(--f-ui);color:var(--accent-text);cursor:pointer}
.imp-h-trow{display:grid;grid-template-columns:var(--cols);align-items:center;gap:8px;padding:11px 16px;border-bottom:1px solid var(--row-sep);font:400 12.5px/1.4 var(--f-ui);color:var(--text);min-width:0}
.imp-h-trow:last-child{border-bottom:0}
.imp-h-trow--head{padding:9px 16px;background:var(--thead-bg);border-bottom:1px solid var(--hairline);font:400 10.5px/1 var(--f-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.imp-h-trow > span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-h-trow--wrap > span{white-space:normal}
.imp-h-log{--cols:74px minmax(0,1fr) 168px 96px}
.imp-h-t-time{font:400 12px/1 var(--f-mono);color:var(--text-muted)}
.imp-h-t-muted{color:var(--text-muted)}
.imp-h-t-meta{color:var(--text-meta)}
.imp-h-tag{display:inline-block;flex:none;font:600 10.5px/1 var(--f-ui);padding:3px 7px;border-radius:var(--r-sm);white-space:nowrap}
.imp-h-tag--lime{background:var(--tag-lime-bg);color:var(--tag-lime-text)}
.imp-h-tag--violet{background:var(--tag-violet-bg);color:var(--tag-violet-text)}
.imp-h-tag--red{background:var(--tag-red-bg);color:var(--tag-red-text)}
.imp-h-tag--neutral{background:var(--tag-neutral-bg);color:var(--tag-neutral-text)}
.imp-h-tag--empty{background:var(--tag-empty-bg);color:var(--text-muted)}
.imp-h-tag--solid-lime{background:var(--lime);color:var(--on-lime)}
.imp-h-tag--solid-violet{background:var(--violet);color:var(--on-violet)}
.imp-h-dots{font:400 13px/1 var(--f-ui);color:var(--text-muted);cursor:pointer}
.imp-h-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--grid-gap)}
.imp-h-card{display:flex;flex-direction:column;padding:15px 16px;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);min-width:0;overflow:hidden}
.imp-h-card-title{font:600 12.5px/1 var(--f-ui);color:var(--text);margin-bottom:12px}
.imp-h-bars{display:flex;flex-direction:column;gap:9px}
.imp-h-bar-row{display:flex;align-items:center;gap:10px}
.imp-h-bar-row > b{flex:none;width:52px;font:400 11.5px/1 var(--f-ui);font-weight:400;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-h-bar-track{flex:1;min-width:0;height:7px;border-radius:4px;background:var(--bar-track);overflow:hidden}
.imp-h-bar-fill{display:block;height:100%;background:var(--violet)}
.imp-h-bar-fill--lime{background:var(--lime)}
.imp-h-bar-fill--violet{background:var(--accent-text)}
.imp-h-bar-fill--red{background:var(--neg)}
.imp-h-bar-val{flex:none;width:38px;text-align:right;font:400 11.5px/1 var(--f-mono);color:var(--text-muted)}
.imp-h-spark{display:flex;align-items:flex-end;gap:5px;height:78px}
.imp-h-spark > span{flex:1;min-width:0;background:var(--spark-idle);border-radius:3px 3px 0 0}
.imp-h-spark > span.imp-h-is-now{background:var(--violet)}
.imp-h-spark-legend{display:flex;justify-content:space-between;gap:8px;margin-top:8px;font:400 10.5px/1 var(--f-ui);color:var(--text-muted)}
.imp-h-queue{display:flex;flex-direction:column;gap:8px}
.imp-h-queue-card{display:flex;flex-direction:column;gap:6px;padding:12px 13px;border:1px solid var(--border);border-radius:9px;background:var(--surface);min-width:0}
.imp-h-queue-head{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.imp-h-queue-head strong{font:600 12.5px/1 var(--f-ui);color:var(--text);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-h-queue-head time{flex:none;font:400 11px/1 var(--f-mono);color:var(--text-muted)}
.imp-h-queue-card p{font:400 12px/1.5 var(--f-ui);color:var(--text-muted)}
.imp-h-queue-card a{font:600 10.5px/1 var(--f-ui)}
.imp-h-aside-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.imp-h-aside-title{font:600 13px/1 var(--f-ui);color:var(--text)}
.imp-h-badge-count{flex:none;font:600 10.5px/1 var(--f-ui);padding:4px 7px;border-radius:var(--r-pill);background:var(--violet);color:var(--on-violet)}
.imp-h-aside-sep{margin-top:6px;padding-top:14px;border-top:1px solid var(--hairline);display:flex;flex-direction:column;gap:9px}
.imp-h-eyebrow{font:400 10.5px/1 var(--f-ui);letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}
.imp-h-decision{display:flex;align-items:flex-start;gap:9px;font:400 12.5px/1.4 var(--f-ui);color:var(--text)}
.imp-h-dot{flex:0 0 auto;width:5px;height:5px;border-radius:50%;margin-top:6px}
.imp-h-dot--red{background:var(--neg)}
.imp-h-dot--violet{background:var(--violet)}
.imp-h-filters{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:14px var(--pad-x);border-bottom:1px solid var(--hairline)}
.imp-h-search{flex:1 1 200px;max-width:280px;min-width:0;display:flex;align-items:center;gap:8px;min-height:38px;padding:8px 11px;border:1px solid var(--border-strong);border-radius:var(--r-md);background:var(--surface);font:400 12px/1 var(--f-ui);color:var(--text-muted)}
.imp-h-chips{display:flex;flex-wrap:wrap;gap:6px}
.imp-h-chip{display:inline-flex;align-items:center;min-height:32px;font:400 11.5px/1 var(--f-ui);padding:7px 11px;border-radius:var(--r-pill);border:1px solid var(--border-strong);color:var(--text-muted);cursor:pointer}
.imp-h-chip:hover{border-color:var(--accent-text);color:var(--accent-text)}
.imp-h-chip--active{background:var(--lime);border-color:var(--lime);color:var(--on-lime);font-weight:600}
.imp-h-chip--active:hover{background:var(--lime);border-color:var(--lime);color:var(--on-lime)}
.imp-h-sort{margin-left:auto;flex:none;font:400 11.5px/1 var(--f-ui);color:var(--text-muted)}
.imp-h-utbl{flex:1;display:flex;flex-direction:column;padding:0 var(--pad-x);min-height:0;overflow:hidden}
.imp-h-urow{display:grid;grid-template-columns:var(--cols);align-items:center;gap:8px;padding:12px 0;border-bottom:1px solid var(--row-sep);font:400 12.5px/1.35 var(--f-ui);color:var(--text);min-width:0}
.imp-h-urow{--cols:26px minmax(0,1.5fr) 88px minmax(0,1fr) 132px 108px 60px}
.imp-h-urow--head{padding:12px 0;border-bottom:1px solid var(--border);font:400 10.5px/1 var(--f-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.imp-h-urow--selected{background:var(--row-selected);box-shadow:0 0 0 1px transparent}
.imp-h-urow--dim{color:var(--text-muted)}
.imp-h-urow > span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-h-cell-user{display:flex;flex-direction:column;gap:3px;min-width:0}
.imp-h-cell-user strong{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-h-cell-user span{font:400 11.5px/1.2 var(--f-ui);color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-h-cbx{flex:none;width:14px;height:14px;border-radius:4px;border:1px solid var(--border-input);display:block}
.imp-h-cbx--on{background:var(--accent-text);border-color:var(--accent-text)}
.imp-h-mono{font:400 12px/1 var(--f-mono);color:var(--text-muted)}
.imp-h-bulkbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:16px 0}
.imp-h-bulkbar > span{font:400 11.5px/1.4 var(--f-ui);color:var(--text-muted)}
.imp-h-bulk-act{font-weight:600;color:var(--accent-text);cursor:pointer}
.imp-h-bulk-act--danger{font-weight:600;color:var(--neg);cursor:pointer}
.imp-h-pager{display:flex;align-items:center;gap:6px;font:400 11.5px/1 var(--f-ui);color:var(--text-muted)}
.imp-h-pg{display:inline-flex;align-items:center;justify-content:center;min-width:32px;min-height:32px;padding:6px 10px;border-radius:7px;cursor:pointer}
.imp-h-pg--edge{border:1px solid var(--border-strong)}
.imp-h-pg--on{background:var(--lime);color:var(--on-lime);font-weight:600}
.imp-h-pg:hover:not(.imp-h-pg--on){color:var(--accent-text)}
.imp-h-scrim{position:absolute;inset:0;background:var(--scrim);pointer-events:none}
.imp-h-drawer{position:absolute;top:0;right:0;bottom:0;width:var(--drawer-w);max-width:100%;display:flex;flex-direction:column;background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur)) saturate(1.4);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(1.4);border-left:1px solid var(--glass-border);box-shadow:var(--glass-shadow);overflow:hidden}
.imp-h-drawer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:24px 24px 18px;border-bottom:1px solid var(--hairline)}
.imp-h-drawer-eyebrow{font:400 10.5px/1 var(--f-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--accent-text)}
.imp-h-drawer-title{font:400 26px/1 var(--f-num);color:var(--text);margin-top:5px}
.imp-h-drawer-close{flex:none;display:grid;place-items:center;width:44px;height:44px;margin:-11px -11px 0 0;font:400 18px/1 var(--f-ui);color:var(--text-muted);background:none;border:0;cursor:pointer}
.imp-h-drawer-body{flex:1;padding:20px 24px;display:flex;flex-direction:column;gap:16px;overflow:auto;min-height:0}
.imp-h-drawer-foot{padding:16px 24px 22px;border-top:1px solid var(--hairline);display:flex;gap:8px}
.imp-h-drawer-foot .imp-h-btn{min-height:44px;padding:13px 0}
.imp-h-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.imp-h-label{font:600 11.5px/1 var(--f-ui);color:var(--text-muted)}
.imp-h-input{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:42px;padding:11px 12px;border:1px solid var(--border-input);border-radius:9px;background:var(--surface);font:400 13px/1.3 var(--f-ui);color:var(--text);min-width:0}
.imp-h-input > span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-h-input--mono{font:400 13px/1 var(--f-mono)}
.imp-h-input--area{align-items:flex-start;min-height:52px;font:400 12.5px/1.5 var(--f-ui);color:var(--text-muted)}
.imp-h-hint{font:400 11px/1.4 var(--f-ui);color:var(--text-muted)}
.imp-h-seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.imp-h-seg-item{display:grid;place-items:center;min-height:38px;padding:9px 0;border-radius:var(--r-md);border:1px solid var(--border-input);background:var(--surface);font:600 12px/1 var(--f-ui);color:var(--text-muted);cursor:pointer}
.imp-h-seg-item--on{border-color:var(--violet);background:var(--violet);color:var(--on-violet)}
.imp-h-date-row{display:flex;gap:6px}
.imp-h-date-row .imp-h-input{flex:1}
.imp-h-date-add{flex:none;display:grid;place-items:center;padding:11px 12px;border-radius:9px;background:var(--step-violet-bg);font:600 12px/1 var(--f-ui);color:var(--accent-text);cursor:pointer}
.imp-h-check-row{display:flex;align-items:flex-start;gap:9px;padding:12px 13px;border-radius:9px;background:var(--surface-3)}
.imp-h-check-box{flex:0 0 auto;width:16px;height:16px;border-radius:4px;background:var(--on-lime);display:grid;place-items:center;font:600 10px/1 var(--f-ui);color:var(--lime)}
.imp-h-check-row span:last-child{font:400 12px/1.45 var(--f-ui);color:var(--text-muted)}
.imp-h-tabs{display:flex;flex-wrap:wrap;gap:2px;padding:0 var(--pad-x);border-bottom:1px solid var(--hairline)}
.imp-h-tab{display:inline-flex;align-items:center;min-height:44px;padding:12px 14px;font:400 12.5px/1 var(--f-ui);color:var(--text-muted);cursor:pointer}
.imp-h-tab:hover{color:var(--text)}
.imp-h-tab--on{font-weight:600;color:var(--text);box-shadow:inset 0 -2px 0 var(--violet)}
.imp-h-tabs-meta{margin-left:auto;display:flex;align-items:center;padding:12px 0;font:400 11.5px/1 var(--f-ui);color:var(--text-muted)}
.imp-h-col-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.imp-h-block{display:flex;align-items:flex-start;gap:12px;padding:14px 15px;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);min-width:0}
.imp-h-block--active{border-color:var(--violet);background:var(--block-active-bg);box-shadow:0 0 0 3px var(--block-active-ring)}
.imp-h-block--draft{border-style:dashed;border-color:var(--block-draft-border);background:var(--block-draft-bg)}
.imp-h-grip{flex:none;font:400 14px/1.2 var(--f-ui);color:var(--text-muted);cursor:grab}
.imp-h-block--active .imp-h-grip{color:var(--accent-text)}
.imp-h-block-num{flex:none;width:22px;font:400 22px/1 var(--f-num);color:var(--accent-text)}
.imp-h-block--draft .imp-h-block-num{color:var(--text-muted)}
.imp-h-block-body{flex:1;display:flex;flex-direction:column;gap:5px;min-width:0}
.imp-h-block-body--open{gap:9px}
.imp-h-block-line{display:flex;align-items:center;flex-wrap:wrap;gap:8px;min-width:0}
.imp-h-block-line strong{font:600 13px/1.3 var(--f-ui);color:var(--text);min-width:0}
.imp-h-block-note{font:400 12px/1.45 var(--f-ui);color:var(--text-muted)}
.imp-h-block-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.imp-h-field--sm{gap:5px}
.imp-h-field--sm .imp-h-label{font-size:11px}
.imp-h-field--sm .imp-h-input{min-height:36px;padding:9px 11px;border-radius:var(--r-md);font:400 12.5px/1 var(--f-mono)}
.imp-h-input--text{min-height:auto;padding:10px 11px;border-radius:var(--r-md);font:400 12.5px/1.5 var(--f-ui);color:var(--text-muted);align-items:flex-start}
.imp-h-rules{display:flex;flex-direction:column;gap:10px;padding:14px 15px;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface)}
.imp-h-impact{display:flex;flex-direction:column;gap:8px;padding:14px 15px;border-radius:var(--r-lg);background:var(--impact-bg)}
.imp-h-impact .imp-h-eyebrow{color:var(--impact-label)}
.imp-h-impact-num{font:400 30px/1 var(--f-num);color:var(--lime)}
.imp-h-impact p{font:400 12px/1.5 var(--f-ui);color:var(--impact-text)}
.imp-h-versions{display:flex;flex-direction:column;gap:9px;padding-top:16px;border-top:1px solid var(--hairline)}
.imp-h-version{display:flex;flex-direction:column;gap:2px;min-width:0}
.imp-h-version strong{font:600 12px/1.3 var(--f-ui);color:var(--text)}
.imp-h-version span{font:400 11.5px/1.4 var(--f-ui);color:var(--text-muted)}
.imp-h-version--old strong{color:var(--text-muted)}
.imp-h-push-bottom{margin-top:auto}
@media (max-width:1023px){
.imp-h-only-desktop{display:none!important}
}
@media (min-width:1024px){
.imp-h-only-mobile{display:none!important}
}
@media (max-width:1023px){
.imp-h-adm{flex-direction:column}
.imp-h-adm-rail{flex:none;width:100%;border-right:0;border-bottom:1px solid var(--rail-border);padding:14px 0}
.imp-h-rail-brand{padding:0 16px 12px}
.imp-h-rail-nav{flex-direction:row;overflow-x:auto;padding:0 12px;gap:6px}
.imp-h-rail-group{display:none}
.imp-h-nav-item{flex:none;white-space:nowrap}
.imp-h-rail-user{margin-top:0;padding:12px 16px 0}
.imp-h-adm-body,.imp-h-adm-body--wide{grid-template-columns:minmax(0,1fr)}
.imp-h-adm-aside{border-left:0;border-top:1px solid var(--hairline)}
.imp-h-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.imp-h-duo,.imp-h-block-grid{grid-template-columns:minmax(0,1fr)}
.imp-h-log{--cols:64px minmax(0,1fr) 88px}
.imp-h-log > span:nth-child(3),.imp-h-trow > span:nth-child(3){display:none}
.imp-h-urow{--cols:26px minmax(0,1fr) 88px 108px}
.imp-h-urow > span:nth-child(4),.imp-h-urow > span:nth-child(5),.imp-h-urow > span:nth-child(7){display:none}
.imp-h-drawer{width:100%}
.imp-h-topbar{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){
:where(.imp-h), :where(.imp-h) *,:where(.imp-h) *::before,:where(.imp-h) *::after{animation:none!important;transition:none!important}
}
@media (prefers-reduced-transparency:reduce){
.imp-h-drawer{background:var(--glass-fallback-bg);backdrop-filter:none;-webkit-backdrop-filter:none}
}
@media print{
.imp-h-adm{min-height:auto}
.imp-h-drawer{position:static;width:100%;background:var(--glass-fallback-bg);backdrop-filter:none}
.imp-h-scrim{display:none}
}

/* ---- Obszar H, krok 2: elementy spoza eksportu (2 września 2026) ----
   Eksport pokrywa oprawę, KPI, dziennik, słupki i tabelę. Właściciel
   zamówił dodatkowo: histogram trudności ze strefami statusów, lejek
   programu, kartę DTC, belkę onboardingu, dymki z dokładnymi liczbami
   i globalny przełącznik zakresu. Wartości wzorowane na tokenach
   eksportu (--surface, --border, --lime, --violet). */

/* Treść starych sekcji admina w nowej oprawie — przewijana kolumna
   z paddingiem; nowe widoki H mają własne topbar/adm-body i tego
   wrappera nie dostają. */
.imp-h-tresc{flex:1;min-width:0;overflow:auto;padding:24px 28px}

/* Przełącznik zakresu — zwykłe odnośniki GET, aktywny podświetlony. */
.imp-h-zakres{display:flex;gap:4px;align-items:center;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:3px}
.imp-h-zakres a{display:flex;align-items:center;padding:7px 12px;border-radius:8px;font:600 12px/1 var(--font-ui,'Inter',sans-serif);color:var(--text-muted);text-decoration:none}
.imp-h-zakres a.imp-h-zakres--on{background:var(--violet);color:var(--on-violet)}

/* Dymek z dokładną liczbą — czysty CSS, treść w data-dymek. Działa też
   z klawiatury (tabindex=0 + :focus-visible). */
[data-dymek]{position:relative;cursor:default}
[data-dymek]:hover::after,[data-dymek]:focus-visible::after{content:attr(data-dymek);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);white-space:pre;background:#0B0B0C;color:#FBFBFB;border:1px solid var(--border-strong,rgba(251,251,251,.2));border-radius:8px;padding:6px 10px;font:400 11.5px/1.45 var(--font-ui,'Inter',sans-serif);z-index:20;pointer-events:none}

/* Histogram trudności: 10 kolumn na tle trzech stref statusów. */
.imp-h-histo{display:flex;flex-direction:column;gap:8px}
.imp-h-histo-strefy{display:grid;grid-template-columns:repeat(10,1fr);gap:6px;align-items:end;height:130px;padding:8px 8px 0;border-radius:10px;background:linear-gradient(to right,rgba(203,255,0,.06) 0 30%,rgba(112,0,255,.08) 30% 70%,rgba(255,90,90,.07) 70% 100%)}
.imp-h-histo-slupek{display:flex;align-items:flex-end;justify-content:center;height:100%}
.imp-h-histo-slupek i{display:block;width:100%;min-height:2px;border-radius:4px 4px 0 0;background:var(--text-meta)}
.imp-h-histo-slupek--lime i{background:var(--lime)}
.imp-h-histo-slupek--violet i{background:#A46CFF}
.imp-h-histo-slupek--red i{background:#FF7A93}
.imp-h-histo-os{display:grid;grid-template-columns:repeat(10,1fr);gap:6px;padding:0 8px;font:400 10.5px/1 var(--font-ui,'Inter',sans-serif);color:var(--text-meta);text-align:center}
.imp-h-histo-strefy-podpis{display:grid;grid-template-columns:3fr 4fr 3fr;padding:0 8px;font:600 10.5px/1.2 var(--font-ui,'Inter',sans-serif);letter-spacing:.08em;text-transform:uppercase}
.imp-h-histo-strefy-podpis span:nth-child(1){color:var(--lime)}
.imp-h-histo-strefy-podpis span:nth-child(2){color:#A46CFF;text-align:center}
.imp-h-histo-strefy-podpis span:nth-child(3){color:#FF7A93;text-align:right}
.imp-h-histo-filtry{display:flex;gap:6px;flex-wrap:wrap}

/* Lejek: poziome belki malejącej szerokości + ubytek między nimi. */
.imp-h-lejek{display:flex;flex-direction:column;gap:4px}
.imp-h-lejek-krok{display:flex;align-items:center;gap:10px}
.imp-h-lejek-belka{height:34px;min-width:36px;border-radius:8px;background:linear-gradient(90deg,rgba(112,0,255,.85),rgba(112,0,255,.45));display:flex;align-items:center;padding:0 12px;font:700 13px/1 var(--font-ui,'Inter',sans-serif);color:#FBFBFB;white-space:nowrap}
.imp-h-lejek-nazwa{flex:none;width:150px;font:600 12px/1.3 var(--font-ui,'Inter',sans-serif);color:var(--text-muted)}
.imp-h-lejek-ubytek{padding-left:160px;font:400 11.5px/1 var(--font-ui,'Inter',sans-serif);color:var(--text-meta)}

/* Karta DTC: para liczb ze strzałką. */
.imp-h-dtc{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.imp-h-dtc b{font:400 34px/1 'VT323',monospace;color:var(--text)}
.imp-h-dtc-strzalka{font:400 22px/1 var(--font-ui,'Inter',sans-serif);color:var(--text-meta)}
.imp-h-dtc-delta{font:700 13px/1 var(--font-ui,'Inter',sans-serif);color:var(--lime)}
.imp-h-dtc-nota{font:400 11.5px/1.5 var(--font-ui,'Inter',sans-serif);color:var(--text-meta)}

/* Onboarding: belka dzielona na segmenty. */
.imp-h-onb{display:flex;height:26px;border-radius:8px;overflow:hidden;border:1px solid var(--border)}
.imp-h-onb span{display:flex;align-items:center;justify-content:center;font:700 11px/1 var(--font-ui,'Inter',sans-serif);min-width:0}
.imp-h-onb-weszli{background:rgba(203,255,0,.85);color:#1C1C1E}
.imp-h-onb-czeka{background:var(--surface-3);color:var(--text-muted)}

/* Postęp w tabeli użytkowników. */
.imp-h-postep{display:flex;align-items:center;gap:8px;min-width:120px}
.imp-h-postep-tor{flex:1;height:5px;border-radius:99px;background:var(--surface-3);overflow:hidden}
.imp-h-postep-tor i{display:block;height:100%;border-radius:99px;background:var(--lime)}
.imp-h-postep b{font:600 11.5px/1 var(--font-ui,'Inter',sans-serif);color:var(--text-muted);white-space:nowrap}

/* Chipy filtrów jako odnośniki GET (eksport miał je jako atrapy). */
.imp-h-chips a{text-decoration:none}

/* Oprawa szyny H w aplikacji: logo klikalne (reguła „logo prowadzi
   dalej" — tu na pulpit admina) i wylogowanie jako przycisk formularza
   POST z CSRF zamiast atrapy <a> z eksportu. */
.imp-h-rail-logo-link{display:flex;flex:none;text-decoration:none}
.imp-h-rail-user-txt form{margin:0}
.imp-h-rail-wyloguj{background:none;border:0;padding:0;cursor:pointer;font:400 10.5px/1 var(--f-ui);color:var(--rail-item);text-decoration:underline;text-underline-offset:2px}

/* Wyszukiwarka listy użytkowników jako realny input (eksport miał
   atrapę-span) — dziedziczy wygląd .imp-h-search, dostaje kolor tekstu. */
input.imp-h-search{width:100%;color:var(--text);outline:none}
input.imp-h-search::placeholder{color:var(--text-muted)}

/* ---- Obszar H, poprawki po klikaniu właściciela (2 września 2026) ---- */

/* Kalendarz dowolnego zakresu obok presetów. */
.imp-h-kalendarz{display:flex;align-items:center;gap:6px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:3px 6px;font:600 12px/1 var(--f-ui);color:var(--text-muted)}
.imp-h-kalendarz--on{border-color:var(--violet)}
.imp-h-kalendarz input[type="date"]{background:transparent;border:0;color:var(--text);font:600 12px/1 var(--f-ui);padding:6px 2px;color-scheme:dark}
.imp-h-kalendarz button{background:var(--violet);color:var(--on-violet);border:0;border-radius:8px;padding:7px 12px;font:600 12px/1 var(--f-ui);cursor:pointer}

/* Widoczny podpis pod liczbą KPI — dymek trzyma pełną definicję. */
.imp-h-kpi-hint{display:block;margin-top:6px;font:400 10.5px/1.35 var(--f-ui);color:var(--text-meta)}

/* Dziennik: stała wysokość karty, historia przewijana w środku. */
.imp-h-log-przewijany{max-height:340px;overflow-y:auto;overscroll-behavior:contain}

/* Lejek 2: centrowane trapezy. Nazwa kroku nad segmentem, liczba i
   procent w środku, ubytek między krokami. Ostatni krok limonkowy —
   dotarcie do celu programu. */
.imp-h-lejek2{display:flex;flex-direction:column;gap:3px}
.imp-h-lejek2-nazwa{text-align:center;font:600 10.5px/1.2 var(--f-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-top:2px}
.imp-h-lejek2-seg{height:42px;display:flex;align-items:center;justify-content:center;gap:10px;background:linear-gradient(180deg,#8A2BFF,#5B00CF);color:#FBFBFB}
.imp-h-lejek2-seg b{font:400 20px/1 'VT323',monospace}
.imp-h-lejek2-seg i{font:600 11px/1 var(--f-ui);font-style:normal;opacity:.75}
.imp-h-lejek2-seg--final{background:linear-gradient(180deg,var(--lime),#A8D400);color:#1C1C1E}
.imp-h-lejek2-seg--final i{opacity:.65}
.imp-h-lejek2-drop{text-align:center;font:400 11px/1 var(--f-ui);color:var(--text-meta);padding:3px 0 1px}

/* Wiadomości w adminie — dwupanelowo (2 września 2026). Komponenty
   wierszy i dymków z obszaru F; ta siatka tylko je rozstawia w kadrze
   panelu admina. Obie kolumny przewijają się niezależnie. */
.imp-h-msgs{flex:1;min-height:0;display:grid;grid-template-columns:360px minmax(0,1fr);gap:0;border-top:1px solid var(--hairline,rgba(251,251,251,.1))}
.imp-h-msgs-lista{min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding:16px;border-right:1px solid var(--hairline,rgba(251,251,251,.1))}
.imp-h-msgs-panel{min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:14px;padding:18px 22px}
.imp-h-msgs-dymki{flex:1}
.imp-h-msgs-status select{background:rgba(251,251,251,.06);border:1px solid rgba(251,251,251,.2);border-radius:10px;color:inherit;font:600 12px/1 'Inter',sans-serif;padding:8px 10px}
.imp-h-msgs-kontekst{border:1px solid rgba(251,251,251,.12);border-radius:12px;padding:10px 14px;font:400 12px/1.5 'Inter',sans-serif;color:inherit}
.imp-h-msgs-kontekst summary{cursor:pointer;font-weight:600}
.imp-h-msgs-kontekst p{margin:6px 0 0;opacity:.75}
@media (max-width:1023px){
  .imp-h-msgs{grid-template-columns:1fr}
  .imp-h-msgs-lista{border-right:0;border-bottom:1px solid rgba(251,251,251,.1)}
}