/* TrainMesh webfonts – ÖNÁLLÓAN KISZOLGÁLVA (nem a Google CDN-ről).
   A fájlok a frontend/public/fonts/ alatt vannak, így a böngésző saját
   originről tölti őket: nincs harmadik felet érintő kérés (GDPR),
   nincs külső DNS/TLS kézfogás a kritikus úton, és a CSP font-src
   maradhat 'self'.

   Barlow / Barlow Condensed / JetBrains Mono – Google Fonts (OFL 1.1),
   latin + latin-ext subset (a magyar ő/ű a latin-ext-ben van).
   Csere igazi brand fontokra: a fájlokat és az alábbi szabályokat kell
   lecserélni, az alkalmazás a --font-display/--font-ui/--font-mono
   tokeneken keresztül hivatkozik rájuk (tokens/typography).
*/

@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/barlow-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/barlow-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/barlow-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/barlow-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/barlow-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/barlow-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/barlow-700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/barlow-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/barlow-condensed-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/barlow-condensed-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/barlow-condensed-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/barlow-condensed-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/barlow-condensed-700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/barlow-condensed-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/fonts/barlow-condensed-800-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/fonts/barlow-condensed-800-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root{
/* --- Neutrals: dark-first "ink" ramp (the product is a dark UI) --- */
--ink-1000:#040608;--ink-900:#070A0D;--ink-800:#0C1014;--ink-700:#141A20;--ink-600:#1C242C;
--ink-500:#2A343E;--ink-400:#3B4854;--ink-300:#6B7A88;--ink-200:#A3B1BD;--ink-100:#D7DEE4;--ink-050:#EDF1F4;--ink-000:#FFFFFF;

/* --- Brand: Volt (primary energy accent) --- */
--volt-600:#A8D520;--volt-500:#C8F53B;--volt-400:#D6FF5C;--volt-300:#E4FF95;
--volt-a24:rgba(200,245,59,.24);--volt-a12:rgba(200,245,59,.12);--volt-a06:rgba(200,245,59,.06);

/* --- Brand: Ice (secondary, data + links) --- */
--ice-600:#17AEBB;--ice-500:#2FD8E5;--ice-400:#68E7F1;
--ice-a16:rgba(47,216,229,.16);

/* --- Brand: Ember (heat, boost, Olimpikon) --- */
--ember-600:#E63F14;--ember-500:#FF5A2D;--ember-400:#FF8560;
--ember-a16:rgba(255,90,45,.16);

/* --- Brand: Gold (verified, premium tier) --- */
--gold-600:#D8A521;--gold-500:#F5C542;--gold-400:#FFDC7A;
--gold-a16:rgba(245,197,66,.16);

/* --- Feedback --- */
--green-500:#35D07F;--green-a16:rgba(53,208,127,.16);
--red-500:#FF4D5E;--red-600:#E12B3D;--red-a16:rgba(255,77,94,.16);

/* --- Fixed overlays --- */
--scrim-60:rgba(4,6,8,.6);--scrim-80:rgba(4,6,8,.82);
--protect-bottom:linear-gradient(to top,rgba(4,6,8,.94) 0%,rgba(4,6,8,.72) 38%,rgba(4,6,8,0) 100%);/* @kind color */
--protect-top:linear-gradient(to bottom,rgba(4,6,8,.85) 0%,rgba(4,6,8,0) 100%);/* @kind color */
}

