:root {
    /* Light theme — white background, readable green accent, high-contrast buttons */
    --bg: #f4f7f5; --panel: #ffffff; --panel-2: #eef3f0;
    --border: #cdddd4; --border-bright: #9fb8aa;
    /* readable emerald for text/accents on white */
    --green: hsl(var(--ah) calc(90% * var(--asf)) 26%); --green-strong: hsl(var(--ah) calc(88% * var(--asf)) 33%); --green-dim: hsl(var(--ah) calc(35% * var(--asf)) 45%); --green-bg: hsl(var(--ah) calc(51% * var(--asf)) 93%);
    --amber: #b06a00; --amber-bg: #fdf2dd;
    --red: #c62f2f; --red-bg: #fdeaea;
    --text: #16221c; --text-dim: #4f6359;
    --text-faint: #87998f;
    --shadow: 0 1px 2px hsl(var(--ah) calc(43% * var(--asf)) 11% / 0.06), 0 2px 8px hsl(var(--ah) calc(43% * var(--asf)) 11% / 0.06);
    --shadow-btn: 0 1px 0 hsl(var(--ah) calc(43% * var(--asf)) 11% / 0.08), 0 2px 6px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.18);
    --mono: 'JetBrains Mono', ui-monospace, monospace;
    --display: 'Space Grotesk', sans-serif;
  }
  * { box-sizing: border-box; margin: 0; padding: 0; }
  html, body { background:var(--bg); color:var(--text); font-family: var(--mono); font-size: 14px; min-height: 100vh; min-height: 100dvh; overflow-x: hidden; }
  /* subtle light grid texture instead of dark scanlines */
  body::before { content:''; position:fixed; inset:0; pointer-events:none; z-index:1;
    background:radial-gradient(ellipse at top, #c9f0db40 0%, transparent 55%),
                linear-gradient(#0a9d5c08 1px, transparent 1px),
                linear-gradient(90deg, #0a9d5c08 1px, transparent 1px);
    background-size: 100% 100%, 28px 28px, 28px 28px; }
  .app { position:relative; z-index:3; max-width:1040px; margin:0 auto; padding:24px 20px 80px; }

  header { display:flex; align-items:center; justify-content:space-between; border:1px solid var(--border); background:var(--panel); padding:14px 18px; margin-bottom:20px; position:relative; border-radius:8px; box-shadow:var(--shadow); }
  header::before { content:''; position:absolute; top:-1px; left:-1px; width:12px; height:12px; border-top:3px solid var(--green-strong); border-left:3px solid var(--green-strong); border-radius:4px 0 0 0; }
  header::after { content:''; position:absolute; bottom:-1px; right:-1px; width:12px; height:12px; border-bottom:3px solid var(--green-strong); border-right:3px solid var(--green-strong); border-radius:0 0 4px 0; }
  .brand { display:flex; align-items:baseline; gap:12px; }
  .brand-mark { color:var(--green); font-weight:800; letter-spacing:0.18em; font-size:13px; }
  .brand-sub { color:var(--text-faint); font-size:11px; letter-spacing:0.2em; }
  .clock { color:var(--green-dim); font-size:12px; letter-spacing:0.15em; font-weight:500; }

  /* TABS — clearly card-like, active tab is a solid filled button */
  .tabs { display:grid; grid-template-columns:repeat(9,1fr); gap:10px; margin-bottom:20px; }
  .tab { background:var(--panel); border:1.5px solid var(--border); color:var(--text-dim); padding:14px 14px; cursor:pointer; text-align:left; font-family:var(--mono); font-size:12px; letter-spacing:0.12em; transition:transform 0.14s ease, box-shadow 0.18s ease, background 0.18s ease, border-color 0.18s ease, color 0.18s ease; border-radius:8px; box-shadow:var(--shadow); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .tab:hover { border-color:var(--green-strong); color:var(--text); transform:translateY(-1px); box-shadow:0 3px 10px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.16); } }
  .tab.active { background:var(--green-strong); border-color:var(--green-strong); color:var(--ac-ink); box-shadow:0 3px 12px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.32); }
  .tab .tab-num { display:block; font-size:10px; color:var(--text-faint); margin-bottom:4px; }
  .tab.active .tab-num { color:hsl(var(--ah) calc(61% * var(--asf)) 90%); }
  .tab .tab-label { font-weight:700; }

  .panel { background:var(--panel); border:1px solid var(--border); border-radius:8px; box-shadow:var(--shadow); overflow:hidden; }
  .panel-head { display:flex; justify-content:space-between; align-items:center; padding:12px 18px; border-bottom:1px solid var(--border); background:var(--panel-2); font-size:11px; letter-spacing:0.18em; color:var(--text-dim); }
  .stats { display:flex; gap:18px; }
  .stat { display:flex; gap:6px; align-items:baseline; }
  .stat-label { color:var(--text-faint); font-size:10px; }
  .stat-val { color:var(--green); font-weight:700; }
  .stat-val.amber { color:var(--amber); }
  .stat-val.red { color:var(--red); }

  .qcard { padding:28px; min-height:340px; }
  .qmeta { font-size:10px; letter-spacing:0.25em; color:var(--text-faint); margin-bottom:18px; }
  .qmeta .sep { margin:0 10px; }
  .aircraft-display { display:grid; grid-template-columns:380px 1fr; gap:24px; align-items:stretch; margin-bottom:18px; }
  .aircraft-photo { background:var(--panel-2); border:1px solid var(--border); position:relative; aspect-ratio:16/10; overflow:hidden; border-radius:6px; }
  .aircraft-photo img { width:100%; height:100%; object-fit:cover; }
  .aircraft-photo::after { content:''; position:absolute; inset:0; pointer-events:none;
    background:linear-gradient(180deg, transparent 80%, #00000055 100%); }
  .photo-corner { position:absolute; bottom:8px; left:10px; right:10px; z-index:2; color:#ffffff; font-size:9px; letter-spacing:0.15em; display:flex; justify-content:space-between; text-shadow:0 1px 3px rgba(0,0,0,0.7); }
  .photo-loading { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:var(--green-dim); font-size:11px; letter-spacing:0.2em; animation:pulse-loading 1.4s infinite; }
  .aircraft-info-side { display:flex; flex-direction:column; gap:10px; }
  .ac-target { font-family:var(--display); font-size:18px; color:var(--text); font-weight:700; border-bottom:1px solid var(--border); padding-bottom:10px; margin-bottom:4px; }
  .ac-target small { display:block; font-family:var(--mono); font-size:10px; color:var(--text-faint); letter-spacing:0.15em; font-weight:400; margin-bottom:4px; }
  .ac-row { display:flex; gap:8px; flex-wrap:wrap; font-size:11px; }
  .ac-chip { background:var(--panel-2); border:1px solid var(--border); padding:6px 10px; letter-spacing:0.08em; color:var(--text-dim); border-radius:5px; }
  .ac-chip strong { color:var(--green); margin-right:6px; font-weight:700; }

  .hint-row { margin:14px 0 6px; display:flex; gap:8px; align-items:center; flex-wrap:wrap; padding:10px 14px; background:var(--amber-bg); border-left:4px solid var(--amber); min-height:48px; border-radius:0 6px 6px 0; }
  .hint-row.empty { background:var(--panel-2); border-color:var(--border); }
  .hint-label { color:var(--amber); font-size:10px; letter-spacing:0.18em; font-weight:700; }
  .hint-row.empty .hint-label { color:var(--text-faint); }
  .hint-text { color:var(--text); font-size:12px; flex:1; }
  .hint-row.empty .hint-text { color:var(--text-faint); font-style:italic; }

  /* HINT button — clearly an amber filled action */
  .btn-hint { background:var(--amber); border:1.5px solid var(--amber); color:#ffffff; padding:7px 16px; font-family:var(--mono); font-size:11px; letter-spacing:0.15em; cursor:pointer; font-weight:700; border-radius:6px; box-shadow:0 2px 6px rgba(176,106,0,0.25); transition:transform 0.14s ease, box-shadow 0.18s ease, background 0.18s ease, border-color 0.18s ease, color 0.18s ease; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .btn-hint:hover { background:#9a5d00; transform:translateY(-1px); } }
  .btn-hint:disabled { opacity:1; cursor:not-allowed; background:var(--panel-2); border-color:var(--border); color:var(--text-faint); box-shadow:none; transform:none; }

  .big-prompt { font-family:var(--display); font-size:64px; font-weight:700; color:var(--green); letter-spacing:0.04em; text-align:center; margin:32px 0 14px; line-height:1; }
  .big-prompt.small { font-size:38px; }
  .prompt-hint { text-align:center; color:var(--text-faint); font-size:11px; letter-spacing:0.2em; margin-bottom:14px; }

  /* INPUT — white field, dark green text, clear border */
  .input-row { display:flex; gap:10px; margin-top:18px; }
  .input-row input { flex:1; background:rgba(255,255,255,0.07); border:2px solid var(--border-bright); color:var(--green); padding:16px 18px; font-family:var(--mono); font-size:18px; letter-spacing:0.08em; outline:none; text-transform:uppercase; border-radius:8px; font-weight:700; transition:border-color 0.12s, box-shadow 0.12s; }
  .input-row input:focus { border-color:var(--green-strong); box-shadow:0 0 0 3px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.18); }
  .input-row input::placeholder { color:var(--text-faint); text-transform:none; letter-spacing:0.1em; font-weight:400; }

  /* PRIMARY button — solid green, white text, obviously clickable */
  .btn { background:var(--green-strong); border:1.5px solid var(--green-strong); color:var(--ac-ink); padding:0 24px; font-family:var(--mono); font-size:12px; letter-spacing:0.18em; font-weight:700; cursor:pointer; transition:transform 0.14s ease, box-shadow 0.18s ease, background 0.18s ease, border-color 0.18s ease, color 0.18s ease; border-radius:8px; box-shadow:var(--shadow-btn); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .btn:hover { background:var(--green); border-color:var(--green); transform:translateY(-1px); box-shadow:0 4px 12px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.3); } }
  .btn:active { transform:translateY(0); }
  /* SECONDARY (ghost) button — white with strong border, clearly a button */
  .btn.ghost { background:rgba(255,255,255,0.07); border:1.5px solid var(--border-bright); color:var(--text-dim); box-shadow:var(--shadow); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .btn.ghost:hover { background:var(--panel-2); border-color:var(--green-strong); color:var(--green); transform:translateY(-1px); } }

  .feedback { margin-top:16px; padding:0; display:none; }
  .feedback.show { display:block; }
  .feedback-banner { padding:12px 16px; border-left:4px solid; font-size:13px; display:flex; align-items:center; justify-content:space-between; gap:16px; border-radius:0 6px 6px 0; font-weight:600; }
  .feedback.ok .feedback-banner { background:rgba(63,227,154,.14); border-color:#3fe39a; color:#4ee6a4; }
  .feedback.no .feedback-banner { background:var(--red-bg); border-color:var(--red); color:var(--red); }
  .feedback .answer { font-family:var(--display); font-size:16px; font-weight:700; }

  .reveal { background:var(--panel-2); border:1px solid var(--border); border-top:none; padding:18px 20px; border-radius:0 0 8px 8px; }
  .reveal-title { font-family:var(--display); font-size:22px; color:var(--green); font-weight:700; margin-bottom:4px; letter-spacing:0.01em; }
  .reveal-sub { font-size:11px; letter-spacing:0.15em; color:var(--text-faint); margin-bottom:14px; }
  .reveal-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:8px 14px; font-size:12px; }
  .reveal-grid .item { display:flex; flex-direction:column; gap:2px; padding:7px 0; border-bottom:1px dashed var(--border); }
  .reveal-grid .item-label { font-size:9px; letter-spacing:0.18em; color:var(--text-faint); }
  .reveal-grid .item-val { color:var(--text); }
  .reveal-grid .item-val strong { color:var(--green); font-weight:700; }
  .reveal-ops { margin-top:14px; padding-top:12px; border-top:1px solid var(--border); font-size:11px; color:var(--text-dim); line-height:1.6; }
  .reveal-ops strong { color:var(--amber); display:block; font-size:9px; letter-spacing:0.2em; margin-bottom:4px; }

  .controls { display:flex; gap:8px; padding:12px 18px; border-top:1px solid var(--border); background:var(--panel-2); justify-content:space-between; align-items:center; flex-wrap:wrap; }
  .controls-left { display:flex; gap:8px; flex-wrap:wrap; }
  .controls-right { display:flex; gap:8px; }

  /* FILTER chips — clearly toggle buttons; active = filled green */
  .filter-chip { background:rgba(255,255,255,0.07); border:1.5px solid var(--border-bright); color:var(--text-dim); padding:7px 12px; font-family:var(--mono); font-size:10px; letter-spacing:0.12em; cursor:pointer; white-space:nowrap; border-radius:20px; font-weight:600; transition:transform 0.14s ease, box-shadow 0.18s ease, background 0.18s ease, border-color 0.18s ease, color 0.18s ease; }
  .filter-chip.on { border-color:var(--green-strong); color:var(--ac-ink); background:var(--green-strong); box-shadow:0 2px 6px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.22); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .filter-chip:hover { border-color:var(--green-strong); color:var(--green); } }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .filter-chip.on:hover { color:#ffffff; } }

  .weak-section { margin-top:20px; background:var(--panel); border:1px solid var(--border); padding:14px 18px; border-radius:8px; box-shadow:var(--shadow); }
  .weak-title { font-size:11px; letter-spacing:0.2em; color:var(--amber); margin-bottom:10px; display:flex; gap:10px; align-items:center; font-weight:700; }
  .weak-title::before { content:'!'; display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:50%; background:var(--amber); color:#ffffff; font-weight:700; }
  .weak-list { display:flex; flex-wrap:wrap; gap:6px; }
  .weak-item { font-size:11px; padding:5px 9px; background:var(--amber-bg); border:1px solid var(--amber); color:var(--amber); letter-spacing:0.05em; border-radius:5px; font-weight:600; }
  .weak-empty { color:var(--text-faint); font-size:11px; }

  .session-done { padding:40px 28px; text-align:center; }
  .session-done h2 { font-family:var(--display); font-size:28px; color:var(--green); margin-bottom:8px; letter-spacing:0.02em; }
  .session-done p { color:var(--text-dim); margin-bottom:24px; }
  .score-big { font-size:72px; color:var(--green); font-weight:800; font-family:var(--mono); }

  /* ===== MAP / WAYPOINT MODE ===== */
  .map-prompt { text-align:center; margin-bottom:8px; }
  .map-prompt .mp-label { font-size:11px; letter-spacing:0.2em; color:var(--text-faint); display:block; margin-bottom:6px; }
  .map-prompt .mp-name { font-family:var(--display); font-size:46px; font-weight:800; color:var(--green); letter-spacing:0.06em; line-height:1; }
  .map-prompt .mp-sub { font-size:11px; letter-spacing:0.12em; color:var(--text-dim); margin-top:8px; }
  .map-prompt .mp-sub .tg { display:inline-block; background:var(--green-bg); border:1px solid var(--green-strong); color:var(--green); padding:2px 8px; border-radius:4px; margin:0 3px; font-weight:700; }
  .map-wrap { position:relative; width:100%; background:hsla(150,33%,62%,0.16); border:1px solid var(--border); border-radius:8px; overflow:hidden; margin-top:6px; box-shadow:inset 0 0 0 1px rgba(255,255,255,0.16); }
  .map-wrap svg { width:100%; height:auto; display:block; touch-action:manipulation; }
  /* dot states */
  .wp-dot { cursor:pointer; transition:r 0.1s, fill 0.1s; }
  .wp-hit { cursor:pointer; }
  .wp-dot.cand { fill:#ffffff; stroke:var(--green-strong); stroke-width:2; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .wp-dot.cand:hover { fill:var(--green-bg); } }
  .wp-dot.nav.cand { fill:#fff4e0; stroke:var(--amber); }
  .wp-dot.correct { fill:#3fe39a; stroke:#3fe39a; }
  .wp-dot.wrong { fill:var(--red); stroke:var(--red); }
  .wp-dot.reveal-correct { fill:var(--green-strong); stroke:hsl(var(--ah) calc(100% * var(--asf)) 20%); stroke-width:2.5; }
  .wp-dot.other { fill:#1a1a1a; stroke:#1a1a1a; stroke-width:1; }
  .wp-anchor { fill:var(--text-dim); }
  .wp-anchor-label { fill:var(--text-dim); font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:0.1em; }
  .wp-city { fill:var(--amber); }
  .wp-label-reveal { fill:var(--green); font-family:var(--mono); font-size:8.5px; font-weight:800; pointer-events:none; }
  .wp-label-other { fill:#1a1a1a; font-family:var(--mono); font-size:9px; font-weight:700; pointer-events:none; letter-spacing:0.03em; paint-order:stroke; stroke:#fbfdfc; stroke-width:2.5px; stroke-linejoin:round; }
  .sec-line { fill:none; stroke:#6b7d74; stroke-width:1.2; stroke-dasharray:6 4; opacity:0.7; }
  .sec-label { fill:#5b6d64; font-family:var(--mono); font-size:11px; font-weight:800; letter-spacing:0.25em; opacity:0.55; pointer-events:none; }
  .map-legend { display:flex; gap:14px; flex-wrap:wrap; justify-content:center; margin-top:10px; font-size:10px; color:var(--text-dim); letter-spacing:0.05em; }
  .map-legend span { display:inline-flex; align-items:center; gap:5px; }
  .lg-pt::before { content:''; width:11px; height:11px; border-radius:50%; background:rgba(255,255,255,0.07); border:2px solid var(--green-strong); display:inline-block; }
  .lg-nav::before { content:''; width:11px; height:11px; border-radius:50%; background:hsla(39,85%,62%,0.16); border:2px solid var(--amber); display:inline-block; }
  .lg-city::before { content:'◆'; color:var(--amber); font-size:12px; }
  .lg-fir::before { content:''; width:14px; height:0; border-top:2px dashed var(--border-bright); display:inline-block; }
  .lg-sec::before { content:''; width:14px; height:0; border-top:1.5px dashed #6b7d74; display:inline-block; }
  .lg-other::before { content:''; width:9px; height:9px; border-radius:50%; background:#1a1a1a; display:inline-block; }
  .map-difficulty { font-size:10px; letter-spacing:0.12em; color:var(--text-faint); text-align:center; margin-top:4px; }

  /* ===== STUDY / EXPLORE MODE ===== */
  .wp-dot.s-W { fill:hsl(var(--ah) calc(88% * var(--asf)) 33%); stroke:hsl(var(--ah) calc(89% * var(--asf)) 21%); stroke-width:1.2; }
  .wp-dot.s-C { fill:#e08a1e; stroke:#8a5300; stroke-width:1.2; }
  .wp-dot.s-E { fill:#3b82c4; stroke:#22557f; stroke-width:1.2; }
  .wp-dot.s-sel { stroke:#16221c; stroke-width:3.5; }
  .wp-label-study { fill:#16221c; font-family:var(--mono); font-size:8px; font-weight:700; pointer-events:none; letter-spacing:0.02em; paint-order:stroke; stroke:#fbfdfc; stroke-width:2.4px; stroke-linejoin:round; }
  .lg-sw::before { content:''; width:11px; height:11px; border-radius:50%; background:hsl(var(--ah) calc(88% * var(--asf)) 33%); display:inline-block; }
  .lg-sc::before { content:''; width:11px; height:11px; border-radius:50%; background:#e08a1e; display:inline-block; }
  .lg-se::before { content:''; width:11px; height:11px; border-radius:50%; background:#3b82c4; display:inline-block; }
  .study-detail { margin-top:14px; background:var(--panel-2); border:1px solid var(--border); border-radius:8px; padding:16px 18px; min-height:96px; }
  .study-detail.empty { color:var(--text-faint); font-style:italic; display:flex; align-items:center; justify-content:center; text-align:center; letter-spacing:0.08em; }
  .study-tip { font-size:10px; letter-spacing:0.1em; color:var(--text-faint); text-align:center; margin-top:6px; }

  /* ===== POMENUJ BOD — obrátený kvíz (mapa svieti, meno sa píše) ===== */
  .wp-dot.ctx { fill:#ccd8d1; stroke:#8c9c94; stroke-width:1; cursor:default; }
  .wp-dot.tgt { fill:var(--amber); stroke:#7a4a00; stroke-width:2.5; cursor:default; }
  .wp-ring { fill:none; stroke:var(--amber); stroke-width:1.8; pointer-events:none; }
  .wp-cross { stroke:var(--amber); stroke-width:1.1; opacity:0.55; pointer-events:none; }
  .wp-label-ctx { fill:#5d6d65; font-family:var(--mono); font-size:8px; font-weight:700; pointer-events:none; letter-spacing:0.02em; paint-order:stroke; stroke:#fbfdfc; stroke-width:2.4px; stroke-linejoin:round; }
  .wp-label-wrong { fill:var(--red); font-family:var(--mono); font-size:9px; font-weight:800; pointer-events:none; paint-order:stroke; stroke:#fbfdfc; stroke-width:2.5px; stroke-linejoin:round; }
  .lg-lit::before { content:''; width:11px; height:11px; border-radius:50%; background:var(--amber); border:2px solid #7a4a00; display:inline-block; }
  .lg-ctx::before { content:''; width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,0.07); border:1px solid #8c9c94; display:inline-block; }

  /* ===== SLEPÁ MAPA ===== */
  .blind-dot { fill:#fff; stroke:var(--text-faint); stroke-width:1.6; }
  .blind-dot.ok { fill:#0a9d5c; stroke:#0a9d5c; }
  .blind-dot.no { fill:#fff; stroke:#c2603a; stroke-width:2.2; }
  .blind-num { font:700 11px ui-monospace,monospace; fill:var(--text); text-anchor:middle; }
  .blind-ans { font:600 9.5px ui-monospace,monospace; fill:#c2603a; text-anchor:middle; }
  .blind-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:6px; margin-top:12px; }
  .blind-cell { display:flex; align-items:center; gap:6px; }
  .blind-n { font:700 10.5px ui-monospace,monospace; color:var(--text-faint); min-width:20px; text-align:right; }
  .blind-in { flex:1; min-width:0; font-family:var(--mono); font-size:12px; text-transform:uppercase; padding:6px 8px; border:1px solid var(--border); border-radius:6px; background:rgba(255,255,255,0.07); }
  .blind-in:focus { outline:none; border-color:var(--green-strong); }
  .blind-in.ok { border-color:#0a9d5c; background:hsla(145,55%,62%,0.16); }
  /* doplnené alebo opravené systémom — červeným, aby bolo jasné, že to nie je tvoja odpoveď */
  .blind-in.fixed { border-color:#c2603a; background:hsla(18,81%,62%,0.16); color:hsl(17,54%,72%); font-weight:700; }
  .blind-was { font:600 10px ui-monospace,monospace; color:var(--text-faint); text-decoration:line-through; white-space:nowrap; }
  .blind-actions { display:flex; gap:8px; margin-top:12px; }
  .blind-actions .btn { padding:12px 24px; }

  /* ===== MOD 02 — mapa letísk a oblasti ICAO ===== */
  .ap-label { font-family:var(--mono); font-size:11px; font-weight:800; pointer-events:none; paint-order:stroke; stroke:#fbfdfc; stroke-width:3px; stroke-linejoin:round; }
  .ap-label.ok { fill:#4ee6a4; }
  .ap-label.no { fill:var(--red); }
  .ap-st { font-family:var(--mono); font-size:12px; font-weight:800; fill:#16221c; text-anchor:middle; cursor:pointer; paint-order:stroke; stroke:#ffffff; stroke-width:3.2px; stroke-linejoin:round; }
  .ap-st.sel { fill:var(--red); font-size:15px; }@media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .ap-st:hover { fill:var(--red); font-size:15px; } }
  .ap-struct { display:flex; gap:18px; align-items:center; margin-top:14px; padding:14px 18px; background:var(--panel-2); border:1px solid var(--border); border-radius:8px; flex-wrap:wrap; }
  .ap-struct-code { display:flex; gap:4px; }
  .ap-struct-code span { font-family:var(--display); font-size:30px; font-weight:700; color:var(--ac-ink); background:var(--green-strong); width:40px; height:46px; display:flex; align-items:center; justify-content:center; border-radius:6px; }
  .ap-struct-code span:nth-child(2) { background:var(--amber); }
  .ap-struct-code span:nth-child(n+3) { background:var(--text-faint); }
  .ap-struct-txt { flex:1; min-width:240px; font-size:11.5px; line-height:1.7; color:var(--text-dim); }
  .ap-struct-txt strong { color:var(--text); }
  .ap-struct-ex { margin-top:4px; color:var(--text-faint); font-size:10.5px; }
  .ap-areas { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:10px 16px; margin:14px 0; }
  .ap-area { display:flex; gap:10px; align-items:flex-start; font-size:11px; line-height:1.5; color:var(--text-dim); }
  .ap-area strong { color:var(--text); }
  .ap-sw { flex:none; width:30px; height:30px; border-radius:6px; border:1px solid var(--border-bright); display:flex; align-items:center; justify-content:center; font-family:var(--display); font-weight:700; font-size:16px; color:hsl(215,22%,88%); }

  /* ===== MOD 02 — rozšírenia ===== */
  .choice-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:18px; }
  .choice-btn { background:rgba(255,255,255,0.07); border:2px solid var(--border-bright); color:var(--text); padding:16px 14px; font-family:var(--mono); font-size:16px; font-weight:700; letter-spacing:0.06em; cursor:pointer; border-radius:8px; transition:transform 0.14s ease, box-shadow 0.18s ease, background 0.18s ease, border-color 0.18s ease, color 0.18s ease; box-shadow:var(--shadow); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .choice-btn:hover:not(:disabled) { border-color:var(--green-strong); color:var(--green); transform:translateY(-1px); } }
  .choice-btn:disabled { cursor:default; opacity:0.75; }
  .choice-btn.ok { background:rgba(63,227,154,.14); border-color:#3fe39a; color:#4ee6a4; opacity:1; }
  .choice-btn.no { background:var(--red-bg); border-color:var(--red); color:var(--red); opacity:1; }
  .map-wrap.click svg { cursor:crosshair; }
  .ap-x { stroke:var(--red); stroke-width:2.2; fill:none; pointer-events:none; }
  .ap-miss { stroke:var(--text-faint); stroke-width:1.2; stroke-dasharray:4 3; pointer-events:none; }
  .ap-bks { display:flex; flex-direction:column; gap:6px; margin-top:8px; }
  .ap-bk { display:flex; gap:10px; align-items:center; font-size:11.5px; color:var(--text-dim); }
  .ap-bk strong { display:inline; color:var(--text); font-size:11.5px; letter-spacing:0; margin:0; }
  .ap-bk-c { flex:none; min-width:34px; padding:0 8px; height:30px; border-radius:6px; display:flex; align-items:center; justify-content:center; font-family:var(--display); font-weight:700; font-size:17px; color:#fff; }
  .ap-bk-c.a { background:var(--green-strong); } .ap-bk-c.b { background:var(--amber); } .ap-bk-c.c { background:var(--text-faint); }
  .ap-retry { background:var(--amber-bg); border:1px solid var(--amber); color:var(--amber); padding:2px 7px; border-radius:4px; font-weight:700; letter-spacing:0.1em; margin-left:8px; }
  .ap-progress { font-size:10px; letter-spacing:0.15em; color:var(--green); font-weight:700; align-self:center; margin:0 8px; }
  .ap-note { flex-basis:100%; font-size:10.5px; color:var(--amber); letter-spacing:0.05em; }
  .filter-break { flex-basis:100%; height:0; }

  /* ===== MOD 03 — rozšírenia ===== */
  .cs-back { text-align:center; font-family:var(--display); font-size:34px; font-weight:700; color:var(--text-faint); border:2px dashed var(--border-bright); border-radius:10px; padding:22px 14px; margin:8px auto 0; max-width:640px; }
  .cs-back.open { color:var(--green); border-style:solid; border-color:var(--green-strong); background:var(--green-bg); }
  .cs-back small { display:block; font-family:var(--mono); font-size:11px; font-weight:400; letter-spacing:0.1em; color:var(--text-dim); margin-top:8px; }
  .cs-back small.hard { color:var(--amber); }
  .cs-back u, .cs-c u, .reveal u { text-decoration-color:var(--amber); text-decoration-thickness:2px; text-underline-offset:3px; }
  .cs-acts { display:flex; gap:10px; justify-content:center; margin-top:16px; flex-wrap:wrap; }
  .cs-acts .btn { padding:14px 22px; }
  .cs-key { font-size:9px; opacity:0.75; border:1px solid currentColor; border-radius:4px; padding:1px 5px; margin-left:8px; letter-spacing:0.08em; }
  .cs-list-bar { display:flex; gap:8px; flex-wrap:wrap; }
  .cs-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:6px; }
  .cs-cell { display:flex; gap:10px; align-items:baseline; padding:7px 10px; background:var(--panel-2); border:1px solid var(--border); border-left:4px solid var(--green-strong); border-radius:6px; font-size:12px; }
  .cs-cell.hard { border-left-color:var(--amber); }
  .cs-i { font-weight:800; color:var(--green); min-width:34px; }
  .cs-c { color:var(--text); }
  .cs-cell .hid { color:transparent; background:var(--border); border-radius:4px; cursor:pointer; user-select:none; }
  .cs-cell .hid u { text-decoration:none; }
  /* filtre majú teraz viac riadkov — SKIP/RESET nesmú spľasnúť, keď sa zalomia pod ne */
  .controls-right .btn { padding:9px 24px; }
  .cs-pack { font-family:var(--mono); font-size:10px; letter-spacing:0.08em; font-weight:600; color:var(--text-dim); background:rgba(255,255,255,0.07); border:1.5px solid var(--border-bright); border-radius:20px; padding:6px 10px; }

  /* ===== popis režimu + nápovedy k tlačidlám ===== */
  .mode-help { flex-basis:100%; display:flex; gap:14px; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; background:rgba(255,255,255,0.07); border:1px solid var(--border); border-left:4px solid var(--green-strong); border-radius:0 6px 6px 0; padding:10px 14px; margin-bottom:4px; font-size:12px; line-height:1.6; color:var(--text); }
  .mode-help > div:first-child { flex:1; min-width:260px; }
  .mode-help strong { display:block; font-size:9px; letter-spacing:0.2em; color:var(--green); margin-bottom:2px; }
  .mode-help-tip { font-size:10.5px; color:var(--text-faint); white-space:nowrap; align-self:center; }
  .tipbox { position:fixed; z-index:50; display:none; max-width:320px; background:#16221c; color:#ffffff; font-family:var(--mono); font-size:11px; line-height:1.5; letter-spacing:0.02em; padding:8px 11px; border-radius:6px; box-shadow:0 4px 14px hsl(var(--ah) calc(43% * var(--asf)) 11% / 0.25); pointer-events:none; }

  /* ===== MOD 02 — mapa vľavo, otázka a odpoveď vpravo ===== */
  /* V režime s mapou sa hlavička a karty modulov stiahnu, aby mapa
     dostala čo najviac výšky a stále sa zmestila na jednu obrazovku. */
  .app.wide { max-width:min(97vw, 1800px); padding-top:10px; }
  /* v zobrazení s mapou sa hlavička skryje — výška ide mape */
  .app.wide header { display:none; }
  .app.wide .tabs { margin-bottom:10px; }
  .app.wide .tab { padding:8px 14px; }
  .app.wide .tab .tab-num { display:inline; margin:0 10px 0 0; }
  .qcard.split { --mapoff:208px; container-type:inline-size; display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:28px; align-items:start; align-content:start; padding:20px 24px; }
  .qcard.split > * { grid-column:2; }
  /* šírka mapy = čo dovolí výška okna (cez pomer strán --ar), najviac
     68 % karty, aby vpravo ostalo miesto na otázku */
  .qcard.split > .map-wrap { grid-column:1; grid-row:1 / span 30; position:sticky; top:10px; margin-top:0;
    width:min(calc((100vh - var(--mapoff)) * var(--ar, 1.2)), 74cqw); width:min(calc((100dvh - var(--mapoff)) * var(--ar, 1.2)), 74cqw); }
  .qcard.split .big-prompt { margin-top:18px; }
  /* ŠTÚDIUM vpravo od mapy: väčšie písmo, nech sa to dá čítať z diaľky */
  .qcard.split .study-detail { margin-top:6px; }
  .qcard.split .study-detail .reveal-title { font-size:28px; }
  .qcard.split .ap-area { font-size:12.5px; }
  .qcard.split .ap-struct-txt { font-size:12.5px; }
  .qcard.split .ap-areas { grid-template-columns:1fr; }
  .qcard.split .reveal-grid { grid-template-columns:repeat(auto-fit, minmax(120px, 1fr)); }
  @media (max-width:1100px) {
    .qcard.split { display:block; }
    .qcard.split > .map-wrap { position:static; width:auto; }
  }

  /* ===== celá obrazovka pre režimy s mapou ===== */
  .fs-btn { background:var(--green-strong); border:1.5px solid var(--green-strong); color:var(--ac-ink); padding:8px 16px; font-family:var(--mono); font-size:12px; letter-spacing:0.12em; font-weight:700; cursor:pointer; border-radius:6px; box-shadow:var(--shadow-btn); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .fs-btn:hover { background:var(--green); border-color:var(--green); } }
  /* Celá obrazovka = trieda fs-on na <body>: hlavička a slabé miesta
     zmiznú, karty modulov sa stiahnu a panel vyplní okno. Funguje
     rovnako v každom module a dá sa v nej prepínať medzi modulmi. */
  body.fs-on .weak-section { display:none; }
  body.fs-on .app { max-width:none; padding:8px 10px 10px; }
  body.fs-on .tabs { margin-bottom:8px; gap:8px; }
  body.fs-on .panel { min-height:calc(100vh - 66px); min-height:calc(100dvh - 66px); }
  body.fs-on .qcard.split { --mapoff:200px; }
  body.fs-on .qcard.split > .map-wrap { width:min(calc((100vh - var(--mapoff)) * var(--ar, 1.2)), 76cqw); width:min(calc((100dvh - var(--mapoff)) * var(--ar, 1.2)), 76cqw); }
  body.fs-on .qcard:not(.split) .map-wrap {
    width:min(100%, calc((100vh - 240px) * var(--ar, 1.87))); width:min(100%, calc((100dvh - 240px) * var(--ar, 1.87))); margin-left:auto; margin-right:auto; }

  /* ===== MOD 03 — obrázok prevádzkovateľa z Wikipédie ===== */
  .cs-photo { display:flex; align-items:center; gap:14px; margin-top:12px; padding:10px 12px; background:rgba(255,255,255,0.07); border:1px solid var(--border); border-radius:8px; }
  .cs-photo img { max-width:210px; max-height:120px; object-fit:contain; border-radius:4px; }
  .cs-photo span { font-size:11px; line-height:1.6; color:var(--text-dim); }
  .cs-photo span strong { display:block; color:var(--text); font-size:13px; letter-spacing:0; margin:0; }
  .cs-photo .cs-src { font-size:9px; letter-spacing:0.12em; color:var(--text-faint); }
  .cs-back .cs-photo { justify-content:center; text-align:left; font-family:var(--mono); font-weight:400; }
  .hint-text .cs-photo { display:inline-flex; margin:6px 0 0; padding:6px 8px; }
  .hint-text .cs-photo img { max-width:150px; max-height:80px; }
  .cs-f { font-family:var(--mono); font-size:10px; font-weight:700; color:var(--amber); background:var(--amber-bg); border:1px solid var(--amber); border-radius:999px; padding:0 6px; }
  .cs-a { color:var(--text-faint); font-size:10px; margin-left:auto; text-align:right; }

  /* ===== MOD 05 — hra na kurzy ===== */
  .hg-plane { fill:#16221c; stroke:#ffffff; stroke-width:1.5; stroke-linejoin:round; }
  .hg-vec { stroke:#16221c; stroke-width:1.6; }
  .hg-setv { stroke:var(--amber); stroke-width:2; stroke-dasharray:5 4; }
  .hg-trail { fill:none; stroke:#16221c; stroke-width:1.4; stroke-dasharray:2 5; opacity:0.45; }
  .hg-rose circle { fill:rgba(255,255,255,0.55); stroke:#3b82c4; stroke-width:1; opacity:0.9; }
  .hg-rose line { stroke:#3b82c4; stroke-width:1.2; }
  .hg-rose text { fill:#22557f; font-family:var(--mono); font-size:9px; font-weight:700; text-anchor:middle; paint-order:stroke; stroke:#fbfdfc; stroke-width:2.4px; }
  .hg-zone { fill:rgba(176,106,0,0.14); stroke:var(--amber); stroke-width:1.2; stroke-dasharray:4 3; }
  .hg-gate { stroke:var(--amber); stroke-width:3; }
  .hg-post { fill:var(--amber); stroke:#7a4a00; stroke-width:2; }
  .hg-pl circle { fill:#ccd8d1; stroke:#8c9c94; stroke-width:1; }
  .hg-pl text { fill:#5d6d65; font-family:var(--mono); font-size:9px; font-weight:700; paint-order:stroke; stroke:#fbfdfc; stroke-width:2.4px; }
  .hg-pl.on circle { fill:var(--amber); stroke:#7a4a00; stroke-width:2; }
  .hg-pl.on text { fill:#7a4a00; font-size:11px; }
  .hg-task { margin-top:6px; padding:12px 16px; background:var(--amber-bg); border-left:4px solid var(--amber); border-radius:0 6px 6px 0; }
  .hg-task span { display:block; font-size:9px; letter-spacing:0.2em; color:var(--amber); font-weight:700; }
  .hg-task strong { font-family:var(--display); font-size:26px; color:var(--text); }
  .hg-hdgs { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:12px; }
  .hg-hdgs > div, .hg-stats > div { background:var(--panel-2); border:1px solid var(--border); border-radius:8px; padding:10px 12px; text-align:center; }
  .hg-hdgs span, .hg-stats span { display:block; font-size:9px; letter-spacing:0.18em; color:var(--text-faint); }
  .hg-hdgs b { font-family:var(--display); font-size:44px; line-height:1.1; color:var(--green); }
  .hg-hdgs b.set { color:var(--amber); }
  .hg-msg { margin-top:12px; padding:10px 14px; border-left:4px solid var(--border-bright); background:var(--panel-2); border-radius:0 6px 6px 0; font-size:12px; min-height:40px; color:var(--text-dim); }
  .hg-msg.ok { border-color:#3fe39a; background:rgba(63,227,154,.14); color:#4ee6a4; }
  .hg-msg.no { border-color:var(--red); background:var(--red-bg); color:var(--red); }
  .hg-msg.hint { border-color:var(--amber); background:var(--amber-bg); color:var(--amber); }
  .hg-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:12px; }
  .hg-stats b { font-family:var(--mono); font-size:18px; color:var(--text); }
  .hs-true { stroke:var(--green-strong); stroke-width:2; stroke-dasharray:7 5; }
  .hs-you { stroke-width:2.2; }
  .hs-you.ok { stroke:#3fe39a; }
  .hs-you.no { stroke:var(--red); }
  .hg-task strong { line-height:1.25; display:block; }
  .hg-btns { display:flex; gap:10px; margin-top:12px; }
  .hg-btns .btn { padding:10px 18px; }

  /* ============================================================
     VIZUÁL v3 — jednotný, čistejší vzhľad pre všetky moduly.
     Len prepisuje vzhľad starších pravidiel vyššie; rozloženie
     ani správanie sa nemení. Bežný text je v Inter, kódy a
     štítky ostávajú v neproporcionálnom písme.
     ============================================================ */
  :root {
    --bg:#f1f5f2; --panel-2:#f5f8f6; --border:#dde7e1; --border-bright:#b7cabf; --ink:hsl(var(--ah) calc(39% * var(--asf)) 10%);
    --ui:'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --shadow:0 1px 2px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.05), 0 8px 24px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.06);
    --shadow-btn:0 1px 2px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.14), 0 6px 14px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.22);
  }
  html, body { font-family:var(--ui); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
  body::before { background:radial-gradient(1100px 460px at 50% -8%, hsla(148,52%,62%,0.16) 0%, transparent 62%); background-size:auto; }
  .app { padding-top:18px; }
  header { background:var(--ink); border:none; border-radius:14px; padding:14px 22px; box-shadow:0 10px 26px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.20); }
  header::before, header::after { display:none; }
  .brand-mark { color:#ffffff; font-family:var(--mono); font-size:14px; letter-spacing:0.16em; }
  .brand-sub { color:#8db3a1; font-family:var(--mono); }
  .clock { color:hsl(var(--ah) calc(65% * var(--asf)) 79%); background:rgba(255,255,255,0.08); padding:6px 14px; border-radius:999px; font-family:var(--mono); }
  .tabs { gap:12px; }
  .tab { border:1px solid var(--border); border-radius:12px; padding:14px 16px; font-family:var(--ui); letter-spacing:0; }
  .tab .tab-num { font-family:var(--mono); font-size:10px; letter-spacing:0.16em; color:var(--green-dim); }
  .tab .tab-label { font-size:13px; font-weight:700; letter-spacing:0.05em; color:var(--text); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .tab:hover { border-color:var(--green-strong); box-shadow:0 6px 18px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.14); } }
  .tab.active { background:linear-gradient(135deg, hsl(var(--ah) calc(87% * var(--asf)) 36%) 0%, hsl(var(--ah) calc(90% * var(--asf)) 26%) 100%); border-color:transparent; box-shadow:0 8px 20px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.30); }
  .tab.active .tab-label { color:#ffffff; }
  .tab.active .tab-num { color:hsl(var(--ah) calc(64% * var(--asf)) 87%); }
  .panel { border-radius:16px; border:1px solid var(--border); }
  .panel-head { background:rgba(255,255,255,0.07); padding:14px 22px; font-family:var(--mono); }
  .stats { gap:10px; align-items:center; }
  .stat { background:var(--panel-2); border:1px solid var(--border); border-radius:999px; padding:5px 12px; }
  .qcard { padding:30px 32px; }
  .qmeta, .prompt-hint, .map-difficulty, .study-tip, .mp-label, .item-label, .reveal-sub, .hint-label, .weak-title, .stat-label, .stat-val { font-family:var(--mono); }
  .big-prompt { letter-spacing:0.02em; }
  .input-row input { border-radius:12px; border-width:1.5px; }
  .btn { border-radius:12px; font-family:var(--ui); font-size:13px; font-weight:700; letter-spacing:0.08em; background:linear-gradient(180deg, hsl(var(--ah) calc(86% * var(--asf)) 37%) 0%, hsl(var(--ah) calc(88% * var(--asf)) 33%) 100%); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .btn:hover { background:linear-gradient(180deg, hsl(var(--ah) calc(88% * var(--asf)) 33%) 0%, hsl(var(--ah) calc(90% * var(--asf)) 26%) 100%); } }
  .btn.ghost { background:rgba(255,255,255,0.07); border:1px solid var(--border-bright); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .btn.ghost:hover { background:var(--panel-2); } }
  .btn:disabled { opacity:0.45; cursor:default; transform:none; }
  .btn-hint { border-radius:10px; font-family:var(--ui); letter-spacing:0.08em; }
  .fs-btn { border-radius:10px; font-family:var(--ui); font-size:11.5px; letter-spacing:0.08em; }
  .filter-chip { font-family:var(--ui); font-size:11.5px; font-weight:600; letter-spacing:0.04em; padding:7px 13px; border-width:1px; }
  .filter-chip.on { background:linear-gradient(180deg, hsl(var(--ah) calc(86% * var(--asf)) 37%) 0%, hsl(var(--ah) calc(88% * var(--asf)) 33%) 100%); }
  .controls { background:hsla(140,23%,62%,0.16); padding:16px 22px; gap:12px; }
  .controls-left { row-gap:10px; }
  .hint-row { border-radius:10px; }
  .hint-text { font-size:13px; }
  .feedback-banner { border-radius:10px 10px 0 0; font-size:13.5px; }
  .reveal { background:rgba(255,255,255,0.07); border-radius:0 0 12px 12px; padding:20px 22px; }
  .reveal-grid .item-val { font-size:13px; }
  .reveal-ops { font-size:12px; }
  .map-wrap { border-radius:14px; box-shadow:inset 0 0 0 1px rgba(255,255,255,0.16), 0 1px 2px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.04); }
  .study-detail { border-radius:12px; }
  .weak-section { border-radius:16px; padding:18px 22px; }
  .weak-item { font-family:var(--mono); border-radius:8px; }
  .mode-help { border-radius:10px; font-size:12.5px; }
  .ac-chip { border-radius:8px; font-family:var(--mono); }
  .choice-btn { border-radius:12px; border-width:1.5px; }
  .aircraft-photo { border-radius:12px; }
  .session-done h2 { font-family:var(--display); }
  .cs-cell, .blind-in, .cs-pack { font-family:var(--mono); }
  .hg-msg, .hg-task, .hint-row.empty { border-radius:10px; }
  .tipbox { font-family:var(--ui); font-size:12px; border-radius:8px; }
  .feedback-banner .btn { padding:9px 20px; }

  /* ===== tabuľka filtrov: názov riadku vľavo, voľby vpravo, všetko v zákryte ===== */
  .controls { display:block; }
  .controls-left { display:block; }
  .controls-right { justify-content:flex-end; margin-top:14px; }
  .f-table { border:1px solid var(--border); border-radius:12px; background:rgba(255,255,255,0.07); overflow:hidden; margin-top:10px; }
  .f-row { display:grid; grid-template-columns:170px minmax(0,1fr); align-items:center; border-top:1px solid var(--border); }
  .f-row:first-child { border-top:none; }
  .f-lab { align-self:stretch; display:flex; align-items:center; padding:10px 16px; background:var(--panel-2); border-right:1px solid var(--border); font-family:var(--mono); font-size:10px; font-weight:700; letter-spacing:0.16em; color:var(--text-dim); }
  .f-opts { display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding:9px 14px; }
  .f-row:first-child .f-lab { color:var(--green); }
  .f-row:first-child .f-opts .filter-chip { font-size:12.5px; padding:8px 16px; font-weight:700; }
  @media (max-width:760px) { .f-row { grid-template-columns:1fr; } .f-lab { border-right:none; padding:8px 14px 0; background:transparent; } }

  /* ===== animácie — krátke, aby nezdržiavali; dajú sa vypnúť v systéme ===== */
  @keyframes fadeUp { from { opacity:0.35; transform:translateY(10px); } to { opacity:1; transform:none; } }
  @keyframes popIn { 0% { opacity:0; transform:scale(0.97); } 100% { opacity:1; transform:none; } }
  @keyframes pulseOk { 0% { box-shadow:0 0 0 0 hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.45); } 100% { box-shadow:0 0 0 14px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0); } }
  @keyframes shakeNo { 0%,100% { transform:none; } 25% { transform:translateX(-5px); } 75% { transform:translateX(5px); } }
  @keyframes dotIn { from { opacity:0; } to { opacity:1; } }
  .qcard > * { animation:fadeUp 0.32s cubic-bezier(.2,.7,.2,1) both; }
  .qcard > .rk { animation:none; }   /* rebríček sa prekreslí po načítaní dát; vstup rieši pgIn na celej karte, inak by sa fadeUp spustil druhýkrát */
  .qcard > *:nth-child(2) { animation-delay:0.04s; }
  .qcard > *:nth-child(3) { animation-delay:0.08s; }
  .qcard > *:nth-child(4) { animation-delay:0.12s; }
  .qcard > *:nth-child(n+5) { animation-delay:0.16s; }
  .feedback.show { animation:popIn 0.26s ease both; }
  .feedback.ok .feedback-banner { animation:pulseOk 0.7s ease-out; }
  .feedback.no .feedback-banner { animation:shakeNo 0.28s ease; }
  .choice-btn.ok { animation:pulseOk 0.7s ease-out; }
  .choice-btn.no { animation:shakeNo 0.28s ease; }
  .f-table { animation:fadeUp 0.3s ease both; }
  .mode-help { animation:fadeUp 0.3s ease both; }
  .tab, .btn, .filter-chip, .choice-btn, .btn-hint, .fs-btn { transition:transform 0.14s ease, box-shadow 0.18s ease, background 0.18s ease, border-color 0.18s ease, color 0.18s ease; }
  .btn:active, .filter-chip:active, .choice-btn:active, .tab:active, .fs-btn:active { transform:scale(0.97); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .filter-chip:hover { transform:translateY(-1px); box-shadow:0 3px 10px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.14); } }
  .stat-val { transition:color 0.2s ease; display:inline-block; }
  .wp-dot, .hg-pl circle, .ap-st { animation:dotIn 0.4s ease both; }
  .cs-back.open { animation:popIn 0.24s ease both; }
  .cs-photo img, .aircraft-photo img { animation:dotIn 0.45s ease both; }
  .weak-item { animation:popIn 0.25s ease both; }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration:0.01ms !important; animation-delay:0s !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-property:color, background-color, border-color, opacity, box-shadow !important; transition-duration:0.2s !important; transition-delay:0s !important; }
  }
  /* plynulý príchod novej stránky (v6.0.7): obsah sa jemne zjaví namiesto tvrdého prepnutia */
  @keyframes pgIn { from { opacity:0; transform:translateY(7px); } to { opacity:1; transform:none; } }
  .pg-in { animation:pgIn .22s ease-out both; }

  /* ===== MOD 06 — koordinácia a frekvencie ===== */
  .co-dot { stroke:#ffffff; stroke-width:2; }
  .co-dot.wp-hit { cursor:pointer; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .co-dot.wp-hit:hover { stroke:#16221c; stroke-width:2.5; } }
  .co-lbl { font-family:var(--mono); font-size:10px; font-weight:800; fill:#16221c; paint-order:stroke; stroke:#fbfdfc; stroke-width:2.8px; stroke-linejoin:round; pointer-events:none; }
  .co-lbl.big { font-size:15px; fill:#7a4a00; }
  .co-arrow { stroke:#16221c; stroke-width:3; stroke-linecap:round; }
  .co-arrow-h { fill:#16221c; }
  .co-sw { width:11px; height:11px; border-radius:50%; display:inline-block; }
  .co-sc { margin-top:8px; border:1px solid var(--border); border-radius:12px; overflow:hidden; background:rgba(255,255,255,0.07); }
  .co-sc-title { padding:10px 14px; background:var(--ink, hsl(var(--ah) calc(39% * var(--asf)) 10%)); color:#ffffff; font-size:12px; font-weight:700; letter-spacing:0.03em; }
  .co-sc-row { display:grid; grid-template-columns:170px 1fr; border-top:1px solid var(--border); }
  .co-sc-row span { padding:9px 14px; background:var(--panel-2); font-family:var(--mono); font-size:10px; font-weight:700; letter-spacing:0.14em; color:var(--text-dim); display:flex; align-items:center; }
  .co-sc-row strong { padding:9px 14px; font-size:15px; color:var(--text); }
  .co-table { width:100%; border-collapse:collapse; font-size:12.5px; margin-top:8px; background:rgba(255,255,255,0.07); border:1px solid var(--border); border-radius:10px; overflow:hidden; }
  .co-table th { background:hsla(213,45%,62%,0.16); color:hsl(216,37%,80%); font-size:11px; font-weight:700; padding:8px 10px; text-align:left; border-bottom:1px solid var(--border-bright); }
  .co-table td { padding:7px 10px; border-top:1px solid var(--border); vertical-align:middle; }
  .co-table tr.on td { background:var(--amber-bg); font-weight:700; }
  .co-table td.co-na { color:var(--text-faint); }
  .co-in select, .co-in input { width:100%; min-width:120px; font-family:var(--mono); font-size:12px; padding:6px 8px; border:1px solid var(--border-bright); border-radius:6px; background:rgba(255,255,255,0.07); }
  .co-in.ok { background:rgba(63,227,154,.14); color:#4ee6a4; font-weight:700; }
  .co-in.fixed { background:var(--red-bg); color:var(--red); }
  .co-in.fixed s { display:block; font-size:10.5px; color:var(--text-faint); }
  .co-fill { overflow-x:auto; }
  .co-tcap { margin-top:18px; font-family:var(--mono); font-size:10.5px; font-weight:700; letter-spacing:0.14em; color:var(--green); }
  .co-stack { display:flex; flex-direction:column; gap:4px; margin-top:8px; }
  .co-band { display:grid; grid-template-columns:1.1fr 1.2fr 1fr; gap:10px; align-items:center; padding:8px 12px; background:var(--panel-2); border:1px solid var(--border); border-left:4px solid var(--border-bright); border-radius:8px; font-size:12px; }
  .co-band.on { background:var(--amber-bg); border-left-color:var(--amber); }
  .co-band span { font-family:var(--mono); color:var(--text-dim); }
  .co-band em { font-family:var(--mono); font-style:normal; font-weight:700; color:var(--green); text-align:right; }
  .co-stacks { display:grid; grid-template-columns:repeat(auto-fit,minmax(330px,1fr)); gap:14px; margin-top:6px; }
  .co-stack-h { font-size:12px; font-weight:800; padding-left:8px; border-left:4px solid; margin-top:8px; }
  .co-gen { display:grid; gap:8px; margin-top:8px; font-size:12.5px; line-height:1.55; color:var(--text-dim); }
  .co-gen strong { display:block; color:var(--text); }

  /* ============================================================
     VIZUÁL v4 — tmavé radarové pozadie, sklenené karty, tučnejšie
     písmo. Opäť len vzhľad; rozloženie a správanie ostáva.
     ============================================================ */
  :root {
    --ui:'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --display:'Plus Jakarta Sans', 'Space Grotesk', sans-serif;
    --shadow:0 2px 6px hsl(var(--ah) calc(65% * var(--asf)) 3% / 0.10), 0 18px 44px hsl(var(--ah) calc(65% * var(--asf)) 3% / 0.22);
  }
  html, body { background:hsl(var(--ah) calc(50% * var(--asf)) 5%); font-family:var(--ui); font-weight:500; }
  body::before { display:none; }
  #radar-bg { position:fixed; inset:0; width:100%; height:100%; z-index:0; pointer-events:none; }
  /* jemné stmavenie okrajov, aby karty vystúpili do popredia */
  body::after { content:''; position:fixed; inset:0; z-index:1; pointer-events:none; background:radial-gradient(ellipse at 50% 40%, transparent 35%, rgba(3,10,8,0.55) 100%); }
  header { background:hsl(var(--ah) calc(44% * var(--asf)) 7% / 0.62); border:1px solid rgba(255,255,255,0.10); border-radius:18px; backdrop-filter:blur(16px) saturate(1.3); -webkit-backdrop-filter:blur(16px) saturate(1.3); box-shadow:0 12px 34px rgba(0,0,0,0.35); }
  .brand-mark { font-family:var(--ui); font-weight:800; letter-spacing:0.14em; }
  .brand-mark, .clock { text-shadow:0 0 18px hsl(var(--ah) calc(75% * var(--asf)) 61% / 0.35); }
  .tab { background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.13); border-radius:14px; backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); box-shadow:none; }
  .tab .tab-label { color:hsl(var(--ah) calc(36% * var(--asf)) 95%); font-weight:800; font-size:13.5px; }
  .tab .tab-num { color:hsl(var(--ah) calc(51% * var(--asf)) 67%); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .tab:hover { background:rgba(255,255,255,0.13); border-color:hsl(var(--ah) calc(51% * var(--asf)) 67% / 0.7); box-shadow:0 8px 24px rgba(0,0,0,0.3); color:#fff; } }
  .tab.active { background:linear-gradient(135deg, hsl(var(--ah) calc(83% * var(--asf)) 42%) 0%, hsl(var(--ah) calc(90% * var(--asf)) 26%) 100%); border-color:transparent; box-shadow:0 10px 30px hsl(var(--ah) calc(88% * var(--asf)) 40% / 0.42), inset 0 1px 0 rgba(255,255,255,0.25); }
  .tab.active .tab-num { color:hsl(var(--ah) calc(100% * var(--asf)) 92%); }
  .panel { border-radius:22px; border:1px solid rgba(255,255,255,0.55); background:rgba(255,255,255,0.97); box-shadow:0 24px 70px rgba(0,0,0,0.45); }
  .panel-head { border-radius:22px 22px 0 0; padding:16px 26px; }
  .panel-head > div:first-child { font-weight:700; }
  .qcard { padding:34px 36px; }
  .big-prompt { font-family:var(--display); font-weight:800; letter-spacing:-0.01em; }
  .mp-name, .reveal-title, .ac-target, .session-done h2, .hg-task strong, .hg-hdgs b, .cs-back { font-family:var(--display); font-weight:800; letter-spacing:-0.01em; }
  .btn { border-radius:14px; font-weight:800; box-shadow:0 2px 4px hsl(var(--ah) calc(65% * var(--asf)) 3% / 0.16), 0 10px 22px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.30), inset 0 1px 0 rgba(255,255,255,0.28); }
  .btn.ghost { box-shadow:0 1px 2px hsl(var(--ah) calc(65% * var(--asf)) 3% / 0.08); font-weight:700; }
  .input-row input { border-radius:14px; }
  .filter-chip { font-weight:700; border-radius:999px; }
  .filter-chip.on { box-shadow:0 6px 16px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.32), inset 0 1px 0 rgba(255,255,255,0.25); }
  .choice-btn { border-radius:14px; font-family:var(--ui); font-weight:700; letter-spacing:0.01em; }
  .f-table { border-radius:16px; }
  .f-lab { font-weight:800; }
  .controls { background:hsla(150,22%,62%,0.16); border-radius:0 0 22px 22px; padding:18px 26px 20px; }
  .mode-help { border-radius:14px; font-weight:500; }
  .weak-section { background:rgba(255,255,255,0.95); border:1px solid rgba(255,255,255,0.5); border-radius:20px; box-shadow:0 18px 50px rgba(0,0,0,0.35); }
  .map-wrap { border-radius:18px; }
  .feedback-banner { border-radius:14px 14px 0 0; font-weight:700; }
  .reveal { border-radius:0 0 16px 16px; }
  .hint-row, .hg-msg, .hg-task, .study-detail, .co-sc, .co-table { border-radius:14px; }
  .stat { font-weight:700; }
  .fs-btn { border-radius:12px; font-weight:800; }
  /* stiahnuté karty modulov: číslo nad názvom, názov sa smie zalomiť — nikdy sa neoreže */
  .app.wide .tab, body.fs-on .tab { white-space:normal; overflow:visible; padding:7px 12px; line-height:1.2; }
  .app.wide .tab .tab-num, body.fs-on .tab .tab-num { display:block; margin:0 0 2px; font-size:9px; }
  .app.wide .tab .tab-label, body.fs-on .tab .tab-label { font-size:11.5px; letter-spacing:0.03em; }

  .fs-btn { white-space:nowrap; }
  .panel-head { flex-wrap:wrap; gap:10px; }
  .panel-head > div:first-child { white-space:nowrap; }
  .qcard.split .co-sc-row { grid-template-columns:128px 1fr; }

  /* ===== ÚVOD ===== */
  .home-hero { text-align:center; padding:18px 10px 6px; }
  .home-kicker { font-family:var(--mono); font-size:11px; font-weight:700; letter-spacing:0.3em; color:var(--green); }
  .home-hero h1 { font-family:var(--display); font-size:38px; line-height:1.12; font-weight:800; letter-spacing:-0.02em; color:var(--text); margin:10px auto 12px; max-width:760px; }
  .home-hero p { font-size:15.5px; line-height:1.6; color:var(--text-dim); max-width:680px; margin:0 auto; }
  .home-hero p strong { color:var(--green); }
  .home-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:26px 0 8px; }
  .home-steps > div { display:flex; gap:12px; align-items:flex-start; background:var(--panel-2); border:1px solid var(--border); border-radius:16px; padding:16px; font-size:13.5px; line-height:1.5; color:var(--text-dim); }
  .home-steps b { flex:none; width:32px; height:32px; border-radius:50%; background:linear-gradient(135deg,hsl(var(--ah) calc(83% * var(--asf)) 42%),hsl(var(--ah) calc(90% * var(--asf)) 26%)); color:var(--ac-ink); display:flex; align-items:center; justify-content:center; font-weight:800; }
  .home-steps strong { color:var(--text); }
  .home-h { font-family:var(--mono); font-size:11px; font-weight:700; letter-spacing:0.22em; color:var(--green); margin:28px 0 12px; }
  .home-mods { display:grid; grid-template-columns:repeat(auto-fit,minmax(330px,1fr)); gap:14px; }
  .home-mod { display:flex; flex-direction:column; gap:10px; background:rgba(255,255,255,0.07); border:1px solid var(--border); border-radius:18px; padding:20px; box-shadow:0 1px 2px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.04), 0 8px 22px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.06); transition:transform 0.18s ease, box-shadow 0.18s ease; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .home-mod:hover { transform:translateY(-3px); box-shadow:0 14px 34px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.12); } }
  .home-mod-top span { display:block; font-family:var(--mono); font-size:10px; font-weight:700; letter-spacing:0.18em; color:var(--green-dim); }
  .home-mod-top strong { font-family:var(--display); font-size:21px; font-weight:800; color:var(--text); }
  .home-mod p { font-size:13.5px; line-height:1.55; color:var(--text-dim); }
  .home-row { font-size:12.5px; line-height:1.5; color:var(--text); }
  .home-row em { display:block; font-style:normal; font-family:var(--mono); font-size:9.5px; font-weight:700; letter-spacing:0.16em; color:var(--text-faint); margin-bottom:2px; }
  .home-row ul, .home-row ol { margin:0; padding-left:18px; color:var(--text-dim); }
  .home-row li { margin:2px 0; }
  .home-how { background:var(--green-bg); border-radius:12px; padding:12px 14px; }
  .home-how em { color:var(--green); }
  .home-how ol { color:var(--text); }
  .home-hero p + p { margin-top:12px; font-size:14.5px; }
  .home-mods { grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr)); }
  .home-mod .btn { margin-top:auto; padding:12px 18px; align-self:flex-start; }
  .home-tips { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:12px; }
  .home-tips > div { background:var(--panel-2); border:1px solid var(--border); border-radius:14px; padding:14px 16px; font-size:13px; line-height:1.55; color:var(--text-dim); }
  .home-tips strong { display:block; color:var(--text); margin-bottom:3px; }
  .home-contact { margin-top:24px; padding:20px 22px; border-radius:18px; background:linear-gradient(135deg,hsl(var(--ah) calc(39% * var(--asf)) 10%),hsl(var(--ah) calc(51% * var(--asf)) 15%)); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); font-size:14.5px; line-height:1.55; }
  .home-contact strong { display:block; color:#ffffff; font-size:17px; margin-bottom:4px; }
  @media (max-width:760px) { .home-hero h1 { font-size:26px; } .home-steps { grid-template-columns:1fr; } }

  /* ===== prehľad, tréning, skúška, hľadanie, päta ===== */
  .home-dash { display:grid; grid-template-columns:1.4fr 1fr; gap:14px; margin-top:22px; }
  .home-cta { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:18px 20px; border-radius:18px; background:linear-gradient(135deg,hsl(var(--ah) calc(39% * var(--asf)) 10%),hsl(var(--ah) calc(61% * var(--asf)) 20%)); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); }
  .home-cta.alt { background:var(--panel-2); border:1px solid var(--border); color:var(--text-dim); }
  .home-cta strong { display:block; font-family:var(--display); font-size:19px; font-weight:800; color:#ffffff; }
  .home-cta.alt strong { color:var(--text); }
  .home-cta span { font-size:13px; line-height:1.45; }
  .home-cta .btn { padding:13px 22px; white-space:nowrap; flex:none; }
  .home-search { margin-top:14px; }
  .home-search input { width:100%; background:rgba(255,255,255,0.07); border:1.5px solid var(--border-bright); border-radius:14px; padding:14px 18px; font-family:var(--ui); font-size:15px; font-weight:600; color:var(--text); outline:none; }
  .home-search input:focus { border-color:var(--green-strong); box-shadow:0 0 0 3px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.18); }
  .home-tips.search { margin-top:10px; }
  .home-tips.search em { display:block; font-style:normal; font-family:var(--mono); font-size:9.5px; font-weight:700; letter-spacing:0.14em; color:var(--green); }
  .home-tips.search ul { margin:4px 0 0; padding-left:16px; }
  .home-prog { font-size:11.5px; color:var(--text-dim); line-height:1.5; }
  .home-prog b { color:var(--text); }
  .home-bar { height:8px; border-radius:99px; background:var(--panel-2); border:1px solid var(--border); overflow:hidden; margin-bottom:6px; }
  .home-bar i { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,hsl(var(--ah) calc(83% * var(--asf)) 42%),hsl(var(--ah) calc(90% * var(--asf)) 26%)); transition:width 0.5s ease; }
  .exam-list { display:grid; gap:6px; }
  .exam-list > div { display:grid; grid-template-columns:1.3fr 1fr 1.2fr; gap:10px; align-items:center; padding:9px 12px; background:var(--panel-2); border:1px solid var(--border); border-left:4px solid var(--red); border-radius:10px; font-size:12.5px; }
  .exam-list s { color:var(--red); }
  .exam-list b { color:var(--green); }
  body.exam-on .hint-row, body.exam-on .stat, body.exam-on .ap-retry { display:none; }
  /* čísla na možnostiach — dajú sa vybrať klávesmi 1 až 6 */
  .choice-grid { counter-reset:opt; }
  .choice-btn { position:relative; }
  .choice-btn::before { counter-increment:opt; content:counter(opt); position:absolute; left:10px; top:8px; font-family:var(--mono); font-size:10px; font-weight:700; color:var(--text-faint); border:1px solid var(--border-bright); border-radius:5px; padding:0 5px; line-height:16px; background:rgba(255,255,255,0.07); }
  .site-foot { position:relative; z-index:2; margin-top:8px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:7px 18px; background:hsl(var(--ah) calc(47% * var(--asf)) 6% / 0.82); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border-top:1px solid rgba(255,255,255,0.10); color:#9fc4b2; font-size:11.5px; }
  .site-foot strong { color:hsl(var(--ah) calc(39% * var(--asf)) 94%); }
  .site-foot button { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); border:none; color:hsl(154,67%,88%); font-family:var(--ui); font-weight:800; font-size:11.5px; letter-spacing:0.06em; padding:7px 14px; border-radius:99px; cursor:pointer; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .site-foot button:hover { background:hsl(var(--ah) calc(75% * var(--asf)) 57%); } }
  .app { padding-bottom:24px; }
  body:not(.on-home) .site-foot { display:none; }
  @media (max-width:760px) { .home-dash { grid-template-columns:1fr; } .home-cta { flex-direction:column; align-items:flex-start; } .exam-list > div { grid-template-columns:1fr; } .site-foot span { display:none; } .site-foot { justify-content:center; } }

  /* ============================================================
     RESPONZÍVNE ROZLOŽENIE — notebook, tablet, telefón.
     Cieľ: otázka aj odpoveď sú na jednej obrazovke bez rolovania.
     Nastavenia sa dajú zbaliť tlačidlom ⚙ (na úzkych oknách sú
     zbalené od začiatku), karty modulov sú na úzkom okne jeden
     posuvný riadok a mapa nikdy nezaberie viac než časť výšky.
     ============================================================ */
  .input-row { align-items:stretch; }
  .input-row input { min-width:0; }
  .input-row .btn { flex:none; white-space:nowrap; }
  .set-btn { background:rgba(255,255,255,0.07); border:1px solid var(--border-bright); color:var(--text-dim); padding:8px 14px; font-family:var(--ui); font-size:11.5px; font-weight:800; letter-spacing:0.06em; border-radius:12px; cursor:pointer; white-space:nowrap; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .set-btn:hover { border-color:var(--green-strong); color:var(--green); } }
  body.set-off #filters { display:none; }
  body.set-off .controls { padding-top:10px; padding-bottom:10px; }
  body.set-off .controls-right { margin-top:0; }
  @media (max-width:1100px) {
    /* karty modulov: jeden riadok, ktorý sa dá posúvať do strán */
    .tabs, .app.wide .tabs, body.fs-on .tabs { display:flex; overflow-x:auto; gap:8px; margin-bottom:10px; padding-bottom:4px; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
    .tabs::-webkit-scrollbar { display:none; }
    .tab, .app.wide .tab, body.fs-on .tab { flex:none; padding:7px 14px; white-space:nowrap; line-height:1.2; }
    .tab .tab-num { display:block; margin:0 0 2px; font-size:9px; }
    .tab .tab-label { font-size:12px; }
    .app, .app.wide { padding:8px 10px 64px; max-width:none; }
    header { padding:8px 14px; margin-bottom:8px; border-radius:14px; }
    .brand-sub { display:none; }
    .panel-head { padding:10px 14px; gap:8px; }
    .panel-head > div:first-child { font-size:10px; letter-spacing:0.12em; }
    .stats { gap:6px; flex-wrap:wrap; justify-content:flex-end; }
    .stat { padding:3px 9px; }
    .stat-label { font-size:9px; }
    .fs-btn, .set-btn { padding:6px 10px; font-size:10.5px; }
    .qcard, .qcard.split { padding:14px 14px 16px; min-height:0; }
    .qmeta { margin-bottom:10px; font-size:9px; }
    /* mapa nad otázkou: najviac ~40 % výšky okna, aby ostalo miesto na odpoveď */
    .qcard.split > .map-wrap, .qcard .map-wrap { position:static; width:auto; max-width:calc(40vh * var(--ar, 1.4)); margin-left:auto; margin-right:auto; }
    .big-prompt { font-size:40px; margin:14px 0 8px; }
    .big-prompt.small { font-size:26px; }
    .map-prompt .mp-name { font-size:30px; }
    .hg-task { padding:10px 14px; }
    .hg-task strong { font-size:17px; }
    .hg-hdgs b { font-size:30px; }
    .hint-row { min-height:0; padding:8px 12px; margin:10px 0 4px; }
    .input-row { margin-top:10px; gap:8px; }
    .input-row input { padding:12px 14px; font-size:16px; }
    .input-row .btn { padding:0 16px; }
    .choice-grid { margin-top:10px; gap:8px; }
    .choice-btn { padding:13px 8px 13px 26px; font-size:14px; }
    .reveal { padding:14px 14px; }
    .controls { padding:12px 14px; }
    .weak-section { padding:12px 14px; margin-top:12px; }
    .aircraft-display { grid-template-columns:1fr; gap:12px; }
    .aircraft-photo { max-height:34vh; aspect-ratio:auto; height:34vh; }
  }
  @media (max-width:560px) {
    header { display:none; }
    .fs-btn span, .set-btn span { display:none; }
    .f-row { grid-template-columns:1fr; }
    .f-lab { border-right:none; background:transparent; padding:8px 12px 0; }
    .big-prompt { font-size:34px; }
    .co-sc-row { grid-template-columns:110px 1fr; }
    .hg-stats { grid-template-columns:repeat(2,1fr); }
  }
  /* nízke okná notebookov: menej vzduchu, aby sa otázka zmestila */
  @media (min-width:1101px) and (max-height:820px) {
    .qcard { padding:20px 26px; min-height:0; }
    .big-prompt { margin:14px 0 8px; font-size:52px; }
    .big-prompt.small { font-size:32px; }
    .hint-row { margin:8px 0 4px; min-height:0; padding:8px 14px; }
    .input-row { margin-top:10px; }
    .input-row input { padding:12px 16px; }
    .aircraft-photo { max-height:38vh; }
    .tabs { margin-bottom:12px; }
    header { margin-bottom:12px; padding:10px 20px; }
  }

  /* ===== MOD 01 porovnanie · MOD 05 počty · MOD 06 scenár · vzor ===== */
  .hg-task small { display:block; margin-top:6px; font-size:12.5px; line-height:1.5; color:var(--text-dim); font-weight:500; }
  .hg-task small b { color:var(--amber); letter-spacing:0.06em; font-size:11px; }
  .cmp-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px; }
  .cmp-card { position:relative; background:rgba(255,255,255,0.07); border:2px solid var(--border-bright); border-radius:16px; padding:8px; cursor:pointer; text-align:left; font-family:var(--ui); transition:transform 0.16s ease, box-shadow 0.18s ease, border-color 0.18s ease; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .cmp-card:hover:not(.done) { transform:translateY(-3px); border-color:#3fe39a; box-shadow:0 12px 28px rgba(10,157,92,0.18); } }
  .cmp-card .aircraft-photo { aspect-ratio:16/10; height:auto; max-height:none; }
  .cmp-n { display:inline-block; margin:8px 4px 2px; font-family:var(--mono); font-size:10px; font-weight:700; letter-spacing:0.16em; color:var(--text-faint); }
  .cmp-name { display:block; margin:0 4px 4px; font-weight:800; font-size:14px; color:var(--text); min-height:18px; }
  .cmp-card.done { cursor:default; }
  .cmp-card.ok { border-color:#3fe39a; background:rgba(63,227,154,.14); animation:pulseOk 0.7s ease-out; }
  .cmp-card.no { border-color:var(--red); background:var(--red-bg); animation:shakeNo 0.28s ease; }
  .hc-wrap { background:rgba(255,255,255,0.07); display:flex; justify-content:center; --ar:1; }
  .hc-svg { max-width:420px; }
  .hc-ring { fill:#f5f8f6; stroke:var(--border-bright); stroke-width:1.5; }
  .hc-ticks line { stroke:#5d6d65; stroke-width:1.4; }
  .hc-ticks text { font-family:var(--mono); font-size:10px; font-weight:700; fill:#16221c; text-anchor:middle; }
  .hc-from line { stroke:hsl(var(--ah) calc(88% * var(--asf)) 33%); stroke-width:4; stroke-linecap:round; } .hc-from path { fill:hsl(var(--ah) calc(88% * var(--asf)) 33%); }
  .hc-to line { stroke:#b06a00; stroke-width:4; stroke-linecap:round; stroke-dasharray:7 5; } .hc-to path { fill:#b06a00; }
  .hc-to, .hc-from { transition:transform 0.4s ease; }
  .hc-hub { fill:#16221c; }
  .hc-rule { margin-top:10px; padding:10px 14px; background:var(--green-bg); border-radius:12px; font-size:12.5px; line-height:1.55; color:var(--text); }
  .hc-rule b { display:block; font-family:var(--mono); font-size:9.5px; letter-spacing:0.16em; color:var(--green); margin-bottom:2px; }
  .sc-steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:8px; margin-top:10px; }
  .sc-step { display:flex; flex-wrap:wrap; align-items:center; gap:6px; padding:8px 10px; background:var(--panel-2); border:1px solid var(--border); border-radius:12px; font-size:11px; font-weight:700; color:var(--text-faint); }
  .sc-step b { width:20px; height:20px; border-radius:50%; background:var(--border-bright); color:#fff; display:flex; align-items:center; justify-content:center; font-size:10px; }
  .sc-step.now { border-color:var(--amber); background:var(--amber-bg); color:var(--amber); } .sc-step.now b { background:var(--amber); }
  .sc-step.ok { border-color:#3fe39a; background:rgba(63,227,154,.14); color:#4ee6a4; } .sc-step.ok b { background:#3fe39a; }
  .sc-step.no { border-color:var(--red); background:var(--red-bg); color:var(--red); } .sc-step.no b { background:var(--red); }
  .sc-step em { flex-basis:100%; font-style:normal; font-family:var(--mono); font-size:10.5px; }
  .demo-btn { background:rgba(255,255,255,0.07); border:1px solid var(--amber); color:var(--amber); padding:8px 14px; font-family:var(--ui); font-size:11.5px; font-weight:800; letter-spacing:0.06em; border-radius:12px; cursor:pointer; white-space:nowrap; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .demo-btn:hover { background:var(--amber-bg); } }
  body.exam-on .demo-btn { display:none; }
  .demo-bubble { position:fixed; z-index:80; display:none; max-width:340px; background:#16221c; color:#ffffff; font-family:var(--ui); font-size:13.5px; font-weight:600; line-height:1.5; padding:12px 16px; border-radius:14px; box-shadow:0 14px 40px rgba(0,0,0,0.4); border:1px solid rgba(255,255,255,0.14); pointer-events:none; animation:popIn 0.22s ease both; }
  .demo-hl { outline:3px solid var(--amber) !important; outline-offset:4px; border-radius:12px; box-shadow:0 0 0 9999px hsl(var(--ah) calc(47% * var(--asf)) 6% / 0.28) !important; position:relative; z-index:60; }
  /* počas ukážky sa nedá klikať na otázku — len na tlačidlo, ktoré ju ukončí */
  body.demo-on #qcard, body.demo-on .controls, body.demo-on .tabs { pointer-events:none; }
  body.demo-on .demo-btn { background:var(--amber); color:#ffffff; position:relative; z-index:90; }
  @media (max-width:1100px) { .demo-btn { padding:6px 10px; font-size:10.5px; } .hc-svg { max-width:min(300px, 36vh); } }
  @media (max-width:560px) { .demo-btn span { display:none; } .aircraft-photo { height:24vh; max-height:24vh; } .cmp-card .aircraft-photo { height:auto; } .qcard.split > .map-wrap, .qcard .map-wrap { max-width:calc(34vh * var(--ar, 1.4)); } .hg-task strong { font-size:15.5px; } .hg-task small { font-size:11.5px; } }

  /* ===== doladenie výšky: hlavička panelu v jednom riadku, nízke okná ===== */
  .app { max-width:1180px; }
  .panel-head { flex-wrap:nowrap; }
  .panel-head > div:first-child { min-width:0; overflow:hidden; text-overflow:ellipsis; }
  .stats { flex-wrap:nowrap; flex:none; }
  @media (min-width:1101px) and (max-height:820px) {
    header { display:none; }
    .app { padding-top:10px; }
    .tabs { margin-bottom:10px; }
    .tab { padding:9px 14px; }
    .panel-head { padding:10px 22px; }
    .qcard { padding:16px 26px; }
    .qmeta { margin-bottom:8px; }
    .aircraft-display { grid-template-columns:300px 1fr; margin-bottom:8px; gap:18px; }
    .choice-grid { margin-top:10px; gap:8px; }
    .choice-btn { padding:11px 12px 11px 30px; font-size:14.5px; }
    .hg-task { padding:10px 14px; }
    .hg-task strong { font-size:18px; }
    .co-sc-row span, .co-sc-row strong { padding:6px 12px; }
    .co-sc-title { padding:8px 12px; }
    .sc-step { padding:6px 8px; }
    .cmp-card .aircraft-photo { aspect-ratio:auto; height:30vh; }
    .hc-svg { max-width:min(420px, 42vh); }
  }
  @media (max-width:1100px) {
    .panel-head { flex-wrap:wrap; }
    .qcard:has(.co-sc) .map-wrap { max-width:calc(30vh * var(--ar, 1.87)); margin-left:auto; margin-right:auto; }
    .stats { flex-wrap:wrap; }
  }
  @media (max-width:560px) {
    .panel-head { padding:8px 12px; gap:6px; }
    .panel-head > div:first-child { flex-basis:100%; }
    .stats { flex-basis:100%; justify-content:flex-start; flex-wrap:nowrap; gap:5px; }
    .stat:nth-of-type(3) { display:none; }
    .stat { padding:3px 8px; }
    .qcard:has(.co-sc) .map-wrap { max-width:calc(15vh * var(--ar, 1.87)); }
    .qcard[data-mode="aircraft"] .aircraft-photo { height:22vh; max-height:22vh; }
    .co-sc-title { font-size:11px; padding:7px 10px; }
    .co-sc-row span, .co-sc-row strong { padding:5px 10px; font-size:12.5px; }
    .sc-steps { gap:5px; margin-top:6px; } .sc-step { padding:5px 7px; font-size:10px; }
    .hint-row { padding:6px 10px; }
    .choice-btn { padding:11px 6px 11px 24px; font-size:13.5px; }
    .hc-svg { max-width:min(250px, 30vh); }
    .hc-rule { font-size:11.5px; padding:8px 10px; }
  }

  /* ===== SÚŤAŽ: rebríček a Dobyvateľ ===== */
  @media (min-width:1101px) {
    .tabs, .app.wide .tabs { display:flex; gap:7px; }
    .tab { flex:1 1 auto; padding:12px 9px; }
    .tab .tab-label { font-size:10.5px; white-space:nowrap; }
    .tab .tab-num { font-size:9.5px; }
  }
  .tab[data-mode="conquer"], .tab[data-mode="rank"] { border-color:rgba(255,196,84,0.45); }
  .tab[data-mode="conquer"] .tab-num, .tab[data-mode="rank"] .tab-num { color:#ffc454; }
  body.on-comp #btn-demo, body.on-comp #btn-set, body.on-comp .stats .stat { display:none; }
  .home-dash.comp { grid-template-columns:1fr 1fr; margin-top:14px; }
  .home-cta.gold { background:linear-gradient(135deg,#2a1f08,#5a4310); color:#f6e7c1; }
  .rk h2, .dq-home h2 { font-family:var(--display); font-size:26px; font-weight:800; letter-spacing:-0.01em; margin:0 0 6px; color:var(--text); }
  .rk-head { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; }
  .rk-head p, .dq-lead { margin:0; color:var(--text-dim); font-size:14.5px; line-height:1.55; max-width:760px; }
  .rk .btn, .dq-home .btn, .dq-game .btn { height:44px; padding:0 20px; white-space:nowrap; }
  .rk-warn { margin-top:14px; padding:11px 14px; border-radius:12px; background:hsla(44,85%,62%,0.16); border:1px solid #ecd28a; color:hsl(44,74%,79%); font-size:13px; line-height:1.5; }
  .rk-err { margin-top:10px; padding:9px 12px; border-radius:10px; background:hsla(3,82%,62%,0.16); border:1px solid #f0b4ae; color:hsl(5,71%,73%); font-size:13px; font-weight:600; }
  .rk-acct { margin-top:16px; padding:16px 18px; border-radius:16px; background:var(--panel-2); border:1px solid var(--border); }
  .rk-acct.in { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:14px; }
  .rk-acct-t strong { display:block; font-size:15px; } .rk-acct-t span { font-size:13px; color:var(--text-dim); }
  .rk-form { display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
  .rk-form input, .dq-box input { flex:1 1 170px; min-width:0; height:44px; padding:0 14px; border-radius:12px; border:1.5px solid var(--border-bright); font-family:var(--ui); font-size:15px; font-weight:600; color:var(--text); background:rgba(255,255,255,0.07); outline:none; }
  .rk-form input:focus, .dq-box input:focus { border-color:var(--green-strong); box-shadow:0 0 0 3px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.18); }
  .rk-me { margin-top:16px; padding:16px 18px; border-radius:16px; background:linear-gradient(135deg,hsl(var(--ah) calc(39% * var(--asf)) 10%),hsl(var(--ah) calc(61% * var(--asf)) 20%)); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); }
  .rk-me-top { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
  .rk-me-top b { display:block; font-size:24px; font-weight:800; color:#fff; } .rk-me-top span { font-size:11.5px; letter-spacing:0.06em; text-transform:uppercase; opacity:0.75; }
  .rk-bars { margin-top:14px; display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:6px 22px; }
  .rk-bars > div { display:grid; grid-template-columns:82px 1fr 118px; align-items:center; gap:8px; font-size:11.5px; }
  .rk-bars i { height:7px; border-radius:99px; background:rgba(255,255,255,0.14); overflow:hidden; display:block; } .rk-bars em { display:block; height:100%; background:hsl(var(--ah) calc(75% * var(--asf)) 57%); border-radius:99px; }
  .rk-bars small { text-align:right; opacity:0.8; font-size:11px; }
  .rk-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:18px; }
  .rk-chip { border:1.5px solid var(--border-bright); background:rgba(255,255,255,0.07); color:var(--text-dim); font-family:var(--ui); font-weight:700; font-size:12px; letter-spacing:0.04em; padding:7px 12px; border-radius:99px; cursor:pointer; }
  .rk-chip.on { background:var(--green-strong); border-color:var(--green-strong); color:var(--ac-ink); }
  .rk-tbl { margin-top:12px; overflow-x:auto; border:1px solid var(--border); border-radius:14px; }
  .rk-tbl table { width:100%; border-collapse:collapse; font-size:14px; }
  .rk-tbl th { text-align:left; font-size:10.5px; letter-spacing:0.1em; color:var(--text-dim); padding:10px 12px; background:var(--panel-2); white-space:nowrap; }
  .rk-tbl td { padding:10px 12px; border-top:1px solid var(--border); white-space:nowrap; font-variant-numeric:tabular-nums; }
  .rk-tbl tr.me td { background:var(--green-bg); font-weight:700; }
  .rk-pos { width:44px; font-weight:800; } .rk-nick { font-weight:700; width:40%; } .rk-pts { font-weight:800; color:var(--green); }
  .rk-empty { margin-top:14px; padding:26px; text-align:center; color:var(--text-dim); border:1px dashed var(--border-bright); border-radius:14px; }

  .dq-rules { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:16px 0; }
  .dq-rules > div { position:relative; padding:14px 14px 14px 46px; border-radius:14px; background:var(--panel-2); border:1px solid var(--border); }
  .dq-rules b { position:absolute; left:12px; top:13px; width:24px; height:24px; border-radius:50%; background:var(--green-strong); color:var(--ac-ink); font-size:13px; display:flex; align-items:center; justify-content:center; }
  .dq-rules strong { display:block; font-size:12.5px; letter-spacing:0.08em; margin-bottom:3px; } .dq-rules span { font-size:13px; line-height:1.5; color:var(--text-dim); }
  .dq-start { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
  .dq-box { padding:16px; border-radius:16px; border:1.5px solid var(--border); background:rgba(255,255,255,0.07); display:flex; flex-direction:column; gap:9px; }
  .dq-box strong { font-size:11.5px; letter-spacing:0.1em; color:var(--text-dim); } .dq-box span { font-size:12.5px; color:var(--text-dim); line-height:1.45; }
  .dq-box input { flex:none; width:100%; } .dq-as { font-size:20px; font-weight:800; }
  .dq-row { display:flex; gap:8px; } .dq-row input { flex:1 1 0; width:auto; text-transform:uppercase; letter-spacing:0.3em; font-family:var(--mono); text-align:center; }
  .dq-code { margin:14px 0; padding:18px; border-radius:18px; background:linear-gradient(135deg,hsl(var(--ah) calc(39% * var(--asf)) 10%),hsl(var(--ah) calc(61% * var(--asf)) 20%)); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); text-align:center; }
  .dq-code span { display:block; font-size:11px; letter-spacing:0.16em; opacity:0.75; } .dq-code b { display:block; font-family:var(--mono); font-size:52px; letter-spacing:0.22em; color:#fff; line-height:1.15; margin-left:0.22em; } .dq-code small { font-size:13px; opacity:0.85; }
  .dq-lobby, .dq-score, .dq-end { display:flex; flex-direction:column; gap:6px; }
  .dq-pl { display:flex; align-items:center; gap:10px; padding:9px 12px; border-radius:12px; border:1.5px solid var(--border); background:rgba(255,255,255,0.07); font-size:14px; }
  .dq-pl i { width:14px; height:14px; border-radius:50%; flex:none; } .dq-pl span { flex:1; font-weight:700; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .dq-pl em { font-style:normal; font-weight:600; font-size:11.5px; color:var(--text-dim); } .dq-pl small { color:var(--text-dim); font-size:12px; } .dq-pl b { font-size:16px; font-variant-numeric:tabular-nums; min-width:48px; text-align:right; }
  .dq-pl.act { border-color:var(--green-strong); box-shadow:0 0 0 3px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.15); } .dq-pl.dead { opacity:0.45; text-decoration:line-through; } .dq-pl.off span { color:var(--text-dim); }
  .dq-pl.empty { border-style:dashed; color:var(--text-dim); } .dq-pl.empty span { font-weight:500; }
  .dq-x { border:none; background:none; color:hsl(5,71%,73%); font-size:15px; cursor:pointer; padding:2px 6px; }
  .dq-acts { display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
  .dq-note { margin-top:9px; font-size:12.5px; color:var(--text-dim); line-height:1.45; }
  .dq-game { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(320px,1fr); gap:22px; align-items:start; }
  .dq-map { width:100%; height:auto; display:block; max-height:calc(100vh - 210px); max-height:calc(100dvh - 210px); }
  .dq-cell { stroke:#fff; stroke-width:2.5; stroke-linejoin:round; transition:fill 0.35s, fill-opacity 0.2s; }
  .dq-cell.can { stroke:hsl(var(--ah) calc(48% * var(--asf)) 8%); stroke-width:4; stroke-dasharray:9 6; animation:dqDash 0.9s linear infinite; }
  .dq-cell.click { cursor:pointer; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-cell.click:hover { fill-opacity:1; filter:brightness(1.12); } }
  .dq-cell.tgt { stroke:hsl(var(--ah) calc(48% * var(--asf)) 8%); stroke-width:5; }
  .dq-out { fill:none; stroke:hsl(var(--ah) calc(48% * var(--asf)) 8%); stroke-width:3; stroke-linejoin:round; pointer-events:none; }
  .dq-lab { pointer-events:none; } .dq-lab text { text-anchor:middle; font-family:var(--mono); font-size:19px; font-weight:800; fill:#40584c; }
  .dq-lab.own text { fill:#fff; paint-order:stroke; stroke:rgba(0,0,0,0.45); stroke-width:3.5px; }
  .dq-base { fill:none; stroke:#fff; stroke-width:3.5; } .dq-lab text.dq-lives { font-size:17px; fill:#fff; stroke:rgba(0,0,0,0.55); stroke-width:3px; paint-order:stroke; font-family:var(--ui); }
  @keyframes dqDash { to { stroke-dashoffset:-15; } }
  .dq-banner { margin-top:10px; padding:10px 14px; border-radius:12px; background:hsl(var(--ah) calc(39% * var(--asf)) 10%); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); font-size:13.5px; line-height:1.45; }
  .dq-banner b { display:block; font-size:11px; letter-spacing:0.12em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); margin-bottom:2px; }
  .dq-timer { height:7px; border-radius:99px; background:var(--panel-2); overflow:hidden; margin:8px 0 2px; } .dq-timer i { display:block; height:100%; background:var(--green-strong); border-radius:99px; } .dq-timer i.low { background:#e4572e; }
  .dq-q { margin-top:10px; text-align:center; } .dq-q-mod { font-size:10.5px; letter-spacing:0.14em; color:var(--text-dim); font-weight:700; }
  .dq-q-p { font-family:var(--display); font-size:clamp(22px,2.6vw,34px); font-weight:800; line-height:1.15; margin:4px 0; color:var(--text); overflow-wrap:anywhere; } .dq-q-s { font-size:14px; color:var(--text-dim); }
  .dq-opts { margin-top:12px; } .dq-opts .choice-btn { font-size:14.5px; padding:13px 10px 13px 30px; overflow-wrap:anywhere; } .dq-opts .choice-btn.sel { border-color:hsl(var(--ah) calc(48% * var(--asf)) 8%); background:hsla(144,17%,62%,0.16); opacity:1; }
  .dq-res { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; } .dq-res span { display:flex; align-items:center; gap:6px; padding:6px 10px; border-radius:99px; font-size:12.5px; font-weight:700; background:var(--panel-2); }
  .dq-res span.ok { background:rgba(63,227,154,.14); color:#4ee6a4; } .dq-res span.no { background:hsla(3,82%,62%,0.16); color:hsl(5,71%,73%); } .dq-res i { width:10px; height:10px; border-radius:50%; }
  .dq-big { margin-top:12px; padding:26px 16px; border-radius:16px; border:1.5px dashed var(--border-bright); text-align:center; font-size:17px; font-weight:800; color:var(--text-dim); }
  .dq-big.me { border-color:var(--green-strong); background:var(--green-bg); color:var(--green); animation:pulseOk 1.2s ease-in-out infinite; }
  .dq-end { margin-top:12px; } .dq-end .dq-pl b { min-width:22px; text-align:left; } .dq-end .dq-pl em { color:var(--green); font-weight:800; }
  .dq-quit { margin-top:12px; border:none; background:none; color:var(--text-dim); font-size:12px; text-decoration:underline; cursor:pointer; padding:0; font-family:var(--ui); }
  @media (max-width:1100px) {
    .dq-game { grid-template-columns:1fr; gap:10px; } .dq-map { max-height:34vh; margin:0 auto; }
    .dq-score { flex-direction:row; flex-wrap:wrap; } .dq-score .dq-pl { flex:1 1 150px; padding:6px 10px; } .dq-score .dq-pl small { display:none; }
  }
  @media (max-width:760px) {
    .dq-rules, .dq-start, .home-dash.comp { grid-template-columns:1fr; } .rk-me-top { grid-template-columns:1fr 1fr; }
    .rk-head { flex-direction:column; } .rk-acct.in { flex-direction:column; align-items:flex-start; }
    .dq-code b { font-size:40px; } .dq-q-p { font-size:22px; } .dq-big { padding:16px; font-size:15px; }
    .dq-opts .choice-btn { font-size:13px; padding:11px 6px 11px 24px; } .dq-banner { font-size:12.5px; padding:8px 12px; }
    .rk-tbl td, .rk-tbl th { padding:8px 9px; font-size:12.5px; }
  }

  /* ===== DOBYVATEĽ v2 — VFR mapa priestorov ===== */
  .qcard.dq-on { padding:16px; }
  .dq-game { grid-template-columns:minmax(0,1.8fr) minmax(330px,1fr); gap:16px; }
  .dq-stage { background:radial-gradient(120% 120% at 30% 15%, hsl(var(--ah) calc(43% * var(--asf)) 18%) 0%, hsl(var(--ah) calc(41% * var(--asf)) 7%) 72%); border-radius:18px; padding:10px 12px; box-shadow:inset 0 0 0 1px rgba(255,255,255,0.07), 0 10px 30px hsl(var(--ah) calc(65% * var(--asf)) 3% / 0.25); }
  .dq-map { max-height:calc(100vh - 262px); max-height:calc(100dvh - 262px); margin:0 auto; }
  .dq-halo { fill:hsl(var(--ah) calc(75% * var(--asf)) 57%); opacity:0.30; }
  .dq-cell { stroke:hsl(var(--ah) calc(41% * var(--asf)) 7%); stroke-width:0.9; stroke-opacity:0.5; stroke-linejoin:round; stroke-dasharray:none; animation:none; transition:fill 0.4s; }
  .dq-cell.c-AD { stroke-opacity:0.95; stroke-width:1.3; }
  .dq-cell.own { stroke:#ffffff; stroke-opacity:0.9; stroke-width:1.1; }
  .dq-cell.c-G.own { fill-opacity:0.62; }
  .dq-cell.can { stroke:hsl(var(--ah) calc(67% * var(--asf)) 5%); stroke-opacity:1; stroke-width:1.9; stroke-dasharray:5 3; animation:dqPulse 1s ease-in-out infinite; }
  .dq-cell.click { cursor:pointer; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-cell.click:hover { filter:brightness(1.18) saturate(1.3); fill-opacity:1; animation:none; } }
  .dq-cell.tgt { stroke:#ffffff; stroke-width:3; stroke-opacity:1; stroke-dasharray:none; animation:dqPulse 0.6s ease-in-out infinite; }
  .dq-cell.flash { animation:dqFlash 1s ease-out; }
  @keyframes dqPulse { 50% { fill-opacity:0.5; } }
  @keyframes dqFlash { 0% { filter:brightness(2.4); } 100% { filter:none; } }
  .dq-out { fill:none; stroke:hsl(var(--ah) calc(100% * var(--asf)) 96%); stroke-width:1.5; stroke-opacity:0.9; stroke-linejoin:round; pointer-events:none; }
  text.dq-lab { text-anchor:middle; dominant-baseline:middle; font-family:var(--mono); font-weight:800; fill:#22382e; pointer-events:none; stroke:none; }
  text.dq-lab .t { font-size:0.72em; opacity:0.72; }
  text.dq-lab.own { fill:#ffffff; paint-order:stroke; stroke:rgba(0,0,0,0.5); stroke-width:1.6px; }
  text.dq-lab.ad { font-size:6.3px; dominant-baseline:auto; }
  text.dq-lab.g { font-size:15px; opacity:0.4; letter-spacing:0.12em; }
  text.dq-lab.g.own { opacity:0.9; }
  .dq-info { display:flex; align-items:center; gap:10px; flex-wrap:wrap; min-height:32px; margin-top:6px; padding:6px 12px; border-radius:10px; background:rgba(255,255,255,0.08); color:hsl(var(--ah) calc(32% * var(--asf)) 86%); font-size:12.5px; line-height:1.3; }
  .dq-info b { font-family:var(--mono); color:#fff; font-size:14px; } .dq-info em { font-style:normal; font-weight:800; color:#ffc454; } .dq-info i { width:10px; height:10px; border-radius:50%; } .dq-info small { opacity:0.8; font-size:12px; }
  .dq-legend { display:flex; flex-wrap:wrap; gap:4px 14px; margin-top:7px; font-size:11px; letter-spacing:0.04em; color:#a9c7b8; }
  .dq-legend span { display:flex; align-items:center; gap:5px; } .dq-legend i { width:11px; height:11px; border-radius:3px; } .dq-legend b { color:#fff; }
  .dq-pl { position:relative; overflow:hidden; } .dq-pl u { position:absolute; left:0; bottom:0; height:3px; border-radius:0 3px 0 0; transition:width 0.5s; opacity:0.85; }
  .dq-pl em.in { color:var(--green); }
  .dq-opts .choice-btn { position:relative; } .dq-who { position:absolute; right:8px; top:50%; transform:translateY(-50%); display:flex; gap:3px; } .dq-who i { width:10px; height:10px; border-radius:50%; box-shadow:0 0 0 1.5px rgba(255,255,255,0.16); }
  .dq-lobby-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.25fr); gap:16px; align-items:start; margin-top:6px; }
  .dq-lobby-grid .dq-code { margin-top:0; }
  .dq-cfg { padding:16px; border-radius:16px; border:1.5px solid var(--border); background:rgba(255,255,255,0.07); }
  .dq-cfg-t { font-size:11.5px; letter-spacing:0.1em; font-weight:800; color:var(--text-dim); margin-bottom:8px; } .dq-cfg-t em { font-style:normal; font-weight:600; letter-spacing:0; }
  .dq-cfg-row { display:grid; grid-template-columns:150px 1fr; gap:8px; align-items:center; padding:7px 0; border-top:1px solid var(--border); }
  .dq-cfg-row > span { font-size:11px; letter-spacing:0.08em; font-weight:700; color:var(--text-dim); } .dq-cfg-row > div { display:flex; flex-wrap:wrap; gap:5px; }
  .dq-cfg .rk-chip:disabled { cursor:default; opacity:0.75; } .dq-cfg .rk-chip.on:disabled { opacity:1; }
  .dq-src { margin-top:14px; font-size:11.5px; color:var(--text-dim); }
  @media (max-width:1100px) {
    .dq-game { grid-template-columns:1fr; gap:10px; } .dq-map { max-height:38vh; } .dq-lobby-grid { grid-template-columns:1fr; }
  }
  @media (max-width:760px) {
    .qcard.dq-on { padding:10px; } .dq-stage { padding:6px 8px; border-radius:14px; } .dq-legend { display:none; } .dq-map { max-height:32vh; }
    .dq-info { font-size:11.5px; padding:5px 9px; min-height:28px; gap:7px; } .dq-cfg-row { grid-template-columns:1fr; gap:4px; }
  }

  /* ===== DOBYVATEĽ v3 — mapa cez celú obrazovku, otázka ako okno ===== */
  body.dq-live { overflow:hidden; }
  #dq-stage { position:fixed; inset:0; z-index:90; display:flex; flex-direction:column; background:radial-gradient(130% 100% at 50% 0%, hsl(var(--ah) calc(43% * var(--asf)) 16%) 0%, hsl(var(--ah) calc(46% * var(--asf)) 5%) 72%); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); font-family:var(--ui); user-select:none; -webkit-user-select:none; }
  .dq-top { display:flex; align-items:center; gap:14px; padding:8px 14px; background:hsl(var(--ah) calc(56% * var(--asf)) 4% / 0.62); border-bottom:1px solid hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.2); }
  .dq-brand { display:flex; flex-direction:column; line-height:1.15; } .dq-brand b { font-size:13px; letter-spacing:0.16em; color:#fff; } .dq-brand span { font-family:var(--mono); font-size:10.5px; letter-spacing:0.08em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); }
  .dq-players { display:flex; gap:8px; flex:1; flex-wrap:wrap; min-width:0; }
  .dq-chip { display:flex; align-items:center; gap:8px; padding:6px 12px; border-radius:12px; background:rgba(255,255,255,0.07); border:1.5px solid rgba(255,255,255,0.08); font-size:13.5px; font-weight:700; color:#fff; min-width:0; }
  .dq-chip i { width:12px; height:12px; border-radius:50%; background:var(--c); box-shadow:0 0 10px var(--c); flex:none; }
  .dq-chip span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .dq-chip em { font-style:normal; font-weight:600; font-size:11px; opacity:0.65; }
  .dq-chip small { font-family:var(--mono); font-size:11px; opacity:0.7; } .dq-chip small::after { content:' úz.'; }
  .dq-chip b { font-family:var(--mono); font-size:15px; color:#fff; }
  .dq-chip.act { border-color:var(--c); box-shadow:0 0 0 3px color-mix(in srgb, var(--c) 30%, transparent); background:rgba(255,255,255,0.12); } .dq-chip.off { opacity:0.45; }
  .dq-tools { display:flex; gap:6px; flex:none; }
  .dq-tools button, .dq-btn { height:34px; min-width:34px; padding:0 10px; border-radius:10px; border:1px solid rgba(255,255,255,0.18); background:rgba(255,255,255,0.07); color:#fff; font-family:var(--ui); font-weight:800; font-size:14px; cursor:pointer; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-tools button:hover, :where(html:not(.touch)) .dq-btn:hover { background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.18); border-color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } } .dq-tools .x { font-size:11.5px; letter-spacing:0.08em; }
  .dq-btn { font-size:12px; letter-spacing:0.08em; padding:0 16px; height:40px; } .dq-btn.pri { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); border-color:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:hsl(154,67%,88%); } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-btn.pri:hover { background:hsl(var(--ah) calc(75% * var(--asf)) 57%); } }
  .dq-status { position:relative; display:flex; align-items:center; gap:12px; padding:8px 16px 10px; font-size:14px; background:hsl(var(--ah) calc(56% * var(--asf)) 4% / 0.36); flex-wrap:wrap; }
  .dq-status b { font-family:var(--mono); font-size:11px; letter-spacing:0.14em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); white-space:nowrap; } .dq-status span { flex:1; min-width:200px; }
  .dq-status.me { background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.2); color:var(--ac-ink); font-weight:700; animation:dqMe 1.1s ease-in-out infinite; }
  @keyframes dqMe { 50% { background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.32); } }
  .dq-status .dq-timer { position:absolute; left:0; right:0; bottom:0; height:3px; margin:0; border-radius:0; background:rgba(255,255,255,0.08); }
  #dq-stage .dq-timer i { display:block; height:100%; background:linear-gradient(90deg,hsl(var(--ah) calc(83% * var(--asf)) 42%),hsl(var(--ah) calc(75% * var(--asf)) 57%)); border-radius:99px; } #dq-stage .dq-timer i.low { background:#ff7a59; }
  .dq-mapwrap { position:relative; flex:1; min-height:0; padding:6px 10px; }
  #dq-stage .dq-map { width:100%; height:100%; max-height:none; margin:0; touch-action:none; }
  .dq-bottom { display:flex; gap:6px 16px; align-items:center; padding:6px 14px 9px; flex-wrap:wrap; background:hsl(var(--ah) calc(56% * var(--asf)) 4% / 0.5); }
  .dq-bottom .dq-info { flex:1 1 380px; margin:0; } .dq-bottom .dq-legend { margin:0; }
  /* okno s otázkou */
  .dq-pop-wrap { position:absolute; inset:0; z-index:5; display:flex; align-items:center; justify-content:center; padding:14px; background:rgba(3,10,7,0.66); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); animation:dqFade 0.22s ease-out; }
  .dq-pop { position:relative; width:min(700px,100%); max-height:100%; overflow:auto; padding:20px 26px 18px; border-radius:22px; background:linear-gradient(180deg,hsl(var(--ah) calc(48% * var(--asf)) 13%) 0%,hsl(var(--ah) calc(48% * var(--asf)) 6%) 100%); border:1px solid hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.45);
    box-shadow:0 30px 90px rgba(0,0,0,0.65), 0 0 60px hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.12), inset 0 1px 0 rgba(255,255,255,0.07); animation:dqPop 0.32s var(--spring-soft); }
  .dq-pop::before, .dq-pop::after { content:''; position:absolute; width:22px; height:22px; border:2.5px solid hsl(var(--ah) calc(75% * var(--asf)) 57%); pointer-events:none; }
  .dq-pop::before { left:9px; top:9px; border-right:none; border-bottom:none; border-radius:12px 0 0 0; } .dq-pop::after { right:9px; bottom:9px; border-left:none; border-top:none; border-radius:0 0 12px 0; }
  @keyframes dqFade { from { opacity:0; } } @keyframes dqPop { from { opacity:0; transform:translateY(14px) scale(0.96); } }
  .dq-pop-top { display:flex; align-items:center; justify-content:space-between; gap:10px; font-family:var(--mono); font-size:11px; letter-spacing:0.14em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); font-weight:700; }
  .dq-pop-stage { color:#a9c7b8; } .dq-pop-time { font-size:26px; letter-spacing:0; color:#fff; min-width:44px; text-align:right; font-weight:800; line-height:1; } .dq-pop-time.low { color:#ff7a59; }
  .dq-pop .dq-timer { height:5px; margin:10px 0 0; background:rgba(255,255,255,0.1); border-radius:99px; overflow:hidden; }
  .dq-pop-ctx { margin-top:12px; text-align:center; font-size:14px; font-weight:800; color:#ffc454; }
  .dq-pop-q { margin-top:14px; text-align:center; font-family:var(--display); font-weight:800; font-size:clamp(28px,5.2vw,54px); line-height:1.08; color:#fff; text-shadow:0 0 30px hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.4); overflow-wrap:anywhere; }
  .dq-pop-s { margin-top:8px; text-align:center; font-size:16px; color:#b9d6c8; }
  .dq-pop .dq-opts { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:18px; }
  .dq-pop .choice-btn { display:flex; align-items:center; gap:12px; min-height:60px; padding:12px 14px; text-align:left; background:rgba(255,255,255,0.06); border:1.5px solid rgba(255,255,255,0.18); border-radius:14px; color:#fff;
    font-family:var(--ui); font-size:17px; font-weight:700; letter-spacing:0; box-shadow:none; opacity:1; animation:none; transition:background 0.12s, border-color 0.12s, transform 0.08s; overflow-wrap:anywhere; }
  .dq-pop .choice-btn::before { content:none; }
  .dq-pop .choice-btn kbd { flex:none; width:28px; height:28px; border-radius:8px; background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.16); border:1px solid hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.5); color:hsl(var(--ah) calc(75% * var(--asf)) 57%); font-family:var(--mono); font-size:13px; font-weight:800; display:flex; align-items:center; justify-content:center; }
  .dq-pop .choice-btn > span:not(.dq-who) { flex:1; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-pop .choice-btn:not(:disabled):hover { background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.16); border-color:hsl(var(--ah) calc(75% * var(--asf)) 57%); transform:translateY(-1px); } }
  .dq-pop .choice-btn:disabled { cursor:default; color:rgba(255,255,255,0.72); }
  .dq-pop .choice-btn.sel { border-color:#ffc454; background:rgba(255,196,84,0.16); color:#fff; }
  .dq-pop .choice-btn.ok { border-color:#3fe39a; background:#0f8f55; color:#fff; } .dq-pop .choice-btn.ok kbd { background:rgba(255,255,255,0.07); color:hsl(153,81%,76%); border-color:rgba(255,255,255,0.16); }
  .dq-pop .choice-btn.no { border-color:#ff7a59; background:rgba(228,87,46,0.3); color:#fff; }
  .dq-pop .dq-who { position:static; transform:none; display:flex; gap:3px; }
  .dq-pop-foot { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:14px; font-size:12.5px; }
  .dq-pop-foot span { display:flex; align-items:center; gap:6px; padding:5px 10px; border-radius:99px; background:rgba(255,255,255,0.07); color:hsl(var(--ah) calc(32% * var(--asf)) 86%); font-weight:700; }
  .dq-pop-foot span i { width:9px; height:9px; border-radius:50%; } .dq-pop-foot span.in, .dq-pop-foot span.ok { background:rgba(63,227,154,0.2); color:#fff; } .dq-pop-foot span.no { background:rgba(228,87,46,0.28); color:#fff; }
  .dq-pop-foot em { font-style:normal; color:#a9c7b8; margin-left:auto; }
  .dq-endlist { display:flex; flex-direction:column; gap:6px; margin-top:16px; }
  .dq-endlist > div { display:flex; align-items:center; gap:10px; padding:10px 14px; border-radius:12px; background:rgba(255,255,255,0.06); border:1.5px solid transparent; color:#fff; font-size:15px; }
  .dq-endlist > div.me { border-color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .dq-endlist b { width:24px; font-family:var(--mono); } .dq-endlist i { width:12px; height:12px; border-radius:50%; } .dq-endlist span { flex:1; font-weight:700; }
  .dq-endlist small { color:#a9c7b8; font-size:12px; } .dq-endlist strong { font-family:var(--mono); font-size:17px; } .dq-endlist em { font-style:normal; color:#ffc454; font-weight:800; font-size:12px; }
  .dq-endacts { display:flex; gap:8px; margin-top:14px; flex-wrap:wrap; justify-content:center; }
  @media (max-width:760px) {
    .dq-top { flex-wrap:wrap; gap:6px 10px; padding:6px 8px; } .dq-brand { display:none; } .dq-players { order:2; flex-basis:100%; gap:5px; }
    .dq-chip { padding:4px 8px; font-size:12px; gap:6px; flex:1 1 auto; } .dq-chip small { display:none; } .dq-chip b { font-size:13px; margin-left:auto; }
    .dq-tools { margin-left:auto; } .dq-status { padding:6px 10px 8px; font-size:12.5px; gap:6px; } .dq-status span { min-width:0; flex-basis:100%; }
    .dq-mapwrap { padding:4px; } .dq-bottom { padding:5px 8px 7px; } #dq-stage .dq-legend { display:none; }
    .dq-pop { padding:16px 14px 14px; border-radius:18px; } .dq-pop-q { font-size:clamp(24px,8vw,36px); } .dq-pop-s { font-size:14px; }
    .dq-pop .dq-opts { gap:7px; margin-top:12px; } .dq-pop .choice-btn { min-height:52px; padding:9px 10px; font-size:14.5px; gap:8px; } .dq-pop .choice-btn kbd { width:22px; height:22px; font-size:11px; }
    .dq-pop-foot em { margin-left:0; flex-basis:100%; }
  }

  /* ===== DOBYVATEĽ v4 — čierna mapa, biele hranice, farba = hráč, animácie ===== */
  #dq-stage { background:#000000; }
  .dq-top { background:#0a0a0c; border-bottom-color:rgba(255,255,255,0.14); } .dq-status { background:#101013; } .dq-bottom { background:#0a0a0c; }
  #dq-maph { position:absolute; inset:4px 8px; }
  .dq-map .dq-cell { transition:none; animation:none; stroke-dasharray:none; stroke-opacity:1; fill-opacity:1; filter:none; }
  .dq-map .dq-cell { paint-order:stroke; stroke:#ffffff; stroke-width:2.3; stroke-linejoin:round; fill:#08080a; }
  .dq-map .dq-cell.c-AD { stroke-width:2.8; fill:#000000; }
  .dq-map .dq-out { fill:none; stroke:#ffffff; stroke-width:2.6; stroke-linejoin:round; pointer-events:none; }
  .dq-map text.dq-lab { fill:#ffffff; font-family:'JetBrains Mono',ui-monospace,Menlo,monospace; font-weight:800; text-anchor:middle; dominant-baseline:middle; pointer-events:none; stroke:none; }
  .dq-map text.dq-lab .t { font-size:0.7em; opacity:0.72; font-weight:700; }
  .dq-map text.dq-lab .p { font-size:0.74em; fill:#ffd34d; }
  .dq-map text.dq-lab.ad { font-size:6.3px; dominant-baseline:auto; }
  .dq-map text.dq-lab.g { opacity:0.6; letter-spacing:0.06em; }
  .dq-map.dq-s-b .dq-cell.c-CTR { fill:#0e2350; } .dq-map.dq-s-b .dq-cell.c-TMA { fill:#0a1732; }
  .dq-map.dq-s-b .dq-cell.c-TRA, .dq-map.dq-s-b .dq-cell.c-TSA { fill:#22123f; }
  .dq-map.dq-s-b .dq-cell.c-R, .dq-map.dq-s-b .dq-cell.c-P, .dq-map.dq-s-b .dq-cell.c-D { fill:url(#dq-hB); }
  .dq-map.dq-s-c .dq-cell { fill:hsl(var(--ah) calc(44% * var(--asf)) 7%); } .dq-map.dq-s-c .dq-cell.c-G { fill:hsl(var(--ah) calc(42% * var(--asf)) 11%); }
  .dq-map.dq-s-c .dq-cell.c-R, .dq-map.dq-s-c .dq-cell.c-P, .dq-map.dq-s-c .dq-cell.c-D { fill:url(#dq-hC); }
  .dq-map.dq-s-c .dq-cell.c-AD { fill:#ffffff; } .dq-map.dq-s-c text.dq-lab.ad { fill:hsl(var(--ah) calc(46% * var(--asf)) 5%); }
  .dq-map .dq-cell.own { fill:var(--pc) !important; }
  .dq-map text.dq-lab.own, .dq-map.dq-s-c text.dq-lab.ad.own { fill:#ffffff; paint-order:stroke; stroke:rgba(0,0,0,0.6); stroke-width:1.7px; }
  .dq-map text.dq-lab.g.own { opacity:1; }
  .dq-map .dq-cell.c-G.own { fill-opacity:0.5; }
  .dq-map .dq-cell.can { fill:#34343f; }
  .dq-map .dq-cell.can.own { filter:brightness(1.35); }
  .dq-map .dq-cell.click { cursor:pointer; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-map .dq-cell.click:hover { fill:#5a5a6c; } } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-map .dq-cell.click.own:hover { filter:brightness(1.6); } }
  .dq-map .dq-cell.tgt { stroke-width:6.5; }
  .dq-spread { transform-box:fill-box; transform-origin:center; animation:dqSpread 0.95s linear both; pointer-events:none; }
  @keyframes dqSpread { from { transform:scale(0.02); } to { transform:scale(1); } }
  .dq-atk { stroke:var(--pc); stroke-width:4; stroke-linecap:round; stroke-dasharray:9 7; pointer-events:none; }
  .dq-atk.bg { stroke:#ffffff; stroke-width:7.5; stroke-dasharray:none; opacity:0.92; }
  .dq-swords { pointer-events:none; }
  .dq-swords circle { fill:var(--pc); stroke:#ffffff; stroke-width:2.5; } .dq-swords text { text-anchor:middle; font-size:15px; fill:#ffffff; }
  #dq-toast { position:absolute; left:0; right:0; top:14px; z-index:4; display:flex; justify-content:center; pointer-events:none; padding:0 10px; }
  .dq-toast-in { padding:10px 22px; border-radius:99px; background:rgba(0,0,0,0.88); border:2px solid var(--pc); color:#fff; font-size:16px; text-align:center; animation:dqToast 3.4s linear both; }
  .dq-toast-in b { font-weight:800; } .dq-toast-in em { font-style:normal; font-weight:800; color:#ffd34d; margin-left:6px; }
  @keyframes dqToast { 0% { opacity:0; } 8% { opacity:1; } 88% { opacity:1; } 100% { opacity:0; } }
  #dq-poph.still, #dq-poph.still .dq-pop { animation:none; }
  #dq-poph.dq-pop-wrap { background:rgba(0,0,0,0.78); backdrop-filter:none; -webkit-backdrop-filter:none; animation:dqFade 0.18s linear; }
  #dq-poph .dq-pop { animation:dqFade 0.18s linear; }
  .dq-status.me { animation:none; background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.24); }
  #dq-stage .dq-legend { color:#b8b8c4; gap:4px 16px; } #dq-stage .dq-legend span.k { opacity:0.7; }
  .rk-bars > div { grid-template-columns:150px 1fr 118px; }
  @media (max-width:760px) { .dq-toast-in { font-size:13px; padding:8px 14px; } .rk-bars > div { grid-template-columns:118px 1fr 96px; } }

  /* ===== vlastné otázky a číslo verzie ===== */
  .brand-sub .app-ver { color:hsl(var(--ah) calc(75% * var(--asf)) 57%); font-weight:800; }
  .ver-tag { font-family:var(--mono); font-size:10.5px; letter-spacing:0.08em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); opacity:0.85; align-self:center; white-space:nowrap; padding:0 4px; }
  .dqc-up { cursor:pointer; border-style:dashed; color:var(--green); border-color:var(--green-strong); }
  .dqc-set { display:inline-flex; align-items:center; gap:6px; padding:5px 6px 5px 11px; border-radius:99px; background:var(--panel-2); font-size:12px; font-weight:600; color:var(--text); max-width:100%; }
  .dqc-set b { color:var(--green); } .dqc-set button { border:none; background:none; color:hsl(5,71%,73%); cursor:pointer; font-size:13px; padding:0 4px; }
  .dqc-hint, .dqc-msg { flex-basis:100%; font-size:11.5px; line-height:1.45; color:var(--text-dim); } .dqc-msg { color:var(--green); font-weight:700; } .dqc-msg.err { color:hsl(5,71%,73%); }
  .dq-pop-q.long { font-size:clamp(22px,3.4vw,34px); } .dq-pop-q.xl { font-size:clamp(17px,2.4vw,24px); line-height:1.25; }

  /* ===== DOBYVATEĽ v5 — jednotné farby, plynulé animácie, odpočet, výhra / prehra ===== */
  .dq-map .dq-cell.c-G.own { fill-opacity:1; }
  .dq-map .dq-cell.can.own { filter:none; }@media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-map .dq-cell.click.own:hover { filter:none; } }
  .dq-map .dq-cell.can { fill:#3a3a46; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-map .dq-cell.click:hover { fill:#62627a; } }
  .dq-spread { animation:dqSpread 1.4s cubic-bezier(0.4,0,0.2,1) both; }
  .dq-swords { transform-box:fill-box; transform-origin:center; pointer-events:none; }
  .dq-swords.big { animation:dqSwIn 0.7s var(--spring) both, dqSwPulse 2s ease-in-out 0.7s infinite; }
  .dq-swords.big circle { fill:var(--pc); stroke:#ffffff; stroke-width:3; } .dq-swords.big text { font-size:21px; fill:#ffffff; text-anchor:middle; }
  .dq-swords.sm { animation:dqSwPulse 2.4s ease-in-out infinite; }
  .dq-swords.sm circle { fill:#ffffff; stroke:#000000; stroke-width:1.4; } .dq-swords.sm text { font-size:10px; fill:#000000; text-anchor:middle; }
  @keyframes dqSwIn { from { transform:scale(0.6) rotate(-120deg); opacity:0; } to { transform:none; opacity:1; } }
  @keyframes dqSwPulse { 50% { transform:scale(1.14); } }
  #dq-toast { top:18px; }
  .dq-toast-in { display:flex; flex-direction:column; align-items:center; gap:3px; padding:12px 30px 13px; border-radius:18px; background:rgba(8,8,10,0.94); border:2px solid var(--pc); box-shadow:0 14px 44px rgba(0,0,0,0.65); animation:dqToast 4.2s var(--ease-out) both; }
  .dq-toast-in small { font-family:var(--mono); font-size:10.5px; letter-spacing:0.18em; color:var(--pc); font-weight:800; }
  .dq-toast-in b { font-size:21px; color:#ffffff; font-weight:800; } .dq-toast-in em { margin:0; font-size:14px; }
  .dq-toast-in.win { border-color:#ffd34d; box-shadow:0 14px 44px rgba(0,0,0,0.65), 0 0 40px rgba(255,211,77,0.35); } .dq-toast-in.win small { color:#ffd34d; }
  .dq-toast-in.lose { border-color:#e63946; } .dq-toast-in.lose small { color:#ff7a80; }
  @keyframes dqToast { 0% { opacity:0; transform:translateY(-26px) scale(0.94); } 10% { opacity:1; transform:none; } 86% { opacity:1; transform:none; } 100% { opacity:0; transform:translateY(-12px); } }
  #dq-poph.dq-pop-wrap { animation:dqFade 0.3s ease both; } #dq-poph .dq-pop { animation:dqPopIn 0.45s var(--ease-out) both; }
  #dq-poph.still, #dq-poph.still .dq-pop { animation:none; }
  #dq-poph.out { animation:dqOut 0.32s ease forwards; pointer-events:none; } #dq-poph.out .dq-pop { animation:dqPopOut 0.32s ease forwards; }
  @keyframes dqPopIn { from { opacity:0; transform:translateY(18px) scale(0.97); } } @keyframes dqOut { to { opacity:0; } } @keyframes dqPopOut { to { opacity:0; transform:translateY(10px) scale(0.98); } }
  .dq-rib { margin:-20px -26px 14px; padding:11px 14px; text-align:center; font-weight:800; letter-spacing:0.1em; font-size:15.5px; border-radius:21px 21px 0 0; animation:dqRib 0.55s var(--spring) both; }
  .dq-rib.win { background:linear-gradient(90deg,#0f8f55,#3fe39a); color:#04140d; } .dq-rib.lose { background:linear-gradient(90deg,#8f1d24,#e63946); color:#ffffff; }
  .dq-pop.r-win { border-color:hsl(var(--ah) calc(75% * var(--asf)) 57%); box-shadow:0 30px 90px rgba(0,0,0,0.65), 0 0 70px hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.28); } .dq-pop.r-lose { border-color:#e63946; box-shadow:0 30px 90px rgba(0,0,0,0.65), 0 0 70px rgba(230,57,70,0.25); }
  @keyframes dqRib { from { transform:translateY(-60%); opacity:0; } }
  .dq-pop.count { width:min(430px,100%); text-align:center; } .dq-pop.count .dq-pop-top { justify-content:center; }
  .dq-count { height:180px; display:flex; align-items:center; justify-content:center; }
  .dq-count b { font-family:var(--display); font-size:140px; font-weight:800; line-height:1; color:#ffffff; text-shadow:0 0 54px hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.65); animation:dqCnt 0.9s var(--ease-out) both; }
  .dq-count b.go { font-size:100px; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); }
  @keyframes dqCnt { 0% { opacity:0; transform:scale(2.1); } 26% { opacity:1; transform:scale(1); } 78% { opacity:1; transform:scale(1); } 100% { opacity:0; transform:scale(0.82); } }
  .dq-pop-img { margin:14px auto 0; height:min(34vh,270px); display:flex; align-items:center; justify-content:center; border-radius:14px; overflow:hidden; background:#000000; border:1px solid rgba(255,255,255,0.16); }
  .dq-pop-img img { max-width:100%; max-height:100%; object-fit:contain; animation:dqFade 0.3s ease; } .dq-pop-img span { color:#a9c7b8; font-size:13px; }
  #dq-stage .dq-timer i { width:100% !important; transform-origin:left center; background:hsl(var(--ah) calc(75% * var(--asf)) 57%); }
  @keyframes dqBar { from { transform:scaleX(1); } to { transform:scaleX(0); } }
  @keyframes dqBarC { 0%, 62% { background:hsl(var(--ah) calc(75% * var(--asf)) 57%); } 100% { background:#ff7a59; } }
  .dq-pop.end.won { border-color:#ffd34d; box-shadow:0 30px 90px rgba(0,0,0,0.65), 0 0 80px rgba(255,211,77,0.3); }
  .dq-pop.end .dq-pop-q { animation:dqTrophy 0.9s var(--spring) both; } .dq-pop.end.won .dq-pop-q { color:#ffd34d; text-shadow:0 0 34px rgba(255,211,77,0.5); }
  .dq-pop.end.lost .dq-pop-q { color:#cfd3da; text-shadow:none; }
  @keyframes dqTrophy { from { opacity:0; transform:scale(0.5) translateY(14px); } }
  .dq-endlist > div { animation:dqRow 0.55s var(--ease-out) both; } @keyframes dqRow { from { opacity:0; transform:translateX(-18px); } }
  .dq-confetti { position:absolute; inset:0; overflow:hidden; pointer-events:none; border-radius:22px; }
  .dq-confetti i { position:absolute; top:-16px; width:8px; height:14px; border-radius:2px; opacity:0.95; animation:dqConf linear infinite; }
  @keyframes dqConf { to { transform:translateY(640px) rotate(560deg); } }
  @media (max-width:760px) { .dq-rib { margin:-16px -14px 12px; font-size:13.5px; } .dq-count b { font-size:110px; } .dq-toast-in b { font-size:16px; } .dq-pop-img { height:min(28vh,200px); } }

  /* ===== rebríček: vynulovanie skóre ===== */
  .rk-acct-b { display:flex; gap:8px; flex-wrap:wrap; }
  .rk-reset { height:44px; padding:0 16px; border-radius:14px; border:1.5px solid #d6453d; background:rgba(255,255,255,0.07); color:hsl(3,64%,72%); font-family:var(--ui); font-weight:800; font-size:12px; letter-spacing:0.07em; cursor:pointer; white-space:nowrap; }
  .rk-reset.solid { background:#d6453d; color:#fff; }@media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .rk-reset:hover { background:#d6453d; color:#fff; } }
  .rk-modal { position:fixed; inset:0; z-index:200; display:flex; align-items:center; justify-content:center; padding:16px; background:rgba(3,10,7,0.72); animation:dqFade 0.2s ease; }
  .rk-modal-in { width:min(460px,100%); padding:24px; border-radius:20px; background:rgba(255,255,255,0.07); box-shadow:0 30px 80px rgba(0,0,0,0.5); }
  .rk-modal-in h3 { margin:0 0 8px; font-family:var(--display); font-size:21px; font-weight:800; color:var(--text); } .rk-modal-in p { margin:0 0 18px; font-size:14.5px; line-height:1.55; color:var(--text-dim); }
  .rk-modal-in > div { display:flex; gap:8px; justify-content:flex-end; flex-wrap:wrap; } .rk-modal-in .btn { height:44px; padding:0 18px; }
  .rk-me-top { grid-template-columns:repeat(5,1fr); }
  @media (max-width:760px) { .rk-me-top { grid-template-columns:1fr 1fr; } }

  /* ===== DOBYVATEĽ v6 — tipovacie otázky s terčom, domovské letiská so životmi ===== */
  .dq-numbox { display:flex; align-items:center; justify-content:center; gap:10px; margin-top:18px; flex-wrap:wrap; }
  .dq-numbox input { width:min(260px,60%); height:62px; border-radius:14px; border:2px solid hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.6); background:rgba(0,0,0,0.45); color:#ffffff; font-family:var(--mono); font-size:30px; font-weight:800; text-align:center; outline:none; }
  .dq-numbox input:focus { border-color:hsl(var(--ah) calc(75% * var(--asf)) 57%); box-shadow:0 0 0 4px hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.2); } .dq-numbox input::placeholder { font-size:15px; font-weight:500; color:rgba(255,255,255,0.4); }
  .dq-numbox span { font-family:var(--mono); font-size:18px; color:#a9c7b8; font-weight:700; } .dq-numbox .dq-btn { height:62px; font-size:14px; }
  .dq-numbox.done { font-size:17px; color:#cfe6da; } .dq-numbox.done b { font-family:var(--mono); font-size:30px; color:#ffd34d; margin-left:8px; }
  .dq-numrev { display:grid; grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr); gap:16px; align-items:center; margin-top:14px; }
  .dq-darts { width:100%; max-height:250px; display:block; overflow:visible; }
  .dq-dart { animation:dqDart 0.75s var(--spring-soft) both; }
  @keyframes dqDart { from { transform:translate(var(--fx), var(--fy)) scale(1.5); opacity:0; } 60% { opacity:1; } to { transform:none; opacity:1; } }
  .dq-numtab { display:flex; flex-direction:column; gap:6px; }
  .dq-numans { font-size:13px; color:#a9c7b8; letter-spacing:0.04em; } .dq-numans b { font-family:var(--mono); font-size:24px; color:#ffffff; margin-left:8px; }
  .dq-numrow { display:grid; grid-template-columns:24px 12px 1fr auto; align-items:center; gap:4px 9px; padding:8px 12px; border-radius:12px; background:rgba(255,255,255,0.06); border:1.5px solid transparent; color:#ffffff; animation:dqRow 0.5s ease both; }
  .dq-numrow:nth-child(2) { animation-delay:1.3s; } .dq-numrow:nth-child(3) { animation-delay:1.85s; } .dq-numrow:nth-child(4) { animation-delay:2.4s; } .dq-numrow:nth-child(5) { animation-delay:2.95s; } .dq-numrow:nth-child(6) { animation-delay:3.5s; } .dq-numrow:nth-child(7) { animation-delay:4.05s; }
  .dq-numrow.best { border-color:#ffd34d; background:rgba(255,211,77,0.14); } .dq-numrow b { font-family:var(--mono); } .dq-numrow i { width:12px; height:12px; border-radius:50%; }
  .dq-numrow span { font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .dq-numrow strong { font-family:var(--mono); font-size:17px; }
  .dq-numrow small { grid-column:3 / 5; font-size:11.5px; color:#a9c7b8; } .dq-numnote { font-size:11.5px; color:#8fa89b; margin-top:2px; }
  .dq-rib.tie { background:linear-gradient(90deg,#3a3a46,#5b5b6e); color:#ffffff; } .dq-pop.r-tie { border-color:#8a8aa0; }
  .dq-hearts { text-anchor:middle; font-size:9px; fill:#ff5d6c; paint-order:stroke; stroke:#000; stroke-width:2.2px; pointer-events:none; }
  .dq-basering { fill:none; stroke:#ffd34d; stroke-width:2; pointer-events:none; }
  .dq-chip u { text-decoration:none; color:#ff5d6c; font-size:12px; letter-spacing:1px; } .dq-chip.out { opacity:0.4; text-decoration:line-through; }
  @media (max-width:760px) { .dq-numrev { grid-template-columns:1fr; gap:8px; } .dq-darts { max-height:170px; } .dq-numbox input { height:54px; font-size:24px; } .dq-numbox .dq-btn { height:54px; } }
  .dq-gline { stroke:#ffffff; stroke-width:2.3; fill:none; pointer-events:none; }

  /* ===== DOBYVATEĽ v7 — pokojná mapa, výber na dotyk, životy ako bodky ===== */
  .dq-bottom { flex-wrap:nowrap; } .dq-bottom .dq-info { flex:1 1 0; min-width:0; height:44px; min-height:44px; flex-wrap:nowrap; white-space:nowrap; overflow:hidden; }
  .dq-bottom .dq-info span { overflow:hidden; text-overflow:ellipsis; flex:0 1 auto; min-width:0; } .dq-bottom .dq-info b, .dq-bottom .dq-info em, .dq-bottom .dq-info small { flex:none; }
  .dq-bottom .dq-legend { flex:0 1 auto; flex-wrap:nowrap; overflow:hidden; white-space:nowrap; }
  .dq-life { fill:#ff3b52; stroke:#ffffff; stroke-width:1.1; pointer-events:none; } .dq-hearts { display:none; }
  .dq-map text.dq-lab.g { letter-spacing:0.04em; }
  .dq-map .dq-cell.sel { fill:#8a8aa6; } .dq-map .dq-cell.sel.own { filter:brightness(1.35) saturate(1.2); }
  #dq-picker { display:none; } #dq-picker.on { display:block; padding:8px 10px; background:#0a0a0c; border-top:1px solid rgba(255,255,255,0.14); }
  .dq-pk-row { display:flex; gap:7px; overflow-x:auto; padding-bottom:7px; -webkit-overflow-scrolling:touch; scrollbar-width:none; } .dq-pk-row::-webkit-scrollbar { display:none; }
  .dq-pk { flex:none; height:44px; padding:0 14px; border-radius:12px; border:1.5px solid rgba(255,255,255,0.22); background:#1b1b22; color:#ffffff; font-family:var(--mono); font-size:13.5px; font-weight:700; white-space:nowrap; }
  .dq-pk[style] { border-color:var(--pc); } .dq-pk b { color:#ffd34d; margin-left:5px; } .dq-pk.on { background:rgba(255,255,255,0.07); color:hsl(215,22%,94%); border-color:rgba(255,255,255,0.16); } .dq-pk.on b { color:hsl(39,88%,78%); }
  .dq-pk-ok { width:100%; height:50px; border:none; border-radius:13px; background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:hsl(154,67%,88%); font-family:var(--ui); font-weight:800; font-size:15px; letter-spacing:0.04em; }
  .dq-pk-ok:disabled { background:#24242c; color:#8e8e9c; font-weight:600; font-size:13px; letter-spacing:0; }
  @media (max-width:760px) { .dq-bottom .dq-info { height:38px; min-height:38px; } }

  /* ===== v3.8: obťažnosť, výber okruhu, prehľad chýb, hlásenie otázok, návrat do hry ===== */
  .dq-lvl { font-style:normal; margin-left:8px; padding:2px 7px; border-radius:99px; font-size:9.5px; letter-spacing:0.1em; background:rgba(255,255,255,0.12); color:#fff; }
  .dq-lvl.l1 { background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.22); color:hsl(var(--ah) calc(73% * var(--asf)) 85%); } .dq-lvl.l3 { background:rgba(255,196,84,0.25); color:#ffe2a8; } .dq-lvl.l4 { background:#e63946; color:#fff; }
  .dq-pop.modpick { width:min(640px,100%); text-align:center; }
  .dq-modgrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:8px; margin-top:14px; }
  .dq-modbtn { min-height:52px; padding:8px 10px; border-radius:12px; border:1.5px solid rgba(255,255,255,0.2); background:rgba(255,255,255,0.07); color:#fff; font-family:var(--ui); font-weight:800; font-size:13px; letter-spacing:0.04em; cursor:pointer; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-modbtn:hover { background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.2); border-color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } } .dq-modbtn.on { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); border-color:hsl(var(--ah) calc(75% * var(--asf)) 57%); color:hsl(154,67%,88%); } .dq-modbtn.rnd { border-style:dashed; }
  .dq-btn:disabled { opacity:0.45; cursor:default; } .dq-unit { padding:0 4px; color:#ffc454 !important; }
  .dq-rep { margin-left:auto; height:30px; padding:0 12px; border-radius:99px; border:1px solid rgba(255,255,255,0.22); background:transparent; color:#a9c7b8; font-family:var(--ui); font-weight:700; font-size:11px; letter-spacing:0.06em; cursor:pointer; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-rep:hover { border-color:#ffc454; color:#ffc454; } } .dq-rep:disabled { opacity:0.65; cursor:default; border-color:transparent; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); }
  .dq-pop.errs { width:min(720px,100%); }
  .dq-errlist { display:flex; flex-direction:column; gap:8px; margin-top:14px; max-height:min(56vh,520px); overflow-y:auto; padding-right:4px; }
  .dq-err { display:grid; grid-template-columns:1fr auto; gap:4px 10px; align-items:center; padding:10px 12px; border-radius:12px; background:rgba(255,255,255,0.06); color:#fff; }
  .dq-err small { grid-column:1 / -1; font-family:var(--mono); font-size:10px; letter-spacing:0.12em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .dq-err b { grid-column:1 / -1; font-size:14.5px; line-height:1.35; } .dq-err b u { display:block; text-decoration:none; font-weight:600; font-size:12px; color:#a9c7b8; }
  .dq-err span { grid-column:1; font-size:13px; font-weight:700; } .dq-err span.ok { color:#7ff0bd; } .dq-err span.no { color:#ff9c84; } .dq-err .dq-rep { grid-column:2; grid-row:3 / span 2; }
  .dq-dropts { display:grid; gap:8px; margin-top:16px; }
  .dq-back { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:14px 0; padding:14px 16px; border-radius:14px; border:1.5px solid #ffc454; background:rgba(255,196,84,0.1); }
  .dq-back > div { flex:1; min-width:220px; display:flex; flex-direction:column; gap:3px; } .dq-back strong { letter-spacing:0.08em; } .dq-back span { font-size:13px; color:var(--text-dim); }
  .dq-cfg-hint { margin-top:8px; font-size:12px; line-height:1.5; color:var(--text-dim); }
  .rk-chips.sub { margin-top:8px; align-items:center; } .rk-chips.sub > span { font-size:10.5px; letter-spacing:0.1em; font-weight:700; color:var(--text-dim); margin-right:4px; }
  .rk-note { margin-top:10px; font-size:12.5px; color:var(--text-dim); }
  @media (max-width:760px) { .dq-modgrid { grid-template-columns:1fr 1fr; } .dq-err { grid-template-columns:1fr; } .dq-err .dq-rep { grid-column:1; grid-row:auto; margin-left:0; justify-self:start; } }
  .dq-guide { margin-top:22px; } .dq-guide h3 { font-size:13px; letter-spacing:0.14em; margin:0 0 8px; }
  .dq-g { border:1px solid var(--border); border-radius:12px; margin-top:6px; background:var(--panel, transparent); }
  .dq-g summary { cursor:pointer; padding:11px 14px; font-weight:800; font-size:13.5px; letter-spacing:0.04em; list-style:none; } .dq-g summary::-webkit-details-marker { display:none; }
  .dq-g summary::after { content:'+'; float:right; font-family:var(--mono); color:var(--text-dim); } .dq-g[open] summary::after { content:'−'; }
  .dq-g > div { padding:0 16px 12px; font-size:13.5px; line-height:1.6; color:var(--text-dim); } .dq-g > div b { color:var(--text); }
  .dq-g ul, .dq-g ol { margin:6px 0; padding-left:20px; } .dq-g li { margin:3px 0; } .dq-g p { margin:6px 0; }
  /* ===== v4.0: herný pocit — efekty na mape, súboj, tokeny, stupne víťazov ===== */
  #dq-fxl { position:absolute; inset:4px 8px; z-index:3; pointer-events:none; }
  .dq-fxs { width:100%; height:100%; display:block; overflow:hidden; }
  .dq-track { fill:none; stroke:#ffffff; stroke-opacity:0.9; stroke-width:1.7; stroke-linecap:round; stroke-dasharray:1; stroke-dashoffset:1; animation:dqTrack linear both; filter:drop-shadow(0 0 3px var(--pc)); transition:opacity 0.4s; }
  @keyframes dqTrack { to { stroke-dashoffset:0; } }
  .dq-plane { filter:drop-shadow(0 0 4px var(--pc)); transition:opacity 0.25s; } .dq-plane path { fill:#ffffff; stroke:var(--pc); stroke-width:1.3; stroke-linejoin:round; }
  .dq-ping { fill:none; stroke:var(--pc); stroke-width:3; transform-box:fill-box; transform-origin:center; animation:dqPing 0.85s ease-out both; }
  @keyframes dqPing { 0% { transform:scale(0.2); opacity:0; } 15% { opacity:1; } 100% { transform:scale(1.6); opacity:0; } }
  .dq-sweep { animation:dqSweep linear both; } .dq-sweep path { fill:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.13); } .dq-sweep line { stroke:hsl(var(--ah) calc(75% * var(--asf)) 57%); stroke-width:2; stroke-opacity:0.9; }
  @keyframes dqSweep { 0% { transform:rotate(0deg); opacity:1; } 88% { opacity:1; } 100% { transform:rotate(360deg); opacity:0; } }
  .dq-blip { fill:none; stroke:hsl(var(--ah) calc(75% * var(--asf)) 57%); stroke-width:2.6; transform-box:fill-box; transform-origin:center; animation:dqBlip 1.1s ease-out both; }
  @keyframes dqBlip { 0% { transform:scale(0.3); opacity:0; } 20% { opacity:1; } 100% { transform:scale(1.8); opacity:0; } }
  .dq-shield, .dq-puff { transform-box:fill-box; transform-origin:center; animation:dqShield 1.6s ease both; }
  .dq-shield circle { fill:rgba(255,255,255,0.16); stroke:var(--pc); stroke-width:3; } .dq-shield text { text-anchor:middle; font-size:17px; }
  .dq-puff { text-anchor:middle; font-size:24px; font-weight:800; fill:#ff5d6c; stroke:#000; stroke-width:0.8; animation-duration:1.1s; }
  @keyframes dqShield { 0% { transform:scale(0.2); opacity:0; } 18% { transform:scale(1.25); opacity:1; } 32% { transform:scale(1); } 80% { opacity:1; } 100% { opacity:0; transform:scale(1.1); } }
  .dq-boom { fill:rgba(230,57,70,0.5); stroke:#ff5d6c; stroke-width:2; transform-box:fill-box; transform-origin:center; animation:dqBoom 0.5s ease-out 3 both; } .dq-boom.b2 { fill:none; animation-delay:0.12s; }
  @keyframes dqBoom { 0% { transform:scale(0.4); opacity:1; } 100% { transform:scale(1.7); opacity:0; } }
  .dq-mapwrap.dq-shake #dq-maph, .dq-mapwrap.dq-shake #dq-fxl { animation:dqShake 0.6s ease; }
  @keyframes dqShake { 10%, 50%, 90% { transform:translate(-8px,3px); } 30%, 70% { transform:translate(8px,-3px); } }
  .dq-float { position:absolute; z-index:60; pointer-events:none; font-family:var(--mono); font-weight:800; font-size:22px; color:#ffd34d; text-shadow:0 2px 10px rgba(0,0,0,0.95), 0 0 16px rgba(255,211,77,0.55); white-space:nowrap; transform:translate(-50%,-50%); opacity:0; }
  #dq-emop { flex-wrap:wrap; max-width:min(92vw, 330px); max-height:58vh; overflow:auto; } #dq-emop button.ph { width:auto; height:36px; padding:0 12px; font-size:12.5px; font-family:var(--ui); font-weight:700; border-radius:99px; } .dq-float.phr { font-size:17px; padding:6px 14px; border-radius:99px; background:rgba(8,8,10,0.82); border:1px solid rgba(255,255,255,0.25); white-space:nowrap; font-family:var(--ui); font-weight:800; }
  .dq-float.big { font-size:40px; } .dq-float.emo { font-size:50px; text-shadow:0 5px 16px rgba(0,0,0,0.85); }
  .dq-float.tag { font-family:var(--ui); font-size:13px; letter-spacing:0.04em; padding:6px 13px; border-radius:99px; background:rgba(0,0,0,0.9); border:1.5px solid #ffd34d; text-shadow:none; }
  #dq-stage.dq-hurry::after { content:''; position:absolute; inset:0; z-index:70; pointer-events:none; box-shadow:inset 0 0 70px 10px rgba(255,90,60,0.62); opacity:0; animation:dqHurry 1s ease-in-out infinite; }
  @keyframes dqHurry { 0%, 100% { opacity:0; } 50% { opacity:1; } }
  .dq-chip i { width:22px; height:22px; font-style:normal; font-size:12px; line-height:1; display:flex; align-items:center; justify-content:center; box-shadow:0 0 8px var(--c); }
  .dq-chip s { text-decoration:none; font-size:12px; color:#ffb347; font-weight:800; white-space:nowrap; animation:dqFire 0.9s ease-in-out infinite; } @keyframes dqFire { 50% { transform:scale(1.18); } }
  .dq-lobby .dq-pl i { width:26px; height:26px; font-style:normal; font-size:14px; line-height:1; display:flex; align-items:center; justify-content:center; }
  .dq-look { margin-top:10px; padding:10px 12px 12px; border:1.5px solid var(--border); border-radius:12px; background:rgba(255,255,255,0.07); }
  .dq-look strong { display:block; font-family:var(--mono); font-size:10.5px; letter-spacing:0.14em; color:var(--text-dim); }
  .dq-look-row { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin-top:8px; } .dq-look-row small { flex:1 1 180px; font-size:11.5px; color:var(--text-dim); }
  .dq-sw { width:30px; height:30px; border-radius:50%; border:3px solid rgba(255,255,255,0.16); box-shadow:0 0 0 1.5px var(--border); cursor:pointer; padding:0; } .dq-sw.on { box-shadow:0 0 0 3px #15171c; } .dq-sw:disabled { opacity:0.2; cursor:not-allowed; }
  .dq-ic { width:38px; height:38px; border-radius:10px; border:1.5px solid var(--border); background:rgba(255,255,255,0.07); font-size:18px; line-height:1; cursor:pointer; padding:0; } .dq-ic.on { border-color:var(--green-strong); background:var(--green-bg); box-shadow:0 0 0 2px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.18); }
  .dq-tools { position:relative; } #dq-fxb.off { opacity:0.4; }
  #dq-emop { display:none; position:absolute; right:0; top:40px; z-index:80; padding:6px; gap:4px; border-radius:12px; background:#101013; border:1px solid rgba(255,255,255,0.22); box-shadow:0 12px 30px rgba(0,0,0,0.65); } #dq-emop.on { display:flex; }
  #dq-emop button { font-size:20px; width:44px; height:44px; padding:0; }
  .dq-toast-in.vs { padding:11px 24px 13px; }
  .dq-vs { display:flex; align-items:center; gap:14px; margin:5px 0 3px; }
  .dq-vs span { display:flex; align-items:center; gap:8px; font-weight:800; font-size:19px; color:#fff; max-width:38vw; overflow:hidden; white-space:nowrap; }
  .dq-vs span i { flex:none; width:34px; height:34px; border-radius:50%; background:var(--c); box-shadow:0 0 14px var(--c); display:flex; align-items:center; justify-content:center; font-style:normal; font-size:17px; line-height:1; } .dq-vs span.free i { background:#3a3a46; box-shadow:none; }
  .dq-vs u { text-decoration:none; font-family:var(--display); font-weight:800; font-size:26px; color:#ffd34d; animation:dqVs 0.6s var(--spring-strong) 0.25s both; } @keyframes dqVs { from { transform:scale(3); opacity:0; } }
  .dq-vs span:first-child { animation:dqVsL 0.5s ease both; } .dq-vs span:last-child { animation:dqVsR 0.5s ease both; }
  @keyframes dqVsL { from { transform:translateX(-70px); opacity:0; } } @keyframes dqVsR { from { transform:translateX(70px); opacity:0; } }
  .dq-jk { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:8px; margin-top:13px; } .dq-jk span { font-family:var(--mono); font-size:10px; letter-spacing:0.16em; color:#a9c7b8; }
  .dq-jk button { height:36px; padding:0 14px; border-radius:99px; border:1.5px dashed rgba(255,211,77,0.65); background:rgba(255,211,77,0.1); color:#ffd34d; font-family:var(--ui); font-weight:800; font-size:12.5px; letter-spacing:0.04em; cursor:pointer; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-jk button:hover:not(:disabled) { background:rgba(255,211,77,0.26); } } .dq-jk button:disabled { opacity:0.28; cursor:default; border-style:solid; } .dq-jk button.on { opacity:1 !important; background:#ffd34d; color:#1a1400; border-style:solid; }
  .dq-pop .choice-btn.gone { opacity:0.16; text-decoration:line-through; }
  .dq-axis { width:100%; max-height:240px; display:block; overflow:visible; } .dq-axis .ax { stroke:#fff; stroke-opacity:0.6; stroke-width:2; stroke-linecap:round; } .dq-axis .tk { stroke:#fff; stroke-opacity:0.3; stroke-width:1; }
  .dq-tip { animation:dqTip 0.55s var(--spring) both; } .dq-tip line { stroke:var(--pc); stroke-width:2; } .dq-tip circle { fill:var(--pc); stroke:#fff; stroke-width:1.5; }
  .dq-tip text { fill:#fff; font-family:'JetBrains Mono',ui-monospace,Menlo,monospace; font-weight:800; font-size:11px; text-anchor:middle; } .dq-tip text.n { font-size:11px; }
  .dq-tip circle.halo { fill:none; stroke:#ffd34d; stroke-width:2.5; animation:dqFade 0.4s ease both; }
  @keyframes dqTip { from { transform:translateY(-80px); opacity:0; } }
  .dq-axans { animation:dqAxA 0.5s var(--spring) both; } .dq-axans path { fill:#ffd34d; }
  .dq-axans text { fill:#ffd34d; font-family:'JetBrains Mono',ui-monospace,Menlo,monospace; font-weight:800; font-size:13px; text-anchor:middle; } .dq-axans text.n { font-size:7.5px; letter-spacing:0.14em; fill:#a9c7b8; }
  @keyframes dqAxA { from { transform:translateY(34px); opacity:0; } }
  .dq-pop .dq-numrow { animation:none; }
  .dq-podium { display:flex; justify-content:center; align-items:flex-end; gap:10px; margin-top:16px; }
  .dq-podium > div { flex:1 1 0; max-width:170px; min-width:0; display:flex; flex-direction:column; align-items:center; gap:3px; color:#fff; animation:dqPod 0.7s var(--spring) both; }
  .dq-podium i { width:46px; height:46px; border-radius:50%; background:var(--c); box-shadow:0 0 18px var(--c); display:flex; align-items:center; justify-content:center; font-style:normal; font-size:22px; line-height:1; }
  .dq-podium span { font-weight:800; font-size:14.5px; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .dq-podium strong { font-family:var(--mono); font-size:17px; }
  .dq-podium small { font-size:11px; color:#a9c7b8; } .dq-podium em { font-style:normal; font-size:11px; font-weight:800; color:#ffc454; }
  .dq-podium b { width:100%; margin-top:5px; border-radius:10px 10px 0 0; display:flex; align-items:flex-start; justify-content:center; padding-top:6px; font-family:var(--display); font-size:26px; color:hsl(154,67%,88%); background:linear-gradient(180deg,hsla(218,17%,62%,0.16),#8d93a0); height:62px; }
  .dq-podium .p1 b { height:94px; background:linear-gradient(180deg,#ffe58a,#e0a800); } .dq-podium .p3 b { height:42px; background:linear-gradient(180deg,#e5a97c,#a8683b); } .dq-podium .me span { color:hsl(var(--ah) calc(75% * var(--asf)) 57%); }
  @keyframes dqPod { from { transform:translateY(70px); opacity:0; } }
  .dq-awards { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:8px; margin-top:14px; }
  .dq-awards > div { display:grid; grid-template-columns:auto 1fr; gap:0 9px; align-items:center; padding:8px 11px; border-radius:12px; background:rgba(255,255,255,0.06); animation:dqRow 0.5s ease 1.5s both; min-width:0; }
  .dq-awards i { grid-row:1 / 4; font-style:normal; font-size:24px; line-height:1; } .dq-awards small { font-family:var(--mono); font-size:9px; letter-spacing:0.12em; color:#a9c7b8; }
  .dq-awards b { color:#fff; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .dq-awards span { font-size:11.5px; color:#ffd34d; }
  /* menej animácií */
  #dq-stage.dq-low #dq-fxl, #dq-stage.dq-low .dq-confetti { display:none; } #dq-stage.dq-low .dq-spread { animation-duration:0.01s; } #dq-stage.dq-low.dq-hurry::after { animation:none; }
  #dq-stage.dq-low .dq-swords, #dq-stage.dq-low .dq-count b, #dq-stage.dq-low .dq-pop, #dq-stage.dq-low .dq-podium > div, #dq-stage.dq-low .dq-awards > div, #dq-stage.dq-low .dq-endlist > div, #dq-stage.dq-low .dq-vs *, #dq-stage.dq-low .dq-vsx *, #dq-stage.dq-low .dq-tip, #dq-stage.dq-low .dq-axans, #dq-stage.dq-low .dq-tip circle.halo, #dq-stage.dq-low .dq-chip s, #dq-stage.dq-low .dq-rib { animation:none !important; }
  @media (max-width:760px) {
    .dq-vs { gap:9px; } .dq-vs span { font-size:15px; } .dq-vs span i { width:26px; height:26px; font-size:13px; } .dq-vs u { font-size:20px; }
    .dq-podium i { width:36px; height:36px; font-size:17px; } .dq-podium span { font-size:12.5px; } .dq-chip i { width:18px; height:18px; font-size:10px; }
    .dq-float { font-size:17px; } .dq-float.emo { font-size:40px; } .dq-jk { gap:6px; margin-top:10px; } .dq-jk span { display:none; } .dq-jk button { height:34px; padding:0 11px; font-size:11.5px; }
    .dq-tools button { min-width:30px; padding:0 7px; } .dq-awards { grid-template-columns:1fr 1fr; }
  }
  /* ===== v4.1: čakanie na hostiteľa, body za skúšku ===== */
  #dq-wait { position:fixed; left:50%; top:10px; transform:translateX(-50%); z-index:300; max-width:calc(100vw - 20px); display:flex; flex-direction:column; align-items:center; gap:2px; padding:10px 20px; border-radius:14px; background:#1a1206; border:2px solid #ffbe0b; color:#fff; text-align:center; box-shadow:0 12px 40px rgba(0,0,0,0.6); font-size:13px; }
  #dq-wait b { font-family:var(--mono); font-size:11px; letter-spacing:0.16em; color:#ffbe0b; }
  .exam-rules { display:flex; flex-wrap:wrap; justify-content:center; gap:6px 8px; margin:14px auto 0; max-width:720px; }
  .exam-rules strong { flex-basis:100%; font-family:var(--mono); font-size:11px; letter-spacing:0.14em; color:var(--text-dim); }
  .exam-rules span { padding:6px 12px; border-radius:99px; border:1.5px solid var(--border); background:rgba(255,255,255,0.07); font-size:13px; } .exam-rules span b { margin-left:4px; color:var(--green); } .exam-rules em { flex-basis:100%; font-style:normal; font-size:12.5px; color:var(--text-dim); margin-top:4px; }
  .exam-rules.res strong { font-size:15px; letter-spacing:0.06em; color:var(--green); }
  .exam-ok { color:var(--green); } .exam-no { color:var(--red); }
  /* ===== v4.2: prihlásenie vpravo hore a stránka PROFIL ===== */
  .head-r { display:flex; align-items:center; gap:10px; }
  .acct-btn { height:34px; padding:0 16px; border-radius:999px; border:1.5px solid hsl(var(--ah) calc(75% * var(--asf)) 57%); background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:hsl(154,67%,88%); font-family:var(--ui); font-weight:800; font-size:12.5px; letter-spacing:0.06em; cursor:pointer; white-space:nowrap; max-width:46vw; overflow:hidden; text-overflow:ellipsis; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .acct-btn:hover { background:hsl(var(--ah) calc(75% * var(--asf)) 57%); } } .acct-btn.in { background:rgba(255,255,255,0.1); color:#fff; border-color:rgba(255,255,255,0.3); letter-spacing:0.02em; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .acct-btn.in:hover { background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.22); border-color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } }
  .acct-btn.on { box-shadow:0 0 0 3px hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.3); }
  .pf-h { margin:24px 0 8px; font-family:var(--mono); font-size:12px; letter-spacing:0.16em; color:var(--text-dim); } .pf-h em { font-style:normal; font-weight:500; letter-spacing:0.02em; text-transform:none; opacity:0.8; }
  .rk-me-top.pf-top { grid-template-columns:repeat(6,1fr); }
  .pf-bar { width:22%; min-width:70px; } .pf-bar i { display:block; height:8px; border-radius:99px; background:var(--border); overflow:hidden; } .pf-bar em { display:block; height:100%; border-radius:99px; background:var(--green-strong); }
  .pf-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:14px; }
  .pf-box { padding:14px 16px; border-radius:16px; border:1px solid var(--border); background:var(--panel-2); } .pf-box h3 { margin:0 0 8px; font-family:var(--mono); font-size:12px; letter-spacing:0.16em; color:var(--text-dim); }
  .pf-kv { display:grid; grid-template-columns:1fr auto; gap:5px 12px; font-size:14px; } .pf-kv b { text-align:right; font-variant-numeric:tabular-nums; } .pf-box small { display:block; margin-top:8px; font-size:12px; color:var(--text-dim); }
  .pf .dq-look { margin-top:0; }
  @media (max-width:760px) { .rk-me-top.pf-top { grid-template-columns:repeat(3,1fr); } .pf-grid { grid-template-columns:1fr; } .head-r { gap:6px; } .head-r .clock { display:none; } .acct-btn { height:32px; padding:0 12px; font-size:11.5px; } .pf-bar { display:none; } }
  /* ===== v4.3: rozpis bodov na konci hry ===== */
  .dq-ptab { margin-top:16px; text-align:left; } .dq-ptab > strong { display:block; font-family:var(--mono); font-size:11px; letter-spacing:0.16em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); margin-bottom:6px; }
  .dq-ptab .rk-tbl { background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.14); border-radius:12px; overflow-x:auto; }
  .dq-ptab table { width:100%; border-collapse:collapse; font-size:13px; color:#fff; } .dq-ptab th { font-family:var(--mono); font-size:9.5px; letter-spacing:0.1em; color:#a9c7b8; text-align:right; padding:8px 9px; white-space:nowrap; background:transparent; border-bottom:1px solid rgba(255,255,255,0.14); }
  .dq-ptab th:first-child, .dq-ptab td:first-child { text-align:left; } .dq-ptab td { padding:8px 9px; text-align:right; font-family:var(--mono); border-bottom:1px solid rgba(255,255,255,0.07); background:transparent; color:#fff; white-space:nowrap; }
  .dq-ptab tr:last-child td { border-bottom:none; } .dq-ptab tr.me td { background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.1); } .dq-ptab td.rk-pts { color:#ffd34d; font-weight:800; font-size:15px; }
  .dq-ptab td.rk-nick { font-family:var(--ui); font-weight:800; white-space:normal; min-width:130px; } .dq-ptab td.rk-nick i { display:inline-block; width:10px; height:10px; border-radius:50%; margin-right:7px; }
  .dq-ptab td small { display:block; font-family:var(--ui); font-weight:500; font-size:10.5px; color:#a9c7b8; } .dq-ptab td em { font-style:normal; font-weight:600; font-size:10.5px; color:#ff7a80; }
  .dq-ptab > small { display:block; margin-top:6px; font-size:11px; color:#8fa89b; }
  .dq-pop.end { width:min(820px,100%); }
  /* ===== v4.4: ukážka hry ===== */
  .dq-back.demo { border-color:var(--green-strong); background:var(--green-bg); }
  #dq-coach { position:absolute; left:50%; bottom:66px; transform:translateX(-50%); z-index:55; width:min(640px, calc(100% - 16px)); pointer-events:none; }
  .dq-coach-in { pointer-events:auto; padding:12px 16px 13px; border-radius:16px; background:#17130a; border:2px solid #ffd34d; box-shadow:0 14px 44px rgba(0,0,0,0.75); color:#fff; }
  .dq-coach-in small { display:block; font-family:var(--mono); font-size:10px; letter-spacing:0.16em; color:#ffd34d; font-weight:800; }
  .dq-coach-in b { display:block; font-size:16.5px; margin:3px 0 4px; } .dq-coach-in p { margin:0; font-size:13.5px; line-height:1.45; color:#ece7d6; }
  .dq-coach-in div { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; justify-content:flex-end; } .dq-coach-in .dq-btn { height:36px; }
  .dq-coach-in.hold { animation:dqCoach 1.5s ease-in-out infinite; } @keyframes dqCoach { 50% { box-shadow:0 14px 44px rgba(0,0,0,0.75), 0 0 0 6px rgba(255,211,77,0.28); } }
  #dq-stage.demo #dq-poph.dq-pop-wrap { align-items:flex-start; padding-bottom:230px; }
  @media (max-width:760px) { #dq-coach { bottom:52px; } .dq-coach-in { padding:10px 12px; } .dq-coach-in b { font-size:15px; } .dq-coach-in p { font-size:12.5px; } #dq-stage.demo #dq-poph.dq-pop-wrap { padding-bottom:250px; } }
  .dq-lgcalc { margin-top:14px; padding:12px 14px; border-radius:12px; border:1.5px solid rgba(255,211,77,0.55); background:rgba(255,211,77,0.08); text-align:left; }
  .dq-lgcalc strong { display:block; font-family:var(--mono); font-size:12.5px; letter-spacing:0.1em; color:#ffd34d; } .dq-lgcalc div { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
  .dq-lgcalc span { padding:5px 10px; border-radius:99px; background:rgba(255,255,255,0.08); font-size:12.5px; color:#e6e2d3; } .dq-lgcalc span b { color:#fff; font-family:var(--mono); margin-left:3px; } .dq-lgcalc small { display:block; margin-top:8px; font-size:11.5px; color:#a9c7b8; }
  /* ===== v4.5: okno AKO NA TO ===== */
  #hp-wrap { position:fixed; inset:0; z-index:400; display:flex; align-items:center; justify-content:center; padding:14px; background:hsl(var(--ah) calc(50% * var(--asf)) 5% / 0.72); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); animation:hpFade 0.2s ease; }
  .hp { width:min(460px,100%); max-height:100%; overflow:auto; border-radius:22px; background:rgba(255,255,255,0.07); color:hsl(153,48%,86%); box-shadow:0 30px 90px rgba(0,0,0,0.55); padding:14px 18px 16px; font-family:var(--ui); animation:hpIn 0.3s var(--spring-soft); }
  .hp-top { display:flex; align-items:center; justify-content:space-between; gap:10px; font-family:var(--mono); font-size:11px; letter-spacing:0.16em; font-weight:800; color:hsl(153,88%,75%); }
  .hp-top button { width:32px; height:32px; border-radius:10px; border:1px solid rgba(255,255,255,0.16); background:hsla(150,22%,62%,0.16); color:hsl(153,48%,86%); font-size:14px; cursor:pointer; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .hp-top button:hover { background:hsla(144,25%,62%,0.16); } }
  .hp-card { text-align:center; padding:6px 4px 2px; animation:hpCard 0.32s ease; } .hp-card h3 { margin:6px 0 4px; font-family:var(--display); font-size:22px; font-weight:800; letter-spacing:-0.01em; } .hp-card p { margin:0 auto; max-width:360px; min-height:44px; font-size:15px; line-height:1.45; color:hsl(215,22%,78%); }
  .hp-svg { width:100%; max-width:330px; height:auto; display:block; margin:4px auto 0; background:hsla(140,27%,62%,0.16); border-radius:16px; }
  .hp-dots { display:flex; justify-content:center; gap:7px; margin:12px 0 10px; } .hp-dots button { width:9px; height:9px; padding:0; border-radius:50%; border:none; background:hsla(143,16%,62%,0.16); cursor:pointer; transition:width 0.2s var(--ease-out), background-color 0.2s, border-radius 0.2s; } .hp-dots button.on { width:26px; border-radius:99px; background:hsl(var(--ah) calc(88% * var(--asf)) 33%); }
  .hp-act { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:8px; } .hp-act .btn { padding:11px 18px; }
  @keyframes hpFade { from { opacity:0; } } @keyframes hpIn { from { opacity:0; transform:translateY(18px) scale(0.96); } } @keyframes hpCard { from { opacity:0; transform:translateX(22px); } }
  .hp-box { fill:#ffffff; stroke:hsl(var(--ah) calc(48% * var(--asf)) 8%); stroke-width:2.2; } .hp-ink { fill:hsl(var(--ah) calc(48% * var(--asf)) 8%); } .hp-land { fill:#dcebe2; stroke:hsl(var(--ah) calc(48% * var(--asf)) 8%); stroke-width:2; } .hp-dot { fill:hsl(var(--ah) calc(88% * var(--asf)) 33%); } .hp-amb { fill:#ffb020; } .hp-gold { fill:#f2c230; }
  .hp-ring { fill:none; stroke:hsl(var(--ah) calc(88% * var(--asf)) 33%); stroke-width:2.5; } .hp-line, .hp-post { stroke:hsl(var(--ah) calc(48% * var(--asf)) 8%); stroke-width:3; stroke-linecap:round; fill:none; } .hp-grid { stroke:hsl(var(--ah) calc(48% * var(--asf)) 8%); stroke-width:1.2; opacity:0.35; } .hp-track { fill:none; stroke:hsl(var(--ah) calc(48% * var(--asf)) 8%); stroke-width:2.2; stroke-dasharray:5 5; }
  .hp-wave { fill:none; stroke:hsl(var(--ah) calc(88% * var(--asf)) 33%); stroke-width:3; stroke-linecap:round; } .hp-opt { fill:#ffffff; stroke:hsl(var(--ah) calc(48% * var(--asf)) 8%); stroke-width:2; } .hp-tag { fill:hsl(var(--ah) calc(48% * var(--asf)) 8%); } .hp-fill { fill:hsl(var(--ah) calc(47% * var(--asf)) 83%); } .hp-bad { fill:#fbd5cf; } .hp-mask { fill:hsl(var(--ah) calc(48% * var(--asf)) 8%); } .hp-cur { fill:hsl(var(--ah) calc(88% * var(--asf)) 33%); } .hp-cursor { fill:hsl(var(--ah) calc(48% * var(--asf)) 8%); stroke:#fff; stroke-width:1.5; }
  .hp-l1 { fill:hsl(var(--ah) calc(42% * var(--asf)) 74%); } .hp-l2 { fill:#c9d3ce; } .hp-l3 { fill:#e3b98f; } .hp-p1 { fill:#e63946; } .hp-p2 { fill:#3a86ff; } .hp-free { fill:#c9d3ce; stroke:hsl(var(--ah) calc(48% * var(--asf)) 8%); stroke-width:1.5; stroke-dasharray:4 3; } .hp-jk { fill:#fff6d8; stroke:#e0a800; stroke-width:2; stroke-dasharray:5 4; }
  .hp-t { fill:hsl(var(--ah) calc(48% * var(--asf)) 8%); font-family:var(--display); font-weight:800; font-size:22px; text-anchor:middle; } .hp-tt { fill:#ffffff; font-family:var(--mono); font-weight:800; font-size:15px; text-anchor:middle; } .hp-tt.hp-a { fill:#8a6400; }
  .hp-s { fill:#44564d; font-family:var(--mono); font-weight:700; font-size:10.5px; text-anchor:middle; } .hp-k { fill:hsl(var(--ah) calc(48% * var(--asf)) 8%); font-family:var(--mono); font-weight:800; font-size:13px; } .hp-n { fill:#fff; font-family:var(--mono); font-weight:800; font-size:12px; text-anchor:middle; }
  .hp-mono { font-family:var(--mono); } .hp-g { fill:hsl(var(--ah) calc(85% * var(--asf)) 26%); } .hp-r { fill:#d6352b; }
  .hp-svg .a-pop { animation:hpPop 2.4s ease-in-out infinite; transform-box:fill-box; transform-origin:center; } @keyframes hpPop { 0%, 35% { opacity:0; transform:scale(0.4); } 50%, 90% { opacity:1; transform:scale(1); } 100% { opacity:0; } }
  .hp-svg .a-ok { animation:hpOk 2.4s ease-in-out infinite; } @keyframes hpOk { 0%, 35% { fill:#ffffff; } 50%, 90% { fill:hsl(var(--ah) calc(47% * var(--asf)) 83%); } 100% { fill:#ffffff; } }
  .hp-svg .a-blink { animation:hpBlink 1s steps(2) infinite; } @keyframes hpBlink { 50% { opacity:0; } }
  .hp-svg .a-pulse { animation:hpPulse 1.4s ease-in-out infinite; transform-box:fill-box; transform-origin:center; } @keyframes hpPulse { 50% { transform:scale(1.15); } }
  .hp-svg .a-ring { animation:hpRing 1.6s ease-out infinite; transform-box:fill-box; transform-origin:center; } @keyframes hpRing { from { transform:scale(0.6); opacity:1; } to { transform:scale(2.4); opacity:0; } }
  .hp-svg .a-type { animation:hpType 2.6s steps(5) infinite; clip-path:inset(0 100% 0 0); text-anchor:start; } @keyframes hpType { 0% { clip-path:inset(0 100% 0 0); } 60%, 100% { clip-path:inset(0 0 0 0); } }
  .hp-svg .a-cur { animation:hpCur 2.4s ease-in-out infinite; } @keyframes hpCur { 0% { transform:translate(60px,96px); } 55%, 100% { transform:translate(150px,60px); } }
  .hp-svg .a-spin { animation:hpSpin 3s linear infinite; } @keyframes hpSpin { to { transform:rotate(360deg); } }
  .hp-svg .a-flip { animation:hpFlip 3s ease-in-out infinite; } @keyframes hpFlip { 0%, 40% { transform:scaleX(1); } 50% { transform:scaleX(0.05); } 60%, 100% { transform:scaleX(1); } }
  .hp-svg .a-slide { animation:hpSlide 3s ease-in-out infinite; } @keyframes hpSlide { 0%, 30% { transform:translateX(0); } 55%, 85% { transform:translateX(96px); } 100% { transform:translateX(0); } }
  .hp-svg .a-fly { animation:hpFly 2.6s ease-in-out infinite; } @keyframes hpFly { from { transform:translateX(36px); } to { transform:translateX(214px); } }
  .hp-svg .a-needle { animation:hpNeedle 3s ease-in-out infinite; } @keyframes hpNeedle { 0%, 15% { transform:rotate(0deg); } 60%, 100% { transform:rotate(245deg); } }
  .hp-svg .a-w1 { animation:hpBlink 1.2s ease-in-out infinite; } .hp-svg .a-w2 { animation:hpBlink 1.2s ease-in-out 0.3s infinite; }
  .hp-svg .a-rise { animation:hpRise 2.8s ease-in-out infinite; transform-box:fill-box; transform-origin:center bottom; } @keyframes hpRise { 0% { opacity:0; transform:translateY(12px); } 18%, 88% { opacity:1; transform:none; } 100% { opacity:0; } }
  .hp-svg .a-drop { animation:hpDrop 2.8s ease-in-out infinite; } @keyframes hpDrop { 0% { opacity:0; transform:translateY(-50px); } 20%, 88% { opacity:1; transform:none; } 100% { opacity:0; } }
  .hp-svg .d2 { animation-delay:0.25s; } .hp-svg .d3 { animation-delay:0.5s; } .hp-svg .d4 { animation-delay:0.75s; } .hp-svg .d5 { animation-delay:1s; }
  .hp-svg .a-left { animation:hpLeft 2.2s ease-in-out infinite; } @keyframes hpLeft { 0% { transform:translateX(-30px); } 45%, 100% { transform:translateX(22px); } } .hp-svg .a-right { animation:hpRight 2.2s ease-in-out infinite; } @keyframes hpRight { 0% { transform:translateX(30px); } 45%, 100% { transform:translateX(-22px); } }
  .hp-svg .a-look { animation:hpLook 3s ease-in-out infinite; } @keyframes hpLook { 0%, 100% { transform:translateX(-7px); } 50% { transform:translateX(7px); } }
  .hp-svg .a-route { offset-path:path('M30,90 C80,90 90,34 140,34 S200,60 214,60'); animation:hpRoute 3s ease-in-out infinite; } @keyframes hpRoute { from { offset-distance:0%; } to { offset-distance:100%; } }
  .hp-open { flex:none; align-self:center; height:34px; padding:0 14px; border-radius:999px; border:1.5px solid var(--green-strong); background:var(--green-bg); color:var(--green); font-family:var(--ui); font-weight:800; font-size:11.5px; letter-spacing:0.06em; cursor:pointer; white-space:nowrap; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .hp-open:hover { background:var(--green-strong); color:var(--ac-ink); } }
  .hp-open.big { grid-column:1 / -1; justify-self:center; height:40px; padding:0 22px; font-size:12.5px; }
  .hp-btn { border-color:var(--green-strong); color:var(--green); } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .hp-btn:hover { background:var(--green-bg); } } body.on-comp #btn-help { display:inline-block; }
  .mh-steps { display:inline-flex; flex-wrap:wrap; align-items:center; gap:4px 6px; font-weight:600; } .mh-steps i { font-style:normal; display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:50%; background:var(--green-strong); color:var(--ac-ink); font-size:10.5px; font-weight:800; } .mh-steps u { text-decoration:none; color:var(--text-faint); }
  .dq-rules.mini > div { padding-top:12px; padding-bottom:12px; } .rk-head a[data-hp], .home-hero a[data-hp] { color:var(--green); font-weight:800; text-decoration:none; white-space:nowrap; }
  @media (max-width:760px) { .hp { padding:12px 14px 14px; border-radius:18px; } .hp-card h3 { font-size:19px; } .hp-card p { font-size:14px; } .hp-act .btn { padding:10px 13px; font-size:12px; } #btn-help span { display:none; } .mode-help { gap:8px; } }
  /* ===== v4.7: lišta modulov, zbalený návod na úvode ===== */
  @media (min-width:761px) and (max-width:1100px) { .tabs, .app.wide .tabs, body.fs-on .tabs { flex-wrap:wrap; overflow:visible; } .tabs .tab { flex:1 1 auto; } }
  @media (max-width:760px) {
    .tabs.more-r { -webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 44px),transparent 100%); mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 44px),transparent 100%); }
    .tabs.more-l { -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 44px,#000 100%); mask-image:linear-gradient(90deg,transparent 0,#000 44px,#000 100%); }
    .tabs.more-l.more-r { -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 44px,#000 calc(100% - 44px),transparent 100%); mask-image:linear-gradient(90deg,transparent 0,#000 44px,#000 calc(100% - 44px),transparent 100%); }
  }
  .home-more { margin-top:22px; border:1px solid var(--border); border-radius:14px; background:var(--panel-2); padding:0 16px; }
  .home-more > summary { cursor:pointer; padding:14px 0; font-family:var(--mono); font-size:11.5px; font-weight:700; letter-spacing:0.14em; color:var(--green); list-style:none; display:flex; justify-content:space-between; gap:10px; }
  .home-more > summary::-webkit-details-marker { display:none; } .home-more > summary::after { content:'+'; font-size:16px; } .home-more[open] > summary::after { content:'−'; } .home-more[open] { padding-bottom:16px; } .home-more .home-h:first-of-type { margin-top:6px; }
  /* ===== v4.8: hlavička vždy viditeľná, päta, chyby, lupa, telefón na šírku ===== */
  header, .app.wide header { display:flex !important; } body.fs-on header { display:flex !important; padding:4px 12px; margin-bottom:6px; min-height:0; } body.fs-on header .brand2 { font-size:14px; padding:3px 10px; } body.fs-on .panel { min-height:calc(100vh - 118px); min-height:calc(100dvh - 118px); } body.fs-on .qcard.split { --mapoff:252px; }
  .app.wide header { padding:8px 18px; margin-bottom:10px; }
  @media (min-width:1101px) and (max-height:820px) { header { padding:8px 18px; margin-bottom:10px; } }
  @media (max-width:560px) { header { padding:8px 12px; margin-bottom:10px; border-radius:14px; } .brand-sub { display:none; } .brand-mark { font-size:13px; } }
  .brand-sub .beta { display:inline-block; margin-left:6px; padding:1px 7px; border-radius:99px; background:#ffbe0b; color:#1a1400; font-weight:800; font-size:9.5px; letter-spacing:0.14em; vertical-align:1px; }
  .weak-title em { font-style:normal; font-weight:500; letter-spacing:0.02em; text-transform:none; color:var(--text-dim); font-size:11.5px; }
  button.weak-item { cursor:pointer; font:inherit; transition:transform 0.12s, box-shadow 0.12s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) button.weak-item:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(0,0,0,0.12); } }
  #wk-wrap { position:fixed; inset:0; z-index:400; display:flex; align-items:center; justify-content:center; padding:14px; background:hsl(var(--ah) calc(50% * var(--asf)) 5% / 0.72); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); animation:hpFade 0.2s ease; }
  .hp.wk { width:min(440px,100%); } .wk-ask { margin:12px 0 10px; font-family:var(--display); font-weight:800; font-size:21px; text-align:center; overflow-wrap:anywhere; }
  .wk-row { display:flex; flex-direction:column; gap:3px; padding:11px 14px; border-radius:14px; margin-top:8px; } .wk-row em { font-style:normal; font-family:var(--mono); font-size:10px; letter-spacing:0.16em; font-weight:800; } .wk-row b { font-size:17px; overflow-wrap:anywhere; }
  .wk-row.no { background:hsla(6,83%,62%,0.16); color:hsl(3,71%,72%); } .wk-row.ok { background:hsla(148,51%,62%,0.16); color:hsl(153,85%,78%); } .hp.wk .hp-act { margin-top:14px; }
  .site-foot2 { position:relative; z-index:2; margin-top:22px; display:grid; grid-template-columns:1.5fr 1fr 1.2fr; gap:22px; padding:22px 26px; border-radius:20px; background:hsl(var(--ah) calc(47% * var(--asf)) 6% / 0.86); border:1px solid rgba(255,255,255,0.1); color:#b9d6c8; font-size:13px; line-height:1.5; }
  .site-foot2 strong { display:block; font-family:var(--display); font-size:17px; color:#fff; letter-spacing:0.04em; } .site-foot2 small { display:block; margin-top:8px; font-family:var(--mono); font-size:11px; color:#8fb3a1; } .site-foot2 small b { color:hsl(var(--ah) calc(75% * var(--asf)) 57%); }
  .sf-col { display:flex; flex-direction:column; align-items:flex-start; gap:7px; } .sf-col em { font-style:normal; font-family:var(--mono); font-size:10.5px; letter-spacing:0.18em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); font-weight:800; }
  .sf-col a, .sf-col button { background:none; border:none; padding:0; color:hsl(var(--ah) calc(39% * var(--asf)) 94%); font:inherit; font-weight:700; text-decoration:none; cursor:pointer; transition:color 0.15s, transform 0.15s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .sf-col a:hover, :where(html:not(.touch)) .sf-col button:hover { color:hsl(var(--ah) calc(75% * var(--asf)) 57%); transform:translateX(3px); } }
  .sf-col a.sf-mail { font-family:var(--mono); font-size:13.5px; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); overflow-wrap:anywhere; }
  body.fs-on .site-foot2, body.dq-live .site-foot2 { display:none; }
  @media (max-width:760px) { .site-foot2 { grid-template-columns:1fr; gap:16px; padding:18px; } }
  .mz-bar { position:absolute; right:8px; top:8px; z-index:3; display:flex; gap:5px; } .mz-bar button { height:34px; min-width:38px; padding:0 8px; border-radius:10px; border:1px solid var(--border-bright); background:rgba(255,255,255,0.94); color:var(--text); font-size:13px; font-weight:800; cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,0.12); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mz-bar button:hover { background:var(--green-bg); border-color:var(--green-strong); } } .map-wrap.mz-in svg { cursor:grab; touch-action:none; } .map-wrap svg { touch-action:pan-y; }
  .rk-rules { margin-top:14px; border:1px solid var(--border); border-radius:14px; background:var(--panel-2); padding:0 16px; } .rk-rules[open] { padding-bottom:12px; }
  .rk-rules > summary { cursor:pointer; padding:13px 0; font-family:var(--mono); font-size:11.5px; font-weight:700; letter-spacing:0.12em; color:var(--green); list-style:none; } .rk-rules > summary::-webkit-details-marker { display:none; } .rk-rules > summary::before { content:'+ '; } .rk-rules[open] > summary::before { content:'− '; }
  .rk-rules table { width:100%; border-collapse:collapse; font-size:13px; line-height:1.5; } .rk-rules th { text-align:left; vertical-align:top; padding:8px 14px 8px 0; width:210px; font-weight:800; } .rk-rules td { padding:8px 0; color:var(--text-dim); } .rk-rules tr + tr th, .rk-rules tr + tr td { border-top:1px solid var(--border); } .rk-rules td b { color:var(--green); }
  @media (max-width:760px) { .rk-rules th, .rk-rules td { display:block; width:auto; padding:6px 0; } .rk-rules tr + tr td { border-top:none; padding-top:0; } }
  .rk-pw { display:flex; align-items:center; gap:10px; margin-top:10px; font-size:12px; color:var(--text-dim); } .rk-pw i { flex:none; width:90px; height:6px; border-radius:99px; background:var(--border); position:relative; overflow:hidden; }
  .rk-pw i::after { content:''; position:absolute; left:0; top:0; bottom:0; width:0; border-radius:99px; transition:width 0.25s, background 0.25s; } .rk-pw[data-s="0"] i::after { width:15%; background:#d6352b; } .rk-pw[data-s="1"] i::after { width:40%; background:#e08a00; } .rk-pw[data-s="2"] i::after { width:72%; background:hsl(var(--ah) calc(88% * var(--asf)) 33%); } .rk-pw[data-s="3"] i::after { width:100%; background:hsl(var(--ah) calc(85% * var(--asf)) 26%); }
  /* telefón na šírku: hra sa zmestí na nízku obrazovku tak ako na notebooku */
  @media (orientation:landscape) and (max-height:540px) {
    #dq-stage .dq-top { flex-wrap:nowrap; padding:3px 8px; gap:8px; } #dq-stage .dq-brand { display:none; }
    #dq-stage .dq-players { order:0; flex:1 1 auto; flex-basis:auto; flex-wrap:nowrap; overflow-x:auto; gap:5px; scrollbar-width:none; } #dq-stage .dq-chip { flex:0 0 auto; padding:3px 8px; font-size:11.5px; gap:5px; } #dq-stage .dq-chip small { display:none; } #dq-stage .dq-chip b { font-size:12.5px; margin-left:0; }
    #dq-stage .dq-tools { margin-left:0; gap:4px; } #dq-stage .dq-tools button { height:28px; min-width:28px; padding:0 6px; font-size:12px; }
    #dq-stage .dq-status { flex-wrap:nowrap; padding:3px 10px 5px; font-size:12px; gap:8px; } #dq-stage .dq-status span { min-width:0; flex:1 1 auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    #dq-stage .dq-bottom { display:none; } #dq-stage .dq-mapwrap { padding:2px; } #dq-maph, #dq-fxl { inset:2px 4px; } #dq-toast { top:6px; } .dq-toast-in { padding:6px 16px 7px; } .dq-toast-in b { font-size:15px; } .dq-vs span { font-size:14px; } .dq-vs span i { width:24px; height:24px; font-size:12px; }
    #dq-poph.dq-pop-wrap { padding:5px; } .dq-pop { padding:9px 14px 9px; border-radius:16px; width:min(780px,100%); } .dq-pop::before, .dq-pop::after { display:none; }
    .dq-pop-top { font-size:10px; } .dq-pop-time { font-size:20px; } .dq-pop .dq-timer { margin-top:5px; } .dq-pop-ctx { margin-top:5px; font-size:12px; }
    .dq-pop-q { margin-top:6px; font-size:clamp(17px,3.6vw,26px); } .dq-pop-q.long { font-size:clamp(15px,2.6vw,20px); } .dq-pop-q.xl { font-size:14px; line-height:1.2; } .dq-pop-s { margin-top:3px; font-size:12px; }
    .dq-pop .dq-opts { margin-top:7px; gap:6px; } .dq-pop .choice-btn { min-height:40px; padding:6px 10px; font-size:13.5px; } .dq-pop-foot { margin-top:6px; font-size:11.5px; } .dq-jk { margin-top:6px; } .dq-jk button { height:30px; }
    .dq-rib { margin:-9px -14px 7px; padding:6px 10px; font-size:12.5px; border-radius:15px 15px 0 0; } .dq-count { height:104px; } .dq-count b { font-size:84px; } .dq-count b.go { font-size:64px; }
    .dq-pop-img { height:min(40vh,150px); margin-top:6px; } .dq-numrev { grid-template-columns:1fr 1fr; gap:10px; margin-top:6px; } .dq-axis { max-height:128px; } .dq-numbox input { height:44px; font-size:20px; } .dq-numbox .dq-btn { height:44px; } .dq-numrow { padding:4px 10px; }
    .dq-modgrid { gap:5px; } .dq-modbtn { min-height:36px; padding:4px 8px; font-size:11.5px; } .dq-endacts { margin-top:8px; } .dq-btn { height:34px; }
    .dq-podium { margin-top:8px; } .dq-podium i { width:30px; height:30px; font-size:15px; } .dq-podium b { height:30px; font-size:18px; padding-top:3px; } .dq-podium .p1 b { height:46px; } .dq-podium .p3 b { height:22px; }
    #dq-picker.on { padding:4px 8px; max-height:74px; overflow:auto; }
    #dq-coach { left:auto; right:6px; bottom:6px; transform:none; width:min(300px,38%); } .dq-coach-in { padding:8px 10px; } .dq-coach-in b { font-size:13.5px; } .dq-coach-in p { font-size:11.5px; line-height:1.35; } .dq-coach-in .dq-btn { height:30px; font-size:10.5px; padding:0 10px; }
    #dq-stage.demo #dq-poph.dq-pop-wrap { align-items:center; padding-bottom:5px; padding-right:min(312px,40%); }
    .hp { padding:10px 14px 12px; } .hp-svg { max-width:230px; } .hp-card h3 { font-size:18px; margin-top:2px; } .hp-card p { min-height:0; font-size:13.5px; } .hp-dots { margin:8px 0 6px; }
  }
  /* ===== v4.8: profil, priatelia, správy ===== */
  html[data-bg="blue"] #radar-bg { filter:hue-rotate(62deg); } html[data-bg="violet"] #radar-bg { filter:hue-rotate(118deg); } html[data-bg="amber"] #radar-bg { filter:hue-rotate(-118deg); } html[data-bg="mono"] #radar-bg { filter:grayscale(1) brightness(1.15); }
  html[data-bg="blue"], html[data-bg="blue"] body { background:#060e16; } html[data-bg="violet"], html[data-bg="violet"] body { background:#0d0714; } html[data-bg="amber"], html[data-bg="amber"] body { background:#140c05; } html[data-bg="mono"], html[data-bg="mono"] body { background:#0b0c0e; }
  .inbox-btn { position:relative; width:36px; height:34px; border-radius:999px; border:1.5px solid rgba(255,255,255,0.3); background:rgba(255,255,255,0.1); color:#fff; font-size:15px; cursor:pointer; transition:background 0.15s, transform 0.15s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .inbox-btn:hover { background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.22); transform:translateY(-1px); } }
  .inbox-btn i { position:absolute; right:-5px; top:-6px; min-width:18px; height:18px; padding:0 4px; border-radius:99px; background:#e63946; color:#fff; font-style:normal; font-family:var(--mono); font-size:10.5px; font-weight:800; display:flex; align-items:center; justify-content:center; } .inbox-btn.has { border-color:#e63946; animation:pfBell 1.6s ease-in-out infinite; } @keyframes pfBell { 50% { box-shadow:0 0 0 5px rgba(230,57,70,0.25); } }
  .acct-btn { display:inline-flex; align-items:center; gap:7px; transition:background 0.15s, transform 0.15s, box-shadow 0.15s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .acct-btn:hover { transform:translateY(-1px); } } .acct-btn img { width:22px; height:22px; border-radius:50%; object-fit:cover; margin-left:-6px; }
  #soc-toasts { position:fixed; right:14px; top:14px; z-index:450; display:flex; flex-direction:column; gap:10px; width:min(340px, calc(100vw - 28px)); }
  .soc-toast { padding:13px 15px 14px; border-radius:16px; background:#0e1512; border:2px solid hsl(var(--ah) calc(75% * var(--asf)) 57%); color:#fff; box-shadow:0 18px 50px rgba(0,0,0,0.6); display:flex; flex-direction:column; gap:3px; animation:socIn 0.4s var(--spring); } @keyframes socIn { from { opacity:0; transform:translateX(40px); } }
  .soc-toast.k-invite { border-color:#ffd34d; } .soc-toast small { font-family:var(--mono); font-size:10px; letter-spacing:0.16em; font-weight:800; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .soc-toast.k-invite small { color:#ffd34d; } .soc-toast b { font-size:15.5px; } .soc-toast span { font-size:13px; color:#b9d6c8; } .soc-toast span strong { font-family:var(--mono); color:#ffd34d; letter-spacing:0.16em; }
  .soc-toast div { display:flex; gap:8px; margin-top:9px; } .soc-toast .btn { padding:9px 14px; font-size:12px; } .soc-toast .btn.ghost { background:transparent; color:#fff; border-color:rgba(255,255,255,0.3); }
  .pf-hero { display:flex; align-items:center; gap:16px; padding:18px 20px; border-radius:20px; background:linear-gradient(135deg,hsl(var(--ah) calc(39% * var(--asf)) 10%),hsl(var(--ah) calc(61% * var(--asf)) 23%)); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); } .pf-hero > div { flex:1; min-width:0; } .pf-hero h2 { margin:0; color:#fff; font-size:26px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .pf-hero p { margin:3px 0 0; font-size:13.5px; opacity:0.85; }
  .pf-hero .btn.ghost { background:rgba(255,255,255,0.1); color:#fff; border-color:rgba(255,255,255,0.3); } .pf-hero.out { background:var(--panel-2); color:var(--text-dim); border:1px solid var(--border); } .pf-hero.out h2 { color:var(--text); } .pf-hero.out p { max-width:640px; line-height:1.5; }
  .pf-av { flex:none; width:38px; height:38px; border-radius:50%; overflow:hidden; display:inline-flex; align-items:center; justify-content:center; background:linear-gradient(135deg,hsl(var(--ah) calc(83% * var(--asf)) 42%),hsl(var(--ah) calc(85% * var(--asf)) 26%)); color:var(--ac-ink); font-family:var(--display); font-weight:800; font-size:17px; } .pf-av img { width:100%; height:100%; object-fit:cover; } .pf-av.big { width:68px; height:68px; font-size:30px; box-shadow:0 0 0 3px rgba(255,255,255,0.25); }
  .pf-tabs { display:flex; gap:6px; margin:14px 0 4px; padding:5px; border-radius:16px; background:var(--panel-2); border:1px solid var(--border); overflow-x:auto; scrollbar-width:none; }
  .pf-tabs button { flex:1 0 auto; padding:10px 14px; border:none; border-radius:12px; background:transparent; color:var(--text-dim); font-family:var(--ui); font-weight:800; font-size:12px; letter-spacing:0.08em; cursor:pointer; white-space:nowrap; transition:background 0.18s, color 0.18s, transform 0.18s; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-tabs button:hover { background:hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.1); color:var(--text); } } .pf-tabs button.on { background:var(--green-strong); color:var(--ac-ink); box-shadow:0 6px 16px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.3); } .pf-tabs i, .pf-tabs u { font-style:normal; text-decoration:none; display:inline-block; min-width:18px; padding:0 5px; margin-left:4px; border-radius:99px; font-family:var(--mono); font-size:10.5px; line-height:18px; color:#fff; background:#e63946; } .pf-tabs u { background:hsl(var(--ah) calc(88% * var(--asf)) 33%); } .pf-tabs button.on u { background:rgba(255,255,255,0.28); }
  .pf-body { animation:pfIn 0.22s ease; min-height:260px; } @keyframes pfIn { from { opacity:0.35; transform:translateY(6px); } } .pf-body.still, .pf-body.still * { animation:none !important; }
  .pf-kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:12px; } .pf-kpis > div, .pf-card { padding:14px 16px; border-radius:16px; background:rgba(255,255,255,0.07); border:1px solid var(--border); transition:transform 0.18s, box-shadow 0.18s, border-color 0.18s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-kpis > div:hover, :where(html:not(.touch)) .pf-card:hover { transform:translateY(-3px); box-shadow:0 12px 28px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.12); border-color:var(--green-strong); } }
  .pf-kpis small, .pf-card h3 { display:block; margin:0; font-family:var(--mono); font-size:10.5px; letter-spacing:0.16em; color:var(--text-dim); font-weight:700; } .pf-kpis b { display:block; font-family:var(--display); font-size:30px; font-weight:800; line-height:1.15; color:var(--green); } .pf-kpis span { font-size:12px; color:var(--text-dim); }
  .pf-cards { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:10px; } .pf-card { display:flex; flex-direction:column; gap:10px; } .pf-card .pf-kv { flex:1; font-size:13.5px; } .pf-card .btn { padding:10px 12px; font-size:12px; }
  .pf-ok { margin-top:10px; padding:10px 14px; border-radius:12px; background:var(--green-bg); color:var(--green); font-weight:700; font-size:13.5px; } .pf-ver { margin-top:22px; text-align:center; font-family:var(--mono); font-size:11px; letter-spacing:0.12em; color:var(--text-faint); }
  .pf-add { display:flex; gap:8px; margin-top:12px; } .pf-add input, .pf-add select, .pf-form input { flex:1 1 170px; min-width:0; height:44px; padding:0 14px; border-radius:12px; border:1.5px solid var(--border-bright); background:rgba(255,255,255,0.07); font-family:var(--ui); font-size:15px; font-weight:600; color:var(--text); transition:border-color 0.15s, box-shadow 0.15s; } .pf-add select { flex:0 0 150px; }
  .pf-add input:focus, .pf-add select:focus, .pf-form input:focus { outline:none; border-color:var(--green-strong); box-shadow:0 0 0 3px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.18); }
  .pf-fr, .pf-msg { display:flex; align-items:center; gap:12px; padding:11px 14px; margin-top:7px; border-radius:14px; background:rgba(255,255,255,0.07); border:1px solid var(--border); transition:transform 0.15s, box-shadow 0.15s, border-color 0.15s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-fr:hover, :where(html:not(.touch)) .pf-msg:hover { transform:translateX(3px); box-shadow:0 8px 20px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.1); } }
  .pf-fr > div:nth-child(2), .pf-msg > div:first-child { flex:1; min-width:0; display:flex; flex-direction:column; } .pf-fr b, .pf-msg b { font-size:15px; } .pf-fr span, .pf-msg span { font-size:12.5px; color:var(--text-dim); overflow-wrap:anywhere; } .pf-fr span i { display:inline-block; width:8px; height:8px; border-radius:50%; background:hsl(var(--ah) calc(83% * var(--asf)) 42%); margin-right:6px; box-shadow:0 0 0 3px hsl(var(--ah) calc(83% * var(--asf)) 42% / 0.2); }
  .pf-fr.on { border-color:var(--green-strong); } .pf-fr.on span { color:var(--green); font-weight:700; } .pf-fr.req { border-color:#ffbe0b; background:hsla(45,85%,62%,0.16); } .pf-fr.dim { opacity:0.65; }
  .pf-fr-b { display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:center; gap:6px; } .pf-fr-b .btn { padding:8px 12px; font-size:11.5px; } .pf-x { width:30px; height:30px; border-radius:9px; border:1px solid var(--border); background:rgba(255,255,255,0.07); color:var(--text-dim); cursor:pointer; transition:background-color 0.15s, border-color 0.15s, color 0.15s, transform 0.15s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-x:hover { background:hsla(6,83%,62%,0.16); border-color:#d6352b; color:#d6352b; } }
  .pf-msg small { font-family:var(--mono); font-size:9.5px; letter-spacing:0.14em; color:var(--text-faint); font-weight:700; } .pf-msg.new { border-color:var(--green-strong); box-shadow:inset 4px 0 0 var(--green-strong); } .pf-msg.k-invite span strong { font-family:var(--mono); letter-spacing:0.14em; color:var(--green); } .pf-acts { margin-top:12px; text-align:right; }
  .pf-set { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; } .pf-set section { padding:16px 18px; border-radius:16px; background:rgba(255,255,255,0.07); border:1px solid var(--border); display:flex; flex-direction:column; gap:9px; transition:box-shadow 0.18s, border-color 0.18s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-set section:hover { box-shadow:0 10px 24px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.08); border-color:var(--border-bright); } }
  .pf-set section.wide { grid-column:1 / -1; } .pf-set section.danger { border-color:#f1c4c0; background:hsla(0,85%,62%,0.16); } .pf-set h3 { margin:0; font-family:var(--mono); font-size:11px; letter-spacing:0.16em; color:var(--text-dim); } .pf-set h3 em { font-style:normal; font-weight:500; letter-spacing:0.02em; } .pf-set small { font-size:12px; color:var(--text-dim); line-height:1.45; }
  .pf-form { display:flex; flex-wrap:wrap; gap:8px; } .pf-form .btn { padding:11px 16px; font-size:12px; } .pf-avrow { display:flex; align-items:center; gap:14px; } .pf-avrow > div { display:flex; flex-wrap:wrap; align-items:center; gap:8px; } .pf-avrow small { flex-basis:100%; } .pf-avrow .pf-av.big { box-shadow:0 0 0 3px var(--border); }
  .pf-file { position:relative; overflow:hidden; cursor:pointer; padding:10px 14px; font-size:12px; } .pf-file input { position:absolute; inset:0; opacity:0; cursor:pointer; } .pf-set .dq-look { border:none; padding:0; }
  .pf-bg { height:36px; padding:0 14px 0 34px; border-radius:99px; border:1.5px solid var(--border); background:rgba(255,255,255,0.07); font-family:var(--ui); font-weight:800; font-size:11.5px; letter-spacing:0.06em; cursor:pointer; position:relative; transition:background-color 0.15s, border-color 0.15s, color 0.15s, transform 0.15s; } .pf-bg::before { content:''; position:absolute; left:9px; top:50%; width:18px; height:18px; margin-top:-9px; border-radius:50%; background:var(--c); } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-bg:hover { transform:translateY(-1px); } } .pf-bg.on { border-color:var(--c); box-shadow:0 0 0 3px color-mix(in srgb, var(--c) 25%, transparent); }
  .dq-inv { margin-top:10px; padding:10px 12px; border:1.5px dashed var(--green-strong); border-radius:12px; background:var(--green-bg); } .dq-inv strong { display:block; font-family:var(--mono); font-size:10.5px; letter-spacing:0.14em; color:var(--green); } .dq-inv > div { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; } .dq-inv small { display:block; margin-top:6px; font-size:11.5px; color:var(--text-dim); }
  @media (max-width:900px) { .pf-kpis, .pf-cards { grid-template-columns:1fr 1fr; } .pf-set { grid-template-columns:1fr; } }
  @media (max-width:560px) { .pf-hero { padding:14px; gap:12px; } .pf-hero h2 { font-size:20px; } .pf-av.big { width:52px; height:52px; font-size:22px; } .pf-hero #pf-refresh { display:none; } .pf-add { flex-wrap:wrap; } .pf-add select { flex:1 1 100%; } .pf-fr, .pf-msg { flex-wrap:wrap; } .pf-fr-b { flex-basis:100%; justify-content:flex-start; } .pf-kpis b { font-size:24px; } .inbox-btn { width:32px; height:32px; } }
  /* ===== v4.9: hlavička, okno modulov, ligy, aktivita ===== */
  header.hd2 { display:grid !important; grid-template-columns:1fr auto 1fr; align-items:center; gap:12px; padding:10px 18px; } header.hd2 .clock { justify-self:start; } header.hd2 .head-r { justify-self:end; }
  .brand2 { position:relative; display:inline-flex; align-items:center; gap:10px; padding:8px 20px 9px; border:1px solid transparent; border-radius:16px; background:transparent; color:#fff; font-family:var(--ui); font-weight:800; font-size:21px; letter-spacing:0.16em; cursor:pointer; text-shadow:0 0 22px hsl(var(--ah) calc(75% * var(--asf)) 61% / 0.4); transition:transform 0.22s var(--spring), background 0.2s, border-color 0.2s, box-shadow 0.2s, letter-spacing 0.25s; }
  .brand2.on { background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.12); border-color:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.45); box-shadow:0 10px 30px hsl(var(--ah) calc(88% * var(--asf)) 40% / 0.28); }@media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .brand2:hover { background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.12); border-color:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.45); box-shadow:0 10px 30px hsl(var(--ah) calc(88% * var(--asf)) 40% / 0.28); } } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .brand2:hover { transform:translateY(-2px) scale(1.04); letter-spacing:0.2em; } } .brand2:active { transform:scale(0.98); }
  .brand2 .beta { padding:2px 8px; border-radius:99px; background:#ffbe0b; color:#1a1400; font-size:10px; letter-spacing:0.14em; text-shadow:none; }
  .brand2 i { position:absolute; left:50%; bottom:-9px; transform:translate(-50%,6px); padding:1px 9px; border-radius:99px; background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:hsl(154,67%,88%); font-style:normal; font-family:var(--mono); font-size:9px; letter-spacing:0.18em; opacity:0; transition:opacity 0.2s, transform 0.2s; pointer-events:none; text-shadow:none; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .brand2:hover i { opacity:1; transform:translate(-50%,0); } }
  header.hd2 .clock { transition:background 0.2s, transform 0.2s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) header.hd2 .clock:hover { background:rgba(255,255,255,0.14); transform:translateY(-1px); } }
  .tabs.nav2, .app.wide .tabs.nav2, body.fs-on .tabs.nav2 { display:grid !important; grid-template-columns:1.25fr 1fr 1fr 1fr; gap:10px; overflow:visible; -webkit-mask-image:none !important; mask-image:none !important; }
  .tabs.nav2 .tab { transition:transform 0.18s, box-shadow 0.18s, border-color 0.18s, background 0.18s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .tabs.nav2 .tab:hover { transform:translateY(-2px); border-color:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.5); box-shadow:0 10px 24px rgba(0,0,0,0.3); } } .tabs.nav2 .tab:active { transform:scale(0.98); }
  .tabs.nav2 .tab-label { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; }
  #mods-wrap { position:fixed; inset:0; z-index:380; display:flex; align-items:flex-start; justify-content:center; padding:min(11vh,110px) 14px 14px; background:hsl(var(--ah) calc(50% * var(--asf)) 5% / 0.74); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); animation:hpFade 0.2s ease; overflow:auto; } #mods-wrap.out { opacity:0; transition:opacity 0.18s; }
  .mods { width:min(860px,100%); border-radius:24px; background:hsla(135,29%,62%,0.16); color:hsl(153,48%,86%); box-shadow:0 30px 90px rgba(0,0,0,0.6); padding:18px 20px 20px; font-family:var(--ui); animation:modsIn 0.34s var(--spring-soft); } @keyframes modsIn { from { opacity:0; transform:translateY(-22px) scale(0.96); } }
  .mods-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; } .mods-top small { display:block; font-family:var(--mono); font-size:10.5px; letter-spacing:0.18em; color:hsl(153,88%,75%); font-weight:800; } .mods-top b { font-family:var(--display); font-size:24px; letter-spacing:-0.01em; }
  .mods-top button { width:36px; height:36px; border-radius:12px; border:1px solid rgba(255,255,255,0.16); background:rgba(255,255,255,0.07); cursor:pointer; font-size:15px; transition:background 0.15s, transform 0.15s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-top button:hover { background:hsla(144,25%,62%,0.16); transform:rotate(90deg); } }
  .mods-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
  .mods-card { display:flex; flex-direction:column; gap:8px; padding:10px 12px 13px; border-radius:18px; border:1.5px solid rgba(255,255,255,0.16); background:rgba(255,255,255,0.07); text-align:left; cursor:pointer; font-family:inherit; color:inherit; animation:modsCard 0.4s var(--spring-soft) both; transition:transform 0.2s, box-shadow 0.2s, border-color 0.2s; } @keyframes modsCard { from { opacity:0; transform:translateY(16px) scale(0.96); } }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover { transform:translateY(-4px); border-color:hsl(var(--ah) calc(88% * var(--asf)) 33%); box-shadow:0 16px 34px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.18); } } .mods-card:active { transform:scale(0.98); } .mods-card.on { border-color:hsl(var(--ah) calc(88% * var(--asf)) 33%); box-shadow:0 0 0 3px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.2); }
  .mods-card .hp-svg { max-width:none; margin:0; border-radius:12px; } .mods-card small { font-family:var(--mono); font-size:10px; letter-spacing:0.16em; color:hsl(153,88%,75%); font-weight:800; } .mods-card b { display:block; font-size:16.5px; } .mods-card span { display:block; font-size:12.5px; color:hsl(215,22%,76%); line-height:1.4; }
  .mods-card i { display:block; height:6px; margin-top:8px; border-radius:99px; background:hsla(140,19%,62%,0.16); overflow:hidden; } .mods-card i em { display:block; height:100%; border-radius:99px; background:hsl(var(--ah) calc(88% * var(--asf)) 33%); } .mods-card u { display:block; margin-top:4px; text-decoration:none; font-size:11px; color:hsl(215,22%,70%); }
  .mods-card.wide { grid-column:1 / -1; flex-direction:row; align-items:center; background:linear-gradient(135deg,hsl(var(--ah) calc(39% * var(--asf)) 10%),hsl(var(--ah) calc(61% * var(--asf)) 23%)); color:#fff; border-color:transparent; } .mods-card.wide .hp-svg { width:170px; flex:none; } .mods-card.wide small { color:hsl(var(--ah) calc(79% * var(--asf)) 72%); } .mods-card.wide span { color:hsl(var(--ah) calc(32% * var(--asf)) 86%); } .mods-card.wide b { font-size:20px; }
  .dc-done { margin:12px auto 0; max-width:640px; padding:10px 14px; border-radius:12px; background:var(--green-bg); color:var(--green); font-size:13.5px; } .dc-done b { font-family:var(--mono); }
  .rk-chips.main { margin-top:14px; } .rk-chips.main .rk-chip { padding:10px 16px; font-size:12px; }
  .lg-head { display:flex; align-items:center; gap:14px; margin-top:14px; padding:16px 18px; border-radius:18px; background:linear-gradient(135deg, color-mix(in srgb, var(--c) 82%, #000), color-mix(in srgb, var(--c) 45%, hsl(var(--ah) calc(48% * var(--asf)) 8%))); color:#fff; } .lg-head strong { display:block; font-family:var(--display); font-size:22px; letter-spacing:0.04em; } .lg-head span { font-size:13px; opacity:0.9; }
  .lg-badge { flex:none; width:54px; height:60px; clip-path:polygon(50% 0, 100% 22%, 100% 70%, 50% 100%, 0 70%, 0 22%); background:rgba(255,255,255,0.92); display:flex; align-items:center; justify-content:center; } .lg-badge b { font-family:var(--display); font-size:26px; color:var(--c); }
  .lg-steps { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; margin-top:10px; } .lg-steps button { padding:9px 6px; border-radius:12px; border:1.5px solid var(--border); background:rgba(255,255,255,0.07); font-family:var(--ui); font-weight:800; font-size:11px; letter-spacing:0.06em; color:var(--text-dim); cursor:pointer; border-bottom:4px solid var(--c); transition:transform 0.15s, box-shadow 0.15s; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .lg-steps button:hover { transform:translateY(-2px); box-shadow:0 8px 18px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.1); } } .lg-steps button.on { background:var(--c); color:#fff; border-color:var(--c); } .lg-steps button.me::after { content:' ●'; } .lg-steps small { display:block; font-family:var(--mono); font-weight:600; opacity:0.75; }
  .lg-up { color:hsl(153,85%,78%); } .lg-dn { color:hsl(6,63%,72%); } tr.z-up td { background:hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.07); } tr.z-dn td { background:rgba(214,53,43,0.06); } td.lg-z { font-size:11.5px; font-weight:800; white-space:nowrap; } tr.z-up td.lg-z { color:hsl(153,85%,78%); } tr.z-dn td.lg-z { color:hsl(6,63%,72%); }
  .lg-dot { display:inline-block; width:8px; height:8px; border-radius:2px; transform:rotate(45deg); margin:0 8px 0 2px; vertical-align:1px; }
  .pf-act { margin-top:10px; padding:14px 16px 12px; border-radius:16px; background:rgba(255,255,255,0.07); border:1px solid var(--border); } .pf-act-t { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:6px 14px; } .pf-act h3 { margin:0; font-family:var(--mono); font-size:10.5px; letter-spacing:0.16em; color:var(--text-dim); } .pf-act-t span { font-size:13.5px; font-weight:700; color:var(--green); }
  .pf-bars { display:grid; grid-template-columns:repeat(14,1fr); gap:5px; height:128px; margin-top:12px; align-items:end; } .pf-bars > div { height:100%; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:3px; min-width:0; }
  .pf-bars i { display:block; width:100%; max-width:30px; border-radius:6px 6px 2px 2px; background:#c9d9d0; transition:height 0.5s var(--ease-out), background 0.2s; animation:pfBar 0.6s ease both; transform-origin:bottom; } @keyframes pfBar { from { transform:scaleY(0); } } .pf-bars .w1 i { background:var(--green-strong); } .pf-bars .today i { background:#ffb020; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-bars > div:hover i { filter:brightness(1.12); } }
  .pf-bars u { text-decoration:none; font-family:var(--mono); font-size:9.5px; color:var(--text-dim); height:12px; } .pf-bars small { font-family:var(--mono); font-size:9px; line-height:1.15; text-align:center; color:var(--text-faint); }
  .pf-act-f { display:flex; justify-content:space-between; margin-top:8px; font-size:12px; color:var(--text-dim); } .pf-act-f b { color:var(--text); font-family:var(--mono); }
  .site-foot2 { transition:border-color 0.25s, box-shadow 0.25s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .site-foot2:hover { border-color:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.35); box-shadow:0 18px 50px rgba(0,0,0,0.35); } } .site-foot2 .sf-brand strong { transition:letter-spacing 0.25s, color 0.2s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .site-foot2 .sf-brand:hover strong { letter-spacing:0.1em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } }
  .sf-col a, .sf-col button { position:relative; } .sf-col a::after, .sf-col button::after { content:''; position:absolute; left:0; right:100%; bottom:-2px; height:2px; background:hsl(var(--ah) calc(75% * var(--asf)) 57%); transition:right 0.22s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .sf-col a:hover::after, :where(html:not(.touch)) .sf-col button:hover::after { right:0; } }
  @media (max-width:760px) { header.hd2 { grid-template-columns:1fr auto; padding:8px 12px; } header.hd2 .clock { display:none; } .brand2 { justify-self:start; font-size:15px; padding:6px 10px; letter-spacing:0.12em; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .brand2:hover { letter-spacing:0.12em; } }
    .tabs.nav2 { grid-template-columns:1fr 1fr; gap:7px; } .mods-grid { grid-template-columns:1fr 1fr; } .mods-card .hp-svg { display:none; } .mods-card.wide .hp-svg { display:none; } .mods { padding:14px; border-radius:20px; } #mods-wrap { padding-top:70px; } .lg-steps button { font-size:9.5px; padding:8px 2px; } .pf-bars { gap:3px; height:104px; } }
  /* ===== v4.9: úrovne ===== */
  .lv-b { --lc:hsl(var(--ah) calc(69% * var(--asf)) 36%); display:inline-flex; align-items:center; gap:6px; height:20px; padding:0 8px 0 0; margin-left:8px; border-radius:99px; background:color-mix(in srgb, var(--lc) 13%, transparent); color:var(--lc); font-style:normal; font-size:11.5px; font-weight:700; white-space:nowrap; vertical-align:1px; }
  .lv-b b { display:inline-flex; align-items:center; height:20px; padding:0 8px; border-radius:99px; background:var(--lc); color:#fff; font-family:var(--mono); font-size:10px; font-weight:800; letter-spacing:0.06em; } .lv-b:not(.full) { padding:0; gap:0; background:none; } .lv-b i { font-style:normal; overflow:hidden; text-overflow:ellipsis; max-width:190px; }
  .lv-b.l1 { --lc:#b0703c; } .lv-b.l2 { --lc:#7f8a96; } .lv-b.l3 { --lc:#c99700; } .lv-b.l4 { --lc:#2a9d97; } .lv-b.l5 { --lc:#4d7fe8; }
  .pf-lv { display:flex; align-items:center; gap:14px; margin-top:10px; padding:12px 16px; border-radius:16px; background:hsl(var(--ah) calc(48% * var(--asf)) 8%); color:#fff; transition:transform 0.18s, box-shadow 0.18s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-lv:hover { transform:translateY(-2px); box-shadow:0 12px 28px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.25); } }
  .pf-lv-n { flex:none; width:62px; text-align:center; } .pf-lv-n small { display:block; font-family:var(--mono); font-size:8.5px; letter-spacing:0.16em; color:hsl(var(--ah) calc(79% * var(--asf)) 72%); } .pf-lv-n b { font-family:var(--display); font-size:34px; line-height:1; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); }
  .pf-lv-m { flex:1; min-width:0; } .pf-lv-m strong { display:block; font-size:16.5px; } .pf-lv-m i { display:block; height:8px; margin:7px 0 5px; border-radius:99px; background:rgba(255,255,255,0.14); overflow:hidden; } .pf-lv-m em { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,hsl(var(--ah) calc(83% * var(--asf)) 42%),hsl(var(--ah) calc(75% * var(--asf)) 57%)); transition:width 0.6s; } .pf-lv-m span { font-size:12px; color:#a9c7b8; }
  .soc-toast.k-level { border-color:hsl(var(--ah) calc(75% * var(--asf)) 57%); background:linear-gradient(135deg,#0e1512,hsl(var(--ah) calc(56% * var(--asf)) 16%)); } .soc-toast.k-level b { font-size:18px; }
  /* ===== v4.10: inštruktor ===== */
  .rk-tbl.ins { overflow-x:auto; margin-top:12px; } .rk-tbl.ins table { font-size:12.5px; } .rk-tbl.ins th, .rk-tbl.ins td { white-space:nowrap; padding:8px 9px; } .rk-tbl.ins td small { display:block; font-size:10px; color:var(--text-faint); }
  .rk-tbl.ins td.bad { color:hsl(6,63%,72%); font-weight:800; } .rk-tbl.ins td.good { color:hsl(153,85%,78%); font-weight:800; } .rk-tbl.ins tbody tr { transition:background 0.15s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .rk-tbl.ins tbody tr:hover td { background:hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.06); } }
  .ins-sp { display:inline-flex; align-items:flex-end; gap:2px; height:26px; width:112px; } .ins-sp i { flex:1; border-radius:2px; background:hsla(140,16%,62%,0.16); } .ins-sp i.on { background:var(--green-strong); }
  /* ===== v4.10.1: okno modulov — čistejšie karty, farebné ilustrácie, pohyb len pod myšou ===== */
  .mods { background:rgba(255,255,255,0.07); padding:22px 24px 24px; } .mods-top { margin-bottom:16px; } .mods-top span { display:block; margin-top:3px; font-size:13.5px; color:hsl(215,22%,73%); }
  .mods-grid { gap:14px; }
  .mods-card { position:relative; padding:0; gap:0; overflow:hidden; border:none; border-radius:20px; background:hsla(150,20%,62%,0.16); box-shadow:0 1px 0 hsl(var(--ah) calc(48% * var(--asf)) 8% / 0.04); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover { box-shadow:0 18px 40px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.2); transform:translateY(-5px); } } .mods-card.on { box-shadow:0 0 0 3px hsl(var(--ah) calc(88% * var(--asf)) 33%); }
  .mods-pic { position:relative; width:100%; aspect-ratio:2 / 1; overflow:hidden; } .mg-svg { width:100%; height:100%; display:block; transition:transform 0.5s var(--ease-out); } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover .mg-svg { transform:scale(1.06); } }
  .mods-pic em { position:absolute; left:12px; top:12px; padding:4px 10px; border-radius:99px; background:rgba(255,255,255,0.94); color:hsl(var(--ah) calc(48% * var(--asf)) 8%); font-style:normal; font-family:var(--mono); font-size:10.5px; font-weight:800; letter-spacing:0.14em; }
  .mods-txt { padding:13px 16px 15px; width:100%; } .mods-card .mods-txt b { font-size:18px; letter-spacing:-0.01em; } .mods-card .mods-txt > span { margin-top:2px; font-size:13px; color:hsl(215,22%,76%); } .mods-card .mods-txt small { display:block; margin-top:6px; font-family:var(--ui); font-size:11.5px; letter-spacing:0; font-weight:600; color:#7a8c82; }
  .mods-pr { display:flex; align-items:center; gap:9px; margin-top:11px; } .mods-card .mods-pr i { flex:1; height:8px; margin:0; border-radius:99px; background:hsla(140,16%,62%,0.16); overflow:hidden; } .mods-card .mods-pr i em { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,hsl(var(--ah) calc(83% * var(--asf)) 42%),hsl(var(--ah) calc(88% * var(--asf)) 33%)); } .mods-card .mods-pr u { margin:0; font-family:var(--mono); font-size:12px; font-weight:800; color:hsl(153,85%,78%); text-decoration:none; }
  .mods-go { position:absolute; right:12px; top:12px; padding:5px 11px; border-radius:99px; background:hsl(var(--ah) calc(48% * var(--asf)) 8%); color:#fff; font-family:var(--ui); font-size:10.5px; font-weight:800; letter-spacing:0.08em; opacity:0; transform:translateY(-6px); transition:opacity 0.2s, transform 0.2s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover .mods-go { opacity:1; transform:none; } }
  .mods-card.wide { flex-direction:row; align-items:stretch; background:hsl(var(--ah) calc(48% * var(--asf)) 8%); color:#fff; } .mods-card.wide .mods-pic { width:42%; flex:none; aspect-ratio:auto; min-height:130px; } .mods-card.wide .mods-txt { display:flex; flex-direction:column; justify-content:center; padding:16px 22px; }
  .mods-card.wide .mods-txt b { font-size:23px; color:#fff; } .mods-card.wide .mods-txt > span { color:hsl(var(--ah) calc(32% * var(--asf)) 86%); font-size:14px; } .mods-card.wide .mods-txt small { color:hsl(var(--ah) calc(79% * var(--asf)) 72%); } .mods-card.wide .mods-go { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:hsl(154,67%,88%); opacity:1; transform:none; top:auto; bottom:14px; right:16px; }
  /* pohyb ilustrácií: zapne sa až pri prejdení myšou (na dotykovej obrazovke pri ťuknutí) */
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover .mg-plane { animation:mgPlane 2.4s ease-in-out infinite; } } @keyframes mgPlane { 0%, 100% { transform:translate(0,0) rotate(0deg); } 50% { transform:translate(10px,-7px) rotate(-3deg); } }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover .mg-cloud { animation:mgCloud 5s linear infinite; } } @keyframes mgCloud { from { transform:translateX(0); } to { transform:translateX(-26px); } }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover .mg-pop { animation:mgPop 1.4s ease-in-out infinite; transform-box:fill-box; transform-origin:center; } } @keyframes mgPop { 50% { transform:scale(1.1); } }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover .mg-pin { animation:mgPin 1s ease-in-out infinite; } } @keyframes mgPin { 50% { transform:translateY(-9px); } }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover .mg-w1 { animation:mgWave 1.1s ease-in-out infinite; } } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover .mg-w2 { animation:mgWave 1.1s ease-in-out 0.25s infinite; } } @keyframes mgWave { 0%, 100% { opacity:0.15; } 50% { opacity:1; } }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover .mg-sweep { animation:mgSweep 2.2s linear infinite; } } @keyframes mgSweep { to { transform:rotate(360deg); } }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover .mg-blip { animation:mgBlip 1.2s ease-in-out infinite; transform-box:fill-box; transform-origin:center; } } @keyframes mgBlip { 50% { transform:scale(1.25); } }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover .mg-needle { animation:mgNeedle 2.4s ease-in-out infinite; } } @keyframes mgNeedle { 0%, 100% { transform:rotate(-20deg); } 50% { transform:rotate(245deg); } } .mg-needle { transform:rotate(-20deg); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover .mg-hand { animation:mgHand 1.3s ease-in-out infinite; } } @keyframes mgHand { 0%, 100% { transform:translateX(0); } 50% { transform:translateX(26px); } }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover .mg-bob { animation:mgPin 1.1s ease-in-out infinite; } } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card:hover .mg-tick { animation:mgTick 1.6s ease both infinite; stroke-dasharray:22; } } @keyframes mgTick { 0% { stroke-dashoffset:22; } 40%, 100% { stroke-dashoffset:0; } }
  @media (max-width:760px) { .mods-card .mg-svg, .mods-card.wide .mg-svg { display:block; } .mods-pic { aspect-ratio:2.4 / 1; } .mods-card.wide { flex-direction:column; } .mods-card.wide .mods-pic { width:100%; min-height:0; aspect-ratio:3.2 / 1; } .mods-txt { padding:10px 12px 12px; } .mods-card .mods-txt b { font-size:15px; } .mods-card .mods-txt > span { font-size:12px; } .mods-go { display:none; } .mods { padding:16px; } .mods-grid { gap:10px; } }
  /* ===== v4.10.2: zoznam úrovní ===== */
  #lv-wrap { position:fixed; inset:0; z-index:400; display:flex; align-items:center; justify-content:center; padding:14px; background:hsl(var(--ah) calc(50% * var(--asf)) 5% / 0.72); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); animation:hpFade 0.2s ease; }
  .hp.lv { width:min(480px,100%); display:flex; flex-direction:column; } .lv-list { margin-top:12px; overflow:auto; max-height:min(62vh,560px); padding:2px; display:flex; flex-direction:column; gap:6px; }
  .lv-row { display:flex; align-items:center; gap:12px; padding:10px 13px; border-radius:14px; background:hsla(150,20%,62%,0.16); animation:modsCard 0.35s ease both; transition:transform 0.15s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .lv-row:hover { transform:translateX(3px); } }
  .lv-row > b { flex:none; width:36px; height:36px; border-radius:11px; display:flex; align-items:center; justify-content:center; font-family:var(--display); font-size:17px; background:hsla(140,16%,62%,0.16); color:hsl(215,22%,73%); }
  .lv-row > div { flex:1; min-width:0; } .lv-row strong { display:block; font-size:15px; } .lv-row span { font-size:12px; color:hsl(215,22%,70%); } .lv-row i { display:block; height:7px; margin-top:6px; border-radius:99px; background:rgba(255,255,255,0.2); overflow:hidden; } .lv-row i em { display:block; height:100%; border-radius:99px; background:hsl(var(--ah) calc(75% * var(--asf)) 57%); }
  .lv-row > u { flex:none; text-decoration:none; font-family:var(--mono); font-size:11px; font-weight:800; letter-spacing:0.08em; color:hsl(153,88%,75%); }
  .lv-row.done > b { background:#0a9d5c; color:#fff; } .lv-row.lock { opacity:0.62; } .lv-row.lock > u { color:#8a9a91; font-size:14px; }
  .lv-row.cur { background:hsl(var(--ah) calc(48% * var(--asf)) 8%); color:#fff; box-shadow:0 10px 26px hsl(var(--ah) calc(48% * var(--asf)) 8% / 0.3); } .lv-row.cur > b { background:hsl(var(--ah) calc(75% * var(--asf)) 57%); color:hsl(var(--ah) calc(67% * var(--asf)) 5%); } .lv-row.cur span { color:#a9c7b8; } .lv-row.cur > u { padding:4px 9px; border-radius:99px; background:hsl(var(--ah) calc(75% * var(--asf)) 57%); color:hsl(var(--ah) calc(67% * var(--asf)) 5%); }
  .lv-note { margin-top:10px; font-size:12px; color:hsl(215,22%,70%); line-height:1.45; } .hp.lv .hp-act { margin-top:12px; }
  .pf-lv { cursor:pointer; } .pf-lv-all { flex:none; height:34px; padding:0 14px; border-radius:99px; border:1.5px solid hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.6); background:transparent; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); font-family:var(--ui); font-weight:800; font-size:11px; letter-spacing:0.08em; cursor:pointer; pointer-events:none; transition:background 0.15s, color 0.15s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-lv:hover .pf-lv-all { background:hsl(var(--ah) calc(75% * var(--asf)) 57%); color:hsl(var(--ah) calc(67% * var(--asf)) 5%); } }
  @media (max-width:560px) { .pf-lv-all { display:none; } .pf-lv-m span::after { content:' · ťukni pre všetky úrovne'; opacity:0.7; } }
  .brand2 .hd-ver { font-style:normal; font-family:var(--mono); font-size:11px; font-weight:700; letter-spacing:0.06em; color:hsl(var(--ah) calc(79% * var(--asf)) 72%); text-shadow:none; opacity:0.9; } @media (max-width:760px) { .brand2 .hd-ver { font-size:9.5px; } }
  /* ===== v4.11: tváre hráčov, boosty, mapa území, úvod, O stránke, ukážka Dobyvateľa ===== */
  .pf-av u { text-decoration:none; font-size:1.15em; line-height:1; } .pf-av.sm { width:24px; height:24px; font-size:12px; margin-right:7px; vertical-align:middle; }
  .pf-emo { display:flex; flex-wrap:wrap; gap:6px; } .pf-emo button { width:40px; height:40px; border-radius:12px; border:1.5px solid var(--border); background:var(--panel-2); font-size:20px; cursor:pointer; transition:transform 0.15s, border-color 0.15s, background 0.15s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-emo button:hover { transform:translateY(-2px) scale(1.08); border-color:var(--green); } } .pf-emo button.on { border-color:var(--green); background:color-mix(in srgb, var(--green) 18%, transparent); box-shadow:0 0 0 3px color-mix(in srgb, var(--green) 22%, transparent); } .pf-emo button.x { font-size:14px; color:var(--text-dim); }
  .dq-chip i.av, .dq-podium i.av { padding:0; overflow:hidden; } .dq-chip i.av img, .dq-podium i.av img { width:100%; height:100%; object-fit:cover; border-radius:50%; display:block; }
  .dq-jk button.pk { background:linear-gradient(135deg,rgba(180,92,255,0.28),rgba(58,134,255,0.28)); border-color:rgba(180,140,255,0.6); } .dq-jk button i { font-style:normal; font-size:0.8em; opacity:0.8; }
  .about-btn { font-family:var(--display); font-weight:800; font-size:16px; } .about-btn.on { background:var(--green); color:hsl(var(--ah) calc(65% * var(--asf)) 5%); border-color:var(--green); }
  /* mapa území */
  .rkm-kings { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 4px; } .rkm-kings > div { position:relative; display:flex; align-items:center; gap:2px; padding:6px 14px 6px 8px; border-radius:99px; background:color-mix(in srgb, var(--c) 16%, var(--panel-2)); border:1.5px solid color-mix(in srgb, var(--c) 55%, transparent); font-size:13.5px; } .rkm-kings b { margin-right:8px; } .rkm-kings span { font-family:var(--mono); font-size:11.5px; color:var(--text-dim); } .rkm-kings i { position:absolute; left:10px; top:-13px; font-style:normal; font-size:16px; transform:rotate(-14deg); } .rkm-kings .me { box-shadow:0 0 0 3px color-mix(in srgb, var(--c) 25%, transparent); }
  .rkm-wrap { position:relative; margin:6px 0 2px; perspective:1300px; perspective-origin:50% 0%; padding:54px 0 6px; overflow:visible; }
  .rkm-tilt { transform:rotateX(38deg); transform-origin:50% 100%; margin-top:-9%; filter:drop-shadow(0 30px 26px rgba(0,0,0,0.35)); }
  .rkm-svg { display:block; width:100%; height:auto; }
  .rkm-c { fill:var(--c); stroke:hsl(var(--ah) calc(48% * var(--asf)) 8%); stroke-width:5; stroke-linejoin:round; cursor:pointer; transition:filter 0.2s, fill 0.3s; } .rkm-c.free { fill:#3d5247; } .rkm-c.hov { filter:brightness(1.22) saturate(1.15); }@media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .rkm-c:hover { filter:brightness(1.22) saturate(1.15); } } .rkm-c.me { stroke:#ffffff; stroke-width:6; }
  .rkm-out { fill:none; stroke:hsl(var(--ah) calc(100% * var(--asf)) 96%); stroke-opacity:0.85; stroke-width:4; pointer-events:none; } .rkm-depth { fill:hsl(var(--ah) calc(50% * var(--asf)) 5%); opacity:0.9; } .rkm-depth.d2 { fill:hsl(var(--ah) calc(50% * var(--asf)) 11%); opacity:1; }
  .rkm-nb { stroke:#8fb3a1; stroke-opacity:0.55; stroke-width:4; stroke-dasharray:14 10; stroke-linecap:round; } .rkm-st { fill:#8fb3a1; fill-opacity:0.6; font-family:var(--display); font-weight:800; font-size:22px; letter-spacing:0.14em; text-anchor:middle; } .rkm-pt { fill:#ffffff; stroke:hsl(var(--ah) calc(48% * var(--asf)) 8%); stroke-width:3; pointer-events:none; } .rkm-an { fill:none; } .rkm-ld { stroke:var(--c); stroke-width:3.5; stroke-linecap:round; opacity:0.95; pointer-events:none; filter:drop-shadow(0 2px 0 rgba(0,0,0,0.5)); }
  .rkm-lab { position:absolute; left:50%; top:50%; opacity:0; z-index:2; display:flex; flex-direction:column; align-items:flex-start; gap:1px; padding:6px 10px 6px 8px; border-radius:12px; border:none; border-left:4px solid var(--c); background:hsl(var(--ah) calc(47% * var(--asf)) 6% / 0.92); color:#fff; font-family:var(--ui); text-align:left; cursor:pointer; white-space:nowrap; transform:translate(-50%,-100%); box-shadow:0 8px 22px rgba(0,0,0,0.4); transition:transform 0.2s, box-shadow 0.2s, opacity 0.3s; }
  .rkm-lab.set { opacity:1; } .rkm-lab.dn { transform:translate(-50%,0); }
  .rkm-lab small { font-family:var(--mono); font-size:9.5px; letter-spacing:0.1em; color:#9fc4b2; } .rkm-lab span { display:flex; align-items:center; font-size:13px; } .rkm-lab span > b { max-width:110px; overflow:hidden; text-overflow:ellipsis; } .rkm-lab > i { font-style:normal; font-family:var(--mono); font-size:11px; color:var(--c); filter:brightness(1.3); } .rkm-lab .pf-av.sm { width:22px; height:22px; margin-right:6px; } .rkm-lab .lv-b { margin-left:6px; }
  .rkm-lab.free { border-left-color:#7d9087; } .rkm-lab.free span > b { color:#b9d6c8; } .rkm-lab.me { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 8px 22px rgba(0,0,0,0.4); }
  .rkm-lab.hov { z-index:5; transform:translate(-50%,-100%) scale(1.07); }@media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .rkm-lab:hover { z-index:5; transform:translate(-50%,-100%) scale(1.07); } } .rkm-lab.dn.hov { transform:translate(-50%,0) scale(1.07); }@media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .rkm-lab.dn:hover { transform:translate(-50%,0) scale(1.07); } }
  .rkm-tbl tr[data-m] { cursor:pointer; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .rkm-tbl tr[data-m]:hover td { background:color-mix(in srgb, var(--green) 9%, transparent); } }
  /* 16 oblastí sa na mapu so štítkami nezmestí — na mape je len tvár držiteľa, meno a body sú v tabuľke pod ňou a po kliknutí */
  .rkm-lab.free span > b { display:none; }
  @media (min-width:0px) { .rkm-lab { padding:3px; border-left:none; border-radius:99px; border:2px solid var(--c); } .rkm-lab small, .rkm-lab > i, .rkm-lab span > b, .rkm-lab .lv-b { display:none; } .rkm-lab { padding:2px; } .rkm-lab .pf-av.sm { margin:0; width:30px; height:30px; font-size:13px; } .rkm-lab.free span::before { content:'?'; display:block; width:30px; line-height:30px; font-size:11px; text-align:center; color:#b9d6c8; font-weight:800; } .rkm-wrap { padding-top:34px; } .rkm-ld { display:none; } .rkm-lab, .rkm-lab.dn { transform:translate(-50%,-50%); } .rkm-lab.hov, .rkm-lab.dn.hov { transform:translate(-50%,-50%) scale(1.15); }@media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .rkm-lab:hover, :where(html:not(.touch)) .rkm-lab.dn:hover { transform:translate(-50%,-50%) scale(1.15); } } }
  @media (max-width:760px) { .rkm-lab .pf-av.sm { width:20px; height:20px; font-size:10px; } .rkm-lab.free span::before { width:20px; line-height:20px; font-size:11px; } .rkm-tbl th:nth-child(5), .rkm-tbl td:nth-child(5) { display:none; } }
  /* privítanie na úvode */
  .home-hero a[data-about] { color:var(--green); font-weight:700; text-decoration:none; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .home-hero a[data-about]:hover { text-decoration:underline; } }
  .home-hello { margin:16px 0 4px; padding:18px 20px; border-radius:22px; background:linear-gradient(135deg,hsl(var(--ah) calc(39% * var(--asf)) 10%) 0%,hsl(var(--ah) calc(61% * var(--asf)) 23%) 70%,hsl(var(--ah) calc(65% * var(--asf)) 29%) 100%); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); box-shadow:0 14px 40px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.25); }
  .home-hello h2 { margin:0; color:#fff; font-size:25px; letter-spacing:-0.01em; } .home-hello p { margin:5px 0 0; font-size:14px; line-height:1.5; max-width:680px; } .home-hello p b { color:#fff; }
  .home-hello.out { display:flex; gap:16px; align-items:flex-start; } .hh-wave { font-size:40px; line-height:1; transform-origin:70% 80%; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .home-hello:hover .hh-wave { animation:hhWave 1s ease-in-out; } } @keyframes hhWave { 20%, 60% { transform:rotate(18deg); } 40%, 80% { transform:rotate(-10deg); } }
  .hh-acts { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; } .home-hello .btn.ghost { background:rgba(255,255,255,0.1); color:#fff; border-color:rgba(255,255,255,0.3); } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .home-hello .btn.ghost:hover { background:rgba(255,255,255,0.2); } }
  .hh-top { display:flex; align-items:center; gap:14px; } .hh-main { flex:1; min-width:0; }
  .hh-tiles { display:grid; grid-template-columns:repeat(auto-fit,minmax(158px,1fr)); gap:10px; margin-top:16px; }
  .hh-t { display:flex; flex-direction:column; align-items:flex-start; gap:3px; padding:12px 14px; border-radius:16px; border:none; background:rgba(255,255,255,0.09); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); font-family:var(--ui); text-align:left; cursor:pointer; transition:transform 0.18s, background 0.18s, box-shadow 0.18s; border-top:3px solid var(--c, hsl(var(--ah) calc(75% * var(--asf)) 57%)); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .hh-t:hover { transform:translateY(-3px); background:rgba(255,255,255,0.16); box-shadow:0 10px 24px rgba(0,0,0,0.25); } } .hh-t small { font-family:var(--mono); font-size:10px; letter-spacing:0.14em; color:hsl(var(--ah) calc(42% * var(--asf)) 74%); } .hh-t b { font-family:var(--display); font-size:17px; color:#fff; line-height:1.15; } .hh-t span { font-size:12px; opacity:0.85; }
  .hh-t i { display:block; width:100%; height:6px; border-radius:99px; background:rgba(255,255,255,0.15); overflow:hidden; margin:3px 0 1px; } .hh-t i em { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,hsl(var(--ah) calc(75% * var(--asf)) 57%),#ffe27a); } .hh-t.new { --c:#ffbe0b; background:rgba(255,190,11,0.16); }
  @media (max-width:560px) { .home-hello { padding:14px; } .home-hello h2 { font-size:20px; } .hh-tiles { grid-template-columns:1fr 1fr; } .home-hello.out .hh-wave { display:none; } }
  /* O stránke */
  .ab { display:flex; flex-direction:column; gap:14px; } .ab-hero { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:22px 24px; border-radius:22px; background:linear-gradient(135deg,hsl(var(--ah) calc(39% * var(--asf)) 10%),hsl(var(--ah) calc(61% * var(--asf)) 23%)); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); } .ab-hero small { font-family:var(--mono); font-size:11px; letter-spacing:0.3em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .ab-hero h2 { margin:2px 0 6px; color:#fff; font-size:32px; } .ab-hero p { margin:0; max-width:620px; font-size:14.5px; line-height:1.5; }
  .ab-ver { flex:none; text-align:center; font-family:var(--mono); font-weight:800; font-size:18px; color:#fff; padding:12px 16px; border-radius:16px; background:rgba(255,255,255,0.1); } .ab-ver span { display:block; font-size:10px; letter-spacing:0.2em; color:#ffe27a; margin-top:2px; }
  .ab-jump { display:flex; flex-wrap:wrap; gap:6px; position:sticky; top:6px; z-index:3; padding:8px; border-radius:16px; background:color-mix(in srgb, var(--panel) 88%, transparent); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:1px solid var(--border); } .ab-jump a { padding:6px 12px; border-radius:99px; font-size:12.5px; font-weight:700; color:var(--text); text-decoration:none; background:var(--panel-2); transition:background 0.15s, color 0.15s, transform 0.15s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .ab-jump a:hover { background:var(--green); color:hsl(var(--ah) calc(65% * var(--asf)) 5%); transform:translateY(-1px); } }
  .ab > div[id] { scroll-margin-top:70px; } .ab-sec { padding:18px 20px; border-radius:20px; background:var(--panel-2); border-top:4px solid var(--c); } .ab-sec h3 { display:flex; align-items:center; gap:10px; margin:0 0 10px; font-family:var(--display); font-size:17px; letter-spacing:0.04em; } .ab-sec h3 i { display:flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:11px; background:var(--c); color:#fff; font-style:normal; font-size:17px; }
  .ab-sec p { margin:0 0 10px; font-size:14.5px; line-height:1.6; color:var(--text); } .ab-sec p:last-child { margin-bottom:0; } .ab-sec .btn { margin:4px 8px 0 0; padding:9px 14px; font-size:12.5px; } .ab-warn { padding:10px 14px; border-radius:12px; background:color-mix(in srgb, #ffbe0b 16%, transparent); } .ab-src { font-size:12px !important; color:var(--text-dim) !important; }
  .ab-mods { display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:10px; margin:12px 0; } .ab-mod { display:flex; gap:12px; padding:10px; border-radius:16px; background:var(--panel); transition:transform 0.18s, box-shadow 0.18s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .ab-mod:hover { transform:translateY(-2px); box-shadow:0 10px 26px rgba(0,0,0,0.12); } } .ab-ill { flex:none; width:96px; border-radius:12px; overflow:hidden; align-self:flex-start; } .ab-ill svg { display:block; width:100%; height:auto; }
  .ab-mod small { font-family:var(--mono); font-size:10px; letter-spacing:0.14em; color:var(--green); } .ab-mod b, .ab-row b, .ab-grid b { display:block; font-family:var(--display); font-size:15px; } .ab-mod span, .ab-row span, .ab-grid span { display:block; font-size:12.5px; line-height:1.45; color:var(--text-dim); } .ab-mod p, .ab-row p { margin:6px 0 0 !important; }
  .ab-row, .ab-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:10px; margin:0 0 10px; } .ab-row > div, .ab-grid > div { padding:12px 14px; border-radius:14px; background:var(--panel); border-left:3px solid var(--c); }
  .ab-steps { display:grid; gap:8px; margin-bottom:10px; } .ab-steps > div { display:flex; gap:12px; align-items:flex-start; font-size:14px; line-height:1.5; } .ab-steps b { flex:none; width:28px; height:28px; border-radius:50%; background:var(--c); color:#fff; display:flex; align-items:center; justify-content:center; font-family:var(--mono); }
  .ab-list { margin:0; padding:0; list-style:none; display:grid; gap:8px; } .ab-list li { padding:10px 14px; border-radius:12px; background:var(--panel); font-size:14px; line-height:1.55; }
  @media (max-width:560px) { .ab-hero { flex-direction:column; align-items:flex-start; padding:16px; } .ab-hero h2 { font-size:26px; } .ab-sec { padding:14px; } .ab-jump { position:static; } }
  /* Dobyvateľ: ukážka v slučke + galéria */
  .dq-show { margin:18px 0; display:grid; gap:14px; }
  .dq-reel { position:relative; border-radius:20px; overflow:hidden; background:radial-gradient(120% 120% at 50% 0%,hsl(var(--ah) calc(42% * var(--asf)) 15%),hsl(var(--ah) calc(47% * var(--asf)) 6%)); padding:34px 14px 54px; }
  .dq-reel-map { display:block; width:100%; max-width:760px; height:auto; margin:0 auto; }
  .dq-reel-tag { position:absolute; left:14px; top:11px; display:flex; align-items:center; gap:7px; font-family:var(--mono); font-size:10.5px; letter-spacing:0.14em; color:#b9d6c8; } .dq-reel-tag i { width:8px; height:8px; border-radius:50%; background:#ff4d5e; animation:hpBlink 1.2s steps(2) infinite; }
  .dq-reel-q { position:absolute; left:50%; top:46%; width:min(300px,80%); padding:12px 14px; border-radius:16px; background:rgba(255,255,255,0.07); color:hsl(153,48%,86%); box-shadow:0 18px 50px rgba(0,0,0,0.5); transform:translate(-50%,-50%) scale(0.7); opacity:0; animation:reelQ 20s ease infinite; }
  .dq-reel-q small { font-family:var(--mono); font-size:9.5px; letter-spacing:0.14em; color:hsl(153,88%,75%); } .dq-reel-q b { display:block; margin:3px 0 8px; font-size:14px; line-height:1.3; } .dq-reel-q div { display:grid; grid-template-columns:1fr 1fr; gap:5px; } .dq-reel-q span { padding:6px; border-radius:9px; background:hsla(140,21%,62%,0.16); font-family:var(--mono); font-size:12px; font-weight:700; text-align:center; } .dq-reel-q span.ok { animation:reelOk 20s linear infinite; }
  @keyframes reelQ { 0%, 23% { opacity:0; transform:translate(-50%,-50%) scale(0.7); } 26%, 40% { opacity:1; transform:translate(-50%,-50%) scale(1); } 43%, 100% { opacity:0; transform:translate(-50%,-50%) scale(0.7); } }
  @keyframes reelOk { 0%, 33% { background:hsla(140,21%,62%,0.16); color:hsl(153,48%,86%); } 34%, 44% { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:var(--ac-ink); } 45%, 100% { background:hsla(140,21%,62%,0.16); color:hsl(153,48%,86%); } }
  .dq-reel-caps { position:absolute; left:0; right:0; bottom:16px; height:28px; } .dq-reel-caps span { position:absolute; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:8px; white-space:nowrap; max-width:94%; padding:5px 14px 5px 5px; border-radius:99px; background:rgba(0,0,0,0.55); color:#fff; font-size:13px; font-weight:700; opacity:0; animation:reelCap 20s linear infinite; } .dq-reel-caps b { flex:none; width:22px; height:22px; border-radius:50%; background:hsl(var(--ah) calc(75% * var(--asf)) 57%); color:hsl(var(--ah) calc(65% * var(--asf)) 5%); display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-size:12px; }
  @keyframes reelCap { 0% { opacity:0; } 1.5%, 23.5% { opacity:1; } 25%, 100% { opacity:0; } }
  .dq-reel-prog { position:absolute; left:0; right:0; bottom:0; height:4px; background:rgba(255,255,255,0.1); } .dq-reel-prog i { display:block; height:100%; background:hsl(var(--ah) calc(75% * var(--asf)) 57%); transform-origin:0 50%; animation:reelProg 20s linear infinite; } @keyframes reelProg { from { transform:scaleX(0); } to { transform:scaleX(1); } }
  .dq-gal > strong { display:block; font-family:var(--display); font-size:14px; letter-spacing:0.06em; margin-bottom:8px; } .dq-gal > strong em { font-style:normal; font-weight:600; font-size:12px; opacity:0.6; letter-spacing:0; }
  .dq-gal-row { display:flex; gap:10px; overflow-x:auto; padding:4px 2px 10px; scroll-snap-type:x proximity; } .dq-gal-it { flex:0 0 218px; scroll-snap-align:start; padding:0; border:none; border-radius:16px; overflow:hidden; background:var(--panel-2); color:var(--text); text-align:left; font-family:var(--ui); cursor:zoom-in; transition:transform 0.2s, box-shadow 0.2s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-gal-it:hover { transform:translateY(-4px); box-shadow:0 14px 30px rgba(0,0,0,0.22); } }
  .dq-gal-it > span { display:block; padding:9px 12px 11px; font-size:11.5px; line-height:1.4; color:var(--text-dim); height:5.6em; overflow:hidden; } .dq-gal-it > span b { display:block; font-family:var(--display); font-size:13px; color:var(--text); letter-spacing:0.05em; }
  .gs { position:relative; aspect-ratio:16 / 10; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:10px; background:radial-gradient(120% 120% at 50% 0%,hsl(var(--ah) calc(42% * var(--asf)) 15%),hsl(var(--ah) calc(47% * var(--asf)) 6%)); color:#fff; font-size:10px; overflow:hidden; } .gs small { font-family:var(--mono); font-size:0.8em; letter-spacing:0.12em; color:hsl(var(--ah) calc(42% * var(--asf)) 74%); } .gs em { font-style:normal; font-size:0.9em; color:#ffe27a; }
  .gs-map svg { width:100%; height:auto; } .gs-chips { position:absolute; left:4px; right:4px; top:5px; display:flex; flex-wrap:wrap; gap:3px; justify-content:center; font-size:0.82em; } .gs-chips span, .gs-pl span { padding:0.25em 0.7em; border-radius:99px; background:rgba(0,0,0,0.5); border:1px solid var(--c); font-weight:700; font-size:0.85em; white-space:nowrap; } .gs-chips b { margin-left:0.4em; font-family:var(--mono); }
  .gs-code { font-family:var(--mono); font-size:2.6em; letter-spacing:0.2em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .gs-pl, .gs-set { display:flex; flex-wrap:wrap; gap:4px; justify-content:center; } .gs-set i, .gs-jk i { font-style:normal; padding:0.2em 0.6em; border-radius:6px; background:rgba(255,255,255,0.1); font-family:var(--mono); font-size:0.8em; } .gs-btn { margin-top:2px; padding:0.4em 1.2em; border-radius:99px; background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:hsl(152,65%,88%) !important; font-weight:800; }
  .gs-q { background:rgba(255,255,255,0.07); color:hsl(153,48%,86%); align-items:stretch; text-align:center; } .gs-q small { color:hsl(153,88%,75%); } .gs-q b { font-size:1.25em; } .gs-bar { height:0.5em; border-radius:99px; background:hsla(147,19%,62%,0.16); overflow:hidden; } .gs-bar i { display:block; width:62%; height:100%; background:hsl(var(--ah) calc(83% * var(--asf)) 42%); } .gs-opts { display:grid; grid-template-columns:1fr 1fr; gap:4px; } .gs-opts span { padding:0.5em; border-radius:8px; background:hsla(140,21%,62%,0.16); font-weight:700; } .gs-opts .ok { background:#12c274; color:#fff; } .gs-jk { display:flex; gap:4px; justify-content:center; } .gs-jk i { background:hsla(46,85%,62%,0.16); color:hsl(43,88%,78%); } .gs-jk i.pk { background:hsla(261,85%,62%,0.16); color:hsl(261,61%,72%); }
  .gs-vs { display:flex; align-items:center; gap:1.2em; } .gs-vs span { display:flex; flex-direction:column; align-items:center; gap:0.3em; font-size:2em; } .gs-vs span b { font-size:0.42em; padding:0.2em 0.8em; border-radius:99px; background:var(--c); } .gs-vs u { text-decoration:none; font-size:2.4em; }
  .gs-pod { display:flex; align-items:flex-end; gap:5px; } .gs-pod span { display:flex; flex-direction:column; align-items:center; justify-content:flex-end; width:3.6em; border-radius:8px 8px 0 0; background:var(--c); font-size:1.3em; padding-bottom:0.2em; } .gs-pod .p1 { height:4.6em; } .gs-pod .p2 { height:3.5em; } .gs-pod .p3 { height:2.7em; } .gs-pod b { font-family:var(--mono); font-size:0.8em; } .gs-tab { display:grid; gap:3px; width:70%; } .gs-tab i { height:0.5em; border-radius:99px; background:rgba(255,255,255,0.14); } .gs-tab i:nth-child(2) { width:80%; } .gs-tab i:nth-child(3) { width:60%; }
  #gal-wrap { position:fixed; inset:0; z-index:410; display:flex; align-items:center; justify-content:center; padding:14px; background:hsl(var(--ah) calc(50% * var(--asf)) 5% / 0.8); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); animation:hpFade 0.2s ease; }
  .gal-box { width:min(680px,100%); max-height:100%; overflow:auto; border-radius:22px; background:rgba(255,255,255,0.07); color:hsl(153,48%,86%); padding:14px 18px 16px; animation:hpIn 0.3s var(--spring-soft); } .gal-top { display:flex; justify-content:space-between; align-items:center; font-family:var(--mono); font-size:11px; letter-spacing:0.16em; font-weight:800; color:hsl(153,88%,75%); margin-bottom:10px; } .gal-top button { width:32px; height:32px; border-radius:10px; border:1px solid rgba(255,255,255,0.16); background:hsla(150,22%,62%,0.16); cursor:pointer; }
  .gal-big { border-radius:16px; overflow:hidden; } .gal-big .gs { font-size:clamp(13px,3.1vw,21px); } .gal-box p { margin:12px 2px; font-size:15px; line-height:1.5; color:hsl(215,22%,78%); } .gal-act { display:flex; justify-content:space-between; gap:8px; }
  @media (prefers-reduced-motion: reduce) { .dq-reel-q, .dq-reel-caps span, .dq-reel-prog i { animation:none; } .dq-reel-caps span:first-child { opacity:1; } }
  /* okná AKO NA TO: farebné plné kresby namiesto čiernych obrysov */
  .hp-svg { background:linear-gradient(135deg,hsla(147,60%,62%,0.16),hsla(206,85%,62%,0.16)); } .hp-card:nth-child(n) .hp-svg { box-shadow:inset 0 0 0 1px rgba(255,255,255,0.6); }
  .hp-box, .hp-opt { fill:#ffffff; stroke:none; filter:drop-shadow(0 3px 5px hsl(var(--ah) calc(64% * var(--asf)) 14% / 0.2)); } .hp-ink, .hp-tag, .hp-mask { fill:hsl(var(--ah) calc(61% * var(--asf)) 23%); } .hp-land { fill:hsl(var(--ah) calc(51% * var(--asf)) 67%); stroke:none; filter:drop-shadow(0 4px 0 hsl(var(--ah) calc(45% * var(--asf)) 45%)); }
  .hp-line, .hp-post { stroke:hsl(var(--ah) calc(61% * var(--asf)) 23%); stroke-width:3.4; } .hp-grid { stroke:hsl(var(--ah) calc(61% * var(--asf)) 23%); opacity:0.22; } .hp-track { stroke:#3a86ff; stroke-width:2.6; } .hp-ring { stroke:hsl(var(--ah) calc(83% * var(--asf)) 42%); stroke-width:3; } .hp-wave { stroke:#3a86ff; }
  .hp-free { fill:#cfdcd4; stroke:none; } .hp-jk { fill:#ffe9a8; stroke:none; filter:drop-shadow(0 3px 0 #e0a800); } .hp-fill { fill:hsl(var(--ah) calc(57% * var(--asf)) 72%); } .hp-bad { fill:#ffb3a8; } .hp-cursor { fill:hsl(var(--ah) calc(61% * var(--asf)) 23%); stroke:#fff; stroke-width:1.5; } .hp-t, .hp-k { fill:hsl(var(--ah) calc(61% * var(--asf)) 23%); } .hp-s { fill:#3d6a55; }
  .hp-l1 { fill:hsl(var(--ah) calc(51% * var(--asf)) 67%); } .hp-l2 { fill:#9cc7f5; } .hp-l3 { fill:#ffc078; } .hp-dot, .hp-cur { fill:hsl(var(--ah) calc(83% * var(--asf)) 42%); } .hp-amb { fill:#ffa51f; } .hp-gold { fill:#ffc933; }
  @keyframes hpOk { 0%, 35% { fill:#ffffff; } 50%, 90% { fill:hsl(var(--ah) calc(57% * var(--asf)) 72%); } 100% { fill:#ffffff; } }
  /* ===== v4.12: správy ako chat ===== */
  .ch-list { display:grid; gap:7px; } .ch-row { position:relative; display:flex; align-items:center; gap:12px; width:100%; padding:11px 14px; border-radius:16px; border:1px solid var(--border); background:rgba(255,255,255,0.07); color:var(--text); font-family:var(--ui); text-align:left; cursor:pointer; transition:transform 0.15s, box-shadow 0.15s, border-color 0.15s; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .ch-row:hover { transform:translateX(4px); box-shadow:0 8px 22px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.12); border-color:var(--green); } } .ch-row > div { flex:1; min-width:0; display:flex; flex-direction:column; } .ch-row b { font-size:15px; } .ch-row span { font-size:13px; color:var(--text-dim); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .ch-row small { flex:none; font-family:var(--mono); font-size:10.5px; color:var(--text-faint); } .ch-row > i { flex:none; font-style:normal; font-size:20px; color:var(--text-faint); transition:transform 0.15s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .ch-row:hover > i { transform:translateX(3px); color:var(--green); } }
  .ch-row > em { flex:none; min-width:22px; height:22px; padding:0 6px; border-radius:99px; background:var(--green-strong, hsl(var(--ah) calc(83% * var(--asf)) 42%)); color:var(--ac-ink); font-style:normal; font-family:var(--mono); font-size:12px; font-weight:800; display:flex; align-items:center; justify-content:center; } .ch-row.new { border-color:var(--green-strong, hsl(var(--ah) calc(83% * var(--asf)) 42%)); background:color-mix(in srgb, var(--green) 7%, rgba(255,255,255,0.07)); } .ch-row.new span { color:var(--text); font-weight:700; }
  .ch-row > u { position:absolute; left:42px; top:38px; width:11px; height:11px; border-radius:50%; background:hsl(var(--ah) calc(83% * var(--asf)) 42%); border:2px solid rgba(255,255,255,0.16); }
  .ch { display:flex; flex-direction:column; border-radius:18px; border:1px solid var(--border); background:rgba(255,255,255,0.07); overflow:hidden; } .ch-top { display:flex; align-items:center; gap:11px; padding:10px 12px; border-bottom:1px solid var(--border); background:var(--panel-2); } .ch-top > div { flex:1; min-width:0; display:flex; flex-direction:column; } .ch-top b { font-size:15.5px; } .ch-top span { font-size:12px; color:var(--text-dim); } .ch-top span i { display:inline-block; width:8px; height:8px; border-radius:50%; background:hsl(var(--ah) calc(83% * var(--asf)) 42%); margin-right:6px; } .ch-top .btn { padding:8px 12px; font-size:12px; }
  .ch-log { display:flex; flex-direction:column; gap:6px; height:min(52vh,440px); overflow-y:auto; padding:14px; background:linear-gradient(180deg,hsla(150,22%,62%,0.16),hsla(140,21%,62%,0.16)); scroll-behavior:smooth; }
  .ch-b { align-self:flex-start; max-width:min(78%,520px); display:flex; flex-direction:column; animation:chIn 0.22s ease; } .ch-b > div { padding:9px 13px; border-radius:16px 16px 16px 5px; background:rgba(255,255,255,0.07); border:1px solid var(--border); font-size:14.5px; line-height:1.4; overflow-wrap:anywhere; color:hsl(153,48%,86%); } .ch-b > i { font-style:normal; font-family:var(--mono); font-size:9.5px; color:var(--text-faint); margin:2px 6px 0; }
  .ch-b.me { align-self:flex-end; align-items:flex-end; } .ch-b.me > div { border-radius:16px 16px 5px 16px; background:linear-gradient(135deg,hsl(var(--ah) calc(83% * var(--asf)) 42%),hsl(var(--ah) calc(88% * var(--asf)) 33%)); border-color:transparent; color:var(--ac-ink); }
  .ch-b.inv > div { display:flex; flex-direction:column; gap:4px; background:hsla(46,85%,62%,0.16); border-color:#e9cf7a; color:hsl(44,88%,82%); } .ch-b.inv small { font-family:var(--mono); font-size:9.5px; letter-spacing:0.12em; } .ch-b.inv b { font-family:var(--mono); letter-spacing:0.12em; } .ch-b.inv .btn { margin-top:4px; padding:7px 12px; font-size:12px; }
  .ch-day { align-self:center; margin:6px 0 2px; padding:3px 10px; border-radius:99px; background:hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.07); font-family:var(--mono); font-size:9.5px; letter-spacing:0.12em; color:var(--text-dim); } .ch-empty { margin:auto; color:var(--text-dim); font-size:14px; }
  .ch-in { display:flex; gap:8px; padding:10px 12px; border-top:1px solid var(--border); background:rgba(255,255,255,0.07); } .ch-in input { flex:1; min-width:0; padding:11px 14px; border-radius:99px; border:1.5px solid var(--border); font-size:15px; font-family:var(--ui); outline:none; transition:border-color 0.15s, box-shadow 0.15s; } .ch-in input:focus { border-color:var(--green); box-shadow:0 0 0 3px color-mix(in srgb, var(--green) 20%, transparent); } .ch-in .btn { border-radius:99px; padding:11px 18px; }
  @keyframes chIn { from { opacity:0; transform:translateY(8px); } }
  @media (max-width:560px) { .ch-log { height:54vh; padding:10px; } .ch-top #pf-chat-back { padding:8px 10px; } .ch-b { max-width:88%; } .ch-row small { display:none; } }
  .lv-grp { margin:8px 2px 0; font-family:var(--mono); font-size:10px; font-weight:800; letter-spacing:0.2em; color:hsl(153,88%,75%); } .lv-grp:first-child { margin-top:0; }
  /* ===== v4.14: upratany rebríček ===== */
  .rk-chips.main { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; } .rk-chips.main .rk-chip { padding:12px 8px; font-size:13.5px; text-align:center; white-space:nowrap; }
  .rk-pick { display:flex; align-items:center; gap:12px; margin:12px 0 4px; } .rk-pick span { font-family:var(--mono); font-size:10.5px; font-weight:700; letter-spacing:0.14em; color:var(--text-dim); white-space:nowrap; }
  .rk-pick select { flex:1; min-width:0; max-width:420px; padding:11px 14px; border-radius:12px; border:1.5px solid var(--border); background:rgba(255,255,255,0.07); color:var(--text); font-family:var(--ui); font-size:14.5px; font-weight:700; cursor:pointer; transition:border-color 0.15s, box-shadow 0.15s; } .rk-pick select:focus { border-color:var(--green); box-shadow:0 0 0 3px color-mix(in srgb, var(--green) 18%, transparent); outline:none; }@media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .rk-pick select:hover { border-color:var(--green); box-shadow:0 0 0 3px color-mix(in srgb, var(--green) 18%, transparent); outline:none; } }
  .ab-sec .rk-rules { margin:4px 0 12px; }
  @media (max-width:640px) { .rk-chips.main { grid-template-columns:1fr 1fr; } .rk-pick { flex-direction:column; align-items:stretch; gap:5px; } .rk-pick select { max-width:none; } .rk-main th:nth-child(n+4), .rk-main td:nth-child(n+4) { display:none; } .rk-me-top > div:nth-child(n+3) { display:none; } }
  /* ===== v4.15: rozbaľovacie oblasti pod mapou ===== */
  .rkm-tbl tr[data-m] td { transition:background 0.15s; } .rkm-tbl tr.open td { background:color-mix(in srgb, var(--green) 8%, transparent); } .rkm-lv { white-space:nowrap; } .rkm-lv .lv-b { margin-left:0; } .rkm-lv u { float:right; text-decoration:none; color:var(--text-faint); font-size:12px; margin-left:10px; }
  .rkm-more > td { padding:0 !important; background:none !important; } .rkm-exp { margin:2px 10px 12px; padding:8px 10px 10px; border-radius:14px; background:var(--panel-2); border-left:4px solid var(--c); display:grid; gap:4px; animation:rkmExp 0.25s ease; } @keyframes rkmExp { from { opacity:0; transform:translateY(-8px); } }
  .rkm-ln { display:flex; align-items:center; gap:8px; padding:7px 10px; border-radius:10px; background:rgba(255,255,255,0.07); font-size:14px; } .rkm-ln > b { flex:none; width:26px; font-family:var(--mono); color:var(--text-dim); } .rkm-ln > span { font-weight:700; } .rkm-ln .pf-av.sm { margin:0; } .rkm-ln .lv-b { margin-left:2px; } .rkm-ln strong { margin-left:auto; font-family:var(--mono); color:var(--green); white-space:nowrap; } .rkm-ln small { flex:none; width:190px; text-align:right; font-size:11.5px; color:var(--text-dim); }
  .rkm-ln.me, .rkm-ln.you { background:color-mix(in srgb, var(--green) 14%, rgba(255,255,255,0.07)); box-shadow:inset 0 0 0 1.5px var(--green); } .rkm-ln.none { color:var(--text-dim); font-size:13px; } .rkm-ln.none small { width:auto; flex:1; text-align:left; } .rkm-dots { text-align:center; color:var(--text-faint); line-height:1; } .rkm-go { text-align:right; margin-top:4px; } .rkm-go .btn { padding:8px 12px; font-size:11.5px; }
  @media (max-width:760px) { .lv-b.full i { display:none; } .lv-b.full { padding:0; background:none; } .rkm-ln { flex-wrap:wrap; } .rkm-ln small { width:100%; text-align:left; padding-left:34px; } .rkm-tbl th:nth-child(2), .rkm-tbl td:nth-child(2) { display:none; } .rkm-tbl th:nth-child(5), .rkm-tbl td:nth-child(5) { display:table-cell; } }
  /* ===== v4.16: vstup do Dobyvateľa a prehrávač ukážky ===== */
  .dqh { display:flex; flex-direction:column; gap:14px; }
  .dqh-hero { position:relative; overflow:hidden; display:grid; grid-template-columns:1.25fr 1fr; gap:18px; align-items:center; padding:26px; border-radius:24px; color:hsl(var(--ah) calc(44% * var(--asf)) 89%); background:radial-gradient(120% 140% at 0% 0%,hsl(var(--ah) calc(60% * var(--asf)) 26%) 0%,hsl(var(--ah) calc(50% * var(--asf)) 11%) 46%,hsl(var(--ah) calc(46% * var(--asf)) 5%) 100%); }
  .dqh-hero::before { content:''; position:absolute; inset:-40%; background:conic-gradient(from 0deg,transparent 0 70%,hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.16) 80%,transparent 90%); animation:dqhSweep 9s linear infinite; pointer-events:none; } @keyframes dqhSweep { to { transform:rotate(360deg); } }
  .dqh-copy { position:relative; min-width:0; } .dqh-copy small { display:flex; align-items:center; gap:8px; font-family:var(--mono); font-size:11px; font-weight:700; letter-spacing:0.2em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .dqh-copy small i { width:8px; height:8px; border-radius:50%; background:#ff4d5e; box-shadow:0 0 0 0 rgba(255,77,94,0.6); animation:dqhLive 1.6s ease-out infinite; } @keyframes dqhLive { to { box-shadow:0 0 0 10px rgba(255,77,94,0); } }
  .dqh-hero h2 { margin:6px 0 4px; font-family:var(--display); font-size:clamp(34px,6vw,58px); line-height:0.95; letter-spacing:-0.02em; color:#fff; } .dqh-copy p { margin:0; font-size:clamp(15px,1.9vw,18px); line-height:1.4; max-width:420px; color:hsl(var(--ah) calc(37% * var(--asf)) 86%); }
  .dqh-pills { display:flex; flex-wrap:wrap; gap:6px; margin-top:14px; } .dqh-pills span { padding:6px 11px; border-radius:99px; background:rgba(255,255,255,0.09); font-size:12.5px; font-weight:600; white-space:nowrap; animation:dqhUp 0.5s ease backwards; } .dqh-pills span:nth-child(2) { animation-delay:0.08s; } .dqh-pills span:nth-child(3) { animation-delay:0.16s; } .dqh-pills span:nth-child(4) { animation-delay:0.24s; } @keyframes dqhUp { from { opacity:0; transform:translateY(10px); } }
  .dqh-demo { position:relative; display:grid; grid-template-columns:auto 1fr; gap:12px 14px; align-items:center; padding:18px; border-radius:20px; border:none; cursor:pointer; text-align:left; font-family:var(--ui); color:#3a2a00; background:linear-gradient(135deg,#ffe27a,#ffb020); box-shadow:0 14px 36px rgba(255,176,32,0.35); transition:transform 0.2s, box-shadow 0.2s; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dqh-demo:hover { transform:translateY(-4px) scale(1.015); box-shadow:0 20px 46px rgba(255,176,32,0.5); } } .dqh-demo > i { display:flex; align-items:center; justify-content:center; width:54px; height:54px; border-radius:50%; background:#3a2a00; color:#ffe27a; font-style:normal; font-size:20px; padding-left:3px; animation:dqhPulse 1.8s ease-in-out infinite; } @keyframes dqhPulse { 50% { box-shadow:0 0 0 12px rgba(58,42,0,0.14); } }
  .dqh-demo span { display:flex; flex-direction:column; gap:3px; min-width:0; } .dqh-demo b { font-family:var(--display); font-size:18px; line-height:1.1; } .dqh-demo em { font-style:normal; font-size:13px; line-height:1.4; opacity:0.85; } .dqh-demo u { grid-column:1 / -1; text-decoration:none; text-align:center; padding:11px; border-radius:12px; background:#3a2a00; color:#ffe27a; font-weight:800; font-size:13px; letter-spacing:0.08em; }
  .dqh-play { display:grid; grid-template-columns:0.85fr 1fr 1fr; gap:12px; }
  .dqh-card { display:flex; flex-direction:column; gap:7px; padding:18px; border-radius:20px; background:rgba(255,255,255,0.07); border:1.5px solid var(--border); transition:transform 0.2s, box-shadow 0.2s, border-color 0.2s; animation:dqhUp 0.5s ease backwards; } .dqh-card:nth-child(2) { animation-delay:0.07s; } .dqh-card:nth-child(3) { animation-delay:0.14s; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dqh-card:hover { transform:translateY(-4px); box-shadow:0 16px 34px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.14); border-color:var(--green); } } .dqh-card small { display:flex; align-items:center; gap:8px; font-family:var(--mono); font-size:11px; font-weight:800; letter-spacing:0.16em; color:var(--text-dim); } .dqh-card small b { display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%; background:var(--green); color:#fff; letter-spacing:0; }
  .dqh-card strong { font-family:var(--display); font-size:20px; line-height:1.15; color:var(--text); } .dqh-card span { font-size:13px; line-height:1.45; color:var(--text-dim); } .dqh-card .btn { margin-top:auto; width:100%; height:48px; }
  .dqh-card.new { background:linear-gradient(160deg,hsl(var(--ah) calc(39% * var(--asf)) 10%),hsl(var(--ah) calc(61% * var(--asf)) 23%)); border-color:transparent; box-shadow:0 12px 30px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.28); } .dqh-card.new small { color:hsl(var(--ah) calc(42% * var(--asf)) 74%); } .dqh-card.new strong { color:#fff; } .dqh-card.new span { color:hsl(var(--ah) calc(37% * var(--asf)) 86%); } .dqh-card.new .btn { background:hsl(var(--ah) calc(75% * var(--asf)) 57%); color:hsl(var(--ah) calc(65% * var(--asf)) 5%); }
  .dqh-me { display:flex; align-items:center; gap:10px; } .dqh-me strong { font-size:22px; overflow:hidden; text-overflow:ellipsis; } .dqh-card input { width:100%; height:48px; padding:0 14px; border-radius:12px; border:1.5px solid var(--border-bright); font-family:var(--ui); font-size:16px; font-weight:700; color:var(--text); background:rgba(255,255,255,0.07); outline:none; min-width:0; } .dqh-card input:focus { border-color:var(--green-strong); box-shadow:0 0 0 3px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.18); }
  .dqh-join { display:grid; grid-template-columns:1fr auto; gap:8px; margin-top:auto; } .dqh-join input { font-family:var(--mono); font-size:22px; letter-spacing:0.4em; text-align:center; text-transform:uppercase; } .dqh-join .btn { width:auto; margin:0; }
  .dqh-how { display:flex; flex-direction:column; gap:10px; } .dqh-h { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; } .dqh-h h3 { margin:0; font-family:var(--display); font-size:18px; letter-spacing:0.04em; } .dqh-h span { font-size:12.5px; color:var(--text-dim); }
  .dqh-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; } .dqh-steps > div { display:flex; flex-direction:column; gap:3px; padding:14px; border-radius:16px; background:color-mix(in srgb, var(--c) 9%, rgba(255,255,255,0.07)); border-top:3px solid var(--c); transition:transform 0.2s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dqh-steps > div:hover { transform:translateY(-3px); } } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dqh-steps > div:hover i { transform:scale(1.2) rotate(-8deg); } }
  .dqh-steps i { font-style:normal; font-size:24px; line-height:1; transition:transform 0.25s; align-self:flex-start; } .dqh-steps b { font-family:var(--display); font-size:14.5px; letter-spacing:0.05em; color:var(--c); } .dqh-steps span { font-size:12.5px; line-height:1.4; color:var(--text-dim); } .dqh-steps .hp-open { grid-column:1 / -1; justify-self:center; }
  /* prehrávač ukážky: všetko v em, veľkosť sa berie zo šírky rámu */
  .rl { container-type:inline-size; border-radius:22px; overflow:hidden; background:#000; box-shadow:0 18px 44px rgba(0,0,0,0.4), 0 0 0 2px #111; }
  .rl-tabs { display:grid; grid-template-columns:repeat(6,1fr); gap:5px; padding:10px 10px 0; } .rl-tabs button { display:flex; flex-direction:column; gap:6px; padding:0 0 8px; border:none; background:none; cursor:pointer; font-family:var(--mono); font-size:10.5px; font-weight:700; letter-spacing:0.08em; color:hsl(215,22%,68%); text-align:left; transition:color 0.2s; min-width:0; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .rl-tabs button:hover { color:#fff; } } .rl-tabs button.on { color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .rl-tabs button.done { color:#b9d6c8; } .rl-tabs i { display:block; height:4px; border-radius:99px; background:rgba(255,255,255,0.14); overflow:hidden; } .rl-tabs em { display:block; height:100%; width:100%; transform:scaleX(0); transform-origin:left center; background:hsl(var(--ah) calc(75% * var(--asf)) 57%); border-radius:99px; } .rl-tabs .done em { transform:scaleX(1); } .rl-tabs .on em { animation:rlBar var(--d,5s) linear forwards; } @keyframes rlBar { to { transform:scaleX(1); } }
  .rl-tabs span { display:flex; align-items:center; gap:5px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } .rl-tabs span b { flex:none; display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; border-radius:50%; background:currentColor; } .rl-tabs span b { color:inherit; } .rl-tabs span b { -webkit-text-fill-color:hsl(var(--ah) calc(46% * var(--asf)) 5%); }
  .rl-stage { position:relative; aspect-ratio:16 / 9; font-size:clamp(8px,1.85cqw,17px); background:radial-gradient(80% 80% at 50% 45%,#161a18 0%,#000 75%); overflow:hidden; font-family:var(--display); }
  .rl-map { position:absolute; left:4%; right:4%; top:13%; width:92%; height:74%; transition:filter 0.5s, transform 0.8s; } .rl-land { fill:#000; } .rl-edge { fill:none; stroke:#fff; stroke-width:4.5; stroke-linejoin:round; filter:drop-shadow(0 0 6px rgba(255,255,255,0.45)); } .rl-terr path { fill:#0a0c0b; stroke:#fff; stroke-opacity:0.9; stroke-width:2.2; stroke-linejoin:round; transition:fill 0.5s ease; }
  .rl-base { opacity:0; transition:opacity 0.3s; } .rl-base.on { opacity:1; } .rl-base.on circle:first-child { animation:rlPing 1.6s ease-out infinite; transform-box:fill-box; transform-origin:center; } @keyframes rlPing { from { transform:scale(0.6); opacity:0.5; } to { transform:scale(1.8); opacity:0; } }
  .rl-ring { fill:none; stroke:#fff; stroke-width:5; opacity:0; transform-box:fill-box; transform-origin:center; } .rl[data-s="3"] .rl-ring { animation:rlPing 1.2s ease-out infinite; opacity:1; } .rl[data-s="3"] .rl-ring.r2 { animation-delay:0.6s; } .rl.won .rl-ring { animation:none; opacity:0; }
  .rl[data-s="1"] .rl-map, .rl[data-s="4"] .rl-map, .rl[data-s="5"] .rl-map { filter:brightness(0.4) blur(1.5px); transform:scale(1.04); }
  .rl-hud { position:absolute; left:0; right:0; top:3.5%; display:flex; justify-content:center; gap:0.6em; } .rl-hud span { display:flex; align-items:center; gap:0.5em; padding:0.3em 0.9em 0.3em 0.3em; border-radius:99px; background:#0c0f0e; border:0.18em solid var(--c); box-shadow:0 0.25em 0 color-mix(in srgb, var(--c) 55%, #000), 0 0 1.2em color-mix(in srgb, var(--c) 45%, transparent); color:#fff; font-weight:900; font-size:1.05em; letter-spacing:0.03em; white-space:nowrap; } .rl-hud span.bump { animation:rlBump 0.35s ease; } @keyframes rlBump { 40% { transform:scale(1.16) translateY(-0.15em); } } .rl-hud i { display:flex; align-items:center; justify-content:center; width:1.7em; height:1.7em; border-radius:50%; background:var(--c); font-style:normal; font-size:0.85em; } .rl-hud b { font-family:var(--mono); font-weight:800; font-size:1.1em; color:#fff; min-width:2.9em; text-align:right; } .rl-hud i { box-shadow:inset 0 -0.15em 0 rgba(0,0,0,0.25); }
  .rl-q, .rl-vs, .rl-end { position:absolute; left:50%; top:50%; opacity:0; pointer-events:none; transform:translate(-50%,-50%) scale(0.8); }
  .rl-q { width:min(31em,84%); padding:1em 1.1em; border-radius:1.2em; background:rgba(255,255,255,0.07); color:hsl(153,48%,86%); box-shadow:0 1.4em 3.5em rgba(0,0,0,0.55); } .rl[data-s="1"] .rl-q { animation:rlShow var(--d) ease both; }
  @keyframes rlShow { 0% { opacity:0; transform:translate(-50%,-44%) scale(0.86); } 8%, 90% { opacity:1; transform:translate(-50%,-50%) scale(1); } 100% { opacity:0; transform:translate(-50%,-50%) scale(0.92); } }
  .rl-qtop { display:flex; justify-content:space-between; align-items:center; } .rl-qtop small { font-family:var(--mono); font-size:0.72em; font-weight:800; letter-spacing:0.14em; color:hsl(153,88%,75%); } .rl-qtop u { text-decoration:none; font-family:var(--mono); font-weight:800; font-size:1.05em; }
  .rl-bar { height:0.42em; margin:0.45em 0 0.7em; border-radius:99px; background:hsla(147,19%,62%,0.16); overflow:hidden; } .rl-bar i { display:block; height:100%; width:100%; background:linear-gradient(90deg,hsl(var(--ah) calc(83% * var(--asf)) 42%),#ffbe0b); transform-origin:0 50%; } .rl[data-s="1"] .rl-bar i { animation:rlTime 3.6s linear 0.5s both; } @keyframes rlTime { to { transform:scaleX(0.35); } }
  .rl-q > b { display:block; font-family:var(--display); font-weight:900; font-size:1.65em; line-height:1.1; letter-spacing:-0.01em; margin-bottom:0.6em; } .rl-q { border:0.2em solid hsl(var(--ah) calc(48% * var(--asf)) 8%); box-shadow:0 0.45em 0 hsl(var(--ah) calc(48% * var(--asf)) 8%), 0 1.6em 3.5em rgba(0,0,0,0.6) !important; } .rl-opts { display:grid; grid-template-columns:1fr 1fr; gap:0.45em; } .rl-opts span { padding:0.65em 0.5em; border-radius:0.8em; background:hsla(140,21%,62%,0.16); border:0.14em solid rgba(255,255,255,0.16); box-shadow:0 0.2em 0 rgba(255,255,255,0.16); font-weight:800; font-size:1.08em; text-align:center; }
  .rl[data-s="1"] .rl-opts .ok { animation:rlOk var(--d) linear both; } @keyframes rlOk { 0%, 58% { background:hsla(140,21%,62%,0.16); color:hsl(153,48%,86%); transform:none; } 62% { transform:scale(1.07); } 64%, 100% { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:var(--ac-ink); transform:none; } }
  .rl-who { display:flex; gap:0.4em; justify-content:center; margin-top:0.7em; } .rl-who em { opacity:0; font-style:normal; padding:0.25em 0.7em; border-radius:99px; background:color-mix(in srgb, var(--c) 18%, rgba(255,255,255,0.07)); border:0.1em solid var(--c); font-family:var(--mono); font-size:0.8em; font-weight:800; } .rl-who em.no { opacity:0; filter:grayscale(0.6); } .rl[data-s="1"] .rl-who em { animation:rlIn 0.35s ease 4s both; } .rl[data-s="1"] .rl-who em:nth-child(2) { animation-delay:4.2s; } .rl[data-s="1"] .rl-who em:nth-child(3) { animation-delay:4.4s; } @keyframes rlIn { from { opacity:0; transform:translateY(0.5em); } to { opacity:1; } }
  .rl-vs { display:flex; flex-direction:column; align-items:center; gap:0.5em; padding:1em 1.6em; border-radius:1.3em; background:hsl(var(--ah) calc(50% * var(--asf)) 3% / 0.88); color:#fff; backdrop-filter:blur(4px); } .rl[data-s="3"] .rl-vs { animation:rlVs var(--d) ease both; } @keyframes rlVs { 0% { opacity:0; transform:translate(-50%,-50%) scale(1.4); } 7%, 52% { opacity:1; transform:translate(-50%,-50%) scale(1); } 60%, 100% { opacity:0; transform:translate(-50%,-50%) scale(0.9); } }
  .rl-vs { border:0.18em solid rgba(255,255,255,0.16); box-shadow:0 0.4em 0 rgba(255,255,255,0.2); } .rl-vs span { font-weight:900 !important; font-size:1.1em !important; } .rl-vs small { font-family:var(--mono); font-size:0.8em; font-weight:800; letter-spacing:0.16em; color:#ffe27a; } .rl-vs > div { display:flex; align-items:center; gap:1.3em; } .rl-vs span { display:flex; flex-direction:column; align-items:center; gap:0.35em; font-weight:800; font-size:0.95em; } .rl-vs span i { display:flex; align-items:center; justify-content:center; width:3.2em; height:3.2em; border-radius:50%; background:var(--c); font-style:normal; font-size:1.3em; box-shadow:0 0 0 0.25em rgba(255,255,255,0.15); } .rl-vs u { text-decoration:none; font-size:2.6em; animation:rlClash 0.6s ease-in-out infinite alternate; } @keyframes rlClash { to { transform:scale(1.25) rotate(8deg); } } .rl-vs em { font-style:normal; font-size:0.85em; color:#b9d6c8; }
  .rl-plus { position:absolute; opacity:0; transform:translate(-50%,-50%); font-family:var(--display); font-weight:800; font-size:2.4em; color:#fff; text-shadow:0 0.1em 0.5em rgba(0,0,0,0.7); pointer-events:none; } .rl.won .rl-plus { animation:rlPlus 1.8s ease-out both; } @keyframes rlPlus { 0% { opacity:0; transform:translate(-50%,-20%) scale(0.6); } 20% { opacity:1; transform:translate(-50%,-80%) scale(1.15); } 100% { opacity:0; transform:translate(-50%,-220%) scale(1); } }
  .rl-end { display:flex; flex-direction:column; align-items:center; gap:0.9em; color:#fff; } .rl[data-s="4"] .rl-end { opacity:1; transform:translate(-50%,-50%); transition:opacity 0.4s; } .rl-pod { display:flex; align-items:flex-end; gap:0.6em; } .rl-pod span { display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:0.2em; width:5.4em; height:var(--h,0); padding-bottom:0.5em; border-radius:0.8em 0.8em 0 0; background:linear-gradient(180deg,var(--c),color-mix(in srgb, var(--c) 55%, #000)); overflow:hidden; }
  .rl-pod i { font-style:normal; font-size:1.9em; } .rl-pod b { font-family:var(--display); font-size:1.5em; } .rl[data-s="4"] .rl-pod .p1 { animation:rlRise 0.8s var(--spring) 0.9s both; --h:10em; } .rl[data-s="4"] .rl-pod .p2 { animation:rlRise 0.8s var(--spring) 0.5s both; --h:7.4em; } .rl[data-s="4"] .rl-pod .p3 { animation:rlRise 0.8s var(--spring) 0.1s both; --h:5.6em; } @keyframes rlRise { from { clip-path:inset(100% 0 0 0); } to { clip-path:inset(0 0 0 0); } }
  .rl-end em { font-style:normal; padding:0.5em 1.2em; border-radius:99px; background:hsl(var(--ah) calc(75% * var(--asf)) 57%); color:hsl(var(--ah) calc(65% * var(--asf)) 5%); box-shadow:0 0.3em 0 hsl(var(--ah) calc(76% * var(--asf)) 34%); font-weight:900; font-size:1.2em; opacity:0; } .rl-pod span { border:0.16em solid rgba(255,255,255,0.16); border-bottom:none; } .rl-pod b { font-weight:900; font-size:1.9em !important; } .rl[data-s="4"] .rl-end em { animation:rlIn 0.5s ease 1.9s both; }
  .rl-cap { position:absolute; left:50%; bottom:4%; transform:translateX(-50%); display:flex; align-items:center; gap:0.6em; max-width:94%; padding:0.45em 1.1em 0.45em 0.45em; border-radius:99px; background:rgba(255,255,255,0.07); color:hsl(153,48%,86%); box-shadow:0 0.3em 0 rgba(255,255,255,0.25); font-family:var(--ui); font-weight:800; font-size:1.02em; line-height:1.25; z-index:3; } .rl-cap b { flex:none; display:flex; align-items:center; justify-content:center; width:1.7em; height:1.7em; border-radius:50%; background:hsl(var(--ah) calc(75% * var(--asf)) 57%); color:hsl(var(--ah) calc(65% * var(--asf)) 5%); font-family:var(--mono); }
  @media (max-width:860px) { .dqh-hero { grid-template-columns:1fr; padding:20px; } .dqh-play { grid-template-columns:1fr 1fr; } .dqh-card.who { grid-column:1 / -1; } .dqh-steps { grid-template-columns:1fr 1fr; } }
  @media (max-width:560px) { .dqh-play { grid-template-columns:1fr; } .dqh-card { padding:15px; } .rl-tabs span { font-size:0; gap:0; } .rl-tabs span b { font-size:10px; } .rl-stage { aspect-ratio:4 / 3; font-size:clamp(8px,2.7cqw,14px); } .rl-map { top:16%; height:62%; } .rl-cap { border-radius:1em; } }
  @media (prefers-reduced-motion: reduce) { .dqh-hero::before, .dqh-demo > i, .dqh-copy small i { animation:none; } }
  /* ===== v4.17: ukážka — plávajúce body, konfety, rebríček ===== */
  .rl-pop { position:absolute; transform:translate(-50%,-50%); font-family:var(--display); font-weight:900; font-size:1.7em; color:#fff; -webkit-text-stroke:0.06em #000; text-shadow:0 0.12em 0 var(--c), 0 0 0.6em var(--c); pointer-events:none; animation:rlPopUp 1s ease-out both; z-index:2; } @keyframes rlPopUp { 0% { opacity:0; transform:translate(-50%,-20%) scale(0.5); } 25% { opacity:1; transform:translate(-50%,-90%) scale(1.2); } 100% { opacity:0; transform:translate(-50%,-240%) scale(1); } }
  .rl-plus { font-weight:900 !important; font-size:3em !important; -webkit-text-stroke:0.05em #000; text-shadow:0 0.12em 0 #e63946, 0 0 0.6em #e63946 !important; z-index:2; }
  .rl-conf { position:absolute; inset:0; pointer-events:none; overflow:hidden; display:none; } .rl[data-s="4"] .rl-conf { display:block; } .rl-conf i { position:absolute; left:var(--x); top:-6%; width:0.7em; height:1.1em; border-radius:0.15em; background:var(--c); transform:rotate(var(--r)); animation:rlConf 2.6s ease-in var(--dl) infinite; } @keyframes rlConf { to { transform:translateY(112vh) rotate(calc(var(--r) + 540deg)) translateX(2em); } }
  .rl-rank { position:absolute; left:50%; top:47%; width:min(30em,86%); opacity:0; pointer-events:none; transform:translate(-50%,-50%) scale(0.9); transition:opacity 0.4s, transform 0.4s; color:#fff; z-index:2; } .rl[data-s="5"] .rl-rank { opacity:1; transform:translate(-50%,-50%); }
  .rl-rk-h { display:flex; align-items:center; justify-content:space-between; margin-bottom:0.5em; } .rl-rk-h small { font-family:var(--mono); font-weight:800; font-size:0.8em; letter-spacing:0.16em; color:#e3a36f; } .rl-rk-h b { opacity:0; padding:0.15em 0.7em; border-radius:99px; background:hsl(var(--ah) calc(75% * var(--asf)) 57%); color:hsl(var(--ah) calc(65% * var(--asf)) 5%); font-weight:900; font-size:1.25em; box-shadow:0 0.22em 0 hsl(var(--ah) calc(76% * var(--asf)) 34%); } .rl.rk-add .rl-rk-h b { animation:rlBadge 2.6s ease both; } @keyframes rlBadge { 0% { opacity:0; transform:scale(0.4); } 12% { opacity:1; transform:scale(1.25); } 20%, 80% { opacity:1; transform:scale(1); } 100% { opacity:0; transform:translateY(1.4em) scale(0.8); } }
  .rl-rk-l { position:relative; height:13.6em; } .rl-rk-r { position:absolute; left:0; right:0; top:calc(var(--i) * 2.75em); height:2.4em; display:flex; align-items:center; gap:0.6em; padding:0 0.8em 0 0.4em; border-radius:0.8em; background:#141917; border:0.14em solid #2a322e; font-weight:800; font-size:1em; transition:top 0.55s cubic-bezier(0.3,1.3,0.5,1), background 0.3s, border-color 0.3s, box-shadow 0.3s; }
  .rl-rk-r u { text-decoration:none; width:1.5em; text-align:center; font-family:var(--mono); color:#8fa59a; } .rl-rk-r.top u { color:#ffe27a; } .rl-rk-r i { display:flex; align-items:center; justify-content:center; width:1.75em; height:1.75em; border-radius:50%; background:var(--c); font-style:normal; font-size:0.9em; } .rl-rk-r span { flex:1; letter-spacing:0.03em; } .rl-rk-r em { font-style:normal; padding:0.1em 0.55em; border-radius:99px; background:#b0703c; font-family:var(--mono); font-size:0.7em; } .rl-rk-r b { font-family:var(--mono); min-width:3.6em; text-align:right; }
  .rl-rk-r.me { background:hsl(var(--ah) calc(33% * var(--asf)) 11%); border-color:hsl(var(--ah) calc(75% * var(--asf)) 57%); box-shadow:0 0 1.4em hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.35); z-index:2; } .rl.rk-add .rl-rk-r.me b { color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .rl.rk-up .rl-rk-r.me em { background:rgba(255,255,255,0.13); color:hsl(153,48%,86%); transition:background 0.4s; }
  .rl-rk-up { display:flex; align-items:center; gap:0.7em; margin-top:0.2em; padding:0.5em 0.9em; border-radius:0.9em; background:linear-gradient(135deg,hsla(210,17%,62%,0.16),#8d98a3); color:hsl(153,48%,86%); box-shadow:0 0.3em 0 #6b7680; opacity:0; transform:translateY(0.8em) scale(0.9); transition:opacity 0.4s, transform 0.5s cubic-bezier(0.3,1.5,0.5,1); } .rl.rk-up .rl-rk-up { opacity:1; transform:none; } .rl-rk-up i { font-style:normal; font-size:1.5em; color:hsl(153,85%,78%); animation:rlArrow 0.7s ease-in-out infinite alternate; } @keyframes rlArrow { to { transform:translateY(-0.25em); } } .rl-rk-up span { display:flex; flex-direction:column; font-family:var(--ui); font-size:0.78em; font-weight:600; line-height:1.3; } .rl-rk-up span b { font-family:var(--display); font-size:1.4em; font-weight:900; letter-spacing:0.02em; }
  @media (max-width:560px) { .rl-tabs { grid-template-columns:repeat(6,1fr); } .rl-rank { top:44%; } }
  /* ===== v4.18: hlavička — účet a celá obrazovka; profil — karta hráča a úspechy ===== */
  .fs-ico { font-size:16px; } .fs-ico.on { background:var(--green); color:hsl(var(--ah) calc(65% * var(--asf)) 5%); border-color:var(--green); }
  .acct-btn.in { display:inline-flex; align-items:center; gap:8px; padding-left:5px; } .acct-btn.in img, .acct-btn.in u { flex:none; width:30px; height:30px; border-radius:50%; object-fit:cover; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; background:linear-gradient(135deg,hsl(var(--ah) calc(83% * var(--asf)) 42%),hsl(var(--ah) calc(85% * var(--asf)) 26%)); color:var(--ac-ink); font-weight:800; font-size:15px; margin:0; }
  .acct-btn.in span { max-width:110px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .acct-btn.in em { font-style:normal; padding:2px 7px; border-radius:99px; background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.18); color:hsl(var(--ah) calc(75% * var(--asf)) 57%); font-family:var(--mono); font-size:10px; font-weight:800; white-space:nowrap; }
  @media (max-width:560px) { .acct-btn.in span { max-width:64px; } .acct-btn.in em { display:none; } }
  .pfx { position:relative; overflow:hidden; border-radius:24px; padding:20px 22px 16px; color:hsl(var(--ah) calc(44% * var(--asf)) 89%); background:radial-gradient(120% 160% at 0% 0%,color-mix(in srgb, var(--lg) 55%, hsl(var(--ah) calc(39% * var(--asf)) 10%)) 0%,hsl(var(--ah) calc(39% * var(--asf)) 10%) 45%,hsl(var(--ah) calc(46% * var(--asf)) 5%) 100%); box-shadow:0 14px 36px hsl(var(--ah) calc(46% * var(--asf)) 5% / 0.3); }
  .pfx::after { content:''; position:absolute; right:-60px; top:-60px; width:240px; height:240px; border-radius:50%; background:radial-gradient(circle,color-mix(in srgb, var(--lg) 50%, transparent),transparent 70%); pointer-events:none; }
  .pfx-top { position:relative; display:flex; align-items:center; gap:18px; } .pfx-av { position:relative; flex:none; } .pfx-av .pf-av.big { width:88px; height:88px; font-size:38px; box-shadow:0 0 0 4px hsl(var(--ah) calc(46% * var(--asf)) 5%), 0 0 0 6px rgba(255,255,255,0.22), 0 10px 26px rgba(0,0,0,0.45); }
  .pfx-av em { position:absolute; left:50%; bottom:-9px; transform:translateX(-50%); padding:3px 10px; border-radius:99px; background:var(--lg); color:#fff; font-style:normal; font-family:var(--mono); font-size:11px; font-weight:800; white-space:nowrap; box-shadow:0 3px 0 rgba(0,0,0,0.35); }
  .pfx-id { flex:1; min-width:0; } .pfx-id h2 { margin:0; font-family:var(--display); font-size:clamp(24px,4vw,34px); line-height:1.05; color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .pfx-id p { display:flex; flex-wrap:wrap; gap:6px; margin:6px 0 10px; font-size:12px; } .pfx-id p span { padding:3px 10px; border-radius:99px; background:rgba(255,255,255,0.1); white-space:nowrap; } .pfx-id p .pfx-lg { background:var(--lg); color:#fff; font-family:var(--mono); font-weight:800; letter-spacing:0.08em; }
  .pfx-xp { cursor:pointer; padding:10px 12px; border-radius:14px; background:rgba(0,0,0,0.3); transition:background 0.2s, transform 0.2s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pfx-xp:hover { background:rgba(0,0,0,0.45); transform:translateY(-1px); } } .pfx-xp > div { display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap; } .pfx-xp b { color:#fff; font-size:15px; } .pfx-xp span { font-size:12px; opacity:0.85; }
  .pfx-xp > i { display:block; height:10px; margin-top:7px; border-radius:99px; background:rgba(255,255,255,0.14); overflow:hidden; } .pfx-xp > i em { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,hsl(var(--ah) calc(75% * var(--asf)) 57%),#ffe27a); box-shadow:0 0 12px hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.6); transition:width 0.8s var(--ease-out); } .pfx-xp small { display:block; margin-top:6px; font-size:11.5px; opacity:0.8; } .pfx-xp small b { font-size:11.5px; color:#ffe27a; }
  .pfx-ref { position:absolute; right:0; top:0; width:36px; height:36px; border-radius:12px; border:1px solid rgba(255,255,255,0.25); background:rgba(255,255,255,0.08); color:#fff; font-size:17px; cursor:pointer; transition:background 0.2s, transform 0.4s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pfx-ref:hover { background:rgba(255,255,255,0.2); transform:rotate(180deg); } }
  .pfx-kpis { position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:16px; } .pfx-kpis > div { padding:10px 12px; border-radius:14px; background:rgba(255,255,255,0.08); transition:transform 0.2s, background 0.2s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pfx-kpis > div:hover { transform:translateY(-3px); background:rgba(255,255,255,0.14); } } .pfx-kpis b { display:block; font-family:var(--display); font-size:clamp(19px,2.8vw,26px); line-height:1.1; color:#fff; } .pfx-kpis span { font-size:11.5px; opacity:0.8; }
  .pf-trio { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:12px; } .pf-trio > div { --c:var(--green); display:flex; flex-direction:column; padding:14px; border-radius:18px; background:rgba(255,255,255,0.07); border:1.5px solid var(--border); border-bottom:4px solid var(--c); transition:transform 0.2s, box-shadow 0.2s; } .pf-trio > div[data-go2] { cursor:pointer; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-trio > div:hover { transform:translateY(-3px); box-shadow:0 12px 26px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.12); } }
  .pf-trio i { font-style:normal; font-size:22px; line-height:1; } .pf-trio b { font-family:var(--display); font-size:30px; line-height:1.1; color:var(--text); } .pf-trio span { font-size:12px; color:var(--text-dim); line-height:1.35; } .pf-trio .t-fire { --c:#c9d3ce; } .pf-trio .t-fire i { filter:grayscale(1); opacity:0.5; } .pf-trio .t-fire.on { --c:#ff8c2b; background:linear-gradient(180deg,hsla(35,85%,62%,0.16),rgba(255,255,255,0.07)); } .pf-trio .t-fire.on i { filter:none; opacity:1; animation:dqFire 0.9s ease-in-out infinite; display:inline-block; transform-origin:50% 90%; }
  .pf-ach { margin-top:12px; padding:16px; border-radius:20px; background:var(--panel-2); } .pf-ach-h { display:flex; align-items:center; gap:12px; margin-bottom:12px; } .pf-ach-h h3 { margin:0; font-family:var(--display); font-size:16px; letter-spacing:0.06em; } .pf-ach-h span { font-family:var(--mono); font-size:12px; color:var(--text-dim); } .pf-ach-h span b { color:var(--green); font-size:15px; } .pf-ach-h i { flex:1; height:8px; border-radius:99px; background:hsla(140,16%,62%,0.16); overflow:hidden; } .pf-ach-h i em { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,hsl(var(--ah) calc(83% * var(--asf)) 42%),#ffbe0b); }
  .pf-ach-g { display:grid; grid-template-columns:repeat(auto-fill,minmax(132px,1fr)); gap:8px; } .pf-ach-g > div { display:flex; flex-direction:column; align-items:center; text-align:center; gap:2px; padding:12px 8px 10px; border-radius:16px; background:rgba(255,255,255,0.07); border:1.5px solid var(--border); transition:transform 0.2s, box-shadow 0.2s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-ach-g > div:hover { transform:translateY(-3px) rotate(-1deg); box-shadow:0 10px 22px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.12); } }
  .pf-ach-g i { font-style:normal; font-size:28px; line-height:1.1; filter:grayscale(1); opacity:0.45; transition:transform 0.25s; } .pf-ach-g b { font-size:13px; line-height:1.2; } .pf-ach-g span { font-size:11px; color:var(--text-dim); line-height:1.3; min-height:2.6em; } .pf-ach-g s { display:block; width:100%; height:6px; margin-top:4px; border-radius:99px; background:hsla(147,19%,62%,0.16); overflow:hidden; text-decoration:none; } .pf-ach-g s em { display:block; height:100%; border-radius:99px; background:var(--green); } .pf-ach-g small { font-family:var(--mono); font-size:10px; color:var(--text-faint); }
  .pf-ach-g .ok { background:linear-gradient(180deg,hsla(48,85%,62%,0.16),rgba(255,255,255,0.07)); border-color:#e9cf7a; box-shadow:0 3px 0 #e9cf7a; } .pf-ach-g .ok i { filter:none; opacity:1; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-ach-g .ok:hover i { transform:scale(1.25) rotate(8deg); } } .pf-ach-g u { text-decoration:none; margin-top:4px; padding:2px 8px; border-radius:99px; background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:var(--ac-ink); font-family:var(--mono); font-size:9.5px; font-weight:800; letter-spacing:0.06em; }
  @media (max-width:760px) { .pfx-kpis, .pf-trio { grid-template-columns:1fr 1fr; } .pfx { padding:16px; } .pfx-top { gap:14px; align-items:flex-start; } .pfx-av .pf-av.big { width:66px; height:66px; font-size:28px; } .pfx-ref { display:none; } .pf-ach-g { grid-template-columns:repeat(auto-fill,minmax(104px,1fr)); } }
  .brand2 > span, header.hd2 .clock { white-space:nowrap; } header.hd2 .head-r { display:flex; align-items:center; gap:8px; flex-wrap:nowrap; }
  @media (max-width:1040px) { header.hd2 { grid-template-columns:auto 1fr; } header.hd2 .clock { display:none; } .brand2 { justify-self:start; } }
  @media (max-width:640px) { .hd-ver { display:none; } header.hd2 .head-r { gap:5px; } .fs-ico { display:none; } }
  .pf-ach-n { margin:-4px 0 12px; font-size:13px; line-height:1.45; color:var(--text-dim); } .pf-ach-g { grid-template-columns:repeat(auto-fill,minmax(168px,1fr)) !important; } .pf-ach-g span { min-height:3.9em !important; } .pf-ach-g .lock { background:rgba(255,255,255,0.07); border-style:dashed; } .pf-ach-g .lock b { color:var(--text-dim); } .pf-ach-g small { font-size:10.5px !important; line-height:1.3; }
  @media (max-width:760px) { .pf-ach-g { grid-template-columns:1fr 1fr !important; } }
  /* ===== v4.19: nastavenia profilu ===== */
  .st { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; } .st-card { display:flex; flex-direction:column; gap:12px; padding:18px; border-radius:20px; background:rgba(255,255,255,0.07); border:1.5px solid var(--border); transition:box-shadow 0.2s, border-color 0.2s; min-width:0; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .st-card:hover { box-shadow:0 12px 28px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.09); border-color:var(--border-bright); } } .st-card.wide { grid-column:1 / -1; }
  .st-card > h3 { display:flex; align-items:center; gap:10px; margin:0; font-family:var(--display); font-size:15px; letter-spacing:0.05em; color:var(--text); } .st-card > h3 i { display:flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:10px; background:color-mix(in srgb, var(--green) 14%, rgba(255,255,255,0.07)); font-style:normal; font-size:16px; }
  .st-card h4 { margin:0 0 8px; font-family:var(--mono); font-size:10.5px; font-weight:800; letter-spacing:0.16em; color:var(--text-dim); } .st-card h4 em, .st-f label em { font-style:normal; font-weight:500; letter-spacing:0.02em; text-transform:none; } .st-card small { display:block; font-size:12px; line-height:1.45; color:var(--text-dim); }
  .st-prev { padding:12px 14px; border-radius:16px; background:var(--panel-2); } .st-prev-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:16px; } .st-prev-row b { font-weight:800; } .st-prev-row .lv-b { margin-left:0; } .st-prev-row strong { margin-left:auto; font-family:var(--mono); color:var(--green); } .st-prev small { margin-top:6px; }
  .st-2 { display:grid; grid-template-columns:minmax(220px,0.8fr) 1.4fr; gap:18px; } .st-photo { display:flex; align-items:center; gap:14px; margin-bottom:8px; } .st-photo .pf-av.big { box-shadow:0 0 0 3px var(--border); } .st-photo > div { display:flex; flex-direction:column; gap:6px; align-items:stretch; }
  .st .pf-file { position:relative; overflow:hidden; display:inline-flex; align-items:center; justify-content:center; height:44px; padding:0 18px; font-size:12.5px; cursor:pointer; white-space:nowrap; } .st .pf-file span { pointer-events:none; line-height:1; } .st .pf-file input { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; font-size:0; } .st-photo .btn.ghost { height:36px; padding:0 14px; font-size:11.5px; }
  .st-f { display:flex; flex-direction:column; gap:6px; padding-top:12px; border-top:1px dashed var(--border); } .st-f:first-of-type { padding-top:0; border-top:none; } .st-f label { font-family:var(--mono); font-size:10.5px; font-weight:800; letter-spacing:0.16em; color:var(--text-dim); } .st-f .pf-form { display:grid; grid-template-columns:1fr 1fr auto; gap:8px; } .st-f .pf-form input { min-width:0; width:100%; } .st-f .pf-form input:only-of-type { grid-column:1 / 3; } .st-f .pf-form .btn { height:44px; padding:0 16px; }
  .st-card .dq-look { border:none; padding:0; margin:0; } .st-card.danger { border-color:#f1c4c0; background:hsla(0,85%,62%,0.16); } .st-card.danger > h3 i { background:hsla(6,85%,62%,0.16); } .st-danger { display:grid; grid-template-columns:1fr auto; gap:12px 16px; align-items:center; } .st-danger b { display:block; font-size:14.5px; }
  @media (max-width:900px) { .st { grid-template-columns:1fr; } .st-2 { grid-template-columns:1fr; } } @media (max-width:560px) { .st-f .pf-form { grid-template-columns:1fr; } .st-f .pf-form input:only-of-type { grid-column:auto; } .st-danger { grid-template-columns:1fr; } .st-card { padding:14px; } }
  /* ===== v4.19.1: výraznejší účet v hlavičke ===== */
  .acct-btn.in { height:46px; max-width:none; padding:0 14px 0 5px; gap:10px; border:2px solid hsl(var(--ah) calc(75% * var(--asf)) 57%); border-radius:999px; background:linear-gradient(180deg,hsl(var(--ah) calc(63% * var(--asf)) 29%),hsl(var(--ah) calc(66% * var(--asf)) 17%)); color:#fff; box-shadow:0 4px 0 hsl(var(--ah) calc(67% * var(--asf)) 12%), 0 8px 20px rgba(0,0,0,0.35); transition:transform 0.15s, box-shadow 0.15s, filter 0.15s; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .acct-btn.in:hover { background:linear-gradient(180deg,#22946200,#0f4a3100), linear-gradient(180deg,hsl(var(--ah) calc(62% * var(--asf)) 36%),hsl(var(--ah) calc(67% * var(--asf)) 21%)); border-color:hsl(var(--ah) calc(86% * var(--asf)) 73%); transform:translateY(-2px); box-shadow:0 6px 0 hsl(var(--ah) calc(67% * var(--asf)) 12%), 0 12px 26px rgba(0,0,0,0.4); } } .acct-btn.in:active { transform:translateY(2px); box-shadow:0 2px 0 hsl(var(--ah) calc(67% * var(--asf)) 12%); }
  .acct-btn.in.on { box-shadow:0 4px 0 hsl(var(--ah) calc(67% * var(--asf)) 12%), 0 0 0 4px hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.35); }
  .acct-btn.in img, .acct-btn.in u { width:34px; height:34px; font-size:17px; font-weight:900; box-shadow:0 0 0 2px hsl(var(--ah) calc(66% * var(--asf)) 17%), 0 0 0 4.5px var(--lg, hsl(var(--ah) calc(75% * var(--asf)) 57%)); }
  .acct-btn.in span { max-width:130px; font-family:var(--display); font-size:16px; font-weight:900; letter-spacing:0.01em; text-shadow:0 1px 0 rgba(0,0,0,0.35); }
  .acct-btn.in em { padding:4px 9px; background:hsl(var(--ah) calc(75% * var(--asf)) 57%); color:hsl(var(--ah) calc(65% * var(--asf)) 5%); font-size:11px; font-weight:900; letter-spacing:0.04em; box-shadow:0 2px 0 hsl(var(--ah) calc(76% * var(--asf)) 34%); }
  @media (max-width:760px) { .acct-btn.in { height:40px; padding:0 10px 0 4px; gap:7px; } .acct-btn.in img, .acct-btn.in u { width:30px; height:30px; } .acct-btn.in span { font-size:14px; max-width:84px; } }
  @media (max-width:560px) { .acct-btn.in span { max-width:64px; } .acct-btn.in em { display:none; } }
  /* ===== v4.20: chyby ako jeden pás, prihlásenie, plynulosť ===== */
  header, .tab { backdrop-filter:none !important; -webkit-backdrop-filter:none !important; } header { background:hsl(var(--ah) calc(45% * var(--asf)) 6% / 0.9) !important; } .tab { background:hsl(var(--ah) calc(29% * var(--asf)) 12% / 0.92); }
  .weak-section { padding:0 !important; background:none !important; border:none !important; box-shadow:none !important; } .weak-section.none { display:none !important; }
  .wk-bar { display:flex; align-items:center; gap:14px; padding:14px 18px; border-radius:18px; background:rgba(255,255,255,0.07); border:1.5px solid #f1d9a8; box-shadow:0 4px 0 #f1d9a8; } .wk-bar > i { flex:none; min-width:46px; height:46px; padding:0 10px; border-radius:14px; background:linear-gradient(135deg,#ffbe0b,#ff8c2b); color:#fff; font-style:normal; font-family:var(--display); font-weight:900; font-size:20px; display:flex; align-items:center; justify-content:center; }
  .wk-bar > div { flex:1; min-width:0; display:flex; flex-direction:column; } .wk-bar b { font-size:15.5px; color:var(--text); } .wk-bar span { font-size:12.5px; color:var(--text-dim); } .wk-bar .btn { height:44px; padding:0 18px; white-space:nowrap; }
  #wkl-wrap { position:fixed; inset:0; z-index:395; display:flex; align-items:center; justify-content:center; padding:14px; background:hsl(var(--ah) calc(50% * var(--asf)) 5% / 0.72); animation:hpFade 0.2s ease; } .hp.wkl { width:min(680px,100%); display:flex; flex-direction:column; } .wkl-n { margin:8px 0 4px; font-size:13.5px; color:hsl(215,22%,78%); }
  .wkl-list { overflow:auto; max-height:min(60vh,520px); padding:2px; } .wkl-list h4 { margin:12px 0 6px; font-family:var(--mono); font-size:10.5px; letter-spacing:0.16em; color:hsl(153,88%,75%); } .wkl-list h4 em { font-style:normal; color:#8a9a92; margin-left:4px; } .wkl-list > div { display:flex; flex-wrap:wrap; gap:6px; } .wkl-list .weak-item b { color:#d6352b; margin-left:2px; }
  .au { display:grid; grid-template-columns:1fr 1.1fr; border-radius:24px; overflow:hidden; background:rgba(255,255,255,0.07); border:1.5px solid var(--border); box-shadow:0 18px 44px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.12); margin-top:4px; }
  .au-side { position:relative; padding:28px 26px; color:hsl(var(--ah) calc(44% * var(--asf)) 89%); background:radial-gradient(120% 140% at 0% 0%,hsl(var(--ah) calc(60% * var(--asf)) 26%) 0%,hsl(var(--ah) calc(50% * var(--asf)) 11%) 55%,hsl(var(--ah) calc(46% * var(--asf)) 5%) 100%); overflow:hidden; } .au-side small { font-family:var(--mono); font-size:11px; font-weight:800; letter-spacing:0.22em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .au-side h3 { margin:8px 0 18px; font-family:var(--display); font-size:clamp(22px,2.6vw,30px); line-height:1.1; color:#fff; }
  .au-side ul { list-style:none; margin:0; padding:0; display:grid; gap:10px; } .au-side li { display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:14px; background:rgba(255,255,255,0.07); transition:transform 0.2s, background 0.2s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .au-side li:hover { transform:translateX(4px); background:rgba(255,255,255,0.13); } } .au-side li i { flex:none; font-style:normal; font-size:22px; } .au-side li span { font-size:12.5px; line-height:1.35; } .au-side li b { display:block; color:#fff; font-size:14.5px; }
  .au-form { display:flex; flex-direction:column; gap:12px; padding:26px; } .au-tabs { display:grid; grid-template-columns:1fr 1fr; gap:4px; padding:4px; border-radius:14px; background:var(--panel-2); } .au-tabs button { height:42px; border:none; border-radius:11px; background:transparent; color:var(--text-dim); font-family:var(--ui); font-weight:800; font-size:12.5px; letter-spacing:0.08em; cursor:pointer; transition:background 0.2s, color 0.2s, box-shadow 0.2s; } .au-tabs button.on { background:rgba(255,255,255,0.07); color:var(--text); box-shadow:0 4px 12px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.12); }
  .au-form label { display:flex; flex-direction:column; gap:6px; font-family:var(--mono); font-size:10.5px; font-weight:800; letter-spacing:0.16em; color:var(--text-dim); } .au-form input { width:100%; height:50px; padding:0 16px; border-radius:14px; border:1.5px solid var(--border-bright); background:rgba(255,255,255,0.07); color:var(--text); font-family:var(--ui); font-size:16px; font-weight:700; letter-spacing:0; outline:none; transition:border-color 0.15s, box-shadow 0.15s; } .au-form input:focus { border-color:var(--green-strong); box-shadow:0 0 0 4px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.16); }
  .au-pw { position:relative; display:block; } .au-pw input { padding-right:50px; } .au-pw button { position:absolute; right:6px; top:6px; width:38px; height:38px; border:none; border-radius:10px; background:transparent; font-size:16px; cursor:pointer; opacity:0.5; transition:opacity 0.15s, background 0.15s; } .au-pw button.on { opacity:1; background:var(--panel-2); }@media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .au-pw button:hover { opacity:1; background:var(--panel-2); } }
  .au-form[data-tab="in"] .au-meter, .au-form[data-tab="in"] .t-new, .au-form[data-tab="new"] .t-in { display:none; } .au-go { height:52px !important; font-size:14px; } .au-sw { margin:0; text-align:center; font-size:13px; color:var(--text-dim); } .au-sw a { color:var(--green); font-weight:800; text-decoration:none; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .au-sw a:hover { text-decoration:underline; } }
  .home-toabout { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin:18px 0 6px; padding:14px 18px; border-radius:16px; background:var(--panel-2); font-size:14px; color:var(--text-dim); } .home-toabout .btn { height:42px; padding:0 16px; }
  @media (max-width:760px) { .au { grid-template-columns:1fr; } .au-side { padding:20px; } .au-side ul { grid-template-columns:1fr 1fr; } .au-side li { flex-direction:column; align-items:flex-start; gap:4px; } .au-form { padding:18px; } .wk-bar { flex-wrap:wrap; } .wk-bar > div { flex-basis:60%; } .wk-bar .btn { flex:1; } }
  /* ===== v5.0: jednotný vzhľad „MÄKKÝ“ — tlačidlá, prepínače, karty, polia ===== */
  :root { --d-grad:linear-gradient(135deg,hsl(var(--ah) calc(79% * var(--asf)) 46%),hsl(var(--ah) calc(88% * var(--asf)) 33%)); --d-sh:0 8px 20px hsl(var(--ah) calc(50% * var(--asf)) 16% / 0.10); --d-sh2:0 14px 30px hsl(var(--ah) calc(50% * var(--asf)) 16% / 0.16); }
  .btn { border:none; border-radius:999px; background:var(--d-grad); color:var(--ac-ink); font-family:var(--ui); font-weight:800; letter-spacing:0.04em; box-shadow:0 10px 22px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.34); transition:transform 0.18s, box-shadow 0.18s, filter 0.18s; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .btn:hover { transform:translateY(-2px); box-shadow:0 14px 28px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.42); filter:brightness(1.04); } } .btn:active { transform:translateY(0); box-shadow:0 6px 14px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.3); } .btn:disabled { filter:grayscale(0.6); opacity:0.55; transform:none; box-shadow:none; }
  .btn.ghost { background:rgba(255,255,255,0.07); border:none; color:var(--text); box-shadow:var(--d-sh); } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .btn.ghost:hover { background:rgba(255,255,255,0.07); color:var(--green); box-shadow:var(--d-sh2); } }
  .set-btn, .demo-btn { border:none; border-radius:999px; background:rgba(255,255,255,0.07); box-shadow:var(--d-sh); transition:transform 0.18s, box-shadow 0.18s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .set-btn:hover, :where(html:not(.touch)) .demo-btn:hover { transform:translateY(-2px); box-shadow:var(--d-sh2); } } .demo-btn { color:hsl(37,88%,73%); background:hsla(43,85%,62%,0.16); }
  .filter-chip, .rk-chip { border:none; border-radius:999px; background:rgba(255,255,255,0.07); color:var(--text-dim); box-shadow:0 4px 10px hsl(var(--ah) calc(50% * var(--asf)) 16% / 0.08); font-weight:700; transition:transform 0.16s, box-shadow 0.16s, background 0.16s, color 0.16s; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .filter-chip:hover, :where(html:not(.touch)) .rk-chip:hover { transform:translateY(-1px); box-shadow:0 8px 16px hsl(var(--ah) calc(50% * var(--asf)) 16% / 0.14); color:var(--text); } } .filter-chip.on, .filter-chip.active, .rk-chip.on { background:var(--d-grad); color:var(--ac-ink); box-shadow:0 8px 18px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.32); }
  .choice-btn { border:none; border-radius:18px; background:rgba(255,255,255,0.07); box-shadow:var(--d-sh); font-family:var(--ui); font-weight:700; transition:transform 0.18s, box-shadow 0.18s, background 0.18s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .choice-btn:hover { transform:translateY(-3px); box-shadow:var(--d-sh2); } }
  .choice-btn.ok { background:linear-gradient(135deg,#19d488,#0a9d5c); color:#fff; box-shadow:0 12px 26px rgba(10,157,92,0.4); } .choice-btn.no { background:hsla(9,85%,62%,0.16); color:hsl(5,64%,72%); box-shadow:inset 0 0 0 2px #f0958b; } .choice-btn.sel { box-shadow:inset 0 0 0 2.5px var(--green-strong), var(--d-sh); }
  .panel { border:1px solid rgba(255,255,255,0.16); border-radius:28px; background:linear-gradient(160deg,hsla(150,33%,62%,0.16),hsla(208,62%,62%,0.16)); box-shadow:0 26px 70px rgba(0,0,0,0.4); } .panel-head { background:transparent; border-bottom:none; border-radius:28px 28px 0 0; } .controls { background:transparent; border-top:none; border-radius:0 0 28px 28px; }
  .stat { border:none; background:rgba(255,255,255,0.07); box-shadow:0 4px 10px hsl(var(--ah) calc(50% * var(--asf)) 16% / 0.08); } .stat-val { font-weight:800; }
  .pg { height:6px; margin:0 26px; border-radius:99px; background:hsl(var(--ah) calc(50% * var(--asf)) 16% / 0.08); overflow:hidden; display:none; } .pg.on { display:block; } .pg i { display:block; height:100%; width:0; border-radius:99px; background:linear-gradient(90deg,hsl(var(--ah) calc(79% * var(--asf)) 46%),#3a86ff); transition:width 0.45s var(--ease-out); }
  .qcard input[type="text"], .qcard input[type="number"], .rk-form input, .pf-form input, .pf-add input, .pf-add select, .home-search input, .rk-pick select { border:none; border-radius:999px; box-shadow:inset 0 0 0 1.5px rgba(255,255,255,0.16); background:rgba(255,255,255,0.07); transition:box-shadow 0.16s; } .qcard input[type="text"]:focus, .qcard input[type="number"]:focus, .rk-form input:focus, .pf-form input:focus, .pf-add input:focus, .home-search input:focus, .rk-pick select:focus { box-shadow:inset 0 0 0 2px var(--green-strong), 0 0 0 4px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.14); outline:none; }
  .pf-card, .pf-act, .dqh-card, .st-card, .pf-trio > div, .pf-ach-g > div, .ch-row, .ch, .rk-tbl, .rkm-ln, .dq-box, .wk-bar, .ab-mod, .ab-row > div, .ab-grid > div, .ab-list li, .home-cta.alt { border:none; box-shadow:var(--d-sh); } .pf-card, .pf-act, .st-card, .dqh-card { border-radius:22px; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-card:hover, :where(html:not(.touch)) .dqh-card:hover, :where(html:not(.touch)) .st-card:hover, :where(html:not(.touch)) .ch-row:hover, :where(html:not(.touch)) .ab-mod:hover { box-shadow:var(--d-sh2); } } .dqh-card.new { box-shadow:0 14px 34px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.3); } .pf-trio > div { border-bottom:4px solid var(--c); } .pf-ach-g .lock { box-shadow:none; background:rgba(255,255,255,0.6); } .pf-ach-g .ok { box-shadow:0 8px 20px rgba(201,151,0,0.22); } .st-card.danger { box-shadow:inset 0 0 0 1.5px #f1c4c0; }
  .pf-ach, .ab-sec, .st-prev, .rkm-exp, .home-toabout, .rk-note { border-radius:22px; } .pf-tabs, .au-tabs { border:none; border-radius:999px; background:hsl(var(--ah) calc(50% * var(--asf)) 16% / 0.07); } .pf-tabs button, .au-tabs button { border-radius:999px; } .pf-tabs button.on { background:var(--d-grad); box-shadow:0 8px 18px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.32); }
  .rk-tbl { border-radius:20px; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; background:rgba(255,255,255,0.07); } .rk-tbl table { border:none; } .tab { border-radius:18px; } .tab.active { background:var(--d-grad); box-shadow:0 12px 28px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.4); }
  .home-cta { border-radius:24px; box-shadow:0 14px 34px hsl(var(--ah) calc(46% * var(--asf)) 5% / 0.22); } .hh-t { border-radius:20px; } .hp, .gal-box { border-radius:28px; } .weak-item { border:none; border-radius:999px; background:hsla(41,85%,62%,0.16); color:hsl(39,88%,78%); box-shadow:none; }
  .rk-reset { border-radius:999px; } .hp-open { border:none; border-radius:999px; background:rgba(255,255,255,0.07); box-shadow:var(--d-sh); } .au { border:none; box-shadow:0 22px 50px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.16); } .au-form input { border:none; box-shadow:inset 0 0 0 1.5px rgba(255,255,255,0.16); border-radius:999px; padding:0 20px; } .au-form input:focus { box-shadow:inset 0 0 0 2px var(--green-strong), 0 0 0 4px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.14); } .au-pw button { right:8px; }
  /* tmavá hra: tlačidlá v súboji ostávajú čitateľné */
  #dq-stage .btn.ghost { background:rgba(255,255,255,0.1); color:#fff; box-shadow:none; } #dq-stage .rk-chip { background:rgba(255,255,255,0.1); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); box-shadow:none; } #dq-stage .rk-chip.on { background:var(--d-grad); color:var(--ac-ink); }
  .pf-hero .btn.ghost, .home-hello .btn.ghost { background:rgba(255,255,255,0.12); color:#fff; box-shadow:none; } .dqh-card.new .btn { background:hsl(var(--ah) calc(75% * var(--asf)) 57%); color:hsl(var(--ah) calc(65% * var(--asf)) 5%); box-shadow:0 10px 22px hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.35); }
  /* týždenné úlohy, konfety, oznam o úspechu, návod v O stránke */
  .wkt { margin-top:12px; padding:16px; border-radius:22px; background:linear-gradient(135deg,hsla(203,85%,62%,0.16),hsla(143,62%,62%,0.16)); box-shadow:var(--d-sh); color:hsl(153,48%,86%); } .home-hello + #home-wkt .wkt, #home-wkt .wkt { margin:14px 0 4px; }
  .wkt-h { display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:10px; } .wkt-h h3 { margin:0; font-family:var(--display); font-size:16px; letter-spacing:0.06em; } .wkt-h span { font-size:12.5px; color:hsl(215,22%,78%); } .wkt-h span b { color:hsl(153,85%,78%); }
  .wkt-g { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:8px; } .wkt-g > div { display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:16px; background:rgba(255,255,255,0.07); box-shadow:0 4px 10px hsl(var(--ah) calc(50% * var(--asf)) 16% / 0.07); } .wkt-g i { font-style:normal; font-size:22px; } .wkt-g > div > div { flex:1; min-width:0; } .wkt-g b { display:block; font-size:13.5px; } .wkt-g s { display:block; height:6px; margin:4px 0 2px; border-radius:99px; background:hsla(147,19%,62%,0.16); overflow:hidden; text-decoration:none; } .wkt-g s em { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,hsl(var(--ah) calc(79% * var(--asf)) 46%),#3a86ff); } .wkt-g small { font-family:var(--mono); font-size:10.5px; color:hsl(215,22%,70%); }
  .wkt-g .btn { height:36px; padding:0 14px; font-size:11.5px; white-space:nowrap; } .wkt-g .ok { box-shadow:0 0 0 2px #19d488, 0 8px 18px rgba(10,157,92,0.2); } .wkt-g .got { opacity:0.7; } .wkt-g u { text-decoration:none; font-family:var(--mono); font-size:11px; font-weight:800; color:hsl(153,85%,78%); white-space:nowrap; }
  .fx-conf { position:fixed; inset:0; z-index:460; pointer-events:none; overflow:hidden; } .fx-conf i { position:absolute; top:-12px; width:9px; height:14px; border-radius:3px; transform:rotate(var(--r)); animation:fxConf 1.9s cubic-bezier(0.2,0.6,0.4,1) forwards; } @keyframes fxConf { to { transform:translateY(106vh) translateX(var(--x)) rotate(calc(var(--r) + 620deg)); opacity:0.9; } }
  .soc-toast.k-ach { border-color:#ffbe0b; background:linear-gradient(135deg,#1c1503,#3a2a00); cursor:pointer; } .soc-toast.k-ach small { color:#ffe27a; }
  .ab-guide { margin-top:10px; } .ab-guide .home-steps { margin:10px 0; } .ab-guide .home-more { background:var(--panel); }
  /* ===== v5.1: štatistiky a priatelia ako karty, doladenie vzhľadu modulov ===== */
  .sx-top { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:10px; margin-top:12px; } .sx-top > div { display:flex; flex-direction:column; gap:2px; padding:16px 18px; border-radius:22px; color:#fff; box-shadow:var(--d-sh2); } .sx-top .good { background:linear-gradient(135deg,#19d488,#0a9d5c); } .sx-top .bad { background:linear-gradient(135deg,#ff9f43,#e5584a); }
  .sx-top small { font-family:var(--mono); font-size:10.5px; font-weight:800; letter-spacing:0.16em; opacity:0.85; } .sx-top b { font-family:var(--display); font-size:20px; line-height:1.15; } .sx-top span { font-size:13px; opacity:0.9; } .sx-top .btn { align-self:flex-start; margin-top:8px; height:38px; padding:0 16px; background:rgba(255,255,255,0.07); color:hsl(6,58%,72%); box-shadow:0 6px 14px rgba(0,0,0,0.15); font-size:12px; }
  .sx-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:10px; } .sx-card { display:flex; align-items:center; gap:14px; padding:14px; border-radius:20px; background:rgba(255,255,255,0.07); box-shadow:var(--d-sh); transition:transform 0.18s, box-shadow 0.18s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .sx-card:hover { transform:translateY(-3px); box-shadow:var(--d-sh2); } } .sx-card.none { opacity:0.6; }
  .sx-card > div { flex:1; min-width:0; display:flex; flex-direction:column; gap:1px; } .sx-card b { font-size:12px; font-weight:800; letter-spacing:0.04em; color:var(--text-dim); } .sx-card strong { font-family:var(--display); font-size:22px; line-height:1.1; color:var(--text); } .sx-card strong small { font-family:var(--ui); font-size:12px; font-weight:600; color:var(--text-dim); } .sx-card span { font-size:12px; color:var(--text-dim); } .sx-card p { margin:6px 0 0; } .sx-card .btn { height:34px; padding:0 14px; font-size:11.5px; }
  .sx-card s, .sx-bars s { display:block; height:6px; margin-top:6px; border-radius:99px; background:hsla(147,19%,62%,0.16); overflow:hidden; text-decoration:none; } .sx-card s em, .sx-bars s em { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,hsl(var(--ah) calc(79% * var(--asf)) 46%),#3a86ff); }
  .sx-ring { flex:none; width:62px; height:62px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:conic-gradient(var(--c) calc(var(--p) * 1%), hsla(150,19%,62%,0.16) 0); font-style:normal; } .sx-ring b { display:flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:50%; background:rgba(255,255,255,0.07); font-family:var(--display); font-size:16px !important; font-weight:800; letter-spacing:0 !important; color:var(--text) !important; } .sx-ring small { font-size:9px; margin-left:1px; }
  .sx-bars { display:grid; gap:8px; padding:16px; border-radius:20px; background:rgba(255,255,255,0.07); box-shadow:var(--d-sh); } .sx-bars > div { display:grid; grid-template-columns:170px 1fr 130px; gap:12px; align-items:center; } .sx-bars b { font-size:13px; } .sx-bars s { margin:0; height:10px; } .sx-bars span { font-family:var(--mono); font-size:11.5px; color:var(--text-dim); text-align:right; } .sx-bars .none { opacity:0.5; }
  .fx-add { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:12px; padding:16px 18px; border-radius:22px; background:linear-gradient(135deg,hsla(203,85%,62%,0.16),hsla(143,62%,62%,0.16)); box-shadow:var(--d-sh); } .fx-add > i { font-style:normal; font-size:30px; } .fx-add > div:nth-child(2) { flex:1 1 220px; min-width:0; display:flex; flex-direction:column; } .fx-add b { font-size:16px; } .fx-add span { font-size:12.5px; color:var(--text-dim); line-height:1.4; } .fx-add .pf-add { flex:1 1 300px; margin:0; display:flex; gap:8px; } .fx-add input { flex:1; min-width:0; height:46px; padding:0 18px; font-size:15px; font-weight:700; } .fx-add .btn { height:46px; white-space:nowrap; }
  .fx-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:10px; } .fx-card { position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; gap:3px; padding:18px 14px 14px; border-radius:22px; background:rgba(255,255,255,0.07); box-shadow:var(--d-sh); transition:transform 0.18s, box-shadow 0.18s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .fx-card:hover { transform:translateY(-3px); box-shadow:var(--d-sh2); } }
  .fx-top { position:relative; margin-bottom:4px; } .fx-top .pf-av.big { width:64px; height:64px; font-size:27px; box-shadow:0 0 0 3px rgba(255,255,255,0.16), 0 0 0 5px rgba(255,255,255,0.16); } .fx-card.on .fx-top .pf-av.big { box-shadow:0 0 0 3px rgba(255,255,255,0.16), 0 0 0 5px hsl(var(--ah) calc(79% * var(--asf)) 46%); } .fx-top > u { position:absolute; right:0; bottom:0; width:16px; height:16px; border-radius:50%; background:hsl(var(--ah) calc(79% * var(--asf)) 46%); border:3px solid rgba(255,255,255,0.16); }
  .fx-card > b { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:4px; font-size:16px; } .fx-card > b .lv-b { margin-left:4px; } .fx-card > span { font-size:12px; color:var(--text-dim); min-height:1.4em; } .fx-b { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; margin-top:8px; } .fx-b .btn { height:36px; padding:0 14px; font-size:11.5px; } .fx-card .pf-x { position:absolute; right:8px; top:8px; opacity:0; transition:opacity 0.15s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .fx-card:hover .pf-x { opacity:1; } } .fx-card.dim { opacity:0.7; } .fx-card.req { box-shadow:0 0 0 2px hsl(var(--ah) calc(79% * var(--asf)) 46%), var(--d-sh); }
  .f-row { border-top:1px solid hsl(var(--ah) calc(50% * var(--asf)) 16% / 0.07); } #hg-in { min-width:150px; text-align:center; } .input-row { display:flex; gap:8px; flex-wrap:wrap; } .input-row input { flex:1 1 150px; }
  @media (max-width:640px) { .sx-bars > div { grid-template-columns:1fr; gap:4px; } .sx-bars span { text-align:left; } .fx-grid { grid-template-columns:1fr 1fr; } .fx-card .pf-x { opacity:1; } }
  /* ===== v5.1.1: lúč radaru ako samostatná vrstva — otáča ju grafická karta, nie skript ===== */
  #radar-sweep { position:fixed; left:50%; top:52%; width:170vmax; height:170vmax; margin:-85vmax 0 0 -85vmax; border-radius:50%; z-index:0; backface-visibility:hidden; contain:strict; pointer-events:none; background:conic-gradient(from 90deg, hsl(var(--ah) calc(80% * var(--asf)) 60% / 0) 0 78%, hsl(var(--ah) calc(80% * var(--asf)) 60% / 0.20) 97%, hsl(var(--ah) calc(100% * var(--asf)) 79% / 0.42) 100%); animation:radarSpin 8.3776s linear infinite; will-change:transform; }
  @keyframes radarSpin { to { transform:rotate(360deg); } } body.dq-live #radar-sweep, body.fs-on #radar-sweep { display:none; }
  html[data-bg="blue"] #radar-sweep { filter:hue-rotate(62deg); } html[data-bg="violet"] #radar-sweep { filter:hue-rotate(118deg); } html[data-bg="amber"] #radar-sweep { filter:hue-rotate(-118deg); } html[data-bg="mono"] #radar-sweep { filter:grayscale(1) brightness(1.15); }
  @media (prefers-reduced-motion: reduce) { #radar-sweep { animation:none; transform:rotate(52deg); } }
  .dc-fin { display:flex; align-items:center; gap:16px; max-width:560px; margin:16px auto; padding:18px 20px; border-radius:22px; background:linear-gradient(135deg,hsla(203,85%,62%,0.16),hsla(143,62%,62%,0.16)); box-shadow:var(--d-sh); text-align:left; } .dc-fin > i { flex:none; width:54px; height:54px; border-radius:50%; background:var(--d-grad); color:var(--ac-ink); font-style:normal; font-size:26px; font-weight:800; display:flex; align-items:center; justify-content:center; } .dc-fin b { display:block; font-family:var(--display); font-size:19px; } .dc-fin span { display:block; font-size:14.5px; color:var(--text-dim); } .dc-fin strong { color:var(--green); } .dc-fin small { display:block; margin-top:4px; font-size:12.5px; color:var(--text-dim); } .dc-fin u { text-decoration:none; font-family:var(--mono); font-weight:800; color:var(--text); }
  /* ===== v5.2: MOD 07 – 12, spoločná karta otázky ===== */
  body.gq-on .controls-right { display:none; } .gq { max-width:760px; margin:0 auto; display:flex; flex-direction:column; gap:12px; text-align:center; animation:pfIn 0.25s ease; }
  .gq-cat { font-family:var(--mono); font-size:11px; font-weight:800; letter-spacing:0.18em; color:var(--green); } .gq-cat b { color:hsl(37,88%,73%); }
  .gq-big { align-self:center; max-width:100%; padding:14px 22px; border-radius:20px; background:rgba(255,255,255,0.07); box-shadow:var(--d-sh); font-family:var(--display); font-weight:800; font-size:clamp(26px,5vw,44px); line-height:1.15; color:var(--text); overflow-wrap:anywhere; }
  .gq-big.mono { font-family:var(--mono); font-size:clamp(14px,2.3vw,19px); font-weight:700; letter-spacing:0.02em; line-height:1.6; text-align:left; background:hsl(var(--ah) calc(48% * var(--asf)) 8%); color:hsl(var(--ah) calc(75% * var(--asf)) 57%); box-shadow:0 12px 28px hsl(var(--ah) calc(46% * var(--asf)) 5% / 0.3); }
  .gq-q { margin:2px 0 0; font-family:var(--display); font-size:clamp(19px,2.8vw,25px); line-height:1.25; font-weight:800; color:var(--text); } .gq-sub { margin:0; font-size:15px; color:var(--text-dim); } .gq-hint { margin:0; font-size:12.5px; color:var(--text-faint); }
  .gq-img { align-self:center; width:min(520px,100%); aspect-ratio:16 / 10; border-radius:22px; overflow:hidden; background:hsla(150,19%,62%,0.16); box-shadow:var(--d-sh2); display:flex; align-items:center; justify-content:center; color:var(--text-dim); font-size:13px; } .gq-img img { width:100%; height:100%; object-fit:cover; }
  .gq-opts { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:4px; counter-reset:opt; } .gq-opts .choice-btn { min-height:58px; padding:14px 16px; font-size:15.5px; line-height:1.3; white-space:normal; letter-spacing:0; } .gq-opts .choice-btn.gone { opacity:0.45; } .gq-opts .choice-btn:disabled { cursor:default; transform:none; } .gq-opts .choice-btn::before { top:50%; transform:translateY(-50%); }
  .gq-exp { display:flex; flex-direction:column; gap:4px; padding:14px 18px; border-radius:18px; text-align:left; animation:pfIn 0.25s ease; } .gq-exp.ok { background:hsla(146,60%,62%,0.16); color:hsl(153,83%,80%); } .gq-exp.no { background:hsla(9,85%,62%,0.16); color:hsl(5,71%,73%); } .gq-exp b { font-size:15.5px; } .gq-exp span { font-size:14px; line-height:1.5; color:hsl(215,22%,82%); }
  .gq-act { display:flex; align-items:center; justify-content:center; gap:12px; } .gq-act .btn { height:50px; padding:0 28px; font-size:14px; } .gq-act small { font-size:12px; color:var(--text-faint); }
  @media (max-width:640px) { .gq-opts { grid-template-columns:1fr; } .gq-opts.n2 { grid-template-columns:1fr; } .gq-act small { display:none; } .gq-act .btn { width:100%; } }
  /* ===== v5.3: písacie odpovede v MOD 07 – 12 ===== */
  .gq-in { display:flex; align-items:center; gap:10px; max-width:560px; width:100%; margin:6px auto 0; } .gq-in input { flex:1; min-width:0; height:58px; padding:0 22px; border:none; border-radius:999px; background:rgba(255,255,255,0.07); box-shadow:inset 0 0 0 2px rgba(255,255,255,0.16), var(--d-sh); font-family:var(--mono); font-size:20px; font-weight:800; letter-spacing:0.04em; text-align:center; text-transform:uppercase; color:var(--text); outline:none; transition:box-shadow 0.16s; }
  .gq-in input:focus { box-shadow:inset 0 0 0 2.5px var(--green-strong), 0 0 0 5px hsl(var(--ah) calc(88% * var(--asf)) 33% / 0.14); } .gq-in input::placeholder { font-family:var(--ui); font-size:14px; font-weight:600; letter-spacing:0; text-transform:none; color:var(--text-faint); } .gq-in u { text-decoration:none; font-family:var(--mono); font-weight:800; color:var(--text-dim); white-space:nowrap; } .gq-in .btn { height:58px; padding:0 24px; white-space:nowrap; }
  .gq-typed { align-self:center; display:flex; flex-direction:column; gap:2px; padding:12px 26px; border-radius:20px; background:rgba(255,255,255,0.07); box-shadow:var(--d-sh); } .gq-typed small { font-family:var(--mono); font-size:10px; font-weight:800; letter-spacing:0.16em; color:var(--text-faint); } .gq-typed b { font-family:var(--mono); font-size:22px; text-transform:uppercase; } .gq-typed.ok b { color:hsl(153,85%,78%); } .gq-typed.no b { color:hsl(5,64%,72%); text-decoration:line-through; }
  @media (max-width:640px) { .gq-in { flex-wrap:wrap; } .gq-in input { flex:1 1 60%; } .gq-in .btn { flex:1 1 100%; } }
  .au-go.busy { opacity:0.7; pointer-events:none; } .au-go.busy::after { content:' …'; }
    /* nahlásenie otázky */
  #qr-wrap { position:fixed; inset:0; z-index:420; display:flex; align-items:center; justify-content:center; padding:14px; background:hsl(var(--ah) calc(50% * var(--asf)) 5% / 0.72); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); animation:hpFade 0.2s ease; }
  .qr { width:min(460px,100%); padding:20px 20px 18px; border-radius:24px; background:rgba(255,255,255,0.07); box-shadow:0 30px 80px rgba(0,0,0,0.5); }
  .qr-top { display:flex; align-items:center; justify-content:space-between; gap:10px; } .qr-top b { font-family:var(--display); font-size:20px; font-weight:800; color:var(--text); }
  .qr-top button { width:34px; height:34px; border-radius:99px; border:none; background:hsla(144,17%,62%,0.16); color:var(--text-dim); font-weight:800; cursor:pointer; }
  .qr-q { margin:10px 0 14px; padding:9px 12px; border-radius:12px; background:hsla(150,18%,62%,0.16); font-size:13px; line-height:1.45; color:var(--text-dim); overflow-wrap:anywhere; }
  .qr-chips { display:flex; flex-wrap:wrap; gap:8px; } .qr-chips button { padding:11px 16px; border:none; border-radius:99px; background:hsla(142,31%,62%,0.16); color:hsl(151,44%,81%); font-family:var(--ui); font-weight:800; font-size:14px; cursor:pointer; box-shadow:0 2px 6px hsl(var(--ah) calc(56% * var(--asf)) 18% / 0.1); transition:transform .12s, background .12s; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .qr-chips button:hover { background:hsla(146,43%,62%,0.16); transform:translateY(-1px); } }
  .qr-note { display:none; flex-direction:column; gap:10px; } .qr-note.on { display:flex; } .qr-note textarea { width:100%; min-height:84px; border:none; border-radius:14px; background:hsla(150,18%,62%,0.16); padding:12px 14px; font-family:var(--ui); font-size:14px; resize:vertical; box-sizing:border-box; } .qr-note .btn { align-self:flex-end; }
  /* v5.6 — kto na koho útočí, zmena odpovede, odmeny za úrovne */
  .dq-vsx { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:14px; width:100%; margin:8px 0 4px; }
  .vs-side { display:flex; flex-direction:column; gap:3px; min-width:0; } .vs-side.def { align-items:flex-end; text-align:right; animation:vsInL 0.55s var(--spring-soft) both; } .vs-side.att { align-items:flex-start; animation:vsInR 0.55s var(--spring-soft) both; }
  .vs-side small { font-family:var(--mono); font-size:10.5px; font-weight:800; letter-spacing:0.22em; color:var(--c); filter:brightness(1.25); } .vs-side.free small { color:#9fb5a9; }
  .vs-who { display:flex; align-items:center; gap:10px; min-width:0; max-width:100%; } .vs-side.def .vs-who { flex-direction:row-reverse; }
  .vs-who i { flex:none; width:38px; height:38px; border-radius:50%; background:var(--c); box-shadow:0 0 18px var(--c); display:flex; align-items:center; justify-content:center; font-style:normal; font-size:19px; line-height:1; } .vs-side.free .vs-who i { background:#3a3a46; box-shadow:none; }
  .vs-who strong { font-family:var(--display); font-weight:800; font-size:24px; line-height:1.05; color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
  .dq-vsx u { text-decoration:none; font-family:var(--display); font-weight:900; font-size:46px; line-height:1; color:#ffd34d; text-shadow:0 0 22px rgba(255,211,77,0.7), 0 3px 0 rgba(0,0,0,0.5); animation:vsPop 0.7s var(--spring-strong) 0.2s both, vsPulse 1.4s ease-in-out 0.9s infinite; }
  .dq-vsx.big { gap:16px; margin:10px 0 6px; } .dq-vsx.big .vs-who strong { font-size:27px; } .dq-vsx.big .vs-who i { width:48px; height:48px; font-size:24px; } .dq-vsx.big u { font-size:68px; } .dq-vsx.big .vs-side small { font-size:12px; }
  .dq-toast-in.vs { width:min(820px, 94vw); padding:14px 30px 16px; }
  @keyframes vsInL { from { transform:translateX(-90px); opacity:0; } } @keyframes vsInR { from { transform:translateX(90px); opacity:0; } }
  @keyframes vsPop { from { transform:scale(3.4) rotate(-12deg); opacity:0; } } @keyframes vsPulse { 50% { transform:scale(1.14); text-shadow:0 0 34px rgba(255,211,77,0.95), 0 3px 0 rgba(0,0,0,0.5); } }
  .dq-pop .dq-vsx { margin:10px 0 2px; padding:8px 12px; border-radius:16px; background:rgba(255,255,255,0.05); } .dq-pop .dq-vsx u { font-size:34px; } .dq-pop .dq-vsx .vs-who strong { font-size:20px; } .dq-pop .dq-vsx .vs-who i { width:30px; height:30px; font-size:15px; }
  .dq-chg { margin:12px 0 0; padding:9px 14px; border-radius:99px; background:rgba(255,211,77,0.16); color:#ffe38a; font-size:13.5px; text-align:center; font-weight:700; } .dq-chg b { color:#fff; letter-spacing:0.06em; } .dq-chg.soft { background:rgba(255,255,255,0.07); color:#a9c7b8; font-weight:600; }
  .lv-leg { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:12px; } .lv-leg > div { padding:9px 12px; border-radius:14px; display:flex; flex-direction:column; gap:2px; } .lv-leg b { font-size:13px; letter-spacing:0.04em; } .lv-leg span { font-size:11.5px; line-height:1.35; }
  .lv-leg .once { background:hsla(44,85%,62%,0.16); color:hsl(40,88%,79%); } .lv-leg .perm { background:hsla(149,56%,62%,0.16); color:hsl(153,83%,80%); }
  .lv-row.rw { align-items:flex-start; box-shadow:inset 4px 0 0 #ffbe0b; } .lv-row.rw > u { padding-top:8px; }
  .lv-rw { margin:8px 0 2px; padding:8px 11px; border-radius:12px; display:flex; flex-direction:column; gap:1px; font-size:14px; font-weight:800; line-height:1.2; } .lv-rw b { font-family:var(--mono); font-size:10px; letter-spacing:0.14em; } .lv-rw small { font-size:11.5px; font-weight:600; opacity:0.85; }
  .lv-rw.once { background:hsla(45,85%,62%,0.16); color:hsl(39,88%,81%); } .lv-rw.perm { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:hsl(154,67%,88%); background-image:linear-gradient(135deg,hsl(var(--ah) calc(75% * var(--asf)) 57%),hsl(var(--ah) calc(83% * var(--asf)) 42%)); box-shadow:0 6px 16px hsl(var(--ah) calc(83% * var(--asf)) 42% / 0.35); }
  .lv-row.lock .lv-rw { opacity:0.8; } .lv-row.cur .lv-rw.once { background:#ffe58a; }
  @media (max-width:760px) { .vs-who strong { font-size:16px; } .dq-vsx.big .vs-who strong { font-size:19px; } .dq-vsx.big u { font-size:40px; } .dq-vsx u { font-size:30px; } .dq-vsx { gap:8px; } .vs-who i, .dq-vsx.big .vs-who i { width:28px; height:28px; font-size:14px; } .vs-side small { font-size:9px; letter-spacing:0.14em; } .lv-leg { grid-template-columns:1fr; } }
  /* v5.7 — rámčeky profilovky, farby mien, tituly, zamknuté voľby */
  .pf-av.fr1 { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 4px #6f7bff; } .pf-av.fr2 { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 4px #a05cff; } .pf-av.fr4 { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 4px #ff8a1f, 0 0 10px #ff8a1f; }
  .pf-av.fr5 { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 4px #ff6b6b, 0 0 12px #ff6b6b; } .pf-av.fr6 { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 4px #d9b3ff, 0 0 14px #c58cff; }
  .pf-av.fr3 { animation:frRadar 2.4s ease-in-out infinite; } .pf-av.fr7 { animation:frGold 2s ease-in-out infinite; } .pf-av.fr8 { animation:frPlat 1.8s ease-in-out infinite; } .pf-av.fr9 { animation:frLeg 1.6s ease-in-out infinite; }
  @keyframes frRadar { 50% { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 4px #ff4fa3, 0 0 16px #ff4fa3; } 0%, 100% { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 4px #c2185b; } }
  @keyframes frGold { 50% { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 5px #ffb347, 0 0 20px #ff8a1f; } 0%, 100% { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 4px #e8590c; } }
  @keyframes frPlat { 50% { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 5px #ff8fd0, 0 0 22px #f72585; } 0%, 100% { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 4px #b5179e; } }
  @keyframes frLeg { 0% { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 5px #ff595e, 0 0 20px #ff595e; } 33% { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 5px #ffca3a, 0 0 20px #ffca3a; } 66% { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 5px #4cc9f0, 0 0 20px #4cc9f0; } 100% { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 5px #ff595e, 0 0 20px #ff595e; } }
  .nm.nc1 { color:#d3dbe0; } .nm.nc2 { color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .nm.nc3 { color:#ff9f1c; } .nm.nc4 { color:#ffd34d; text-shadow:0 0 10px rgba(255,211,77,0.5); }
  .nm.nc5 { background:linear-gradient(90deg,hsl(var(--ah) calc(75% * var(--asf)) 57%),#4cc9f0); -webkit-background-clip:text; background-clip:text; color:transparent; } .nm.nc6 { background:linear-gradient(90deg,#ff595e,#ffca3a,#8ac926,#4cc9f0,#c77dff); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .nm.nc7 { background:linear-gradient(90deg,rgba(255,255,255,0.07),#ffd34d,rgba(255,255,255,0.07),#4cc9f0,rgba(255,255,255,0.07)); background-size:200% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:ncShine 2.4s linear infinite; } @keyframes ncShine { to { background-position:-200% 0; } }
  .nm-tt { display:inline-block; font-style:normal; font-family:var(--mono); font-size:0.5em; font-weight:800; letter-spacing:0.12em; text-transform:uppercase; padding:2px 7px; margin-right:7px; border-radius:99px; background:rgba(255,211,77,0.18); color:#ffd34d; vertical-align:middle; }
  .dq-sw.lock, .dq-ic.lock, .pf-emo button.lock { opacity:0.35; cursor:not-allowed; } .pf-cemo { display:flex; gap:8px; margin-top:8px; } .pf-cemo input { flex:1; min-width:0; padding:8px 14px; border:none; border-radius:99px; background:hsla(144,17%,62%,0.16); font-size:16px; } .pf-cemo-n { display:block; margin-top:8px; color:var(--text-dim); font-size:12px; }
  /* v5.8 — okno „odomkol si“ a karta Moje odmeny */
  #ru-wrap { position:fixed; inset:0; z-index:430; display:flex; align-items:center; justify-content:center; padding:14px; background:hsl(var(--ah) calc(50% * var(--asf)) 5% / 0.78); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); animation:hpFade 0.2s ease; }
  .ru { width:min(460px,100%); max-height:92vh; display:flex; flex-direction:column; border-radius:26px; overflow:hidden; background:rgba(255,255,255,0.07); box-shadow:0 30px 90px rgba(0,0,0,0.55); animation:ruIn 0.45s var(--spring) both; }
  @keyframes ruIn { from { transform:translateY(30px) scale(0.92); opacity:0; } }
  .ru-top { display:flex; flex-direction:column; align-items:center; gap:2px; padding:22px 20px 18px; color:var(--ac-ink); background:linear-gradient(135deg,hsl(var(--ah) calc(39% * var(--asf)) 10%) 0%,hsl(var(--ah) calc(61% * var(--asf)) 23%) 60%,hsl(var(--ah) calc(83% * var(--asf)) 42%) 100%); text-align:center; }
  .ru-top small { font-family:var(--mono); font-size:11px; font-weight:800; letter-spacing:0.22em; color:hsl(var(--ah) calc(78% * var(--asf)) 79%); } .ru-top strong { font-family:var(--display); font-size:54px; line-height:1; font-weight:900; text-shadow:0 4px 0 rgba(0,0,0,0.25); animation:ruNum 0.7s var(--spring-strong) 0.2s both; } .ru-top b { font-size:16px; }
  @keyframes ruNum { from { transform:scale(0.3); opacity:0; } }
  .ru-list { padding:14px 18px 4px; overflow:auto; display:flex; flex-direction:column; gap:10px; } .ru-lv em { display:block; font-style:normal; font-family:var(--mono); font-size:11px; font-weight:800; letter-spacing:0.12em; color:hsl(215,22%,73%); margin:4px 0 2px; } .ru-none { margin:0; padding:10px 12px; border-radius:12px; background:hsla(150,18%,62%,0.16); color:hsl(215,22%,73%); font-size:13.5px; }
  .ru-lv .lv-rw { animation:ruIn 0.4s ease both; } .ru-act { padding:12px 18px 18px; display:flex; justify-content:center; } .ru-act .btn { min-width:180px; }
  .pf-rw { margin:14px 0; padding:16px 18px; border-radius:22px; background:rgba(255,255,255,0.07); box-shadow:0 8px 26px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.1); }
  .pf-rw-h { display:flex; align-items:baseline; justify-content:space-between; gap:10px; } .pf-rw-h h3 { margin:0; font-family:var(--display); font-size:18px; font-weight:800; letter-spacing:0.02em; } .pf-rw-h span { font-size:13px; color:var(--text-dim); font-weight:700; }
  .pf-rw-bar { display:block; height:9px; border-radius:99px; background:hsla(147,19%,62%,0.16); margin:10px 0 12px; overflow:hidden; } .pf-rw-bar em { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,hsl(var(--ah) calc(75% * var(--asf)) 57%),hsl(var(--ah) calc(83% * var(--asf)) 42%)); }
  .pf-rw-c { display:grid; grid-template-columns:1fr 1fr; gap:10px; } .pf-rw-c > div { display:flex; align-items:center; gap:12px; padding:10px 14px; border-radius:16px; } .pf-rw-c b { font-family:var(--display); font-size:30px; line-height:1; } .pf-rw-c span { font-size:13px; font-weight:700; line-height:1.25; } .pf-rw-c small { font-weight:600; opacity:0.75; }
  .pf-rw-c .once { background:hsla(45,85%,62%,0.16); color:hsl(39,88%,81%); } .pf-rw-c .perm { background:hsla(149,56%,62%,0.16); color:hsl(153,83%,80%); }
  .pf-rw-n { margin-top:12px; } .pf-rw-n > small { display:block; font-family:var(--mono); font-size:10.5px; font-weight:800; letter-spacing:0.1em; color:var(--text-dim); margin-bottom:4px; } .pf-rw .btn { margin-top:12px; width:100%; }
  @media (max-width:760px) { .pf-rw-c { grid-template-columns:1fr; } }
  /* v5.9 — nové pozadia, stopy lietadla, zamknuté tlačidlá */
  html[data-bg="ocean"] #radar-bg, html[data-bg="ocean"] #radar-sweep { filter:hue-rotate(80deg); } html[data-bg="ocean"], html[data-bg="ocean"] body { background:#04141a; }
  html[data-bg="rose"] #radar-bg, html[data-bg="rose"] #radar-sweep { filter:hue-rotate(205deg); } html[data-bg="rose"], html[data-bg="rose"] body { background:#14070e; }
  html[data-bg="gold"] #radar-bg, html[data-bg="gold"] #radar-sweep { filter:hue-rotate(-95deg) saturate(1.2); } html[data-bg="gold"], html[data-bg="gold"] body { background:#141005; }
  html[data-bg="night"] #radar-bg, html[data-bg="night"] #radar-sweep { filter:hue-rotate(75deg) brightness(0.65) saturate(0.7); } html[data-bg="night"], html[data-bg="night"] body { background:#05060d; }
  html[data-bg="forest"] #radar-bg, html[data-bg="forest"] #radar-sweep { filter:hue-rotate(-28deg) brightness(0.85); } html[data-bg="forest"], html[data-bg="forest"] body { background:hsl(var(--ah) calc(57% * var(--asf)) 5%); }
  html[data-bg="ice"] #radar-bg, html[data-bg="ice"] #radar-sweep { filter:hue-rotate(55deg) brightness(1.15) saturate(0.6); } html[data-bg="ice"], html[data-bg="ice"] body { background:#07141a; }
  html[data-bg="lava"] #radar-bg, html[data-bg="lava"] #radar-sweep { filter:hue-rotate(-150deg) saturate(1.4); } html[data-bg="lava"], html[data-bg="lava"] body { background:#170706; }
  html[data-bg="ametyst"] #radar-bg, html[data-bg="ametyst"] #radar-sweep { filter:hue-rotate(150deg) saturate(1.2); } html[data-bg="ametyst"], html[data-bg="ametyst"] body { background:#0e0617; }
  html[data-bg="carbon"] #radar-bg, html[data-bg="carbon"] #radar-sweep { filter:grayscale(1) brightness(0.6); } html[data-bg="carbon"], html[data-bg="carbon"] body { background:#0a0a0b; }
  html[data-bg="neon"] #radar-bg, html[data-bg="neon"] #radar-sweep { filter:hue-rotate(120deg) saturate(1.7); } html[data-bg="neon"], html[data-bg="neon"] body { background:#0b0414; }
  .dq-track.tr1 { stroke-width:3.4; filter:drop-shadow(0 0 7px var(--pc)) drop-shadow(0 0 3px var(--pc)); }
  .dq-track.tr2 { stroke-width:2.6; stroke:#fff; stroke-opacity:1; filter:drop-shadow(0 0 9px var(--pc)) drop-shadow(0 0 4px var(--pc)) drop-shadow(0 0 2px #fff); }
  .dq-track.tr3 { stroke-width:3.6; stroke:#ffd34d; stroke-opacity:1; filter:drop-shadow(0 0 10px #ffbe0b) drop-shadow(0 0 4px var(--pc)); }
  .pf-bg.lock, .rk-chip.lock { opacity:0.4; cursor:not-allowed; }
  /* v6.0 — zásoba tokenov */
  .pf-bst { margin:14px 0 0; padding:16px 18px; border-radius:22px; background:hsl(var(--ah) calc(39% * var(--asf)) 10%); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); box-shadow:0 8px 26px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.2); } .pf-bst .pf-rw-h h3 { color:#fff; } .pf-bst .pf-rw-h span { color:#9fc4b2; }
  .bst-g { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:12px; } .bst-t { padding:12px 10px; border-radius:16px; background:rgba(255,255,255,0.06); text-align:center; opacity:0.55; } .bst-t.has { opacity:1; background:linear-gradient(135deg,hsl(var(--ah) calc(61% * var(--asf)) 23%),hsl(var(--ah) calc(83% * var(--asf)) 42%)); color:hsl(154,67%,88%); box-shadow:0 6px 16px hsl(var(--ah) calc(83% * var(--asf)) 42% / 0.3); }
  .bst-t b { display:block; font-family:var(--display); font-size:34px; line-height:1; } .bst-t span { display:block; margin-top:6px; font-weight:800; font-size:13.5px; } .bst-t small { display:block; font-weight:600; font-size:10.5px; opacity:0.75; margin-top:2px; }
  .bst-n { margin:12px 0 0; font-size:13px; line-height:1.5; color:#a9c7b8; } .bst-n b { color:#fff; }
  .bst-p { margin-top:12px; display:flex; flex-wrap:wrap; gap:6px; align-items:center; } .bst-p small { width:100%; font-family:var(--mono); font-size:10px; letter-spacing:0.14em; color:#9fc4b2; } .bst-p span { padding:5px 11px; border-radius:99px; background:rgba(255,211,77,0.16); color:#ffe38a; font-size:12.5px; font-weight:700; }
  .lv-rw.stock { background:hsla(211,85%,62%,0.16); color:hsl(209,77%,80%); padding:6px 11px; font-size:13px; } .lv-rw.stock small { display:none; } .lv-rw.stock b { color:#2b6fd6; }
  @media (max-width:760px) { .bst-g { grid-template-columns:1fr 1fr; } }
  /* v6.1 — pridelené priestory bez bodov */
  .dq-lab .p.gift { fill:#8d939c !important; text-decoration:line-through; opacity:0.85; } .dq-info small.gift { color:#ffd34d; flex-basis:100%; }
  /* v6.1 — otvorené miestnosti, názov miestnosti, diváci */
  .dqh-rooms { margin:16px 0 6px; padding:18px 20px 20px; border-radius:26px; background:linear-gradient(160deg,hsl(var(--ah) calc(37% * var(--asf)) 7%) 0%,hsl(var(--ah) calc(47% * var(--asf)) 11%) 55%,hsl(var(--ah) calc(53% * var(--asf)) 15%) 100%); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); box-shadow:0 16px 44px hsl(var(--ah) calc(67% * var(--asf)) 9% / 0.28); }
  .dqr-h { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:14px; } .dqr-h h3 { margin:2px 0 0; font-family:var(--display); font-size:24px; font-weight:800; color:#fff; letter-spacing:-0.01em; }
  .dqr-h small { display:flex; align-items:center; gap:7px; font-family:var(--mono); font-size:10.5px; font-weight:800; letter-spacing:0.2em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .dqr-h small i { width:8px; height:8px; border-radius:50%; background:hsl(var(--ah) calc(75% * var(--asf)) 57%); box-shadow:0 0 0 0 hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.7); animation:dqrPulse 1.6s ease-out infinite; }
  @keyframes dqrPulse { to { box-shadow:0 0 0 10px hsl(var(--ah) calc(75% * var(--asf)) 57% / 0); } } .dqr-h > span { font-size:13px; font-weight:700; color:#9fc4b2; }
  .dqr-g { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:12px; }
  .dqr-c { display:flex; flex-direction:column; gap:9px; padding:15px 16px 14px; border-radius:20px; background:rgba(255,255,255,0.06); box-shadow:inset 0 1px 0 rgba(255,255,255,0.08); animation:modsCard 0.4s ease both; transition:transform 0.16s, background 0.16s; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dqr-c:hover { transform:translateY(-3px); background:rgba(255,255,255,0.1); } } .dqr-c.open { box-shadow:inset 0 0 0 2px hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.55), 0 8px 22px hsl(var(--ah) calc(83% * var(--asf)) 42% / 0.16); }
  .dqr-t { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; } .dqr-t b { font-size:17px; font-weight:800; color:#fff; line-height:1.2; overflow-wrap:anywhere; }
  .dqr-t em { flex:none; font-style:normal; font-family:var(--mono); font-size:9.5px; font-weight:800; letter-spacing:0.1em; padding:4px 9px; border-radius:99px; background:hsl(var(--ah) calc(75% * var(--asf)) 57%); color:hsl(var(--ah) calc(67% * var(--asf)) 5%); } .dqr-c.live .dqr-t em { background:#ffbe0b; color:#231700; }
  .dqr-m { display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; font-size:13px; font-weight:600; color:hsl(var(--ah) calc(35% * var(--asf)) 81%); } .dqr-d { display:inline-flex; align-items:center; gap:3px; } .dqr-d i { width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,0.18); } .dqr-d i.on { background:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .dqr-d u { margin-left:5px; text-decoration:none; font-family:var(--mono); font-weight:800; color:#fff; }
  .dqr-i { font-size:12px; color:#9fc4b2; font-family:var(--mono); letter-spacing:0.04em; } .dqr-i b { color:#ffd34d; letter-spacing:0.16em; }
  .dqr-a { display:flex; gap:8px; margin-top:auto; } .dqr-a .btn { flex:1; height:40px; padding:0 12px; font-size:12px; } .dqr-a .btn.ghost { background:rgba(255,255,255,0.1); color:#fff; box-shadow:none; }
  .dqr-e { padding:16px 18px; border-radius:18px; background:rgba(255,255,255,0.05); font-size:14px; line-height:1.5; color:hsl(var(--ah) calc(35% * var(--asf)) 81%); } .dqr-e b { color:#fff; }
  .dqh-watch { margin-top:8px; width:100%; }
  .dq-roomtag { display:flex; flex-wrap:wrap; gap:8px; margin:-4px 0 14px; } .dq-roomtag span { padding:6px 12px; border-radius:99px; background:hsla(144,17%,62%,0.16); font-size:12px; font-weight:700; color:hsl(215,22%,78%); } .dq-roomtag .pu { background:hsla(149,56%,62%,0.16); color:hsl(153,83%,80%); } .dq-roomtag .pr { background:hsla(45,85%,62%,0.16); color:hsl(39,88%,81%); } .dq-roomtag .sp { background:hsl(var(--ah) calc(48% * var(--asf)) 8%); color:#fff; }
  .dq-room { margin:12px 0; padding:14px 16px; border-radius:18px; background:hsla(150,20%,62%,0.16); display:flex; flex-direction:column; gap:9px; } .dq-room strong { font-family:var(--mono); font-size:11px; letter-spacing:0.14em; color:var(--text-dim); }
  .dq-room input { height:46px; padding:0 16px; border:none; border-radius:99px; background:rgba(255,255,255,0.07); font-family:var(--ui); font-size:16px; font-weight:700; box-shadow:0 2px 8px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.08); } .dq-room small { font-size:12px; line-height:1.45; color:var(--text-dim); }
  .dq-specn { align-self:center; font-family:var(--mono); font-size:12px; font-weight:800; color:#ffd34d; padding:0 4px; white-space:nowrap; } .dq-specn:empty { display:none; }
  /* ===== v6.2 — plocha hry ===== */
  /* nič sa neposúva a stránka sa pri ťahaní prstom neobnoví ani nepriblíži */
  html:has(body.dq-live), body.dq-live { overscroll-behavior:none; -webkit-text-size-adjust:100%; }
  #dq-stage { overscroll-behavior:none; touch-action:manipulation; -webkit-touch-callout:none; -webkit-tap-highlight-color:transparent; padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }
  #dq-poph.dq-pop-wrap { overflow:hidden; } .dq-pop.fit { max-height:none; overflow:visible; }
  /* úloha v súboji */
  .dq-role { display:flex; align-items:center; gap:10px; margin:-4px 0 12px; padding:10px 16px; border-radius:16px; color:#fff; animation:roleIn 0.5s var(--spring) both; }
  .dq-role i { font-style:normal; font-size:24px; line-height:1; } .dq-role b { font-family:var(--display); font-weight:900; font-size:21px; letter-spacing:0.04em; white-space:nowrap; } .dq-role span { font-size:13px; font-weight:600; opacity:0.92; line-height:1.3; min-width:0; }
  .dq-role.att { background:linear-gradient(100deg,#e63946,#ff7a45); box-shadow:0 8px 26px rgba(230,57,70,0.45); } .dq-role.def { background:linear-gradient(100deg,#1d6fe0,#4cc9f0); box-shadow:0 8px 26px rgba(58,134,255,0.45); }
  .dq-role.watch { background:rgba(255,255,255,0.09); box-shadow:inset 0 0 0 1.5px rgba(255,255,255,0.22); } .dq-role.watch b { color:#d6efe2; }
  @keyframes roleIn { from { transform:translateY(-12px) scale(0.94); opacity:0; } }
  .dq-pop:has(.dq-role.att) { border-color:#ff6b5e; box-shadow:0 30px 90px rgba(0,0,0,0.65), 0 0 0 2px rgba(255,107,94,0.55), 0 0 70px rgba(230,57,70,0.35); }
  .dq-pop:has(.dq-role.def) { border-color:#4cc9f0; box-shadow:0 30px 90px rgba(0,0,0,0.65), 0 0 0 2px rgba(76,201,240,0.55), 0 0 70px rgba(58,134,255,0.35); }
  .dq-pop:has(.dq-role.watch) { border-color:rgba(255,255,255,0.3); }
  .dq-mapwrap::after { content:''; position:absolute; inset:0; pointer-events:none; z-index:3; opacity:0; transition:opacity 0.4s; }
  #dq-stage[data-role="att"] .dq-mapwrap::after { opacity:1; box-shadow:inset 0 0 0 3px #ff5a4f, inset 0 0 90px rgba(230,57,70,0.4); animation:roleGlow 1.6s ease-in-out infinite; }
  #dq-stage[data-role="def"] .dq-mapwrap::after { opacity:1; box-shadow:inset 0 0 0 3px #4cc9f0, inset 0 0 90px rgba(58,134,255,0.4); animation:roleGlow 1.6s ease-in-out infinite; }
  #dq-stage[data-role="watch"] .dq-mapwrap::after { opacity:1; box-shadow:inset 0 0 0 2px rgba(255,255,255,0.18); }
  @keyframes roleGlow { 50% { opacity:0.55; } }
  .dq-chip .rb { flex:none; font-size:11px; font-weight:800; letter-spacing:0.06em; padding:3px 8px; border-radius:99px; color:#fff; white-space:nowrap; } .dq-chip .rb u { text-decoration:none; color:#fff; font-size:11px; letter-spacing:0.06em; }
  .dq-chip .rb.att { background:#e63946; animation:rbPulse 1.1s ease-in-out infinite; } .dq-chip .rb.def { background:#1d6fe0; } @keyframes rbPulse { 50% { box-shadow:0 0 0 5px rgba(230,57,70,0.25); } }
  /* zameriavacia čiara a kruh obrany na mape */
  .dq-aim { pointer-events:none; } .dq-aim .g { fill:none; stroke:var(--pc); stroke-width:9; stroke-opacity:0.28; stroke-linecap:round; } .dq-aim .l { fill:none; stroke:#fff; stroke-width:2.6; stroke-linecap:round; stroke-dasharray:9 8; animation:aimDash 0.7s linear infinite; filter:drop-shadow(0 0 4px var(--pc)); }
  .dq-aim .hd { fill:#fff; stroke:var(--pc); stroke-width:2; } .dq-aim circle { fill:var(--pc); stroke:#fff; stroke-width:2; } @keyframes aimDash { to { stroke-dashoffset:-17; } }
  .dq-defring { fill:none; stroke:var(--pc); stroke-width:3; stroke-dasharray:4 7; stroke-linecap:round; opacity:0.9; transform-box:fill-box; transform-origin:center; animation:defSpin 9s linear infinite; pointer-events:none; } @keyframes defSpin { to { transform:rotate(360deg); } }
  #dq-stage.dq-low .dq-aim .l, #dq-stage.dq-low .dq-defring, #dq-stage.dq-low .dq-mapwrap::after, #dq-stage.dq-low .dq-role, #dq-stage.dq-low .dq-chip .rb { animation:none !important; }
  /* úvod súboja: dve farebné polovice a VS s výbuchom */
  .dq-toast-in.vs { width:min(900px,95vw); padding:12px 18px 14px; background:rgba(6,6,9,0.96); border-width:0; box-shadow:0 24px 70px rgba(0,0,0,0.75); overflow:hidden; }
  .dq-toast-in.vs > small { font-family:var(--mono); letter-spacing:0.3em; font-weight:800; color:#ffd34d; }
  .dq-vsx.big { gap:0; margin:8px 0 6px; align-items:stretch; position:relative; grid-template-columns:minmax(0,1fr) minmax(0,1fr); } .dq-vsx.big .vs-side { padding:16px 20px; justify-content:center; background:linear-gradient(135deg, color-mix(in srgb, var(--c) 70%, #000) 0%, color-mix(in srgb, var(--c) 22%, #000) 100%); box-shadow:inset 0 0 0 2px var(--c); }
  .dq-vsx.big .vs-side.def { border-radius:20px 0 0 20px; clip-path:polygon(0 0, 100% 0, calc(100% - 26px) 100%, 0 100%); padding-right:44px; } .dq-vsx.big .vs-side.att { border-radius:0 20px 20px 0; clip-path:polygon(26px 0, 100% 0, 100% 100%, 0 100%); padding-left:44px; }
  .dq-vsx.big .vs-side small { color:#fff; opacity:0.92; font-size:12.5px; } .dq-vsx.big .vs-side.free { background:linear-gradient(135deg,#2b2b33,#15151a); box-shadow:inset 0 0 0 2px #55555f; }
  .dq-vsx.big u { position:absolute; left:50%; top:50%; z-index:2; margin:-38px 0 0 -52px; width:104px; height:76px; display:flex; align-items:center; justify-content:center; font-size:62px; animation:vsPop 0.7s var(--spring-strong) 0.25s both, vsPulse 1.4s ease-in-out 1s infinite; }
  .dq-vsx.big u::before { content:''; position:absolute; left:50%; top:50%; width:150px; height:150px; margin:-75px 0 0 -75px; border-radius:50%; z-index:-1; background:radial-gradient(circle, rgba(255,211,77,0.55) 0%, rgba(255,140,43,0.25) 38%, transparent 68%); animation:vsBurst 1.1s ease-out 0.25s both; }
  @keyframes vsBurst { from { transform:scale(0.1); opacity:0; } 40% { opacity:1; } to { transform:scale(1.25); opacity:0.75; } }
  .vs-me { display:inline-block; font-style:normal; margin-left:8px; padding:1px 8px; border-radius:99px; background:rgba(255,255,255,0.07); color:hsl(215,22%,91%); font-size:10px; letter-spacing:0.12em; vertical-align:middle; }
  #dq-stage.dq-low .dq-vsx.big u::before { animation:none; }
  /* telefón na výšku: lišty majú stálu výšku, takže mapa pri zmene textu neskáče */
  @media (max-width:760px) {
    #dq-stage .dq-players { display:grid; grid-template-columns:repeat(var(--pn,2), minmax(0,1fr)); gap:5px; } #dq-stage .dq-chip { min-width:0; overflow:hidden; flex:none; } #dq-stage .dq-chip span { min-width:0; flex:1 1 0; } #dq-stage .dq-chip s, #dq-stage .dq-chip .rb u { display:none; } #dq-stage .dq-chip .rb { padding:2px 6px; }
    #dq-stage .dq-status span { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; line-height:1.3; min-height:2.6em; max-height:2.6em; }
    .dq-role { padding:8px 12px; gap:8px; margin-bottom:9px; } .dq-role b { font-size:17px; } .dq-role i { font-size:19px; } .dq-role span { font-size:11.5px; }
    .dq-vsx.big u { font-size:40px; margin:-26px 0 0 -34px; width:68px; height:52px; } .dq-vsx.big .vs-side { padding:10px 12px; } .dq-vsx.big .vs-side.def { padding-right:30px; clip-path:polygon(0 0, 100% 0, calc(100% - 16px) 100%, 0 100%); } .dq-vsx.big .vs-side.att { padding-left:30px; clip-path:polygon(16px 0, 100% 0, 100% 100%, 0 100%); } .dq-toast-in.vs { padding:8px 10px 10px; }
  }
  @media (max-width:760px) and (orientation:portrait) {
    /* zoznam priestorov na výber leží nad mapou, neuberá jej miesto — mapa pri tvojom ťahu nemení veľkosť */
    #dq-stage #dq-picker.on { position:absolute; left:0; right:0; bottom:env(safe-area-inset-bottom); z-index:6; background:rgba(10,10,12,0.95); box-shadow:0 -10px 30px rgba(0,0,0,0.6); }
  }
  /* telefón na šírku: všetko v jednom riadku hore, mapa cez celú výšku, okno s otázkou vpravo */
  @media (orientation:landscape) and (max-height:540px) {
    #dq-stage .dq-players { display:flex; } #dq-stage .dq-chip .rb u { display:none; } #dq-stage .dq-chip .rb { padding:2px 6px; } #dq-stage .dq-chip s { display:none; }
    #dq-stage .dq-status span { display:block; min-height:0; max-height:none; }
    #dq-stage #dq-poph.dq-pop-wrap { justify-content:flex-end; align-items:center; padding:5px 8px; background:linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.55) 34%, rgba(0,0,0,0.86) 100%); }
    #dq-stage .dq-pop { width:min(56vw,560px); } #dq-stage .dq-pop.end, #dq-stage #dq-poph .dq-pop:has(.dq-podium) { width:min(780px,100%); margin:0 auto; }
    .dq-role { margin:0 0 6px; padding:5px 10px; border-radius:12px; } .dq-role b { font-size:14px; } .dq-role i { font-size:15px; } .dq-role span { font-size:11px; }
    #dq-stage #dq-picker.on { position:absolute; left:0; right:0; bottom:0; z-index:6; background:rgba(10,10,12,0.94); max-height:64px; }
    #dq-toast { top:4px; } .dq-toast-in.vs { width:min(620px,70vw); padding:6px 10px 8px; } .dq-vsx.big .vs-side { padding:7px 12px; } .dq-vsx.big .vs-who strong { font-size:17px; } .dq-vsx.big .vs-who i { width:28px; height:28px; font-size:14px; } .dq-vsx.big u { font-size:34px; margin:-22px 0 0 -30px; width:60px; height:44px; }
  }
  /* v6.3 — písaný rozstrel, modré tokeny zo zásoby */
  .dq-numbox input.txt { width:min(420px,70%); font-size:24px; letter-spacing:0.04em; text-transform:uppercase; } .dq-numbox input.txt::placeholder { text-transform:none; letter-spacing:0; }
  .dq-txtrev { margin-top:14px; display:flex; flex-direction:column; gap:6px; }
  .dq-jk button.st { border-color:#4cc9f0; color:#c9f0ff; background:rgba(76,201,240,0.16); } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-jk button.st:not(:disabled):hover { background:rgba(76,201,240,0.3); } } .dq-jk button.st::before { content:'●'; font-size:8px; margin-right:5px; color:#4cc9f0; vertical-align:middle; }
  .bst-t.has { background:linear-gradient(135deg,#1d5fa8,#4cc9f0); color:#04121c; box-shadow:0 6px 16px rgba(76,201,240,0.3); }
  /* ===== v6.3 — titul, ruleta, zodpovedané otázky, zväčšenie fotky ===== */
  .tt-f { display:inline-flex; align-items:center; margin-left:10px; padding:4px 11px; border-radius:99px; font-style:normal; font-family:var(--mono); font-size:11px; font-weight:800; letter-spacing:0.12em; vertical-align:middle; color:#3a2600; background:linear-gradient(120deg,#ffe58a,#ffbe0b 55%,#ff9f1c); box-shadow:0 4px 14px rgba(255,190,11,0.45), inset 0 1px 0 rgba(255,255,255,0.6); position:relative; overflow:hidden; }
  .tt-f::after { content:''; position:absolute; inset:0; background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,0.7) 50%,transparent 65%); transform:translateX(-120%); animation:ttShine 3.2s ease-in-out infinite; } @keyframes ttShine { 55%, 100% { transform:translateX(120%); } }
  .tt-star { display:inline-block; margin-right:4px; font-style:normal; font-size:0.85em; color:#ffbe0b; text-shadow:0 0 8px rgba(255,190,11,0.7); vertical-align:middle; } .pf-av.tt-fa { box-shadow:0 0 0 2px rgba(255,255,255,0.16), 0 0 0 4px #ffbe0b, 0 0 14px rgba(255,190,11,0.75) !important; }
  #sp-wrap, #hi-wrap { position:fixed; inset:0; z-index:420; display:flex; align-items:center; justify-content:center; padding:14px; background:hsl(var(--ah) calc(50% * var(--asf)) 5% / 0.78); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); animation:hpFade 0.2s ease; }
  .sp { width:min(440px,100%); max-height:96vh; overflow:auto; padding:18px 20px 16px; border-radius:26px; background:linear-gradient(170deg,hsl(var(--ah) calc(39% * var(--asf)) 10%),hsl(var(--ah) calc(35% * var(--asf)) 7%)); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); box-shadow:0 30px 90px rgba(0,0,0,0.6); animation:ruIn 0.4s var(--spring) both; }
  .sp-top { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; } .sp-top small { font-family:var(--mono); font-size:10.5px; letter-spacing:0.2em; font-weight:800; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .sp-top b { display:block; font-family:var(--display); font-size:26px; color:#fff; }
  .sp-top button, .hi-top button { width:36px; height:36px; border-radius:99px; border:none; background:rgba(255,255,255,0.12); color:#fff; font-weight:800; cursor:pointer; flex:none; }
  .sp-wheel { margin:8px auto 4px; width:min(300px,72vw); filter:drop-shadow(0 14px 30px rgba(0,0,0,0.5)); } .sp-svg { display:block; width:100%; height:auto; overflow:visible; } #sp-rot { transform-origin:160px 160px; }
  .sp-svg text { fill:#fff; font-family:var(--display); font-weight:900; font-size:27px; text-anchor:middle; paint-order:stroke; stroke:rgba(0,0,0,0.35); stroke-width:3px; } .sp-svg text.top { font-size:30px; fill:#fff7c2; }
  .sp-svg .rim { fill:none; stroke:#fff; stroke-width:6; } .sp-svg .pin { fill:#fff; } .sp-svg .hub { fill:hsl(var(--ah) calc(35% * var(--asf)) 7%); stroke:#fff; stroke-width:5; } .sp-svg .hubt { font-size:13px; letter-spacing:0.12em; stroke:none; fill:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .sp-svg .ptr { fill:#fff; stroke:hsl(var(--ah) calc(35% * var(--asf)) 7%); stroke-width:3; stroke-linejoin:round; filter:drop-shadow(0 3px 4px rgba(0,0,0,0.5)); }
  .sp-res { min-height:44px; margin-top:8px; text-align:center; font-size:14.5px; line-height:1.45; } .sp-res b { color:#fff; } .sp-win { display:inline-block; font-family:var(--display); font-weight:900; font-size:30px; color:#ffd34d; text-shadow:0 0 22px rgba(255,211,77,0.6); animation:ruNum 0.6s var(--spring-strong) both; } .sp-win.big { font-size:40px; }
  .sp-act { display:flex; justify-content:center; margin-top:8px; } .sp-act .btn { min-width:220px; height:50px; font-size:15px; }
  .sp-odds { margin-top:12px; font-size:12.5px; color:#a9c7b8; } .sp-odds summary { cursor:pointer; font-weight:700; color:hsl(var(--ah) calc(44% * var(--asf)) 89%); } .sp-odds div { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin:8px 0; } .sp-odds span { padding:6px 8px; border-radius:10px; background:rgba(255,255,255,0.07); text-align:center; } .sp-odds b { display:block; color:#fff; } .sp-odds p { margin:0; line-height:1.45; }
  .hh-t.spin.go { box-shadow:0 0 0 2px #ffbe0b, 0 8px 22px rgba(255,190,11,0.3); animation:rbPulse 1.4s ease-in-out infinite; }
  .hi { width:min(980px,100%); max-height:94vh; display:flex; flex-direction:column; border-radius:24px; background:var(--bg, hsla(150,20%,62%,0.16)); box-shadow:0 30px 90px rgba(0,0,0,0.55); overflow:hidden; animation:ruIn 0.35s ease both; }
  .hi-top { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 18px; background:hsl(var(--ah) calc(39% * var(--asf)) 10%); color:#fff; } .hi-top small { display:block; font-family:var(--mono); font-size:10px; letter-spacing:0.16em; color:#9fc4b2; } .hi-top b { font-family:var(--display); font-size:20px; } .hi-top em { margin-left:8px; font-style:normal; font-size:12px; padding:3px 10px; border-radius:99px; vertical-align:middle; } .hi-top em.ok { background:#12c274; color:hsl(154,67%,88%); } .hi-top em.no { background:#e4572e; color:#fff; }
  .hi-body { overflow:auto; padding:14px; } .hi-card { pointer-events:none; user-select:text; -webkit-user-select:text; margin:0; } .hi-card button, .hi-card input { opacity:1 !important; }
  .hi-act { display:flex; flex-wrap:wrap; gap:8px; padding:10px 14px 0; justify-content:center; } .hi-act .btn { height:42px; padding:0 16px; font-size:12px; } .hi-note { margin:8px 14px 12px; text-align:center; font-size:12px; color:var(--text-dim); }
  #btn-hist u { text-decoration:none; display:inline-block; min-width:18px; padding:1px 6px; border-radius:99px; background:var(--green-bg, hsla(149,56%,62%,0.16)); color:var(--green, hsl(var(--ah) calc(85% * var(--asf)) 26%)); font-size:10.5px; }
  .aircraft-photo img, .gq-img img, .dq-pop-img img, .cs-photo img { cursor:zoom-in; } .cmp-card:not(.done) .aircraft-photo img { cursor:pointer; }
  .zm-b { position:absolute; right:14px; top:14px; z-index:2; width:36px; height:36px; display:flex; align-items:center; justify-content:center; border-radius:99px; background:hsl(var(--ah) calc(47% * var(--asf)) 6% / 0.82); color:#fff; font-size:16px; box-shadow:0 4px 12px rgba(0,0,0,0.35); cursor:zoom-in; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .zm-b:hover { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); } }
  #zm-wrap { position:fixed; inset:0; z-index:700; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,0.92); touch-action:none; overflow:hidden; animation:hpFade 0.18s ease; cursor:zoom-out; }
  #zm-img { max-width:96vw; max-height:88vh; object-fit:contain; border-radius:10px; user-select:none; -webkit-user-drag:none; cursor:grab; transition:transform 0.08s linear; will-change:transform; }
  .zm-bar { position:absolute; left:50%; bottom:calc(14px + env(safe-area-inset-bottom)); transform:translateX(-50%); display:flex; gap:8px; } .zm-bar button { height:44px; min-width:44px; padding:0 16px; border-radius:99px; border:none; background:rgba(255,255,255,0.16); color:#fff; font-family:var(--ui); font-weight:800; font-size:14px; cursor:pointer; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .zm-bar button:hover { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); } }
  .zm-tip { position:absolute; left:0; right:0; top:calc(10px + env(safe-area-inset-top)); text-align:center; color:rgba(255,255,255,0.6); font-size:12px; pointer-events:none; }
  .cmp-grid.n4 .aircraft-photo { aspect-ratio:16 / 9; } .cmp-tbl { overflow-x:auto; }
  @media (max-width:760px) { .cmp-grid.n4 { gap:8px; } .zm-tip { font-size:11px; padding:0 10px; } .hi-act .btn { flex:1 1 40%; } .sp-odds div { grid-template-columns:repeat(4,1fr); } }
  /* nízke okno na počítači: okno s otázkou je úspornejšie, aby sa nemuselo veľmi zmenšovať */
  @media (min-width:761px) and (max-height:760px) {
    .dq-pop { padding:14px 22px 12px; } .dq-pop-q { margin-top:8px; font-size:clamp(22px,3.6vw,38px); } .dq-pop-s { margin-top:2px; } .dq-pop .dq-opts { margin-top:9px; gap:7px; } .dq-pop .choice-btn { min-height:46px; padding:8px 10px 8px 30px; }
    .dq-role { margin:-2px 0 8px; padding:7px 14px; } .dq-role b { font-size:17px; } .dq-pop .dq-vsx { margin:6px 0 0; padding:5px 10px; } .dq-pop .dq-vsx u { font-size:26px; } .dq-pop-img { height:min(26vh,190px); margin-top:8px; } .dq-jk { margin-top:8px; } .dq-pop-foot { margin-top:8px; } .dq-chg { margin-top:8px; padding:6px 12px; }
  }
  body.pg-plain .panel-head .stats, body.pg-plain #qcount { display:none !important; }
  /* v6.3 — získané body a séria v hlavičke */
  .stat.pts { position:relative; } .stat.pts .stat-val { color:var(--green); } .stat.pts.bump .stat-val { animation:ptsBump 0.45s var(--spring-strong); } @keyframes ptsBump { 40% { transform:scale(1.45); } }
  .pts-fly { position:absolute; left:50%; top:-4px; transform:translateX(-50%); font-style:normal; font-family:var(--mono); font-weight:800; font-size:13px; color:hsl(153,88%,75%); white-space:nowrap; pointer-events:none; animation:ptsFly 1.25s ease-out forwards; } .pts-fly.fire { color:hsl(28,88%,72%); }
  @keyframes ptsFly { from { opacity:0; transform:translate(-50%, 8px); } 20% { opacity:1; } to { opacity:0; transform:translate(-50%, -26px); } }
  .stat.stk .stat-val { display:inline-flex; align-items:center; gap:4px; } .stat.stk .flame { font-style:normal; display:inline-block; filter:grayscale(1); opacity:0.45; transform-origin:50% 90%; transition:filter 0.3s, opacity 0.3s; }
  .stat.stk.warm .flame { filter:grayscale(0.4); opacity:0.8; animation:flame 1.6s ease-in-out infinite; } .stat.stk.hot .flame { filter:none; opacity:1; animation:flame 0.7s ease-in-out infinite; text-shadow:0 0 12px rgba(255,140,43,0.9); }
  .stat.stk em { font-style:normal; font-family:var(--mono); font-size:10px; font-weight:800; color:var(--text-faint); margin-left:2px; } .stat.stk.hot em { color:hsl(28,88%,72%); padding:1px 6px; border-radius:99px; background:rgba(255,140,43,0.16); }
  @keyframes flame { 0%, 100% { transform:scale(1) rotate(-4deg); } 30% { transform:scale(1.18, 1.28) rotate(3deg); } 60% { transform:scale(0.95, 1.1) rotate(-2deg); } }
  .soc-toast.k-pos { border-color:#3a86ff; cursor:pointer; } .soc-toast.k-pos small { color:#7fb6ff; }
  @media (prefers-reduced-motion: reduce) { .stat.stk .flame, .pts-fly, .stat.pts.bump .stat-val { animation:none !important; } }
  /* ===== v6.4 — DNES, úspechy, profil, šírka ===== */
  .dyt { margin:14px 0 0; padding:16px 18px; border-radius:22px; background:rgba(255,255,255,0.07); box-shadow:0 8px 26px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.1); } #home-wkt { animation:fadeUp 0.35s ease both; }
  .dyt-m { margin:10px 0 12px; } .dyt-mt { font-size:14px; color:var(--text-dim); } .dyt-mt b { font-family:var(--display); font-size:22px; color:var(--text); } .dyt-mt em { font-style:normal; font-weight:800; color:hsl(153,88%,75%); }
  .dyt-bar { position:relative; height:14px; margin:12px 0 30px; border-radius:99px; background:hsla(147,19%,62%,0.16); } .dyt-bar > i { position:absolute; left:0; top:0; bottom:0; border-radius:99px; background:linear-gradient(90deg,hsl(var(--ah) calc(75% * var(--asf)) 57%),hsl(var(--ah) calc(83% * var(--asf)) 42%)); transition:width 0.6s var(--ease-out); }
  .dyt-bar u { position:absolute; top:-4px; width:22px; height:22px; margin-left:-11px; border-radius:50%; background:rgba(255,255,255,0.07); box-shadow:0 0 0 3px rgba(255,255,255,0.16); text-decoration:none; } .dyt-bar u.ok { background:#12c274; box-shadow:0 0 0 3px #0a9d5c, 0 0 12px rgba(18,194,116,0.6); }
  .dyt-bar u b { position:absolute; left:50%; top:26px; transform:translateX(-50%); font-family:var(--mono); font-size:11px; color:var(--text); } .dyt-bar u small { position:absolute; left:50%; top:-18px; transform:translateX(-50%); font-family:var(--mono); font-size:10px; font-weight:800; color:hsl(153,88%,75%); white-space:nowrap; }
  .dyt-bar u:last-child { margin-left:-22px; } .wkt-g.two { grid-template-columns:1fr 1fr; } .wkt-g u.w { color:var(--text-faint); } .wkt-g .btn.ghost { height:36px; padding:0 12px; font-size:11px; }
  .choice-btn.gone { visibility:hidden; pointer-events:none; }
  .pf-achd { margin-top:10px; } .pf-achd > summary { list-style:none; cursor:pointer; display:flex; justify-content:center; padding:11px 16px; border-radius:99px; background:rgba(255,255,255,0.07); font-weight:800; font-size:12.5px; letter-spacing:0.06em; color:var(--green); box-shadow:0 2px 8px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.1); } .pf-achd > summary::-webkit-details-marker { display:none; }
  .pf-achd > summary .c, .pf-achd[open] > summary .o { display:none; } .pf-achd[open] > summary .c { display:inline; } .pf-achd[open] > summary { margin-bottom:12px; }
  .pf-rw { animation:modsCard 0.4s ease both; } .pf-rw-top { display:flex; align-items:center; gap:16px; margin-bottom:12px; } .pf-rw-tt h3 { margin:0; font-family:var(--display); font-size:20px; font-weight:800; } .pf-rw-tt p { margin:3px 0 0; font-size:13px; color:var(--text-dim); }
  .pf-ring { flex:none; width:78px; height:78px; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; background:radial-gradient(closest-side, rgba(255,255,255,0.07) 76%, transparent 78% 100%), conic-gradient(hsl(var(--ah) calc(83% * var(--asf)) 42%) calc(var(--p) * 1%), hsla(147,19%,62%,0.16) 0); animation:ringIn 0.9s var(--ease-out) both; }
  .pf-ring b { font-family:var(--display); font-size:24px; line-height:1; } .pf-ring small { font-size:10.5px; color:var(--text-dim); font-weight:700; } @keyframes ringIn { from { transform:scale(0.6) rotate(-90deg); opacity:0; } }
  .pf-rw-c > button { border:none; cursor:pointer; text-align:left; font-family:var(--ui); display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:16px; transition:transform 0.15s, box-shadow 0.15s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .pf-rw-c > button:hover { transform:translateY(-2px); box-shadow:0 8px 20px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.16); } }
  .pf-rw-c > button small { display:block; font-weight:600; opacity:0.75; font-size:11.5px; } .pf-rw-c > button b { animation:ruNum 0.6s var(--spring-strong) both; }
  .bst-t { animation:modsCard 0.45s ease both; transition:transform 0.15s; } .bst-t:nth-child(2) { animation-delay:0.06s; } .bst-t:nth-child(3) { animation-delay:0.12s; } .bst-t:nth-child(4) { animation-delay:0.18s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .bst-t.has:hover { transform:translateY(-3px) scale(1.02); } }
  .bst-t.has { position:relative; overflow:hidden; } .bst-t.has::after { content:''; position:absolute; inset:0; background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,0.35) 50%,transparent 60%); transform:translateX(-120%); animation:ttShine 4s ease-in-out infinite; }
  .bst-p.y span { background:rgba(255,211,77,0.2); color:#ffd34d; } .bst-p:not(.y) span { background:rgba(255,255,255,0.1); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); }
  #rw-wrap { position:fixed; inset:0; z-index:405; display:flex; align-items:center; justify-content:center; padding:14px; background:hsl(var(--ah) calc(50% * var(--asf)) 5% / 0.72); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); animation:hpFade 0.2s ease; }
  .rwl-n { margin:10px 0 4px; font-size:13px; line-height:1.45; color:hsl(215,22%,73%); } .rwl-r { display:flex; align-items:flex-start; gap:10px; animation:modsCard 0.3s ease both; } .rwl-r > em { flex:none; width:58px; margin-top:8px; padding:5px 0; border-radius:99px; background:hsl(var(--ah) calc(48% * var(--asf)) 8%); color:#fff; font-style:normal; font-family:var(--mono); font-size:10.5px; font-weight:800; text-align:center; }
  .rwl-r .lv-rw { flex:1; margin:0 0 6px; } .rwl-r.lock { opacity:0.6; } .rwl-r.lock > em { background:rgba(255,255,255,0.13); }
  .lv-flt { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; } .lv-flt .rk-chip { font-size:11px; padding:7px 12px; }
  .lv-list[data-f="rw"] .lv-row:not(.rw), .lv-list[data-f="mine"] .lv-row.lock, .lv-list[data-f="lock"] .lv-row.done, .lv-list[data-f="lock"] .lv-row.cur { display:none; }
  .lv-rw.stock { background:hsla(211,85%,62%,0.16); color:hsl(209,77%,80%); padding:7px 11px; font-size:13px; font-weight:700; flex-direction:row; align-items:center; gap:10px; flex-wrap:wrap; } .lv-rw.stock b { color:#2b6fd6; }
  /* jednotná šírka: všetky stránky majú šírku, akú mal doteraz len MOD 02 s mapou (na bežnom notebooku skoro celé okno) */
  @media (min-width:761px) { .app, .app.wide { max-width:min(97vw, 1500px); } }
  @media (max-width:760px) { .wkt-g.two { grid-template-columns:1fr; } .pf-ring { width:64px; height:64px; } .pf-ring b { font-size:20px; } }
  /* ===== v6.5 — priatelia, novinky, otázniky, sprievodca, mapa rebríčka ===== */
  .head-l { display:flex; align-items:center; gap:10px; min-width:0; }
  .news-btn { position:relative; height:30px; padding:0 14px; border-radius:99px; border:1.5px solid rgba(255,255,255,0.28); background:rgba(255,255,255,0.08); color:#fff; font-family:var(--mono); font-size:10.5px; font-weight:800; letter-spacing:0.14em; cursor:pointer; transition:background 0.15s, transform 0.15s; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .news-btn:hover { background:hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.22); transform:translateY(-1px); } } .news-btn i { display:none; position:absolute; right:-3px; top:-3px; width:11px; height:11px; border-radius:50%; background:#ffbe0b; box-shadow:0 0 0 2px hsl(var(--ah) calc(48% * var(--asf)) 8%), 0 0 10px #ffbe0b; animation:dqrPulse 1.6s ease-out infinite; } .news-btn.new i { display:block; }
  .fr-btn { position:relative; font-size:15px; } .fr-btn i { position:absolute; right:-5px; top:-5px; min-width:17px; height:17px; padding:0 4px; border-radius:99px; background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:hsl(154,67%,88%); font-style:normal; font-family:var(--mono); font-size:10px; font-weight:800; line-height:17px; text-align:center; box-shadow:0 0 0 2px hsl(var(--ah) calc(48% * var(--asf)) 8%); }
  #fr-wrap, #nw-wrap, #pt-wrap { position:fixed; inset:0; z-index:415; display:flex; align-items:flex-start; justify-content:flex-end; padding:70px 18px 18px; background:hsl(var(--ah) calc(50% * var(--asf)) 5% / 0.5); animation:hpFade 0.18s ease; }
  #nw-wrap { justify-content:flex-start; }
  .frp, .nw { width:min(400px,100%); max-height:calc(100vh - 90px); max-height:calc(100dvh - 90px); display:flex; flex-direction:column; border-radius:24px; background:rgba(255,255,255,0.07); box-shadow:0 30px 80px rgba(0,0,0,0.5); overflow:hidden; animation:frpIn 0.28s var(--spring-soft) both; }
  .nw { width:min(520px,100%); } @keyframes frpIn { from { transform:translateY(-14px) scale(0.96); opacity:0; } }
  .frp-top, .nw-top { display:flex; align-items:center; justify-content:space-between; padding:14px 16px 10px; background:hsl(var(--ah) calc(39% * var(--asf)) 10%); color:#fff; } .frp-top b, .nw-top b { font-family:var(--display); font-size:19px; } .nw-top small { display:block; font-family:var(--mono); font-size:10px; letter-spacing:0.18em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); }
  .frp-top button, .nw-top button { width:34px; height:34px; border-radius:99px; border:none; background:rgba(255,255,255,0.14); color:#fff; font-weight:800; cursor:pointer; }
  .frp-tabs { display:grid; grid-template-columns:1fr 1fr 1fr; gap:6px; padding:0 12px 12px; background:hsl(var(--ah) calc(39% * var(--asf)) 10%); } .frp-tabs button { height:36px; border:none; border-radius:99px; background:rgba(255,255,255,0.1); color:hsl(var(--ah) calc(32% * var(--asf)) 86%); font-family:var(--ui); font-weight:800; font-size:12px; letter-spacing:0.04em; cursor:pointer; } .frp-tabs button.on { background:hsl(var(--ah) calc(75% * var(--asf)) 57%); color:hsl(var(--ah) calc(67% * var(--asf)) 5%); }
  .frp-list { overflow:auto; padding:10px 12px 14px; display:flex; flex-direction:column; gap:6px; } .frp-g { margin:6px 4px 2px; font-family:var(--mono); font-size:10px; font-weight:800; letter-spacing:0.16em; color:hsl(215,22%,70%); }
  .frp-r { display:flex; align-items:center; gap:6px; padding:5px 6px 5px 5px; border-radius:16px; background:hsla(150,20%,62%,0.16); animation:modsCard 0.3s ease both; opacity:0.72; } .frp-r.on { opacity:1; background:hsla(146,50%,62%,0.16); } .frp-r.open { box-shadow:inset 0 0 0 2px hsl(var(--ah) calc(83% * var(--asf)) 42%); }
  .frp-main { flex:1; min-width:0; display:flex; align-items:center; gap:10px; border:none; background:none; padding:3px; cursor:pointer; text-align:left; font-family:var(--ui); } .frp-av { position:relative; flex:none; } .frp-av > i:last-child { position:absolute; right:-1px; bottom:-1px; width:11px; height:11px; border-radius:50%; background:rgba(255,255,255,0.13); box-shadow:0 0 0 2px rgba(255,255,255,0.16); } .frp-r.on .frp-av > i:last-child { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); }
  .frp-tx { min-width:0; display:flex; flex-direction:column; } .frp-tx b { font-size:14.5px; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .frp-tx b em { font-style:normal; font-size:10px; padding:1px 7px; border-radius:99px; background:hsla(149,56%,62%,0.16); color:hsl(153,83%,80%); vertical-align:middle; } .frp-tx small { font-size:12px; color:hsl(215,22%,73%); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .frp-b { flex:none; height:36px; min-width:36px; padding:0 10px; border:none; border-radius:99px; background:rgba(255,255,255,0.07); color:var(--text); font-weight:800; font-size:13px; cursor:pointer; box-shadow:0 2px 6px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.12); } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .frp-b:hover { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:hsl(154,67%,88%); } } .frp-b.go { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:hsl(154,67%,88%); font-size:11px; letter-spacing:0.06em; }
  .frp-mini { display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; margin:-2px 0 4px; padding:10px 12px; border-radius:14px; background:hsl(var(--ah) calc(39% * var(--asf)) 10%); color:hsl(var(--ah) calc(32% * var(--asf)) 86%); font-size:12.5px; } .frp-mini b { color:#fff; }
  .frp-e { padding:18px 14px; border-radius:16px; background:hsla(150,20%,62%,0.16); text-align:center; font-size:13.5px; line-height:1.5; color:hsl(215,22%,73%); display:flex; flex-direction:column; gap:8px; align-items:center; } .frp-e b { color:var(--text); font-size:15px; } .frp-e.sm { padding:12px; font-size:13px; } .frp-all { margin-top:6px; width:100%; } .frp-n { margin:6px 4px 0; font-size:11.5px; color:hsl(215,22%,70%); line-height:1.4; }
  .nw-list { overflow:auto; padding:12px 14px 16px; display:flex; flex-direction:column; gap:12px; } .nw-p { padding:14px 16px; border-radius:18px; background:hsla(150,20%,62%,0.16); animation:modsCard 0.35s ease both; } .nw-p.new { background:hsla(146,50%,62%,0.16); box-shadow:inset 0 0 0 2px hsl(var(--ah) calc(83% * var(--asf)) 42%); }
  .nw-p header { display:flex; align-items:center; gap:8px; font-family:var(--mono); font-size:10.5px; letter-spacing:0.08em; color:hsl(215,22%,73%); } .nw-p header em { font-style:normal; font-weight:800; padding:2px 8px; border-radius:99px; background:hsl(var(--ah) calc(48% * var(--asf)) 8%); color:#fff; } .nw-p header u { text-decoration:none; margin-left:auto; padding:2px 8px; border-radius:99px; background:#ffbe0b; color:#231700; font-weight:800; }
  .nw-p h3 { margin:8px 0 2px; font-family:var(--display); font-size:17px; font-weight:800; color:var(--text); } .nw-p p { margin:0 0 6px; font-size:13.5px; color:hsl(215,22%,78%); } .nw-p ul { margin:0; padding-left:18px; font-size:13px; line-height:1.5; color:hsl(215,22%,82%); } .nw-p li + li { margin-top:3px; } .nw-p .btn { margin-top:10px; height:36px; font-size:11px; }
  .qm { display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; margin-left:5px; border-radius:50%; background:rgba(120,135,128,0.28); color:hsl(215,22%,73%); font-style:normal; font-family:var(--ui); font-size:10.5px; font-weight:800; line-height:1; letter-spacing:0; cursor:help; vertical-align:middle; text-transform:none; transition:background 0.15s, color 0.15s; flex:none; }
  .qm:focus { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:hsl(154,67%,88%); outline:none; }@media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .qm:hover { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:hsl(154,67%,88%); outline:none; } } .pf-bst .qm, .sp .qm, .dqh-rooms .qm { background:rgba(255,255,255,0.22); color:hsl(var(--ah) calc(44% * var(--asf)) 89%); }
  #qm-box { display:none; position:fixed; z-index:800; max-width:min(300px, calc(100vw - 16px)); padding:10px 13px; border-radius:14px; background:hsl(var(--ah) calc(48% * var(--asf)) 8%); color:#fff; font-family:var(--ui); font-size:12.5px; font-weight:500; line-height:1.5; letter-spacing:0; text-transform:none; box-shadow:0 14px 36px rgba(0,0,0,0.45); pointer-events:none; animation:hpFade 0.14s ease; }
  .ab-tbl { overflow-x:auto; margin:10px 0 14px; border-radius:16px; background:rgba(255,255,255,0.07); box-shadow:0 2px 10px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.08); } .ab-tbl table { width:100%; border-collapse:collapse; font-size:13.5px; } .ab-tbl th { text-align:left; padding:10px 12px; font-family:var(--mono); font-size:10.5px; letter-spacing:0.12em; color:hsl(215,22%,73%); background:hsla(150,20%,62%,0.16); } .ab-tbl td { padding:10px 12px; border-top:1px solid rgba(255,255,255,0.16); vertical-align:top; line-height:1.45; } .ab-tbl td:nth-child(2) { font-weight:700; color:hsl(153,85%,78%); }
  .ab-list { margin:0; padding-left:20px; line-height:1.6; font-size:14px; } .ab-list li + li { margin-top:6px; }
  /* mapa rebríčka: meno pod profilovkou, biele s tieňom, aby ho bolo vidno na každej farbe; susedné štáty menším písmom */
  .rkm-lab { overflow:visible; } .rkm-lab span > b { display:block !important; position:absolute; left:50%; top:100%; transform:translateX(-50%); margin-top:2px; max-width:78px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10px; font-weight:800; line-height:1.1; color:#fff; text-shadow:0 1px 2px #000, 0 0 6px rgba(0,0,0,0.9); pointer-events:none; }
  .rkm-lab.free span > b { display:none !important; } .rkm-st { font-size:13px !important; opacity:0.55; } .rkm-wrap { padding-top:20px; } .rkm-tilt { margin-top:-10%; }
  @media (max-width:760px) { #fr-wrap, #nw-wrap, #pt-wrap { padding:58px 8px 8px; justify-content:center; } .news-btn { height:26px; padding:0 10px; font-size:9.5px; } .rkm-lab span > b { font-size:8.5px; max-width:54px; } .head-l .clock { display:none; } .ab-tbl table { font-size:12.5px; } }
  /* ===== v6.6 — vzhľady mapy, podrobné štatistiky, pravidlá modulov ===== */
  .dq-skin { display:inline-flex; align-items:center; gap:8px; height:36px; padding:0 14px 0 6px; border:none; border-radius:99px; background:hsla(144,17%,62%,0.16); color:var(--text); font-family:var(--ui); font-weight:800; font-size:11.5px; letter-spacing:0.04em; cursor:pointer; transition:transform 0.15s, box-shadow 0.15s; }
  .dq-skin i { width:26px; height:26px; border-radius:50%; background:var(--c); box-shadow:inset 0 0 0 2px rgba(255,255,255,0.75), 0 0 0 1px rgba(0,0,0,0.15); } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-skin:hover:not(:disabled) { transform:translateY(-2px); box-shadow:0 6px 14px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.16); } } .dq-skin.on { background:hsl(var(--ah) calc(48% * var(--asf)) 8%); color:#fff; } .dq-skin.lock { opacity:0.45; cursor:not-allowed; }
  #dq-stage[data-skin="radar"] { background:radial-gradient(circle at 50% 55%, hsl(var(--ah) calc(59% * var(--asf)) 14%) 0%, hsl(var(--ah) calc(56% * var(--asf)) 5%) 70%); } #dq-stage[data-skin="radar"] .dq-mapwrap { background-image:repeating-radial-gradient(circle at 50% 55%, transparent 0 58px, hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.10) 58px 59px), linear-gradient(hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.06) 1px, transparent 1px), linear-gradient(90deg, hsl(var(--ah) calc(75% * var(--asf)) 57% / 0.06) 1px, transparent 1px); background-size:auto, 40px 40px, 40px 40px; }
  #dq-stage[data-skin="radar"] .dq-map .dq-cell { fill:hsl(var(--ah) calc(51% * var(--asf)) 8%); stroke:hsl(var(--ah) calc(100% * var(--asf)) 75%); } #dq-stage[data-skin="radar"] .dq-out { stroke:hsl(var(--ah) calc(100% * var(--asf)) 75%); }
  #dq-stage[data-skin="night"] { background:radial-gradient(ellipse at 30% 0%, #1b2a66 0%, #070b1e 62%); } #dq-stage[data-skin="night"] .dq-mapwrap { background-image:radial-gradient(1.5px 1.5px at 12% 18%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 34% 62%, #cfe0ff 50%, transparent 51%), radial-gradient(1.5px 1.5px at 58% 12%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 77% 44%, #fff 50%, transparent 51%), radial-gradient(1.5px 1.5px at 88% 78%, #cfe0ff 50%, transparent 51%), radial-gradient(1px 1px at 22% 86%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 66% 90%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 46% 34%, #cfe0ff 50%, transparent 51%); }
  #dq-stage[data-skin="night"] .dq-map .dq-cell { fill:#0b1430; stroke:#a9c4ff; } #dq-stage[data-skin="night"] .dq-out { stroke:#a9c4ff; }
  #dq-stage[data-skin="chart"] { background:hsla(44,46%,62%,0.16); } #dq-stage[data-skin="chart"] .dq-mapwrap { background-image:linear-gradient(rgba(29,53,87,0.09) 1px, transparent 1px), linear-gradient(90deg, rgba(29,53,87,0.09) 1px, transparent 1px); background-size:48px 48px; }
  #dq-stage[data-skin="chart"] .dq-map .dq-cell { fill:#f7f1df; stroke:#1d3557; stroke-width:1.9; } #dq-stage[data-skin="chart"] .dq-out { stroke:#1d3557; } #dq-stage[data-skin="chart"] .dq-map .dq-cell.can { fill:#d9e6c9; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) #dq-stage[data-skin="chart"] .dq-map .dq-cell.click:hover { fill:#bcd6a4; } }
  #dq-stage[data-skin="chart"] .dq-map text.dq-lab:not(.own) { fill:#1d3557; } #dq-stage[data-skin="chart"] .dq-map text.dq-lab:not(.own) .p { fill:#a85d00; } #dq-stage[data-skin="chart"] .dq-map .dq-gline { stroke:#1d3557; }
  #dq-stage[data-skin="sunset"] { background:linear-gradient(180deg, #2a1245 0%, #7a2f4f 55%, #d9703a 100%); } #dq-stage[data-skin="sunset"] .dq-map .dq-cell { fill:#2a1530; stroke:#ffd6a5; } #dq-stage[data-skin="sunset"] .dq-out { stroke:#ffd6a5; }
  #dq-stage[data-skin="ocean"] { background:linear-gradient(160deg, #03222b 0%, #0a4a5c 60%, #0f6f7f 100%); } #dq-stage[data-skin="ocean"] .dq-mapwrap { background-image:repeating-linear-gradient(170deg, transparent 0 22px, rgba(143,233,255,0.06) 22px 24px); } #dq-stage[data-skin="ocean"] .dq-map .dq-cell { fill:#062a33; stroke:#8fe9ff; } #dq-stage[data-skin="ocean"] .dq-out { stroke:#8fe9ff; }
  #dq-stage[data-skin="steel"] { background:linear-gradient(135deg, #2b3138 0%, #14181d 100%); } #dq-stage[data-skin="steel"] .dq-mapwrap { background-image:repeating-linear-gradient(45deg, transparent 0 14px, rgba(255,255,255,0.03) 14px 15px); } #dq-stage[data-skin="steel"] .dq-map .dq-cell { fill:#1c2026; stroke:#cfd6de; } #dq-stage[data-skin="steel"] .dq-out { stroke:#cfd6de; }
  #dq-stage[data-skin] .dq-map .dq-cell.own { fill:var(--pc) !important; } #dq-stage[data-skin="chart"] .dq-map .dq-cell.own { stroke:#1d3557; }
  .sx-card[data-sx] { cursor:pointer; position:relative; flex-wrap:wrap; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .sx-card[data-sx]:hover { box-shadow:var(--d-sh2, 0 8px 22px hsl(var(--ah) calc(71% * var(--asf)) 14% / 0.14)); } } .sx-card.open { grid-column:1 / -1; box-shadow:inset 0 0 0 2px var(--green, hsl(var(--ah) calc(83% * var(--asf)) 42%)); }
  .sx-more { position:absolute; right:12px; top:10px; text-decoration:none; font-size:12px; color:var(--text-faint); } .sx-card > .sx-det { flex:1 1 100%; display:block; margin-top:12px; padding-top:12px; border-top:1px solid rgba(255,255,255,0.16); animation:modsCard 0.3s ease both; cursor:default; }
  .sx-kv { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:8px; } .sx-kv > div { padding:9px 12px; border-radius:14px; background:hsla(150,20%,62%,0.16); display:flex; flex-direction:column; gap:1px; } .sx-kv small { font-size:11px; color:var(--text-dim); } .sx-card .sx-kv b { font-family:var(--display); font-size:19px; letter-spacing:0; color:var(--text); }
  .sx-det p { margin:10px 0 0; font-size:13.5px; line-height:1.5; color:hsl(215,22%,78%); } .sx-card .sx-det p b { font-size:inherit; letter-spacing:0; color:var(--text); } .sx-det p.sx-btns { display:flex; flex-wrap:wrap; gap:8px; } .sx-det .btn { height:36px; padding:0 14px; font-size:11px; }
  .sx-note { margin:0 0 12px; padding:12px 14px; border-radius:16px; background:hsla(219,85%,62%,0.16); color:hsl(216,46%,79%); font-size:13px; line-height:1.55; }
  .ab-doc { margin:8px 0 2px; } .ab-doc summary { cursor:pointer; font-size:12.5px; font-weight:800; color:var(--green); list-style:none; } .ab-doc summary::-webkit-details-marker { display:none; } .ab-doc summary::after { content:' ▾'; } .ab-doc[open] summary::after { content:' ▴'; }
  .ab-doc ul { margin:8px 0 4px; padding-left:18px; font-size:13px; line-height:1.5; color:hsl(215,22%,82%); } .ab-doc li + li { margin-top:4px; }
  .ch-b.me > div { box-shadow:0 4px 12px hsl(var(--ah) calc(83% * var(--asf)) 42% / 0.22); } .ch-b > div { box-shadow:0 2px 8px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.06); transition:transform 0.12s; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .ch-b:hover > div { transform:translateY(-1px); } }
  /* ===== v6.7 — MOD 07–12: animácie podľa stavu otázky (nová otázka / odpoveď) ===== */
  .gq { animation:none; } .gq.fresh { animation:gqIn 0.3s cubic-bezier(0.2,0.8,0.3,1) both; } @keyframes gqIn { from { opacity:0; transform:translateX(16px); } to { opacity:1; transform:none; } }
  .gq.fresh .gq-opts .choice-btn { animation:gqOpt 0.28s ease both; } .gq.fresh .gq-opts .choice-btn:nth-child(2) { animation-delay:0.05s; } .gq.fresh .gq-opts .choice-btn:nth-child(3) { animation-delay:0.1s; } .gq.fresh .gq-opts .choice-btn:nth-child(4) { animation-delay:0.15s; } .gq.fresh .gq-opts .choice-btn:nth-child(n+5) { animation-delay:0.2s; }
  @keyframes gqOpt { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
  .gq.fresh .gq-big { animation:popIn 0.35s ease both; } .gq.fresh .gq-big.mono { animation:gqTele 0.7s steps(28) both; } @keyframes gqTele { from { clip-path:inset(0 100% 0 0); } to { clip-path:inset(0 0 0 0); } }
  .gq.fresh[data-m="phrase"] .gq-big:not(.mono) { animation:gqRadio 0.4s ease both; } @keyframes gqRadio { from { opacity:0; letter-spacing:0.3em; } to { opacity:1; letter-spacing:normal; } }
  .gq.fresh .gq-in { animation:gqOpt 0.3s 0.08s ease both; } .gq.fresh .gq-img { animation:popIn 0.35s ease both; }
  .gq.done .gq-typed { animation:popIn 0.3s ease both; } .gq.done .gq-typed.no { animation:shakeNo 0.28s ease; } .gq-opts .choice-btn.gone { transition:opacity 0.3s; }
  /* ===== v5.9.8 — úspešnosť modulov a opravy ===== */
  .dyt-m { margin:10px 0 14px; } .dyt-bar { margin:34px 0 34px; }
  .mods-sc { display:flex; flex-direction:column; gap:4px; margin-top:9px; } .mods-sc i { display:block; height:6px; margin:0; border-radius:99px; background:hsla(140,19%,62%,0.16); overflow:hidden; } .mods-sc i em { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,hsl(var(--ah) calc(79% * var(--asf)) 46%),hsl(var(--ah) calc(88% * var(--asf)) 33%)); }
  .mods-sc u { text-decoration:none; font-size:12px; font-weight:700; color:hsl(153,83%,80%); } .mods-sc.none u { color:var(--text-faint); font-weight:600; } .mods-card.wide .mods-sc u { color:hsl(var(--ah) calc(68% * var(--asf)) 85%); } .mods-card.wide .mods-sc i { background:rgba(255,255,255,0.2); }
  .sr-c ul { margin:6px 0 0; padding-left:18px; } .sr-c .btn { margin-top:8px; height:32px; padding:0 14px; font-size:11px; } .sr-c.rel { opacity:0.85; border-style:dashed !important; }
  /* ===== v5.9.9 — Vysvetliť otázku ===== */
  /* MAPY AIP SR: veľké tlačidlo nad otázkou a okno s mapami */
  .aip-row { display:flex; gap:10px; margin:0 0 14px; flex-wrap:wrap; } .aip-row .aip-maps { flex:1 1 280px; width:auto; margin:0; }
  .aip-open { flex:0 1 150px; display:flex; flex-direction:column; justify-content:center; padding:10px 16px; border-radius:16px; border:2px solid #3f8cff; background:hsla(217,85%,62%,0.16); color:hsl(215,73%,77%); font-weight:800; font-size:15px; text-decoration:none; transition:transform 0.22s var(--ease-out), background 0.22s ease; } .aip-open small { font-size:11px; font-weight:600; opacity:0.8; } .aip-open:active { transform:scale(0.97); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .aip-open:hover { transform:translateY(-2px); background:hsla(216,85%,62%,0.16); } }
  .aip-maps { position:relative; overflow:hidden; display:flex; align-items:center; gap:14px; width:100%; margin:0 0 14px; padding:14px 18px; border:0; border-radius:16px; color:#fff; text-align:left; cursor:pointer; background:linear-gradient(135deg,#3f8cff 0%,#14407f 100%); box-shadow:0 8px 22px rgba(20,64,127,0.35), inset 0 1px 0 rgba(255,255,255,0.28); transition:transform 0.22s var(--ease-out), box-shadow 0.22s var(--ease-out); }
  .aip-maps i { font-style:normal; font-size:30px; line-height:1; flex:none; } .aip-maps b { display:block; font-size:15px; letter-spacing:0.08em; font-weight:800; } .aip-maps small { display:block; margin-top:2px; font-size:12px; opacity:0.85; } .aip-maps u { margin-left:auto; text-decoration:none; font-size:22px; font-weight:800; transition:transform 0.22s var(--ease-out); }
  .aip-maps::after { content:''; position:absolute; top:0; bottom:0; left:-60%; width:40%; background:linear-gradient(100deg,transparent,rgba(255,255,255,0.35),transparent); transform:skewX(-20deg); transition:left 0.6s var(--ease-out); pointer-events:none; }
  .aip-maps:active { transform:scale(0.98); }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .aip-maps:hover { transform:translateY(-2px); box-shadow:0 14px 30px rgba(20,64,127,0.45), inset 0 1px 0 rgba(255,255,255,0.35); } :where(html:not(.touch)) .aip-maps:hover::after { left:120%; } :where(html:not(.touch)) .aip-maps:hover u { transform:translateX(5px); } }
  .mp-wrap { position:fixed; inset:0; z-index:210; display:flex; align-items:center; justify-content:center; padding:14px; background:rgba(3,10,7,0.72); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); animation:dqFade 0.2s ease; } .mp-wrap.out { opacity:0; transition:opacity 0.16s ease; }
  .mp-in { width:min(1000px,100%); max-height:100%; overflow:auto; padding:18px 20px 20px; border-radius:20px; background:linear-gradient(180deg,#10243f 0%,#08131f 100%); border:1px solid rgba(63,140,255,0.5); color:#e8f0ff; box-shadow:0 30px 90px rgba(0,0,0,0.65); animation:dqPop 0.3s var(--spring-soft); }
  .mp-top { display:flex; align-items:center; justify-content:space-between; gap:10px; } .mp-top h3 { margin:0; font-size:16px; letter-spacing:0.12em; color:#7db4ff; }
  .mp-x, .mp-back { border:1px solid rgba(255,255,255,0.18); background:rgba(255,255,255,0.06); color:#fff; border-radius:10px; height:34px; padding:0 14px; font-weight:700; cursor:pointer; transition:transform 0.16s var(--ease-out), background 0.16s ease; } .mp-x:active, .mp-back:active, .mp-card:active { transform:scale(0.97); }
  .mp-tabs { display:flex; flex-wrap:wrap; gap:6px; margin:14px 0 4px; } .mp-tabs button { border:1px solid rgba(125,180,255,0.35); background:transparent; color:#a9c7ee; border-radius:999px; height:32px; padding:0 14px; font-size:12px; font-weight:700; letter-spacing:0.06em; cursor:pointer; transition:background 0.16s ease, color 0.16s ease; } .mp-tabs button.on { background:#3f8cff; border-color:#3f8cff; color:#fff; }
  .mp-sub { margin:8px 0 12px; font-size:12px; color:#8aa6cc; }
  .mp-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:10px; }
  .mp-card { display:flex; flex-direction:column; gap:6px; padding:8px; text-align:left; border-radius:12px; border:1px solid rgba(125,180,255,0.22); background:rgba(255,255,255,0.04); color:#e8f0ff; cursor:pointer; transition:transform 0.2s var(--ease-out), border-color 0.2s ease, background 0.2s ease; }
  .mp-card b { font-size:12.5px; line-height:1.3; font-weight:700; } .mp-card small { font-size:10.5px; color:#8aa6cc; font-family:var(--mono); }
  .mp-th { display:flex; align-items:center; justify-content:center; aspect-ratio:4/3; border-radius:8px; background:rgba(255,255,255,0.07); overflow:hidden; } .mp-th img { width:100%; height:100%; object-fit:contain; } .mp-th { color:hsl(215,22%,71%); } .mp-th em, .mp-view em { font-style:normal; font-size:11px; color:hsl(215,22%,71%); padding:8px; text-align:center; }
  .mp-aip { margin-left:auto; display:inline-flex; align-items:center; height:34px; padding:0 14px; border-radius:10px; background:#3f8cff; color:#fff; font-size:12px; font-weight:800; letter-spacing:0.05em; text-decoration:none; transition:transform 0.16s var(--ease-out), background 0.16s ease; } .mp-aip:active { transform:scale(0.97); }
  .mp-th em.pdf { font-size:15px; font-weight:800; color:hsl(3,71%,72%); } .mp-view iframe { width:100%; height:68vh; border:0; display:block; } .mp-pdf { display:block; padding:10px; font-size:12px; font-weight:800; color:hsl(215,73%,77%); text-decoration:none; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mp-aip:hover { background:#5a9eff; } }
  .mp-bar { display:flex; align-items:center; gap:12px; margin:14px 0 10px; } .mp-bar span { font-size:13px; font-weight:700; }
  .mp-view { max-height:68vh; overflow:auto; border-radius:10px; background:rgba(255,255,255,0.07); text-align:center; } .mp-view img { max-width:100%; cursor:zoom-in; } .mp-view em { display:block; padding:40px 16px; font-size:13px; } .mp-code { display:block; margin-top:8px; font-family:var(--mono); color:#8aa6cc; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mp-card:hover { transform:translateY(-3px); border-color:#3f8cff; background:rgba(63,140,255,0.12); } :where(html:not(.touch)) .mp-x:hover, :where(html:not(.touch)) .mp-back:hover { background:rgba(255,255,255,0.16); } }
  @media (max-width:560px) { .mp-grid { grid-template-columns:repeat(2,1fr); } .mp-in { padding:14px 12px 16px; } }
  .gq-xrow { display:flex; align-items:center; justify-content:center; gap:10px; flex-wrap:wrap; margin:2px 0; } .gq-xrow .btn { height:42px; padding:0 22px; font-size:13px; border-color:#f2b84b; color:hsl(39,88%,78%); background:hsla(43,85%,62%,0.16); } .gq-xrow small { font-size:11.5px; color:var(--text-faint); }
  #xp-wrap { position:fixed; inset:0; z-index:420; display:flex; align-items:center; justify-content:center; padding:14px; background:hsl(var(--ah) calc(45% * var(--asf)) 4% / 0.6); animation:fadeUp 0.2s ease both; }
  .xp { width:min(560px,100%); max-height:86vh; overflow:auto; background:rgba(255,255,255,0.07); color:hsl(153,48%,86%); border-radius:22px; padding:18px 20px 20px; box-shadow:0 24px 70px rgba(0,0,0,0.4); }
  .xp-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; } .xp-top b { font-family:var(--display); font-size:19px; } .xp-top button { width:34px; height:34px; border:none; border-radius:50%; background:hsla(144,17%,62%,0.16); cursor:pointer; font-size:14px; }
  .xp-warn { margin:0 0 10px; padding:9px 12px; border-radius:12px; background:hsla(42,85%,62%,0.16); color:hsl(37,88%,79%); font-size:13px; }
  .xp-tabs { display:flex; gap:6px; margin-bottom:12px; } .xp-tabs button { flex:1; height:38px; border:none; border-radius:99px; background:hsla(144,17%,62%,0.16); font-family:var(--ui); font-weight:800; font-size:12.5px; cursor:pointer; color:hsl(215,22%,82%); } .xp-tabs button.on { background:var(--d-grad, hsl(var(--ah) calc(83% * var(--asf)) 42%)); color:var(--ac-ink); }
  .xp-c p { margin:0 0 9px; font-size:14.5px; line-height:1.55; } .xp-c ul { margin:0; padding-left:18px; font-size:14px; line-height:1.55; } .xp-c li + li { margin-top:6px; } .xp-dim { color:var(--text-faint); }
  /* ===== v5.9.10 — ruleta a denné úlohy ===== */
  .hh-t.spin.go.blue { box-shadow:0 0 0 2px #3a86ff, 0 8px 22px rgba(58,134,255,0.35); animation:none; } .hh-t.spin.go.blue b { color:#9cc4ff; }
  #sp-go.blue { background:linear-gradient(135deg,#5aa0ff,#2b6fd6); color:#fff; box-shadow:0 10px 24px rgba(43,111,214,0.4); } .lv-rw.tok { background:hsla(215,85%,62%,0.16); color:hsl(209,77%,80%); } .lv-rw.tok b { color:#2b6fd6; } .lv-rw.tok small { color:hsl(213,42%,75%); }
  /* ===== v5.9.11 — horná lišta na tablete a mobile: názov v strede, pod ním vľavo novinky a vpravo tlačidlá ===== */
  @media (max-width:1040px) {
    header.hd2 { grid-template-columns:minmax(0,auto) minmax(0,1fr) !important; grid-template-areas:"brand brand" "l r"; row-gap:8px; justify-items:stretch; padding:8px 12px; }
    header.hd2 .brand2 { grid-area:brand; justify-self:center !important; font-size:19px; padding:6px 14px; max-width:100%; }
    header.hd2 .head-l { grid-area:l; justify-self:start; display:flex !important; } header.hd2 .head-r { grid-area:r; justify-self:end; flex-wrap:wrap; justify-content:flex-end; }
    header.hd2 .head-l .clock { display:none; }
  }
  @media (max-width:420px) {
    header.hd2 { grid-template-columns:minmax(0,1fr) !important; grid-template-areas:"brand" "l" "r"; justify-items:center; }
    header.hd2 .head-l, header.hd2 .head-r { justify-self:center; justify-content:center; } header.hd2 .brand2 { font-size:17px; letter-spacing:0.1em; }
  }
  .xp-c h4 { margin:14px 0 4px; font-family:var(--mono); font-size:10.5px; letter-spacing:0.14em; text-transform:uppercase; color:hsl(153,88%,75%); } .xp-c h4:first-child { margin-top:0; }
  .xp-big { padding:10px 14px; border-radius:14px; background:hsl(var(--ah) calc(48% * var(--asf)) 8%); color:hsl(var(--ah) calc(75% * var(--asf)) 57%); font-family:var(--mono); font-size:13px; word-break:break-word; } .xp-chips { display:flex; flex-wrap:wrap; gap:6px; } .xp-chips span { padding:3px 11px; border-radius:99px; background:hsla(144,17%,62%,0.16); font-family:var(--mono); font-size:12.5px; font-weight:700; }
  .xp-dec { list-style:none; padding:0 !important; } .xp-dec li { padding:5px 0; border-bottom:1px solid rgba(255,255,255,0.16); font-size:13.5px; } .xp-dec b { font-family:var(--mono); color:hsl(153,83%,80%); }
  .xp-tb { width:100%; border-collapse:collapse; font-size:13.5px; } .xp-tb th, .xp-tb td { padding:6px 8px; border-bottom:1px solid rgba(255,255,255,0.16); text-align:left; } .xp-tb th { font-size:11px; color:var(--text-dim); }
  .xp-abc { display:grid !important; grid-template-columns:repeat(auto-fill, minmax(92px, 1fr)); gap:5px; } .xp-abc span { padding:5px 8px; border-radius:10px; background:hsla(150,20%,62%,0.16); font-size:12.5px; } .xp-abc b { color:hsl(153,88%,75%); margin-right:5px; }
  .xp-key { padding:10px 14px; border-radius:14px; background:hsla(146,60%,62%,0.16); color:hsl(153,83%,80%); font-weight:700; } .xp-note { margin-top:14px !important; font-size:12px !important; }
  .xp-btn { background:hsla(43,85%,62%,0.16) !important; border-color:#f2b84b !important; color:hsl(39,88%,78%) !important; } .xp-tb th { width:38%; font-weight:700; color:var(--text-dim); font-size:12.5px; } .xp-tb td { font-size:13.5px; }
  /* ===== v5.9.15 — UTC hodiny na celú obrazovku (easter egg) ===== */
  .head-l .clock, .site-foot .app-ver { cursor:pointer; } body.ck-on { overflow:hidden; }
  #ck-wrap { position:fixed; inset:0; z-index:900; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:56px 18px 38px; color:hsl(var(--ah) calc(100% * var(--asf)) 95%); font-family:var(--ui); overflow:auto; animation:fadeUp 0.35s ease both; }
  #ck-wrap[data-v="a"] { background:radial-gradient(ellipse at 50% 40%, hsl(var(--ah) calc(58% * var(--asf)) 10%) 0%, hsl(var(--ah) calc(60% * var(--asf)) 4%) 70%); } #ck-wrap[data-v="b"] { background:linear-gradient(160deg, #0d1620 0%, #101c2b 60%, #0a121b 100%); } #ck-wrap[data-v="c"] { background:#000; }
  .ck-bar { position:fixed; top:12px; left:14px; right:14px; display:flex; justify-content:space-between; align-items:center; } .ck-bar button { width:38px; height:38px; margin-right:6px; border:1px solid rgba(255,255,255,0.22); border-radius:50%; background:rgba(255,255,255,0.06); color:hsl(var(--ah) calc(100% * var(--asf)) 95%); font-family:var(--mono); font-weight:800; font-size:13px; cursor:pointer; } .ck-bar button.on { background:hsl(var(--ah) calc(75% * var(--asf)) 57%); color:hsl(var(--ah) calc(67% * var(--asf)) 5%); border-color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .ck-bar > button { margin:0; }
  .ck-note { position:fixed; bottom:12px; left:0; right:0; margin:0; text-align:center; font-size:11px; letter-spacing:0.06em; color:hsl(var(--ah) calc(100% * var(--asf)) 95% / 0.45); }
  #ck-body { width:100%; display:flex; justify-content:center; } .ck-svg { display:block; } .ck-ring { fill:none; stroke:hsl(var(--ah) calc(100% * var(--asf)) 95% / 0.35); stroke-width:1.5; } .ck-t { stroke:hsl(var(--ah) calc(100% * var(--asf)) 95% / 0.55); } .ck-h0, .ck-h1 { stroke:hsl(var(--ah) calc(100% * var(--asf)) 95%); } .ck-h2 { stroke:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .ck-pin { fill:hsl(var(--ah) calc(75% * var(--asf)) 57%); }
  .ck-a { display:flex; flex-direction:column; align-items:center; gap:34px; width:100%; max-width:1000px; } .ck-a-main { display:flex; align-items:center; gap:34px; flex-wrap:wrap; justify-content:center; } .ck-a-main .ck-svg { width:min(46vw, 250px); }
  .ck-a-main small { display:block; font-family:var(--mono); font-size:13px; letter-spacing:0.3em; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .ck-a-main b { display:block; font-family:var(--mono); font-weight:500; font-size:clamp(44px, 11vw, 96px); letter-spacing:0.02em; line-height:1.05; } .ck-a-main b i { font-style:normal; color:hsl(var(--ah) calc(75% * var(--asf)) 57%); } .ck-a-main span { font-family:var(--mono); color:hsl(var(--ah) calc(100% * var(--asf)) 95% / 0.6); letter-spacing:0.12em; }
  .ck-a-row { display:grid; grid-template-columns:repeat(auto-fit, minmax(118px, 1fr)); gap:10px; width:100%; } .ck-a-row > div { padding:12px 12px 10px; border:1px solid hsl(var(--ah) calc(100% * var(--asf)) 95% / 0.16); border-radius:14px; background:rgba(255,255,255,0.03); } .ck-a-row > div.noc { background:rgba(0,0,0,0.25); } .ck-a-row small { display:block; font-family:var(--mono); font-size:10.5px; letter-spacing:0.2em; color:hsl(var(--ah) calc(100% * var(--asf)) 95% / 0.6); } .ck-a-row b { display:block; font-family:var(--mono); font-weight:500; font-size:26px; margin:2px 0; } .ck-a-row span { font-size:11.5px; color:hsl(var(--ah) calc(100% * var(--asf)) 95% / 0.5); }
  .ck-b { display:grid; grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); gap:14px; width:100%; max-width:1100px; } .ck-card { display:flex; flex-direction:column; align-items:center; gap:6px; padding:18px 12px 14px; border-radius:22px; background:linear-gradient(180deg, #1c2e44, #14212f); border:1px solid rgba(255,255,255,0.1); } .ck-card.den { background:linear-gradient(180deg, #2b4a6b, #1e3550); } .ck-card.noc { background:linear-gradient(180deg, #131a28, #0d121c); } .ck-card.utc { background:linear-gradient(180deg, hsl(var(--ah) calc(60% * var(--asf)) 20%), hsl(var(--ah) calc(62% * var(--asf)) 14%)); border-color:hsl(var(--ah) calc(75% * var(--asf)) 57%); }
  .ck-card .ck-svg { width:104px; } .ck-card b { font-family:var(--mono); font-weight:500; font-size:30px; } .ck-card b i { font-style:normal; font-size:16px; opacity:0.6; } .ck-card small { font-size:12px; letter-spacing:0.2em; font-weight:800; } .ck-card span { font-size:11.5px; opacity:0.6; }
  .ck-c { text-align:center; transition:transform 60s linear; } .ck-c b { display:block; font-family:var(--ui); font-weight:200; font-size:clamp(70px, 24vw, 260px); line-height:1; letter-spacing:-0.02em; color:#fff; } .ck-c b em { font-style:normal; opacity:0.45; } .ck-c > span { display:block; margin-top:8px; font-size:clamp(15px, 3vw, 24px); font-weight:300; letter-spacing:0.5em; color:rgba(255,255,255,0.55); } .ck-c p { margin:46px 0 0; font-size:clamp(11px, 1.8vw, 14px); font-weight:300; color:rgba(255,255,255,0.45); letter-spacing:0.08em; line-height:2.2; } .ck-c p i { font-style:normal; color:rgba(255,255,255,0.8); font-family:var(--mono); }
  .ff { margin:14px 0 0; padding:16px 20px 14px; border-radius:22px; background:linear-gradient(135deg,hsla(46,85%,62%,0.16),rgba(255,255,255,0.07)); box-shadow:0 8px 26px rgba(120,80,0,0.12); border-left:5px solid #ffbe0b; color:hsl(44,88%,86%); animation:fadeUp 0.3s ease both; }
  .ff-top { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; } .ff-top small { font-family:var(--mono); font-size:11px; font-weight:800; letter-spacing:0.16em; color:hsl(41,88%,76%); } .ff-top u { text-decoration:none; padding:3px 11px; border-radius:99px; background:#ffe8a3; font-size:11.5px; font-weight:800; letter-spacing:0.08em; color:#5a3d00; }
  .ff p { margin:8px 0 10px; font-size:16.5px; line-height:1.55; font-weight:600; } .ff-f { display:flex; align-items:center; justify-content:space-between; gap:10px; } .ff-f span { font-size:12px; color:hsl(42,32%,72%); } .ff-f .btn { height:34px; padding:0 14px; font-size:11px; }
  /* ===== v5.9.16 — priatelia a správy v okne ===== */
  .frp { width:min(430px,100%); } .frp-add { display:flex; gap:8px; margin:2px 0 4px; } .frp-add input { flex:1; min-width:0; height:40px; padding:0 14px; border:1.5px solid var(--border); border-radius:99px; font-size:14px; font-family:var(--ui); } .frp-add .btn { height:40px; padding:0 16px; font-size:11.5px; }
  .frp-ok { padding:8px 12px; border-radius:12px; background:hsla(146,60%,62%,0.16); color:hsl(153,83%,80%); font-size:13px; } .frp-er { padding:8px 12px; margin:6px 12px; border-radius:12px; background:hsla(9,85%,62%,0.16); color:hsl(5,71%,73%); font-size:13px; }
  .frp-un, .frp-b i { font-style:normal; min-width:20px; height:20px; padding:0 6px; border-radius:99px; background:#e63946; color:#fff; font-family:var(--mono); font-size:11px; font-weight:800; display:inline-flex; align-items:center; justify-content:center; } .frp-b i { margin-left:4px; } .frp-main.st { cursor:default; }
  .frp-b.del { margin-top:6px; background:hsla(9,85%,62%,0.16); color:hsl(5,71%,73%); } .frp-ch { display:flex; flex-direction:column; margin:-10px -12px -14px; } .frp-cht { display:flex; align-items:center; gap:10px; padding:10px 12px; border-bottom:1px solid var(--border); } .frp-cht b { font-size:15px; } .frp-ch .ch-log { height:min(46vh,380px); }
  /* ===== v5.9.18 — VZHĽAD a NASTAVENIA v profile ===== */
  .lk-sum { display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; margin-bottom:10px; } .lk-sum > div { padding:10px 12px; border-radius:16px; background:hsla(150,20%,62%,0.16); text-align:center; } .lk-sum b { display:block; font-family:var(--display); font-size:24px; } .lk-sum span { font-size:11.5px; color:var(--text-dim); }
  .lk-leg { margin:0 0 10px; font-size:12.5px; line-height:1.6; color:var(--text-dim); } .lk-leg span { padding:2px 9px; border-radius:99px; font-weight:800; font-size:10.5px; letter-spacing:0.06em; } .lk-leg .perm { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:hsl(154,67%,88%); } .lk-leg .tok { background:hsla(215,85%,62%,0.16); color:#2b6fd6; }
  .lk-ph { display:flex; flex-wrap:wrap; gap:6px; } .lk-ph span { padding:5px 11px; border-radius:99px; background:hsla(150,20%,62%,0.16); font-size:12.5px; font-weight:700; color:#8a968f; } .lk-ph span.on { background:hsla(146,60%,62%,0.16); color:hsl(153,83%,80%); } .lk-ph em { font-style:normal; font-size:10.5px; opacity:0.7; }
  .lk-next { list-style:none; margin:0 0 10px; padding:0; display:flex; flex-direction:column; gap:6px; } .lk-next li { display:flex; align-items:center; gap:10px; padding:7px 10px; border-radius:12px; background:hsla(150,20%,62%,0.16); font-size:13px; } .lk-next b { font-family:var(--mono); font-size:11px; color:hsl(153,88%,75%); min-width:54px; } .lk-next span { flex:1; } .lk-next em { font-style:normal; font-size:10.5px; font-weight:800; padding:2px 8px; border-radius:99px; background:hsla(146,60%,62%,0.16); color:hsl(153,83%,80%); } .lk-next em.tok { background:hsla(215,85%,62%,0.16); color:#2b6fd6; } .lk-next em.once { background:hsla(45,85%,62%,0.16); color:hsl(39,88%,81%); }
  .pf-achf { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0 0 10px; } .pf-achf span { flex:1; } .pf-achf button { height:30px; padding:0 12px; border:none; border-radius:99px; background:rgba(255,255,255,0.07); font-family:var(--ui); font-weight:800; font-size:11px; letter-spacing:0.04em; color:hsl(215,22%,82%); cursor:pointer; box-shadow:0 2px 8px hsl(var(--ah) calc(39% * var(--asf)) 10% / 0.08); } .pf-achf button.on { background:hsl(var(--ah) calc(83% * var(--asf)) 42%); color:hsl(154,67%,88%); }
  .pf-ach-g[data-f="ok"] > .lock, .pf-ach-g[data-f="lock"] > .ok { display:none; } .pf-ach-g[data-p="10"] > div:not([data-p="10"]), .pf-ach-g[data-p="20"] > div:not([data-p="20"]), .pf-ach-g[data-p="30"] > div:not([data-p="30"]), .pf-ach-g[data-p="50"] > div:not([data-p="50"]), .pf-ach-g[data-p="100"] > div:not([data-p="100"]) { display:none; }
  .f-note { flex-basis:100%; font-size:12px; color:var(--text-dim); margin:2px 0 6px; line-height:1.5; }
  .gq-v { font-weight:600; letter-spacing:.04em; } .gq-v.ok { color:hsl(150,57%,72%); } .gq-v.no { color:#e0a34a; }
  .pt-r { display:flex; align-items:center; gap:10px; padding:9px 4px; border-bottom:1px solid var(--border); } .pt-r > i { font-style:normal; font-size:20px; width:30px; text-align:center; } .pt-r > div { flex:1; min-width:0; } .pt-r b { display:block; font-size:13.5px; } .pt-r small { display:block; font-size:11.5px; color:var(--text-dim); } .pt-r u { text-decoration:none; font-family:var(--mono); font-weight:800; font-size:15px; color:hsl(153,88%,75%); } .pt-r.bn u { color:#2b7cff; } .pt-r.old { opacity:.8; }
  .pt-fl { padding:2px 0 8px; } .pt-fl select { width:100%; height:34px; border-radius:10px; border:1px solid var(--border); background:rgba(255,255,255,0.07); font-family:var(--ui); font-size:13px; padding:0 8px; } .pt-sum { font-size:12px; color:var(--text-dim); padding:2px 2px 6px; } .pt-more { width:100%; margin-top:10px; } .pf-lastpts { margin:2px 0 10px; }
  .fr-row { gap:14px; } .fr-it { display:flex; flex-direction:column; align-items:center; gap:3px; min-width:62px; font-size:11px; } .fr-it .pf-av { width:38px; height:38px; flex:none; } .fr-nm { font-weight:700; } .fr-st { font-size:10px; color:var(--text-dim); } .fr-it.on .fr-st { color:hsl(153,88%,75%); font-weight:800; } .fr-it.lock { opacity:.5; }
  /* v6.1.1: jednorazové odmeny = modré tokeny */
  .lv-rw.once { background:hsla(215,85%,62%,0.16); color:hsl(209,77%,80%); } .lv-rw.once b { color:#2b6fd6; } .lv-row.cur .lv-rw.once { background:hsla(215,85%,62%,0.16); } .lv-leg .once { background:hsla(215,85%,62%,0.16); color:hsl(209,77%,80%); } .lv-leg .once b { color:#2b6fd6; }
  .bst-t.has b { color:#2b6fd6; } .tk-pg { display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 2px; } .tk-pg span { padding:5px 10px; border-radius:99px; background:hsla(215,85%,62%,0.16); color:hsl(209,77%,80%); font-weight:700; font-size:12px; } .tk-pg span i { font-style:normal; color:#2b6fd6; font-weight:800; margin-right:4px; } .tk-pg span.lk { opacity:.55; }
  .pf-act { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin:0 0 10px; font-size:12.5px; } .pf-act b { font-family:var(--mono); font-size:10px; letter-spacing:.14em; color:var(--text-dim); } .pf-act span { padding:3px 10px; border-radius:99px; background:rgba(120,140,130,.14); } .pf-act .btn { height:28px; padding:0 12px; font-size:11px; }
  /* v6.1.5: zamknutý modul */
  .mods-card.locked { cursor:not-allowed; filter:grayscale(0.85); opacity:0.62; } @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .mods-card.locked:hover { transform:none; box-shadow:0 1px 0 hsl(var(--ah) calc(48% * var(--asf)) 8% / 0.06); } }
  .mods-lock { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); padding:7px 14px; border-radius:99px; background:hsl(var(--ah) calc(48% * var(--asf)) 8% / 0.82); color:#fff; font-family:var(--mono); font-size:11px; letter-spacing:0.12em; white-space:nowrap; }
  /* ===== telefón a úzke okná ===== */
  @media (max-width:1100px) {
    body.fs-on .qcard.split > .map-wrap { width:auto; }
  }
  @media (max-width:760px) {
    .app { padding:12px 10px 60px; }
    .panel-head { flex-wrap:wrap; gap:10px; padding:12px 14px; }
    .stats { flex-wrap:wrap; gap:6px; }
    .fs-btn { padding:6px 10px; font-size:10.5px; }
    .qcard, .qcard.split { padding:16px 12px; }
    .controls { padding:14px 12px; }
    .choice-grid { gap:8px; }
    .choice-btn { padding:14px 8px; font-size:14px; }
  }

  @media (max-width:760px) {
    .aircraft-display { grid-template-columns:1fr; }
    .big-prompt { font-size:44px; }
    .big-prompt.small { font-size:28px; }
    .tab .tab-label { font-size:11px; }
    .qcard { padding:20px 16px; }
    .tabs { grid-template-columns:repeat(2,1fr); }
    .map-prompt .mp-name { font-size:34px; }
  }
  @keyframes blink { 0%,100% { opacity:1; } 50% { opacity:0.3; } }
  .blink { animation:blink 1.4s infinite; }
  @keyframes pulse-loading { 0%,100% { opacity:0.4; } 50% { opacity:1; } }

  /* --- v5.1: opravy z testu na telefóne a tablete --- */
  .tab { min-width:0; overflow:hidden; } .tab-label, .tab-num { display:block; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  header.hd2 { min-width:0; } header.hd2 .head-r { min-width:0; flex:none; } .brand2 { min-width:0; } .brand2 > span { overflow:hidden; text-overflow:ellipsis; }
  .pf-card { min-width:0; } .pf-kv { min-width:0; } .pf-kv b { overflow-wrap:anywhere; min-width:0; } .pf-cards { grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); }
  @media (hover:none), (max-width:640px) { .choice-btn::before { content:none; } }
  @media (max-width:640px) {
    header.hd2 { grid-template-columns:minmax(0,1fr) auto; gap:8px; padding:8px 10px; } .brand2 { padding:6px 6px; font-size:14px; gap:6px; letter-spacing:0.08em; } .beta { font-size:9px; padding:2px 6px; }
    .acct-btn.in { height:38px; padding:0 4px; gap:0; border-width:1.5px; box-shadow:0 3px 0 hsl(var(--ah) calc(67% * var(--asf)) 12%); } .acct-btn.in span, .acct-btn.in em { display:none; } .acct-btn.in img, .acct-btn.in u { width:28px; height:28px; font-size:14px; }
    .acct-btn:not(.in) { height:36px; padding:0 12px; font-size:11px; } .inbox-btn { width:34px; height:34px; flex:none; }
    .panel { border-radius:22px; } .pg { margin:0 16px; } .choice-btn { padding:14px 10px; font-size:14.5px; border-radius:16px; }
    .pfx-kpis b { font-size:19px; } .wkt-g { grid-template-columns:1fr; } .sx-grid { grid-template-columns:1fr; } .sx-top { grid-template-columns:1fr; } .fx-add .pf-add { flex-basis:100%; }
    .dqh-hero h2 { font-size:34px; } .dqh-demo { grid-template-columns:auto 1fr; padding:14px; } .dqh-demo b { font-size:16px; } .st-photo { flex-wrap:wrap; } .au-side ul { grid-template-columns:1fr; }
  }
  /* telefón naležato: nízka obrazovka — hlavička a lišta v jednom riadku, menšie medzery */
  @media (orientation:landscape) and (max-height:540px) {
    header.hd2 { padding:5px 12px; } .brand2 { font-size:15px; padding:4px 10px; } .acct-btn.in { height:36px; } .acct-btn.in img, .acct-btn.in u { width:26px; height:26px; } .acct-btn.in em { display:none; } .inbox-btn { width:32px; height:32px; }
    .tabs.nav2 { grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:6px; } .tab { padding:6px 10px; } .tab-num { display:none; }
    .pfx { padding:12px 16px; } .pfx-kpis { grid-template-columns:repeat(4,1fr); margin-top:10px; } .pfx-av .pf-av.big { width:56px; height:56px; font-size:24px; } .pfx-xp small { display:none; }
    .dqh-hero { grid-template-columns:1.2fr 1fr; padding:14px 18px; } .dqh-hero h2 { font-size:30px; } .dqh-play { grid-template-columns:0.8fr 1fr 1fr; } .dqh-card { padding:12px; } .dqh-card.who { grid-column:auto; }
    .rl-stage { aspect-ratio:auto; height:78vh; } .hp, .gal-box, .hp.lv, .hp.wkl { max-height:94vh; } .lv-list, .wkl-list { max-height:52vh; } .ch-log { height:48vh; }
    .home-hero h1 { font-size:24px; } .hh-tiles { grid-template-columns:repeat(4,1fr); } .wkt-g { grid-template-columns:1fr 1fr; } .au { grid-template-columns:1fr 1.2fr; } .au-side ul { display:none; }
  }
  /* tablet */
  @media (min-width:641px) and (max-width:1024px) { .acct-btn.in span { max-width:90px; } .st { grid-template-columns:1fr; } .dqh-play { grid-template-columns:1fr 1fr; } .dqh-card.who { grid-column:1 / -1; } .rkm-lab small { display:none; } }

  /* v6.1.9 — dotykové zariadenia: väčšia klikacia plocha a písmo 16 px v poliach (iOS inak priblíži stránku) */
  :root { --ease-out: cubic-bezier(0.23, 1, 0.32, 1); --spring-soft: cubic-bezier(0.2, 0.9, 0.3, 1.1); --spring: cubic-bezier(0.2, 0.9, 0.3, 1.25); --spring-strong: cubic-bezier(0.2, 0.9, 0.3, 1.45); }
  @media (pointer:coarse) {
    input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=button]):not([type=submit]), select, textarea { font-size:16px !important; }
    .demo-btn, .set-btn, .qm { position:relative; }
    .news-btn::after, .inbox-btn::after, .demo-btn::after, .set-btn::after, .qm::after { content:''; position:absolute; inset:-8px; }
    .qm::after { inset:-14px; }
    .sf-col a { padding-block:10px; }
    .intro a, .hh a { padding-block:10px; }
  }

  /* v6.1.11 — čo sa nezmestí, dá sa posunúť; porovnanie 4 lietadiel = 4 malé obrázky pod sebou */
  .tbl-scroll { max-width:100%; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; scrollbar-width:thin; } .tbl-scroll > table { min-width:100%; }
  .rk-tbl, .ab-tbl, .cmp-tbl { scrollbar-width:thin; } .rk-tbl table, .tbl-scroll table { max-width:none; }
  @media (max-width:600px) {
    .cmp-grid.n4 { grid-template-columns:1fr; gap:8px; }
    .cmp-grid.n4 .cmp-card { display:grid; grid-template-columns:clamp(120px, 40%, 230px) 1fr; grid-template-rows:1fr 1fr; column-gap:12px; align-items:center; padding:6px; }
    .cmp-grid.n4 .cmp-card .aircraft-photo { grid-column:1; grid-row:1 / span 2; width:100%; height:auto; max-height:none; aspect-ratio:16 / 10; }
    .cmp-grid.n4 .cmp-n { grid-column:2; grid-row:1; align-self:end; margin:0; }
    .cmp-grid.n4 .cmp-name { grid-column:2; grid-row:2; align-self:start; margin:0; font-size:15px; }
    .cmp-grid.n4 .zm-b { left:12px; right:auto; top:12px; width:28px; height:28px; font-size:13px; }
  }
  /* lietadlá sa nesmú orezávať a spodný riadok má rezervu (lišta prehliadača na telefóne a tablete) */
  .cmp-grid { padding-bottom:calc(14px + env(safe-area-inset-bottom)); } .cmp-card { scroll-margin:12px 0 96px; }
  @media (max-width:1100px), (pointer:coarse) { .cmp-card .aircraft-photo { background:hsla(150,17%,62%,0.16); } .cmp-card .aircraft-photo img { object-fit:contain; } .aircraft-photo img { object-fit:contain; } }

  /* v6.1.13 — mapa rebríčka: zamknutá oblasť MOD 14 (sivá, bez držiteľa) */
  .rkm-c.lock { fill:#2c3833; stroke-dasharray:14 9; cursor:not-allowed; } .rkm-c.lock.hov, .rkm-c.lock:hover { filter:none; }
  .rkm-lab.lock { border-left-color:#5b6b63; background:hsl(var(--ah) calc(47% * var(--asf)) 6% / 0.8); cursor:not-allowed; opacity:0.78; } .rkm-lab.lock span > b { color:#b9c7c0; font-size:11px; letter-spacing:0.06em; } .rkm-lab.lock > i { color:#7d9087; }
  .rkm-lab.lock.set { opacity:0.78; } .rkm-lab.lock:hover, .rkm-lab.lock.hov { transform:translate(-50%, 0); }
  .rkm-lab.lock.up:hover, .rkm-lab.lock.up.hov { transform:translate(-50%, -100%); }
  .rkm-tbl tr.lock { opacity:0.6; cursor:not-allowed; filter:grayscale(0.7); }
  .rkm-lab.lock { border:2px solid #5b6b63; } .rkm-lab.lock span::before { content:'🔒'; display:block; width:30px; line-height:30px; font-size:14px; text-align:center; } .rkm-lab.lock span > b { font-size:8.5px; letter-spacing:0.04em; }

  /* v6.1.15 — mód správcu: červené tlačidlo na vymazanie otázky (vidí ho len Denzy) */
  .dq-aip, .gq-aip { display:inline-flex; align-items:center; text-decoration:none; font-weight:800; margin:8px 8px 0 0; } .gq-aip { margin:0; height:42px; padding:0 22px; font-size:13px; border-color:#2f6fe0; color:hsl(215,73%,77%); background:hsla(217,85%,62%,0.16); } .dq-aip { color:#fff; background:#2f6fe0; border-color:#2f6fe0; } .dq-aip:active, .gq-aip:active { transform:scale(0.97); }
  /* mená hráčov v Dobyvateľovi: pozadie lišty je farba hráča, text sa prispôsobí svetlosti farby */
  #dq-stage .dq-chip { background:var(--c); color:var(--tx,#fff); border-color:rgba(255,255,255,0.28); }
  #dq-stage .dq-chip span, #dq-stage .dq-chip em, #dq-stage .dq-chip small, #dq-stage .dq-chip b { color:var(--tx,#fff); text-shadow:none; }
  #dq-stage .dq-chip i { box-shadow:0 0 0 2px rgba(255,255,255,0.9); }
  #dq-stage .dq-chip.act { border-color:rgba(255,255,255,0.16); box-shadow:0 0 0 3px rgba(255,255,255,0.55); background:var(--c); }
  #dq-stage .dq-chip s { background:rgba(0,0,0,0.6); padding:1px 7px; border-radius:99px; }
  .dq-qmv { background:#2f6fe0 !important; border-color:#2f6fe0 !important; color:#fff !important; font-weight:800; margin:8px 8px 0 0 !important; } .dq-qmv:active { transform:scale(0.97); }
  .qmv { max-width:560px; } .qmv-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:6px; margin:10px 0; max-height:46vh; overflow:auto; } .qmv-grid .btn { font-size:12px; height:auto; min-height:36px; padding:6px 10px; text-align:left; transition:transform 0.16s var(--ease-out), background 0.16s ease; } .qmv-grid .btn.on { background:#2f6fe0; border-color:#2f6fe0; color:#fff; } .qmv-grid .btn:active { transform:scale(0.97); } .qmv .rk-reset[disabled] { opacity:0.4; pointer-events:none; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) .dq-qmv:hover { background:#1f56bd !important; } }
  #btn-qdel { background:#d62839 !important; border-color:#d62839 !important; color:#fff !important; font-weight:800; } #btn-qdel:active { transform:scale(0.97); } .dq-qdel { background:#d62839 !important; border-color:#d62839 !important; color:#fff !important; font-weight:800; margin:8px 0 0 !important; }
  @media (hover:hover) and (pointer:fine) { :where(html:not(.touch)) #btn-qdel:hover, :where(html:not(.touch)) .dq-qdel:hover { background:#b81e2e !important; } }

/* ===== LIQUID GLASS (v6.8.0): doladenie po automatickom prevode v nastroje/sklo.py — rovnaký jazyk ako úvodná stránka ===== */
:root{--bg:#030a1c;--panel:rgba(255,255,255,.07);--panel-2:rgba(255,255,255,.05);--border:rgba(255,255,255,.13);--border-bright:rgba(255,255,255,.28);
--green:hsl(var(--ah) calc(75% * var(--asf)) 60%);--green-strong:hsl(var(--ah) calc(75% * var(--asf)) 57%);--green-dim:hsl(var(--ah) calc(52% * var(--asf)) 71%);--green-bg:hsl(var(--ah) calc(75% * var(--asf)) 57% / .14);--amber:#ffc454;--amber-bg:rgba(255,196,84,.14);--red:#ff8f8f;--red-bg:rgba(255,107,107,.15);
--text:#eaf1ff;--text-dim:#b3c3dc;--text-faint:#8497b3;--ink:#fff;
--shadow:0 10px 30px rgba(0,0,0,.35);--shadow-btn:0 8px 22px hsl(var(--ah) calc(88% * var(--asf)) 33% / .35);
--d-sh:0 8px 24px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.09);--d-sh2:0 16px 40px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.14);
--gl:rgba(255,255,255,.07);--gl2:rgba(255,255,255,.11);--gl-line:1px solid rgba(255,255,255,.12)}
html,body{background:#030a1c;color:var(--text)}
/* predvolené pozadie je modrý radar ako na úvode; odmeny za úrovne (data-bg) majú vlastné filtre */
html:not([data-bg]) #radar-bg,html:not([data-bg]) #radar-sweep,html[data-bg=""] #radar-bg,html[data-bg=""] #radar-sweep{filter:hue-rotate(65deg) saturate(1.1)}
body::after{background:radial-gradient(ellipse at 50% 40%,transparent 35%,rgba(2,6,18,.6) 100%)}
/* hlavný panel a okná: zamrznuté sklo */
.panel{background:rgba(8,18,40,.5);border:1px solid rgba(255,255,255,.13);-webkit-backdrop-filter:blur(22px) saturate(1.3);backdrop-filter:blur(22px) saturate(1.3);box-shadow:0 30px 80px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.12)}
.hp,.gal-box,.mods,.rk-modal-in,.mp-in,#xp-wrap > div,.lv,.wkl,.frp,.au{background:rgba(10,20,44,.72);border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(26px) saturate(1.3);backdrop-filter:blur(26px) saturate(1.3);color:var(--text)}
/* karty: priesvitná výplň, jemná linka a odlesk hore (bez vlastného rozmazania kvôli výkonu) */
.pf-card,.pf-act,.dqh-card,.st-card,.sx-card,.ch-row,.ch,.rk-tbl,.dq-box,.wk-bar,.ab-mod,.ab-sec,.stat,.choice-btn,.wkt,.dyt,.wkt-g > div,.mods-card,.home-cta.alt,.hh-t,.ff,.filter-chip,.rk-chip,.set-btn,.hp-open,.weak-item{border:1px solid rgba(255,255,255,.11)}
.wkt,.dyt,.ff{background:rgba(255,255,255,.06);color:var(--text)}
.qcard input[type="text"],.qcard input[type="number"],.rk-form input,.pf-form input,.pf-add input,.pf-add select,.home-search input,.rk-pick select,.au-form input,textarea,select{background:rgba(0,0,0,.32);color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.16)}
input::placeholder,textarea::placeholder{color:#7f93b3}
select option{background:#0b1730;color:#fff}
.rk-tbl table,.rk-tbl th,.rk-tbl td{color:var(--text)}.rk-tbl th{background:rgba(255,255,255,.06)}.rk-tbl tr.me td{background:hsl(var(--ah) calc(75% * var(--asf)) 57% / .12)}
.btn{position:relative;overflow:hidden}
.btn.ghost,.set-btn,.hp-open{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.btn::after{content:'';position:absolute;top:0;bottom:0;left:-70%;width:45%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.34),transparent);transform:skewX(-20deg);transition:left .6s var(--ease-out);pointer-events:none}
@media (hover:hover) and (pointer:fine){:where(html:not(.touch)) .btn:hover::after{left:125%}}
.choice-btn kbd{background:rgba(255,255,255,.12);color:#fff}
/* rola pod menom */
.kd{display:inline-flex;align-items:center;gap:6px;margin-top:6px;padding:3px 11px;border-radius:99px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);font-size:12px;font-weight:700;letter-spacing:.03em;color:#dbe7ff}
.kd-pick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}.kd-pick button{padding:12px 8px;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:var(--text);font:inherit;font-weight:700;cursor:pointer;transition:transform .18s var(--ease-out),border-color .18s,background .18s}
.kd-pick button b{display:block;font-size:22px;line-height:1.2}.kd-pick button small{display:block;font-weight:500;font-size:11.5px;color:var(--text-dim)}
.kd-pick button.on{border-color:#3fe39a;background:rgba(63,227,154,.16)}.kd-pick button:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){:where(html:not(.touch)) .kd-pick button:hover{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.1)}}
.mods-rec{position:absolute;right:8px;top:8px;z-index:2;padding:3px 9px;border-radius:99px;background:hsl(var(--ah) calc(75% * var(--asf)) 57%);color:hsl(var(--ah) calc(70% * var(--asf)) 5%);font-size:10.5px;font-weight:800;letter-spacing:.06em}
/* odhaľovanie pri skrolovaní tam, kde to prehliadač vie bez skriptu */
@supports (animation-timeline:view()){@media (prefers-reduced-motion:no-preference){.sx-card,.ab-sec,.pf-card,.st-card,.ch-row,.wkt,.dyt,.home-steps > div,.ab-mod{animation:skloIn linear both;animation-timeline:view();animation-range:entry 0% entry 45%}}}
@keyframes skloIn{from{opacity:.25;transform:translateY(22px)}to{opacity:1;transform:none}}
.hh-acts .btn{height:42px;display:inline-flex;align-items:center}
/* doladenie miest, kde automatický prevod nestačil (nájdené kontrolou kontrastu) */
.pf-ach-g .lock{background:rgba(255,255,255,.04)}.pf-ach-g .lock b,.pf-ach-g .lock span,.pf-ach-g .lock small{color:var(--text-dim)}
.btn-hint{background:rgba(255,196,84,.14);color:#ffc454;border-color:rgba(255,196,84,.4)}
.mz-bar button{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.18)}
.lv-b i{color:#cfe0ff}.lv-rw b{color:#ffd34d}.lv-rw small{color:var(--text-dim)}
.qcard a:not([class]){color:hsl(var(--ah) calc(81% * var(--asf)) 68%)}.qcard th{color:#dbe7ff;background:rgba(255,255,255,.07)}
.pf-achf .on{background:var(--d-grad);color:var(--ac-ink)}
/* ===== ÚVOD v6.9.0: kompaktný prehľad, rýchly štart, Hra na kurzy ===== */
.home-hello.hx{margin:6px 0 14px;padding:22px;border-radius:26px;background:radial-gradient(circle at 100% 0,hsl(var(--ah) calc(75% * var(--asf)) 57% / .16),transparent 55%),rgba(10,20,44,.55);border:1px solid rgba(255,255,255,.13);box-shadow:0 24px 60px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.12);color:var(--text)}
.hx-top{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.hx-top .pf-av.big{flex:none}
.hx-id{flex:1;min-width:180px}.hx-id small{display:block;font-size:12.5px;color:var(--text-dim);font-weight:600}.hx-id h2{margin:0;font-family:var(--display);font-size:clamp(24px,3.4vw,34px);line-height:1.1;color:#fff}
.hx-meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:6px}.hx-meta .kd{margin-top:0}
.kd i{font-style:normal}
.hx-lg{display:inline-flex;align-items:center;padding:3px 11px;border-radius:99px;font-size:12px;font-weight:700;letter-spacing:.03em;color:#fff;background:color-mix(in srgb,var(--c) 30%,transparent);border:1px solid color-mix(in srgb,var(--c) 60%,transparent)}
.hx-cta{display:flex;gap:8px;flex-wrap:wrap}.hx-cta .btn{height:46px;padding:0 22px;display:inline-flex;align-items:center}
.hx-lvl{display:block;width:100%;margin:16px 0 0;padding:12px 14px;border-radius:16px;border:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.25);color:var(--text);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,background .2s}
.hx-lvl span{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:13.5px}.hx-lvl b{color:#fff}.hx-lvl em{font-style:normal;color:var(--text-dim)}
.hx-lvl i{display:block;height:8px;margin-top:8px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden}.hx-lvl u{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,hsl(var(--ah) calc(79% * var(--asf)) 46%),#ffd34d);transition:width .6s var(--ease-out)}
.hx-kpis{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin-top:12px}
.hx .hh-t{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:var(--text);transition:transform .2s var(--ease-out),border-color .2s,background .2s}.hx .hh-t b{color:#fff}.hx .hh-t small{color:var(--text-faint)}.hx .hh-t span{color:var(--text-dim)}
@media (hover:hover) and (pointer:fine){:where(html:not(.touch)) .hx .hh-t:hover,:where(html:not(.touch)) .hx-lvl:hover{border-color:hsl(var(--ah) calc(75% * var(--asf)) 57% / .5);background:rgba(255,255,255,.1)}:where(html:not(.touch)) .hx .hh-t:hover{transform:translateY(-2px)}}
.hx-g{text-align:center;padding:14px 6px 6px}.hx-k{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.28em;color:var(--green)}
.hx-g h1{margin:10px auto 12px;max-width:760px;font-family:var(--display);font-size:clamp(28px,5vw,46px);line-height:1.1;color:#fff}.hx-g h1 em{font-style:normal;background:linear-gradient(90deg,hsl(var(--ah) calc(75% * var(--asf)) 57%),#9bf6ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.hx-g p{max-width:660px;margin:0 auto 18px;color:var(--text-dim)}.hx-g .hx-cta{justify-content:center}.hx-links{margin-top:12px;display:flex;gap:16px;justify-content:center;font-size:13.5px}.hx-links a{color:var(--text-dim)}
.qs{margin:0 0 14px}.qs-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:4px 2px 10px}.qs-h h3{margin:0;font-family:var(--display);font-size:16px;letter-spacing:.06em;color:#fff}.qs-h h3 em{font-style:normal;font-weight:600;font-size:12.5px;letter-spacing:0;color:var(--text-dim)}.qs-h .btn{height:36px;padding:0 16px;font-size:12px;display:inline-flex;align-items:center}
.qs-grid{grid-template-columns:repeat(4,1fr);gap:10px}@media(max-width:900px){.qs-grid{grid-template-columns:1fr 1fr}}
.hdg{display:grid;grid-template-columns:minmax(120px,220px) 1fr;gap:18px;align-items:center;margin-top:10px;padding:14px;border-radius:22px;background:radial-gradient(circle at 0 0,rgba(255,166,77,.18),transparent 60%),rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}
.hdg-pic{border-radius:16px;overflow:hidden;aspect-ratio:16/10}.hdg-pic svg{width:100%;height:100%;display:block}
.hdg-txt small{display:block;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.16em;color:#ffb76b}.hdg-txt b{display:block;font-family:var(--display);font-size:22px;color:#fff;margin:2px 0}.hdg-txt span{display:block;color:var(--text-dim);font-size:14px;max-width:620px}
.hdg-b{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.hdg-b .btn{height:40px;padding:0 18px;font-size:12px;display:inline-flex;align-items:center}
@media(max-width:620px){.hdg{grid-template-columns:1fr}.hdg-pic{display:none}.hx-cta{width:100%}.hx-cta .btn{flex:1;justify-content:center}}
/* DNES a úlohy týždňa: kompaktnejšie, ťažké úlohy zlaté */
.dyt,.wkt{margin-top:12px;padding:14px 16px;border-radius:22px}
.wkt-g{grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:8px}.wkt-g > div{padding:9px 11px;border-radius:14px;background:rgba(255,255,255,.05)}
.wkt-g > div.el{border-color:rgba(255,211,77,.45);background:linear-gradient(135deg,rgba(255,211,77,.12),rgba(255,255,255,.04))}.wkt-g > div.el small{color:#ffd34d}
.wkt-g > div.ok{border-color:#3fe39a}.wkt-g s{background:rgba(255,255,255,.1)}
.kd-emo button{font-size:20px}
/* ===== kruh okolo profilovky podľa úrovne VŠADE (v7.0.0): !important prebije miestne tiene v profile, nastaveniach a kartách priateľov ===== */
.pf-av.fr1,.pf-ring.fr1{box-shadow:0 0 0 2px #0b1730,0 0 0 4px #6f7bff!important}
.pf-av.fr2,.pf-ring.fr2{box-shadow:0 0 0 2px #0b1730,0 0 0 4px #a05cff!important}
.pf-av.fr4,.pf-ring.fr4{box-shadow:0 0 0 2px #0b1730,0 0 0 4px #ff8a1f,0 0 10px #ff8a1f!important}
.pf-av.fr5,.pf-ring.fr5{box-shadow:0 0 0 2px #0b1730,0 0 0 4px #ff6b6b,0 0 12px #ff6b6b!important}
.pf-av.fr6,.pf-ring.fr6{box-shadow:0 0 0 2px #0b1730,0 0 0 4px #d9b3ff,0 0 14px #c58cff!important}
.pf-ring.fr3{animation:frRadar 2.4s ease-in-out infinite}.pf-ring.fr7{animation:frGold 2s ease-in-out infinite}.pf-ring.fr8{animation:frPlat 1.8s ease-in-out infinite}.pf-ring.fr9{animation:frLeg 1.6s ease-in-out infinite}
.acct-btn.in img.pf-ring,.acct-btn.in u.pf-ring{margin:3px 2px 3px 4px}
.hdg.weak{background:radial-gradient(circle at 0 0,rgba(255,107,107,.2),transparent 60%),rgba(255,255,255,.05);border-color:rgba(255,143,143,.35)}.hdg.weak .hdg-txt small{color:#ff9d9d}.hdg-txt strong{color:#fff}

/* ===== FARBA ROZHRANIA (v7.1.0): témy menia odtieň --ah, ktorým sklo.accent() nahradilo všetky zelené farby. Tento súbor sa pripája až po prevode. ===== */
:root{--ah:153;--asf:1;--ac-ink:#fff}
html[data-ac="blue"]{--ah:214;--asf:1.05}
html[data-ac="yellow"]{--ah:50;--asf:1.1;--ac-ink:#1a1500}
html[data-ac="red"]{--ah:355;--asf:1}
html[data-ac="gold"]{--ah:37;--asf:.78;--ac-ink:#1c1300}
/* výber farby vo Vzhľade */
.ac-pick{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:8px}
.ac-pick button{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#eaf1ff;font:inherit;cursor:pointer;transition:transform .18s cubic-bezier(.23,1,.32,1),border-color .18s,background .18s}
.ac-pick i{width:34px;height:34px;border-radius:50%;background:var(--sw);box-shadow:0 0 0 2px rgba(255,255,255,.25),0 6px 14px rgba(0,0,0,.35)}
.ac-pick b{font-size:12.5px}.ac-pick small{font-size:10.5px;color:#a9bdd6}
.ac-pick button.on{border-color:var(--sw);background:rgba(255,255,255,.12)}.ac-pick button.lock{opacity:.5;cursor:not-allowed}.ac-pick button.lock i{filter:grayscale(.6)}
.ac-pick button:not(.lock):active{transform:scale(.96)}
@media (hover:hover) and (pointer:fine){:where(html:not(.touch)) .ac-pick button:not(.lock):hover{border-color:rgba(255,255,255,.4);transform:translateY(-2px)}}
@media(max-width:520px){.ac-pick{grid-template-columns:repeat(3,1fr)}}
/* novinky na úvode */
.hn{margin:0 0 14px}.hn-g{display:grid;grid-template-columns:1fr 1fr;gap:10px}@media(max-width:760px){.hn-g{grid-template-columns:1fr}}
.hn article{padding:14px 16px;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.11)}
.hn-t{display:flex;align-items:center;gap:8px;margin-bottom:4px}.hn-t em{font-style:normal;font-family:var(--mono);font-size:11px;font-weight:800;padding:2px 9px;border-radius:99px;background:hsl(var(--ah) calc(75% * var(--asf)) 57% / .16);color:hsl(var(--ah) calc(75% * var(--asf)) 66%)}.hn-t span{font-size:12px;color:#8497b3}
.hn article b{display:block;font-family:var(--display);font-size:16.5px;color:#fff}.hn article p{margin:3px 0 6px;font-size:13.5px;color:#b3c3dc}
.hn ul{margin:0;padding-left:18px;font-size:13px;color:#9fb1cc}.hn li{margin:3px 0}