/* ════════════════════════════════════════════════════════════════════════════
   NYXIUM · EXPLORER UI
   Kompletní redesign z gaming/neon stylu do Windows 11 File Explorer (Fluent).
   Autor: N4 (Designer)  ·  2026-08-04
   ────────────────────────────────────────────────────────────────────────────
   • Fluent Design tokeny (Mica base, layer fills, control strokes, elevace)
   • 5 akcentových témat místo 13 neon témat
   • Pohyb v Apple stylu — cubic-bezier(.32,.72,0,1), žádné blikání a glow
   • Načítá se JAKO POSLEDNÍ, přebíjí launcher.css i inline <style> stránek
   ════════════════════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════════════
   1 · DESIGN TOKENY
   ══════════════════════════════════════════════════════════════════ */
:root{
  /* ── písmo ─────────────────────────────────────────────────────── */
  --fnt-ui: "Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI",
            system-ui, -apple-system, "Inter", "Helvetica Neue", Arial, sans-serif;
  --fnt-display: "Segoe UI Variable Display", "Segoe UI Variable", "Segoe UI",
            system-ui, -apple-system, "Inter", "Helvetica Neue", Arial, sans-serif;
  --fnt-mono: "Cascadia Code", "Cascadia Mono", "Consolas", ui-monospace,
            "SF Mono", "Menlo", monospace;

  /* ── Fluent: plné plochy (Mica) ────────────────────────────────── */
  --sol-base:    #202020;   /* okno */
  --sol-alt:     #1c1c1c;   /* pruhy, patka */
  --sol-tert:    #282828;   /* obsahová plocha */
  --sol-quart:   #2c2c2c;   /* vyvýšené panely */
  --mica:        #1f1f1f;

  /* ── Fluent: vrstvy a výplně ovládacích prvků ──────────────────── */
  --layer:            rgba(255,255,255,.0512);
  --layer-alt:        rgba(255,255,255,.0326);
  --ctrl:             rgba(255,255,255,.0605);
  --ctrl-hover:       rgba(255,255,255,.0837);
  --ctrl-press:       rgba(255,255,255,.0326);
  --subtle-hover:     rgba(255,255,255,.0605);
  --subtle-press:     rgba(255,255,255,.0419);
  --smoke:            rgba(0,0,0,.30);

  /* ── Fluent: obrysy ────────────────────────────────────────────── */
  --stroke:        rgba(255,255,255,.0698);
  --stroke-2:      rgba(255,255,255,.0930);
  --stroke-strong: rgba(255,255,255,.1395);
  --divider:       rgba(255,255,255,.0837);
  --ctrl-edge:     rgba(0,0,0,.24);          /* spodní hrana tlačítek */

  /* ── Fluent: text ──────────────────────────────────────────────── */
  --tx-1: #ffffff;
  --tx-2: rgba(255,255,255,.786);
  --tx-3: rgba(255,255,255,.5442);
  --tx-off: rgba(255,255,255,.3628);

  /* ── akcent (výchozí = Blue) ───────────────────────────────────── */
  --acc:        #4cc2ff;
  --acc-hi:     #79cfff;    /* hover  */
  --acc-lo:     #2e9fdd;    /* press  */
  --acc-deep:   #0078d4;    /* plné výplně */
  --acc-rgb:    76,194,255;

  /* ── sémantické ───────────────────────────────────────────────── */
  --folder:  #ffd149;       /* žlutá složka z Exploreru */
  --ok:      #6ccb5f;
  --warn:    #fce100;
  --err:     #ff99a4;

  /* ── typy souborů (barvy ikon) ────────────────────────────────── */
  --t-image: #5ac8fa;
  --t-video: #ff9f0a;
  --t-audio: #bf5af2;
  --t-doc:   #4c9aff;
  --t-zip:   #ffd60a;
  --t-code:  #32d74b;
  --t-other: #a8b3c2;

  /* ── rádiusy (Fluent) ──────────────────────────────────────────── */
  --r-ctrl:    4px;   /* tlačítka, inputy, položky seznamu */
  --r-card:    6px;
  --r-overlay: 8px;   /* flyouty, dialogy, menu */

  /* ── elevace ───────────────────────────────────────────────────── */
  --el-1: 0 1px 2px rgba(0,0,0,.28);
  --el-2: 0 2px 4px rgba(0,0,0,.28), 0 0 2px rgba(0,0,0,.20);
  --el-flyout: 0 8px 16px rgba(0,0,0,.28), 0 0 1px rgba(0,0,0,.40);
  --el-dialog: 0 32px 64px rgba(0,0,0,.42), 0 2px 21px rgba(0,0,0,.28);

  /* ── pohyb ─────────────────────────────────────────────────────── */
  --e-apple:   cubic-bezier(.32,.72,0,1);      /* hlavní „smooth“ křivka */
  --e-out:     cubic-bezier(0,0,0,1);          /* Fluent decelerate */
  --e-inout:   cubic-bezier(.6,0,.4,1);
  --e-spring:  cubic-bezier(.34,1.32,.62,1);
  --d-micro:   90ms;
  --d-fast:    150ms;
  --d-base:    250ms;
  --d-slow:    350ms;
  --d-page:    500ms;

  /* ── layout ───────────────────────────────────────────────────── */
  --navpane: 268px;
  --cmdbar:  46px;

  /* ── zpětná kompatibilita: staré proměnné webu ────────────────────
     Web používá --cyan/--magenta/… ve stovkách pravidel. Přemapováním
     zmizí neon glow globálně, bez zásahu do HTML stránek.            */
  --cyan:      var(--acc);
  --magenta:   var(--acc-hi);
  --yellow:    var(--folder);
  --green:     var(--ok);
  --orange:    #ffb357;
  --dark:      var(--sol-base);
  --dark2:     var(--sol-tert);
  --dark3:     var(--sol-quart);
  --card-bg:   var(--layer);
  --border:    var(--stroke);
  --grid-line: transparent;
  --text-color: var(--tx-1);
  --glow-cyan: var(--el-2);
  --glow-mag:  var(--el-2);
  --spring:    var(--e-spring);
  --ease-out:  var(--e-apple);
}

/* ══════════════════════════════════════════════════════════════════
   2 · PĚT AKCENTOVÝCH TÉMAT
   ══════════════════════════════════════════════════════════════════ */
/* přesná paleta Windows 11: Base #0078D4, Light1 #0093F9, Light2 #60CCFE */
html[data-theme="blue"], html:not([data-theme]){
  --acc:#60ccfe; --acc-hi:#98ecfe; --acc-lo:#0093f9; --acc-deep:#0078d4; --acc-rgb:96,204,254;
}
html[data-theme="teal"]{
  --acc:#4fd9c8; --acc-hi:#7ee6d9; --acc-lo:#2fb5a5; --acc-deep:#038387; --acc-rgb:79,217,200;
}
html[data-theme="purple"]{
  --acc:#b69bff; --acc-hi:#cdbcff; --acc-lo:#9277e0; --acc-deep:#8764b8; --acc-rgb:182,155,255;
}
html[data-theme="rose"]{
  --acc:#ff8fa6; --acc-hi:#ffb1c1; --acc-lo:#e26a83; --acc-deep:#c42b1c; --acc-rgb:255,143,166;
}
html[data-theme="green"]{
  --acc:#6ccb5f; --acc-hi:#93dc88; --acc-lo:#4fa844; --acc-deep:#107c10; --acc-rgb:108,203,95;
}
/* stará témata (13 neonů) padají na Blue — migraci řeší explorer.js */

/* ══════════════════════════════════════════════════════════════════
   3 · ODSTRANĚNÍ GAMING VRSTVY
   ══════════════════════════════════════════════════════════════════ */
#particles, .bg-grid, .scanlines, .corner-glow,
canvas#particles, .nyx-scanlines, .grid-overlay{
  display:none !important;
}
body::before, body::after,
html::before, html::after{
  content:none !important; display:none !important; background:none !important; animation:none !important;
}

/* liquid-glass vrstva (lg.css) — vypnuto, Explorer používá Mica */
.lg-on *::before, .lg-on *::after{ backdrop-filter:none !important; -webkit-backdrop-filter:none !important; filter:none !important; }
#lg-svg, svg#lg-svg{ display:none !important; }

/* fotografická pozadí témat pryč */
html body{
  background: var(--sol-base) !important;
  background-image:none !important;
}

/* žádné neon záře, glitch a text-shadow */
*, *::before, *::after{
  text-shadow:none !important;
}
.logo-main, .auth-logo, .logo-main::before, .logo-main::after,
.auth-logo::before, .auth-logo::after{
  animation:none !important; text-shadow:none !important; content:none !important;
}

/* ══════════════════════════════════════════════════════════════════
   4 · TYPOGRAFIE
   ══════════════════════════════════════════════════════════════════ */
body, body *{
  font-family: var(--fnt-ui) !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}
code, pre, kbd, samp, .code-view, .mc-json, .css-out, .fmt,
.sc-key, .mono, [data-mono], .viewer-text-body pre{
  font-family: var(--fnt-mono) !important;
}
html{
  font-size:15px;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  scroll-behavior:smooth;
}
body{
  font-size:14px; line-height:1.45; color:var(--tx-1);
  background:var(--sol-base);
}
h1,h2,h3,h4{ font-family:var(--fnt-display) !important; font-weight:600; color:var(--tx-1); }
::selection{ background:rgba(var(--acc-rgb),.35); color:#fff; }

/* ══════════════════════════════════════════════════════════════════
   5 · POSUVNÍKY (Win11 overlay — tenké, na hover se rozšíří)
   ══════════════════════════════════════════════════════════════════ */
*{ scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.26) transparent; }
::-webkit-scrollbar{ width:14px; height:14px; background:transparent; }
::-webkit-scrollbar-track{ background:transparent; border:none; }
::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.22);
  border:5px solid transparent; background-clip:padding-box;
  border-radius:10px;
  transition:background var(--d-fast) var(--e-out);
}
::-webkit-scrollbar-thumb:hover{ background:rgba(255,255,255,.42); background-clip:padding-box; border-width:4px; }
::-webkit-scrollbar-thumb:active{ background:rgba(255,255,255,.52); background-clip:padding-box; }
::-webkit-scrollbar-corner{ background:transparent; }

/* ══════════════════════════════════════════════════════════════════
   6 · ZÁHLAVÍ = TITLE BAR
   ══════════════════════════════════════════════════════════════════ */
header{
  max-width:none !important; width:100% !important; margin:0 !important;
  padding:0 !important;
  background:var(--mica);
  border-bottom:1px solid var(--divider);
  position:sticky; top:0; z-index:40;
}
.header-top{
  height:42px; display:flex; align-items:center; gap:10px;
  padding:0 14px; border-bottom:1px solid var(--divider);
}
.logo{ display:flex; align-items:center; gap:9px; }
.logo-img, .logo img{ width:18px !important; height:18px !important; filter:none !important; }
.logo-text{ display:flex; align-items:baseline; gap:8px; }
.logo-main{
  font-family:var(--fnt-display) !important;
  font-size:13px !important; font-weight:600 !important;
  color:var(--tx-1) !important; background:none !important;
  -webkit-text-fill-color:var(--tx-1) !important;
}
.logo-sub{ font-size:11.5px !important; color:var(--tx-3) !important; font-weight:400 !important; }

.header-bar{
  height:var(--cmdbar); display:flex; align-items:center; justify-content:space-between;
  gap:10px; padding:0 12px; border:0 !important; background:transparent;
}
.header-bar-left{ min-width:0; overflow:hidden; }
.header-bar-right{ display:flex; align-items:center; gap:6px; flex:0 0 auto; }