:root{
--font-display:"Barlow Condensed","Arial Narrow",Helvetica,sans-serif;
--font-ui:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
--font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

--fw-regular:400;/* @kind font */
--fw-medium:500;/* @kind font */
--fw-semibold:600;/* @kind font */
--fw-bold:700;/* @kind font */
--fw-black:800;/* @kind font */

/* display — condensed, uppercase, tight */
--fs-display-xl:76px;--lh-display-xl:.88;/* @kind font */
--fs-display-l:56px;--lh-display-l:.9;/* @kind font */
--fs-display-m:40px;--lh-display-m:.94;/* @kind font */
--fs-display-s:30px;--lh-display-s:1;/* @kind font */

/* titles — condensed */
--fs-title-l:24px;--lh-title-l:1.08;/* @kind font */
--fs-title-m:20px;--lh-title-m:1.12;/* @kind font */
--fs-title-s:17px;--lh-title-s:1.2;/* @kind font */

/* body — Barlow */
--fs-body-l:17px;--lh-body-l:1.5;/* @kind font */
--fs-body-m:15px;--lh-body-m:1.5;/* @kind font */
--fs-body-s:13px;--lh-body-s:1.45;/* @kind font */

/* labels + data */
--fs-label:12px;--lh-label:1.1;/* @kind font */
--ls-label:.09em;/* @kind font */
--fs-micro:11px;--lh-micro:1.1;/* @kind font */
--ls-micro:.06em;/* @kind font */
--fs-stat:22px;--lh-stat:1;/* @kind font */

--ls-display:-.015em;/* @kind font */
--ls-title:0em;/* @kind font */
--ls-body:0em;/* @kind font */
}

:root{
--sp-0:0px;--sp-1:2px;--sp-2:4px;--sp-3:6px;--sp-4:8px;--sp-5:12px;--sp-6:16px;
--sp-7:20px;--sp-8:24px;--sp-9:32px;--sp-10:40px;--sp-11:48px;--sp-12:64px;--sp-13:80px;--sp-14:120px;

/* layout */
--gutter-mobile:16px;--gutter-web:32px;
--maxw-content:1240px;--maxw-prose:66ch;/* @kind spacing */
--tabbar-h:58px;--appbar-h:56px;--web-nav-h:64px;
--touch-min:44px;
}

:root{
--r-0:0px;--r-xs:2px;--r-s:4px;--r-m:8px;--r-l:14px;--r-xl:20px;--r-2xl:28px;--r-pill:999px;
--r-button:4px;--r-input:6px;--r-card:14px;--r-sheet:20px;--r-media:10px;--r-chip:999px;
--bw-hair:1px;/* @kind spacing */
--bw-strong:2px;/* @kind spacing */
--bw-accent:3px;/* @kind spacing */
}

:root{
--shadow-0:none;/* @kind shadow */
--shadow-1:0 1px 2px rgba(0,0,0,.5);
--shadow-2:0 6px 18px rgba(0,0,0,.45);
--shadow-3:0 18px 48px rgba(0,0,0,.6);
--shadow-sheet:0 -12px 40px rgba(0,0,0,.7);
--inset-hair:inset 0 1px 0 rgba(255,255,255,.05);
--glow-volt:0 0 0 1px var(--volt-500),0 8px 28px rgba(200,245,59,.22);
--glow-red:0 0 0 1px var(--red-500),0 8px 28px rgba(255,77,94,.2);
--ring-focus:0 0 0 2px var(--ink-900),0 0 0 4px var(--volt-500);
--blur-sheet:saturate(150%) blur(18px);/* @kind other */
}

:root{
--dur-instant:80ms;/* @kind other */
--dur-fast:120ms;/* @kind other */
--dur-base:200ms;/* @kind other */
--dur-slow:320ms;/* @kind other */
--dur-page:420ms;/* @kind other */
--ease-out:cubic-bezier(.2,.8,.2,1);/* @kind other */
--ease-in-out:cubic-bezier(.4,0,.2,1);/* @kind other */
--ease-snap:cubic-bezier(.16,1.06,.3,1);/* @kind other */
--t-hover:background-color var(--dur-fast) var(--ease-out),color var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out);/* @kind other */
--t-press:transform var(--dur-instant) var(--ease-out);/* @kind other */
}
@media (prefers-reduced-motion:reduce){:root{
--dur-fast:1ms;/* @kind other */
--dur-base:1ms;/* @kind other */
--dur-slow:1ms;/* @kind other */
--dur-page:1ms;/* @kind other */
}}

