:root{
  --brand:#D85A30; --brand-hover:#B8481E; --brand-soft:#FAECE7; --brand-soft-border:#F5C4B3;
  --brand-text:#993C1D;
  --surface:#FFFFFF; --surface-2:#F7F5F0; --surface-3:#F1EFE8;
  --text:#1A1A1A; --text-2:#5F5E5A; --text-3:#888780;
  --border:rgba(0,0,0,.10); --border-hover:rgba(0,0,0,.20);
  --font:"Wix Madefor Display",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-accent:"Caveat",var(--font);
  --r-sm:6px; --r-md:8px; --r-lg:12px; --r-pill:999px;
  --s2:8px; --s3:12px; --s4:16px; --s5:24px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{margin:0;font:400 16px/1.45 var(--font);color:var(--text);background:var(--surface-2)}
:focus-visible{outline:2px solid #378ADD;outline-offset:2px}
a{color:inherit}

.obrazovka{max-width:680px;margin:0 auto;
  padding:var(--s5) var(--s4) calc(var(--s5) + env(safe-area-inset-bottom));
  display:flex;flex-direction:column;gap:var(--s3)}
.obrazovka.stred{min-height:100dvh;justify-content:center;text-align:center}

/* ------------------------------------------------------------------ hlavička */
.hlava{text-align:center;margin-bottom:var(--s2)}
.logo{margin:0;line-height:1}
.logo-znacka{display:block;font-size:1.9rem;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:#0B0B0B}
.logo-pero{display:inline-block;font-family:var(--font-accent);font-weight:700;font-size:3.6rem;
  color:#0B0B0B;margin-top:-.08em;padding:0 .1em .16em;
  background-image:url("data:image/svg+xml,%3Csvg width='262' height='17' viewBox='0 0 262 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.99931 12.9463C70.3926 7.14883 214.09 -1.29457 257.733 11.3115' stroke='%23FFB400' stroke-width='8' stroke-linecap='round'/%3E%3C/svg%3E%0A");
  background-position:50% 100%;background-repeat:no-repeat;background-size:100%}
.lead{color:var(--text-2);margin:var(--s3) 0 0}
.lead-maly{color:var(--text-2);font-size:.95rem;margin:0 0 var(--s2)}

/* --------------------------------------------------------------- přihlášení */
.vstup{display:flex;flex-direction:column;gap:var(--s3);margin-top:var(--s5);
  max-width:360px;width:100%;align-self:center;text-align:left}
label{font-weight:600;font-size:.9rem;color:var(--text-2)}
input{font:400 1.15rem var(--font);width:100%;padding:var(--s3) var(--s4);
  border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface);color:var(--text)}
.chyba{margin:0;color:var(--brand-text);font-size:.9rem}
button,.tl{font:500 1rem/1.2 var(--font);border:1px solid var(--border);background:var(--surface);
  color:var(--text);border-radius:var(--r-pill);padding:var(--s3) var(--s4);cursor:pointer;
  text-decoration:none;display:inline-block;text-align:center;
  transition:background-color .15s,border-color .15s}
button:hover,.tl:hover{border-color:var(--border-hover)}
button:active,.tl:active{transform:scale(.985)}
.hlavni{background:var(--brand);color:#fff;border-color:var(--brand)}
.hlavni:hover{background:var(--brand-hover);border-color:var(--brand-hover)}
.velke{font-size:1.2rem;font-weight:700;padding:var(--s4) var(--s5)}

/* -------------------------------------------------------------------- knihy */
.knihy{display:flex;flex-direction:column;gap:var(--s3)}
.kniha{display:flex;gap:var(--s4);background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-lg);padding:var(--s3)}
.prebal{flex:none;width:150px;display:block}
.prebal img{width:100%;height:auto;display:block;border:1px solid var(--border);
  border-radius:var(--r-sm)}
.popis{min-width:0;display:flex;flex-direction:column;gap:2px}
.poradi{margin:0;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--brand-text)}
.kniha h2{margin:2px 0 0;font-size:1.15rem;font-weight:700;line-height:1.2}
.podnazev{margin:2px 0 0;font-size:.9rem;color:var(--text-2)}
.data{margin:6px 0 0;font-size:.78rem;color:var(--text-3)}
.tlacitka{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s3)}
.tl{font-size:.85rem;padding:9px var(--s3);min-height:40px;display:inline-flex;
  align-items:center;gap:6px}
.tl small{color:var(--text-3);font-size:.78em}
.tl.hlavni small{color:rgba(255,255,255,.75)}

.prazdno{color:var(--text-2);text-align:center;margin:var(--s5) 0}
.patka{margin:var(--s4) 0 0;font-size:.82rem;color:var(--text-3);text-align:center}
.autor{margin:var(--s5) 0 0;font-size:.82rem;color:var(--text-3);text-align:center}

/* ------------------------------------------------------------------- telefon */
@media (max-width:560px){
  .kniha{flex-direction:column;gap:var(--s3)}
  .prebal{width:100%}
  .prebal img{border-radius:var(--r-md)}
  .tl{flex:1 1 calc(50% - var(--s2));justify-content:center}
  .tl.hlavni{flex-basis:100%}
  .logo-znacka{font-size:1.6rem}
  .logo-pero{font-size:3rem}
}