/* stavové pilulky → jemný text v Explorer stylu */
.stats-bar{ display:flex; gap:2px; flex-wrap:nowrap; overflow:hidden; }
.stat{
  background:transparent !important; border:0 !important; box-shadow:none !important;
  padding:4px 9px !important; border-radius:var(--r-ctrl);
  font-size:12px !important; color:var(--tx-3) !important; white-space:nowrap;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
.stat span{ color:var(--tx-3) !important; }
.stat span:last-child{ color:var(--tx-2) !important; font-variant-numeric:tabular-nums; }

.clock-widget{ text-align:right; padding-right:4px; }
.clock-time{
  font-size:12.5px !important; color:var(--tx-2) !important; font-weight:500;
  font-variant-numeric:tabular-nums; letter-spacing:normal !important;
}
.clock-date{ font-size:11px !important; color:var(--tx-3) !important; }

/* ══════════════════════════════════════════════════════════════════
   7 · PŘÍKAZOVÝ PRUH (command bar)
   ══════════════════════════════════════════════════════════════════ */
.toolbar{
  max-width:none !important; width:100% !important; margin:0 !important;
  min-height:var(--cmdbar);
  display:flex; align-items:center; gap:4px;
  padding:6px 12px !important;
  background:var(--mica);
  border:0 !important; border-bottom:1px solid var(--divider) !important;
  border-radius:0 !important; box-shadow:none !important;
  position:sticky; top:0; z-index:35;
}
.toolbar::before, .toolbar::after{ content:none !important; }

/* Fluent „subtle“ tlačítko */
.toolbar-btn, .sidebar-toggle, .vtb-btn, .card-btn, .viewer-btn, .fsb-x{
  height:32px; min-height:32px;
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  padding:0 11px !important;
  font-size:12.5px !important; font-weight:400 !important;
  color:var(--tx-1) !important;
  background:transparent !important;
  border:1px solid transparent !important;
  border-radius:var(--r-ctrl) !important;
  box-shadow:none !important;
  cursor:pointer;
  transition:background var(--d-micro) var(--e-out),
             border-color var(--d-micro) var(--e-out),
             color var(--d-micro) var(--e-out),
             transform var(--d-fast) var(--e-apple);
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
.toolbar-btn:hover, .sidebar-toggle:hover, .vtb-btn:hover, .card-btn:hover,
.viewer-btn:hover, .fsb-x:hover{
  background:var(--subtle-hover) !important;
  border-color:transparent !important;
  color:var(--tx-1) !important;
  transform:none !important;
}
.toolbar-btn:active, .sidebar-toggle:active, .vtb-btn:active, .card-btn:active,
.viewer-btn:active, .fsb-x:active{
  background:var(--subtle-press) !important;
  color:var(--tx-2) !important;
  transform:scale(.97) !important;
}
/* aktivní stav = akcentový podtržený „pill“ jako v Exploreru */
.toolbar-btn.active, .sidebar-toggle.active, .vtb-btn.active{
  background:var(--subtle-hover) !important;
  color:var(--tx-1) !important;
  position:relative;
}
.toolbar-btn.active::after, .sidebar-toggle.active::after{
  content:''; position:absolute; left:50%; bottom:3px; translate:-50% 0;
  width:16px; height:2.5px; border-radius:2px; background:var(--acc);
  animation:expActiveBar var(--d-base) var(--e-apple);
}
@keyframes expActiveBar{ from{ width:0; opacity:0 } to{ width:16px; opacity:1 } }
.toolbar-btn.mag{ color:var(--tx-1) !important; }
.toolbar-btn.mag:hover{ background:var(--subtle-hover) !important; }
.toolbar-btn i, .toolbar-btn svg{ margin:0 !important; width:16px !important; height:16px !important; opacity:.9; }
.sidebar-toggle{ width:34px; padding:0 !important; flex:0 0 auto; }

/* svislý oddělovač v příkazovém pruhu */
.toolbar .search-wrap + .sort-select::before{ content:none; }

/* vyhledávání = Explorer search box */
.search-wrap{ position:relative; flex:1 1 240px; max-width:340px; min-width:150px; }
.search-wrap::before{
  content:''; position:absolute; left:9px; top:50%; translate:0 -50%;
  width:14px; height:14px; opacity:.55; pointer-events:none; z-index:2;
  background:currentColor; color:var(--tx-2);
  -webkit-mask:no-repeat center/14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
          mask:no-repeat center/14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
}
#searchInput{ padding-left:29px !important; }

/* ══════════════════════════════════════════════════════════════════
   8 · FORMULÁŘOVÉ PRVKY (Fluent TextBox)
   ══════════════════════════════════════════════════════════════════ */
input[type="text"], input[type="password"], input[type="email"], input[type="number"],
input[type="search"], input[type="url"], input[type="tel"], input[type="date"],
input:not([type]), input.inp,
textarea, select, .st-select, .sort-select, .st-pw-input, .nyx-select-trigger, .nyxsel-trigger{
  height:32px; box-sizing:border-box;
  padding:0 10px;
  font-size:13px !important; color:var(--tx-1) !important;
  background:var(--ctrl) !important;
  border:1px solid var(--stroke) !important;
  border-bottom-color:var(--stroke-strong) !important;
  border-radius:var(--r-ctrl) !important;
  box-shadow:none !important;
  outline:none;
  transition:background var(--d-fast) var(--e-out), border-color var(--d-fast) var(--e-out);
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
textarea{ height:auto; min-height:76px; padding:8px 10px; line-height:1.5; resize:vertical; }
input::placeholder, textarea::placeholder{ color:var(--tx-3) !important; }
input:hover, textarea:hover, select:hover{ background:var(--ctrl-hover) !important; }

/* signature Fluent: akcentová linka rostoucí ze středu */
.input-group, .search-wrap, .st-pw-form, .field{ position:relative; }
input:focus, textarea:focus, select:focus{
  background:var(--sol-base) !important;
  border-color:var(--stroke) !important;
  border-bottom-color:var(--acc) !important;
  border-bottom-width:2px !important;
  padding-bottom:0;
}
input:focus-visible, textarea:focus-visible{ outline:none; }

.input-label, .st-label, .vip-title, .settings-section-title, .vf-title,
.auth-apps-label, .fsb-title, .modal-title, .settings-title{
  font-size:12px !important; font-weight:600 !important;
  color:var(--tx-2) !important; text-transform:none !important;
}
.settings-section-title, .auth-apps-label{
  color:var(--tx-3) !important; font-weight:600 !important; font-size:11.5px !important;
  margin-bottom:8px;
}

/* select — Explorer combo box */
select, .sort-select, .st-select{
  appearance:none; -webkit-appearance:none;
  padding-right:28px !important; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7'%3E%3Cpath d='M1 1.5 5 5.5 9 1.5' stroke='rgba(255,255,255,.62)' stroke-width='1.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:right 10px center !important;
}
select option{ background:var(--sol-quart); color:var(--tx-1); }

/* checkbox + radio */
input[type="checkbox"], input[type="radio"]{
  appearance:none; -webkit-appearance:none;
  width:20px !important; height:20px !important; min-width:20px;
  border:1px solid var(--tx-3) !important;
  border-radius:var(--r-ctrl) !important;
  background:var(--ctrl-press) !important;
  cursor:pointer; position:relative; flex:0 0 auto;
  transition:background var(--d-fast) var(--e-out), border-color var(--d-fast) var(--e-out);
}
input[type="radio"]{ border-radius:50% !important; }
input[type="checkbox"]:hover, input[type="radio"]:hover{ background:var(--ctrl-hover) !important; border-color:var(--tx-2) !important; }
input[type="checkbox"]:checked, input[type="radio"]:checked{
  background:var(--acc) !important; border-color:var(--acc) !important;
}
input[type="checkbox"]:checked::after{
  content:''; position:absolute; inset:0;
  background:#000; opacity:.85;
  -webkit-mask:no-repeat center/12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5 9.5 18 20 6.5'/%3E%3C/svg%3E");
          mask:no-repeat center/12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5 9.5 18 20 6.5'/%3E%3C/svg%3E");
  animation:expCheck var(--d-base) var(--e-spring);
}
@keyframes expCheck{ from{ transform:scale(.4); opacity:0 } to{ transform:scale(1); opacity:.85 } }
input[type="radio"]:checked::after{
  content:''; position:absolute; inset:5px; border-radius:50%; background:#000;
  animation:expCheck var(--d-base) var(--e-spring);
}

/* přepínač (toggle switch)
   POZOR: JEN .st-switch je skutečný přepínač (Nastavení v Cloudu, viz
   index.html `.st-switch.on span{left:24px}`). .tog a .mc-sw NEJSOU přepínače —
   .tog je <label> s checkboxem a textem (password, minecraft, kalkulačka),
   .mc-sw je řádek s barevným čtverečkem a názvem. Nedávat je sem zpátky. */
.st-switch{
  box-sizing:border-box !important; padding:0 !important;
  width:40px !important; height:20px !important; border-radius:10px !important;
  background:var(--ctrl-press) !important;
  border:1px solid var(--tx-3) !important;
  box-shadow:none !important; cursor:pointer; position:relative;
  transition:background var(--d-base) var(--e-apple), border-color var(--d-base) var(--e-apple);
}
.st-switch:hover{ background:var(--ctrl-hover) !important; }
.st-switch span{
  position:absolute; left:4px; top:50%; translate:0 -50%;
  width:12px !important; height:12px !important; border-radius:50% !important;
  background:var(--tx-1) !important; box-shadow:none !important;
  transition:left var(--d-base) var(--e-apple), width var(--d-fast) var(--e-out), background var(--d-base);
}
.st-switch:active span{ width:16px !important; }
.st-switch.on{ background:var(--acc) !important; border-color:var(--acc) !important; }
.st-switch.on span{ left:22px !important; background:#000 !important; }
.st-switch.on:active span{ left:18px !important; }

/* volitelný řádek: checkbox / barva + popisek (Fluent „selection card") */
.tog, .mc-sw{
  display:flex !important; align-items:center !important; gap:10px;
  width:auto !important; height:auto !important; min-height:36px;
  padding:9px 12px !important;
  background:var(--layer) !important;
  border:1px solid var(--stroke) !important;
  border-radius:var(--r-ctrl) !important;
  box-shadow:none !important; cursor:pointer; position:relative;
  transition:background var(--d-micro) var(--e-out), border-color var(--d-micro) var(--e-out);
}
.tog.mini{ display:inline-flex !important; }
/* samostatný řádek se smrskne na obsah, v mřížce .toggles vyplní buňku */
.tog{ width:fit-content !important; }
.toggles .tog{ width:auto !important; }
.tog:hover, .mc-sw:hover{
  background:var(--ctrl-hover) !important; transform:none !important; box-shadow:none !important;
}
/* pozice/rozměr resetovat, ale NE pozadí — .mc-chip má barvu v inline stylu */
.tog span, .mc-sw span{
  position:static !important; left:auto !important; top:auto !important; translate:none !important;
  width:auto !important; height:auto !important; border-radius:0 !important;
  font-size:12.5px !important; color:var(--tx-1) !important; line-height:1.35;
}
.mc-sw .mc-chip{
  width:14px !important; height:14px !important; border-radius:3px !important;
  flex:0 0 auto; box-shadow:inset 0 0 0 1px rgba(0,0,0,.35);
}
.mc-sw .mc-sw-code{ color:var(--acc) !important; font-family:var(--fnt-mono) !important; }
.mc-sw .mc-sw-name{ color:var(--tx-2) !important; }
.tog input{ width:18px !important; height:18px !important; min-width:18px; flex:0 0 auto; }
.tog:has(input:checked), .mc-sw.on, .mc-sw.sel{
  background:rgba(var(--acc-rgb),.14) !important;
  border-color:rgba(var(--acc-rgb),.5) !important;
}

/* posuvník (slider) */
input[type="range"], .st-range{
  appearance:none; -webkit-appearance:none;
  height:4px !important; padding:0 !important;
  background:var(--ctrl-hover) !important;
  border:0 !important; border-radius:2px !important;
  cursor:pointer;
}
input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none; width:20px; height:20px; border-radius:50%;
  background:var(--acc); border:4px solid var(--sol-base);
  box-shadow:0 0 0 1px var(--stroke-strong);
  transition:transform var(--d-fast) var(--e-spring), border-width var(--d-fast) var(--e-out);
}
input[type="range"]:hover::-webkit-slider-thumb{ border-width:3px; }
input[type="range"]:active::-webkit-slider-thumb{ border-width:5px; transform:scale(1.05); }
/* výběr souboru — nesmí ho zmáčknout flex rodič (na QR se scvrkl na 18 px) */
input[type="file"]{
  height:auto !important; min-height:32px;
  width:auto !important; min-width:190px;
  flex:1 1 auto !important;
  padding:6px 10px !important;
  color:var(--tx-2) !important; font-size:12.5px !important;
  cursor:pointer;
}
input[type="file"]::-webkit-file-upload-button{
  height:24px; margin-right:10px; padding:0 11px;
  background:var(--ctrl); color:var(--tx-1);
  border:1px solid var(--stroke); border-bottom-color:var(--ctrl-edge);
  border-radius:var(--r-ctrl);
  font-family:var(--fnt-ui); font-size:12.5px; cursor:pointer;
  transition:background var(--d-micro) var(--e-out);
}
input[type="file"]::-webkit-file-upload-button:hover{ background:var(--ctrl-hover); }

/* výběr barvy */
input[type="color"]{
  width:44px !important; height:32px !important; padding:2px !important;
  background:var(--ctrl) !important;
  border:1px solid var(--stroke) !important;
  border-radius:var(--r-ctrl) !important;
  cursor:pointer;
  transition:background var(--d-micro) var(--e-out), transform var(--d-fast) var(--e-apple);
}
input[type="color"]:hover{ background:var(--ctrl-hover) !important; }
input[type="color"]:active{ transform:scale(.96); }
input[type="color"]::-webkit-color-swatch-wrapper{ padding:0; }
input[type="color"]::-webkit-color-swatch{ border:0; border-radius:2px; }

input[type="range"]::-moz-range-thumb{
  width:14px; height:14px; border-radius:50%; background:var(--acc);
  border:3px solid var(--sol-base); box-shadow:0 0 0 1px var(--stroke-strong);
}

/* ══════════════════════════════════════════════════════════════════
   9 · TLAČÍTKA (Fluent Button / Accent Button)
   ══════════════════════════════════════════════════════════════════ */
.btn, button.btn, .st-action, .fsb-action, .upload-cancel-btn, .settings-logout,
.confirm-btns button, .button-row button, .vf-reset, .auth-tab{
  height:32px; min-height:32px;
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  padding:0 14px !important;
  font-size:13px !important; font-weight:400 !important;
  color:var(--tx-1) !important;
  background:var(--ctrl) !important;
  border:1px solid var(--stroke) !important;
  border-bottom-color:var(--ctrl-edge) !important;
  border-radius:var(--r-ctrl) !important;
  box-shadow:none !important; cursor:pointer;
  transition:background var(--d-micro) var(--e-out),
             border-color var(--d-micro) var(--e-out),
             transform var(--d-fast) var(--e-apple),
             color var(--d-micro) var(--e-out);
}
.btn:hover, .st-action:hover, .fsb-action:hover, .settings-logout:hover,
.confirm-btns button:hover, .button-row button:hover, .vf-reset:hover{
  background:var(--ctrl-hover) !important; transform:none !important;
}
.btn:active, .st-action:active, .fsb-action:active, .settings-logout:active,
.confirm-btns button:active, .button-row button:active{
  background:var(--ctrl-press) !important;
  border-bottom-color:var(--stroke) !important;
  color:var(--tx-2) !important;
  transform:scale(.975) !important;
}
.btn:focus-visible, button:focus-visible, a:focus-visible, [tabindex]:focus-visible{
  outline:2px solid var(--tx-1); outline-offset:1px;
  box-shadow:0 0 0 4px var(--sol-base) !important; border-radius:var(--r-ctrl);
}

/* primární = akcentové tlačítko */
.btn-primary, #authSubmit, .btn.btn-primary{
  background:var(--acc) !important;
  color:#000 !important;
  border-color:transparent !important;
  border-bottom-color:rgba(0,0,0,.28) !important;
  font-weight:600 !important;
}
.btn-primary:hover, #authSubmit:hover{ background:var(--acc-hi) !important; }
.btn-primary:active, #authSubmit:active{ background:var(--acc-lo) !important; color:rgba(0,0,0,.65) !important; }

.btn-secondary{ background:var(--ctrl) !important; color:var(--tx-1) !important; }
.btn-danger, .danger, .settings-logout{
  background:var(--ctrl) !important; color:var(--err) !important;
  border-color:var(--stroke) !important;
}
.btn-danger:hover, .danger:hover, .settings-logout:hover{
  background:rgba(255,153,164,.12) !important; color:#ffb3bc !important;
}

/* ══════════════════════════════════════════════════════════════════
   10 · ADRESNÍ ŘÁDEK (breadcrumb)
   ══════════════════════════════════════════════════════════════════ */
.breadcrumb{
  max-width:none !important; width:100% !important; margin:0 !important;
  min-height:38px;
  display:flex; align-items:center; gap:1px; flex-wrap:nowrap; overflow-x:auto;
  padding:5px 12px !important;
  background:var(--sol-base);
  border-bottom:1px solid var(--divider);
  scrollbar-width:none;
}
.breadcrumb::-webkit-scrollbar{ height:0; }
.breadcrumb-item{
  display:inline-flex; align-items:center; gap:5px;
  height:26px; padding:0 8px !important;
  font-size:12.5px !important; color:var(--tx-2) !important;
  background:transparent !important; border:0 !important;
  border-radius:var(--r-ctrl) !important;
  white-space:nowrap; cursor:pointer;
  transition:background var(--d-micro) var(--e-out), color var(--d-micro) var(--e-out);
}
.breadcrumb-item:hover{ background:var(--subtle-hover) !important; color:var(--tx-1) !important; }
.breadcrumb-item:active{ background:var(--subtle-press) !important; }
.breadcrumb-item.current{ color:var(--tx-1) !important; font-weight:600 !important; cursor:default; }
.breadcrumb-item.current:hover{ background:transparent !important; }
.breadcrumb-item i, .breadcrumb-item svg{ width:14px !important; height:14px !important; opacity:.8; }
.breadcrumb-sep{
  color:var(--tx-3) !important; font-size:11px; padding:0 1px; opacity:.7;
}

/* filtry typů → Explorer „chips“ */
.type-filters, .filter-tags{
  max-width:none !important; width:100% !important; margin:0 !important;
  padding:8px 12px 0 !important; display:flex; gap:6px; flex-wrap:wrap;
}
.type-chip, .filter-tag, .card-tag{
  height:28px; display:inline-flex; align-items:center; gap:6px;
  padding:0 11px !important;
  font-size:12px !important; color:var(--tx-2) !important;
  background:var(--ctrl) !important;
  border:1px solid var(--stroke) !important;
  border-radius:14px !important;
  box-shadow:none !important; cursor:pointer;
  transition:background var(--d-micro) var(--e-out), color var(--d-micro) var(--e-out),
             border-color var(--d-micro) var(--e-out);
}
.type-chip:hover, .filter-tag:hover{ background:var(--ctrl-hover) !important; color:var(--tx-1) !important; }
.type-chip.active, .filter-tag.active{
  background:var(--acc) !important; color:#000 !important;
  border-color:transparent !important; font-weight:600 !important;
}

/* ══════════════════════════════════════════════════════════════════
   11 · NAVIGAČNÍ PANEL (nav pane / strom složek)
   ══════════════════════════════════════════════════════════════════ */
#folderSidebar{
  width:var(--navpane) !important;
  background:var(--mica) !important;
  border:0 !important; border-right:1px solid var(--divider) !important;
  border-radius:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  transition:transform var(--d-slow) var(--e-apple) !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
#folderSidebar::before, #folderSidebar::after{ content:none !important; }

.fsb-header{
  height:42px; display:flex; align-items:center; justify-content:space-between;
  padding:0 8px 0 14px !important;
  border-bottom:1px solid var(--divider) !important;
  background:transparent !important;
}
.fsb-title{
  display:flex; align-items:center; gap:8px;
  font-size:12.5px !important; font-weight:600 !important; color:var(--tx-2) !important;
}
.fsb-title i, .fsb-title svg{ width:15px !important; height:15px !important; color:var(--acc); }
.fsb-x{ width:30px; height:30px; padding:0 !important; }

.fsb-actions{ padding:8px !important; border-bottom:1px solid var(--divider) !important; }
.fsb-action{
  width:100%; justify-content:flex-start !important;
  height:34px; gap:9px;
  background:transparent !important; border-color:transparent !important;
}
.fsb-action:hover{ background:var(--subtle-hover) !important; }
.fsb-action i, .fsb-action svg{ width:16px !important; height:16px !important; color:var(--folder); }

.fsb-tree{ padding:6px !important; }
.fsb-divider{ height:1px; background:var(--divider); margin:6px 8px !important; border:0 !important; }
.fsb-empty{ color:var(--tx-3) !important; font-size:12px !important; padding:10px 12px !important; }

/* položka stromu = Explorer TreeViewItem */
.fsb-row{
  height:32px;
  display:flex; align-items:center; gap:7px;
  padding:0 8px !important; margin:1px 0;
  border-radius:var(--r-ctrl) !important;
  border:0 !important; background:transparent !important;
  color:var(--tx-1) !important; font-size:13px !important;
  cursor:pointer; position:relative;
  transition:background var(--d-micro) var(--e-out);
}
.fsb-row:hover{ background:var(--subtle-hover) !important; }
.fsb-row:active{ background:var(--subtle-press) !important; }
.fsb-row.active, .fsb-node.active > .fsb-row{
  background:var(--ctrl-hover) !important;
}
/* akcentový indikátor vlevo — vyjede pružinou */
.fsb-row.active::before, .fsb-node.active > .fsb-row::before{
  content:''; position:absolute; left:0; top:50%; translate:0 -50%;
  width:3px; height:16px; border-radius:2px; background:var(--acc);
  animation:expNavBar var(--d-slow) var(--e-spring);
}
@keyframes expNavBar{ from{ height:0; opacity:0 } to{ height:16px; opacity:1 } }
.fsb-caret{
  width:18px; height:18px; flex:0 0 auto;
  display:flex; align-items:center; justify-content:center;
  color:var(--tx-3) !important; opacity:.8;
  transition:transform var(--d-base) var(--e-apple), color var(--d-micro);
}
.fsb-node.expanded > .fsb-row .fsb-caret{ transform:rotate(90deg); }
.fsb-row:hover .fsb-caret{ color:var(--tx-1) !important; }
.fsb-caret.empty{ opacity:0; }
.fsb-ico, .home-ico, .trash-ico{
  width:17px !important; height:17px !important; flex:0 0 auto;
  color:var(--folder) !important; opacity:1;
}
.fsb-trash .fsb-ico, .trash-ico{ color:var(--tx-3) !important; }
.fsb-name{
  flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  font-size:13px !important; color:var(--tx-1) !important; font-weight:400 !important;
}
.fsb-count{
  font-size:11px !important; color:var(--tx-3) !important;
  background:transparent !important; border:0 !important; padding:0 2px !important;
  font-variant-numeric:tabular-nums;
}
/* plynulé rozbalení podstromu */
.fsb-children{
  padding-left:14px !important;
  border-left:1px solid var(--divider); margin-left:12px !important;
}

#sidebarBackdrop{
  background:var(--smoke) !important;
  transition:opacity var(--d-slow) var(--e-apple) !important;
}
/* otevřený stav vynucen — jinak ho přebíjí základní translateX(-100%) stránky */
body.sidebar-open #folderSidebar{ transform:none !important; }

/* ══════════════════════════════════════════════════════════════════
   12 · UKOTVENÝ NAV PANE NA ŠIROKÝCH DISPLEJÍCH (jako v Exploreru)
   ══════════════════════════════════════════════════════════════════ */
@media (min-width:1000px){
  body.sidebar-open #sidebarBackdrop{ opacity:0 !important; pointer-events:none !important; }
  /* posune se celá aplikace najednou — ne každý pruh zvlášť */
  #app, .exp-statusbar, .select-bar{ transition:padding-left var(--d-slow) var(--e-apple); }
  body.sidebar-open #app,
  body.sidebar-open .exp-statusbar,
  body.sidebar-open .select-bar{ padding-left:var(--navpane) !important; }
  #folderSidebar{ top:0 !important; height:100vh !important; }
}

/* ══════════════════════════════════════════════════════════════════
   12b · EXPLORER SHELL — tři pruhy nahoře, stavový řádek dole
   ══════════════════════════════════════════════════════════════════ */

/* titulkový pruh: logo vlevo, hodiny + účet + aplikace vpravo */
.exp-shell .header-top{
  justify-content:space-between; gap:12px;
  height:44px; margin-bottom:0 !important; border-bottom:0 !important;
}
.exp-shell .header-top .header-bar-right{ display:flex; align-items:center; gap:4px; }
/* druhý řádek hlavičky je po přesunu prázdný */
.exp-shell .header-bar{ display:none !important; }

/* adresní řádek */
.exp-addressbar{
  display:flex; align-items:center; gap:8px;
  min-height:42px; padding:6px 12px;
  background:var(--sol-base);
  border-bottom:1px solid var(--divider);
  position:sticky; top:0; z-index:34;
}
.exp-addressbar > .breadcrumb{
  flex:1 1 auto; min-width:0;
  min-height:30px !important; padding:0 !important;
  background:var(--ctrl) !important;
  border:1px solid var(--stroke) !important;
  border-bottom-color:var(--stroke-strong) !important;
  border-radius:var(--r-ctrl) !important;
  padding:0 6px !important;
  transition:background var(--d-fast) var(--e-out), border-color var(--d-fast) var(--e-out);
}
.exp-addressbar > .breadcrumb:hover{ background:var(--ctrl-hover) !important; }
.exp-addressbar > .search-wrap{ flex:0 0 auto; width:250px; max-width:38vw; }
.exp-addressbar .breadcrumb-item{ height:24px; }

/* tlačítko „o úroveň výš" */
.exp-up{
  width:32px; height:32px; flex:0 0 auto;
  display:inline-flex; align-items:center; justify-content:center;
  background:transparent; border:1px solid transparent;
  border-radius:var(--r-ctrl); color:var(--tx-1); cursor:pointer;
  transition:background var(--d-micro) var(--e-out), opacity var(--d-fast) var(--e-out);
}
.exp-up:hover:not(:disabled){ background:var(--subtle-hover); }
.exp-up:active:not(:disabled){ background:var(--subtle-press); transform:scale(.94); }
.exp-up:disabled{ opacity:.32; cursor:default; }

/* příkazový pruh: akce vlevo, řazení a zobrazení vpravo */
.exp-shell .toolbar .sidebar-toggle{ order:0; margin-right:9px; position:relative; }
.exp-shell .toolbar .sidebar-toggle::before{
  content:''; position:absolute; right:-5px; top:50%; translate:0 -50%;
  width:1px; height:18px; background:var(--divider);
}
.exp-shell .toolbar .toolbar-btn{ order:1; }
.exp-shell .toolbar .sort-select, .exp-shell .toolbar .nyxsel{ order:5; margin-left:auto; flex:0 0 auto; width:auto !important; min-width:150px; }
.exp-shell .toolbar .gridsize-ctl{ order:6; margin-left:6px; }

/* ukotvená horní část okna — obsah se posouvá pod ní */
.exp-shell header      { position:sticky; top:0;    z-index:40; }
.exp-shell .toolbar    { position:sticky; top:44px; z-index:38; }
.exp-shell .exp-addressbar{ position:sticky; top:90px; z-index:36; }

/* kontextové filtry — zabírají místo jen když v nich něco je */
.type-filters:empty, .filter-tags:empty{ display:none !important; padding:0 !important; }
.exp-shell .type-filters, .exp-shell .filter-tags{ padding:8px 12px 0 !important; }

/* stavový řádek (Explorer: počet položek vlevo, velikost vpravo) */
.exp-statusbar{
  position:fixed; left:0; right:0; bottom:0; z-index:30;
  height:28px; display:flex; align-items:center; justify-content:space-between;
  gap:16px; padding:0 14px;
  background:var(--sol-alt);
  border-top:1px solid var(--divider);
  font-size:12px; color:var(--tx-3);
}
.exp-statusbar .stats-bar{ display:flex; gap:0; align-items:center; }
.exp-statusbar .stat{ padding:0 10px !important; position:relative; }
.exp-statusbar .stat + .stat::before{
  content:''; position:absolute; left:0; top:50%; translate:0 -50%;
  width:1px; height:11px; background:var(--divider);
}
.exp-shell main{ padding:14px 12px 56px !important; }
.exp-shell .select-bar{ bottom:28px !important; }
@media (max-width:768px){
  .exp-statusbar{ height:26px; font-size:11px; padding:0 8px; }
  .exp-shell .header-top{ height:42px; }
  .exp-addressbar{ padding:6px 8px; gap:6px; }
  .exp-addressbar > .search-wrap{ width:150px; }
}

/* ══════════════════════════════════════════════════════════════════
   13 · OBSAHOVÁ PLOCHA + MŘÍŽKA DLAŽDIC (Explorer „Large icons“)
   ══════════════════════════════════════════════════════════════════ */
main{
  max-width:none !important; width:100% !important; margin:0 !important;
  padding:14px 16px 40px !important;
  background:var(--sol-base);
}
/* nástrojové stránky: obsah v čitelném sloupci, ne přes celou šířku monitoru */
body:not(.exp-shell) main{ max-width:1180px !important; margin:0 auto !important; }
body:not(.exp-shell) header{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  min-height:48px; padding:0 16px !important;
}
body:not(.exp-shell) footer{
  max-width:1180px; margin:0 auto; padding:20px 16px 40px !important;
  color:var(--tx-3); font-size:12px;
  border-top:1px solid var(--divider); background:transparent !important;
}
.grid{
  gap:4px !important;
  grid-template-columns:repeat(auto-fill, minmax(178px,1fr)) !important;
}
[data-grid="compact"] .grid{ grid-template-columns:repeat(auto-fill, minmax(136px,1fr)) !important; }
[data-grid="large"]   .grid{ grid-template-columns:repeat(auto-fill, minmax(226px,1fr)) !important; }

/* ══════════ mřížka ve stylu Google Drive ══════════ */
.grid.exp-drive{ display:block !important; }
.exp-sec{ margin-bottom:26px; }
.exp-sec:last-child{ margin-bottom:0; }
.exp-sec-h{
  font-size:12.5px; font-weight:600; color:var(--tx-2);
  margin:0 0 10px 2px;
}
.exp-sec-grid{ display:grid; gap:8px; align-items:start; }
.exp-sec[data-kind="folders"] .exp-sec-grid{ grid-template-columns:repeat(auto-fill,minmax(228px,1fr)); }
.exp-sec[data-kind="files"]   .exp-sec-grid{ grid-template-columns:repeat(auto-fill,minmax(196px,1fr)); }
[data-grid="compact"] .exp-sec[data-kind="folders"] .exp-sec-grid{ grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); }
[data-grid="compact"] .exp-sec[data-kind="files"]   .exp-sec-grid{ grid-template-columns:repeat(auto-fill,minmax(152px,1fr)); }
[data-grid="large"]   .exp-sec[data-kind="folders"] .exp-sec-grid{ grid-template-columns:repeat(auto-fill,minmax(264px,1fr)); }
[data-grid="large"]   .exp-sec[data-kind="files"]   .exp-sec-grid{ grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); }