:root{
/* surfaces */
--bg-page:var(--ink-900);
--surface-1:var(--ink-800);
--surface-card:var(--ink-700);
--surface-raised:var(--ink-600);
--surface-input:var(--ink-800);
--surface-sheet:rgba(20,26,32,.92);
--surface-inverse:var(--ink-050);

/* text */
--text-primary:var(--ink-000);
--text-body:var(--ink-100);
--text-muted:var(--ink-300);
--text-disabled:var(--ink-400);
--text-accent:var(--volt-500);
--text-on-accent:var(--ink-1000);
--text-inverse:var(--ink-900);
--text-link:var(--ice-500);
--text-link-hover:var(--ice-400);

/* lines */
--border-hair:var(--ink-600);
--border-strong:var(--ink-500);
--border-input:var(--ink-500);
--border-focus:var(--volt-500);

/* actions */
--action-primary-bg:var(--volt-500);
--action-primary-bg-hover:var(--volt-400);
--action-primary-bg-press:var(--volt-600);
--action-primary-fg:var(--ink-1000);
--action-secondary-bg:var(--ink-600);
--action-secondary-bg-hover:var(--ink-500);
--action-secondary-fg:var(--ink-000);
--action-ghost-fg:var(--ink-100);
--action-ghost-bg-hover:rgba(255,255,255,.06);
--action-danger-bg:var(--red-500);
--action-danger-bg-hover:var(--red-600);

/* swipe verdicts */
--verdict-like:var(--green-500);
--verdict-pass:var(--red-500);
--verdict-superlike:var(--ice-500);

/* subscription tiers */
--tier-alap:var(--ink-200);
--tier-sportolo:var(--volt-500);
--tier-olimpikon:var(--gold-500);

/* status */
--status-online:var(--green-500);
--status-verified:var(--gold-500);
--status-boost:var(--ember-500);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg-page);color:var(--text-body);font-family:var(--font-ui);font-size:var(--fs-body-m);line-height:var(--lh-body-m);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:var(--ls-display);color:var(--text-primary);margin:0}
p{margin:0;text-wrap:pretty}
a{color:var(--text-link);text-decoration:none}
a:hover{color:var(--text-link-hover);text-decoration:underline}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:none;box-shadow:var(--ring-focus)}
.sk-label{font-family:var(--font-ui);font-size:var(--fs-label);line-height:var(--lh-label);letter-spacing:var(--ls-label);text-transform:uppercase;font-weight:var(--fw-semibold);color:var(--text-muted)}
.sk-num{font-family:var(--font-mono);font-variant-numeric:tabular-nums}

/* TrainMesh component styles — states that inline styles cannot express (hover/active/focus/placeholder). */

