/* Přihlášení 6IT: brand „galaxie a prach“ (CML projects/six-impossible-things.md § Brand). Červená jen akce,
   ledová hodnota a focus. Bez zaoblení a stínů. Písma v repu (OFL), nic z Googlu. */
@font-face { font-family: 'Plex'; src: url('/fonty/plexsans-400.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Plex'; src: url('/fonty/plexsans-600.woff2') format('woff2'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Anton'; src: url('/fonty/anton-400.woff2') format('woff2'); font-weight: 400; font-display: swap; }
:root { --pozadi: #020308; --ink: #070A14; --linka: #1A2234; --akce: #FF3B2F; --hodnota: #8FD3FF; --text: #C9D6E3; --tlumeny: #7C8A9C; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  min-height: 100vh; display: grid; place-items: center; padding: 16px; color: var(--text);
  font: 16px/1.5 'Plex', system-ui, -apple-system, sans-serif;
  background-color: var(--pozadi);
  background-image:
    radial-gradient(1px 1px at 12% 18%, #ffffff55 50%, transparent 51%), radial-gradient(1px 1px at 78% 32%, #ffffff44 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 44% 72%, #8FD3FF55 50%, transparent 51%), radial-gradient(1px 1px at 88% 84%, #ffffff33 50%, transparent 51%),
    radial-gradient(1px 1px at 24% 90%, #ffffff33 50%, transparent 51%), radial-gradient(1.5px 1.5px at 62% 10%, #ffffff44 50%, transparent 51%),
    radial-gradient(60% 50% at 50% 0%, #0D1430 0%, transparent 70%);
}
.karta { width: 100%; max-width: 420px; background: var(--ink); border: 1px solid var(--linka); padding: 32px 28px; }
.znacka { font-family: 'Anton', sans-serif; letter-spacing: .08em; color: var(--akce); margin: 0 0 8px; font-size: 14px; }
h1 { font-family: 'Anton', sans-serif; font-weight: 400; text-transform: lowercase; font-size: 32px; line-height: 1.1; color: #fff; margin: 0 0 16px; }
p { margin: 0 0 16px; }
.tlumeny { color: var(--tlumeny); font-size: 14px; }
.tlacitko {
  display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 48px; padding: 0 18px;
  border: 1px solid var(--akce); background: var(--akce); color: #fff; font: 600 16px 'Plex', sans-serif; cursor: pointer; text-decoration: none;
}
.tlacitko.druhe { background: transparent; color: var(--text); border-color: var(--linka); }
.tlacitko:disabled { opacity: .5; cursor: default; }
.tlacitko:focus-visible, input:focus-visible, a:focus-visible { outline: 2px solid var(--hodnota); outline-offset: 2px; }
.google { background: #fff; color: #1f1f1f; border-color: #fff; }
.nebo { display: flex; align-items: center; gap: 12px; color: var(--tlumeny); font-size: 14px; margin: 20px 0; }
.nebo::before, .nebo::after { content: ''; flex: 1; border-top: 1px solid var(--linka); }
label { display: block; font-size: 14px; color: var(--tlumeny); margin-bottom: 6px; }
input {
  width: 100%; min-height: 48px; padding: 0 14px; margin-bottom: 12px; background: var(--pozadi); color: #fff;
  border: 1px solid var(--linka); font: 16px 'Plex', sans-serif;
}
input.kod { font-size: 24px; letter-spacing: .3em; text-align: center; }
.chyba { color: var(--akce); font-size: 14px; }
a { color: var(--hodnota); }
ul.appky { list-style: none; padding: 0; margin: 0 0 20px; }
ul.appky li { border-top: 1px solid var(--linka); }
ul.appky a { display: flex; justify-content: space-between; padding: 14px 0; text-decoration: none; color: #fff; }
ul.appky span { color: var(--tlumeny); font-size: 14px; }
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th, td { text-align: left; padding: 8px 6px; border-top: 1px solid var(--linka); vertical-align: top; }
.siroka { max-width: 1000px; }