/* Rohové „závorky" z původního gaming designu (index.html: `.card::before`
   a `::after` = 14×14 L z azurového borderu). V Exploreru nemají co dělat.
   Pozor: `.card[data-color]::after` níž si ::after schválně zase zapíná
   kvůli barevné tečce — má vyšší specificitu, takže ho tohle nepřebije. */
.card::before, .card::after{ content:none !important; display:none !important; }

/* ── SLOŽKA = nízký pruh (Drive) ─────────────────────────────────── */
.card.folder-card, .card[data-kind="folder"]{
  display:flex !important; flex-direction:row !important; align-items:center !important;
  gap:11px; height:48px !important; min-height:48px !important;
  padding:0 13px !important;
  background:var(--layer) !important;
  border:1px solid transparent !important;
  border-radius:8px !important;
  overflow:hidden;
}
[data-grid="compact"] .card[data-kind="folder"]{ height:42px !important; min-height:42px !important; }
.card[data-kind="folder"]:hover{ background:var(--ctrl-hover) !important; border-color:transparent !important; }
.card[data-kind="folder"]:active{ background:var(--ctrl-press) !important; }
.card[data-kind="folder"] .folder-icon{
  width:20px !important; height:20px !important; margin:0 !important; flex:0 0 auto;
  color:var(--folder) !important; display:flex; align-items:center;
}
.card[data-kind="folder"] .folder-icon svg, .card[data-kind="folder"] .folder-icon i{
  width:20px !important; height:20px !important; stroke-width:1.7 !important;
}
.card[data-kind="folder"] .card-title{
  flex:1 1 auto; min-width:0; margin:0 !important;
  text-align:left !important; font-size:13px !important; font-weight:400 !important;
  color:var(--tx-1) !important;
  white-space:nowrap !important; overflow:hidden; text-overflow:ellipsis;
  display:block !important; -webkit-line-clamp:none !important;
}
.card[data-kind="folder"] .folder-count{
  flex:0 0 auto; margin:0 !important; padding:0 !important;
  font-size:11.5px !important; color:var(--tx-3) !important; text-align:right;
}
.card[data-kind="folder"] .card-meta{ display:none !important; }
.card[data-kind="folder"]::after{ display:none !important; content:none !important; }

/* ── SOUBOR / MÉDIUM / POZNÁMKA = karta s náhledem (Drive) ───────── */
.card[data-kind="file"], .card[data-kind="media"], .card[data-kind="text"]{
  display:grid !important;
  grid-template-columns:20px minmax(0,1fr);
  grid-template-rows:auto minmax(0,1fr);
  grid-template-areas:"ico name" "body body";
  column-gap:9px; row-gap:0; align-items:center;
  height:184px !important; min-height:0 !important;
  padding:10px !important;
  background:var(--layer) !important;
  border:1px solid var(--stroke) !important;
  border-radius:8px !important;
  overflow:hidden;
}
[data-grid="compact"] .card[data-kind="file"],
[data-grid="compact"] .card[data-kind="media"],
[data-grid="compact"] .card[data-kind="text"]{ height:148px !important; padding:8px !important; }
[data-grid="large"] .card[data-kind="file"],
[data-grid="large"] .card[data-kind="media"],
[data-grid="large"] .card[data-kind="text"]{ height:224px !important; }

.card[data-kind] > .card-icon{
  grid-area:ico; width:20px !important; height:20px !important;
  margin:0 !important; display:flex; align-items:center; justify-content:center;
}
.card[data-kind] > .card-icon svg, .card[data-kind] > .card-icon i{
  width:19px !important; height:19px !important; stroke-width:1.6 !important;
}
.card[data-kind] > .card-title{
  grid-area:name; margin:0 !important;
  text-align:left !important; font-size:12.5px !important; font-weight:400 !important;
  color:var(--tx-1) !important; line-height:1.35;
  white-space:nowrap !important; overflow:hidden; text-overflow:ellipsis;
  display:block !important; -webkit-line-clamp:none !important;
}
/* médium nemá ikonu, název tedy zabere celou šířku */
.card[data-kind="media"] > .card-title{ grid-column:1 / -1; }

/* náhled vyplní tělo karty */
.card[data-kind] > .preview-wrap, .card[data-kind] > .video-thumb{
  grid-area:body; margin:9px 0 0 !important; width:100%; height:100%;
  border-radius:6px; overflow:hidden; background:var(--sol-alt);
  display:flex; align-items:center; justify-content:center; position:relative;
}
.card[data-kind] .file-preview{
  width:100% !important; height:100% !important; object-fit:cover;
  margin:0 !important; border:0 !important; border-radius:6px !important;
}
.card[data-kind] .video-play{
  position:absolute; left:50%; top:50%; translate:-50% -50%;
  width:34px; height:34px; border-radius:50%;
  background:rgba(0,0,0,.55); color:#fff;
  display:flex; align-items:center; justify-content:center;
}

/* soubor bez náhledu — velká ikona uprostřed */
.card[data-kind="file"] > .card-icon{
  grid-area:body; grid-column:1 / -1;
  width:auto !important; height:100% !important;
  margin:9px 0 0 !important;
  background:var(--sol-alt); border-radius:6px;
  color:var(--t-other) !important;
}
.card[data-kind="file"] > .card-icon svg, .card[data-kind="file"] > .card-icon i{
  width:40px !important; height:40px !important; stroke-width:1.25 !important;
}
.card[data-kind="file"] > .card-title{ grid-column:1 / -1; }
.card[data-kind="file"] > .card-content{ display:none !important; }
.card[data-kind="media"] > .card-content{ display:none !important; }

/* poznámka / odkaz — náhled textu jako dokument v Drive */
.card[data-kind="text"] > .card-content{
  grid-area:body; margin:9px 0 0 !important; padding:9px 10px !important;
  background:var(--sol-alt); border-radius:6px;
  font-size:11.5px !important; line-height:1.5; text-align:left !important;
  color:var(--tx-3) !important; overflow:hidden;
  display:-webkit-box; -webkit-line-clamp:7; -webkit-box-orient:vertical;
}
.card[data-kind="text"] > .card-content a{ color:var(--acc) !important; }

/* datum a velikost se v dlaždici neukazují (Drive je má až v detailu) */
.card[data-kind] > .card-meta{ display:none !important; }