/* ---------- Button ---------- */
.sk-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-4);font-family:var(--font-display);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.04em;border:1px solid transparent;border-radius:var(--r-button);cursor:pointer;transition:var(--t-hover),transform var(--dur-instant) var(--ease-out);white-space:nowrap;text-decoration:none}
.sk-btn:hover{text-decoration:none}
.sk-btn:active{transform:scale(.97)}
.sk-btn[disabled],.sk-btn[aria-disabled=true]{cursor:not-allowed;opacity:.38;transform:none}
.sk-btn--sm{height:34px;padding:0 var(--sp-5);font-size:14px}
.sk-btn--md{height:44px;padding:0 var(--sp-7);font-size:16px}
.sk-btn--lg{height:54px;padding:0 var(--sp-9);font-size:19px}
.sk-btn--primary{background:var(--action-primary-bg);color:var(--action-primary-fg)}
.sk-btn--primary:hover:not([disabled]){background:var(--action-primary-bg-hover)}
.sk-btn--primary:active:not([disabled]){background:var(--action-primary-bg-press)}
.sk-btn--secondary{background:var(--action-secondary-bg);color:var(--action-secondary-fg)}
.sk-btn--secondary:hover:not([disabled]){background:var(--action-secondary-bg-hover)}
.sk-btn--outline{background:transparent;color:var(--text-primary);border-color:var(--border-strong)}
.sk-btn--outline:hover:not([disabled]){border-color:var(--volt-500);color:var(--volt-500)}
.sk-btn--ghost{background:transparent;color:var(--action-ghost-fg)}
.sk-btn--ghost:hover:not([disabled]){background:var(--action-ghost-bg-hover)}
.sk-btn--danger{background:var(--action-danger-bg);color:#fff}
.sk-btn--danger:hover:not([disabled]){background:var(--action-danger-bg-hover)}

/* ---------- IconButton ---------- */
.sk-iconbtn{display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;cursor:pointer;transition:var(--t-hover),transform var(--dur-instant) var(--ease-out);background:transparent;color:var(--text-body);border-radius:var(--r-pill)}
.sk-iconbtn:active{transform:scale(.94)}
.sk-iconbtn--sm{width:32px;height:32px}
.sk-iconbtn--md{width:44px;height:44px}
.sk-iconbtn--lg{width:60px;height:60px}
.sk-iconbtn--ghost:hover{background:var(--action-ghost-bg-hover);color:var(--text-primary)}
.sk-iconbtn--solid{background:var(--surface-raised);color:var(--text-primary)}
.sk-iconbtn--solid:hover{background:var(--ink-500)}
.sk-iconbtn--outline{border-color:var(--border-strong)}
.sk-iconbtn--outline:hover{border-color:var(--volt-500);color:var(--volt-500)}
.sk-iconbtn[disabled]{opacity:.35;cursor:not-allowed}

/* ---------- Chip ---------- */
.sk-chip{display:inline-flex;align-items:center;gap:var(--sp-3);height:32px;padding:0 var(--sp-5);border-radius:var(--r-chip);border:1px solid var(--border-strong);background:transparent;color:var(--text-body);font-size:var(--fs-body-s);font-weight:var(--fw-medium);cursor:default;transition:var(--t-hover)}
.sk-chip--clickable{cursor:pointer}
.sk-chip--clickable:hover{border-color:var(--ink-400);color:var(--text-primary)}
.sk-chip--selected{background:var(--volt-a12);border-color:var(--volt-500);color:var(--volt-500)}
.sk-chip--selected:hover{background:var(--volt-a24)}

/* ---------- Card ---------- */
.sk-card{background:var(--surface-card);border:1px solid var(--border-hair);border-radius:var(--r-card);box-shadow:var(--shadow-1)}
.sk-card--interactive{cursor:pointer;transition:var(--t-hover),transform var(--dur-base) var(--ease-out)}
.sk-card--interactive:hover{border-color:var(--border-strong);transform:translateY(-2px);box-shadow:var(--shadow-2)}
.sk-card--accent{border-color:var(--volt-500);box-shadow:var(--glow-volt)}

/* ---------- Inputs ---------- */
.sk-field{display:flex;flex-direction:column;gap:var(--sp-3)}
.sk-input,.sk-textarea,.sk-select{width:100%;background:var(--surface-input);border:1px solid var(--border-input);border-radius:var(--r-input);color:var(--text-primary);padding:0 var(--sp-5);transition:var(--t-hover)}
.sk-input,.sk-select{height:46px}
.sk-textarea{padding:var(--sp-5);min-height:104px;resize:vertical;line-height:1.5}
.sk-input::placeholder,.sk-textarea::placeholder{color:var(--ink-400)}
.sk-input:hover,.sk-textarea:hover,.sk-select:hover{border-color:var(--ink-400)}
.sk-input:focus,.sk-textarea:focus,.sk-select:focus{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 3px var(--volt-a12)}
.sk-input--error,.sk-textarea--error{border-color:var(--red-500)}
.sk-input[disabled],.sk-textarea[disabled],.sk-select[disabled]{opacity:.45;cursor:not-allowed}
.sk-select{appearance:none;cursor:pointer;padding-right:var(--sp-9)}
.sk-searchbar{display:flex;align-items:center;gap:var(--sp-4);height:44px;padding:0 var(--sp-5);background:var(--surface-input);border:1px solid var(--border-input);border-radius:var(--r-pill);transition:var(--t-hover)}
.sk-searchbar:focus-within{border-color:var(--border-focus);box-shadow:0 0 0 3px var(--volt-a12)}
.sk-searchbar input{flex:1;background:transparent;border:0;outline:none;color:var(--text-primary)}
.sk-searchbar input::placeholder{color:var(--ink-400)}

/* ---------- Checkbox / Toggle ---------- */
.sk-check{display:inline-flex;align-items:center;gap:var(--sp-5);cursor:pointer;user-select:none}
.sk-check__box{width:20px;height:20px;flex:0 0 20px;border:1px solid var(--border-strong);border-radius:var(--r-xs);display:grid;place-items:center;transition:var(--t-hover)}
.sk-check:hover .sk-check__box{border-color:var(--ink-400)}
.sk-check--on .sk-check__box{background:var(--volt-500);border-color:var(--volt-500)}
.sk-check--disabled{opacity:.4;cursor:not-allowed}
.sk-toggle{position:relative;width:46px;height:26px;flex:0 0 46px;border-radius:var(--r-pill);background:var(--ink-500);border:0;cursor:pointer;transition:var(--t-hover)}
.sk-toggle__knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:var(--r-pill);background:#fff;transition:transform var(--dur-base) var(--ease-snap)}
.sk-toggle--on{background:var(--volt-500)}
.sk-toggle--on .sk-toggle__knob{transform:translateX(20px)}

/* ---------- Segment ---------- */
.sk-seg{display:inline-flex;padding:3px;gap:2px;background:var(--ink-800);border:1px solid var(--border-hair);border-radius:var(--r-pill)}
.sk-seg__item{border:0;background:transparent;cursor:pointer;height:34px;padding:0 var(--sp-6);border-radius:var(--r-pill);font-family:var(--font-display);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.05em;font-size:14px;color:var(--text-muted);transition:var(--t-hover)}
.sk-seg__item:hover{color:var(--text-primary)}
.sk-seg__item--active{background:var(--volt-500);color:var(--ink-1000)}

/* ---------- Range ---------- */
.sk-range{-webkit-appearance:none;appearance:none;width:100%;height:4px;border-radius:var(--r-pill);background:var(--ink-500);outline:none}
.sk-range::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--volt-500);border:3px solid var(--ink-900);cursor:pointer;box-shadow:0 0 0 1px var(--volt-500)}
.sk-range::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--volt-500);border:3px solid var(--ink-900);cursor:pointer}

