/* Royal Services v0.4: the ledger that opens (plan_v0.4_kniha.md; the owner's details of 2026-10-08).
   The mark writes itself in brass in the middle of a dark navy desk, a closed ledger rises under it and the mark becomes
   its title; scrolling moves in, the cover opens toward the visitor, and its page, the site's own paper, fills the
   screen: the home page as it is. html.kniha-uvod is set by index.html's head script; kniha.js builds the scene. */

.kniha-uvod, .kniha-uvod body { background: #121D36; overflow: hidden; }
.kniha-zapnuta, .kniha-zapnuta body { overscroll-behavior-y: none; }   /* a pull down at the top goes back into the book */
.kniha-uvod body > :not(.kniha) { visibility: hidden; }

.kniha {
  --kh: min(58vh, 540px);
  --kw: calc(var(--kh) * .74);
  --ky: 49%;   /* the book's centre: higher than at first, the owner 2026-10-08 */
  --ly: 39%;   /* where the mark is written: on the cover's title, so it lands there with little travel */
  position: fixed; inset: 0; z-index: 1000; overflow: hidden; touch-action: none; user-select: none; cursor: default;
  background: radial-gradient(120% 90% at 50% 34%, #22376A 0%, #172650 42%, #0F1934 100%);
}
@media (max-width: 600px) { .kniha { --kw: min(70vw, 300px); --kh: calc(var(--kw) / .74); --ky: 43%; --ly: 34%; } }
/* a warm light from above and the desk's grain */
.kniha::before { content: ""; position: absolute; inset: -10% -10% auto; height: 70%; pointer-events: none;
  background: radial-gradient(50% 60% at 50% 0%, rgba(232, 205, 150, .10), transparent 70%); }
.kniha::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .55; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .07 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }

/* the mark, written in the middle; then it lands on the cover as the book's title */
.kniha-logo { position: absolute; left: 50%; top: var(--ly); width: min(72vw, 600px); z-index: 3; will-change: transform; }   /* centred by kniha.js */
.kniha-logo svg { display: block; width: 100%; height: auto; overflow: visible;
  filter: drop-shadow(0 1px 0 rgba(10, 16, 32, .55)) drop-shadow(0 0 18px rgba(232, 205, 150, .12)); }

/* the ledger */
.kniha-scena { position: absolute; inset: 0; perspective: 1500px; perspective-origin: 50% var(--ky); }
.kniha-telo { position: absolute; left: 50%; top: var(--ky); width: var(--kw); height: var(--kh);
  margin: calc(var(--kh) / -2) 0 0 calc(var(--kw) / -2); transform-style: preserve-3d; will-change: transform; }
.kniha-tien { position: absolute; left: -6%; right: -10%; bottom: -7%; height: 16%; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(4, 8, 20, .55), transparent); filter: blur(6px); transform: translateZ(-2px); }