/* překryvy a odznaky */
.card[data-kind] > .select-overlay{ position:absolute; inset:0; z-index:4; }
.card[data-kind] > .card-actions{ grid-area:body; align-self:end; z-index:5; margin:0; }
.card[data-kind] > .share-badge{ position:absolute; top:8px; right:8px; z-index:3; }
.card[data-kind="folder"] > .share-badge{ position:static; flex:0 0 auto; }
.card[data-kind] > .card-tag{ position:absolute; left:8px; bottom:8px; z-index:3; }

/* barevný štítek uživatele — decentní tečka vpravo dole, ne u ikony */
.card[data-color]::after{
  left:auto !important; top:auto !important;
  right:9px; bottom:9px; z-index:4;
}

/* ── stavy: najetí, stisk, výběr, připnutí ──────────────────────── */
.card[data-kind="file"]:hover, .card[data-kind="media"]:hover, .card[data-kind="text"]:hover{
  background:var(--ctrl-hover) !important;
  border-color:var(--stroke-2) !important;
}
.card[data-kind]:active{ transform:scale(.985) !important; }
.card[data-kind].selected{
  background:rgba(var(--acc-rgb),.18) !important;
  border-color:rgba(var(--acc-rgb),.55) !important;
}
.card[data-kind].selected:hover{ background:rgba(var(--acc-rgb),.24) !important; }
.card[data-kind].pinned{ border-color:var(--stroke-2) !important; }
.card[data-kind].pinned:hover{ background:var(--ctrl-hover) !important; }

/* dlaždice „přidat" v Drive rozvržení */
.card.add-card, .card[data-kind="add"]{
  display:flex !important; align-items:center !important; justify-content:center !important;
  height:184px !important; min-height:0 !important;
  padding:10px !important;
  background:transparent !important;
  border:1px dashed var(--stroke-strong) !important;
  border-radius:8px !important;
}
.card[data-kind="add"]:hover{
  background:var(--subtle-hover) !important;
  border-color:var(--acc) !important; border-style:dashed !important;
}
.card[data-kind="add"]::after{ display:none !important; content:none !important; }
[data-grid="compact"] .card[data-kind="add"]{ height:148px !important; }
[data-grid="large"]   .card[data-kind="add"]{ height:224px !important; }

/* plochá mřížka (když nejsou složky) drží stejné rozměry */
.grid:not(.exp-drive){ grid-template-columns:repeat(auto-fill,minmax(196px,1fr)) !important; gap:8px !important; }
[data-grid="compact"] .grid:not(.exp-drive){ grid-template-columns:repeat(auto-fill,minmax(152px,1fr)) !important; }
[data-grid="large"]   .grid:not(.exp-drive){ grid-template-columns:repeat(auto-fill,minmax(250px,1fr)) !important; }

/* seznamové zobrazení = Explorer „Details“ */
.grid.list-view{ gap:0 !important; }
.grid.list-view .card{
  min-height:36px !important; height:36px !important;
  padding:0 10px !important; gap:12px !important;
  border-radius:var(--r-ctrl) !important; border-color:transparent !important;
}
.grid.list-view .card-icon{ width:20px !important; height:20px !important; margin:0 !important; }
.grid.list-view .card-icon svg{ width:19px !important; height:19px !important; }
.grid.list-view .card-title{ text-align:left; -webkit-line-clamp:1; margin:0 !important; flex:1; }
.grid.list-view .card-content, .grid.list-view .card-meta{ text-align:left; margin:0 !important; padding:0 !important; }
.grid.list-view .card[data-color]::after{ top:50%; translate:0 -50%; left:2px; }

/* prázdný stav */
.empty-state{
  padding:64px 20px !important; text-align:center; color:var(--tx-3) !important;
  animation:expFadeUp var(--d-page) var(--e-apple);
}
.empty-state-icon{ color:var(--tx-off) !important; opacity:.7; margin-bottom:12px; }
@keyframes expFadeUp{ from{ opacity:0; transform:translateY(8px) } to{ opacity:1; transform:none } }

/* ══════════════════════════════════════════════════════════════════
   14 · KONTEXTOVÉ MENU (Win11 flyout)
   ══════════════════════════════════════════════════════════════════ */
.ctx-menu, .nyx-select-menu, .nyxsel-list, .theme-pop, .nyx-apps-pop{
  min-width:200px;
  padding:5px !important;
  background:var(--sol-quart) !important;
  border:1px solid var(--stroke-2) !important;
  border-radius:var(--r-overlay) !important;
  box-shadow:var(--el-flyout) !important;
  backdrop-filter:blur(28px) saturate(1.4) !important;
  -webkit-backdrop-filter:blur(28px) saturate(1.4) !important;
  animation:expFlyoutIn var(--d-base) var(--e-apple);
  transform-origin:top left;
}
.ctx-menu::before, .ctx-menu::after,
.theme-pop::before, .theme-pop::after,
.nyx-apps-pop::before, .nyx-apps-pop::after{ content:none !important; }
@keyframes expFlyoutIn{
  from{ opacity:0; transform:translateY(-6px) scale(.97); }
  to  { opacity:1; transform:none; }
}
.ctx-item, .nyx-select-option, .nyxsel-opt, .theme-opt, .folder-option{
  height:32px; display:flex; align-items:center; gap:10px;
  padding:0 10px !important; margin:1px 0;
  font-size:13px !important; color:var(--tx-1) !important;
  background:transparent !important; border:0 !important;
  border-radius:var(--r-ctrl) !important;
  cursor:pointer;
  transition:background var(--d-micro) var(--e-out);
}
.ctx-item:hover, .nyx-select-option:hover, .nyxsel-opt:hover, .theme-opt:hover, .folder-option:hover{
  background:var(--subtle-hover) !important;
}
.ctx-item:active, .nyx-select-option:active, .nyxsel-opt:active{ background:var(--subtle-press) !important; }
.ctx-item i, .ctx-item svg{ width:16px !important; height:16px !important; color:var(--tx-2); }
.ctx-item.danger, .ctx-item.red{ color:var(--err) !important; }
.ctx-item.danger:hover{ background:rgba(255,153,164,.12) !important; }
.ctx-sep{ height:1px; background:var(--divider) !important; margin:5px 8px !important; border:0 !important; }
.ctx-hdr{
  padding:6px 10px 4px !important;
  font-size:11.5px !important; color:var(--tx-3) !important; font-weight:600 !important;
}
.nyx-select-option.sel, .nyxsel-opt.sel, .theme-opt.sel, .folder-option.current{
  background:var(--ctrl-hover) !important; position:relative;
}
.nyx-select-option.sel::before, .nyxsel-opt.sel::before, .theme-opt.sel::before{
  content:''; position:absolute; left:2px; top:50%; translate:0 -50%;
  width:3px; height:16px; border-radius:2px; background:var(--acc);
}

/* ══════════════════════════════════════════════════════════════════
   15 · DIALOGY (Win11 ContentDialog)
   ══════════════════════════════════════════════════════════════════ */
.modal-overlay, .confirm-overlay, .settings-overlay, .upload-overlay,
.shortcuts-overlay, .select-overlay{
  background:var(--smoke) !important;
  backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px);
  animation:expFade var(--d-base) var(--e-out);
}
@keyframes expFade{ from{ opacity:0 } to{ opacity:1 } }