/* ---------- List item ---------- */
.sk-item{display:flex;align-items:center;gap:var(--sp-5);width:100%;padding:var(--sp-5) var(--sp-6);background:transparent;border:0;border-bottom:1px solid var(--border-hair);text-align:left;color:var(--text-body);transition:var(--t-hover)}
.sk-item--clickable{cursor:pointer}
.sk-item--clickable:hover{background:rgba(255,255,255,.035)}
.sk-item--active{background:var(--volt-a06);box-shadow:inset 3px 0 0 var(--volt-500)}

/* ---------- Tabbar / Appbar ---------- */
.sk-tabbar{display:flex;align-items:stretch;height:var(--tabbar-h);background:var(--ink-1000);border-top:1px solid var(--border-hair)}
.sk-tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;background:transparent;border:0;cursor:pointer;color:var(--ink-300);transition:var(--t-hover)}
.sk-tab:hover{color:var(--ink-100)}
.sk-tab--active{color:var(--volt-500)}
.sk-navlink{font-family:var(--font-display);text-transform:uppercase;font-weight:var(--fw-bold);letter-spacing:.05em;font-size:15px;color:var(--ink-200);padding:var(--sp-4) 0;border-bottom:2px solid transparent;cursor:pointer;transition:var(--t-hover);text-decoration:none}
.sk-navlink:hover{color:#fff;text-decoration:none}
.sk-navlink--active{color:var(--volt-500);border-bottom-color:var(--volt-500)}

/* ---------- Misc ---------- */
.sk-spin{animation:sk-spin 900ms linear infinite}
@keyframes sk-spin{to{transform:rotate(360deg)}}
.sk-skel{background:linear-gradient(90deg,var(--ink-700) 25%,var(--ink-600) 37%,var(--ink-700) 63%);background-size:400% 100%;animation:sk-shimmer 1400ms ease-in-out infinite}
@keyframes sk-shimmer{0%{background-position:100% 0}100%{background-position:0 0}}
.sk-photo{background:var(--ink-600);background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.028) 0 10px,transparent 10px 20px);display:grid;place-items:center;overflow:hidden}


