/* Hledání — styly převzaté ze závazného mockupu hledani.html */
  /* Proměnné a reset dodává tokens.css + app.css */
  body{font-family:var(--body);color:var(--ink);background:var(--bg-soft);line-height:1.65;font-size:16px}
  .wrap{max-width:820px;margin:0 auto;padding:0 24px}

  /* podklad z tokenu → drží ve světlém, sepia i tmavém (motiv se sem dědí ze čtečky) */
  header.site{position:sticky;top:0;background:color-mix(in srgb, var(--bg) 92%, transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);z-index:50}
  .nav{max-width:var(--page-w);margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;height:var(--topbar-h)}
  .logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
  .logo b{font-family:var(--display);font-weight:600;font-size:19px}
  /* geometrie .nav-links je v app.css (sdílená lišta) */
  .nav-links a{text-decoration:none;color:var(--muted);font-size:15px;font-weight:500}
  .nav-links a:hover{color:var(--ink)}

  .head{padding:44px 0 6px}
  .head h1{font-family:var(--display);font-weight:700;font-size:30px;margin-bottom:18px}
  .search{display:flex;align-items:center;gap:10px;background:var(--bg);border:1.5px solid var(--primary-mid);border-radius:var(--radius);padding:13px 18px;box-shadow:0 4px 18px rgb(67 56 202/.08)}
  .search svg{color:var(--muted);flex:none}
  .search input{border:0;outline:0;flex:1;font-family:var(--body);font-size:16px;color:var(--ink);background:none}
  .search button{flex:none;border:0;cursor:pointer;background:var(--primary);color:var(--bg);font-family:var(--body);font-weight:600;font-size:15px;padding:9px 20px;border-radius:calc(var(--radius) - 4px)}
  .search button:hover{background:var(--primary-dark);color:var(--bg)}
  .search button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
  .meta{font-size:13.5px;color:var(--muted);margin:14px 0 6px}
  .meta b{color:var(--ink)}
  .tabs{display:flex;gap:8px;margin:14px 0 20px}
  .tab{border:1px solid var(--line);background:var(--bg);color:var(--muted);font-family:var(--body);font-size:13px;font-weight:500;padding:7px 16px;border-radius:99px;cursor:pointer}
  .tab.on{background:var(--primary);border-color:var(--primary);color:var(--bg)}

  .results{padding-bottom:70px}
  .res{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px 24px;margin-bottom:12px}
  .res .path{font-size:12px;color:var(--muted);letter-spacing:.03em;margin-bottom:4px}
  .res h3{font-family:var(--display);font-weight:600;font-size:17px;margin-bottom:6px}
  .res h3 a{color:var(--ink);text-decoration:none}
  .res h3 a:hover{color:var(--primary)}
  .res p{font-size:14.5px;color:var(--muted)}
  .res mark{background:var(--warn-soft);color:var(--accent-dark);border-radius:3px;padding:0 2px;font-weight:600}
  .res .foot{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:10px;align-items:center}
  .res .foot a{font-size:13.5px;color:var(--primary);text-decoration:none;font-weight:500}
  .chip{display:inline-block;font-size:11.5px;font-weight:600;padding:3px 10px;border-radius:99px;white-space:nowrap}
  .c-kniha{background:var(--primary-soft);color:var(--primary-dark)}
  .c-prompt{background:var(--ok-soft);color:#04724D}
  .c-lock{background:var(--warn-soft);color:var(--accent-dark)}

  .res.locked{opacity:.85}
  .res.locked p{-webkit-mask:linear-gradient(#000 40%,transparent);mask:linear-gradient(#000 40%,transparent)}

  .empty{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-lg);padding:34px;text-align:center;margin-top:8px}
  .empty h3{font-family:var(--display);font-weight:600;font-size:18px;margin-bottom:8px}
  .empty p{font-size:14px;color:var(--muted);max-width:52ch;margin:0 auto}

  .foot-page{padding:10px 0 50px;text-align:center;font-size:12.5px;color:var(--muted)}
  @media(max-width:640px){.nav-links a{display:none}}

.empty p a{color:var(--primary)}

  /* Tmavé protějšky barevných štítků a zvýraznění shody.
     Proč lokálně: --ok-soft/--warn-soft přebíjí alias vrstva v app.css (`:root` má stejnou
     specificitu jako `[data-theme="dark"]` a načítá se později), takže se tmavý token
     z tokens.css neuplatní. Stejný vzor už má prompty.css u .b-free. Sepia si nechává
     světlé hodnoty — na krémovém papíře jsou čitelné (parita s knihovnou). */
  [data-theme="dark"] .res mark{background:#3B2F0B;color:#FDE68A}
  [data-theme="dark"] .c-prompt{background:#064E3B;color:#A7F3D0}
  [data-theme="dark"] .c-lock{background:#3B2F0B;color:#FDE68A}