/* the page under the cover: the site's paper, ruled, with the brass double margin */
.kniha-strana { position: absolute; inset: 0; border-radius: 2px 4px 4px 2px; overflow: hidden;
  background-color: #F6F2EA;
  background-image: repeating-linear-gradient(to bottom, transparent 0 calc(var(--kh) * .046 - 1px), #DDD5C6 calc(var(--kh) * .046 - 1px) calc(var(--kh) * .046));
  background-position: 0 calc(var(--kh) * .12);
  box-shadow: inset 6px 0 12px -8px rgba(27, 42, 74, .45); }
.kniha-strana::before { content: ""; position: absolute; top: 0; bottom: 0; left: 13%; width: 4px;
  border-left: 1px solid rgba(176, 141, 74, .6); border-right: 1px solid rgba(176, 141, 74, .6); }
.kniha-strana-hlava { position: absolute; left: 18%; right: 8%; top: 4.5%; display: flex; justify-content: space-between;
  color: #7E6229; font: 500 calc(var(--kh) * .026)/1 "Newsreader", Georgia, serif; letter-spacing: .02em; }
/* the block of pages, seen at the edge */
.kniha-okraj { position: absolute; top: 1.2%; bottom: 1.2%; right: -1.6%; width: 2.4%; border-radius: 0 3px 3px 0;
  background: repeating-linear-gradient(to right, #EFE8DA 0 1px, #D6CCB8 1px 2px); transform: translateZ(-1px); }
.kniha-okraj--spodok { top: auto; left: 1%; right: -1%; bottom: -1.4%; width: auto; height: 2%; border-radius: 0 0 3px 3px;
  background: repeating-linear-gradient(to bottom, #EFE8DA 0 1px, #D6CCB8 1px 2px); }

/* the cover: navy cloth, a brass frame and corners; it turns on its spine toward the visitor */
.kniha-obalka { position: absolute; inset: -1.6% -2.6% -1.8% -1%; transform-origin: 0% 50%; transform-style: preserve-3d;
  will-change: transform; }
.kniha-predok, .kniha-zadok { position: absolute; inset: 0; border-radius: 3px 7px 7px 3px; backface-visibility: hidden;
  -webkit-backface-visibility: hidden; }
.kniha-predok { overflow: hidden;
  background:
    radial-gradient(120% 80% at 30% 20%, rgba(255, 255, 255, .06), transparent 60%),
    linear-gradient(118deg, #26407A 0%, #1E3363 46%, #172A52 100%);
  box-shadow: 0 50px 90px -40px rgba(3, 7, 18, .85), inset 0 1px 0 rgba(255, 255, 255, .06), inset -2px 0 0 rgba(0, 0, 0, .25); }
.kniha-predok::before { content: ""; position: absolute; inset: 0; opacity: .5; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='c'><feTurbulence type='fractalNoise' baseFrequency='1.4 .35' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .16 0'/></filter><rect width='100%' height='100%' filter='url(%23c)'/></svg>"); }
.kniha-ram { position: absolute; inset: 6.5% 7% 6.5% 11%; border: 1px solid rgba(214, 182, 118, .9);
  box-shadow: 0 0 0 5px transparent, 0 0 0 6px rgba(201, 168, 103, .5); }
.kniha-zlab { position: absolute; top: 0; bottom: 0; left: 6.2%; width: 2px; background: rgba(5, 10, 24, .45);
  box-shadow: 1px 0 0 rgba(255, 255, 255, .06); }
.kniha-roh { position: absolute; width: 11%; aspect-ratio: 1; }
.kniha-roh::before { content: ""; position: absolute; inset: 0;
  background: linear-gradient(135deg, #E6CD95, #B08D4A 55%, #7E6229);
  clip-path: polygon(0 0, 100% 0, 0 100%); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .2); }
.kniha-roh--hl { top: 0; right: 0; transform: scaleX(-1); }
.kniha-roh--dl { bottom: 0; right: 0; transform: scale(-1, -1); }
.kniha-titul { position: absolute; left: 11%; right: 7%; top: 31%; display: grid; justify-items: center; gap: 0; }
.kniha-titul-miesto { width: 84%; aspect-ratio: 606.83 / 129.37; }
.kniha-titul-miesto svg { display: block; width: 100%; height: auto; overflow: visible;
  filter: drop-shadow(0 1px 0 rgba(10, 16, 32, .6)) drop-shadow(0 -1px 0 rgba(255, 236, 190, .12)); }   /* foil pressed into the cloth */
.kniha-cinnost { margin-top: calc(var(--kh) * .03); color: #C9A867; font: 600 calc(var(--kh) * .019)/1.2 "Inter", system-ui, sans-serif;
  letter-spacing: .3em; text-transform: uppercase; text-align: center; opacity: .92; }
.kniha-rok { position: absolute; left: 11%; right: 7%; bottom: 12%; text-align: center; color: #B08D4A;
  font: 500 calc(var(--kh) * .03)/1 "Newsreader", Georgia, serif; letter-spacing: .2em; }
/* the inside of the cover: a plain endpaper with a fine brass line, quiet as it passes close to the eye */
.kniha-zadok { transform: rotateY(180deg); background: #E9E1D0;
  box-shadow: inset -8px 0 14px -10px rgba(27, 42, 74, .5), inset 0 0 0 10px #E9E1D0, inset 0 0 0 11px rgba(176, 141, 74, .45); }
.kniha-telo { cursor: pointer; }   /* a click on the book opens it (the owner, 2026-10-08) */

/* the paper that fills the screen as the page comes close: the home page's own colour */
.kniha-papier { position: absolute; inset: 0; z-index: 5; background: #F6F2EA; pointer-events: none; }

/* the way on: a quiet line under the book, and a way past it */
.kniha-pokyn { position: absolute; left: 50%; top: calc(var(--ky) + var(--kh) / 2 + 28px); z-index: 4; transform: translateX(-50%);
  display: grid; justify-items: center; gap: 10px; color: #B9C0CF; font: 500 13px/1.3 "Inter", system-ui, sans-serif;
  letter-spacing: .06em; white-space: nowrap; }
.kniha-pokyn i { width: 1px; height: 34px; background: linear-gradient(to bottom, rgba(201, 168, 103, 0), rgba(201, 168, 103, .9));
  transform-origin: 50% 0; animation: kniha-pokyn 2.2s ease-in-out infinite; }
@keyframes kniha-pokyn { 0% { transform: scaleY(0); opacity: 0; } 40% { opacity: 1; } 100% { transform: scaleY(1); opacity: 0; } }
.kniha-preskocit { position: absolute; right: 22px; bottom: 20px; z-index: 4; padding: 8px 12px; border: 0; border-radius: 999px;
  background: transparent; color: #B9C0CF; font: 500 13px/1 "Inter", system-ui, sans-serif; cursor: pointer; opacity: .75; }
.kniha-preskocit:hover, .kniha-preskocit:focus-visible { opacity: 1; background: rgba(255, 255, 255, .06); outline: none; }
@media (max-width: 600px) { .kniha-preskocit { right: 12px; bottom: 12px; } .kniha-pokyn { top: calc(var(--ky) + var(--kh) / 2 + 22px); } }