/* ---------- Landing közös kiegészítések (TrainMesh) ---------- */
/* Edző / terem csomagok sáv */
.biz{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2px;background:var(--border-hair);border:1px solid var(--border-hair)}
.biz>div{background:var(--ink-900);padding:24px 22px;display:flex;flex-direction:column;gap:8px}
.biz .sk-num{font-size:26px;color:var(--text-primary)}
.biz .sk-num small{font-size:14px;color:var(--text-muted);font-family:var(--font-mono)}
.biz p{font-size:14px;color:var(--text-muted);line-height:1.5}
/* Mobil (375px): a kétoszlopos inline gridek egy oszlopba esnek, a fejléc menü elrejtve */
@media(max-width:900px){
  .wrap[style*="grid-template-columns"]{grid-template-columns:1fr!important}
  header nav{display:none!important}
  #deck{height:420px!important}
  .phone{width:min(290px,86vw)}
}
@media(max-width:560px){
  [style*="grid-template-columns:1.4fr 1fr 1fr 1fr"]{grid-template-columns:1.2fr 1fr 1fr 1fr!important}
  [style*="grid-template-columns:1.4fr 1fr 1fr 1fr"]>div{padding-left:8px!important;padding-right:8px!important}
  .tick__i{font-size:12px}
}

/* ---------- Landing oldal (/, korábban d.html inline <style>) ----------
   Külső fájlban, hogy az oldal inline stílus-blokk nélkül is menjen egy
   szigorúbb CSP (style-src 'self') mellett. */
html,body{margin:0;background:var(--ink-1000);overflow-x:hidden}
.wrap{max-width:1240px;margin:0 auto;padding:0 var(--gutter-web)}
.ico{display:inline-block;background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;flex:0 0 auto}
.dsp{font-family:var(--font-display);font-weight:800;text-transform:uppercase;letter-spacing:-.02em;line-height:.88;color:var(--text-primary);margin:0}
.eyebrow{font-family:var(--font-ui);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--volt-500)}
.lead{font-size:18px;line-height:1.6;color:var(--ink-200);text-wrap:pretty}
.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.word{display:inline-block;overflow:hidden;vertical-align:bottom}.word>span{display:inline-block}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:54px;padding:0 30px;border-radius:var(--r-pill);font-family:var(--font-display);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:18px;border:1px solid transparent;cursor:pointer;text-decoration:none;transition:var(--t-hover),transform var(--dur-instant) var(--ease-out)}
.btn:hover{text-decoration:none}.btn:active{transform:scale(.97)}
.btn--p{background:var(--volt-500);color:var(--ink-1000);box-shadow:0 8px 34px rgba(200,245,59,.26)}
.btn--p:hover{background:var(--volt-400);color:var(--ink-1000);box-shadow:0 10px 44px rgba(200,245,59,.4)}
.btn--g{background:rgba(255,255,255,.06);color:var(--text-primary);border-color:rgba(255,255,255,.14);backdrop-filter:blur(10px)}
.btn--g:hover{border-color:var(--volt-500);color:var(--volt-500)}
.glass{background:rgba(20,26,32,.55);backdrop-filter:saturate(150%) blur(18px);border:1px solid rgba(255,255,255,.08);border-radius:var(--r-card);transition:var(--t-hover),transform var(--dur-base) var(--ease-out)}
.glass:hover{border-color:rgba(200,245,59,.35);transform:translateY(-5px)}
.panel{background:var(--ink-800);border:1px solid var(--border-hair)}
.chip{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 16px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);font-size:14px;color:var(--ink-050);backdrop-filter:blur(8px)}
.sect{padding:120px 0;position:relative}
.tick{background:var(--volt-500);color:var(--ink-1000);overflow:hidden;white-space:nowrap}
.tick__t{display:inline-flex;padding:7px 0;will-change:transform}
.tick__i{display:inline-flex;align-items:center;gap:10px;padding:0 22px;font-family:var(--font-display);font-weight:800;text-transform:uppercase;font-size:14px;letter-spacing:.07em;border-right:1px solid rgba(4,6,8,.25)}
.rank{display:grid;grid-template-columns:52px 1fr 92px 92px 74px;gap:14px;align-items:center;padding:14px 18px;border-bottom:1px solid var(--border-hair);transition:var(--t-hover);cursor:pointer}
.rank:hover{background:rgba(200,245,59,.05)}
.rank--h{cursor:default;border-bottom-color:var(--border-strong)}.rank--h:hover{background:transparent}
.rk{font-family:var(--font-display);font-weight:800;font-size:26px;color:var(--ink-400);text-align:center;line-height:1}
.fix{display:grid;grid-template-columns:78px 1fr auto;gap:18px;align-items:center;padding:16px 18px;border-bottom:1px solid var(--border-hair);transition:var(--t-hover)}
.fix:hover{background:rgba(255,255,255,.03)}
.bar{height:6px;background:var(--ink-600);overflow:hidden}.bar>i{display:block;height:100%;background:var(--volt-500);width:0}
.stamp{position:absolute;top:32px;left:24px;border:3px solid var(--verdict-like);color:var(--verdict-like);padding:2px 14px;border-radius:4px;font-family:var(--font-display);font-size:36px;font-weight:800;letter-spacing:.05em;transform:rotate(-12deg);opacity:0}
@media(max-width:900px){.sect{padding:72px 0}.rank{grid-template-columns:40px 1fr 74px}.rank .hide{display:none}}

