/* latin-ext: ceska diakritika (e, s, c, r, z, u s hackem a krouzkem) */

@font-face {
  font-family: 'General Sans';
  src: url('/fonts/general-sans-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'General Sans';
  src: url('/fonts/general-sans-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'General Sans';
  src: url('/fonts/general-sans-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'General Sans';
  src: url('/fonts/general-sans-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter Tight';
  src: url('/fonts/inter-tight-400-latin-ext.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter Tight';
  src: url('/fonts/inter-tight-500-latin-ext.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter Tight';
  src: url('/fonts/inter-tight-600-latin-ext.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter Tight';
  src: url('/fonts/inter-tight-700-latin-ext.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter Tight';
  src: url('/fonts/inter-tight-800-latin-ext.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Instrument Serif';
  src: url('/fonts/instrument-serif-regular-latin-ext.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Instrument Serif';
  src: url('/fonts/instrument-serif-italic-latin-ext.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'JetBrains Mono';
  src: url('/fonts/jetbrains-mono-400-latin-ext.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'JetBrains Mono';
  src: url('/fonts/jetbrains-mono-500-latin-ext.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* unicode-range zde nepouzivame — soubory uz jsou subsetovane na latin-ext */
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-border-style: solid;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-outline-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
      "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
      "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: "JetBrains Mono", ui-monospace, monospace;
    --radius-xs: 6px;
    --radius-sm: 10px;
    --radius-md: 14px;
    --radius-lg: 20px;
    --radius-xl: 28px;
    --radius-2xl: 36px;
    --shadow-xs: 0 1px 2px oklch(18% .015 60 / .05);
    --shadow-sm: 0 2px 6px oklch(18% .015 60 / .06), 0 1px 2px oklch(18% .015 60 / .04);
    --shadow-md: 0 8px 24px oklch(18% .015 60 / .08), 0 2px 6px oklch(18% .015 60 / .05);
    --shadow-lg: 0 24px 48px oklch(18% .015 60 / .1), 0 4px 12px oklch(18% .015 60 / .06);
    --shadow-xl: 0 40px 80px oklch(18% .015 60 / .14), 0 8px 24px oklch(18% .015 60 / .08);
    --ease-out: cubic-bezier(.22, 1, .36, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --color-brand-orange: oklch(72% .16 55);
    --color-brand-orange-soft: oklch(82% .12 55);
    --color-brand-orange-deep: oklch(58% .18 45);
    --color-brand-yellow: oklch(86% .14 95);
    --color-brand-green: oklch(78% .16 145);
    --color-brand-teal: oklch(65% .08 200);
    --color-brand-teal-soft: oklch(78% .06 200);
    --color-bg-canvas: oklch(98.5% .006 75);
    --color-bg-elevated: oklch(99% .004 75);
    --color-bg-tinted: oklch(96% .012 75);
    --color-bg-tinted-2: oklch(93% .018 75);
    --color-ink-100: oklch(18% .015 60);
    --color-ink-80: oklch(32% .012 60);
    --color-ink-70: oklch(40% .011 60);
    --color-ink-60: oklch(48% .01 60);
    --color-ink-50: oklch(56.5% .009 60);
    --color-ink-40: oklch(65% .008 60);
    --color-ink-30: oklch(72.5% .007 60);
    --color-ink-20: oklch(80% .006 60);
    --color-ink-10: oklch(90% .005 60);
    --color-ink-05: oklch(95% .004 60);
    --color-success: oklch(72% .14 150);
    --color-warning: oklch(78% .15 75);
    --color-danger: oklch(58% .2 25);
    --color-info: oklch(65% .1 220);
    --radius-pill: 999px;
    --font-display: "General Sans", "Inter Tight", -apple-system, sans-serif;
    --font-ui: "Inter Tight", -apple-system, system-ui, sans-serif;
    --spacing-1: 4px;
    --spacing-2: 8px;
    --spacing-3: 12px;
    --spacing-4: 16px;
    --spacing-5: 20px;
    --spacing-6: 24px;
    --spacing-8: 32px;
    --spacing-10: 40px;
    --spacing-12: 48px;
    --spacing-16: 64px;
    --spacing-20: 80px;
    --spacing-24: 96px;
    --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  }
}

@layer base {
  *, :after, :before, ::backdrop {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  ::file-selector-button {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  html, :host {
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    line-height: 1.5;
    font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }

  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }

  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }

  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }

  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    -webkit-text-decoration: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }

  b, strong {
    font-weight: bolder;
  }

  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }

  small {
    font-size: 80%;
  }

  sub, sup {
    vertical-align: baseline;
    font-size: 75%;
    line-height: 0;
    position: relative;
  }

  sub {
    bottom: -.25em;
  }

  sup {
    top: -.5em;
  }

  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }

  :-moz-focusring:where(:not(iframe)) {
    outline: auto;
  }

  progress {
    vertical-align: baseline;
  }

  summary {
    display: list-item;
  }

  ol, ul, menu {
    list-style: none;
  }

  img, svg, video, canvas, audio, iframe, embed, object {
    vertical-align: middle;
    display: block;
  }

  img, video {
    max-width: 100%;
    height: auto;
  }

  button, input, select, optgroup, textarea {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

  ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }

  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }

  ::file-selector-button {
    margin-inline-end: 4px;
  }

  ::placeholder {
    opacity: 1;
  }

  @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentColor;
    }

    @supports (color: color-mix(in lab, red, red)) {
      ::placeholder {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }

  textarea {
    resize: vertical;
  }

  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }

  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }

  ::-webkit-datetime-edit {
    display: inline-flex;
  }

  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }

  ::-webkit-datetime-edit {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-year-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-month-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-day-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-hour-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-minute-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-second-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-millisecond-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }

  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }

  :-moz-ui-invalid {
    box-shadow: none;
  }

  button, input:where([type="button"], [type="reset"], [type="submit"]) {
    appearance: button;
  }

  ::file-selector-button {
    appearance: button;
  }

  ::-webkit-inner-spin-button {
    height: auto;
  }

  ::-webkit-outer-spin-button {
    height: auto;
  }

  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}

@layer components;

@layer utilities {
  .visible {
    visibility: visible;
  }

  .fixed {
    position: fixed;
  }

  .relative {
    position: relative;
  }

  .static {
    position: static;
  }

  .sticky {
    position: sticky;
  }

  .container {
    width: 100%;
  }

  @media (min-width: 40rem) {
    .container {
      max-width: 40rem;
    }
  }

  @media (min-width: 48rem) {
    .container {
      max-width: 48rem;
    }
  }

  @media (min-width: 64rem) {
    .container {
      max-width: 64rem;
    }
  }

  @media (min-width: 80rem) {
    .container {
      max-width: 80rem;
    }
  }

  @media (min-width: 96rem) {
    .container {
      max-width: 96rem;
    }
  }

  .block {
    display: block;
  }

  .flex {
    display: flex;
  }

  .grid {
    display: grid;
  }

  .hidden {
    display: none;
  }

  .inline {
    display: inline;
  }

  .table {
    display: table;
  }

  .flex-shrink {
    flex-shrink: 1;
  }

  .flex-grow {
    flex-grow: 1;
  }

  .transform {
    transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
  }

  .resize {
    resize: both;
  }

  .flex-wrap {
    flex-wrap: wrap;
  }

  .rounded {
    border-radius: .25rem;
  }

  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }

  .uppercase {
    text-transform: uppercase;
  }

  .italic {
    font-style: italic;
  }

  .shadow {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }

  .blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
  }

  .filter {
    filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
  }

  .backdrop-filter {
    -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
    backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
  }
}

:root {
  --glass-soft-bg: oklab(100% 0 5.96046e-8 / .55);
  --glass-soft-blur: 10px;
  --glass-soft-stroke: oklab(100% 0 5.96046e-8 / .5);
  --glass-medium-bg: oklab(100% 0 5.96046e-8 / .7);
  --glass-medium-blur: 18px;
  --glass-medium-stroke: oklab(100% 0 5.96046e-8 / .65);
  --glass-bold-bg: oklab(100% 0 5.96046e-8 / .82);
  --glass-bold-blur: 28px;
  --glass-bold-stroke: oklab(100% 0 5.96046e-8 / .75);
  --glass-tinted-bg: oklab(96% .02 .034641 / .6);
  --shadow-glow-orange: 0 12px 32px oklch(72% .16 55 / .32), 0 2px 8px oklch(72% .16 55 / .2);
}

@property --tw-rotate-x {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-y {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-z {
  syntax: "*";
  inherits: false
}

@property --tw-skew-x {
  syntax: "*";
  inherits: false
}

@property --tw-skew-y {
  syntax: "*";
  inherits: false
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-ring-inset {
  syntax: "*";
  inherits: false
}

@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}

@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}

@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-blur {
  syntax: "*";
  inherits: false
}

@property --tw-brightness {
  syntax: "*";
  inherits: false
}

@property --tw-contrast {
  syntax: "*";
  inherits: false
}

@property --tw-grayscale {
  syntax: "*";
  inherits: false
}

@property --tw-hue-rotate {
  syntax: "*";
  inherits: false
}

@property --tw-invert {
  syntax: "*";
  inherits: false
}

@property --tw-opacity {
  syntax: "*";
  inherits: false
}

@property --tw-saturate {
  syntax: "*";
  inherits: false
}

@property --tw-sepia {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-blur {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-brightness {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-contrast {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-grayscale {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-hue-rotate {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-invert {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-opacity {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-saturate {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-sepia {
  syntax: "*";
  inherits: false
}
/* Zakladni vrstva. Prevzato 1:1 z design/styles.css, nazvy tokenu prepsany
   na Tailwind @theme jmena z src/styles/theme.css. */

/* Element reset patri do vrstvy `base`. Tailwind v4 vydava utility do
   @layer utilities; kdyby reset zustal mimo vrstvy, prebil by kazdou
   barvovou utilitu na <a> a <button> (P6, RC-6). Zbytek souboru vrstvu
   zamerne nema — komponentni tridy maji vyhravat nad utilitami. */
@layer base {
  *,
  *::before,
  *::after { box-sizing: border-box; }

  html,
  body { margin: 0; padding: 0; }

  body {
    font-family: var(--font-ui);
    color: var(--color-ink-100);
    background: var(--color-bg-canvas);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: -0.005em;
  }

  button { font-family: inherit; cursor: pointer; border: 0; background: none; color: inherit; }
  input, textarea, select { font-family: inherit; color: inherit; }
  a { color: inherit; text-decoration: none; }
  img { display: block; max-width: 100%; }
  ul, ol { padding: 0; margin: 0; list-style: none; }
  h1, h2, h3, h4, h5, h6, p { margin: 0; }

  /* Prototyp nechava tlacitkum UA `line-height: normal`; Tailwind preflight
     jim vnutí 1.5 z <body> a kazde tlacitko je o 4 px vyssi (P6, admin RC-6). */
  button, [type='button'], [type='submit'], [type='reset'] { line-height: normal; }

  /* Teply focus ring misto modreho UA prstence (P6, RC-11).
     POZOR: tohle je JEDINE pravidlo v P6, ktere v etalonu nema predlohu —
     `grep focus-visible design/styles.css design/admin.css` nenajde nic.
     Duvod je v audit radku RC-11 („Není definován focus ring") a v tom, ze
     bez nej by klavesnicova navigace zustala na modrem UA prstenci v teple
     palete. Barva neni vymyslena: prototyp presne tenhle prstenec kresli
     inline na sbalenem avataru sidebaru (`outline: '2px solid' +
     token --brand-orange-deep, outlineOffset: 2` — admin-shell.jsx:294-295).
     (Token se tu pise bez `var(...)` schvalne: tokens.test.ts hlida stara
     jmena z prototypu regexem nad celym souborem, vcetne komentaru.)
     Zapisuje se do Tasku 22 jako vedomy pridavek nad etalon. */
  :focus-visible {
    outline: 2px solid var(--color-brand-orange-deep);
    outline-offset: 2px;
    border-radius: 4px;
  }

  /* Dialog dostava fokus programove (Task 6, RC-11) — kdyby ho Chromium
     nekdy zaradil mezi `:focus-visible`, oranzovy prstenec by obtahl CELY
     modal. Vylouceni je levnejsi nez spolehat na heuristiku prohlizece. */
  dialog:focus,
  dialog:focus-visible { outline: none; }
}

/* ===================== Type scale ===================== */
.t-display-xl { font-family: var(--font-display); font-size: clamp(64px, 8vw, 128px); line-height: 0.95; letter-spacing: -0.035em; font-weight: 600; }
.t-display-lg { font-family: var(--font-display); font-size: clamp(48px, 6vw, 88px); line-height: 0.98; letter-spacing: -0.03em; font-weight: 600; }
.t-display-md { font-family: var(--font-display); font-size: clamp(36px, 4.4vw, 64px); line-height: 1.02; letter-spacing: -0.025em; font-weight: 600; }
.t-display-sm { font-family: var(--font-display); font-size: clamp(28px, 3.2vw, 44px); line-height: 1.06; letter-spacing: -0.02em; font-weight: 600; }

.t-h1 { font-size: 40px; line-height: 1.1; letter-spacing: -0.02em; font-weight: 600; }
.t-h2 { font-size: 32px; line-height: 1.15; letter-spacing: -0.018em; font-weight: 600; }
.t-h3 { font-size: 24px; line-height: 1.25; letter-spacing: -0.012em; font-weight: 600; }
.t-h4 { font-size: 20px; line-height: 1.3; letter-spacing: -0.008em; font-weight: 600; }
.t-h5 { font-size: 16px; line-height: 1.4; font-weight: 600; }
.t-body-lg { font-size: 18px; line-height: 1.55; }
.t-body { font-size: 16px; line-height: 1.55; }
.t-body-sm { font-size: 14px; line-height: 1.5; }
.t-caption { font-size: 12px; line-height: 1.4; letter-spacing: 0.02em; }
.t-eyebrow { font-size: 12px; line-height: 1.3; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 600; }
.t-mono { font-family: var(--font-mono); }

/* Prototyp sazi <em> v nadpisech kurzivou; majitel ji 2026-09-14 zrusil
   (D-20) — <em> v display nadpisech uz jen nese vyznam a barvu, ne sklon.
   Instrument Serif zustava jen pro designbook. */
.t-display-xl em,
.t-display-lg em,
.t-display-md em,
.t-display-sm em { font-family: inherit; font-style: normal; }

/* ===================== Glass primitives ===================== */
.glass-soft,
.glass-medium,
.glass-bold {
  border-radius: var(--radius-lg);
  position: relative;
  isolation: isolate;
}
.glass-soft {
  background: var(--glass-soft-bg);
  backdrop-filter: blur(var(--glass-soft-blur)) saturate(160%);
  -webkit-backdrop-filter: blur(var(--glass-soft-blur)) saturate(160%);
  border: 1px solid var(--glass-soft-stroke);
  box-shadow: var(--shadow-sm), inset 0 1px 0 color-mix(in oklab, white 60%, transparent);
}
.glass-medium {
  background: var(--glass-medium-bg);
  backdrop-filter: blur(var(--glass-medium-blur)) saturate(180%);
  -webkit-backdrop-filter: blur(var(--glass-medium-blur)) saturate(180%);
  border: 1px solid var(--glass-medium-stroke);
  box-shadow: var(--shadow-md), inset 0 1px 0 color-mix(in oklab, white 70%, transparent);
}
.glass-bold {
  background: var(--glass-bold-bg);
  backdrop-filter: blur(var(--glass-bold-blur)) saturate(200%);
  -webkit-backdrop-filter: blur(var(--glass-bold-blur)) saturate(200%);
  border: 1px solid var(--glass-bold-stroke);
  box-shadow: var(--shadow-lg), inset 0 1px 0 color-mix(in oklab, white 75%, transparent);
}

/* refrakcni linka — "mokry" okraj skla */
.glass-medium::after,
.glass-bold::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(180deg, color-mix(in oklab, white 25%, transparent) 0%, transparent 30%, transparent 70%, color-mix(in oklab, white 8%, transparent) 100%);
  mix-blend-mode: overlay;
  opacity: 0.6;
}

/* ===================== Utility ===================== */
.muted { color: var(--color-ink-60); }
.subtle { color: var(--color-ink-40); }

/* ===================== Scrollbar ===================== */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--color-ink-20); border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: var(--color-ink-40); }

/* ===================== Animace ===================== */
@keyframes float-up {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-in { animation: float-up 0.6s var(--ease-out) backwards; }

@media (prefers-reduced-motion: reduce) {
  .animate-in { animation: none; }
}
/* Obal auth stránek bez web shellu: karta svisle i vodorovně uprostřed okna,
   „Zpět“ v levém horním rohu nad atmosférou. */
.auth-shell { position: relative; min-height: 100vh; display: flex; flex-direction: column; }
.auth-shell__main { position: relative; z-index: 5; flex: 1; display: flex; align-items: center; }
.auth-shell__back { position: fixed; top: 20px; left: 20px; z-index: 10; gap: 6px; }
/* Stranka z e-mailoveho odkazu (zruseni rezervace) sdili shell s auth strankami:
   uvnitr flex radku by se jinak smrskla na obsah a lepila doleva. */
.auth-shell__main > .web-wizard { width: 100%; }

.auth {
  position: relative;
  z-index: 5;
  width: 100%;
  padding: 80px 24px;
  display: flex;
  justify-content: center;
}

.auth__card {
  padding: 40px;
  border-radius: 28px;
  max-width: 420px;
  width: 100%;
}
.auth__card--wide { max-width: 480px; }

.auth__head { text-align: center; margin-bottom: 28px; }
.auth__head h2 { margin: 20px 0 6px; }
.auth__head p { font-size: 14px; color: var(--color-ink-60); }

.auth__form { display: flex; flex-direction: column; gap: 14px; }
.auth__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.auth__grid--full { grid-column: 1 / -1; }

.auth__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 4px;
}
.auth__link { font-size: 13px; font-weight: 600; color: var(--color-brand-orange-deep); }
.auth__link--underline { text-decoration: underline; }

.auth__submit { margin-top: 8px; }
.auth__submit--full { width: 100%; margin-top: 18px; }
.auth__secondary { display: flex; width: 100%; }
.auth__note + .auth__secondary { margin-top: 18px; }

.auth__divider { display: flex; align-items: center; gap: 12px; margin: 8px 0; }
.auth__divider::before,
.auth__divider::after { content: ''; flex: 1; height: 1px; background: var(--color-ink-20); }
.auth__divider span { font-size: 12px; color: var(--color-ink-40); }

.auth__note { text-align: center; margin-top: 16px; font-size: 13px; color: var(--color-ink-60); }
.auth__consent { margin-top: 18px; align-items: flex-start; }
.auth__consent .box { margin-top: 2px; }
.auth__consent-text { font-size: 13px; color: var(--color-ink-60); line-height: 1.5; }
.auth__error { font-size: 13px; color: var(--color-danger); }

/* Prepinac viditelnosti hesla — 32×32 vpravo v poli (prototyp). */
.auth__password { position: relative; }
.auth__password .input { padding-right: 44px; }
.auth__password-toggle {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  border-radius: 8px;
  color: var(--color-ink-60);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: normal;
}

@media (max-width: 900px) {
  /* „Zpět“ odjede se stránkou a karta začne pod ním — pevný odkaz zasahoval
     do karty a při posunu registrace ležel přes formulář (revize mobilu
     2026-10-04). */
  .auth-shell__back { position: absolute; top: 16px; left: 16px; }
  .auth { padding: 64px 16px 40px; }
  .auth__card { padding: 28px; }
  .auth__grid { grid-template-columns: 1fr; }
}
/* Log čtečky a modal přiřazení karty; vychází z `.reader-row`
   v design/admin.css a z DashboardPage v design/app/admin-dashboard.jsx. */

.scans__card {
  margin-bottom: 20px;
}

.scans__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

/* Tecka stavu uvnitr eyebrow dedi jeho sazbu (verzalky, prostrkani), barvu ma podle stavu. */
.scans__eyebrow .live-dot { font: inherit; letter-spacing: inherit; text-transform: inherit; }
.scans__eyebrow {
  color: var(--color-brand-orange-deep);
  margin: 0 0 4px;
}

.scans__head-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}

.scans__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.scans__row {
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 14px 4px;
  border-top: 1px solid color-mix(in oklab, var(--color-ink-100) 8%, transparent);
}

.scans__row:first-child {
  border-top: none;
}

.scans__time {
  font-size: 12px;
  color: color-mix(in oklab, var(--color-ink-100) 60%, transparent);
  white-space: nowrap;
}

.scans__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--glass-soft-bg);
  border: 1px solid color-mix(in oklab, var(--color-ink-20) 60%, transparent);
}

.scans__row[data-status='UNKNOWN'] .scans__icon {
  color: var(--color-brand-orange-deep);
  border-color: transparent;
  background: color-mix(in oklab, var(--color-brand-orange) 16%, transparent);
}

.scans__who {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  min-width: 0;
}

.scans__name {
  font-size: 14px;
  font-weight: 600;
  color: inherit;
}

.scans__uid {
  font-size: 11px;
  color: color-mix(in oklab, var(--color-ink-100) 45%, transparent);
  overflow-wrap: anywhere;
}

.scans__meta {
  flex-basis: 100%;
  font-size: 12px;
  color: color-mix(in oklab, var(--color-ink-100) 60%, transparent);
}

.scans__row[data-status='UNKNOWN'] .scans__meta {
  color: var(--color-brand-orange-deep);
}

/* Hlavní akce řádku + „Smazat“ (majitel 2026-09-16) drží v posledním
   sloupci mřížky pohromadě, aby mazání leželo na stejné svislici jako
   akce v ostatních tabulkách administrace. */
.scans__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.scans__empty {
  padding: 28px 4px;
  text-align: center;
  font-size: 13px;
  color: color-mix(in oklab, var(--color-ink-100) 60%, transparent);
}

.scans__pagination {
  display: flex;
  justify-content: flex-end;
  padding-top: 14px;
  border-top: 1px solid var(--glass-soft-stroke);
}

.scans__hint {
  margin: 0 0 14px;
  font-size: 13px;
  line-height: 1.55;
}

.scans__options {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 14px 0;
}

.scans__option {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid color-mix(in oklab, var(--color-ink-100) 10%, transparent);
  cursor: pointer;
}

.scans__option span {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.scans__option em {
  font-style: normal;
  font-size: 12px;
  color: color-mix(in oklab, var(--color-ink-100) 60%, transparent);
}

.scans__divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 18px 0 12px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: color-mix(in oklab, var(--color-ink-100) 45%, transparent);
}

.scans__divider::before,
.scans__divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: color-mix(in oklab, var(--color-ink-100) 10%, transparent);
}

.scans__new-client {
  width: 100%;
  justify-content: center;
}

.scans__error {
  margin: 12px 0 0;
  font-size: 13px;
  color: var(--color-danger);
}

/* Telefon (majitel 2026-10-04): ikona stavu vlevo, vedle ní čas, jméno
   s UID a zůstatek, pod nimi akce v jedné řadě zarovnané s textem. Dřív
   ikona visela uprostřed pravého sloupce jako tlačítko a akce byly
   rozházené vedle textu. */
@media (max-width: 640px) {
  .scans__row {
    grid-template-columns: 32px 1fr;
    grid-template-areas:
      "icon time"
      "icon who"
      ".    actions";
    align-items: start;
    column-gap: 12px;
    row-gap: 4px;
  }
  .scans__icon { grid-area: icon; }
  .scans__time { grid-area: time; line-height: 1.4; }
  .scans__who { grid-area: who; }
  .scans__actions {
    grid-area: actions;
    justify-content: flex-start;
    flex-wrap: wrap;
    margin-top: 8px;
  }
}
.users__name-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

@media (max-width: 560px) {
  .users__name-grid { grid-template-columns: 1fr; }
}

.users__name {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
}

/* Jméno se nezalamuje (majitel 2026-10-05) — dva řádky rozhodily řádek tabulky. */
.users__name-text { white-space: nowrap; }

/* Avatar v buňce „Jméno“ — 32px kolečko s iniciálami, gradient podle role
   (etalon design/app/admin-other.jsx, UzivatelePage). */
.users__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, oklch(0.78 0.16 145), oklch(0.65 0.16 150));
}

.users__avatar[data-role='ADMIN'] {
  background: linear-gradient(135deg, oklch(0.72 0.16 55), oklch(0.58 0.18 45));
}

.users__error {
  font-size: 13px;
  color: var(--color-danger);
}