.modal, .confirm-box, .upload-card, .shortcuts-box, .auth-box, .settings-panel{
  background:var(--sol-tert) !important;
  border:1px solid var(--stroke-2) !important;
  border-radius:var(--r-overlay) !important;
  box-shadow:var(--el-dialog) !important;
  padding:22px !important;
  animation:expDialogIn var(--d-slow) var(--e-apple);
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
.modal::before, .modal::after,
.confirm-box::before, .confirm-box::after,
.auth-box::before, .auth-box::after,
.upload-card::before, .upload-card::after{ content:none !important; }
@keyframes expDialogIn{
  from{ opacity:0; transform:translateY(16px) scale(.97); }
  to  { opacity:1; transform:none; }
}
.modal-title, .confirm-title{
  font-family:var(--fnt-display) !important;
  font-size:19px !important; font-weight:600 !important; color:var(--tx-1) !important;
  margin-bottom:14px !important;
}
.confirm-msg{ font-size:13.5px !important; color:var(--tx-2) !important; line-height:1.5; }
.confirm-icon{ color:var(--acc) !important; }
.confirm-btns, .button-row{
  display:flex; gap:8px; justify-content:flex-end; margin-top:20px !important;
  padding-top:0 !important; border:0 !important;
}
.confirm-btns button, .button-row button{ min-width:104px; }
.tabs{
  display:flex; gap:2px; border-bottom:1px solid var(--divider) !important; margin-bottom:16px;
}
.tab, .auth-tab{
  height:34px; padding:0 12px !important;
  background:transparent !important; border:0 !important; border-radius:0 !important;
  color:var(--tx-3) !important; font-size:13px !important; position:relative;
  transition:color var(--d-fast) var(--e-out);
}
.tab:hover, .auth-tab:hover{ color:var(--tx-1) !important; background:transparent !important; }
.tab.active, .auth-tab.active{ color:var(--tx-1) !important; font-weight:600 !important; }
.tab.active::after, .auth-tab.active::after{
  content:''; position:absolute; left:0; right:0; bottom:-1px; height:2.5px;
  background:var(--acc); border-radius:2px;
  animation:expTabBar var(--d-slow) var(--e-apple);
}
@keyframes expTabBar{ from{ transform:scaleX(0) } to{ transform:scaleX(1) } }

/* ══════════════════════════════════════════════════════════════════
   16 · PŘIHLÁŠENÍ
   ══════════════════════════════════════════════════════════════════ */
.auth-screen{ background:var(--sol-base) !important; }
.auth-box{ width:min(400px,92vw); padding:32px !important; text-align:center; }
.auth-logo-img{ width:56px !important; height:56px !important; margin-bottom:12px; }
.auth-logo{
  font-family:var(--fnt-display) !important;
  font-size:22px !important; font-weight:600 !important; color:var(--tx-1) !important;
  background:none !important; -webkit-text-fill-color:var(--tx-1) !important;
}
.auth-sub{ font-size:13px !important; color:var(--tx-3) !important; margin-bottom:18px; }
.auth-tabs{ justify-content:center; }
.input-group{ text-align:left; margin-bottom:14px; }
.input-group input{ width:100%; }
.auth-error{ color:var(--err) !important; font-size:12.5px !important; }
.auth-apps-label{ margin-top:26px !important; }
.auth-apps{ display:grid; grid-template-columns:repeat(auto-fit,minmax(66px,1fr)); gap:4px; }
.auth-app{
  display:flex; flex-direction:column; align-items:center; gap:6px;
  padding:11px 5px !important; border-radius:var(--r-card) !important;
  background:transparent !important; border:1px solid transparent !important;
  color:var(--tx-2) !important; text-decoration:none;
  transition:background var(--d-fast) var(--e-out), border-color var(--d-fast) var(--e-out),
             transform var(--d-base) var(--e-apple);
}
.auth-app:hover{
  background:var(--subtle-hover) !important; border-color:var(--stroke) !important;
  color:var(--tx-1) !important; transform:translateY(-1px);
}
.auth-app:active{ transform:scale(.96); }
.auth-app svg{ width:22px !important; height:22px !important; color:var(--acc) !important; stroke-width:1.5; }
.auth-app span{ font-size:10.5px !important; }

/* ══════════════════════════════════════════════════════════════════
   17 · NASTAVENÍ (styl aplikace Nastavení ve Win11)
   ══════════════════════════════════════════════════════════════════ */
.settings-panel{
  width:min(660px,94vw) !important; max-height:88vh; padding:0 !important; overflow:hidden;
  display:flex; flex-direction:column;
}
.settings-header{
  height:52px; display:flex; align-items:center; justify-content:space-between;
  padding:0 18px !important; border-bottom:1px solid var(--divider) !important;
  background:var(--sol-quart) !important; flex:0 0 auto;
}
.settings-title{ font-size:16px !important; font-weight:600 !important; color:var(--tx-1) !important; }
.settings-close{
  width:32px; height:32px; border-radius:var(--r-ctrl) !important;
  background:transparent !important; border:0 !important; color:var(--tx-1) !important;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:background var(--d-micro) var(--e-out);
}
.settings-close:hover{ background:#c42b1c !important; color:#fff !important; }
.settings-body{ padding:18px !important; overflow-y:auto; flex:1; }

/* karta uživatele */
.settings-user{
  display:flex; align-items:center; gap:12px;
  padding:14px !important; margin-bottom:20px !important;
  background:var(--layer) !important;
  border:1px solid var(--stroke) !important;
  border-radius:var(--r-overlay) !important;
}
.settings-avatar{
  width:42px; height:42px; border-radius:50% !important;
  background:var(--acc) !important; color:#000 !important;
  border:0 !important; box-shadow:none !important;
  display:flex; align-items:center; justify-content:center;
  font-size:17px !important; font-weight:600 !important;
}
.settings-username{ font-size:14.5px !important; font-weight:600 !important; color:var(--tx-1) !important; }

/* řádek nastavení = Win11 „SettingsCard“ */
.st-row, .settings-row, .accent-row, .st-lang-row{
  display:flex; align-items:center; gap:14px;
  min-height:56px; padding:10px 14px !important; margin-bottom:3px;
  background:var(--layer) !important;
  border:1px solid var(--stroke) !important;
  border-radius:var(--r-card) !important;
  box-shadow:none !important;
  transition:background var(--d-fast) var(--e-out);
}
.st-row:hover{ background:var(--ctrl) !important; }
.st-col{ flex:1; min-width:0; }
.st-label{ font-size:13.5px !important; font-weight:400 !important; color:var(--tx-1) !important; }
.st-desc{ font-size:12px !important; color:var(--tx-3) !important; margin-top:2px; }
.st-val{ font-size:12.5px !important; color:var(--tx-2) !important; font-variant-numeric:tabular-nums; }
.st-section{ margin-bottom:22px !important; }
.st-btn-row{ display:flex; gap:8px; flex-wrap:wrap; }
.st-info{ font-size:12px !important; color:var(--tx-3) !important; }
.st-lang{ display:flex; gap:4px; }
.st-lang button, .st-lang > div{
  height:30px; padding:0 12px !important; border-radius:var(--r-ctrl) !important;
  background:var(--ctrl) !important; border:1px solid var(--stroke) !important;
  color:var(--tx-2) !important; font-size:12.5px !important; cursor:pointer;
  transition:background var(--d-micro) var(--e-out);
}
.st-lang .sel{ background:var(--acc) !important; color:#000 !important; border-color:transparent !important; font-weight:600 !important; }

/* výběr akcentu — 5 barevných koleček */
.theme-grid{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(104px,1fr)) !important;
  gap:8px !important;
}
.theme-card{
  padding:14px 10px !important;
  background:var(--layer) !important;
  border:1px solid var(--stroke) !important;
  border-radius:var(--r-card) !important;
  box-shadow:none !important; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; gap:10px;
  transition:background var(--d-fast) var(--e-out), border-color var(--d-fast) var(--e-out),
             transform var(--d-base) var(--e-apple);
}
.theme-card:hover{ background:var(--ctrl) !important; transform:translateY(-2px); }
.theme-card:active{ transform:scale(.97); }
.theme-card.active{
  border-color:var(--acc) !important;
  background:rgba(var(--acc-rgb),.10) !important;
}
.theme-preview{ display:flex; gap:0 !important; justify-content:center; }
.theme-dot{
  width:30px !important; height:30px !important; border-radius:50% !important;
  box-shadow:0 0 0 1px var(--stroke-strong) inset !important;
  border:0 !important;
}
.theme-card .theme-preview .theme-dot:not(:first-child){ display:none !important; }
.theme-lines{ display:none !important; }
.theme-card-name{
  font-size:12px !important; color:var(--tx-2) !important; font-weight:400 !important;
}
.theme-card.active .theme-card-name{ color:var(--tx-1) !important; font-weight:600 !important; }
/* zaškrtnutí u aktivního tématu */
.theme-card.active .theme-preview{ position:relative; }
.theme-card.active .theme-preview::after{
  content:''; position:absolute; right:-3px; bottom:-3px;
  width:15px; height:15px; border-radius:50%;
  background:var(--acc); box-shadow:0 0 0 2px var(--sol-tert);
  animation:expCheck var(--d-slow) var(--e-spring);
}

.accent-dot, .color-dot{
  width:26px !important; height:26px !important; border-radius:50% !important;
  border:0 !important; box-shadow:0 0 0 1px var(--stroke-strong) !important;
  cursor:pointer;
  transition:transform var(--d-fast) var(--e-spring), box-shadow var(--d-fast);
}
.accent-dot:hover, .color-dot:hover{ transform:scale(1.12); }
.accent-dot.sel, .color-dot.sel{ box-shadow:0 0 0 2px var(--sol-tert), 0 0 0 4px var(--acc) !important; }

/* klávesové zkratky */
.shortcuts-box{ width:min(560px,94vw) !important; }
.sc-grid{ display:grid; grid-template-columns:1fr 1fr; gap:6px 20px; }
.sc-item{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:6px 0; font-size:13px; color:var(--tx-2) !important; }
.sc-key{
  padding:2px 7px !important; font-size:11.5px !important;
  background:var(--ctrl) !important; border:1px solid var(--stroke) !important;
  border-bottom-width:2px !important; border-radius:var(--r-ctrl) !important;
  color:var(--tx-1) !important; box-shadow:none !important;
}

/* ══════════════════════════════════════════════════════════════════
   18 · NAHRÁVÁNÍ / PROGRESS (Fluent ProgressBar)
   ══════════════════════════════════════════════════════════════════ */
.upload-card{ width:min(460px,92vw) !important; }
.upload-card-title{ font-size:16px !important; font-weight:600 !important; color:var(--tx-1) !important; }
.upload-filename{ font-size:13px !important; color:var(--tx-2) !important; }
.upload-meta, .upload-overall-count{ font-size:11.5px !important; color:var(--tx-3) !important; }
.upload-pct{ font-size:24px !important; font-weight:600 !important; color:var(--tx-1) !important; font-variant-numeric:tabular-nums; }
.upload-bar-track, .upload-overall-track, .bar-track, .va-track, .sb-bar{
  height:4px !important; border-radius:2px !important;
  background:var(--ctrl-hover) !important;
  border:0 !important; box-shadow:none !important; overflow:hidden;
}
.upload-bar-fill, .upload-overall-fill{
  height:100% !important; border-radius:2px !important;
  background:var(--acc) !important; box-shadow:none !important;
  transition:width var(--d-base) var(--e-apple);
}
.preview-spinner, .spinner{
  border-color:var(--stroke-strong) !important;
  border-top-color:var(--acc) !important;
}

/* drag & drop plocha */
.dropzone, .file-drop{
  background:var(--layer) !important;
  border:1px dashed var(--stroke-strong) !important;
  border-radius:var(--r-overlay) !important;
  box-shadow:none !important; color:var(--tx-2) !important;
  transition:background var(--d-base) var(--e-out), border-color var(--d-base) var(--e-out);
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
.dropzone::before, .dropzone::after, .file-drop::before, .file-drop::after{ content:none !important; }
.dropzone:hover, .dropzone.drag, .file-drop:hover, .file-drop.drag{
  background:rgba(var(--acc-rgb),.08) !important; border-color:var(--acc) !important;
}
.file-drop-icon{ color:var(--acc) !important; }

/* ══════════════════════════════════════════════════════════════════
   19 · OZNÁMENÍ (Win11 InfoBar)
   ══════════════════════════════════════════════════════════════════ */
.toast, #toast, .nyx-toast{
  padding:12px 16px !important;
  background:var(--sol-quart) !important;
  border:1px solid var(--stroke-2) !important;
  border-left:3px solid var(--acc) !important;
  border-radius:var(--r-card) !important;
  box-shadow:var(--el-flyout) !important;
  color:var(--tx-1) !important; font-size:13px !important;
  backdrop-filter:blur(24px) !important; -webkit-backdrop-filter:blur(24px) !important;
  animation:expToastIn var(--d-slow) var(--e-apple);
}
.toast::before, .toast::after{ content:none !important; }
@keyframes expToastIn{
  from{ opacity:0; transform:translateY(14px) scale(.97); }
  to  { opacity:1; transform:none; }
}
.toast.success, .toast.ok{ border-left-color:var(--ok) !important; }
.toast.error, .toast.err{ border-left-color:var(--err) !important; }
.toast.warn{ border-left-color:var(--warn) !important; }

/* pruh výběru (select bar) = Explorer status bar */
.select-bar{
  background:var(--sol-alt) !important;
  border:0 !important; border-top:1px solid var(--divider) !important;
  border-radius:0 !important; box-shadow:none !important;
  padding:8px 14px !important;
  /* žádný backdrop-filter — v Chromiu promuje celou stránku do kompozitní
     vrstvy a text se přepne z subpixelového vyhlazování na šedé („rozmazaný"
     seznam v režimu výběru). Průzkumník má pruhy stejně plné. */
  background:var(--sol-quart) !important;
}
.select-bar-count{ font-size:12.5px !important; color:var(--tx-2) !important; }

/* ══════════════════════════════════════════════════════════════════
   20 · PROHLÍŽEČ SOUBORŮ (viewer)
   ══════════════════════════════════════════════════════════════════ */
.viewer{ background:rgba(0,0,0,.88) !important; backdrop-filter:blur(4px); }
.viewer-toolbar, .viewer-footer{
  background:var(--sol-alt) !important;
  border:0 !important; border-bottom:1px solid var(--divider) !important;
  box-shadow:none !important; backdrop-filter:blur(24px) !important;
}
.viewer-footer{ border-bottom:0 !important; border-top:1px solid var(--divider) !important; }
.viewer-filename{ font-size:13px !important; color:var(--tx-1) !important; font-weight:600 !important; }
.viewer-meta, .viewer-counter{ font-size:11.5px !important; color:var(--tx-3) !important; }
.vtb-sep{ width:1px; height:20px; background:var(--divider) !important; margin:0 6px; }
/* horní lišta prohlížeče — ikony byly proti zbytku UI drobné */
.viewer-toolbar .vtb-btn{ width:36px !important; height:36px !important; padding:0 !important; }
.viewer-toolbar .vtb-btn svg, .viewer-toolbar .vtb-btn i{ width:19px !important; height:19px !important; }
.viewer-filename{ font-size:14px !important; }
.viewer-meta{ font-size:12px !important; }
.vtb-label{ font-size:12px !important; color:var(--tx-3) !important; }
.viewer-nav{
  width:42px; height:42px; border-radius:50% !important;
  background:rgba(255,255,255,.08) !important;
  border:1px solid var(--stroke-2) !important;
  color:var(--tx-1) !important; box-shadow:none !important;
  backdrop-filter:blur(16px);
  transition:background var(--d-fast) var(--e-out), transform var(--d-base) var(--e-apple);
}
.viewer-nav:hover{ background:rgba(255,255,255,.15) !important; transform:scale(1.06); }
.viewer-nav:active{ transform:scale(.94); }
.viewer-info-panel{
  background:var(--sol-tert) !important;
  border-left:1px solid var(--divider) !important;
  box-shadow:none !important;
}
.vip-row{ display:flex; justify-content:space-between; gap:14px; padding:8px 0; border-bottom:1px solid var(--divider); font-size:12.5px; }
.vip-title{ color:var(--tx-3) !important; }
.viewer-filmstrip{ background:var(--sol-alt) !important; border-top:1px solid var(--divider) !important; }
.viewer-filmstrip img{
  border-radius:var(--r-ctrl) !important; border:2px solid transparent !important;
  transition:border-color var(--d-fast) var(--e-out), transform var(--d-base) var(--e-apple);
}
.viewer-filmstrip img:hover{ transform:scale(1.05); }
.viewer-filmstrip img.active{ border-color:var(--acc) !important; }
.viewer-text-title{ font-size:19px !important; font-weight:600 !important; color:var(--tx-1) !important; }
.viewer-text-body{
  font-size:13.5px !important; color:var(--tx-2) !important; line-height:1.6;
  background:var(--layer) !important; border:1px solid var(--stroke) !important;
  border-radius:var(--r-card) !important; padding:16px !important;
}
.viewer-copy-btn, .viewer-link-btn{
  height:30px; padding:0 12px !important;
  background:var(--ctrl) !important; border:1px solid var(--stroke) !important;
  border-bottom-color:var(--ctrl-edge) !important;
  border-radius:var(--r-ctrl) !important; color:var(--tx-1) !important;
  font-size:12.5px !important; cursor:pointer;
  transition:background var(--d-micro) var(--e-out), transform var(--d-fast) var(--e-apple);
}
.viewer-copy-btn:hover, .viewer-link-btn:hover{ background:var(--ctrl-hover) !important; }
.viewer-copy-btn:active{ transform:scale(.96); }
.share-badge{
  background:rgba(var(--acc-rgb),.16) !important; color:var(--acc) !important;
  border:1px solid rgba(var(--acc-rgb),.35) !important;
  border-radius:10px !important; font-size:11px !important; padding:2px 9px !important;
  box-shadow:none !important;
}

/* ══════════════════════════════════════════════════════════════════
   21 · SPOUŠTĚČ APLIKACÍ (launcher.css override)
   ══════════════════════════════════════════════════════════════════ */
.nyx-launch-btn{
  width:34px !important; height:34px !important;
  border-radius:var(--r-ctrl) !important;
  background:transparent !important; border:1px solid transparent !important;
  color:var(--tx-1) !important; box-shadow:none !important;
  transition:background var(--d-micro) var(--e-out);
}
.nyx-launch-btn:hover, .nyx-launch-btn.open{
  background:var(--subtle-hover) !important; color:var(--tx-1) !important;
  border-color:transparent !important; box-shadow:none !important;
}
.nyx-launch-btn svg{ width:18px !important; height:18px !important; }
.nyx-apps-pop{ width:340px !important; padding:8px !important; }
.nyx-apps-head{ font-size:11.5px !important; color:var(--tx-3) !important; padding:6px 8px !important; font-weight:600 !important; }
.nyx-app-item, .nyx-app-tile, .nyx-apps-pop a{
  border-radius:var(--r-card) !important;
  background:transparent !important; border:1px solid transparent !important;
  color:var(--tx-1) !important; box-shadow:none !important;
  transition:background var(--d-fast) var(--e-out), transform var(--d-base) var(--e-apple);
}
.nyx-app-item:hover, .nyx-app-tile:hover, .nyx-apps-pop a:hover{
  background:var(--subtle-hover) !important; border-color:var(--stroke) !important;
  transform:translateY(-1px);
}
.nyx-apps-pop a:active{ transform:scale(.97); }
.nyx-apps-pop svg{ color:var(--acc) !important; }

.user-chip{
  height:32px; padding:0 11px !important; gap:7px;
  background:transparent !important; border:1px solid transparent !important;
  border-radius:var(--r-ctrl) !important; box-shadow:none !important;
  color:var(--tx-1) !important; font-size:12.5px !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  transition:background var(--d-micro) var(--e-out);
}
.user-chip:hover{ background:var(--subtle-hover) !important; transform:none !important; }
.user-chip:active{ background:var(--subtle-press) !important; }

.lang-switch{
  background:transparent !important; border:1px solid var(--stroke) !important;
  border-radius:var(--r-ctrl) !important; box-shadow:none !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
.gridsize-ctl{
  display:flex; gap:1px; padding:2px !important;
  background:var(--ctrl) !important; border:1px solid var(--stroke) !important;
  border-radius:var(--r-ctrl) !important; box-shadow:none !important;
}
.gridsize-ctl button{
  width:28px; height:26px; padding:0 !important;
  background:transparent !important; border:0 !important;
  border-radius:3px !important; color:var(--tx-2) !important; cursor:pointer;
  transition:background var(--d-micro) var(--e-out), color var(--d-micro) var(--e-out);
}
.gridsize-ctl button:hover{ background:var(--subtle-hover) !important; color:var(--tx-1) !important; }
.gridsize-ctl button.active, .gridsize-ctl button[aria-pressed="true"]{
  background:var(--acc) !important; color:#000 !important;
}
.gridsize-ctl i, .gridsize-ctl svg{ width:15px !important; height:15px !important; }

/* vlastní rozbalovací seznam (nyxselect.js) — Fluent ComboBox */
.nyxsel{ position:relative; display:inline-flex; }
.nyxsel-trigger{
  width:100%; height:32px;
  display:inline-flex; align-items:center; justify-content:space-between; gap:8px;
  padding:0 8px 0 11px !important;
  font-size:13px !important; color:var(--tx-1) !important;
  background:var(--ctrl) !important;
  border:1px solid var(--stroke) !important;
  border-bottom-color:var(--stroke-strong) !important;
  border-radius:var(--r-ctrl) !important;
  box-shadow:none !important; cursor:pointer;
  transition:background var(--d-micro) var(--e-out), border-color var(--d-micro) var(--e-out);
}
.nyxsel-trigger:hover{ background:var(--ctrl-hover) !important; }
.nyxsel-trigger:active{ background:var(--ctrl-press) !important; color:var(--tx-2) !important; }
.nyxsel.open .nyxsel-trigger{ background:var(--ctrl-press) !important; border-bottom-color:var(--acc) !important; }
.nyxsel-label{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nyxsel-caret{
  width:13px !important; height:13px !important; flex:0 0 auto;
  stroke-width:2 !important; color:var(--tx-3) !important;
  transition:transform var(--d-base) var(--e-apple);
}
.nyxsel.open .nyxsel-caret{ transform:rotate(180deg); }
.nyxsel-list{ min-width:100% !important; margin-top:4px; }
.nyxsel-native{ position:absolute !important; opacity:0 !important; pointer-events:none !important; }

/* ══════════════════════════════════════════════════════════════════
   22 · PODSTRÁNKY (convert / compress / qr / password / barvy /
        kalkulačka / minecraft) — sjednocené Fluent plochy
   ══════════════════════════════════════════════════════════════════ */
.panel, .cat, .qitem, .subcard, .out-wrap, .ai-box, .crack-cell,
.mc-out, .mc-json, .mc-preview, .mc-cell, .css-out, .fmt,
.calc-screen, .rem-cell, .convert-chip, .tool-chip, .brow, .vc-body{
  background:var(--layer) !important;
  border:1px solid var(--stroke) !important;
  border-radius:var(--r-card) !important;
  box-shadow:none !important;
  color:var(--tx-1) !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  transition:background var(--d-fast) var(--e-out), border-color var(--d-fast) var(--e-out);
}
.panel::before, .panel::after, .cat::before, .cat::after,
.qitem::before, .qitem::after, .subcard::before, .subcard::after{ content:none !important; }
.panel{ padding:18px !important; }

/* ovládací pruh (compress) */
.controls{
  background:var(--mica) !important;
  border:0 !important; border-bottom:1px solid var(--divider) !important;
  border-radius:0 !important; box-shadow:none !important;
  padding:8px 12px !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
.controls::before, .controls::after{ content:none !important; }

/* kalkulačka — Win11 Calculator */
.calc-screen{
  text-align:right; padding:18px 16px !important;
  font-size:30px !important; font-weight:600 !important;
  font-variant-numeric:tabular-nums; color:var(--tx-1) !important;
  background:transparent !important; border:0 !important;
}
/* klávesnice kalkulačky patří do úzkého sloupce, ne přes celý panel */
.calc-screen, .calc-pad{ max-width:420px; margin-left:auto !important; margin-right:auto !important; }
.calc-pad{ display:grid; gap:3px; }
.calc-pad button{
  height:48px;
  background:var(--ctrl) !important;
  border:1px solid var(--stroke) !important;
  border-radius:var(--r-ctrl) !important;
  color:var(--tx-1) !important; font-size:16px !important;
  box-shadow:none !important; cursor:pointer;
  transition:background var(--d-micro) var(--e-out), transform var(--d-fast) var(--e-apple);
}
.calc-pad button:hover{ background:var(--ctrl-hover) !important; }
.calc-pad button:active{ background:var(--ctrl-press) !important; transform:scale(.95); }
.calc-pad button.op, .calc-pad button[data-op]{ background:var(--layer-alt) !important; }
.calc-pad button.eq, .calc-pad button[data-eq]{
  background:var(--acc) !important; color:#000 !important; border-color:transparent !important; font-weight:600 !important;
}

/* segmentované přepínače */
.seg, .q-btn, .q-ico, .len-presets button{
  background:var(--ctrl) !important; border:1px solid var(--stroke) !important;
  border-radius:var(--r-ctrl) !important; color:var(--tx-1) !important;
  box-shadow:none !important;
  transition:background var(--d-micro) var(--e-out), transform var(--d-fast) var(--e-apple);
}
.seg button.active, .q-btn.active, .len-presets button.active{
  background:var(--acc) !important; color:#000 !important; border-color:transparent !important; font-weight:600 !important;
}
.seg button:active, .q-btn:active, .len-presets button:active{ transform:scale(.96); }

/* výsledky, kód */
.css-out, .fmt, .mc-json, .code-view{
  font-size:12.5px !important; line-height:1.55; color:var(--tx-2) !important;
  background:var(--sol-alt) !important; padding:12px !important;
}

/* legenda / statistiky */
.sb-legend, .sb-leg, .sb-total{ font-size:12px !important; color:var(--tx-3) !important; }
.va-title{ font-size:13.5px !important; color:var(--tx-1) !important; font-weight:600 !important; }
.va-sub, .va-tsize, .va-tnum{ font-size:11.5px !important; color:var(--tx-3) !important; }

/* ══════════════════════════════════════════════════════════════════
   23 · POHYBOVÝ SYSTÉM — jemné, „Apple“ přechody napříč webem
   ══════════════════════════════════════════════════════════════════ */
a, button, .card, .fsb-row, .ctx-item, .theme-card, .type-chip,
.breadcrumb-item, .auth-app, input, select, textarea{
  -webkit-tap-highlight-color:transparent;
}
/* zdvih stránky při načtení */
#app, main{ animation:expPageIn var(--d-page) var(--e-apple); }
@keyframes expPageIn{
  from{ opacity:0; transform:translateY(6px); }
  to  { opacity:1; transform:none; }
}
/* postupné nabíhání dlaždic (index nastavuje explorer.js) */
.grid > .card{ animation-delay:calc(var(--i,0) * 22ms); }

/* vypnuté animace (uživatelské nastavení / systémová preference) */
html.no-anim *, html.no-anim *::before, html.no-anim *::after{
  animation:none !important; transition:none !important;
}
@media (prefers-reduced-motion:reduce){
  *, *::before, *::after{
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;
  }
}

/* ══════════════════════════════════════════════════════════════════
   24 · RESPONZIVITA
   ══════════════════════════════════════════════════════════════════ */
@media (max-width:999px){
  #folderSidebar{ width:min(300px,86vw) !important; box-shadow:var(--el-dialog) !important; }
}
@media (max-width:768px){
  html{ font-size:15px; }
  .header-top{ height:40px; padding:0 10px; }
  .header-bar{ padding:0 8px; flex-wrap:wrap; height:auto; padding-bottom:6px; }
  .toolbar{ padding:6px 8px !important; flex-wrap:wrap; }
  .search-wrap{ order:-1; flex:1 1 100%; max-width:none; }
  main{ padding:10px 8px 72px !important; }
  .grid{ grid-template-columns:repeat(auto-fill,minmax(142px,1fr)) !important; }
  .card{ min-height:156px !important; }
  .card-icon{ width:38px !important; height:38px !important; }
  .card-icon svg{ width:36px !important; height:36px !important; }
  .clock-widget{ display:none; }
  .settings-panel{ width:96vw !important; }
  .sc-grid{ grid-template-columns:1fr; }
}
@media (max-width:430px){
  .grid{ grid-template-columns:repeat(auto-fill,minmax(112px,1fr)) !important; }
  .card{ min-height:140px !important; padding:10px 6px !important; }
  .card-title{ font-size:11.5px !important; }
  .stat.stat-links{ display:none; }
  .theme-grid{ grid-template-columns:repeat(auto-fit,minmax(86px,1fr)) !important; }
}

/* ══════════════════════════════════════════════════════════════════
   25 · TISK
   ══════════════════════════════════════════════════════════════════ */
@media print{
  header, .toolbar, #folderSidebar, .breadcrumb, .select-bar, .toast{ display:none !important; }
  body{ background:#fff !important; color:#000 !important; }
}

/* ══════════════════════════════════════════════════════════════════
   26 · ZOBRAZENÍ „PODROBNOSTI" (Explorer Details) — výchozí
        Tabulka Název / Datum změny / Typ / Velikost.
        Sloupce hlavičky i řádků sdílí --exp-cols, aby lícovaly.
   ══════════════════════════════════════════════════════════════════ */
/* Šířky sloupců podle skutečného Průzkumníka: pevné, zarovnané doleva,
   zbytek pruhu zůstává prázdný (poslední 1fr je jen výplň). */
:root{ --exp-cols: 16px 236px 150px 126px 78px; }

/* ── hlavička sloupců ─────────────────────────────────────────── */
.exp-cols{
  display:none;
  grid-template-columns:var(--exp-cols);
  align-items:stretch; column-gap:10px;
  height:26px; margin:0 0 5px; padding:0 12px; width:max-content;
  /* stejný 1px rámeček jako mají řádky, jinak sloupce lícují o pixel vedle */
  border:1px solid transparent;
  border-bottom:1px solid var(--divider);
  background:var(--sol-base);
  position:sticky; top:136px; z-index:20;
}
html[data-view="details"] .exp-cols{ display:grid; }
.exp-col{
  display:flex; align-items:center; gap:6px;
  height:100%; padding:0; margin:0;   /* bez odsazení, aby popisek lícoval s textem v řádku */
  background:transparent; border:0; border-radius:0;
  font-size:12px; font-weight:400; color:var(--tx-2);
  text-align:left; cursor:pointer; position:relative; overflow:hidden;
  transition:background var(--d-micro) var(--e-out), color var(--d-micro) var(--e-out);
}
.exp-col-ico{ cursor:default; }
button.exp-col:hover{ background:var(--subtle-hover); color:var(--tx-1); }
button.exp-col:active{ background:var(--subtle-press); }
.exp-col + .exp-col::before{
  content:''; position:absolute; left:-6px; top:8px; bottom:8px;
  width:1px; background:var(--divider);
}
.exp-col-size{ justify-content:flex-end; }
.exp-col-arrow{ display:none; }
.exp-col.sorted{ color:var(--tx-1); }
/* Průzkumník kreslí šipku vodorovně na střed nad popiskem sloupce */
.exp-col.sorted::after{
  content:''; position:absolute; left:50%; top:2px; translate:-50% 0;
  width:9px; height:5px; background:var(--tx-2);
  clip-path:polygon(50% 0, 100% 100%, 0 100%);
}
.exp-col.sorted.desc::after{ clip-path:polygon(0 0, 100% 0, 50% 100%); }

/* ── řádky ────────────────────────────────────────────────────── */
html[data-view="details"] #grid, html[data-view="details"] .grid{
  display:block !important;
}
html[data-view="details"] .card[data-kind]{
  display:grid !important;
  grid-template-columns:var(--exp-cols);
  /* MUSÍ se resetovat — jinak sem prosáknou řádky a oblasti z dlaždicového
     rozvržení („ico name" / „body body") a náhledy přetečou do dalšího řádku */
  grid-template-rows:minmax(0,1fr) !important;
  grid-template-areas:none !important;
  align-items:center; column-gap:10px; row-gap:0 !important;
  height:28px !important; min-height:0 !important; max-height:28px !important;
  padding:0 12px !important;
  /* mezera mezi řádky + šířka jen na obsah — vpravo i mezi řádky tak zůstane
     volná plocha, ze které jde vytáhnout výběrový rámeček */
  margin:0 0 3px !important;
  width:max-content !important; min-width:0 !important;
  background:transparent !important;
  border:1px solid transparent !important;
  border-radius:4px !important;
  overflow:hidden;
  animation:none !important;
  transition:background var(--d-micro) var(--e-out), border-color var(--d-micro) var(--e-out);
}
html[data-view="details"] .card[data-kind]:hover{
  background:var(--subtle-hover) !important; border-color:transparent !important;
  transform:none !important;
}
html[data-view="details"] .card[data-kind]:active{ transform:none !important; }
/* Průzkumník nebarví vybraný řádek akcentem — je to jen světlejší šedá
   (ControlFillColorSecondary) s jemným obrysem. */
html[data-view="details"] .card[data-kind].selected{
  background:rgba(255,255,255,.0955) !important;
  border-color:rgba(255,255,255,.0698) !important;
}
/* index.html:1085 dává vybrané kartě `box-shadow: var(--glow-cyan) !important`.
   Uživatelský akcent přepisuje --glow-cyan za barevnou záři → oranžový svit.
   V seznamu chceme jen tenký obrys, žádnou záři. */
.card[data-kind], .card[data-kind].selected, .card[data-kind]:hover{
  box-shadow:none !important;
}
html[data-view="details"] .card[data-kind].selected:hover{ background:rgba(255,255,255,.1163) !important; }
/* řádek s klávesovým ohniskem — tečkovaný rámeček jako ve Windows */
html[data-view="details"] .card[data-kind].exp-focus{
  outline:1px solid rgba(255,255,255,.32); outline-offset:-2px;
}
html[data-view="details"] .card[data-kind].pinned{ border-color:transparent !important; }

/* sloupec 1 — ikona (+ špendlík/hvězda vpravo v témže sloupci) */
html[data-view="details"] .card[data-kind] > .card-icon,
html[data-view="details"] .card[data-kind] > .folder-icon,
html[data-view="details"] .card[data-kind] > .preview-wrap,
html[data-view="details"] .card[data-kind] > .video-thumb{
  grid-column:1; grid-row:1; justify-self:start; align-self:center !important;
  width:16px !important; height:16px !important;
  /* .preview-wrap má v index.html min-height i flex-basis na 64 px
     (--nyx-preview-height) — bez těchto resetů náhled roztáhne řádek */
  min-width:0 !important; min-height:0 !important;
  max-width:16px !important; max-height:16px !important;
  flex:0 0 16px !important;
  margin:0 !important; padding:0 !important;
  background:transparent !important; border:0 !important; border-radius:3px !important;
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
html[data-view="details"] .card[data-kind] > .card-icon svg,
html[data-view="details"] .card[data-kind] > .card-icon i,
html[data-view="details"] .card[data-kind] > .folder-icon svg,
html[data-view="details"] .card[data-kind] > .folder-icon i{
  width:16px !important; height:16px !important; stroke-width:1.7 !important;
}
html[data-view="details"] .card[data-kind] .file-preview{
  width:16px !important; height:16px !important; object-fit:cover; border-radius:2px !important;
}
html[data-view="details"] .card[data-kind] .video-play{ display:none !important; }
html[data-view="details"] .card[data-kind] .preview-spinner{ display:none !important; }
html[data-view="details"] .card[data-kind] > .top-badges{
  position:static !important; grid-column:1; grid-row:1; justify-self:end;
  display:flex; gap:1px; top:auto !important; right:auto !important;
}
html[data-view="details"] .card[data-kind] > .top-badges > *{
  width:14px !important; height:14px !important;
  background:transparent !important; border:0 !important; color:var(--folder) !important;
}
html[data-view="details"] .card[data-kind] > .top-badges svg{ width:11px !important; height:11px !important; }

/* sloupec 2 — název */
html[data-view="details"] .card[data-kind] > .card-title{
  grid-column:2; grid-row:1; margin:0 !important;
  font-size:12px !important; font-weight:400 !important;
  color:var(--tx-1) !important; text-align:left !important;
  white-space:nowrap !important; overflow:hidden; text-overflow:ellipsis;
  display:block !important; -webkit-line-clamp:none !important;
}

/* sloupce 3–5 — datum, typ, velikost */
html[data-view="details"] .card-meta[data-col="date"]{ grid-column:3; grid-row:1; }
html[data-view="details"] .exp-type{ grid-column:4; grid-row:1; }
html[data-view="details"] .card-meta[data-col="size"]{ grid-column:5; grid-row:1; text-align:right !important; }
html[data-view="details"] .card[data-kind] > .card-meta[data-col],
html[data-view="details"] .card[data-kind] > .exp-type{
  display:block !important;
  font-size:12px !important; color:var(--tx-2) !important;
  margin:0 !important; padding:0 !important; text-align:left;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  font-variant-numeric:tabular-nums;
}

/* co se v seznamu nezobrazuje */
.exp-type{ display:none; }
html[data-view="details"] .card[data-kind] > .card-content,
html[data-view="details"] .card[data-kind] > .folder-count,
html[data-view="details"] .card[data-kind] > .card-meta:not([data-col]),
html[data-view="details"] .card[data-kind] > .share-badge,
html[data-view="details"] .card[data-kind] > .card-tag,
html[data-view="details"] .exp-sec-h{ display:none !important; }
html[data-view="details"] .card[data-color]::after{ display:none !important; content:none !important; }

/* režim výběru — zaškrtávátko v levém okraji, jako v Exploreru */
html[data-view="details"] #grid:has(.card-checkbox) .card[data-kind]{ padding-left:34px !important; }
html[data-view="details"] .card[data-kind] > .card-checkbox{
  position:absolute; left:8px; top:50%; translate:0 -50%;
  width:18px !important; height:18px !important; font-size:11px;
}
html[data-view="details"] .card[data-kind] > .select-overlay{ position:absolute; inset:0; z-index:4; }
html[data-view="details"] .card[data-kind] > .card-actions{
  position:static; grid-column:2 / -1; grid-row:1; justify-self:end;
  opacity:1; transform:none; margin:0; z-index:5;
}
html[data-view="details"] .card-btn{ height:24px; font-size:11.5px !important; }

/* Průzkumník žádný řádek „přidat" nemá — v seznamu se skryje a jeho místo
   zastane tlačítko „Nový" v příkazovém pruhu (vkládá ho explorer.js). */
html[data-view="details"] .card[data-kind="add"]{ display:none !important; }
.exp-shell .toolbar .exp-new{ order:1; }
.exp-shell .toolbar .toolbar-btn:not(.exp-new){ order:2; }
.exp-new i, .exp-new svg{ color:var(--acc); }

/* v seznamu nemá ovladač velikosti dlaždic aktivní stav */
html[data-view="details"] .gridsize-ctl button[data-gs]{
  background:transparent !important; color:var(--tx-2) !important;
}
.gridsize-ctl button[data-view-btn]{
  width:28px; height:26px; padding:0; border:0; border-radius:3px;
  background:transparent; color:var(--tx-2); cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  transition:background var(--d-micro) var(--e-out), color var(--d-micro) var(--e-out);
}
.gridsize-ctl button[data-view-btn]:hover{ background:var(--subtle-hover); color:var(--tx-1); }
.gridsize-ctl button[data-view-btn].active{ background:var(--acc); color:#000; }
.gridsize-ctl button[data-view-btn] svg{ width:15px; height:15px; }

/* užší displeje — schovat méně důležité sloupce */
@media (max-width:900px){
  :root{ --exp-cols: 36px minmax(110px,1fr) 132px 0 88px; }
  .exp-col-type, html[data-view="details"] .exp-type{ display:none !important; }
}
@media (max-width:600px){
  :root{ --exp-cols: 34px minmax(90px,1fr) 0 0 82px; }
  .exp-col-date, html[data-view="details"] .card-meta[data-col="date"]{ display:none !important; }
  .exp-cols{ top:auto; position:static; }
}

/* ══════════════════════════════════════════════════════════════════
   27 · CHOVÁNÍ PRŮZKUMNÍKA — doplňky ke stylu
   ══════════════════════════════════════════════════════════════════ */

/* v seznamu se nevybírá text — jinak tažení myší maluje modrý výběr */
html[data-view="details"] #grid{ user-select:none; -webkit-user-select:none; }

/* úchyt na tažení šířky sloupce */
.exp-grip{
  position:absolute; right:-5px; top:0; bottom:0; width:10px;
  cursor:col-resize; z-index:2;
}
.exp-grip::after{
  content:''; position:absolute; left:4px; top:7px; bottom:7px; width:1px;
  background:var(--divider);
}
.exp-col:hover .exp-grip::after{ background:var(--stroke-strong); }
/* původní oddělovač pryč — teď ho kreslí úchyt */
.exp-col + .exp-col::before{ content:none; }

/* počet vybraných ve stavovém řádku, jako v Průzkumníku */
.exp-sel-count{
  color:var(--tx-2); font-size:12px; margin-left:auto; padding-left:14px;
  white-space:nowrap;
}
.exp-sel-count:empty{ display:none; }

/* Jen NAŠE plněná složka — `stroke:none` plošně zneviditelnilo lucide ikony
   koše a domů, protože ty jsou tažené (`fill:none` + stroke). */
[data-exp-ico="1"] svg{ color:inherit; }
[data-exp-ico="1"] path{ stroke:none; }

/* adresní řádek: doplněná kořenová položka */
.exp-addressbar .breadcrumb-item svg{ margin-right:5px; flex:0 0 auto; }

/* ══════════════════════════════════════════════════════════════════
   28 · VLASTNÍ PŘEHRÁVAČ (místo nativního ovládání Chromu)
   ══════════════════════════════════════════════════════════════════ */
#viewer video, #viewer audio.viewer-audio{ outline:none; }
/* pro jistotu i kdyby se někde vrátilo nativní ovládání */
#viewer video::-webkit-media-controls, #viewer audio::-webkit-media-controls{ display:none !important; }

.exp-player{
  display:flex; align-items:center; gap:11px;
  height:46px; padding:0 14px;
  background:var(--sol-quart);
  border:1px solid var(--stroke-2);
  border-radius:var(--r-overlay);
  box-shadow:var(--el-flyout);
  color:var(--tx-1);
  width:min(560px, 92vw); margin:14px auto 0;
  user-select:none;
}
/* u videa leží pruh na spodní hraně prohlížeče, nad filmovým pásem */
.exp-player-video{
  position:absolute; left:50%; bottom:104px; translate:-50% 0;
  margin:0; z-index:30;
  background:rgba(32,32,32,.92);
  width:min(620px, 92vw);
  opacity:0; transition:opacity var(--d-base) var(--e-out);
  pointer-events:none;
}
.viewer:hover .exp-player-video,
.exp-player-video:hover,
.viewer.controls-pinned .exp-player-video{ opacity:1; pointer-events:auto; }

.expp-btn{
  width:32px; height:32px; flex:0 0 auto;
  display:flex; align-items:center; justify-content:center;
  background:transparent; border:0; border-radius:var(--r-ctrl);
  color:var(--tx-1); cursor:pointer;
  transition:background var(--d-micro) var(--e-out), transform var(--d-fast) var(--e-apple);
}
.expp-btn:hover{ background:var(--subtle-hover); }
.expp-btn:active{ transform:scale(.92); }
.expp-btn svg{ width:19px; height:19px; }
.expp-play svg{ width:21px; height:21px; }

.expp-time{
  font-size:12px; color:var(--tx-2); font-variant-numeric:tabular-nums;
  flex:0 0 auto; min-width:38px; text-align:center;
}

.expp-seek{
  position:relative; flex:1 1 auto; height:16px; cursor:pointer;
  display:flex; align-items:center;
}
.expp-seek::before{
  content:''; position:absolute; left:0; right:0; height:3px;
  background:var(--ctrl-hover); border-radius:2px;
}
.expp-buf{
  position:absolute; left:0; height:3px; width:0;
  background:rgba(255,255,255,.14); border-radius:2px;
}
.expp-fill{
  position:absolute; left:0; height:3px; width:0;
  background:var(--acc); border-radius:2px;
}
.expp-knob{
  position:absolute; top:50%; left:0; translate:-50% -50%;
  width:11px; height:11px; border-radius:50%;
  background:var(--acc); box-shadow:0 0 0 3px var(--sol-quart);
  transition:transform var(--d-fast) var(--e-spring);
}
.expp-seek:hover .expp-knob{ transform:scale(1.25); }

.expp-vol{
  position:relative; flex:0 0 62px; height:16px; cursor:pointer;
  display:flex; align-items:center;
}
.expp-vol::before{
  content:''; position:absolute; left:0; right:0; height:3px;
  background:var(--ctrl-hover); border-radius:2px;
}
.expp-vol-fill{
  position:absolute; left:0; height:3px; width:100%;
  background:var(--tx-2); border-radius:2px;
}

@media (max-width:600px){
  .expp-vol, .expp-mute{ display:none; }
  .exp-player{ gap:8px; padding:0 10px; }
}

/* ── výběrový rámeček tažením (jako v Průzkumníku) ─────────────── */
/* (starý jednoduchý rámeček nahrazen sekcí 29 níž) */
/* plocha, ze které jde rámeček vytáhnout, musí sahat pod poslední řádek */
html[data-view="details"] main{ min-height:60vh; }
html[data-view="details"] #grid{ min-height:52vh; }

/* ══════════════════════════════════════════════════════════════════
   29 · VÝBĚROVÝ RÁMEČEK — animace
        Vrstvy: výplň s přelivem → pochodující tečkování → rohové značky.
        Vše na transform/opacity, žádné layoutové vlastnosti.
   ══════════════════════════════════════════════════════════════════ */
.exp-marquee{
  position:fixed; z-index:45; pointer-events:none;
  border-radius:3px;
  background:rgba(var(--acc-rgb),.15);
  box-shadow:
    inset 0 0 0 1px rgba(var(--acc-rgb),.85),
    0 0 0 1px rgba(0,0,0,.4),
    0 0 26px -6px rgba(var(--acc-rgb),.65);
  /* JEN prichod a odchod - uvnitr ramecku se nic nehybe (prani Sefa) */
  animation:expMarqIn 170ms var(--e-apple);
  will-change:transform, opacity;
}
@keyframes expMarqIn{
  from{ opacity:0; transform:scale(.9); }
  to  { opacity:1; transform:scale(1); }
}

/* pochodující tečkování po obvodu (klasické „marching ants") */
.exp-marquee::before{
  content:''; position:absolute; inset:-1px;
  border-radius:4px; padding:1px;
  background:repeating-linear-gradient(90deg,
    rgba(255,255,255,.92) 0 5px, transparent 5px 11px);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  opacity:.5;
}

/* rohové značky (statické) */
.exp-marquee::after{
  content:''; position:absolute; inset:0; border-radius:3px;
  background:
    linear-gradient(var(--acc),var(--acc)) left    0    top    0    / 10px 2px no-repeat,
    linear-gradient(var(--acc),var(--acc)) left    0    top    0    / 2px 10px no-repeat,
    linear-gradient(var(--acc),var(--acc)) right   0    top    0    / 10px 2px no-repeat,
    linear-gradient(var(--acc),var(--acc)) right   0    top    0    / 2px 10px no-repeat,
    linear-gradient(var(--acc),var(--acc)) left    0    bottom 0    / 10px 2px no-repeat,
    linear-gradient(var(--acc),var(--acc)) left    0    bottom 0    / 2px 10px no-repeat,
    linear-gradient(var(--acc),var(--acc)) right   0    bottom 0    / 10px 2px no-repeat,
    linear-gradient(var(--acc),var(--acc)) right   0    bottom 0    / 2px 10px no-repeat;
}

/* puštění — krátce zazáří a splaskne */
.exp-marquee.exp-out{ animation:expMarqOut 240ms var(--e-apple) forwards; }
.exp-marquee.exp-out::before,
.exp-marquee.exp-out::after{ animation-play-state:paused; }
@keyframes expMarqOut{
  0%  { opacity:1; transform:scale(1);     filter:brightness(1); }
  30% { opacity:1; transform:scale(1.015); filter:brightness(1.85); }
  100%{ opacity:0; transform:scale(.97);   filter:brightness(1); }
}

/* počítadlo u kurzoru */
.exp-marq-count{
  position:fixed; z-index:46; pointer-events:none;
  min-width:24px; height:24px; padding:0 8px;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--fnt-ui); font-size:12px; font-weight:600;
  color:#04121a; background:var(--acc);
  border-radius:12px;
  box-shadow:0 6px 18px -4px rgba(0,0,0,.6), 0 0 0 2px var(--sol-base),
             0 0 18px -4px rgba(var(--acc-rgb),.9);
  animation:expCountIn 200ms var(--e-spring);
  will-change:transform;
}
@keyframes expCountIn{
  from{ opacity:0; transform:scale(.4); }
  to  { opacity:1; transform:scale(1); }
}
.exp-marq-count.bump{ animation:expCountBump 300ms var(--e-spring); }
@keyframes expCountBump{
  0%  { transform:scale(1); }
  38% { transform:scale(1.32); }
  100%{ transform:scale(1); }
}
.exp-marq-count.exp-out{ animation:expCountOut 200ms var(--e-apple) forwards; }
@keyframes expCountOut{
  0%  { opacity:1; transform:scale(1); }
  100%{ opacity:0; transform:scale(.5) translateY(-8px); }
}

/* řádek právě chycený rámečkem — zablikne akcentem */
html[data-view="details"] .card[data-kind].exp-caught{
  outline:1px solid transparent; outline-offset:-1px;
  animation:expCatch 440ms var(--e-out);
}
@keyframes expCatch{
  0%  { background-color:rgba(var(--acc-rgb),.5);  outline-color:rgba(var(--acc-rgb),.95); }
  45% { background-color:rgba(var(--acc-rgb),.22); outline-color:rgba(var(--acc-rgb),.5); }
  100%{ background-color:rgba(255,255,255,.0955);  outline-color:transparent; }
}

/* po puštění projede výběrem vlna shora dolů */
html[data-view="details"] .card[data-kind].exp-locked{
  animation:expLock 340ms var(--e-out) backwards;
}
@keyframes expLock{
  0%  { background-color:rgba(var(--acc-rgb),.38); }
  100%{ background-color:rgba(255,255,255,.0955); }
}

/* v dlaždicích je vlna jemnější (karta má vlastní pozadí) */
html[data-view="grid"] .card[data-kind].exp-caught,
html[data-view="grid"] .card[data-kind].exp-locked{
  animation:expCatchTile 420ms var(--e-out);
}
@keyframes expCatchTile{
  0%  { transform:scale(.965); }
  55% { transform:scale(1.012); }
  100%{ transform:scale(1); }
}

/* ══════════════════════════════════════════════════════════════════
   30 · HLAVIČKA — pořádný titulkový pruh
        Logo přetékalo 44px pruh (46px vysoké), název se subtitulkem se
        lámal na dva řádky a hodiny taky. Teď vše na jedné lince,
        svisle na střed, zarovnané s hlavičkou navigačního panelu.
   ══════════════════════════════════════════════════════════════════ */
.exp-shell header{ background:var(--mica); }
.exp-shell .header-top{
  height:40px !important; min-height:40px;
  display:flex !important; align-items:center !important;
  /* stránka má na pruhu flex-wrap:wrap — rozhazuje to řádkový box
     a logo pak sedí 14 px pod středem. Titulkový pruh se nezalamuje. */
  flex-wrap:nowrap !important;
  justify-content:space-between; gap:12px;
  padding:0 12px !important; margin:0 !important;
  border-bottom:1px solid var(--divider) !important;
  /* N2 2026-08-05: bylo tu overflow:hidden a uřezávalo to KAŽDÝ flyout
     ukotvený v titulkovém pruhu. Spouštěč aplikací visí 10 px pod 40px
     pruhem, takže z 255px popupu bylo vidět 8 px — tlačítko reagovalo,
     ale okno nikoli. Clip tu nic nedrží: původní .logo je display:none
     a .exp-title-name/.exp-title-sub si text ořezávají samy
     (overflow:hidden + text-overflow:ellipsis). */
  overflow:visible;
}
/* Logo se ve flex řádku pruhu odmítalo vycentrovat (sedělo 14 px pod středem
   bez ohledu na align-items/align-self/stretch). Místo hádání s flexem je
   ukotvené absolutně: top:0 + bottom:0 + margin:auto svisle vycentruje vždy. */
.exp-shell .header-top{ position:relative !important; }
.exp-shell .header-top > .logo{
  position:absolute !important; left:12px; top:0; bottom:0;
  height:18px !important; margin:auto 0 !important; padding:0 !important;
  display:flex !important; align-items:center !important;
  gap:9px; min-width:0; max-width:calc(100% - 300px);
}
.exp-shell .header-top > .header-bar-right{ margin-left:auto !important; }
.exp-shell .logo-img{ width:18px !important; height:18px !important; flex:0 0 auto; margin:0 !important; }
.exp-shell .logo-text{
  display:flex !important; flex-direction:row !important;
  align-items:baseline !important; gap:9px; min-width:0;
}
.exp-shell .logo-main{
  font-family:var(--fnt-display) !important;
  font-size:13px !important; font-weight:600 !important; line-height:1 !important;
  color:var(--tx-1) !important; margin:0 !important; white-space:nowrap;
}
.exp-shell .logo-sub{
  position:relative; margin:0 !important; padding-left:10px !important;
  font-size:11.5px !important; line-height:1 !important;
  color:var(--tx-3) !important; white-space:nowrap;
}
.exp-shell .logo-sub::before{
  content:''; position:absolute; left:0; top:50%; translate:0 -50%;
  width:1px; height:11px; background:var(--divider);
}

/* hodiny taky na jednu linku */
.exp-shell .clock-widget{
  display:flex !important; flex-direction:row !important;
  align-items:baseline !important; gap:8px; padding:0 !important; text-align:left;
}
.exp-shell .clock-time{ font-size:12.5px !important; line-height:1 !important; }
.exp-shell .clock-date{
  font-size:11.5px !important; line-height:1 !important; color:var(--tx-3) !important;
}

/* hlavička navigačního panelu musí lícovat s titulkovým pruhem */
.fsb-header{ height:40px !important; }

/* přepínač panelu není přepínač filtru — bez akcentového podtržení */
.exp-shell .sidebar-toggle.active::after{ content:none !important; }
.exp-shell .sidebar-toggle.active{ background:var(--ctrl-hover) !important; }

@media (max-width:900px){
  .exp-shell .logo-sub{ display:none !important; }
  .exp-shell .clock-date{ display:none !important; }
}

/* ── vyjmuté položky (Ctrl+X) — v Průzkumníku zprůhlední ────────── */
.card[data-kind].exp-cut{ opacity:.45; }
.card[data-kind].exp-cut .card-title{ font-style:italic; }

/* textová tlačítka v liště prohlížeče (1:1, 100 %, …) byla nečitelně drobná */
.viewer-toolbar .vtb-btn{
  font-size:12px !important; font-weight:600 !important;
  letter-spacing:normal !important; line-height:1;
}
.viewer-toolbar .vtb-btn:not(:has(svg)):not(:has(i)){ min-width:44px; padding:0 8px !important; }

/* ── vlastní titulek okna (postavený v explorer.js) ─────────────── */
.exp-shell .header-top > .logo{ display:none !important; }
.exp-title{
  display:flex; align-items:center; gap:9px;
  height:100%; min-width:0; flex:0 1 auto;
}
.exp-title-ico{
  width:18px; height:18px; flex:0 0 auto; display:block;
  border-radius:3px;
}
.exp-title-name{
  font-family:var(--fnt-display); font-size:13px; font-weight:600;
  color:var(--tx-1); line-height:1; white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis;
}
.exp-title-sub{
  position:relative; padding-left:10px; margin-left:1px;
  font-size:11.5px; line-height:1; color:var(--tx-3);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.exp-title-sub::before{
  content:''; position:absolute; left:0; top:50%; translate:0 -50%;
  width:1px; height:11px; background:var(--divider);
}
@media (max-width:900px){ .exp-title-sub{ display:none; } }

/* ══════════════════════════════════════════════════════════════════
   31 · CHYBOVÁ STRÁNKA (error.php)
        Původně glitch nápis, scanliny, mřížka, Orbitron a svítící
        tlačítka. Teď klidná stránka ve stylu zbytku systému.
   ══════════════════════════════════════════════════════════════════ */
html[data-page="error"] body{
  display:flex; align-items:center; justify-content:center;
  padding:24px; overflow:auto !important;
  background:var(--sol-base) !important; background-image:none !important;
}
html[data-page="error"] .wrap{
  max-width:520px; width:100%; text-align:center;
  padding:36px 32px;
  background:var(--layer);
  border:1px solid var(--stroke);
  border-radius:var(--r-overlay);
  box-shadow:var(--el-dialog);
  animation:expDialogIn var(--d-slow) var(--e-apple);
}
html[data-page="error"] .logo-img{
  width:48px !important; height:48px !important; margin:0 auto 18px !important;
  filter:none !important; animation:none !important;
}
/* velké číslo — bez glitche, bez záře, bez blikání */
html[data-page="error"] .code{
  font-family:var(--fnt-display) !important; font-weight:600 !important;
  font-size:clamp(64px,14vw,104px) !important; line-height:1 !important;
  letter-spacing:-.02em !important;
  color:var(--tx-1) !important; text-shadow:none !important;
  animation:none !important; max-width:100%;
}
html[data-page="error"] .code::before,
html[data-page="error"] .code::after{ content:none !important; display:none !important; }

html[data-page="error"] .title{
  font-family:var(--fnt-display) !important; font-weight:600 !important;
  font-size:17px !important; letter-spacing:normal !important;
  color:var(--tx-1) !important; text-shadow:none !important;
  margin:10px 0 14px !important;
}
html[data-page="error"] .term{
  font-family:var(--fnt-ui) !important; font-size:13.5px !important;
  letter-spacing:normal !important; color:var(--tx-2) !important;
  opacity:1 !important; margin-bottom:4px !important; line-height:1.5;
}
html[data-page="error"] .term .pr{ display:none !important; }   /* „nyxium@dataspace:~$" */
html[data-page="error"] .term .cur{ display:none !important; }  /* blikající kurzor */
html[data-page="error"] .path{
  display:inline-block; margin:14px 0 24px !important;
  padding:6px 11px; max-width:100%;
  font-family:var(--fnt-mono) !important; font-size:12px !important;
  color:var(--tx-3) !important;
  background:var(--sol-alt); border:1px solid var(--stroke);
  border-radius:var(--r-ctrl);
  word-break:break-all;
}
html[data-page="error"] .btns{ gap:8px !important; }

/* tlačítka — Fluent, žádné přechody ani záře */
html[data-page="error"] .cloud-btn{
  height:34px; padding:0 16px !important; gap:9px;
  font-family:var(--fnt-ui) !important; font-weight:600 !important;
  font-size:13px !important; letter-spacing:normal !important;
  color:#04121a !important;
  background:var(--acc) !important;
  border:1px solid transparent !important;
  border-bottom-color:rgba(0,0,0,.28) !important;
  border-radius:var(--r-ctrl) !important;
  box-shadow:none !important;
  transition:background var(--d-micro) var(--e-out), transform var(--d-fast) var(--e-apple);
}
html[data-page="error"] .cloud-btn:hover{
  background:var(--acc-hi) !important; box-shadow:none !important; transform:none !important;
}
html[data-page="error"] .cloud-btn:active{ transform:scale(.97); }
html[data-page="error"] .cloud-btn .ba{ stroke:#04121a !important; width:16px !important; height:16px !important; }
html[data-page="error"] .cloud-btn .bl{
  width:18px !important; height:18px !important;
  filter:none !important; animation:none !important;
}
html[data-page="error"] .cloud-btn span,
html[data-page="error"] .cloud-btn span b{ text-shadow:none !important; color:#04121a !important; }

html[data-page="error"] .btn{
  height:34px; padding:0 16px !important;
  font-family:var(--fnt-ui) !important; font-size:13px !important;
  letter-spacing:normal !important;
  color:var(--tx-1) !important;
  background:var(--ctrl) !important;
  border:1px solid var(--stroke) !important;
  border-bottom-color:var(--ctrl-edge) !important;
  border-radius:var(--r-ctrl) !important;
  box-shadow:none !important;
}
html[data-page="error"] .btn:hover{
  background:var(--ctrl-hover) !important; transform:none !important;
  box-shadow:none !important; border-color:var(--stroke) !important; color:var(--tx-1) !important;
}
html[data-page="error"] .convert-chip{
  animation:none !important; background:var(--ctrl) !important;
  border:1px solid var(--stroke) !important; box-shadow:none !important;
  font-family:var(--fnt-ui) !important; font-weight:400 !important;
  letter-spacing:normal !important; color:var(--tx-1) !important;
}
html[data-page="error"] .convert-chip::after{ content:none !important; }
html[data-page="error"] .convert-chip .dash{ animation:none !important; }

/* ══════════════════════════════════════════════════════════════════
   32 · NOČNÍ HODINY (/spanek)
        Bylo: růžové a žluté neonové číslice se září, blikáním
        a pulzujícím nápisem. Teď klidný hodinový displej.
   ══════════════════════════════════════════════════════════════════ */
.glow-tl, .glow-br, .glow-tr, .glow-bl{ display:none !important; }

html[data-page="spanek"] body{ background:var(--sol-base) !important; }
html[data-page="spanek"] .label{
  font-family:var(--fnt-ui) !important;
  font-size:12px !important; letter-spacing:.08em !important;
  color:var(--tx-3) !important; text-shadow:none !important;
  opacity:1 !important; margin-bottom:14px !important;
}
html[data-page="spanek"] .clock-main{ line-height:1.05 !important; align-items:baseline !important; }
html[data-page="spanek"] .hms{
  font-family:var(--fnt-display) !important;
  font-size:clamp(3.5rem,15vw,11rem) !important; font-weight:600 !important;
  letter-spacing:-.02em !important; line-height:1.05 !important;
  color:var(--tx-1) !important; text-shadow:none !important;
  animation:none !important; font-variant-numeric:tabular-nums;
}
html[data-page="spanek"] .cs-wrap{ padding-top:0 !important; align-self:flex-end; margin-bottom:.6em; }
html[data-page="spanek"] .cs-dot{
  font-family:var(--fnt-display) !important;
  font-size:clamp(1.4rem,4.5vw,3.2rem) !important; font-weight:400 !important;
  color:var(--tx-3) !important; text-shadow:none !important; opacity:1 !important;
  font-variant-numeric:tabular-nums;
}
html[data-page="spanek"] .sep{ animation:expSepBlink 2s steps(1) infinite !important; }
@keyframes expSepBlink{ 0%,100%{opacity:1} 50%{opacity:.42} }
html[data-page="spanek"] .date-line{
  font-family:var(--fnt-ui) !important;
  font-size:13px !important; letter-spacing:normal !important;
  color:var(--tx-3) !important; margin-top:14px !important;
}
html[data-page="spanek"] .sleep-title{
  font-family:var(--fnt-display) !important;
  font-size:clamp(2.4rem,9vw,6rem) !important; font-weight:600 !important;
  letter-spacing:normal !important;
  color:var(--tx-1) !important; text-shadow:none !important;
  animation:none !important;
}
html[data-page="spanek"] .sleep-sub{
  font-family:var(--fnt-ui) !important; font-size:13px !important;
  letter-spacing:normal !important; color:var(--tx-3) !important;
  text-shadow:none !important; margin-top:14px !important;
}
html[data-page="spanek"] .sleep-clock{
  font-family:var(--fnt-display) !important; font-size:clamp(1rem,2.4vw,1.5rem) !important;
  letter-spacing:normal !important; color:var(--tx-3) !important;
  font-variant-numeric:tabular-nums;
}
html[data-page="spanek"] .sleep-overlay{ background:var(--sol-base) !important; }
html[data-page="spanek"] .corner-tag{
  font-family:var(--fnt-ui) !important; font-size:11px !important;
  letter-spacing:normal !important; color:var(--tx-off) !important;
}

/* ══════════════════════════════════════════════════════════════════
   33 · HRY (/snake, /tycoon, /horror)
        Herní plátno a jeho barvy jsou umělecký záměr — nechávají se.
        Sjednocuje se jen okolní UI: panely, tlačítka, číselné údaje.
   ══════════════════════════════════════════════════════════════════ */
html[data-page="snake"] .stat-val{ color:var(--acc) !important; }
html[data-page="snake"] .canvas-wrap{
  box-shadow:var(--el-2) !important;
  border:1px solid var(--stroke) !important;
  border-radius:var(--r-card) !important;
}
html[data-page="horror"] .logo,
html[data-page="horror"] .sub{ overflow:visible; max-width:100%; }
html[data-page="horror"] .diff-btn{
  border-radius:var(--r-ctrl) !important;
  border-width:1px !important;
  box-shadow:none !important;
  transition:background var(--d-micro) var(--e-out), transform var(--d-fast) var(--e-apple);
}
html[data-page="horror"] .diff-btn:active{ transform:scale(.97); }

/* ══════════════════════════════════════════════════════════════════
   34 · NÁVOD MAX G3 (/maxg3)
        Vlastní paleta (tyrkysová, jantarová, žlutá, červená) přemapovaná
        na sémantické tokeny systému.
   ══════════════════════════════════════════════════════════════════ */
html[data-page="maxg3"]{
  --g3-acc:var(--acc); --g3-warn:var(--warn); --g3-err:var(--err);
}
html[data-page="maxg3"] .eyebrow,
html[data-page="maxg3"] b,
html[data-page="maxg3"] a{ color:var(--acc) !important; }
html[data-page="maxg3"] .accent{ color:var(--acc-hi) !important; }
html[data-page="maxg3"] h1, html[data-page="maxg3"] h2{
  color:var(--tx-1) !important; text-shadow:none !important;
}
html[data-page="maxg3"] h1{ overflow-wrap:anywhere; }
html[data-page="maxg3"] h3{ color:var(--tx-1) !important; }
html[data-page="maxg3"] .hazard{
  border-color:rgba(252,225,0,.35) !important;
  background:rgba(252,225,0,.07) !important;
}
html[data-page="maxg3"] .note{
  border-color:var(--stroke) !important;
  background:var(--layer) !important;
}
html[data-page="maxg3"] .sig, html[data-page="maxg3"] .dot{
  color:var(--err) !important;
}
html[data-page="maxg3"] span.dot{ background:var(--err) !important; }
html[data-page="maxg3"] .k{
  background:var(--ctrl) !important; border:1px solid var(--stroke) !important;
  border-bottom-width:2px !important; border-radius:var(--r-ctrl) !important;
  color:var(--tx-1) !important; font-family:var(--fnt-mono) !important;
}
html[data-page="maxg3"] header.hero,
html[data-page="maxg3"] section.blk{
  box-shadow:none !important;
  background:var(--layer) !important;
  border:1px solid var(--stroke) !important;
  border-radius:var(--r-overlay) !important;
}

/* ══════════════════════════════════════════════════════════════════
   35 · OPERA GX MODY (/opera)
        Natvrdo zapsaná cyberpunk žlutá #ffe000 a magenta #ff1a6e
        přemapované na tokeny systému.
   ══════════════════════════════════════════════════════════════════ */
html[data-page="opera"] .kicker{
  color:var(--tx-3) !important; text-shadow:none !important;
  letter-spacing:normal !important;
}
html[data-page="opera"] a{ color:var(--acc) !important; }
html[data-page="opera"] b{ color:var(--tx-1) !important; }
html[data-page="opera"] .card{
  background:var(--layer) !important;
  border:1px solid var(--stroke) !important;
  border-radius:var(--r-overlay) !important;
  box-shadow:none !important;
  transition:background var(--d-fast) var(--e-out), border-color var(--d-fast) var(--e-out);
}
html[data-page="opera"] .card:hover{
  background:var(--ctrl) !important; border-color:var(--stroke-2) !important;
  transform:none !important;
}
html[data-page="opera"] .tag{
  color:var(--tx-2) !important;
  background:var(--ctrl) !important;
  border:1px solid var(--stroke) !important;
  border-radius:12px !important;
}
html[data-page="opera"] .dl{
  height:32px; display:inline-flex; align-items:center; gap:8px;
  padding:0 14px !important;
  color:#04121a !important;
  background:var(--acc) !important;
  border:1px solid transparent !important;
  border-bottom-color:rgba(0,0,0,.28) !important;
  border-radius:var(--r-ctrl) !important;
  box-shadow:none !important; font-weight:600 !important;
}
html[data-page="opera"] .dl:hover{ background:var(--acc-hi) !important; }
html[data-page="opera"] .ti-code{
  background:var(--ctrl) !important; color:var(--tx-1) !important;
  border:1px solid var(--stroke) !important; border-radius:var(--r-ctrl) !important;
  font-family:var(--fnt-mono) !important;
}
html[data-page="opera"] .ticket{
  box-shadow:none !important;
  background:var(--layer) !important;
  border:1px solid var(--stroke) !important;
  border-radius:var(--r-overlay) !important;
}

/* ── 404/403/5xx: bohatší obsah (nová struktura v error.php) ────── */
html[data-page="error"] .wrap{
  max-width:560px; text-align:left;
  padding:0 !important; overflow:hidden;
}
/* horní stavový proužek */
html[data-page="error"] .err-top{
  display:flex; align-items:center; gap:9px;
  padding:0 18px; height:38px;
  background:var(--sol-quart);
  border-bottom:1px solid var(--divider);
  font-size:12px; color:var(--tx-2);
}
html[data-page="error"] .err-dot{
  width:8px; height:8px; border-radius:50%; flex:0 0 auto;
  background:var(--acc); box-shadow:0 0 0 3px rgba(var(--acc-rgb),.18);
}
html[data-page="error"] .wrap[data-tone="warn"] .err-dot{ background:var(--warn); box-shadow:0 0 0 3px rgba(252,225,0,.16); }
html[data-page="error"] .wrap[data-tone="err"]  .err-dot{ background:var(--err);  box-shadow:0 0 0 3px rgba(255,153,164,.16); }
html[data-page="error"] .err-http{ font-weight:600; color:var(--tx-1); font-variant-numeric:tabular-nums; }
html[data-page="error"] .err-host{ margin-left:auto; color:var(--tx-3); }

/* ikona + kód vedle sebe */
html[data-page="error"] .err-head{
  display:flex; align-items:center; gap:18px;
  padding:26px 24px 0;
}
html[data-page="error"] .err-ico{
  width:56px; height:56px; flex:0 0 auto;
  display:flex; align-items:center; justify-content:center;
  border-radius:14px;
  background:var(--ctrl); border:1px solid var(--stroke);
  color:var(--acc);
}
html[data-page="error"] .wrap[data-tone="warn"] .err-ico{ color:var(--warn); }
html[data-page="error"] .wrap[data-tone="err"]  .err-ico{ color:var(--err); }
html[data-page="error"] .err-ico svg{ width:28px; height:28px; }
html[data-page="error"] .code{
  font-size:clamp(48px,10vw,72px) !important; line-height:1 !important;
}
html[data-page="error"] .title{
  padding:0 24px; margin:14px 0 6px !important; text-align:left;
  font-size:19px !important;
}
html[data-page="error"] .term{
  padding:0 24px; text-align:left; margin-bottom:18px !important;
}

/* tabulka faktů — jako podokno podrobností v Průzkumníku */
html[data-page="error"] .err-facts{
  margin:0 24px 20px; padding:0;
  border:1px solid var(--stroke); border-radius:var(--r-card);
  background:var(--sol-alt); overflow:hidden;
}
html[data-page="error"] .err-fact{
  display:grid; grid-template-columns:88px minmax(0,1fr);
  gap:12px; align-items:baseline;
  padding:9px 13px; font-size:12.5px;
}
html[data-page="error"] .err-fact + .err-fact{ border-top:1px solid var(--divider); }
html[data-page="error"] .err-fact dt{ color:var(--tx-3); margin:0; }
html[data-page="error"] .err-fact dd{ color:var(--tx-1); margin:0; overflow-wrap:anywhere; }
html[data-page="error"] .err-fact .path{
  display:inline; margin:0 !important; padding:0 !important;
  background:none !important; border:0 !important;
  font-family:var(--fnt-mono) !important; font-size:12px !important;
  color:var(--tx-1) !important;
}

/* rady */
html[data-page="error"] .err-help{ padding:0 24px; margin-bottom:20px; }
html[data-page="error"] .err-help-h{
  font-size:12px; font-weight:600; color:var(--tx-2); margin-bottom:8px;
}
html[data-page="error"] .err-help ul{ margin:0; padding:0; list-style:none; }
html[data-page="error"] .err-help li{
  position:relative; padding-left:18px; margin-bottom:6px;
  font-size:12.5px; color:var(--tx-2); line-height:1.5;
}
html[data-page="error"] .err-help li::before{
  content:''; position:absolute; left:4px; top:8px;
  width:4px; height:4px; border-radius:50%; background:var(--tx-off);
}

html[data-page="error"] .btns{ padding:0 24px 20px; justify-content:flex-start !important; }
html[data-page="error"] .cloud-btn .ba{ stroke:#04121a !important; }

/* patička s odkazy na nástroje */
html[data-page="error"] .err-apps{
  padding:14px 24px 18px;
  border-top:1px solid var(--divider);
  background:var(--sol-alt);
}
html[data-page="error"] .err-apps-h{
  display:block; font-size:11.5px; color:var(--tx-3); margin-bottom:9px;
}
html[data-page="error"] .err-apps-row{ display:flex; flex-wrap:wrap; gap:6px; }
html[data-page="error"] .err-apps-row a{
  height:28px; display:inline-flex; align-items:center; padding:0 11px;
  font-size:12px; color:var(--tx-2) !important; text-decoration:none;
  background:var(--ctrl); border:1px solid var(--stroke);
  border-radius:14px;
  transition:background var(--d-micro) var(--e-out), color var(--d-micro) var(--e-out);
}
html[data-page="error"] .err-apps-row a:hover{
  background:var(--ctrl-hover); color:var(--tx-1) !important;
}
@media (max-width:520px){
  html[data-page="error"] .err-fact{ grid-template-columns:1fr; gap:2px; }
}