/* Kontraszt (WCAG AA 4.5:1 a #040608 háttéren): a landingon a halvány szöveg egy fokkal világosabb */
.lp{--text-muted:var(--ink-200)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--volt-500);color:var(--ink-1000);padding:10px 16px;border-radius:var(--r-pill);font-weight:700}
.skip:focus{top:12px;color:var(--ink-1000);text-decoration:none}
.lp a:focus-visible,.lp button:focus-visible{outline:2px solid var(--volt-500);outline-offset:3px;box-shadow:none}
.navlink{color:var(--ink-200);text-decoration:none}
.navlink:hover{color:var(--volt-500);text-decoration:none}

/* Háttér: a 3D vászon csak alkalmas eszközön indul, addig/helyette statikus SVG */
.bg-gl{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:0;transition:opacity 1.2s var(--ease-out)}
.bg-gl.is-on{opacity:1}
.bg-fallback{position:fixed;left:50%;top:50vh;width:min(92vw,820px);height:auto;transform:translate(-50%,-50%);z-index:0;pointer-events:none;opacity:.55;transition:opacity 1.2s var(--ease-out)}
.bg-fallback.is-off{opacity:0}
.bg-glow{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(1100px 620px at 50% 4%,rgba(200,245,59,.06),transparent 64%)}

/* Ranglista szűrő fülek */
.tab{height:34px;padding:0 16px;border-radius:999px;border:1px solid var(--border-strong);background:transparent;color:var(--text-body);font-family:var(--font-display);font-weight:700;text-transform:uppercase;font-size:14px;letter-spacing:.05em;cursor:pointer;transition:var(--t-hover)}
.tab[aria-pressed="true"]{border-color:var(--volt-500);background:var(--volt-a12);color:var(--volt-500)}
.rank[hidden]{display:none}
.avatar{display:grid;place-items:center;width:30px;height:30px;border-radius:999px;background:var(--surface-raised);font-family:var(--font-display);font-weight:800;font-size:13px;color:var(--ink-200)}
.rname{font-family:var(--font-display);text-transform:uppercase;font-weight:700;font-size:17px;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.note{font-size:12px;color:var(--ink-200)}

/* Csomag mátrix */
.mx{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;border-bottom:1px solid var(--border-hair)}
.mx>*{padding:13px 22px;border-left:1px solid var(--border-hair);display:grid;place-items:center}
.mx>:first-child{border-left:0;display:block;font-size:14px;color:var(--text-body)}
.mx>:nth-child(3){background:var(--volt-a06)}
.mx--h{border-bottom-color:var(--border-strong)}
.mx--h>*{padding:20px 22px;display:block;text-align:center}
.mx--h>:first-child{text-align:left}
.mx--f{border-bottom:0}
.mx--f>*{padding:18px 22px;display:block}
.mx .no{color:var(--ink-300);font-size:15px}
.yr{display:block;font-size:12px;color:var(--ink-200);margin-top:2px}
.biz small.per{font-size:14px;color:var(--text-muted);font-family:var(--font-mono)}

/* Áruház gombok: amíg nincs élő link, nem kattinthatók */
.btn[aria-disabled="true"]{opacity:.6;cursor:not-allowed;pointer-events:none}
.soon{font-family:var(--font-ui);font-size:11px;letter-spacing:.12em;padding:3px 8px;border-radius:999px;background:rgba(255,255,255,.12);color:var(--ink-050)}

/* Lábléc */
.foot{border-top:1px solid rgba(255,255,255,.07);padding:30px 0;font-size:13px;color:var(--ink-200)}
.foot a,.linkbtn{color:var(--ink-200);text-decoration:underline;text-underline-offset:3px}
.foot a:hover,.linkbtn:hover{color:var(--volt-500)}
.linkbtn{background:none;border:0;padding:0;cursor:pointer;font-size:13px}
.foot ul{display:flex;flex-wrap:wrap;gap:8px 18px;list-style:none;margin:0;padding:0}

/* Süti-hozzájárulási sáv */
.consent{position:fixed;left:16px;right:16px;bottom:16px;z-index:90;max-width:720px;margin:0 auto;padding:20px 22px;border-radius:var(--r-card);background:rgba(12,16,20,.96);border:1px solid var(--border-strong);box-shadow:var(--shadow-3);display:flex;flex-direction:column;gap:14px}
.consent[hidden]{display:none}
.consent h2{font-size:20px;letter-spacing:.02em}
.consent p{font-size:14px;line-height:1.5;color:var(--ink-100)}
.consent__row{display:flex;gap:10px;flex-wrap:wrap}
.consent .btn{height:42px;font-size:15px;padding:0 20px}
.consent label{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink-100)}
.consent input{margin-top:3px;accent-color:var(--volt-500)}

.ico-yes{width:17px;height:17px;color:var(--volt-500);-webkit-mask-image:url(/landing/vendor/icons/check.svg);mask-image:url(/landing/vendor/icons/check.svg)}
@media(max-width:900px){.lp-nav{display:none!important}#cta-head{margin-left:auto}#pin .wrap{grid-template-columns:1fr!important}}
@media(max-width:560px){.mx{grid-template-columns:1.2fr 1fr 1fr 1fr}.mx>*{padding-left:8px;padding-right:8px}.mx--h h3{font-size:18px!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}.glass:hover{transform:none}}

/* Kinek szól (TM-88) */
.who{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.who .panel{padding:26px;display:flex;flex-direction:column;gap:14px}
.who p{font-size:16px;color:var(--text-primary);line-height:1.4}
.who ul{margin:0;padding:0 0 0 18px;display:flex;flex-direction:column;gap:8px;font-size:14px;color:var(--text-muted);line-height:1.5}

/* GYIK (TM-88): natív <details>, JS nélkül is nyitható, billentyűzettel kezelhető */
.faq{display:flex;flex-direction:column;border:1px solid var(--border-hair);background:var(--ink-800)}
.faq details{border-bottom:1px solid var(--border-hair)}
.faq details:last-child{border-bottom:0}
.faq summary{cursor:pointer;padding:18px 22px;font-size:17px;color:var(--text-primary);list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--font-mono);font-size:22px;color:var(--volt-500);flex:none}
.faq details[open] summary::after{content:"–"}
.faq summary:focus-visible{outline:2px solid var(--volt-500);outline-offset:-2px}
.faq details p{margin:0;padding:0 22px 20px;font-size:15px;line-height:1.6;color:var(--text-muted)}
.faq a{color:var(--volt-500)}