/* Aplikace pro developery, vlastní vrstva nad tokeny Resimo Design Systemu.
   Všechno pod .rd, ať se to nebije s ničím jiným. */
@import url("tokens/fonts.css");
@import url("tokens/colors.css");
@import url("tokens/typography.css");
@import url("tokens/spacing.css");
@import url("tokens/radii-borders.css");
@import url("tokens/effects.css");

.rd {
  --ink: var(--color-primary, #344340);
  --zlata: var(--color-cta, #D4A574);
  --zlata-tmava: var(--color-cta-hover, #c69553);
  --pisek: #F5F1ED;
  --pisek-2: #EDE7E0;
  --bila: #fff;
  --linka: rgba(52, 67, 64, .12);
  --linka-jemna: rgba(52, 67, 64, .07);
  --tlumene: #646d6b;
  --slabe: #8d9694;
  --zelena: #1d7f57;
  --zelena-2: #4caf6e;
  --hneda: #b07620;
  --modra: #2e6db4;
  --fialova: #a0507f;
  --stin: 0 1px 1px rgba(52, 67, 64, .04), 0 6px 20px rgba(52, 67, 64, .07);
  --stin-vyssi: 0 2px 4px rgba(52, 67, 64, .05), 0 18px 44px rgba(52, 67, 64, .10);
  --r: 18px;
  --r-velky: 24px;
  font-family: var(--font-primary, "Articulat CF", sans-serif);
  color: var(--ink);
  background: var(--pisek);
}
.rd *, .rd *::before, .rd *::after { box-sizing: border-box; }
/* Reset v :where(), aby měl nulovou specificitu. Dřív to bylo „.rd p" (0,0,1,1), což je
   VÍC než „.rd__mojetrida" (0,0,1,0): odstup napsaný u vlastní třídy se tiše zahodil
   a bloky seděly na sobě. Změřeno 27. 9. 2026 na tabulce krajů, kde se takhle ztratilo
   48 px nad ní; stejnou past mělo dalších 48 tříd. */
.rd :where(h1, h2, h3, h4, p, ul, ol, dl, dd, figure) { margin: 0; padding: 0; }
/* Zavřený rozbalovací blok musí obsah schovat. Prohlížeč to dělá sám, ale měřeno
   26. 9. 2026 v Chrome 153 se to nestalo ani v prázdném dokumentu, takže odpovědi
   ležely přes další otázku. Jeden řádek to drží nezávisle na prohlížeči. */
.rd details:not([open]) > *:not(summary) { display: none; }
/* Stránka načtená na skryté kartě: animace se pozastaví na prvním snímku a kreslený
   obsah by zůstal neviditelný. Tady se kreslení vypne a všechno je rovnou vidět. */
.rd.je-bezkresleni *, .rd.je-bezkresleni *::before, .rd.je-bezkresleni *::after { animation: none !important; }
.rd.je-bezkresleni .rd__grafcara { stroke-dashoffset: 0; }

/* Kreslení se spouští doscrollováním, ne načtením stránky. Dokud karta nedostane
   třídu je-videt, stojí animace uvnitř ní na prvním snímku; pozorovatel protnutí ji
   přidá, jakmile se karta dostane do obrazu, a graf se nakreslí před očima. */
.rd .rd__karta:not(.je-videt) *, .rd .rd__karta:not(.je-videt) *::before, .rd .rd__karta:not(.je-videt) *::after,
.rd .rd__hraheader:not(.je-videt) *, .rd .rd__verdikt:not(.je-videt) *,
.rd .rd__pahero:not(.je-videt) *, .rd .rd__trhhero:not(.je-videt) *, .rd .rd__dneshero:not(.je-videt) * {
  animation-play-state: paused; }
.rd ul, .rd ol { list-style: none; }
.rd button { font: inherit; color: inherit; cursor: pointer; }
.rd a { color: inherit; }
.rd .cislo { font-family: "Inter", sans-serif; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }

/* ---------- kostra ---------- */

/* flex: 1 tu musí být, jinak se sloupec roztáhne jen podle nejširšího dítěte a obrazovka
   s užším obsahem (Prodej) má karty o 200 px užší než všechny ostatní. */
.rd__hlavni { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.rd__obsah { flex: 1; width: 100%; max-width: 1180px; margin: 0 auto; padding: 26px 34px 64px; display: flex; flex-direction: column; gap: 20px; }
.rd__drobky { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--tlumene); }
.rd__drobky b { color: var(--ink); font-weight: 600; }

/* ---------- pruh se lhůtou, vždy nahoře ---------- */
.rd__lhuta { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 12px 34px; background: linear-gradient(90deg, #f7e8d6, #fbf4ec); border-bottom: 1px solid rgba(212, 165, 116, .55); }
.rd__lhutaikona { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--zlata); color: var(--ink); flex: none; }
.rd__lhutatext { font-size: 15px; }
.rd__lhutatext b { font-weight: 600; }
.rd__odpocet { font-family: "Inter", sans-serif; font-weight: 600; font-variant-numeric: tabular-nums; }
.rd__lhutapopis { flex: 1 1 340px; min-width: 0; font-size: 13.5px; line-height: 1.45; color: var(--tlumene); }
.rd__lhuta .rd__cta { margin-left: auto; }

/* ---------- prvky ---------- */
.rd__cta { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 18px; border: 0; border-radius: 22px; background: var(--zlata); color: var(--ink); font-size: 15px; font-weight: 600; transition: background .15s ease, transform .15s ease; }
.rd__cta:hover { background: var(--zlata-tmava); transform: translateY(-1px); }
/* Obrysové tlačítko má STEJNÝ rozměr jako zlaté CTA. Rozdíl mezi hlavní a vedlejší akcí
   dělá barva, ne velikost; dvě různé výšky vedle sebe vypadaly jako dvě úrovně. */
.rd__tlacitko { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 18px; border: 1px solid var(--linka); border-radius: 22px; background: transparent; font-size: 15px; font-weight: 500; transition: border-color .15s ease, background .15s ease; }
.rd__tlacitko:hover { border-color: var(--ink); background: var(--bila); }

.rd__karta { background: var(--bila); border-radius: var(--r); box-shadow: var(--stin); transition: box-shadow .25s ease; }
.rd__karta:hover { box-shadow: var(--stin-vyssi); }
.rd__kartahlava { display: flex; align-items: center; gap: 12px; padding: 18px 22px 0; }
.rd__kartahlava h3 { font-size: 17px; font-weight: 600; line-height: 1.3; }
.rd__kartatelo { padding: 14px 22px 20px; }
.rd__kartatelo--bez { padding: 0 0 4px; }
.rd__odkazvpravo { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; border: 0; background: transparent; font-size: 14px; color: var(--tlumene); }
.rd__odkazvpravo:hover { color: var(--ink); text-decoration: underline; }

.rd__dva { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.rd__tri { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }

/* verdikt */
.rd__verdikt { position: relative; padding: 36px 38px; border-radius: 20px; background: radial-gradient(120% 140% at 0% 0%, #3b4b47 0%, #2b3734 55%, #243130 100%); color: #fff; box-shadow: 0 2px 6px rgba(35,46,44,.2), 0 24px 60px rgba(35,46,44,.28); overflow: hidden; }
.rd__verdikt::after { content: ""; position: absolute; right: -80px; top: -120px; width: 320px; height: 320px; border-radius: 50%; background: radial-gradient(circle, rgba(212,165,116,.20), transparent 68%); pointer-events: none; }
.rd__verdikt .rd__kicker { margin-bottom: 10px; font-size: 13px; color: rgba(255,255,255,.62); }
.rd__verdikt h2 { font-size: clamp(25px, 3vw, 37px); font-weight: 500; line-height: 1.2; color: #fff; text-wrap: balance; }
.rd__verdikt h2 b { font-weight: 600; white-space: nowrap; }
.rd__verdikt p.rd__podveta { margin-top: 12px; max-width: 64ch; font-size: 15.5px; line-height: 1.55; color: rgba(255,255,255,.8); }
.rd__verdiktakce { margin-top: 22px; display: flex; align-items: flex-start; gap: 22px; flex-wrap: wrap; }
/* Obě tlačítka v hlavě musí mít stejnou výšku i šířku sloupce, jinak jedno vypadá jako hlavní
   omylem. Rozdíl dělá barva, ne rozměr. */
.rd__soucet td { border-top: 1px solid var(--linka); background: var(--pisek-2); font-weight: 600; }
.rd__verdikt select { min-height: 38px; padding: 0 12px; border: 1px solid rgba(255,255,255,.3); border-radius: 19px; background: transparent; color: #fff; font-size: 14px; }
.rd__verdikt select option { color: var(--ink); }

/* rozhodnutí */
.rd__rozhodnuti { display: flex; flex-direction: column; gap: 10px; }
.rd__radek { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; padding: 16px 20px; background: var(--bila); border-radius: var(--r); box-shadow: var(--stin); transition: transform .16s ease, box-shadow .16s ease; }
.rd__radek:hover { transform: translateY(-2px); box-shadow: 0 2px 4px rgba(52,67,64,.06), 0 14px 30px rgba(52,67,64,.09); }
.rd__radektext { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.rd__radektext b { font-size: 15.5px; font-weight: 600; }
.rd__radektext span { font-size: 14px; color: var(--tlumene); line-height: 1.5; }
.rd__castka { font-family: "Inter", sans-serif; font-weight: 600; font-variant-numeric: tabular-nums; font-size: 19px; white-space: nowrap; }
.rd__radekakce { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.rd__hotovo { min-height: 38px; padding: 0 12px; border: 1px solid var(--linka); border-radius: 19px; background: transparent; font-size: 14px; color: var(--tlumene); }
.rd__hotovo:hover { border-color: var(--zelena); color: var(--zelena); }

/* čísla */
.rd__cisla { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1px; background: var(--linka-jemna); border-radius: var(--r); box-shadow: var(--stin); }
.rd__cislobox:first-child { border-radius: var(--r) 0 0 var(--r); }
.rd__cislobox:last-child { border-radius: 0 var(--r) var(--r) 0; }
.rd__cislobox { padding: 16px 20px; background: var(--bila); display: flex; flex-direction: column; gap: 4px; }
.rd__popisek { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--tlumene); }
.rd__hodnota { font-family: "Inter", sans-serif; font-weight: 600; font-variant-numeric: tabular-nums; font-size: 32px; line-height: 1.08; letter-spacing: -.02em; }
.rd__hodnota small { font-family: var(--font-primary); font-size: 15px; font-weight: 400; color: var(--tlumene); margin-left: 3px; }
.rd__cislobox { min-width: 0; }
.rd__hodnota { overflow-wrap: anywhere; }
.rd__pod { font-size: 13px; color: var(--tlumene); }

/* změna nahoru/dolů */
.rd__zmena { display: inline-flex; align-items: center; gap: 3px; font-size: 13.5px; font-weight: 600; }
.rd__zmena--dobra { color: var(--zelena); }
.rd__zmena--spatna { color: #b4432c; }

/* trychtýř */
/* Trychtýř: podklad je vždy na celou šířku, plnění uvnitř podle počtu. Text stojí
   v pevné mřížce nad podkladem, takže se neřídí šířkou pruhu a nemůže z dlaždice vylézt. */
.rd__trychtyr { display: flex; flex-direction: column; gap: 10px; }
.rd__trychtyrradek { position: relative; display: grid; grid-template-columns: minmax(104px, auto) minmax(0, 1fr) minmax(0, auto);
  align-items: center; gap: 6px 20px; min-height: 68px; padding: 14px 20px; border-radius: 12px; overflow: hidden;
  background: var(--pisek); }
.rd__trychtyrpruh { position: absolute; inset: 0; display: block; }
.rd__trychtyrpruh i { display: block; height: 100%; background: linear-gradient(90deg, rgba(29,127,87,.20), rgba(29,127,87,.06));
  animation: rd-roste .8s cubic-bezier(.2,.7,.3,1) both; transform-origin: left center; }
.rd__trychtyrradek > b { position: relative; font-family: "Inter", sans-serif; font-weight: 600; font-variant-numeric: tabular-nums;
  font-size: 28px; letter-spacing: -.02em; line-height: 1.05; }
.rd__trychtyrpopis { position: relative; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rd__trychtyrpopis b { font-size: 15px; font-weight: 600; }
.rd__trychtyrpopis small { font-size: 13px; line-height: 1.4; color: var(--tlumene); }
.rd__krok { position: relative; text-align: right; font-family: "Inter", sans-serif; font-size: 14px; font-weight: 600;
  font-variant-numeric: tabular-nums; color: var(--ink); white-space: nowrap; }
.rd__krok i { display: block; font-family: var(--font-primary, "Articulat CF", sans-serif); font-size: 12.5px; font-weight: 400;
  font-style: normal; color: var(--slabe); }
.rd__krok--slabe { color: var(--hneda); }
.rd__krok--slabe i { color: var(--hneda); opacity: .8; }

/* tabulka */
.rd__tabulka { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.rd__tabulka th { padding: 10px 14px; text-align: left; font-size: 12.5px; font-weight: 600; letter-spacing: .3px; text-transform: uppercase; color: var(--slabe); border-bottom: 1px solid var(--linka); }
.rd__tabulka td { padding: 12px 14px; border-bottom: 1px solid var(--linka-jemna); }
.rd__tabulka tr:last-child td { border-bottom: 0; }
.rd__tabulka .cislo, .rd__tabulka .rd__vpravo { text-align: right; }
.rd__tabulka tbody tr:hover { background: var(--pisek); }
.rd__obal { overflow-x: auto; border-bottom-left-radius: var(--r); border-bottom-right-radius: var(--r); }

/* pruhy a grafy */
.rd__pruh { height: 10px; border-radius: 5px; background: var(--pisek-2); overflow: hidden; }
.rd__pruhvyplne { display: block; height: 100%; border-radius: 5px; background: var(--zelena); animation: rd-roste .9s cubic-bezier(.2,.7,.3,1) both; transform-origin: left center; }
.rd__legenda { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 10px; font-size: 13.5px; color: var(--tlumene); }
.rd__tecka { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; }

/* štítky */
.rd__stitek { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 600; }
.rd__stitek--nova { background: rgba(212,165,116,.28); color: #7a5418; }
.rd__stitek--klid { background: var(--pisek-2); color: var(--tlumene); }
.rd__stitek--dobra { background: rgba(29,127,87,.14); color: var(--zelena); }

/* nabídka navíc */
.rd__nabidka { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; padding: 20px 24px; border: 1px solid rgba(212,165,116,.55); border-radius: var(--r); background: linear-gradient(115deg, rgba(212,165,116,.14), rgba(212,165,116,.04)); }
.rd__nabidkatext { flex: 1 1 320px; min-width: 0; }
.rd__nabidkatext p.rd__kicker { font-size: 12px; font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: #8a6a3d; }
.rd__nabidkatext h3 { margin: 3px 0 5px; font-size: 19px; font-weight: 600; }
.rd__nabidkatext p:last-child { font-size: 14.5px; line-height: 1.5; color: var(--tlumene); }
.rd__nabidkaakce { margin-left: auto; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.rd__nabidkaakce small { font-size: 12.5px; color: var(--slabe); }

/* nápověda */
.rd__napoveda { position: relative; display: inline-flex; vertical-align: middle; margin-left: 2px; }
/* Tlumené kolečko, které nekonkuruje nadpisu. Barvu i velikost si bere z okolního textu,
   takže vedle nadpisu karty i v hlavičce tabulky sedí na účaří a nikde netrčí. */
.rd .rd__napovedabtn { display: inline-grid; place-items: center; width: 1.25em; height: 1.25em; max-width: 19px; max-height: 19px;
  padding: 0; border: 0; border-radius: 50%; background: var(--pisek-2); color: var(--tlumene);
  font-family: Inter, system-ui, sans-serif; font-size: .72em; font-weight: 600; line-height: 1; cursor: pointer;
  transition: background .15s ease, color .15s ease, transform .15s ease; }
.rd .rd__napovedabtn:hover { background: #ded6ca; color: var(--ink); }
.rd .rd__napovedabtn[aria-expanded="true"] { background: var(--ink); color: #fff; transform: scale(1.06); }
.rd .rd__napovedabtn:focus-visible { outline: 2px solid var(--zlata); outline-offset: 2px; }
.rd__napovedabtn svg { display: none; }
.rd__napovedabtn::after { content: "?"; transform: translateY(.02em); }

/* Bublina: tmavá karta se šipkou k tlačítku, ne plovoucí obdélník. */
.rd__bublina { position: fixed; z-index: 140; transform: none; max-width: 320px; padding: 14px 16px 15px; border-radius: 14px;
  background: #22302c; color: rgba(255,255,255,.82); font-family: var(--font-primary, "Articulat CF", sans-serif); font-size: 13.5px; font-weight: 400; line-height: 1.55;
  text-align: left; text-transform: none; letter-spacing: 0; text-wrap: pretty;
  box-shadow: 0 2px 6px rgba(0,0,0,.14), 0 18px 48px -12px rgba(0,0,0,.45);
  animation: rd-vjezd2 .16s cubic-bezier(.2,.7,.3,1) both; }
.rd__bublina::before { content: ""; position: absolute; left: 50%; margin-left: -7px; border: 7px solid transparent; }
.rd__bublina:not(.je-nahore)::before { top: -13px; border-bottom-color: #22302c; }
.rd__bublina.je-nahore { transform: translateY(-100%); }
.rd__bublina.je-nahore::before { bottom: -13px; border-top-color: #22302c; }
.rd__bublina b { display: block; margin-bottom: 5px; color: #fff; font-size: 14px; font-weight: 600; letter-spacing: -.005em; }

/* sbalené důkazy */
.rd__detail { background: var(--bila); border-radius: var(--r); box-shadow: var(--stin); }
.rd__detail > summary { padding: 16px 22px; font-size: 15px; font-weight: 600; cursor: pointer; list-style: none; display: flex; align-items: center; gap: 10px; }
.rd__detail > summary::-webkit-details-marker { display: none; }
.rd__detail > summary::before { content: ""; width: 8px; height: 8px; border-right: 2px solid var(--tlumene); border-bottom: 2px solid var(--tlumene); transform: rotate(-45deg); transition: transform .2s ease; }
.rd__detail[open] > summary::before { transform: rotate(45deg); }
.rd__detailtelo { padding: 0 22px 22px; display: flex; flex-direction: column; gap: 18px; }

.rd__slovnik { display: grid; gap: 14px; }
.rd__slovnik div { display: grid; grid-template-columns: 220px 1fr; gap: 14px; font-size: 14.5px; }
.rd__slovnik dt { font-weight: 600; }
.rd__slovnik dd { color: var(--tlumene); line-height: 1.55; }

/* kroky */
.rd__kroky { counter-reset: k; display: flex; flex-direction: column; gap: 16px; }
.rd__kroky li { position: relative; display: grid; grid-template-columns: 160px 1fr; gap: 6px 16px; padding: 0 0 16px 42px; border-bottom: 1px solid var(--linka-jemna); }
.rd__kroky li:last-child { border-bottom: 0; padding-bottom: 0; }
.rd__kroky li::before { counter-increment: k; content: counter(k); position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--ink); color: #fff; font-size: 13px; font-weight: 600; }
.rd__kroky b { font-size: 15px; }
.rd__kroky span { font-size: 14.5px; color: var(--tlumene); line-height: 1.55; }

@keyframes rd-roste { from { transform: scaleX(.02); } to { transform: none; } }
@keyframes rd-vjezd { from { opacity: 0; } to { opacity: 1; } }
@keyframes rd-vjezd2 { from { opacity: 0; } to { opacity: 1; } }
@keyframes rd-prijezd { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: no-preference) {
  .rd__obsah > * { animation: rd-prijezd .42s cubic-bezier(.2,.7,.3,1) both; }
  .rd__obsah > *:nth-child(1) { animation-delay: .02s; }
  .rd__obsah > *:nth-child(2) { animation-delay: .07s; }
  .rd__obsah > *:nth-child(3) { animation-delay: .12s; }
  .rd__obsah > *:nth-child(4) { animation-delay: .17s; }
  .rd__obsah > *:nth-child(n+5) { animation-delay: .22s; }
}
@media (prefers-reduced-motion: reduce) {
  .rd *, .rd *::before { animation: none !important; transition: none !important; }
  /* Bez animace by čára grafu zůstala nevykreslená, protože ji kreslí právě ta animace. */
  .rd__grafcara { stroke-dashoffset: 0 !important; }
  .rd__grafvypln { animation: none !important; opacity: 1 !important; }
  .rd__dvojpruh, .rd__tempoosa i { transform: none !important; }
}

@media (max-width: 1020px) {
  .rd__obsah { padding: 20px 16px 48px; }
  .rd__lhuta { padding: 12px 16px; }
  .rd__dva, .rd__tri { grid-template-columns: 1fr; }
  .rd__slovnik div { grid-template-columns: 1fr; gap: 2px; }
  .rd__kroky li { grid-template-columns: 1fr; }
}

/* ---------- demo lišta ---------- */
.rd { --demolista: 52px; }
.rd__demolista { position: sticky; top: 0; z-index: 40; display: flex; align-items: center; gap: 10px 22px; flex-wrap: wrap; padding: 9px 22px; background: #1f2926; color: rgba(255,255,255,.72); font-size: 13px; }
.rd__demoznacka { padding: 3px 10px; border-radius: 999px; background: var(--zlata); color: #2b2b2b; font-weight: 600; font-size: 12px; }
.rd__demopopis { color: rgba(255,255,255,.5); }
.rd__demoskupina { display: flex; align-items: center; gap: 10px; }
.rd__demolabel { color: rgba(255,255,255,.45); }
.rd__prepinac { display: inline-flex; padding: 3px; border-radius: 999px; background: rgba(255,255,255,.08); }
.rd__prepinac button { min-height: 28px; padding: 0 12px; border: 0; border-radius: 999px; background: transparent; color: rgba(255,255,255,.7); font-size: 13px; }
.rd__prepinac button[aria-pressed="true"] { background: #fff; color: #1f2926; font-weight: 600; }
.rd__demotlacitko { min-height: 30px; padding: 0 12px; border: 1px solid rgba(255,255,255,.2); border-radius: 999px; background: transparent; color: rgba(255,255,255,.8); font-size: 13px; }
.rd__demotlacitko:hover { border-color: var(--zlata); color: #fff; }
.rd__demotlacitko--konec { margin-left: auto; }
/* Rozbalovátko lišty je jen pro mobil. Bez tohohle řádku se nad 760 px vykreslilo
   jako neostylované systémové tlačítko a přeleželo sousední pilulku. */
.rd .rd__demorozbal { display: none; align-items: center; gap: 6px; min-height: 30px;
  padding: 0 12px; border: 1px solid rgba(255,255,255,.2); border-radius: 999px;
  background: transparent; color: rgba(255,255,255,.8); font-size: 13px; white-space: nowrap; }
.rd .rd__demorozbal svg { flex: none; }

/* ---------- průvodce ---------- */
.rd__modal { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: 24px; }
.rd__zaclona { position: absolute; inset: 0; border: 0; background: rgba(28,36,34,.55); backdrop-filter: blur(3px); }
.rd__modalpanel { position: relative; display: flex; flex-direction: column; width: min(760px, 100%); max-height: 88vh; border-radius: 22px; background: var(--bila); box-shadow: 0 40px 90px rgba(0,0,0,.35); overflow: hidden; animation: rd-prijezd .32s ease both; }
.rd__modalhlava { display: flex; align-items: center; gap: 14px; padding: 16px 22px; border-bottom: 1px solid var(--linka-jemna); }
.rd__modalkroky { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13px; color: var(--slabe); }
.rd__modalkroky li.je-tady { color: var(--ink); font-weight: 600; }
.rd__modalkroky li.je-hotovo { color: var(--zelena); }
.rd__modalhlava .rd__tlacitko { margin-left: auto; }
.rd__modaltelo { padding: 28px 32px; overflow-y: auto; }
.rd__modalpata { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 22px; border-top: 1px solid var(--linka-jemna); background: var(--pisek); }
.rd__obseznam { display: flex; flex-direction: column; gap: 10px; }
.rd__obseznam li { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--linka); border-radius: 14px; }
.rd__obseznam li > span:last-child { display: flex; flex-direction: column; }
.rd__obseznam small { font-size: 13px; color: var(--tlumene); }
.rd__fajfka { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--pisek-2); color: var(--tlumene); flex: none; }
.rd__fajfka--on { background: var(--zelena); color: #fff; }

/* ---------- zamčený stav ---------- */
.rd__zamceno { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: 42px 38px; border-radius: 20px; background: linear-gradient(135deg, #fbf4ec, #f6e8d6); border: 1px solid rgba(212,165,116,.5); }
.rd__zamcenoikona { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--zlata); color: var(--ink); }
.rd__zamceno h2 { font-size: clamp(22px, 2.4vw, 29px); line-height: 1.25; max-width: 24ch; }
.rd__zamceno p { font-size: 15.5px; line-height: 1.6; color: var(--tlumene); max-width: 62ch; }

/* ---------- kultivace vzhledu ---------- */
.rd { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
.rd__obsah { gap: 26px; padding: 34px 40px 80px; }
.rd__karta { border-radius: var(--r); border: 1px solid rgba(52,67,64,.06); }
.rd__kartahlava { padding: 22px 26px 0; }
.rd__kartahlava h3 { font-size: 18px; letter-spacing: -.01em; }
.rd__kartatelo { padding: 16px 26px 24px; }
.rd__verdikt { border-radius: var(--r-velky); padding: 42px 44px; }
.rd__verdikt h2 { letter-spacing: -.02em; }
.rd__verdikt .rd__kicker { font-size: 12.5px; letter-spacing: .4px; text-transform: uppercase; color: rgba(255,255,255,.5); }
.rd__cislobox { padding: 20px 24px; }
.rd__popisek { font-size: 13.5px; }
.rd__radek { border: 1px solid rgba(52,67,64,.06); padding: 20px 24px; }
.rd__tabulka th { padding: 12px 18px; font-size: 11.5px; letter-spacing: .5px; }
.rd__tabulka td { padding: 15px 18px; }
.rd__tabulka tbody tr { transition: background .14s ease; }
.rd__nabidka { border-radius: var(--r-velky); padding: 26px 30px; }
.rd__detail { border: 1px solid rgba(52,67,64,.06); }
.rd__detail > summary { padding: 20px 26px; }
.rd__detailtelo { padding: 0 26px 26px; }
.rd__cta { min-height: 46px; padding: 0 22px; border-radius: 23px; box-shadow: 0 1px 2px rgba(150,110,60,.2), 0 8px 20px rgba(150,110,60,.18); }
.rd__cta:hover { box-shadow: 0 2px 4px rgba(150,110,60,.24), 0 14px 28px rgba(150,110,60,.24); }
.rd__tlacitko { min-height: 46px; border-radius: 23px; background: #fff; }
.rd__lhuta { padding: 14px 40px; border-bottom: 1px solid rgba(212,165,116,.5); box-shadow: 0 6px 20px rgba(52,67,64,.05); }
.rd__dva, .rd__tri { gap: 26px; }
.rd__hodnota { font-size: 34px; }
.rd__trychtyrradek { min-height: 76px; border-radius: 14px; }
.rd__trychtyrradek > b { font-size: 30px; }

/* AI rozvržení */
.rd__ai { display: flex; flex-direction: column; gap: 16px; max-width: 840px; width: 100%; margin: 0 auto; }
.rd__aivlakno { display: flex; flex-direction: column; gap: 16px; }
.rd__aija { align-self: flex-end; max-width: 70%; padding: 14px 20px; border-radius: 20px 20px 4px 20px; background: var(--ink); color: #fff; font-size: 15px; }
.rd__aiodpoved { align-self: flex-start; max-width: 88%; padding: 24px 26px; border-radius: 20px 20px 20px 4px; background: var(--bila); border: 1px solid rgba(52,67,64,.06); box-shadow: var(--stin); }
.rd__aiuvod { font-size: 14.5px; color: var(--tlumene); margin-bottom: 10px; }
.rd__aiveta { font-size: 21px; font-weight: 500; line-height: 1.35; letter-spacing: -.01em; }
.rd__aibody { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.rd__aibody li { position: relative; padding-left: 18px; font-size: 15px; line-height: 1.55; color: var(--tlumene); }
.rd__aibody li::before { content: ""; position: absolute; left: 0; top: 9px; width: 6px; height: 6px; border-radius: 50%; background: var(--zlata); }
.rd__aizdroj { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--linka-jemna); font-size: 13px; color: var(--slabe); }
.rd__ainavrhy { display: flex; flex-wrap: wrap; gap: 10px; }
.rd__aivstup { display: flex; gap: 12px; padding: 10px; border-radius: 30px; background: var(--bila); border: 1px solid rgba(52,67,64,.08); box-shadow: var(--stin); }
.rd__aivstup input { flex: 1; min-height: 44px; padding: 0 18px; border: 0; background: transparent; font: inherit; font-size: 15.5px; outline: none; }

/* Mapa, náhledy obrazovek a osa kroků */
.rd__mapa svg { width: 100%; height: auto; }
.rd__mapa .rd__pod { margin-top: 10px; }
.rd__nahledy { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 18px; }
.rd__nahled { margin: 0; }
.rd__nahledram { display: flex; gap: 6px; padding: 8px; border: 1px solid var(--linka); border-radius: 12px; background: var(--pisek); }
.rd__nahledbok { display: flex; flex-direction: column; gap: 5px; width: 34px; flex: none; padding: 4px; border-radius: 8px; background: #2c3a37; }
.rd__nahledbok span { height: 6px; border-radius: 3px; background: rgba(255,255,255,.28); }
.rd__nahledbok span:first-child { background: var(--zlata); }
.rd__nahledplocha { flex: 1; display: flex; flex-wrap: wrap; gap: 5px; align-content: flex-start; }
.rd__nahledblok { border-radius: 5px; background: #fff; border: 1px solid var(--linka-jemna); }
.rd__nahledblok.je-verdikt { background: #2c3a37; border-color: #2c3a37; }
.rd__nahledblok.je-hlava { background: var(--pisek-2); }
.rd__nahledblok.je-pruh1 { background: rgba(29,127,87,.34); }
.rd__nahledblok.je-pruh2 { background: rgba(29,127,87,.24); }
.rd__nahledblok.je-pruh3 { background: rgba(212,165,116,.5); }
.rd__nahledblok.je-mapa { background: rgba(212,165,116,.22); border-color: rgba(212,165,116,.5); }
.rd__nahled figcaption { margin-top: 10px; font-size: 13.5px; line-height: 1.5; color: var(--tlumene); }
.rd__osa { display: flex; flex-wrap: wrap; gap: 8px; }
.rd__osa li { padding: 8px 14px; border: 1px solid var(--linka); border-radius: 999px; background: #fff; font-size: 13.5px; color: var(--tlumene); cursor: pointer; }
.rd__osa li.je-tady { border-color: var(--ink); background: var(--ink); color: #fff; font-weight: 600; }
.rd__osa li.je-hotovo { border-color: rgba(29,127,87,.4); color: var(--zelena); }
.rd__prepinacsvetly { display: inline-flex; gap: 2px; padding: 3px; margin-bottom: 14px; border-radius: 999px; background: var(--pisek-2); }
.rd__prepinacsvetly button { min-height: 32px; padding: 0 16px; border: 0; border-radius: 999px; background: transparent; font-size: 14px; color: var(--tlumene); }
.rd__prepinacsvetly button[aria-pressed="true"] { background: #fff; color: var(--ink); font-weight: 600; box-shadow: var(--stin); }

/* ---------- vizuál projektu, simulace, rezervace, historie cen ---------- */
.rd__fasada { display: flex; flex-direction: column; gap: 14px; }
.rd__fasada.je-mala { width: 76px; flex: none; }
.rd__fasada svg { display: block; border-radius: 8px; }
.rd__legenda { display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 13.5px; color: var(--tlumene); }
.rd__legenda li { display: flex; align-items: center; gap: 8px; }
.rd__legenda i { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.rd__export { display: inline-flex; align-items: center; gap: 8px; }
.rd__slider { display: flex; align-items: center; gap: 18px; }
.rd__slider input { flex: 1; accent-color: var(--zlata); height: 6px; }
.rd__slider b { font-size: 30px; letter-spacing: -.02em; min-width: 92px; text-align: right; }
.rd__srovnani { display: flex; flex-direction: column; gap: 4px; padding: 20px 22px; border-radius: var(--r); background: var(--pisek); border: 1px solid var(--linka); }
.rd__srovnani b { font-size: 32px; letter-spacing: -.02em; }
.rd__srovnani span { font-size: 14px; color: var(--tlumene); }
.rd__srovnani.je-dobre { border-color: rgba(29,127,87,.45); background: rgba(29,127,87,.06); }
.rd__srovnani.je-spatne { border-color: rgba(180,67,44,.4); background: rgba(180,67,44,.05); }
.rd__sloupcegraf { display: flex; align-items: flex-end; gap: 8px; height: 150px; }
.rd__sloupec { position: relative; flex: 1; height: 100%; display: flex; align-items: flex-end; gap: 2px; }
.rd__sloupec small { position: absolute; bottom: -20px; left: 0; right: 0; text-align: center; font-size: 11px; color: var(--slabe); }
.rd__sloupecnove { flex: 1; border-radius: 4px 4px 0 0; background: linear-gradient(180deg, #2f7f5f, #1d7f57); min-height: 3px; animation: rd-vyrust .5s ease both; }
.rd__sloupecstorno { width: 8px; border-radius: 4px 4px 0 0; background: rgba(180,67,44,.55); min-height: 3px; }
.rd__sloupcegraf + .rd__pod { margin-top: 26px; }
.rd__dvekrivky { width: 100%; height: 190px; }
.rd__vyber { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.rd__vyber label { font-size: 13.5px; color: var(--tlumene); }
.rd__vyber select { min-height: 40px; padding: 0 14px; border: 1px solid var(--linka); border-radius: 20px; background: #fff; font: inherit; font-size: 14px; max-width: 100%; }
.rd__prepinacloni { display: inline-flex; align-items: center; gap: 9px; margin-left: 14px; font-size: 13.5px; color: var(--tlumene); cursor: pointer; }
.rd__prepinacloni input { width: 16px; height: 16px; accent-color: #344340; }
@keyframes rd-vyrust { from { transform: scaleY(0); transform-origin: bottom; } to { transform: scaleY(1); } }
@media (max-width: 900px) { .rd__fasada.je-mala { display: none; } }

.rd__odkaz.je-zamcene { color: rgba(255,255,255,.45); }
.rd__odkaz.je-zamcene svg { color: var(--zlata); opacity: .6; }
/* ---------- rozprodanost po patrech ---------- */
/* Mapa bytů: jeden čtvereček = jeden byt. Rozměry a barvy z handoffu „Obrazovka Dnes“. */
.rd__mapabytu { display: flex; flex-direction: column; gap: 10px; }
.rd__patro { display: grid; grid-template-columns: 54px minmax(0, 1fr) 116px; align-items: center; gap: 12px; }
.rd__patrocislo { font-size: 13px; color: var(--tlumene); white-space: nowrap; }
.rd__byty { display: flex; flex-wrap: wrap; gap: 3px; }
.rd__byt { width: 12px; height: 12px; border-radius: 3px; box-sizing: border-box; border: 1.5px solid #B9B0A4; background: transparent;
  transition: background-color .35s ease, border-color .35s ease, transform .35s cubic-bezier(.3,1.6,.5,1); }
.rd__byt.je-prodany { background: #344340; border-color: #344340; }
.rd__byt.je-rezervace { background: #A08A6E; border-color: #A08A6E; }
.rd__byt.je-pop { transform: scale(1.3); }
.rd__patrocisla { display: flex; flex-direction: column; text-align: right; }
.rd__patrocisla b { font-family: Inter, system-ui, sans-serif; font-size: 13px; font-weight: 600; white-space: nowrap; }
.rd__patrocena { font-family: Inter, system-ui, sans-serif; font-size: 11.5px; font-weight: 500; color: #8a918f; white-space: nowrap; }
.rd__mapalegenda { display: flex; gap: 18px; flex-wrap: wrap; font-size: 13px; color: #4a5956; padding-top: 12px; border-top: 1px solid var(--linka-jemna); }
.rd__mapalegenda span { display: flex; align-items: center; gap: 6px; }
.rd__sw { width: 10px; height: 10px; border-radius: 3px; box-sizing: border-box; border: 1.5px solid #B9B0A4; }
.rd__sw.je-prodany { background: #344340; border-color: #344340; }
.rd__sw.je-rezervace { background: #A08A6E; border-color: #A08A6E; }

/* Časová osa „Kde jste proti termínu“. Měřítko: měsíce do kolaudace + měsíce po ní. */
.rd__osa { position: relative; height: 160px; margin: 6px 6px 0; }
.rd__osa > span { position: absolute; }
.rd__osadnes { top: 80px; left: 0; font-size: 11.5px; font-weight: 600; color: var(--ink); }
.rd__osakol { top: 0; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; transition: opacity .3s; }
.rd__osakol i { width: 2px; height: 30px; background: #344340; }
.rd__osapilulka { height: 26px; padding: 0 11px; border-radius: 999px; background: #344340; color: #fff; font-size: 12.5px; font-weight: 500;
  display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.rd__osadraha { left: 0; right: 0; top: 56px; height: 18px; border-radius: 9px; background: var(--linka-jemna); overflow: hidden; }
.rd__osadraha i { position: absolute; top: 0; bottom: 0; }
.rd__osapruh1 { left: 0; background: linear-gradient(90deg, #4a5d58, #344340); }
.rd__osapruh2 { background: repeating-linear-gradient(135deg, #B4432C 0 5px, #C9624B 5px 10px); }
.rd__osatick { width: 1px; background: rgba(255,255,255,.35); }
.rd__osamesic { top: 80px; transform: translateX(-50%); font-size: 11.5px; font-weight: 500; color: #8a918f; white-space: nowrap; }
.rd__osazavorka { top: 108px; display: flex; flex-direction: column; gap: 6px; transition: opacity .3s; }
.rd__osazavorka i { align-self: stretch; height: 6px; border: 1.5px solid; border-top: 0; border-radius: 0 0 6px 6px; }
.rd__osazavorka span { font-size: 13px; line-height: 1.35; }
.rd__osazavorka b { font-family: Inter, system-ui, sans-serif; font-size: 13px; font-weight: 600; }
.rd__osazavorka small { color: #6b7472; font-size: 13px; }
.rd__osazavorka.je-do { align-items: center; color: #344340; text-align: center; }
.rd__osazavorka.je-po { align-items: flex-end; color: #B4432C; text-align: right; white-space: nowrap; }
.rd__osaklid { display: flex; flex-direction: column; gap: 10px; }
.rd__osastitek { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; padding: 8px 14px; border-radius: 999px;
  background: #E7F2EC; color: #1D7F57; font-size: 14px; font-weight: 600; }
@media (max-width: 700px) {
  .rd__trychtyrradek { grid-template-columns: minmax(72px, auto) minmax(0, 1fr); padding: 12px 14px; gap: 4px 14px; }
  .rd__trychtyrradek > b { font-size: 24px; }
  .rd__krok { grid-column: 1 / 3; text-align: left; white-space: normal; }
  .rd__krok i { display: inline; }
  .rd__patro { grid-template-columns: 50px minmax(0, 1fr); }
  .rd__patrocisla { grid-column: 2; text-align: left; flex-direction: row; gap: 10px; align-items: baseline; }
  .rd__osa { height: 176px; margin-left: 2px; margin-right: 2px; }
  .rd__osazavorka span { font-size: 12px; }
  .rd__osapilulka { font-size: 11.5px; padding: 0 9px; }
}
/* ---------- náhled zamčené funkce a váhy v simulaci ---------- */
.rd__ukazka { position: relative; }
.rd__skryte { color: transparent !important; text-shadow: 0 0 9px rgba(52,67,64,.55); user-select: none; }
.rd__zaver { margin-top: 16px; padding: 14px 18px; border-radius: var(--r); font-size: 15px; line-height: 1.55; }
.rd__zaver.je-dobre { background: rgba(29,127,87,.08); color: #14603f; }
.rd__zaver.je-spatne { background: rgba(180,67,44,.07); color: #8e3722; }
.rd__nahledpole { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 16px; padding: 4px 0; }
.rd__nahledpole > div { display: flex; flex-direction: column; gap: 3px; padding: 18px 20px; border-radius: var(--r); background: var(--pisek); border: 1px solid var(--linka); }
.rd__nahledpole b { font-size: 26px; letter-spacing: -.02em; }
/* ---------- cenová pásma a víc křivek ---------- */
.rd__pasma { display: flex; flex-direction: column; gap: 16px; }
.rd__pasmo { display: grid; grid-template-columns: 62px 1fr auto; align-items: center; gap: 16px; }
.rd__pasmotyp { font-size: 14px; font-weight: 600; }
.rd__pasmocara { position: relative; height: 8px; border-radius: 4px; background: linear-gradient(90deg, rgba(29,127,87,.35), var(--pisek-2) 50%, rgba(180,67,44,.35)); }
.rd__pasmotecka { position: absolute; top: 50%; width: 16px; height: 16px; margin: -8px 0 0 -8px; border-radius: 50%; background: var(--ink); border: 3px solid #fff; box-shadow: 0 2px 6px rgba(52,67,64,.3); }
.rd__pasmohodnoty { white-space: nowrap; font-size: 13px; }
.rd__vicekrivek { width: 100%; height: 200px; }
@media (max-width: 760px) { .rd__pasmo { grid-template-columns: 52px 1fr; } .rd__pasmohodnoty { grid-column: 2; } }

/* ---------- rozbalení, výběr projektu, pobídky ---------- */
.rd__rozbal { display: flex; justify-content: center; padding: 16px 0 4px; border-top: 1px solid var(--linka-jemna); }
.rd__rozbal .rd__tlacitko { display: inline-flex; align-items: center; gap: 8px; }
/* Karta projektu v tmavé hlavičce. Jedna komponenta pro všechny obrazovky.
   Hodnoty z handoffu „karta_projektu“, nepřepisovat od oka.
   Výběr nese fajfka na fotce, ne rámeček; metrika stojí vždy vpravo za linkou. */
.rd__projekty { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 22px; }
.rd__projekt { flex: 0 1 auto; min-width: 264px; display: grid; grid-template-columns: 52px auto auto;
  align-items: center; gap: 12px; min-height: 72px; padding: 10px 14px 10px 10px; border: 0; border-radius: 16px;
  text-align: left; cursor: pointer; color: #fff; background: rgba(255,255,255,.05);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); transition: background .15s, box-shadow .15s; }
.rd__projekt:hover { background: rgba(255,255,255,.09); }
.rd__projekt:focus-visible { outline: 2px solid var(--zlata); outline-offset: 2px; }
.rd__projektfoto { position: relative; width: 52px; height: 52px; }
.rd__projektfajfka { position: absolute; right: -5px; bottom: -5px; width: 20px; height: 20px; border-radius: 50%;
  background: var(--ink); color: #fff; box-shadow: 0 0 0 2px #fff; display: none; align-items: center; justify-content: center; }
.rd__projekttext { min-width: 0; }
.rd__projekttext b { display: block; font-size: 15.5px; font-weight: 500; line-height: 1.25; white-space: nowrap; }
.rd__projekttext small { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.3; color: rgba(255,255,255,.62); white-space: nowrap; }
.rd__projektmetrika { padding-left: 14px; border-left: 1px solid rgba(255,255,255,.14); text-align: right; min-width: 72px; flex: 0 0 auto; }
.rd__projektmetrika b { display: block; font-size: 22px; line-height: 1; letter-spacing: -.01em; }
.rd__projektmetrika small { display: block; max-width: 92px; margin: 4px 0 0 auto; font-size: 11.5px; line-height: 1.25;
  color: rgba(255,255,255,.62); text-wrap: balance; }
.rd__projekt[aria-pressed="true"] { background: #fff; color: var(--ink); cursor: default;
  box-shadow: 0 12px 26px -14px rgba(0,0,0,.55); }
.rd__projekt[aria-pressed="true"] .rd__projekttext small,
.rd__projekt[aria-pressed="true"] .rd__projektmetrika small { color: var(--tlumene); }
.rd__projekt[aria-pressed="true"] .rd__projektmetrika { border-left-color: #EEE8E1; }
.rd__projekt[aria-pressed="true"] .rd__projektfajfka { display: flex; }
.rd__projekt[aria-pressed="false"] .rd__projektnahled { opacity: .8; filter: saturate(.8); }
@media (max-width: 560px) { .rd__projekt { flex-basis: 100%; } }
.rd__pobidky { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; }
.rd__pobidka { display: flex; flex-direction: column; gap: 4px; padding: 18px 20px; border-radius: var(--r); border: 1px solid rgba(212,165,116,.45); background: linear-gradient(160deg, #fdf8f2, #faf1e6); }
.rd__pobidkanazev { font-size: 16px; line-height: 1.35; }
.rd__pobidkahodnota { font-size: 13.5px; color: var(--tlumene); }
.rd__pobidkapata { display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(212,165,116,.35); font-size: 13px; }
.rd__pobidkapata span { display: flex; flex-direction: column; gap: 2px; }
.rd__pobidkapata .rd__vpravo { align-items: flex-end; }
.rd__pasmolegenda { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-bottom: 16px; font-size: 13px; color: var(--tlumene); }
.rd__pasmohodnoty { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; white-space: nowrap; }
.rd__pasmohodnoty b { font-size: 15px; }
.rd__pasmokde { font-size: 12px; color: var(--slabe); }
.rd__pasmokde.je-vysoko { color: #b4432c; font-weight: 600; }
.rd__pasmokde.je-nizko { color: #1d7f57; font-weight: 600; }
.rd__dvekrivky { height: 230px; }
@media (max-width: 700px) { .rd__projekt { min-width: 100%; } }
.rd__duvera { max-width: 56ch; margin-top: 4px; padding: 12px 16px; border-radius: var(--r); background: var(--pisek); font-size: 13.5px; line-height: 1.55; color: var(--tlumene); }
/* ---------- graf zájmu na plnou šíři ---------- */
.rd__grafovladani { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; margin-bottom: 4px; }
.rd__grafovladani .rd__prepinacsvetly { margin-bottom: 0; }
.rd__grafplocha { position: relative; min-width: 0; }
.rd__graf { width: 100%; height: auto; display: block; cursor: crosshair; }
.rd__grafosa { font-size: 11px; fill: var(--slabe); font-family: inherit; }
.rd__grafcara { stroke-dasharray: 4000; stroke-dashoffset: 4000; animation: rd-kresli 1.5s ease forwards; }
@keyframes rd-kresli { to { stroke-dashoffset: 0; } }
.rd__grafbublina { position: absolute; top: 8px; transform: translateX(-50%); display: flex; flex-direction: column; gap: 5px; padding: 12px 14px; border-radius: 12px; background: #1f2926; color: #fff; font-size: 13px; white-space: nowrap; pointer-events: none; box-shadow: 0 10px 28px rgba(0,0,0,.28); z-index: 5; }
.rd__grafbublina span { display: flex; align-items: center; gap: 8px; }
.rd__grafbublina i { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.rd__grafbublina b.cislo { margin-left: auto; padding-left: 14px; }
.rd__graflegenda { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--linka-jemna); }
.rd__grafpozn { margin-top: 10px; max-width: 76ch; }
/* Přepínače čar v grafu: součet a jednotlivé projekty. Vypnutý chip zůstává čitelný,
   jen ztlumený, aby bylo poznat, že tam ta čára je a dá se vrátit. */
.rd__grafprepinace { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 0 6px; }
.rd__grafchip { display: inline-flex; align-items: center; gap: 8px; padding: 7px 13px; border-radius: 999px; font-size: 13.5px;
  border: 1px solid var(--linka); background: #fff; color: var(--ink); cursor: pointer; transition: border-color .15s ease, background .15s ease, opacity .15s ease; }
.rd__grafchip:hover { border-color: #b9b0a4; }
.rd__grafchip i { width: 10px; height: 10px; border-radius: 3px; flex: none; }
.rd__grafchip b { font-family: Inter, system-ui, sans-serif; font-size: 13px; font-weight: 600; padding-left: 4px; }
.rd__grafchip.je-soucet { background: var(--pisek); border-color: #ddd4c8; }
.rd__grafchip.je-vypnuty { opacity: .42; background: transparent; }
.rd__grafchip.je-vypnuty i { background: #c6c0b7 !important; }
.rd__grafchip.je-vypnuty b { text-decoration: line-through; }
.rd__grafvypln { animation: rd-zesvetli .9s ease .35s both; }
@keyframes rd-zesvetli { from { opacity: 0; } to { opacity: 1; } }
.rd__bublinasoucet { margin-top: 3px; padding-top: 6px; border-top: 1px solid rgba(255,255,255,.18); }
.rd__odkazven { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--tlumene); white-space: nowrap; }
.rd__odkazven:hover { color: var(--ink); text-decoration: underline; }
.rd__tabulka th .rd__napoveda { margin-left: 5px; vertical-align: middle; }
/* ---------- dlaždice projektů s náhledem, okno, pořadí ---------- */
.rd__projektnahled { display: grid; place-items: center; width: 52px; height: 52px; flex: none; border-radius: 11px; font-size: 20px; font-weight: 600; color: #fff;
  background-size: cover; background-position: center; background-repeat: no-repeat; }
.rd__projektnahled.je-0 { background: linear-gradient(140deg, #3d5450, #2c3a37); }
.rd__projektnahled.je-1 { background: linear-gradient(140deg, #c79a62, #a87e4b); }
.rd__projektnahled.je-2 { background: linear-gradient(140deg, #4a6b5c, #33534a); }
/* Bez fotky kreslí NahledProjektu schematickou fasádu, ne iniciálu: podvrhnout snímek
   cizího domu by byla lež. Stav výběru se u ní řeší stejně jako u fotky, ztlumením. */
.rd__oknoradek { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.rd__oknoradek .rd__prepinacsvetly { margin-bottom: 0; }
.rd__poradi { display: flex; align-items: center; gap: 16px; }
.rd__poradi > b { font-size: 52px; line-height: 1; letter-spacing: -.03em; }
.rd__poradi span { display: flex; flex-direction: column; gap: 2px; }
.rd__poradi span b { font-size: 16px; }

/* ---------- mobil: vše, co přibylo, musí fungovat i na telefonu ---------- */
@media (max-width: 760px) {
  .rd__grafovladani { flex-direction: column; align-items: stretch; gap: 8px; }
  .rd__grafchip { font-size: 12.5px; padding: 6px 11px; }
  .rd__grafovladani .rd__prepinacsvetly, .rd__oknoradek .rd__prepinacsvetly { overflow-x: auto; width: 100%; -webkit-overflow-scrolling: touch; }
  .rd__prepinacsvetly button { white-space: nowrap; flex: none; }
  .rd__graf { min-height: 220px; }
  .rd__cisla { grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); }
  .rd__grafbublina { left: 50% !important; font-size: 12px; padding: 10px 12px; }
  .rd__oknoradek { flex-direction: column; align-items: stretch; gap: 6px; }
  .rd__projekty { flex-direction: column; }
  .rd__projekt { width: 100%; min-width: 0; }
  .rd__poradi > b { font-size: 40px; }
  .rd__pobidky { grid-template-columns: 1fr; }
  .rd__nahledpole { grid-template-columns: 1fr; }
  .rd__zamek { padding: 0; }
  .rd__zamekobsah { padding: 18px 14px; }
  .rd__zamekobsah li { font-size: 14px; }
  .rd__duvera { font-size: 13px; padding: 10px 12px; }
  .rd__rozbal .rd__tlacitko { width: 100%; justify-content: center; }
  .rd__vyber { flex-direction: column; align-items: stretch; }
  .rd__vyber select { width: 100%; }
  .rd__slider { flex-direction: column; align-items: stretch; gap: 10px; }
  .rd__slider b { text-align: left; }
  .rd__srovnani b { font-size: 26px; }
  .rd__dvekrivky, .rd__vicekrivek { height: 170px; }
  .rd__sloupcegraf { height: 120px; }
  .rd__legenda { gap: 6px 14px; font-size: 12.5px; }
  .rd__odkazven { font-size: 12px; }
}
@media (max-width: 460px) {
  /* Jeden sloupec: hodnota s pevnými mezerami se do poloviny šířky nevejde. */
  .rd__cisla { grid-template-columns: 1fr; }
  .rd__cislobox:first-child { border-radius: var(--r) var(--r) 0 0; }
  .rd__cislobox:last-child { border-radius: 0 0 var(--r) var(--r); }
  .rd__hodnota { font-size: 28px; }
  .rd__projektnahled { width: 40px; height: 40px; font-size: 17px; }
  .rd__poradi > b { font-size: 34px; }
  .rd__graf { min-height: 190px; }
}
/* ---------- dvojité sloupce: nabídka proti zájmu ---------- */
.rd__dvojsloupce { display: flex; flex-direction: column; gap: 18px; }
.rd__dvojradek { display: grid; grid-template-columns: 56px 1fr auto; align-items: center; gap: 16px; }
.rd__dvojtyp { font-size: 15px; font-weight: 600; }
.rd__dvojpruhy { display: flex; flex-direction: column; gap: 5px; }
.rd__dvojpruh { position: relative; display: flex; align-items: center; justify-content: flex-end; min-width: 52px; height: 24px; padding: 0 9px; border-radius: 5px; color: #fff; font-size: 12px; animation: rd-siroky .6s ease both; }
.rd__dvojpruh.je-nabidka { background: #9c9184; }
.rd__dvojpruh.je-zajem { background: #1d7f57; }
@keyframes rd-siroky { from { transform: scaleX(0); transform-origin: left; } to { transform: scaleX(1); } }
.rd__dvojpozn { white-space: nowrap; font-size: 12.5px; }
@media (max-width: 700px) {
  .rd__dvojradek { grid-template-columns: 46px 1fr; }
  .rd__dvojpozn { grid-column: 2; }
}

/* ---------- výběr období ---------- */
.rd__vyber { min-height: 38px; padding: 0 34px 0 14px; border: 1px solid var(--linka); border-radius: 19px; background: #fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23344340' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat right 14px center; font-size: 14.5px; font-weight: 600; color: var(--ink); appearance: none; cursor: pointer; }
.rd__oknovlastni { display: inline-flex; align-items: center; gap: 8px; }
.rd__oknovlastni input { min-height: 38px; padding: 0 12px; border: 1px solid var(--linka); border-radius: 19px; background: #fff; font: inherit; font-size: 14px; color: var(--ink); }
.rd__zaskrt { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--tlumene); cursor: pointer; }
.rd__zaskrt input { width: 16px; height: 16px; accent-color: #344340; }

/* ---------- graf: srovnání, bublina, pata ---------- */
.rd__grafbublina.je-vlevo { transform: translateX(-100%); margin-left: -12px; }
.rd__bublinaradek { display: grid !important; grid-template-columns: 10px 1fr auto auto; align-items: center; gap: 4px 8px; }
.rd__bublinaradek em { font-style: normal; opacity: .82; }
.rd__bublinaradek u { grid-column: 2 / 5; text-decoration: none; font-size: 11.5px; opacity: .55; }
.rd__bublinaradek .rd__zmena { background: transparent; padding: 0; }
.rd__grafpata { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--linka-jemna); display: flex; flex-direction: column; gap: 8px; }
.rd__grafpata .rd__legenda li { gap: 8px; }
.rd__grafpata .rd__legenda b { font-size: 15px; color: var(--ink); }
.rd__grafpozn { margin: 0; max-width: 88ch; line-height: 1.55; }

/* ---------- pořadí v lokalitě ---------- */
.rd__medaile { display: flex; flex-direction: column; gap: 18px; }
.rd__medailehlava { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 18px; align-items: center; }
.rd__medailekruh { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
  width: 84px; height: 84px; border-radius: 50%; flex: 0 0 auto;
  background: radial-gradient(circle at 35% 30%, #F4F4F2, #C9CDCB 55%, #9AA19E);
  box-shadow: 0 10px 22px -10px rgba(52,67,64,.5), inset 0 -3px 0 rgba(0,0,0,.1); }
.rd__medailekruh::after { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 2px dashed var(--pisek-linka, #DCCFBF); }
.rd__medailekruh.je-misto1 { background: radial-gradient(circle at 35% 30%, #FBF0DC, #E6C27E 55%, #C79A56); }
.rd__medailekruh.je-misto3 { background: radial-gradient(circle at 35% 30%, #F4E3D3, #D5A87C 55%, #A97F54); }
.rd__medailekruh.je-misto4 { background: radial-gradient(circle at 35% 30%, #FAF8F5, #EDE7E0 55%, #DCCFBF); }
.rd__medailekruh b { font-size: 34px; line-height: 1; font-weight: 700; color: var(--ink); }
.rd__medailekruh small { margin-top: 2px; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: #4a5956; }
.rd__medailehlava h4 { font-size: clamp(19px, 2vw, 22px); font-weight: 500; line-height: 1.2; text-wrap: balance; }
.rd__medailehlava .rd__pod { margin-top: 6px; font-size: 13.5px; }
.rd__medailetrend { display: inline-flex; align-items: center; gap: 4px; height: 22px; margin-left: 6px; padding: 0 8px;
  border-radius: 999px; vertical-align: 2px; font-family: "Inter", sans-serif; font-weight: 600; font-size: 12px; }
.rd__medailetrend.je-nahoru { background: #E7F2EC; color: var(--zelena); }
.rd__medailetrend.je-dolu { background: #FBEAE4; color: #B4432C; }
.rd__stitekobdobi { display: flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 999px;
  background: var(--linka-jemna); font-size: 12.5px; color: #4a5956; white-space: nowrap; }

/* stupně vítězů */
.rd__stupne { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; align-items: end;
  height: 170px; padding-top: 6px; }
.rd__stupen { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 6px; height: 100%; }
.rd__stupen > .cislo { font-size: 15px; }
.rd__stupenblok { display: flex; align-items: flex-start; justify-content: center; width: 100%; padding-top: 10px;
  border-radius: 12px 12px 4px 4px; background: var(--linka-jemna);
  font-family: "Inter", sans-serif; font-weight: 700; font-size: 18px; color: var(--slabe);
  transition: height .8s cubic-bezier(.3,.7,.2,1); }
.rd__stupen small { min-height: 2.5em; font-size: 12.5px; line-height: 1.25; color: var(--tlumene); text-align: center; }
.rd__stupen.je-ja .rd__stupenblok { background: linear-gradient(180deg, #4A5D58, #344340); color: #fff;
  box-shadow: 0 14px 26px -14px rgba(52,67,64,.8); }
.rd__stupen.je-ja small { color: var(--ink); font-weight: 600; }

/* kolik chybí na první místo */
.rd__mezera { padding: 16px; border-radius: 16px; background: #FAF8F5; }
.rd__mezerahlava { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.rd__mezerahlava b { font-size: 15px; font-weight: 500; }
.rd__mezerahlava b .cislo { color: #8a6f52; }
.rd__mezerahlava small { font-size: 12.5px; color: var(--tlumene); }
.rd__mezerapruh { position: relative; height: 12px; margin: 14px 0 8px; border-radius: 6px; background: var(--linka-jemna); }
.rd__mezerapruh > span { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 6px;
  background: linear-gradient(90deg, #B9B2A8, var(--ink)); transition: width 1s cubic-bezier(.3,.7,.2,1); }
.rd__mezerapruh i { position: absolute; right: -2px; top: -5px; display: flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 2px var(--zlata);
  font-style: normal; font-size: 10px; font-weight: 700; color: #8a6f52; }
.rd__mezeraosa { display: flex; justify-content: space-between;
  font-family: "Inter", sans-serif; font-weight: 500; font-size: 12px; color: var(--slabe); }
.rd__dnypole { display: flex; gap: 6px; margin-top: 14px; }
.rd__dnypole span { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 5px;
  font-family: "Inter", sans-serif; font-weight: 500; font-size: 11px; color: var(--slabe); }
.rd__dnypole i { display: flex; align-items: center; justify-content: center; width: 100%; height: 26px; border-radius: 7px;
  background: #fff; box-shadow: inset 0 0 0 1.5px #DCCFBF; font-style: normal; font-size: 11.5px; font-weight: 600; color: #8a6f52; }
.rd__mezerapata { margin-top: 12px; font-size: 13px; color: #4a5956; }
.rd__mezerapata .rd__odkazvpravo { margin-left: 4px; }

/* ---------- podíl na zájmu ---------- */
.rd__podilviz { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 22px; align-items: center; margin-top: 4px; }
.rd__prstencpodil { position: relative; width: 170px; height: 170px; }
.rd__prstencpodil svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.rd__prstencpodil circle { fill: none; stroke-width: 18; }
.rd__prstenczbytek { stroke: #DCCFBF; stroke-dasharray: 3 5; }
.rd__prstencmuj { stroke: var(--zelena); stroke-linecap: round; transition: stroke-dasharray .8s cubic-bezier(.3,.7,.2,1); }
.rd__prstencstred { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center;
  justify-content: center; text-align: center; }
.rd__prstencstred b { font-family: "Inter", sans-serif; font-weight: 700; font-size: 34px; line-height: 1; letter-spacing: -.02em; }
.rd__prstencstred small { margin-top: 4px; font-size: 12px; color: var(--tlumene); }
.rd__rovnice { display: flex; flex-direction: column; gap: 10px; }
.rd__rovnice > div { display: flex; justify-content: space-between; align-items: baseline; gap: 10px;
  padding: 12px 14px; border-radius: 14px; background: #FAF8F5; }
.rd__rovnice small { font-size: 13px; color: #4a5956; }
.rd__rovnice .cislo { font-size: 20px; }
.rd__rovnice .je-zname { background: #E7F2EC; }
.rd__rovnice .je-zname .cislo { color: var(--zelena); }
.rd__rovnice .je-nezname { background: #fff; box-shadow: inset 0 0 0 1.5px #DCCFBF; }
.rd__rovnice .je-nezname .cislo { color: var(--slabe); letter-spacing: .1em; }
.rd__rovnice .je-vysledek { background: var(--ink); color: #fff; }
.rd__rovnice .je-vysledek small { color: rgba(255,255,255,.75); }
.rd__rovnice .je-vysledek .cislo { color: var(--zlata); }
.rd__podilnadpis { margin-top: 18px; font-size: clamp(18px, 1.9vw, 21px); font-weight: 500; line-height: 1.25; text-wrap: balance; }
.rd__podilpata { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 18px; }
.rd__podilpata small { font-size: 12.5px; color: var(--tlumene); }
.rd__zameckastitek { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 999px;
  background: #E8EEF3; color: #3E5E78; font-size: 12px; font-weight: 500; white-space: nowrap; }

@media (max-width: 480px) {
  .rd__podilviz { grid-template-columns: 1fr; justify-items: center; }
  .rd__rovnice { width: 100%; }
  .rd__medailehlava { grid-template-columns: 1fr; }
}


/* ---------- dispozice ---------- */
.rd__dispozicepopis { margin-top: 22px; }
.rd__dispozicetabulka { margin-top: 10px; }

/* ---------- doplňky ---------- */
.rd__doplnkypas { background: linear-gradient(180deg, #faf7f3 0%, #f3ede5 100%); border: 1px solid #e6dccd; }
.rd__doplnkytri { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.rd__doplnekmaly { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border: 1px solid var(--linka); border-radius: 14px; background: #fff; text-align: left; transition: border-color .15s, transform .15s; }
.rd__doplnekmaly:hover { border-color: var(--zlata); transform: translateY(-1px); }
.rd__doplnekmaly b { display: block; font-size: 14.5px; font-weight: 600; }
.rd__doplnekmaly small { display: block; margin-top: 3px; font-size: 12.5px; line-height: 1.45; color: var(--tlumene); }
.rd__doplnekikona { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; flex: none; border-radius: 9px; background: var(--pisek-2); color: var(--ink); }
.rd__doplnky { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.rd__doplnek { display: flex; flex-direction: column; border-radius: var(--r-velky); background: #fff; box-shadow: var(--stin); overflow: hidden; border: 2px solid transparent; }
.rd__doplnek.je-zajem { border-color: var(--zlata); }
.rd__doplnektelo { display: flex; flex-direction: column; gap: 10px; padding: 22px 24px 24px; flex: 1; }
.rd__doplnektelo h3 { font-size: 19px; font-weight: 600; }
.rd__doplnektelo .rd__stitek { align-self: flex-start; }
.rd__doplnekkratce { font-size: 15px; line-height: 1.55; }
.rd__doplnekseznam { margin-top: 4px; }
.rd__doplnekseznam b { font-weight: 500; font-size: 14px; }
.rd__doplnekpata { display: flex; flex-direction: column; gap: 8px; margin-top: auto; padding-top: 12px; }
.rd__doplnekpata .rd__cta { align-self: flex-start; }

@media (max-width: 900px) {
  .rd__doplnky { grid-template-columns: 1fr; }
  .rd__doplnkytri { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .rd__oknoradek { flex-wrap: wrap; }
  .rd__vyber { width: 100%; }
  .rd__oknovlastni { width: 100%; }
  .rd__oknovlastni input { flex: 1; min-width: 0; }
  .rd__medailehlava { flex-direction: column; align-items: flex-start; gap: 14px; }
  .rd__medailekruh { width: 76px; height: 76px; }
  .rd__medailekruh b { font-size: 32px; }
  .rd__grafbublina { font-size: 12px; }
  .rd__bublinaradek u { display: none; }
  .rd__doplnektelo { padding: 18px 18px 20px; }
}

/* ---------- zamčená obrazovka: ukázka a hard sell ---------- */
.rd__zamek { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 32px; align-items: start; }
.rd__ukazka { display: flex; flex-direction: column; gap: 10px; }
.rd__ukazkaplocha { position: relative; padding: 14px; border-radius: 14px; background: var(--pisek-2); overflow: hidden; }
.rd__ukazkagraf { display: block; width: 100%; height: auto; filter: blur(3.4px); opacity: .85; }
.rd__ukazkastitek { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 999px; background: rgba(255,255,255,.94); color: var(--ink); font-size: 12.5px; font-weight: 600; box-shadow: 0 6px 18px rgba(52,67,64,.18); }
.rd__zamekobsah { display: flex; flex-direction: column; gap: 14px; }
.rd__zamekobsah ul { display: flex; flex-direction: column; gap: 10px; list-style: none; }
.rd__zamekobsah li { display: flex; align-items: flex-start; gap: 10px; font-size: 15px; line-height: 1.5; }
.rd__ztrata { padding: 14px 16px; border-left: 3px solid #b4432c; border-radius: 0 8px 8px 0; background: #fbf4f1; font-size: 14.5px; line-height: 1.6; }
.rd__zamekobsah .rd__cta { align-self: flex-start; }
@media (max-width: 860px) {
  .rd__zamek { grid-template-columns: 1fr; gap: 22px; }
}

/* ---------- opravy zarovnání a viditelnosti ---------- */
.rd__oknoradek { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.rd__oknoradek > label { margin: 0; line-height: 1; }
.rd__oknoradek.je-vgrafu { margin: 0; }
.rd__zaskrt.je-vypnute { opacity: .45; cursor: default; }
/* tlačítko na tmavém verdiktu musí být vidět: rámeček a bílý text, ne bílá na bílé */
/* Tmavý podklad: tlačítko vedle hlavní akce má bílý rámeček a bílý text, nikdy bílou výplň.
   Platí pro verdikt i pro duel, jedno pravidlo pro obě místa. */
.rd__verdikt .rd__tlacitko, .rd__duel .rd__tlacitko { background: transparent; border: 1px solid rgba(255,255,255,.45); color: #fff; }
.rd__verdikt .rd__tlacitko:hover, .rd__duel .rd__tlacitko:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.7); }

/* ---------- reálné snímky u doplňků ---------- */
.rd__snimek { display: block; background: var(--pisek-2); }
.rd__snimek img { display: block; width: 100%; height: 190px; object-fit: cover; object-position: top center; }
.rd__snimekpopis { display: block; padding: 8px 14px; font-size: 12px; line-height: 1.45; color: var(--tlumene); background: #fff; border-bottom: 1px solid var(--linka-jemna); }

/* ---------- časovka vyhodnocení doplňku ---------- */

/* ---------- zamčený podíl na zájmu ---------- */
.rd__rozostreno { filter: blur(3.6px); opacity: .9; pointer-events: none; user-select: none; }

/* ---------- vy proti konkurenci ---------- */
.rd__tempopruhy { display: flex; flex-direction: column; gap: 10px; }
.rd__tempopruh { display: grid; grid-template-columns: minmax(96px, 168px) minmax(80px, 1fr) 40px minmax(0, 178px);
  align-items: center; gap: 14px; font-size: 14px; }
.rd__tempopozn { text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rd__tempojmeno { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--tlumene); }
.rd__tempopruh.je-ja .rd__tempojmeno { color: var(--ink); font-weight: 600; }
.rd__tempoosa { height: 12px; border-radius: 6px; background: var(--pisek-2); overflow: hidden; }
.rd__tempoosa i { display: block; height: 100%; border-radius: 6px; background: #d8d0c5; animation: rd-siroky .6s ease both; transform-origin: left; }
.rd__tempopruh.je-ja .rd__tempoosa i { background: #1d7f57; }
.rd__tempopruh.je-vybrany .rd__tempoosa i { background: #c79a62; }
.rd__tempocislo { text-align: right; font-weight: 600; }
.rd__tempoosa i.je-klid { background: #9fbdb0; }
.rd__tempoosa i.je-tlak { background: #c9765c; }
.rd__tempopruh.je-ja .rd__tempoosa i.je-klid { background: #1d7f57; }
.rd__tempopruh.je-ja .rd__tempoosa i.je-tlak { background: #b4432c; }
.rd__stavdat { display: flex; align-items: flex-start; gap: 8px; margin: -6px 0 18px; padding: 10px 14px; border-radius: 10px;
  background: var(--pisek); border: 1px solid var(--linka-jemna); font-size: 12.5px; line-height: 1.55; color: var(--tlumene); }
.rd__stavdat svg { flex: none; margin-top: 3px; color: #1d7f57; }
.rd__stavdat.je-pozor { background: #fbf1ec; border-color: #e8c8ba; color: #8a3a24; }
.rd__stavdat.je-pozor svg { color: #b4432c; }
.rd__podveta--mensi { font-size: 13.5px; opacity: .82; margin-top: 10px; }
.rd__tempopozn { white-space: nowrap; }
@media (max-width: 760px) {
  /* Na mobilu tři řádky: jméno a číslo vedle sebe, pod nimi pruh a pak poznámka přes celou šířku.
     Dřív měla poznámka nowrap ve 46px sloupci, takže karta přetékala o 140 px. */
  .rd__tempopruh { grid-template-columns: 1fr auto; }
  .rd__tempojmeno { grid-column: 1; grid-row: 1; }
  .rd__tempocislo { grid-column: 2; grid-row: 1; }
  .rd__tempoosa { grid-column: 1 / 3; grid-row: 2; }
  .rd__tempopozn { grid-column: 1 / 3; grid-row: 3; text-align: left; white-space: normal; }
}

/* ---------- demo lišta na mobilu: skupiny se smí zlomit, nic netrčí přes okraj ---------- */
@media (max-width: 700px) {
  .rd__demolista { padding: 9px 14px; gap: 8px 14px; }
  .rd__demoskupina { flex-wrap: wrap; max-width: 100%; }
  .rd__demotlacitko { flex: 0 1 auto; max-width: 100%; white-space: normal; text-align: left; line-height: 1.25; padding: 5px 10px; }
  .rd__demotlacitko--konec { margin-left: 0; }
}

/* ---------- mobil: kostra, lišta a graf ---------- */
@media (max-width: 760px) {
  /* demo lišta se láme, nic netrčí přes okraj */
  .rd__demolista { padding: 9px 14px; gap: 8px 12px; }
  .rd__demoskupina { flex-wrap: wrap; max-width: 100%; }
  .rd__demotlacitko { flex: 0 1 auto; max-width: 100%; white-space: normal; text-align: left; line-height: 1.25; padding: 5px 10px; }
  .rd__demotlacitko--konec { margin-left: 0; }
  /* Lišta se sbalí do jednoho řádku; rozbalí se až na klepnutí, jinak zabírala třetinu obrazovky. */
  .rd .rd__demorozbal { display: inline-flex; }
  .rd__demopopis { display: none; }
  .rd__demolista .rd__demoskupina { display: none; }
  .rd__demolista.je-rozbalena { align-items: flex-start; }
  .rd__demolista.je-rozbalena .rd__demoskupina { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; width: 100%; }
  .rd__demolista.je-rozbalena .rd__prepinac { width: 100%; }
  .rd__demolista.je-rozbalena .rd__prepinac button { flex: 1; min-width: 0; padding: 0 8px; font-size: 12px; }
  /* boční menu je vodorovný pás s posuvem, obsah má celou šířku */
  .rd__obsah { padding: 18px 14px 44px; gap: 18px; }
  .rd__karta { border-radius: 16px; }
  .rd__kartatelo { padding: 16px 16px 18px; }
  .rd__kartahlava { padding: 16px 16px 0; }
  /* graf na celou šířku karty a dost vysoký, aby se dal číst a trefit prstem */
  .rd__grafplocha { margin: 0 -16px; width: calc(100% + 32px); }
  .rd__graf { width: 100%; height: 230px; }
  .rd__grafovladani { gap: 10px; }
  .rd__grafovladani > * { width: 100%; }
  .rd__grafbublina { left: 50% !important; transform: translateX(-50%) !important; max-width: calc(100vw - 40px); white-space: normal; }
  .rd__grafbublina.je-vlevo { transform: translateX(-50%) !important; margin-left: 0; }
}

/* ---------- menu: vidět, co je Resimo Ads a co Data Studio ---------- */

/* Popisek v pruhu se nesmí oříznout: u krátkého pruhu visí číslo vedle něj. */
.rd__dvojpruh b { position: absolute; right: 9px; white-space: nowrap; }
.rd__dvojpruh.je-uzky b { right: auto; left: calc(100% + 8px); color: var(--ink); }

/* ==========================================================================
   Levé menu podle designového handoffu (design_handoff_sidebar_nav).
   Hodnoty jsou převzaté ze Sidebar.html, ne odhadnuté.
   ========================================================================== */
.rd__app { display: flex; min-height: 100vh; }
.rd__bok { width: 286px; flex: none; background: #344340; color: #fff; display: flex; flex-direction: column; position: sticky; top: var(--demolista, 0px); height: calc(100vh - var(--demolista, 0px)); }
.rd__znacka { padding: 26px 24px 20px; display: flex; align-items: baseline; gap: 8px; }
.rd__znacka img { height: 24px; filter: brightness(0) invert(1); }
.rd__znacka span { font-size: 13px; color: rgba(255,255,255,.62); }
.rd__nav { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; padding: 4px 14px 18px; display: flex; flex-direction: column; gap: 24px; scrollbar-width: none; }
.rd__nav::-webkit-scrollbar { width: 0; }
.rd__skupina { display: flex; flex-direction: column; gap: 8px; }
.rd__skupinahlava { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; padding: 0 10px; }
.rd__skupinanazev { font-size: 14px; font-weight: 600; color: rgba(255,255,255,.95); }
.rd__skupinapod { font-size: 12px; color: rgba(255,255,255,.6); }
.rd__nemate { flex: none; display: flex; align-items: center; gap: 5px; height: 22px; padding: 0 8px; border-radius: 999px; border: 1px solid rgba(255,255,255,.28); font-size: 11.5px; color: rgba(255,255,255,.85); margin-top: 1px; }
.rd__rail { display: flex; flex-direction: column; gap: 2px; margin-left: 10px; padding-left: 8px; border-left: 2px solid var(--rail); }
.rd .rd__polozka { position: relative; display: flex; align-items: center; gap: 11px; height: 38px; padding: 0 10px; border: 0; border-radius: 8px; background: transparent; cursor: pointer; color: rgba(255,255,255,.84); font-size: 15px; font-weight: 400; text-align: left; user-select: none; transition: background-color .15s; }
.rd .rd__polozka:hover { background: rgba(255,255,255,.09); }
.rd .rd__polozka svg { flex: none; opacity: .8; }
.rd__seg { position: absolute; left: -10px; top: 7px; bottom: 7px; width: 2px; border-radius: 2px; background: transparent; }
.rd .rd__polozka.je-aktivni { background: rgba(255,255,255,.13); color: #fff; font-weight: 600; }
.rd .rd__polozka.je-aktivni svg { opacity: 1; }
.rd .rd__polozka.je-aktivni .rd__seg { background: var(--on); }
.rd__skupina.je-zamcena .rd__polozka { color: rgba(255,255,255,.58); }
.rd__skupina.je-zamcena .rd__polozka svg { opacity: .6; }
.rd__lbl { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rd__odznak { flex: none; min-width: 22px; height: 20px; padding: 0 6px; box-sizing: border-box; border-radius: 999px; background: #fff; color: #344340; font: 600 12px/20px Inter, sans-serif; text-align: center; }
.rd .rd__ctamenu { display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 10px; border: 0; background: transparent; font-size: 13.5px; color: rgba(255,255,255,.88); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(255,255,255,.35); }
.rd__ctamenu:hover { color: #fff; }
.rd__bokpata { padding: 10px 14px 16px; border-top: 1px solid rgba(255,255,255,.12); display: flex; flex-direction: column; gap: 2px; }
.rd__bokpata .rd__polozka { height: auto; min-height: 38px; padding: 6px 10px; box-sizing: border-box; align-items: flex-start; }
.rd__bokpata .rd__polozka svg { margin-top: 3px; }
.rd__uzivatel { display: flex; align-items: center; gap: 11px; padding: 12px 10px 0; margin-top: 6px; border-top: 1px solid rgba(255,255,255,.12); }
.rd__avatar { flex: none; width: 30px; height: 30px; border-radius: 50%; background: rgba(255,255,255,.14); display: flex; align-items: center; justify-content: center; font: 600 13px Inter, sans-serif; color: #fff; }
.rd__uzivateltext { flex: 1; min-width: 0; display: block; }
.rd__uzivateltext b { display: block; font-size: 14px; font-weight: 600; }
.rd__uzivateltext small { display: block; font-size: 12px; color: rgba(255,255,255,.6); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rd__uzivatelsipka { opacity: .6; }

/* mobil pod 900 px: horní lišta s pilulkami místo bočního menu */
.rd__mlista { display: none; background: #344340; color: #fff; position: sticky; top: 0; z-index: 5; }
.rd__mlistahorni { height: 58px; padding: 0 10px 0 16px; display: flex; align-items: center; justify-content: space-between; }
.rd__mlistahorni .rd__znacka { padding: 0; gap: 7px; }
.rd__mlistahorni .rd__znacka img { height: 20px; }
.rd__mlistahorni .rd__znacka span { font-size: 12px; }
.rd .rd__mavatar { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border: 0; background: transparent; cursor: pointer; margin-right: 7px; }
/* Mobilní menu: rozbalovací seznam místo vodorovného pásu pilulek. V pásu byla vidět
   první položka a zbytek se musel hledat posouváním, což vypadalo, že aplikace má
   jedinou obrazovku. */
.rd .rd__mprepinac { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  width: calc(100% - 32px); margin: 0 16px 12px; height: 46px; padding: 0 16px; border: 0; border-radius: 23px;
  background: rgba(255,255,255,.12); color: #fff; font: inherit; font-size: 15px; font-weight: 500; cursor: pointer; }
.rd .rd__mprepinac svg { flex: none; opacity: .7; transition: transform .2s ease; }
.rd .rd__mprepinac.je-otevreny { background: #fff; color: var(--ink); }
.rd .rd__mprepinac.je-otevreny svg { transform: rotate(180deg); }
.rd__mmenu { padding: 2px 16px 16px; display: flex; flex-direction: column; gap: 14px;
  max-height: 68vh; overflow-y: auto; }
.rd__mskupina { display: flex; flex-direction: column; gap: 2px; }
.rd__mskupinanazev { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; padding: 0 4px;
  font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; color: rgba(255,255,255,.5); }
.rd__mzamek { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 999px;
  background: rgba(255,255,255,.12); font-size: 10.5px; letter-spacing: 0; text-transform: none; color: rgba(255,255,255,.75); }
.rd .rd__mpolozka { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 44px; padding: 0 14px;
  border: 0; border-radius: 12px; background: transparent; color: #fff; font: inherit; font-size: 15px;
  text-align: left; cursor: pointer; }
.rd .rd__mpolozka i { flex: none; width: 6px; height: 6px; border-radius: 50%; }
.rd .rd__mpolozka.je-aktivni { background: #fff; color: var(--ink); font-weight: 600; }
.rd .rd__mpolozka.je-zamcena { color: rgba(255,255,255,.55); }
@media (max-width: 899px) {
  .rd__app { flex-direction: column; }
  .rd__bok { display: none; }
  .rd__mlista { display: block; }
}

/* ==========================================================================
   Zamčená obrazovka jako landing. Hodnoty z handoffu „Landing page – zamčený
   produkt“, nepřepisovat od oka. Header a patička se uvnitř aplikace vynechávají,
   jak zadání říká; zbytek je 1:1.
   ========================================================================== */
.rd__lp { --lp-paper: #FAF8F5; --lp-sand: #F1EAE1; --lp-sandline: #DCCFBF; --lp-bronz: #A08A6E; --lp-bronzink: #8a6f52;
  display: flex; flex-direction: column; gap: 20px; }

.rd__lphero { position: relative; overflow: hidden; border-radius: 22px; color: #fff; text-align: center;
  background: radial-gradient(120% 80% at 85% 0%, #4A5D58 0%, #344340 45%, #2C3936 100%);
  padding: clamp(32px, 5vw, 64px) clamp(20px, 5vw, 64px) 0;
  display: flex; flex-direction: column; align-items: center; gap: 18px;
  box-shadow: 0 18px 40px -20px rgba(52,67,64,.5); }
.rd__lpstitky { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: center; }
.rd__lpzamek { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 12px; border-radius: 999px;
  background: rgba(255,255,255,.1); font-size: 12.5px; }
.rd__lpkicker { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--zlata); }
.rd__lphero h1 { margin: 0; font-size: clamp(32px, 4.4vw, 56px); line-height: 1.06; font-weight: 400; letter-spacing: -.015em;
  max-width: 860px; text-wrap: balance; color: #fff; }
.rd__lplead { margin: 0; font-size: clamp(16px, 1.4vw, 18px); line-height: 1.6; color: rgba(255,255,255,.8); max-width: 620px; text-wrap: pretty; }
.rd__lpakce { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin-top: 6px; }
.rd .rd__lpghost { display: inline-flex; align-items: center; gap: 8px; height: 50px; padding: 0 26px; border-radius: 999px;
  font-size: 16px; font-weight: 500; background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.35); cursor: pointer; }
.rd .rd__lpghost:hover { background: rgba(255,255,255,.08); }
.rd__lphero .rd__cta, .rd__lpdukaz .rd__cta { height: 50px; padding: 0 26px; font-size: 16px; border-radius: 999px; }
.rd__lpcena { margin: 0; font-size: 13.5px; color: rgba(255,255,255,.62); max-width: 620px; }

.rd__lpnahled { position: relative; width: 100%; max-width: 920px; margin-top: clamp(24px, 3.5vw, 44px);
  height: clamp(240px, 28vw, 320px); background: var(--lp-paper); color: var(--ink); border-radius: 18px 18px 0 0;
  box-shadow: 0 -20px 60px -20px rgba(0,0,0,.5); overflow: hidden; text-align: left; }
.rd__lpnahledlista { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; border-bottom: 1px solid #EFE9E2; }
.rd__lpnahledtitulek { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 500; }
.rd__lpnahledtitulek i { width: 9px; height: 9px; border-radius: 50%; background: #E3D9CC; margin-right: -5px; }
.rd__lpnahledtitulek i:nth-of-type(3) { margin-right: 5px; }
.rd__lpznacka { height: 24px; padding: 0 10px; border-radius: 999px; background: var(--lp-sand); font-size: 12px; color: #4a5956;
  display: flex; align-items: center; white-space: nowrap; }
.rd__lpkpi { padding: 16px 20px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.rd__lpkpibox { background: #fff; border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 2px;
  box-shadow: 0 1px 2px rgba(52,67,64,.05); min-width: 0; }
.rd__lpkpibox small { font-size: 12px; color: var(--tlumene); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rd__lpkpibox b { font-size: clamp(17px, 2vw, 22px); letter-spacing: -.01em; }
.rd__lpkpibox b.je-riziko { color: #B4432C; }
.rd__lpgraf { margin: 0 20px; height: 150px; background: #fff; border-radius: 12px; overflow: hidden; }
.rd__lpgraf svg { display: block; width: 100%; height: 100%; }
.rd__lpstin { position: absolute; left: 0; right: 0; bottom: 0; height: 96px; pointer-events: none;
  background: linear-gradient(180deg, rgba(250,248,245,0), var(--lp-paper) 85%); }

.rd__lpco { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: clamp(24px, 4vw, 56px);
  padding: clamp(24px, 3.5vw, 44px); }
.rd__lpcoleva { display: flex; flex-direction: column; gap: 14px; }
.rd__lpco h2 { margin: 0; font-size: clamp(24px, 2.4vw, 30px); line-height: 1.15; font-weight: 500; letter-spacing: -.01em; text-wrap: balance; }
.rd__lplead2 { margin: 0; font-size: 16px; line-height: 1.6; color: var(--tlumene); text-wrap: pretty; }
.rd__lpztrata { margin: auto 0 0; padding-top: 18px; border-top: 1px solid var(--linka-jemna); font-size: 18px; line-height: 1.5; text-wrap: pretty; }
.rd__lpztrata b { color: #B4432C; font-weight: 500; }
.rd__lpbody { list-style: none; margin: 0; padding: 0; }
.rd__lpbody li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: baseline;
  padding: 20px 0; border-top: 1px solid var(--linka-jemna); font-size: 18px; line-height: 1.45; text-wrap: pretty; }
.rd__lpbody li:first-child { border-top: 0; padding-top: 4px; }
.rd__lpbody .cislo { font-size: 14px; color: var(--lp-bronz); }

.rd__lpdukaz { background: var(--lp-sand); border-radius: 18px; padding: clamp(28px, 4.5vw, 56px);
  display: flex; flex-direction: column; gap: clamp(28px, 3.5vw, 44px); }
.rd__lpdukazhlava { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; flex-wrap: wrap; }
.rd__lpdukaztext { display: flex; flex-direction: column; gap: 12px; max-width: 640px; }
.rd__lpdukaztext .rd__lpkicker { color: var(--lp-bronzink); margin: 0; }
.rd__lpdukaztext h2 { margin: 0; font-size: clamp(28px, 3.4vw, 42px); line-height: 1.08; font-weight: 500; letter-spacing: -.01em; text-wrap: balance; }
.rd__lpdukaztext .rd__lplead2 { color: #4a5956; }
.rd__lpdukazakce { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.rd__lpdukazakce small { font-size: 13.5px; color: #4a5956; max-width: 340px; line-height: 1.5; }
.rd .rd__lptmave { display: inline-flex; align-items: center; gap: 8px; height: 50px; padding: 0 26px; border-radius: 999px;
  font-size: 16px; font-weight: 500; background: var(--ink); color: #fff; border: 0; cursor: pointer; }
.rd .rd__lptmave:hover { background: #2a3634; }
.rd__lpcisla { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: clamp(16px, 2.5vw, 32px);
  padding-top: clamp(24px, 3vw, 32px); border-top: 1px solid var(--lp-sandline); }
.rd__lpcislo { display: flex; flex-direction: column; gap: 8px; }
.rd__lpcislo b { font-size: clamp(34px, 4vw, 52px); line-height: 1; letter-spacing: -.03em; color: var(--ink); }
.rd__lpcislo span { font-size: 14px; line-height: 1.4; color: var(--tlumene); }

/* Prodejní blok Resimo Ads: dosah katalogu a čtyři důvody. Čísla drží KATALOG v data.js. */
.rd__lpcislablok { display: flex; flex-direction: column; gap: 18px;
  padding-top: clamp(24px, 3vw, 32px); border-top: 1px solid var(--lp-sandline); }
.rd__lpcislablok .rd__lpcisla { padding-top: 0; border-top: 0; }
.rd__lpcislanadpis { margin: 0; font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--lp-bronzink); }
.rd__lpproc { list-style: none; margin: 0; padding: clamp(24px, 3vw, 32px) 0 0;
  border-top: 1px solid var(--lp-sandline);
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: clamp(20px, 2.6vw, 32px); }
.rd__lpproc li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; align-items: start; }
.rd__lpproc .cislo { font-size: 13px; color: var(--lp-bronz); padding-top: 4px; }
.rd__lpproc li > span:last-child { display: flex; flex-direction: column; gap: 6px;
  font-size: 15px; line-height: 1.5; color: #4a5956; text-wrap: pretty; }
.rd__lpproc b { font-size: 16.5px; font-weight: 500; line-height: 1.3; color: var(--ink); }

@media (max-width: 640px) {
  .rd__lpkpi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rd__lpkpibox:nth-child(3) { display: none; }
  .rd__lpakce { flex-direction: column; align-items: stretch; width: 100%; }
  .rd__lphero .rd__cta, .rd .rd__lpghost { justify-content: center; }
  .rd__lpbody li { font-size: 16px; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; }
  .rd__lpproc { grid-template-columns: 1fr; }
  .rd__lpztrata { font-size: 16px; }
}

/* Rozcestník na konci shrnující obrazovky: kam jít pro podrobnosti. */
.rd__kamdal { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 12px; }
.rd__kamdalkarta { display: flex; flex-direction: column; gap: 6px; padding: 18px 20px; border-radius: 14px; text-align: left;
  border: 1px solid var(--linka); background: var(--pisek); color: var(--ink); cursor: pointer;
  transition: border-color .15s ease, background .15s ease, transform .15s ease; }
.rd__kamdalkarta:hover { border-color: var(--zlata); background: #fff; transform: translateY(-2px); }
.rd__kamdalkarta b { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 16px; font-weight: 600; }
.rd__kamdalkarta span { font-size: 13.5px; line-height: 1.5; color: var(--tlumene); }
.rd__kamdalkarta small { margin-top: 4px; font-size: 12.5px; color: var(--slabe); }

/* ==========================================================================
   Data Studio: portfolio a konkurence, časová osa událostí
   ========================================================================== */
.rd__portfolio tr.je-moje { background: rgba(94,170,134,.07); }
.rd__portfolio tr.je-moje td:first-child { box-shadow: inset 3px 0 0 #5EAA86; }
.rd__portfolio .rd__stitek { margin-left: 8px; vertical-align: 2px; }
.rd__portfoliopruh { display: block; height: 5px; margin-bottom: 4px; border-radius: 3px; background: var(--pisek-2); overflow: hidden; }
.rd__portfoliopruh i { display: block; height: 100%; border-radius: 3px; background: #5EAA86; }
.rd__vic { color: #b4432c; font-weight: 600; }
.rd__min { color: #1d7f57; font-weight: 600; }
.rd .rd__radit { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: none; cursor: pointer;
  font-size: inherit; font-weight: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; }
.rd .rd__radit svg { opacity: .3; transition: opacity .15s ease; }
.rd .rd__radit:hover svg { opacity: .6; }
.rd .rd__radit.je-aktivni { color: var(--ink); }
.rd .rd__radit.je-aktivni svg { opacity: 1; color: var(--zlata); }

.rd__dvojtempo { display: grid; grid-template-columns: minmax(58px, auto) 1fr minmax(0, auto) minmax(0, auto);
  align-items: center; gap: 4px 14px; font-size: 14px; }
.rd__dvojosa { display: flex; flex-direction: column; gap: 3px; }
.rd__dvojosa i { display: block; height: 9px; border-radius: 5px; animation: rd-siroky .6s ease both; transform-origin: left; }
.rd__dvojosa i.je-ja { background: #1d7f57; }
.rd__dvojosa i.je-oni { background: #c79a62; }
.rd__dvojcisla { white-space: nowrap; font-size: 13px; color: var(--tlumene); }
.rd__dvojcisla b { color: var(--ink); }
.rd__dvojpozn { white-space: nowrap; }

.rd__osaudalosti { display: flex; flex-direction: column; }
.rd__den { border-top: 1px solid var(--linka-jemna); }
.rd__den:first-child { border-top: 0; }
.rd__denhlava { display: flex; align-items: baseline; gap: 10px; padding: 16px 22px 8px; }
.rd__denhlava b { font-size: 15px; }
.rd__denhlava em { margin-left: auto; font-style: normal; font-size: 12.5px; color: var(--slabe); }
.rd__udalosti { list-style: none; margin: 0; padding: 0 22px 14px; display: flex; flex-direction: column; gap: 2px; }
.rd__udalosti li { display: grid; grid-template-columns: 26px minmax(0, 1fr) minmax(0, auto); align-items: center; gap: 12px;
  padding: 9px 12px; margin: 0 -12px; border-radius: 10px; }
.rd__udalosti li:hover { background: var(--pisek); }
.rd__udalosti li.je-moje { background: rgba(94,170,134,.08); }
.rd__udalostznak { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; color: #fff; }
.rd__udalostznak.je-cena { background: #b4432c; }
.rd__udalostznak.je-stav { background: #1d7f57; }
.rd__udalostznak.je-nove { background: #8a7c6a; }
.rd__udalosttelo { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.rd__udalosttelo > b { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; }
.rd__udalosttelo > span { font-size: 13.5px; color: var(--tlumene); }
.rd__udalosttelo b.cislo { color: var(--ink); }
.rd__udalostpravy { font-family: Inter, system-ui, sans-serif; font-size: 13.5px; text-align: right; white-space: nowrap; }

@media (max-width: 700px) {
  .rd__dvojtempo { grid-template-columns: minmax(46px, auto) 1fr; }
  .rd__dvojcisla, .rd__dvojpozn { grid-column: 2; text-align: left; }
  .rd__udalosti { padding: 0 14px 12px; }
  .rd__udalosti li { grid-template-columns: 24px minmax(0, 1fr); gap: 4px 10px; }
  .rd__udalostpravy { grid-column: 2; text-align: left; }
  .rd__denhlava { padding: 14px 14px 6px; }
}

/* ==========================================================================
   Výběr sledovaných konkurentů a balíčky rozsahu
   ========================================================================== */
.rd__vyberkonk { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 258px), 1fr)); gap: 10px; }
.rd .rd__konkchip { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px; text-align: left;
  border: 1.5px solid var(--linka); background: #fff; color: var(--ink); cursor: pointer;
  transition: border-color .15s ease, background .15s ease, opacity .15s ease; }
.rd .rd__konkchip:hover { border-color: #b9b0a4; }
.rd .rd__konkchip.je-zapnuty { border-color: #5EAA86; background: rgba(94,170,134,.08); }
.rd .rd__konkchip.je-plno { opacity: .5; }
.rd__konkznak { display: grid; place-items: center; width: 26px; height: 26px; flex: none; border-radius: 50%;
  border: 1.5px solid var(--linka); color: var(--slabe); font-size: 15px; line-height: 1; }
.rd__konkchip.je-zapnuty .rd__konkznak { background: #5EAA86; border-color: #5EAA86; color: #fff; }
.rd__konktext { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.rd__konktext b { font-size: 14.5px; font-weight: 600; }
.rd__konktext small { font-size: 12.5px; color: var(--tlumene); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rd__vyberpata { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--linka-jemna); }
.rd__vyberpata p { max-width: 62ch; margin: 0; }

/* Balíčky sledování konkurence. Hodnoty z handoffu „balicky_sledovani", nepřepisovat od oka. */
.rd__balhlava, .rd__balicky, .rd__proctri {
  --bl-ink: #344340; --bl-ink2: #4a5956; --bl-muted: #6b7472; --bl-muted2: #8a918f;
  --bl-papir: #FAF8F5; --bl-pisekl: #DCCFBF; --bl-linka: #F1EDE9;
  --bl-zlata: #D4A574; --bl-bronz: #8a6f52; --bl-zelena: #1D7F57; --bl-zelena-t: #E7F2EC;
  --bl-stin: 0 1px 2px rgba(52,67,64,.05), 0 12px 30px -16px rgba(52,67,64,.14); }

.rd__balhlava { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 32px; flex-wrap: wrap; }
.rd__balhlava h2 { margin: 8px 0 0; font-size: clamp(26px, 3vw, 38px); line-height: 1.1; font-weight: 500;
  letter-spacing: -.01em; text-wrap: balance; max-width: 640px; }
.rd__balhlava > p { margin: 0; font-size: 14px; color: var(--bl-muted); max-width: 340px; line-height: 1.5; }
.rd__balhlava .rd__kicker { color: var(--bl-bronz); }

.rd__balicky { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; align-items: stretch; padding-top: 14px; }
.rd__balicek { position: relative; display: flex; flex-direction: column; gap: 18px;
  background: #fff; border-radius: 20px; padding: 26px 22px 22px; box-shadow: var(--bl-stin); }
.rd__balnazev { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--bl-muted); }
.rd__balvelke { display: flex; align-items: baseline; gap: 8px; margin-top: 6px; }
.rd__balvelke b { font-size: clamp(40px, 4vw, 54px); line-height: .95; letter-spacing: -.02em; font-weight: 600; }
.rd__balvelke span { font-size: 15px; color: var(--bl-ink2); }
.rd__balkomu { font-size: 14.5px; line-height: 1.5; color: var(--bl-ink2); min-height: 3em; text-wrap: pretty; }

/* Škála: 20 dílků, vyplněno prvních --n */
.rd__skala { --n: 3; --on: var(--bl-ink); --off: #E9E3DC; position: relative; height: 10px;
  background: repeating-linear-gradient(90deg, var(--off) 0 calc(5% - 3px), transparent calc(5% - 3px) 5%); }
.rd__skala::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: calc(var(--n) / 20 * 100%);
  background: repeating-linear-gradient(90deg, var(--on) 0 calc(100% / var(--n) - 3px), transparent calc(100% / var(--n) - 3px) calc(100% / var(--n))); }
.rd__skalapopis { display: flex; justify-content: space-between; margin-top: 7px;
  font: 500 11.5px "Inter", system-ui, sans-serif; color: var(--bl-muted2); }

.rd__balcena { display: flex; flex-direction: column; gap: 2px; padding-top: 16px; border-top: 1px solid var(--bl-linka); }
.rd__balcena b { font-size: 24px; font-weight: 600; letter-spacing: -.01em; }
.rd__balcena small { font-size: 12.5px; color: var(--bl-muted); }

.rd__balnavic { display: block; margin-top: 2px; font-size: 11.5px; opacity: .75; }
.rd__proclead { max-width: 74ch; margin-top: 8px; font-size: 14.5px; line-height: 1.6; color: var(--tlumene); }
.rd__balseznam { display: flex; flex-direction: column; gap: 11px; flex: 1; }
.rd__balseznam li { display: flex; gap: 10px; font-size: 14.5px; line-height: 1.4; }
.rd__balseznam li svg { flex: none; margin-top: 1px; color: var(--bl-zelena); }
.rd__balseznam li.je-zdedene { color: var(--bl-muted); font-size: 13.5px; }

.rd .rd__balicek .rd__cta, .rd .rd__balicek .rd__tlacitkotmave, .rd .rd__balmate {
  width: 100%; justify-content: center; height: 48px; font-size: 15.5px; }
.rd__balmate { display: inline-flex; align-items: center; gap: 8px; border-radius: 999px;
  background: var(--bl-zelena-t); color: var(--bl-zelena); font-weight: 500; }

.rd__balstitek { position: absolute; top: -12px; left: 22px; height: 24px; padding: 0 11px; border-radius: 999px;
  display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 500; }
.rd__balstitek.je-vas { background: #fff; color: var(--bl-ink); box-shadow: inset 0 0 0 1px var(--bl-pisekl); }
.rd__balstitek.je-vas svg { color: var(--bl-zelena); }
.rd__balstitek.je-hot { background: var(--bl-zlata); color: var(--bl-ink); }

.rd__balicek.je-vas { background: var(--bl-papir); box-shadow: inset 0 0 0 1px var(--bl-pisekl); }

.rd__balicek.je-hot { background: radial-gradient(120% 70% at 90% 0%, #4A5D58, #344340 50%, #2C3936); color: #fff;
  transform: translateY(-14px); box-shadow: 0 30px 50px -24px rgba(44,57,54,.7); }
.rd__balicek.je-hot .rd__balnazev { color: var(--bl-zlata); }
.rd__balicek.je-hot .rd__balvelke span, .rd__balicek.je-hot .rd__balkomu { color: rgba(255,255,255,.78); }
.rd__balicek.je-hot .rd__skala { --on: var(--bl-zlata); --off: rgba(255,255,255,.14); }
.rd__balicek.je-hot .rd__skalapopis { color: rgba(255,255,255,.5); }
.rd__balicek.je-hot .rd__balcena { border-top-color: rgba(255,255,255,.14); }
.rd__balicek.je-hot .rd__balcena small { color: rgba(255,255,255,.62); }
.rd__balicek.je-hot .rd__balseznam li svg { color: var(--bl-zlata); }
.rd__balicek.je-hot .rd__balseznam li.je-zdedene { color: rgba(255,255,255,.6); }

/* Celá republika: plná škála, která doprava vybledne. Znamená to „bez limitu". */
.rd__balicek.je-bezlimitu .rd__skala::after {
  background: repeating-linear-gradient(90deg, var(--bl-ink) 0 calc(5% - 3px), transparent calc(5% - 3px) 5%);
  -webkit-mask: linear-gradient(90deg, #000 70%, transparent); mask: linear-gradient(90deg, #000 70%, transparent); }

.rd__balicek.je-zajem { outline: 1px solid #5EAA86; outline-offset: -1px; }

.rd__proctri { display: flex; flex-direction: column; gap: 18px;
  background: #fff; border-radius: 20px; padding: clamp(22px, 3vw, 34px); box-shadow: var(--bl-stin); }
.rd__proctrihlava { display: flex; align-items: center; gap: 10px; }
.rd__proctri h3 { font-size: clamp(20px, 2vw, 24px); font-weight: 500; }
.rd__proctrimriz { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1.2fr);
  border-top: 1px solid var(--bl-linka); }
.rd__proctrimriz > div { display: flex; gap: 10px; align-items: flex-start;
  padding: 16px 16px 16px 0; border-bottom: 1px solid var(--bl-linka); font-size: 14.5px; line-height: 1.45; }
.rd__proctrimriz > .rd__proctrih { padding: 14px 16px 12px 0;
  font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--bl-muted); }
.rd__proctrih.je-dobre { color: var(--bl-zelena); }
.rd__proctrimriz > .rd__proctrico { flex-direction: column; gap: 1px; }
.rd__proctrico b { font-weight: 500; }
.rd__proctrico small { font-size: 12.5px; color: var(--bl-muted); }
.rd__proctrimalo { color: var(--bl-muted); }
.rd__proctrimalo svg { flex: none; margin-top: 2px; color: var(--bl-muted2); }
.rd__proctridost { color: var(--bl-ink); }
.rd__proctridost svg { flex: none; margin-top: 2px; color: var(--bl-zelena); }
.rd__proctripata { display: flex; align-items: center; justify-content: space-between; gap: 14px 24px; flex-wrap: wrap; }
.rd__proctripata p { max-width: 64ch; font-size: 14px; line-height: 1.55; color: var(--bl-muted); }

@media (max-width: 1400px) {
  .rd__balicky { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 28px; }
  .rd__balicek.je-hot { transform: none; }
}
@media (max-width: 620px) {
  .rd__balicky { grid-template-columns: 1fr; }
  .rd__balkomu { min-height: 0; }
  .rd__proctrimriz { grid-template-columns: 1fr; }
  .rd__proctrimriz > .rd__proctrih { display: none; }
  .rd__proctrimriz > div { padding: 6px 0; border-bottom: 0; }
  .rd__proctrimriz > .rd__proctrico { padding-top: 16px; border-top: 1px solid var(--bl-linka); }
  .rd__proctripata .rd__tlacitkotmave { width: 100%; justify-content: center; }
}
.rd .rd__tlacitkotmave { display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 20px; border-radius: 999px;
  border: 1px solid var(--ink); background: transparent; color: var(--ink); font-size: 15px; font-weight: 500; cursor: pointer;
  transition: background .15s ease, color .15s ease; }
.rd .rd__tlacitkotmave:hover { background: var(--ink); color: #fff; }

@media (max-width: 700px) {
  .rd__vyberpata { flex-direction: column; align-items: stretch; }
  .rd__vyberpata .rd__tlacitko { width: 100%; justify-content: center; }
}

/* ==========================================================================
   Doplňky: jak poznáte, že se doplněk vyplatil. Hodnoty z handoffu, nepřepisovat od oka.
   ========================================================================== */
.rd__vyhodnoceni { --zelena: #1D7F57; --zelenasvetla: #E7F2EC; --papir: #FAF8F5; --pisekt: #F1EAE1; --bronz: #8a6f52;
  display: flex; flex-direction: column; gap: clamp(24px, 3vw, 36px);
  background: #fff; border-radius: 22px; padding: clamp(22px, 3.6vw, 44px);
  box-shadow: 0 1px 2px rgba(52,67,64,.05), 0 18px 40px -22px rgba(52,67,64,.18); }
.rd__vyhodhlava { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(20px, 3vw, 40px); align-items: end; }
.rd__vyhodnoceni .rd__kicker { color: var(--bronz); margin: 0; }
.rd__vyhodhlava h2 { margin: 10px 0 12px; font-size: clamp(26px, 3.2vw, 40px); line-height: 1.1; font-weight: 500; letter-spacing: -.01em; text-wrap: balance; }
.rd__vyhodhlava h2 em { font-style: normal; color: var(--zelena); }
.rd__vyhodlead { margin: 0; font-size: 16px; line-height: 1.55; color: var(--tlumene); max-width: 560px; text-wrap: pretty; }
.rd__pecet { display: flex; gap: 16px; align-items: flex-start; padding: 20px 22px; border-radius: 18px; background: var(--pisekt); }
.rd__pecetznak { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--ink); }
.rd__pecet b { display: block; font-size: 17px; font-weight: 600; margin-bottom: 4px; }
.rd__pecet small { font-size: 14.5px; line-height: 1.5; color: #4a5956; }

.rd__vyhodgraf { background: var(--papir); border-radius: 18px; padding: 18px clamp(14px, 2vw, 22px) 0; overflow: hidden; }
.rd__vyhodlista { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding-bottom: 14px; }
.rd__vyhodmetrika { font-size: 14px; font-weight: 500; }
.rd__vyhodmetrika small { margin-left: 8px; font-size: 12px; font-weight: 400; color: var(--slabe); }
.rd__vyhodlegenda { display: flex; gap: 18px; font-size: 13px; color: #4a5956; }
.rd__vyhodlegenda > span { display: flex; align-items: center; gap: 8px; }
.rd__vyhodplocha { position: relative; height: clamp(200px, 24vw, 280px); }
.rd__vyhodplocha svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.rd__faze { position: absolute; top: 0; bottom: 0; display: flex; align-items: flex-start; padding: 10px 12px; }
.rd__faze--pred { left: 0; width: 50%; background: repeating-linear-gradient(135deg, rgba(52,67,64,.035) 0 8px, transparent 8px 16px); }
.rd__faze--po { left: 50%; width: 50%; background: linear-gradient(180deg, rgba(29,127,87,.07), rgba(29,127,87,0)); border-left: 1px dashed #BFC9C4; }
.rd__fazestitek { padding: 3px 8px; border-radius: 999px; background: var(--papir); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--tlumene); }
.rd__faze--po .rd__fazestitek { color: var(--zelena); background: var(--zelenasvetla); }
.rd__vyhodpin { position: absolute; width: 30px; height: 30px; margin: -15px 0 0 -15px; border-radius: 50%; background: var(--ink); color: #fff;
  font-family: Inter, system-ui, sans-serif; font-size: 13px; font-weight: 600; line-height: 30px; text-align: center; box-shadow: 0 0 0 5px var(--papir); }
.rd__vyhodrozdil { position: absolute; right: clamp(8px, 2vw, 20px); top: 18%; padding: 10px 14px 11px; border-radius: 14px;
  background: var(--ink); color: #fff; text-align: right; box-shadow: 0 14px 28px -14px rgba(52,67,64,.6);
  opacity: 0; transform: translateY(6px); transition: opacity .5s .9s, transform .5s .9s; }
.rd__vyhodrozdil b { display: block; font-size: clamp(24px, 2.6vw, 32px); line-height: 1; color: #9FE0BF; }
.rd__vyhodrozdil small { font-size: 12.5px; color: rgba(255,255,255,.75); }
.rd__vyhodosa { display: flex; justify-content: space-between; padding: 10px 0 14px; border-top: 1px solid var(--linka-jemna);
  font-family: Inter, system-ui, sans-serif; font-size: 12px; font-weight: 500; color: var(--slabe); }
.rd__vyhodcara { stroke-dasharray: 1200; stroke-dashoffset: 1200; transition: stroke-dashoffset 1.2s cubic-bezier(.3,.7,.2,1); }
.rd__vyhodvypln { opacity: 0; transition: opacity .8s .6s; }
.rd__vyhodnoceni.je-videt .rd__vyhodcara { stroke-dashoffset: 0; }
.rd__vyhodnoceni.je-videt .rd__vyhodvypln { opacity: 1; }
.rd__vyhodnoceni.je-videt .rd__vyhodrozdil { opacity: 1; transform: none; }
/* Když animaci spustila pojistka (karta na pozadí), přechody se nespustí,
   takže se skáče rovnou na konec. Jinak by graf zůstal nevykreslený. */
.rd__vyhodnoceni.je-bezanimace .rd__vyhodcara,
.rd__vyhodnoceni.je-bezanimace .rd__vyhodvypln,
.rd__vyhodnoceni.je-bezanimace .rd__vyhodrozdil { transition: none; }

.rd__vyhodkroky { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2.4vw, 28px); }
.rd__vyhodkroky li { display: flex; flex-direction: column; gap: 8px; padding-top: 18px; border-top: 2px solid var(--linka-jemna); }
.rd__vyhodkroky li.je-aktivni { border-top-color: var(--ink); }
.rd__vyhodkrokhlava { display: flex; align-items: center; gap: 10px; }
.rd__vyhodkrokhlava i { flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--ink); color: #fff;
  font-size: 13px; font-weight: 600; line-height: 30px; text-align: center; font-style: normal; }
.rd__vyhodkrokhlava em { font-family: Inter, system-ui, sans-serif; font-size: 12px; font-weight: 600; font-style: normal;
  letter-spacing: .04em; text-transform: uppercase; color: var(--tlumene); }
.rd__vyhodkroky h3 { margin: 4px 0 0; font-size: 19px; font-weight: 500; line-height: 1.25; }
.rd__vyhodkroky p { margin: 0; font-size: 15px; line-height: 1.55; color: #4a5956; text-wrap: pretty; }
.rd__vysledky { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.rd__vysledek { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; font-size: 14px; line-height: 1.35; }
.rd__vysledek svg { flex: none; }
.rd__vysledek.je-ano { background: var(--zelenasvetla); color: #155f41; }
.rd__vysledek.je-ne { background: var(--pisekt); color: var(--ink); }
.rd__vyhodpata { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap;
  padding-top: 22px; border-top: 1px solid var(--linka-jemna); }
.rd__vyhodpata p { margin: 0; font-size: 14.5px; color: var(--tlumene); }
.rd__vyhodpata p b { color: var(--ink); font-weight: 500; }
.rd__vyhodpata .rd__cta { height: 48px; padding: 0 24px; border-radius: 999px; font-size: 15.5px; }

@media (max-width: 820px) {
  .rd__vyhodhlava { grid-template-columns: 1fr; }
  .rd__vyhodkroky { grid-template-columns: 1fr; }
  .rd__vyhodlegenda { gap: 12px; font-size: 12px; }
  .rd__vyhodpin { display: none; }
  .rd__vyhodpata { flex-direction: column; align-items: stretch; }
  .rd__vyhodpata .rd__cta { justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .rd__vyhodcara, .rd__vyhodvypln, .rd__vyhodrozdil { transition: none !important; }
}

/* ==========================================================================
   Vy proti konkurenci jako duel. Hodnoty z handoffu „vy_proti_konkurenci",
   nepřepisovat od oka.
   ========================================================================== */
.rd__duel, .rd__kola, .rd__zebrik, .rd__zavod, .rd__trofeje, .rd__tah, .rd__pocitadlo,
.rd__pasmazebriku, .rd__zebriksoucet {
  --du-ink: #344340; --du-ink2: #4a5956; --du-muted: #6b7472; --du-muted2: #8a918f;
  --du-papir: #FAF8F5; --du-pisek: #F1EAE1; --du-pisekl: #DCCFBF; --du-linka: #F1EDE9;
  --du-zlata: #D4A574; --du-bronz: #8a6f52; --du-zelena: #1D7F57; --du-zelenat: #E7F2EC;
  --du-menta: #9FE0BF; --du-soupel: #C9644A; --du-soupelt: #FBEAE4; --du-soupell: #F2A58E; }

.rd__duel { position: relative; overflow: hidden; border-radius: 24px; color: #fff;
  background: radial-gradient(90% 90% at 50% 0%, #4F635E 0%, #344340 55%, #2A3633 100%);
  padding: clamp(22px, 3.4vw, 36px); display: flex; flex-direction: column; gap: clamp(20px, 3vw, 30px);
  box-shadow: 0 30px 60px -30px rgba(42,54,51,.8); }
.rd__duel::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, rgba(159,224,191,.10), transparent 30%, transparent 70%, rgba(242,165,142,.10)); }
.rd__duel > * { position: relative; }
.rd__duel .rd__kicker { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--du-zlata); }

.rd__dueltop { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.rd__soupeci { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.rd__soupeci > span { font-size: 13px; color: rgba(255,255,255,.6); margin-right: 4px; }
.rd__soupeci button { height: 34px; padding: 0 14px; border-radius: 999px; border: 1px solid rgba(255,255,255,.22);
  background: transparent; color: #fff; font-size: 13.5px; font-weight: 500; white-space: nowrap; }
.rd__soupeci button:hover { background: rgba(255,255,255,.08); }
.rd__soupeci button[aria-pressed="true"] { background: #fff; color: var(--du-ink); border-color: #fff; }

.rd__arena { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: clamp(12px, 3vw, 32px); }
.rd__tym { display: flex; align-items: center; gap: 14px; min-width: 0; }
.rd__tym.je-on { flex-direction: row-reverse; text-align: right; }
.rd__duelavatar { flex: none; width: clamp(48px, 6vw, 64px); height: clamp(48px, 6vw, 64px); border-radius: 16px;
  display: flex; align-items: center; justify-content: center;
  font-family: "Inter", system-ui, sans-serif; font-weight: 600; font-size: clamp(20px, 2.4vw, 26px); }
.rd__tym.je-ja .rd__duelavatar { background: #fff; color: var(--du-ink); box-shadow: 0 0 0 4px rgba(159,224,191,.35); }
.rd__tym.je-on .rd__duelavatar { background: var(--du-zlata); color: var(--du-ink); box-shadow: 0 0 0 4px rgba(242,165,142,.35); }
.rd__tymtext { min-width: 0; }
.rd__tymtext em { display: inline-block; font-style: normal; font-family: "Inter", system-ui, sans-serif;
  font-weight: 600; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 6px; color: var(--du-menta); }
.rd__tym.je-on .rd__tymtext em { color: var(--du-soupell); }
.rd__tymtext b { display: block; font-size: clamp(17px, 2vw, 22px); font-weight: 500; line-height: 1.2; }
.rd__tymtext small { display: block; font-size: 13px; color: rgba(255,255,255,.62); margin-top: 3px; }

.rd__skore { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.rd__skorecislo { display: flex; align-items: center; gap: clamp(10px, 1.6vw, 18px);
  font-family: "Inter", system-ui, sans-serif; font-weight: 700; font-size: clamp(54px, 8vw, 96px); line-height: .9;
  letter-spacing: -.03em; font-variant-numeric: tabular-nums; animation: rd-skok .5s cubic-bezier(.3,1.6,.5,1); }
.rd__skorecislo .je-ja { color: var(--du-menta); }
.rd__skorecislo .je-on { color: var(--du-soupell); }
.rd__skorecislo i { font-style: normal; font-size: .5em; color: rgba(255,255,255,.35); font-weight: 500; }
@keyframes rd-skok { 0% { transform: scale(.7); opacity: 0; } 100% { transform: none; opacity: 1; } }
.rd__skorestitek { height: 28px; padding: 0 12px; border-radius: 999px; font-size: 13px; font-weight: 500;
  display: flex; align-items: center; gap: 6px; background: rgba(159,224,191,.16); color: var(--du-menta); white-space: nowrap; }
.rd__skorestitek.je-prohra { background: rgba(242,165,142,.16); color: var(--du-soupell); }
.rd__skorestitek.je-remiza { background: rgba(255,255,255,.1); color: #fff; }
.rd__pipy { display: flex; gap: 5px; }
.rd__pipy i { width: clamp(14px, 1.8vw, 20px); height: 6px; border-radius: 3px; background: rgba(255,255,255,.14); transition: background .3s; }
.rd__pipy i.je-y { background: var(--du-menta); }
.rd__pipy i.je-r { background: var(--du-soupell); }
.rd__pipy i.je-d { background: rgba(255,255,255,.4); }

.rd__duelpata { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 28px; flex-wrap: wrap;
  padding-top: clamp(18px, 2.6vw, 24px); border-top: 1px solid rgba(255,255,255,.12); }
.rd__duelpata h2 { font-size: clamp(22px, 2.6vw, 30px); line-height: 1.18; font-weight: 400; max-width: 560px;
  letter-spacing: -.01em; text-wrap: balance; }
.rd__duelpata h2 b { font-weight: 600; }
.rd__duelakce { display: flex; gap: 10px; flex-wrap: wrap; }

/* Kolo po kole */
.rd__kola { display: flex; flex-direction: column; }
.rd__kolo { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.5fr) minmax(0,1fr);
  align-items: center; gap: clamp(10px, 2vw, 24px); padding: 14px 0; border-top: 1px solid var(--du-linka); }
.rd__kolo:first-child { border-top: 0; }
.rd__kolohodnota { display: flex; align-items: center; gap: 8px; color: var(--du-muted2);
  font-family: "Inter", system-ui, sans-serif; font-weight: 600; font-size: clamp(14px, 1.6vw, 17px); font-variant-numeric: tabular-nums; }
.rd__kolohodnota.je-vlevo { justify-content: flex-end; }
.rd__kolohodnota i { font-style: normal; font-size: 11px; height: 20px; padding: 0 7px; border-radius: 999px;
  display: inline-flex; align-items: center; }
.rd__kolo.je-y .rd__kolohodnota.je-vlevo { color: var(--du-ink); }
.rd__kolo.je-y .rd__kolohodnota.je-vlevo i { background: var(--du-zelenat); color: var(--du-zelena); }
.rd__kolo.je-r .rd__kolohodnota.je-vpravo { color: var(--du-ink); }
.rd__kolo.je-r .rd__kolohodnota.je-vpravo i { background: var(--du-soupelt); color: var(--du-soupel); }
.rd__kolo.je-d .rd__kolohodnota { color: var(--du-ink2); }
.rd__kolostred { text-align: center; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.rd__kolostred b { font-size: 14.5px; font-weight: 500; }
.rd__kolostred small { font-size: 12.5px; color: var(--du-muted2); }
.rd__pretahovana { position: relative; height: 8px; border-radius: 4px; background: var(--du-linka); margin-top: 7px; }
.rd__pretahovana::after { content: ""; position: absolute; left: 50%; top: -3px; bottom: -3px; width: 2px;
  margin-left: -1px; background: var(--du-pisekl); border-radius: 1px; }
.rd__pretahovana i { position: absolute; top: 0; bottom: 0; width: 0; border-radius: 4px;
  transition: width .7s cubic-bezier(.3,.7,.2,1); }
.rd__pretahovana i.je-y { right: 50%; background: var(--du-zelena); }
.rd__pretahovana i.je-r { left: 50%; background: var(--du-soupel); }
.rd__kola.je-bezanimace .rd__pretahovana i { transition: none; }

/* Žebříček cen lokality */
.rd__zebrik { position: relative; height: 120px; display: flex; align-items: flex-end; gap: 2px; margin-top: 40px; }
.rd__zebrik > span:not(.rd__zebrikznacka) { flex: 1; border-radius: 2px 2px 0 0; background: #E9E3DC; }
.rd__zebrik > span.je-ja { background: var(--du-ink); }
.rd__zebrik > span.je-on { background: var(--du-soupel); }
.rd__zebrikznacka { position: absolute; top: -34px; transform: translateX(-50%); white-space: nowrap;
  font-family: "Inter", system-ui, sans-serif; font-weight: 600; font-size: 12px; height: 24px; padding: 0 9px;
  border-radius: 999px; display: flex; align-items: center; color: #fff; background: var(--du-ink); }
.rd__zebrikznacka.je-on { background: var(--du-soupel); }
.rd__zebrikznacka i { font-style: normal; margin-right: 5px; }
.rd__zebrikznacka::after { content: ""; position: absolute; left: 50%; bottom: -4px; margin-left: -4px;
  border: 4px solid transparent; border-bottom: 0; border-top-color: var(--du-ink); }
.rd__zebrikznacka.je-on::after { border-top-color: var(--du-soupel); }
.rd__pasmazebriku { display: grid; grid-template-columns: 10fr 22fr 22fr 10fr; gap: 2px; margin-top: 8px;
  font-size: 12px; color: var(--du-muted); }
.rd__pasmazebriku div { border-top: 2px solid var(--du-pisekl); padding-top: 6px; }
.rd__zebriksoucet { display: flex; align-items: baseline; gap: 10px; margin-top: 18px; }
.rd__zebriksoucet b { font-size: 40px; line-height: 1; letter-spacing: -.02em; }
.rd__zebriksoucet span { font-size: 14px; color: var(--du-ink2); line-height: 1.5; }

/* Závod: kdo musí zlevnit první */
.rd__zavod { display: flex; flex-direction: column; gap: 6px; }
.rd__zavod li { display: grid; grid-template-columns: 22px minmax(0,1fr) auto 44px; align-items: center;
  gap: 10px; padding: 8px 10px; border-radius: 12px; font-size: 14px; }
.rd__zavod li.je-ja { background: var(--du-papir); box-shadow: inset 0 0 0 1.5px var(--du-ink); }
.rd__zavod li.je-soupel { background: var(--du-soupelt); }
.rd__zavodpozice { font-size: 12px; color: var(--du-muted2); }
.rd__zavodjmeno { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rd__zavodjmeno em { font-style: normal; font-family: "Inter", system-ui, sans-serif; font-weight: 600;
  font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; margin-left: 6px; padding: 2px 6px;
  border-radius: 999px; background: var(--du-ink); color: #fff; }
.rd__teplomer { display: flex; gap: 3px; }
.rd__teplomer i { width: 12px; height: 14px; border-radius: 3px; background: #EEE9E3; }
.rd__teplomer i.je-on { background: linear-gradient(180deg, #E48C6E, #B4432C); }
.rd__zavodcislo { font-size: 13px; text-align: right; }
.rd__zavodcislo.je-klid { color: var(--du-zelena); }

/* Odznaky */
.rd__pocitadlo { font-size: 13px; color: var(--du-bronz); background: var(--du-pisek); height: 28px;
  padding: 0 12px; border-radius: 999px; display: flex; align-items: center; }
.rd__trofeje { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; }
.rd__trofej { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px;
  padding: 20px 14px 18px; border-radius: 16px; background: var(--du-papir); }
.rd__trofejkruh { width: 64px; height: 64px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  color: var(--du-ink); background: radial-gradient(circle at 35% 30%, #F3D7B2, #D4A574 55%, #A97C4E);
  box-shadow: 0 8px 18px -8px rgba(169,124,78,.8), inset 0 -3px 0 rgba(0,0,0,.12); }
.rd__trofej.je-zamceny .rd__trofejkruh { background: #fff; box-shadow: inset 0 0 0 2px var(--du-pisekl);
  opacity: .9; color: var(--du-muted2); }
.rd__trofej b { font-size: 15px; font-weight: 600; }
.rd__trofej small { font-size: 13px; line-height: 1.4; color: var(--du-ink2); }
.rd__progres { width: 100%; height: 6px; border-radius: 3px; background: #E9E3DC; overflow: hidden; }
.rd__progres i { display: block; height: 100%; background: var(--du-zlata); border-radius: 3px; }
.rd__progrestext { font-size: 11.5px; color: var(--du-muted); }

/* Váš další tah */
.rd__tah { background: var(--du-pisek); border-radius: 20px; padding: clamp(20px, 3vw, 30px);
  display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 20px; align-items: center; }
.rd__tahikona { width: 56px; height: 56px; border-radius: 16px; background: var(--du-ink);
  display: flex; align-items: center; justify-content: center; color: var(--du-zlata); }
.rd__tah .rd__kicker { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--du-bronz); }
.rd__tah h3 { margin: 6px 0 4px; font-size: clamp(18px, 2vw, 22px); font-weight: 500; line-height: 1.25; text-wrap: balance; }
.rd__tah p { font-size: 14.5px; color: var(--du-ink2); line-height: 1.5; }
.rd__tahpozn { font-family: "Inter", system-ui, sans-serif; font-weight: 600; font-size: 12px;
  color: var(--du-bronz); margin-top: 8px; }
.rd .rd__tlacitkotmave.je-plny { background: var(--du-ink); color: #fff; height: 48px; padding: 0 22px; font-size: 15.5px; }
.rd .rd__tlacitkotmave.je-plny:hover { background: #2a3634; }

@media (max-width: 820px) {
  .rd__trofeje { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .rd__tah { grid-template-columns: 1fr; }
  .rd__tahikona { display: none; }
  .rd .rd__tlacitkotmave.je-plny { width: 100%; justify-content: center; }
}
@media (max-width: 620px) {
  .rd__arena { grid-template-columns: 1fr 1fr; row-gap: 18px; }
  .rd__skore { grid-column: 1 / -1; order: -1; }
  .rd__tym, .rd__tym.je-on { flex-direction: column; text-align: center; }
  .rd__kolo { grid-template-columns: 1fr 1fr; row-gap: 8px; }
  .rd__kolostred { grid-column: 1 / -1; order: -1; }
  .rd__kolohodnota.je-vlevo { justify-content: flex-start; }
  .rd__kolohodnota.je-vpravo { justify-content: flex-end; }
  .rd__duelakce { width: 100%; }
  .rd__duelakce .rd__cta, .rd__duelakce .rd__tlacitko { flex: 1 1 100%; justify-content: center; }
  .rd__zebriksoucet { flex-direction: column; gap: 4px; }
  .rd__zebrikznacka i { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .rd__skorecislo { animation: none; }
  .rd__pretahovana i { transition: none; }
}

/* Kreslená fasáda v dlaždici projektu. Drží místo fotce, kterou developer nahraje. */
.rd__projektnahled.je-vse { background: linear-gradient(140deg, #46605a, #2f423d); }
.rd__fasada { width: 100%; height: 100%; display: block; }

/* Ovládací řádek nad grafem: výběr, štítek a přepínač měly tři různé výšky (40, 22, 38 px)
   a vedle sebe vypadaly jako rozsypané pilulky. Jedna výška pro všechno, co v řádku stojí. */
.rd__grafovladani, .rd__oknoradek { --ovladac: 40px; }
.rd__grafovladani > *, .rd__oknoradek > * { align-self: center; }
.rd__grafovladani .rd__vyber, .rd__oknoradek .rd__vyber { min-height: var(--ovladac); height: var(--ovladac); margin-bottom: 0; }
.rd__grafovladani .rd__prepinacsvetly, .rd__oknoradek .rd__prepinacsvetly { height: var(--ovladac); align-items: center; padding: 0 3px; }
.rd__grafovladani .rd__prepinacsvetly button, .rd__oknoradek .rd__prepinacsvetly button { min-height: calc(var(--ovladac) - 8px); }
.rd__grafovladani .rd__stitek, .rd__oknoradek .rd__stitek {
  height: var(--ovladac); padding: 0 14px; font-size: 13px; font-weight: 500; white-space: nowrap; }
.rd__grafovladani .rd__oknovlastni, .rd__oknoradek .rd__oknovlastni { height: var(--ovladac); align-items: center; }
@media (max-width: 760px) {
  .rd__grafovladani .rd__stitek, .rd__oknoradek .rd__stitek { white-space: normal; height: auto; min-height: var(--ovladac); padding: 8px 14px; }
}

/* ==========================================================================
   Simulace ceny jako hra se třemi cíli. Hodnoty z handoffu „simulace_ceny",
   nepřepisovat od oka.
   ========================================================================== */
.rd__hraheader, .rd__simretez, .rd__treticesta, .rd__nezpustite,
.rd__simosaobal, .rd__simpatka, .rd__sazba, .rd__bodzlomu, .rd__bilance, .rd__pruhy {
  --si-ink: #344340; --si-ink2: #4a5956; --si-muted: #6b7472; --si-muted2: #8a918f;
  --si-papir: #FAF8F5; --si-pisek: #F1EAE1; --si-pisekl: #DCCFBF; --si-linka: #F1EDE9;
  --si-zlata: #D4A574; --si-bronz: #8a6f52; --si-zelena: #1D7F57; --si-zelenat: #E7F2EC;
  --si-menta: #9FE0BF; --si-risk: #B4432C; --si-riskt: #FBEAE4; }

.rd__hraheader { position: relative; overflow: hidden; border-radius: 24px; color: #fff;
  background: radial-gradient(90% 100% at 85% 0%, #4F635E 0%, #344340 50%, #2A3633 100%);
  padding: clamp(22px, 3.4vw, 38px); display: flex; flex-direction: column; gap: clamp(20px, 2.6vw, 28px);
  box-shadow: 0 30px 60px -30px rgba(42,54,51,.8); }
.rd__hratop { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; }
.rd__hratop .rd__projekty { margin-top: 0; }
.rd__hraheader .rd__kicker { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--si-zlata); }
.rd__hraheader h2 { font-size: clamp(26px, 3.4vw, 42px); line-height: 1.12; font-weight: 400; max-width: 820px; text-wrap: balance; }
.rd__hraheader h2 b { font-weight: 600; }


.rd__kotouc { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); border-radius: 18px;
  padding: 18px clamp(16px, 2.4vw, 24px) 16px; }
.rd__kotouchlava { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; flex-wrap: wrap; margin-bottom: 54px; }
.rd__kotouchlava span { font-size: 14px; color: rgba(255,255,255,.72); }
.rd .rd__kotoucval { font-family: "Inter", sans-serif; font-weight: 700; font-size: clamp(40px, 5vw, 56px); line-height: 1; letter-spacing: -.02em; }
.rd__kotoucval small { font-size: .45em; font-weight: 600; color: rgba(255,255,255,.6); margin-left: 4px; }

.rd__kolejnice { position: relative; height: 44px; }
.rd__kolej { position: absolute; left: 15px; right: 15px; top: 18px; height: 8px; border-radius: 4px;
  background: rgba(255,255,255,.14); overflow: hidden; }
.rd__kolej span { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 4px; background: linear-gradient(90deg, #E9C79E, #D4A574); }
.rd__vlajky { position: absolute; left: 15px; right: 15px; top: 0; bottom: 0; pointer-events: none; }
.rd__vlajka { position: absolute; top: 10px; bottom: 10px; width: 2px; margin-left: -1px; background: rgba(255,255,255,.55); }
.rd__vlajka b { position: absolute; bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); white-space: nowrap;
  font-family: "Inter", sans-serif; font-weight: 600; font-size: 11.5px; height: 22px; padding: 0 8px; border-radius: 999px;
  display: flex; align-items: center; background: rgba(255,255,255,.12); color: #fff; }
.rd__vlajka.je-kolaudace { background: var(--si-menta); }
.rd__vlajka.je-kolaudace b { background: rgba(159,224,191,.18); color: var(--si-menta); }
.rd__vlajka.je-konecdat { background: rgba(255,255,255,.28); }
.rd__vlajka.je-konecdat b { background: rgba(255,255,255,.08); color: rgba(255,255,255,.6); }
.rd__kolejnice input { position: absolute; inset: 0; width: 100%; margin: 0; background: transparent;
  -webkit-appearance: none; appearance: none; cursor: pointer; z-index: 2; }
.rd__kolejnice input:focus-visible { outline: 2px solid var(--si-zlata); outline-offset: 6px; border-radius: 8px; }
.rd__kolejnice input::-webkit-slider-runnable-track { height: 44px; background: transparent; }
.rd__kolejnice input::-moz-range-track { height: 44px; background: transparent; }
.rd__kolejnice input::-webkit-slider-thumb { -webkit-appearance: none; width: 30px; height: 30px; margin-top: 7px; border-radius: 50%;
  background: #fff; border: 6px solid var(--si-zlata); box-shadow: 0 6px 16px rgba(0,0,0,.35); }
.rd__kolejnice input::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%;
  background: #fff; border: 6px solid var(--si-zlata); box-shadow: 0 6px 16px rgba(0,0,0,.35); }
.rd__kotoucosa { display: flex; justify-content: space-between; padding: 4px 15px 0;
  font-family: "Inter", sans-serif; font-weight: 500; font-size: 12px; color: rgba(255,255,255,.45); }
.rd__predvolby { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.rd__predvolby button { height: 32px; padding: 0 12px; border-radius: 999px; border: 1px dashed rgba(255,255,255,.3);
  background: transparent; color: rgba(255,255,255,.85); font-size: 13px; font-weight: 500; }
.rd__predvolby button:hover:not(:disabled) { border-style: solid; background: rgba(255,255,255,.06); }
.rd__predvolby button:disabled { opacity: .45; cursor: default; }

.rd__cile { display: grid; grid-template-columns: auto repeat(3, minmax(0, 1fr)); gap: 10px; align-items: stretch; }
.rd__hvezdy { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 0 14px 0 4px; }
.rd__hvezdy b { font-size: 26px; line-height: 1; }
.rd__hvezdy small { font-size: 12px; color: rgba(255,255,255,.6); margin-top: 4px; }
.rd__cil { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 14px;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); transition: background .3s, border-color .3s; }
.rd__cil svg { flex: none; fill: none; stroke: rgba(255,255,255,.35); transition: transform .35s cubic-bezier(.3,1.6,.5,1); }
.rd__cil b { display: block; font-size: 14px; font-weight: 500; }
.rd__cil small { display: block; font-size: 12.5px; color: rgba(255,255,255,.6); margin-top: 2px; line-height: 1.35; }
.rd__cil.je-splneno { background: rgba(212,165,116,.14); border-color: rgba(212,165,116,.45); }
.rd__cil.je-splneno svg { fill: var(--si-zlata); stroke: var(--si-zlata); transform: scale(1.15) rotate(-8deg); }

/* Časová osa místo závodu (handoff simulace ceny v2) */
.rd__simosaobal { margin-top: 26px; }
.rd__simosanadpis { margin: 0 0 10px; font-size: 14.5px; font-weight: 500; }
.rd__simgantt { --sl: 150px; position: relative; }
.rd__simhlava, .rd__simradek, .rd__simosa { display: grid; grid-template-columns: var(--sl) minmax(0, 1fr);
  gap: 14px; align-items: center; }
.rd__simhlava { height: 30px; }
.rd__simznacka { position: relative; height: 100%; }
.rd__simkolaudace { position: absolute; top: 0; transform: translateX(-50%); display: flex; align-items: center; gap: 6px;
  height: 24px; padding: 0 10px; border-radius: 999px; background: var(--si-zelena); color: #fff;
  font-family: "Inter", sans-serif; font-weight: 600; font-size: 12px; white-space: nowrap; }
.rd__simvrstva { position: absolute; left: calc(var(--sl) + 14px); right: 0; top: 30px; bottom: 26px; pointer-events: none; }
.rd__simcara { position: absolute; top: 0; bottom: 0; width: 0; border-left: 2px solid var(--si-zelena); }
.rd__simradek { height: 46px; }
.rd__simradek > span { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--si-ink2); }
.rd__simradek > span small { padding: 2px 7px; border-radius: 999px; background: var(--si-pisek); color: var(--si-bronz);
  font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.rd__simdraha { position: relative; height: 22px; border-radius: 6px; background: var(--si-linka); }
.rd__simpruh { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 6px 0 0 6px;
  transition: width .45s cubic-bezier(.3,.7,.2,1); }
.rd__simpruh.je-cely { border-radius: 6px; }
.rd__simpretah { position: absolute; top: 0; bottom: 0; border-radius: 0 6px 6px 0;
  background: repeating-linear-gradient(135deg, var(--si-risk) 0 6px, #C9644A 6px 12px);
  transition: left .45s cubic-bezier(.3,.7,.2,1), width .45s cubic-bezier(.3,.7,.2,1); }
.rd__simkonec { position: absolute; top: 50%; transform: translateY(-50%); padding-left: 8px; white-space: nowrap;
  font-size: 13px; transition: left .45s cubic-bezier(.3,.7,.2,1); }
.rd__simkonec.je-uvnitr { transform: translate(-100%, -50%); padding: 0 8px 0 0; color: #fff; }
.rd__simradek.je-dnes .rd__simpruh { background: #B9B2A8; }
.rd__simradek.je-sleva .rd__simpruh { background: var(--si-ink); }
.rd__simradek.je-ads .rd__simdraha { background: transparent; }
.rd__simradek.je-ads .rd__simpruh { background: transparent; border: 2px dashed var(--si-ink); border-radius: 6px; }
.rd__simradek.je-ads .rd__simkonec { color: var(--si-muted); }
.rd__simosa { margin-top: 4px; }
.rd__simosa > div { display: flex; justify-content: space-between;
  font-family: "Inter", sans-serif; font-weight: 500; font-size: 11.5px; color: var(--si-muted2); }
.rd__simpatka { margin-top: 18px; padding: 12px 14px; border-radius: 12px; background: var(--si-papir);
  font-size: 13px; line-height: 1.5; color: var(--si-muted); }
.rd__simpatka b { color: var(--si-ink); font-weight: 500; }

/* Řetěz tří kroků */
.rd__simretez { display: grid; grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr) 28px minmax(0, 1fr);
  align-items: stretch; margin-top: 20px; }
.rd__simsipka { display: flex; align-items: center; justify-content: center; color: var(--si-pisekl); }
.rd__simkrok { display: flex; flex-direction: column; gap: 6px; padding: 16px 18px; border-radius: 16px; background: var(--si-papir); }
.rd__simkroktyp { font-family: "Inter", sans-serif; font-weight: 600; font-size: 11.5px; letter-spacing: .06em;
  text-transform: uppercase; color: var(--si-muted); }
.rd__simhodnoty { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.rd__simpredtim { font-size: 16px; color: var(--si-muted2); text-decoration: line-through; text-decoration-thickness: 1.5px; }
.rd .rd__simted { font-family: "Inter", sans-serif; font-weight: 700; font-size: clamp(24px, 2.6vw, 30px); line-height: 1;
  letter-spacing: -.01em; }
.rd__simted small { margin-left: 3px; font-size: .5em; font-weight: 600; color: var(--si-muted); }
.rd__simzmena { font-family: "Inter", sans-serif; font-weight: 600; font-size: 13px; color: var(--si-muted); }
.rd__simzmena.je-lepsi { color: var(--si-zelena); }
.rd__simjak { margin-top: auto; padding-top: 8px; border-top: 1px solid var(--si-linka);
  font-size: 12.5px; line-height: 1.45; color: var(--si-muted); }
.rd__simkrok.je-dobre { background: var(--si-zelenat); }
.rd__simkrok.je-dobre .rd__simzmena { color: var(--si-zelena); }
.rd__simkrok.je-spatne { background: var(--si-riskt); }
.rd__simkrok.je-spatne .rd__simzmena { color: var(--si-risk); }

/* Posuvník: zóny, vlaječka bez textu, legenda */
.rd__simzony { position: absolute; left: 14px; right: 14px; top: 15px; height: 10px; border-radius: 5px;
  overflow: hidden; display: flex; }
.rd__simz1 { background: rgba(255,255,255,.2); }
.rd__simz2 { background: rgba(212,165,116,.38); }
.rd__simz3 { flex: 1; background: repeating-linear-gradient(135deg, rgba(255,255,255,.16) 0 5px, rgba(255,255,255,.05) 5px 10px); }
.rd__simvypln { position: absolute; left: 14px; top: 15px; height: 10px; border-radius: 5px;
  background: var(--si-zlata); pointer-events: none; }
.rd__simpin { position: absolute; top: -2px; width: 0; pointer-events: none; color: var(--si-menta); }
.rd__simpin svg { position: absolute; left: -1px; bottom: 0; }
.rd__simpin::after { content: ""; position: absolute; left: -1px; top: 14px; width: 2px; height: 14px;
  background: var(--si-menta); border-radius: 1px; }
.rd__simlegenda { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 12px; font-size: 12.5px; color: rgba(255,255,255,.7); }
.rd__simlegenda span { display: flex; align-items: center; gap: 7px; }
.rd__simlegenda svg { color: var(--si-menta); }
.rd__simlegenda i { width: 18px; height: 8px; border-radius: 4px; }
.rd__simsw1 { background: rgba(255,255,255,.28); }
.rd__simsw2 { background: rgba(212,165,116,.55); }
.rd__simsw3 { background: repeating-linear-gradient(135deg, rgba(255,255,255,.3) 0 3px, rgba(255,255,255,.08) 3px 6px); }
.rd__simvarovani { display: flex; align-items: center; gap: 8px; margin: 12px 0 0; font-size: 13px; color: #F0CFA6; }

@media (max-width: 860px) {
  .rd__simretez { grid-template-columns: 1fr; }
  .rd__simsipka { height: 24px; transform: rotate(90deg); }
  .rd__simgantt { --sl: 110px; }
}


/* Bilance: čisté číslo nahoře a dva pruhy na jedné škále.
   Šrafovaný kus za zeleným pruhem je přesně to, co do ceny slevy chybí. */
.rd__bilance { display: flex; flex-direction: column; gap: 4px; margin: 20px 0 18px; padding: 16px 18px;
  border-radius: 16px; transition: background .3s; }
.rd__bilance b { font-size: clamp(28px, 3.4vw, 36px); line-height: 1; letter-spacing: -.02em; }
.rd__bilance span { font-size: 14px; }
.rd__bilance.je-nic { background: var(--si-papir); }
.rd__bilance.je-nic b { color: var(--si-muted2); }
.rd__bilance.je-nic span { color: var(--si-muted); }
.rd__bilance.je-dobre { background: var(--si-zelenat); }
.rd__bilance.je-dobre b { color: var(--si-zelena); }
.rd__bilance.je-dobre span { color: #155f41; }
.rd__bilance.je-spatne { background: var(--si-riskt); }
.rd__bilance.je-spatne b { color: var(--si-risk); }
.rd__bilance.je-spatne span { color: #7d2c1c; }
.rd__pruhy { display: flex; flex-direction: column; gap: 12px; }
.rd__pruhradek { display: grid; grid-template-columns: 8.6em minmax(0, 1fr) 5.4em; align-items: center; gap: 12px; }
.rd__pruhradek > span:first-child { font-size: 13.5px; color: var(--si-ink2); }
.rd__pruhdraha { position: relative; height: 14px; border-radius: 7px; background: var(--si-linka); }
.rd__pruhdraha i { position: absolute; top: 0; bottom: 0; left: 0; border-radius: 7px;
  transition: width .5s cubic-bezier(.3,.7,.2,1), left .5s cubic-bezier(.3,.7,.2,1); }
.rd__pruhdraha i.je-cena { background: var(--si-risk); }
.rd__pruhdraha i.je-uspora { background: var(--si-zelena); }
.rd__pruhdraha i.je-chybi { border-radius: 0 7px 7px 0; box-shadow: inset 0 0 0 1.5px rgba(180,67,44,.4);
  background: repeating-linear-gradient(135deg, rgba(180,67,44,.22) 0 4px, transparent 4px 8px); }
.rd__pruhradek > b { font-size: 15px; text-align: right; }
.rd__sazba { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--si-muted); margin-top: 14px; flex-wrap: wrap; }
.rd__sazba input { width: 68px; height: 34px; border-radius: 10px; border: 1px solid var(--si-pisekl); padding: 0 10px;
  font-family: "Inter", sans-serif; font-weight: 600; font-size: 14px; color: var(--si-ink); background: var(--si-papir); }
.rd__sazba input:focus { outline: 2px solid var(--si-zlata); outline-offset: 1px; }
.rd__bodzlomu { margin-top: 14px; font-size: 14px; line-height: 1.55; color: var(--si-muted); }
.rd__bodzlomu b { color: var(--si-ink); }

/* Třetí cesta: upsell */
.rd__treticesta { position: relative; overflow: hidden; border-radius: 20px;
  background: linear-gradient(160deg, #F6EBDD, #EFDCC4); padding: clamp(20px, 3vw, 30px);
  display: flex; flex-direction: column; gap: 14px; }
.rd__treticesta .rd__kicker { font-size: 12px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--si-bronz); display: flex; align-items: center; gap: 8px; }
.rd__zamecek { height: 22px; padding: 0 9px; border-radius: 999px; background: rgba(52,67,64,.08);
  font-family: "Inter", sans-serif; font-weight: 600; font-size: 11px; letter-spacing: .04em;
  display: inline-flex; align-items: center; gap: 5px; color: var(--si-ink); text-transform: none; }
.rd__treticesta h3 { font-size: clamp(20px, 2.2vw, 24px); line-height: 1.2; font-weight: 500; text-wrap: balance; }
.rd__treticesta p { font-size: 14.5px; line-height: 1.55; color: var(--si-ink2); }
.rd__porovnani { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.rd__porovnani > div { background: rgba(255,255,255,.7); border-radius: 14px; padding: 12px 14px; }
.rd__porovnani small { display: block; font-size: 12px; color: var(--si-muted); }
.rd__porovnani b { display: block; font-size: 20px; margin-top: 2px; }
.rd__porovnani .je-ads { background: #fff; box-shadow: inset 0 0 0 1.5px var(--si-ink); }
.rd__tretipozn { font-size: 12px; color: var(--si-bronz); }
.rd .rd__treticesta .rd__tlacitkotmave { align-self: flex-start; background: var(--si-ink); color: #fff; border-color: var(--si-ink); }
.rd .rd__treticesta .rd__tlacitkotmave:hover { background: #2a3634; color: #fff; }

/* Z čeho simulace počítá */

/* Než pustíte cenu */
.rd__nezpustite { background: #fff; border-radius: 20px; padding: clamp(20px, 3vw, 28px);
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 18px; align-items: center;
  box-shadow: inset 0 0 0 1px var(--si-pisekl); }
.rd__nezikona { width: 52px; height: 52px; border-radius: 16px; background: var(--si-pisek);
  display: flex; align-items: center; justify-content: center; color: var(--si-bronz); }
.rd__nezpustite .rd__kicker { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--si-bronz); }
.rd__nezpustite h3 { margin: 6px 0 4px; font-size: clamp(18px, 2vw, 21px); font-weight: 500; }
.rd__nezpustite p { font-size: 14.5px; color: var(--si-ink2); line-height: 1.5; }

@media (max-width: 860px) {
  .rd__cile { grid-template-columns: 1fr 1fr; }
  .rd__hvezdy { grid-column: 1 / -1; flex-direction: row; gap: 10px; justify-content: flex-start; padding: 0; align-items: baseline; }
}
@media (max-width: 600px) {
  .rd__cile { grid-template-columns: 1fr; }
  .rd__nezpustite { grid-template-columns: 1fr; }
  .rd__nezikona { display: none; }
  .rd__simlegenda { gap: 10px; font-size: 11.5px; }
  .rd__porovnani { grid-template-columns: 1fr; }
  .rd__nezpustite .rd__cta { width: 100%; justify-content: center; }
  .rd__pruhradek { grid-template-columns: minmax(0, 1fr) auto; }
  .rd__pruhdraha { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  .rd__simpruh, .rd__simpretah, .rd__simkonec, .rd__pruhdraha i, .rd__cil, .rd__cil svg { transition: none; }
}

/* ---------- Trh v ČR (handoff „trh_cr") ---------- */
/* Tmavá hlava s živou linkou. Pulzuje jen tečka, ne celý text. */
.rd__trhhero { padding: 34px 32px 30px; border-radius: var(--r); background: linear-gradient(135deg, #2b3834, #344340 55%, #3d4c47);
  color: #fff; display: flex; flex-direction: column; gap: 26px; }
.rd__zive { display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: rgba(255,255,255,.72); }
.rd__zive i { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: #9FE0BF; box-shadow: 0 0 0 0 rgba(159,224,191,.55); animation: rd-tep 2.4s ease-out infinite; }
@keyframes rd-tep { 0% { box-shadow: 0 0 0 0 rgba(159,224,191,.5); } 70% { box-shadow: 0 0 0 9px rgba(159,224,191,0); } 100% { box-shadow: 0 0 0 0 rgba(159,224,191,0); } }
.rd__trhhero h2 { margin: 8px 0 0; font-size: 36px; line-height: 1.16; font-weight: 500; letter-spacing: -.5px; max-width: 18em; }
.rd__trhhero h2 b { display: block; font-weight: 600; color: var(--zlata); }
.rd__trhlead { margin-top: 14px; max-width: 62ch; font-size: 15px; line-height: 1.6; color: rgba(255,255,255,.72); }
.rd__trhcisla { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: rgba(255,255,255,.14); border-radius: 12px; overflow: hidden; }
.rd__trhcisla > div { padding: 16px 18px; background: rgba(255,255,255,.05); }
.rd__trhcisla b { display: block; font-size: 27px; font-weight: 600; letter-spacing: -.5px; }
.rd__trhcisla small { display: block; margin-top: 3px; font-size: 12.5px; line-height: 1.35; color: rgba(255,255,255,.62); }

.rd__trhhledani { display: flex; flex-direction: column; gap: 8px; }
.rd__trhpole { position: relative; display: flex; align-items: center; gap: 12px; min-height: 58px; padding: 6px 8px 6px 18px;
  border-radius: 999px; background: #fff; color: var(--ink); flex-wrap: wrap; }
.rd__trhpole > svg { flex: 0 0 auto; color: var(--slabe); }
.rd__trhpole input { flex: 1 1 220px; min-width: 0; height: 44px; border: 0; background: none; font: inherit; font-size: 15.5px; color: var(--ink); outline: none; }
.rd__trhpole input::placeholder { color: #9aa3a0; }
.rd__trhpole > button { flex: 0 0 auto; height: 42px; padding: 0 22px; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--zlata); color: #3a2a12; font: inherit; font-size: 14.5px; font-weight: 600; }
.rd__trhpole > button:hover { background: #c79a66; }
.rd__naseptavac { position: absolute; z-index: 20; top: calc(100% + 8px); left: 0; right: 0; padding: 6px; border-radius: 16px;
  background: #fff; color: var(--ink); box-shadow: 0 18px 40px rgba(20,30,27,.22); }
.rd__naseptavac button { display: flex; width: 100%; align-items: baseline; gap: 10px; padding: 11px 14px; border: 0; border-radius: 11px;
  background: none; cursor: pointer; font: inherit; text-align: left; }
.rd__naseptavac button:hover { background: var(--pisek-2); }
.rd__naseptavac button span { font-size: 15px; font-weight: 500; }
.rd__naseptavac button small { margin-left: auto; font-size: 12.5px; color: var(--slabe); white-space: nowrap; }
.rd__nicnenalezeno { padding: 13px 14px; font-size: 14px; line-height: 1.5; color: var(--tlumene); }
.rd__trhpozn { padding-left: 18px; font-size: 13px; color: rgba(255,255,255,.55); }

/* Přepínač metriky v hlavičce karty. */
.rd__trhprepinac { display: flex; gap: 2px; padding: 3px; border-radius: 999px; background: var(--pisek-2); }
.rd__trhprepinac button { height: 32px; padding: 0 14px; border: 0; border-radius: 999px; background: none; cursor: pointer;
  font: inherit; font-size: 13.5px; font-weight: 500; color: var(--tlumene); white-space: nowrap; }
.rd__trhprepinac button[aria-pressed="true"] { background: #fff; color: var(--ink); font-weight: 600; box-shadow: 0 1px 3px rgba(20,30,27,.12); }

/* Kartogram: 6 × 3 dlaždice, prázdná pozice je jen mezera. */
.rd__mapamrizka { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 52px; align-items: start; margin-top: 14px; }
.rd__mapamrizka > div { min-width: 0; }
.rd__dlazdice { display: grid; grid-template-columns: repeat(6, 1fr); gap: 18px; }
.rd__krajdlazdice { position: relative; display: flex; flex-direction: column; justify-content: center; gap: 5px;
  aspect-ratio: 1 / .9; padding: 10px 8px; border: 1.5px solid transparent; border-radius: 12px; cursor: pointer;
  font: inherit; text-align: center; color: var(--ink); transition: transform .12s, box-shadow .12s; }
.rd__krajdlazdice:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(20,30,27,.16); }
.rd__krajdlazdice b { font-size: 11.5px; font-weight: 600; line-height: 1.15; }
.rd__krajdlazdice span { font-size: 13px; font-weight: 600; letter-spacing: -.2px; }
.rd__krajdlazdice.je-tmava { color: #fff; }
.rd__krajdlazdice.je-vybrana { border-color: var(--ink); box-shadow: 0 0 0 2px #fff inset; }
.rd__krajmoje { position: absolute; top: 6px; right: 6px; width: 7px; height: 7px; border-radius: 50%; background: var(--zlata); box-shadow: 0 0 0 1.5px rgba(255,255,255,.75); }
.rd .rd__mapalegenda { margin-top: 30px; padding-top: 22px; }
.rd__mapalegenda .rd__rampa { display: inline-flex; gap: 3px; }
.rd__mapalegenda .rd__rampa i { width: 22px; height: 10px; border-radius: 2px; }
.rd__mapalegenda .rd__mapamoje i { width: 7px; height: 7px; border-radius: 50%; background: var(--zlata); }

/* Detail kraje vpravo od mapy. */
.rd__krajdetail { padding: 26px 26px 28px; border: 1px solid var(--linka-jemna); border-radius: var(--r); background: #FAF8F5; }
.rd__krajhlava { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.rd__krajhlava h4 { margin: 0; font-size: 19px; font-weight: 600; }
.rd__krajcena { margin-top: 14px; display: flex; align-items: baseline; gap: 7px; }
.rd__krajcena b { font-size: 30px; font-weight: 600; letter-spacing: -.8px; }
.rd__krajcena small { font-size: 13px; color: var(--tlumene); }
.rd__krajzmena { margin-top: 2px; font-size: 14px; font-weight: 600; }
.rd__krajzmena.je-rust { color: var(--zelena); }
.rd__krajzmena.je-pokles { color: #B4432C; }
.rd__krajcisla { margin-top: 22px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; padding-top: 20px; border-top: 1px solid var(--linka-jemna); }
.rd__krajcisla b { display: block; font-size: 18px; font-weight: 600; }
.rd__krajcisla small { display: block; margin-top: 1px; font-size: 11.5px; line-height: 1.3; color: var(--tlumene); }
.rd__krajproti { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--linka-jemna); }
.rd__krajproti p { font-size: 13.5px; line-height: 1.45; color: var(--tlumene); }
.rd__krajosa { position: relative; display: block; height: 8px; margin: 18px 0 9px; border-radius: 4px; background: linear-gradient(90deg, #EFE7DD, #344340); }
.rd__krajosa i { position: absolute; top: 50%; transform: translate(-50%, -50%); }
.rd__krajosa .je-median { width: 2px; height: 16px; border-radius: 1px; background: var(--ink); }
.rd__krajosa .je-kraj { width: 14px; height: 14px; border-radius: 50%; background: var(--zlata); box-shadow: 0 0 0 2.5px #fff, 0 1px 4px rgba(20,30,27,.3); }
.rd__krajosapopis { display: flex; justify-content: space-between; gap: 8px; font-size: 11px; color: var(--slabe); }

/* Žebříček krajů pod mapou: dva sloupce, ať se 14 krajů vejde bez rolování. */
.rd .rd__krajzebricek { margin: 48px 0 0; padding: 36px 0 0; list-style: none; border-top: 1px solid var(--linka-jemna);
  columns: 2; column-gap: 60px; }
.rd__krajzebricek li { break-inside: avoid; }
.rd__krajzebricek button { display: grid; grid-template-columns: 26px minmax(0, 8.5em) minmax(40px, 1fr) auto; align-items: center; gap: 10px;
  width: 100%; padding: 13px 12px; border: 0; border-radius: 10px; background: none; cursor: pointer; font: inherit; text-align: left; }
.rd__krajzebricek button:hover { background: var(--pisek-2); }
.rd__krajzebricek li.je-vybrany button { background: var(--pisek-2); }
.rd__krajporadi { font-size: 12px; color: var(--slabe); }
.rd__krajnazev { font-size: 13.5px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rd__krajpruh { height: 7px; border-radius: 4px; background: var(--linka-jemna); overflow: hidden; }
.rd__krajpruh i { display: block; height: 100%; border-radius: 4px; }
.rd__krajhodnota { font-size: 13px; font-weight: 600; white-space: nowrap; }

/* Noví sousedé. */
.rd__sousedi { display: grid; grid-template-columns: repeat(auto-fill, minmax(226px, 1fr)); gap: 14px; }
.rd__soused { display: flex; flex-direction: column; gap: 5px; padding: 16px 18px; border: 1px solid var(--linka-jemna); border-radius: var(--r); background: #fff; }
.rd__sousedtop { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 4px; }
.rd__sousedkm { font-size: 12.5px; font-weight: 600; color: var(--tlumene); }
.rd__soused h4 { margin: 0; font-size: 16px; font-weight: 600; line-height: 1.3; }
.rd__sousedcena { margin-top: 6px; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.rd__sousedcena b { font-size: 20px; font-weight: 600; letter-spacing: -.4px; }
.rd__sousedcena span { font-size: 12.5px; font-weight: 600; }
.rd__sousedcena .je-rust { color: #B4432C; }
.rd__sousedcena .je-pokles { color: var(--zelena); }
.rd__sousedsledovat { margin-top: 12px; display: flex; align-items: center; justify-content: center; gap: 6px; height: 38px;
  border: 1px solid var(--ink); border-radius: 10px; background: none; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; color: var(--ink); }
.rd__sousedsledovat:hover { background: var(--ink); color: #fff; }
.rd__sousedsledovat.je-sleduji { border-color: var(--linka-jemna); background: var(--pisek-2); color: var(--zelena); cursor: default; }
.rd__sousedsledovat.je-sleduji:hover { background: var(--pisek-2); color: var(--zelena); }

/* Změny v cenících: čtyři dlaždice jsou zároveň filtr. */
.rd__souhrnzmen { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; margin-bottom: 18px; }
.rd__souhrnzmen button { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; border: 1px solid var(--linka-jemna);
  border-radius: var(--r); background: #fff; cursor: pointer; font: inherit; text-align: left; }
.rd__souhrnzmen button:hover { border-color: #c9c0b4; }
.rd__souhrnzmen button[aria-pressed="true"] { border-color: var(--ink); background: #FAF8F5; }
.rd__zmenapocet { display: flex; align-items: center; gap: 9px; font-size: 23px; font-weight: 600; letter-spacing: -.5px; }
.rd__souhrnzmen small { font-size: 12.5px; line-height: 1.3; color: var(--tlumene); }
.rd__ikonatyp { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 8px; }
.rd__ikonatyp.je-zdrazeni { background: rgba(180,67,44,.13); color: #B4432C; }
.rd__ikonatyp.je-zlevneni { background: rgba(29,127,87,.13); color: var(--zelena); }
.rd__ikonatyp.je-stav { background: rgba(212,165,116,.22); color: #7a5418; }
.rd__ikonatyp.je-nove { background: var(--pisek-2); color: var(--tlumene); }
.rd__zmenyfeed { margin: 0; padding: 0; list-style: none; }
.rd__zmenyfeed li { display: grid; grid-template-columns: 5.6em 26px minmax(0, 10em) minmax(0, 1fr) 4.6em; align-items: center; gap: 12px;
  padding: 11px 2px; border-top: 1px solid var(--linka-jemna); }
.rd__zmenyfeed li:first-child { border-top: 0; }
.rd__zmenadatum { font-size: 12.5px; color: var(--slabe); white-space: nowrap; }
.rd__zmenaprojekt { font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rd__zmenaco { font-size: 13.5px; color: var(--tlumene); min-width: 0; }
.rd__zmenaokolik { text-align: right; font-size: 13.5px; font-weight: 600; }
.rd__zmenaokolik.je-rust { color: #B4432C; }
.rd__zmenaokolik.je-pokles { color: var(--zelena); }
.rd .rd__zmenyvic { margin-top: 16px; }

@media (max-width: 1000px) {
  .rd__mapamrizka { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .rd__trhhero { padding: 26px 20px 24px; gap: 22px; }
  .rd__trhhero h2 { font-size: 27px; }
  .rd__trhcisla { grid-template-columns: repeat(2, 1fr); }
  /* Na 375 px se řádek žebříčku nevešel a hodnoty trčely přes okraj (změřeno 9 px). */
  .rd .rd__krajzebricek { columns: 1; margin-top: 36px; padding-top: 28px; }
  .rd__krajzebricek button { grid-template-columns: 22px minmax(0, 1fr) auto; gap: 8px; padding: 9px 8px; }
  .rd__krajzebricek .rd__krajpruh { display: none; }
  .rd__krajhodnota { font-size: 12.5px; }
  /* Přepínač metrik se na úzkém displeji nevejde vedle nadpisu, tak si vezme vlastní řádek. */
  .rd__kartahlava:has(.rd__trhprepinac) { flex-wrap: wrap; }
  .rd__trhprepinac { flex: 1 0 100%; justify-content: space-between; }
  .rd__trhprepinac button { flex: 1 1 auto; padding: 0 8px; font-size: 12.5px; }
  .rd__dlazdice { gap: 3px; }
  .rd__krajdlazdice { min-width: 0; padding: 6px 1px; border-radius: 8px; }
  .rd__krajdlazdice b { font-size: 9px; letter-spacing: -.2px; }
  .rd__krajdlazdice span { font-size: 10.5px; }
  .rd__krajmoje { top: 3px; right: 3px; width: 5px; height: 5px; }
  .rd__zmenyfeed li { grid-template-columns: 26px minmax(0, 1fr) 4.4em; row-gap: 3px; }
  .rd__zmenadatum { grid-column: 2 / 4; order: -1; }
  .rd__zmenaprojekt { grid-column: 2 / 4; }
  .rd__zmenaco { grid-column: 2 / 4; }
}
@media (max-width: 520px) {
  .rd__trhpole { height: auto; min-height: 0; flex-direction: column; align-items: stretch;
    gap: 8px; padding: 10px; border-radius: 22px; }
  .rd__trhpole > svg { display: none; }
  .rd__trhpole input { height: 42px; padding-left: 10px; font-size: 14.5px; }
  .rd__trhpole > button { width: 100%; padding: 0 16px; }
  .rd__dlazdice { gap: 4px; }
}

/* ---------- Dnes: výkladní skříň a rozcestník (handoff „dnes_v2") ---------- */
/* Pozor: .rd h2 a .rd p z resetu nahoře mají stejnou specificitu jako samotná třída, takže
   mezery v hlavě musí stát na selektorech se dvěma třídami nebo na tagu uvnitř hlavy. */
.rd__dneshero { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 52px; align-items: center;
  padding: 42px 44px; border-radius: var(--r-velky); color: #fff;
  background: radial-gradient(90% 110% at 90% 0%, #4F635E 0%, #344340 50%, #2A3633 100%); }
.rd__dneshlava { min-width: 0; }
.rd__dneshero .rd__kicker { margin-bottom: 22px; }
.rd__dneshlava .rd__projekty { margin: 0 0 30px; }
.rd__dneshero .rd__kicker { color: rgba(255,255,255,.6); }
.rd__dneshero h2 { margin: 0 0 18px; font-size: 34px; line-height: 1.24; font-weight: 400; letter-spacing: -.4px; max-width: 19em; }
.rd__dneshero h2 b { font-weight: 600; }
.rd__pozde { color: #F2A58E; font-weight: 600; }
.rd__dneshero .rd__dnesperex { margin: 0; max-width: 56ch; font-size: 15.5px; line-height: 1.6; color: rgba(255,255,255,.78); }
.rd__dnesakce { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 30px; }
.rd .rd__dnesduch { background: none; border: 1px solid rgba(255,255,255,.3); color: #fff; }
.rd .rd__dnesduch:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.5); }
.rd__dnesprstenec { display: flex; flex-direction: column; align-items: center; gap: 12px; }

.rd__prstenec { position: relative; width: 184px; aspect-ratio: 1; }
.rd__prstenec svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.rd__prstenec circle { fill: none; stroke-width: 12; }
.rd__prstpodklad { stroke: rgba(255,255,255,.12); }
.rd__prstrezervace { stroke: var(--zlata); stroke-linecap: round; }
.rd__prstprodej { stroke: #9FE0BF; stroke-linecap: round; }
.rd__prststred { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.rd__prststred b { font-size: 42px; line-height: 1; }
.rd__prststred small { margin-top: 4px; font-size: 12.5px; color: rgba(255,255,255,.65); }
.rd__milnik { display: flex; align-items: center; gap: 8px; height: 30px; padding: 0 13px; border-radius: 999px;
  background: rgba(212,165,116,.16); color: #F0CFA6; font-size: 13px; white-space: nowrap; }

/* Pás čtyř čísel pod hlavou. */
.rd__dnescisla { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.rd__dneskpi { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; border-radius: 16px; background: #fff; box-shadow: var(--stin); }
.rd__dneskpi > small { font-size: 12.5px; color: var(--tlumene); }
.rd__dneskpi > div { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; }
.rd__dneskpi > div b { font-size: 26px; line-height: 1; letter-spacing: -.5px; }
.rd__dneskpi > div span { font-size: 12px; font-weight: 600; }
.rd__dneskpi .je-rust { color: var(--zelena); }
.rd__dneskpi .je-pokles { color: #B4432C; }
.rd__jiskra { display: block; width: 100%; height: 28px; }

/* Dnešní tahy. */
.rd__minipristenec { position: relative; display: inline-flex; width: 52px; height: 52px; flex: 0 0 auto; }
.rd__minipristenec svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.rd__minipristenec circle { fill: none; stroke-width: 6; }
.rd__minipodklad { stroke: var(--linka-jemna); }
.rd__miniplny { stroke: var(--zelena); stroke-linecap: round; transition: stroke-dashoffset .4s; }
.rd__minipristenec b { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 13px; }
.rd__tahy { display: flex; flex-direction: column; gap: 10px; }
.rd__tah2 { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 18px; align-items: center;
  padding: 16px 20px; border-radius: 16px; background: #FAF8F5; transition: opacity .3s, background .3s; }
.rd__tah2.je-zamceny { background: linear-gradient(135deg, #F6EFE6, #F1E6D8); }
.rd__tah2.je-hotovy { opacity: .55; background: #fff; box-shadow: inset 0 0 0 1px var(--linka-jemna); }
.rd__tah2.je-hotovy .rd__tahtext > b { text-decoration: line-through; text-decoration-color: var(--slabe); }
.rd__tahfajfka { width: 28px; height: 28px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  padding: 0; border: 2px solid var(--linka); border-radius: 50%; background: #fff; cursor: pointer; color: transparent; transition: all .25s; }
.rd__tahfajfka:hover { border-color: var(--zelena); }
.rd__tah2.je-hotovy .rd__tahfajfka { background: var(--zelena); border-color: var(--zelena); color: #fff; }
.rd__tahtext { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.rd__tahtext > b { font-size: 16px; font-weight: 500; line-height: 1.3; }
.rd__tahtext > span { font-size: 13.5px; line-height: 1.45; color: #4a5956; }
.rd__tahstitky { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 4px; }
.rd__tahstitek { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 999px; font-size: 12px; font-weight: 500; white-space: nowrap; }
.rd__tahstitek.je-horky { background: #FBEAE4; color: #B4432C; }
.rd__tahstitek.je-vlazny { background: var(--pisek-2); color: #8a6f52; }
.rd__tahstitek.je-ds { background: #E8EEF3; color: #3E5E78; }
.rd__tahstitek.je-cas { background: var(--linka-jemna); color: #4a5956; }
.rd__tahsazka { text-align: right; white-space: nowrap; }
.rd__tahsazka b { display: block; font-size: 18px; }
.rd__tahsazka small { font-size: 12px; color: var(--tlumene); }
.rd .rd__tahcta { white-space: nowrap; }
.rd__tahyhotovo { display: flex; align-items: center; gap: 9px; padding: 14px 18px; border-radius: 14px;
  background: #E7F2EC; color: #155f41; font-size: 14px; line-height: 1.5; }

/* Tempo pod závodem s kolaudací. */
.rd__tempo { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 18px; }
.rd__tempo > div { padding: 12px 15px; border-radius: 14px; background: #FAF8F5; }
.rd__tempo > div.je-chybi { background: #FBEAE4; }
.rd__tempo > div.je-chybi b { color: #B4432C; }
.rd__tempo b { display: block; margin: 2px 0; font-size: 22px; line-height: 1.1; }
.rd__tempo small { display: block; font-size: 12.5px; color: var(--tlumene); }

/* Mise na měsíc. */
.rd__mise { display: flex; flex-direction: column; }
.rd__mise h4 { margin: 0 0 5px; font-size: 21px; font-weight: 500; line-height: 1.25; }
.rd__misepole { display: flex; gap: 8px; margin: 18px 0 12px; }
.rd__misepole i { flex: 1; min-width: 0; height: 36px; display: flex; align-items: center; justify-content: center;
  border-radius: 10px; background: var(--linka-jemna); color: var(--slabe); font-style: normal;
  font-family: "Inter", sans-serif; font-size: 12px; font-weight: 600; }
.rd__misepole i.je-splneno { background: var(--zelena); color: #fff; }
.rd__misemeta { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 13px; color: var(--tlumene); }
.rd__miseodmena { display: flex; gap: 10px; align-items: flex-start; margin-top: 14px; padding: 12px 15px;
  border-radius: 14px; background: #E7F2EC; color: #155f41; font-size: 14px; line-height: 1.45; }
.rd__miseodmena svg { flex: 0 0 auto; margin-top: 1px; }

/* Teplota volných bytů v mapě. */
.rd__byt.je-teplo1 { background: #FBEFE8; }
.rd__byt.je-teplo2 { background: #F6D5C6; }
.rd__byt.je-teplo3 { background: #EFA98F; }
.rd__byt.je-horkybyt { box-shadow: inset 0 0 0 1.5px #B4432C; }
.rd__byt.je-ceka::after { content: ""; position: absolute; right: -3px; top: -3px; width: 8px; height: 8px;
  border-radius: 50%; background: var(--zelena); box-shadow: 0 0 0 2px #fff; }
.rd__sw.je-teplo3 { background: #EFA98F; border-color: #EFA98F; }
.rd__sw.je-ceka { background: var(--zelena); border-color: var(--zelena); border-radius: 50%; width: 9px; height: 9px; }
.rd__horkypruh { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  margin-top: 14px; padding: 12px 15px; border-radius: 14px; background: #FBEAE4; font-size: 14px; line-height: 1.45; }

/* Trychtýř jako sloupce. */
/* Tři řádky pro celou mřížku: sloupce, čísla, popisky. Když měl každý sloupec vlastní
   sloupcový flex, propadalo číslo u nízkého sloupce dolů a řádek se rozjel. */
.rd__trsloupce { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-template-rows: 1fr auto auto; gap: 8px 7px; align-items: end; }
.rd__trsloupec { display: grid; grid-row: 1 / -1; grid-template-rows: subgrid; gap: 8px; min-width: 0; align-items: end; }
@supports not (grid-template-rows: subgrid) {
  .rd__trsloupec { display: flex; flex-direction: column; justify-content: flex-end; }
}
.rd__trsloupec i { border-radius: 10px 10px 4px 4px; background: var(--ink); }
.rd__trsloupec.je-slaby i { background: #B4432C; }
.rd__trsloupec b { font-size: 19px; line-height: 1; }
.rd__trsloupec small { font-size: 12.5px; line-height: 1.3; color: var(--tlumene); }
.rd__trpodily { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 7px; margin-top: 10px; }
.rd__trpodily > span { display: flex; align-items: center; justify-content: center; height: 26px; border-radius: 999px;
  font-size: 11.5px; font-weight: 600; color: var(--slabe); }
.rd__trpodily > span.je-slaby { background: #FBEAE4; color: #B4432C; }
.rd__ztrata2 { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  margin-top: 18px; padding: 14px 18px; border-radius: 14px; background: #FAF8F5; }
.rd__ztrata2 p { max-width: 62ch; font-size: 14px; line-height: 1.5; }
.rd__ztrata2 b { color: #B4432C; font-weight: 600; }

/* Co udělala konkurence. */
.rd__zmeny2 { position: relative; }
.rd__zmeny2 ul { margin: 0; padding: 0; list-style: none; }
.rd__zmeny2 li { display: grid; grid-template-columns: 5.4em minmax(0, 1fr) 4.6em; gap: 14px; align-items: center;
  padding: 13px 2px; border-top: 1px solid var(--linka-jemna); font-size: 14px; }
.rd__zmeny2 li:first-child { border-top: 0; }
.rd__zmeny2 li.je-skryty { filter: blur(5px); user-select: none; pointer-events: none; }
.rd__zmenatext small { display: block; margin-top: 2px; }
.rd__zmeny2 li > span:last-child { text-align: right; font-weight: 600; }
.rd__zmeny2 .je-pokles { color: var(--zelena); }
.rd__zmeny2 .je-rust { color: #B4432C; }
.rd__zavoj { position: absolute; left: 0; right: 0; bottom: 0; height: 170px; display: flex; flex-direction: column;
  align-items: center; justify-content: flex-end; gap: 12px; padding-bottom: 6px; text-align: center;
  background: linear-gradient(180deg, rgba(255,255,255,0), #fff 55%); }
.rd__zavoj p { font-size: 14px; color: #4a5956; }

/* Rozcestník „Co vám pomůže doprodat dřív". */
.rd__cesty { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.rd__cesta { display: flex; flex-direction: column; gap: 11px; padding: 22px; border-radius: 18px; background: #FAF8F5; }
.rd__cesta.je-hlavni { background: radial-gradient(120% 80% at 90% 0%, #4A5D58, #344340 50%, #2C3936); color: #fff; }
.rd__cesta .rd__kicker { color: #8a6f52; }
.rd__cesta.je-hlavni .rd__kicker { color: var(--zlata); }
.rd__cesta h4 { margin: 0; font-size: 18px; font-weight: 500; line-height: 1.3; }
.rd__proc { padding: 11px 13px; border-radius: 12px; background: #fff; font-size: 13.5px; line-height: 1.5; color: #4a5956; }
.rd__cesta.je-hlavni .rd__proc { background: rgba(255,255,255,.08); color: rgba(255,255,255,.85); }
.rd__zisk { display: flex; gap: 7px; align-items: flex-start; font-size: 13px; line-height: 1.4; color: var(--zelena); }
.rd__cesta.je-hlavni .rd__zisk { color: #9FE0BF; }
.rd__zisk svg { flex: 0 0 auto; margin-top: 2px; }
.rd__cesta > button { margin-top: auto; align-self: flex-start; }

@media (max-width: 1000px) {
  .rd__dneshero { grid-template-columns: 1fr; gap: 26px; }
  .rd__dnesprstenec { flex-direction: row; align-items: center; justify-content: flex-start; gap: 18px; }
  .rd__prstenec { width: 132px; }
  .rd__prststred b { font-size: 30px; }
  .rd__cesty { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .rd__dneshero { padding: 26px 20px; }
  .rd__dneshero h2 { font-size: 25px; }
  .rd__dnescisla { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rd__tah2 { grid-template-columns: auto minmax(0, 1fr); row-gap: 12px; }
  .rd__tahsazka { grid-column: 2; text-align: left; }
  .rd .rd__tahcta { grid-column: 2; justify-self: start; }
  /* Na mobilu se mřížka láme na dva řádky po třech, a subgrid přes celou mřížku
     pak sloupce rozhodí: čísla se překrývala. Tady stačí obyčejný sloupec. */
  .rd__trsloupce, .rd__trpodily { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rd__trsloupce { grid-template-rows: auto; row-gap: 18px; }
  .rd__trsloupec { display: flex; flex-direction: column; justify-content: flex-end; grid-row: auto; }
  .rd__trpodily > span:nth-child(n+4) { display: none; }
  .rd__zmeny2 li { grid-template-columns: minmax(0, 1fr) 4.4em; row-gap: 3px; }
  .rd__zmeny2 .rd__zmenadatum { grid-column: 1 / 3; }
  .rd__zmenatext { grid-column: 1 / 3; }
}
@media (max-width: 520px) {
  .rd__dnesprstenec { flex-direction: column; align-items: flex-start; }
  .rd__misepole { gap: 5px; }
  .rd__misepole i { height: 30px; font-size: 11px; }
}

/* ---------- Onboarding ----------
   Celá obrazovka, ne okno uprostřed stránky: vlevo text a volby, vpravo scéna.
   Stavba podle původního mockupu, barvy a písmo z našich tokenů.
   Animace jsou tu schválně, protože nesou obsah kroku. */
.rd__ob { --ob-papir: #FAF8F5; --ob-mata: #9FE0BF;
  position: fixed; inset: 0; z-index: 70; display: flex; flex-direction: column;
  background: var(--pisek); color: var(--ink); animation: rd-obprijezd .28s ease both; }
@keyframes rd-obprijezd { from { opacity: 0; } to { opacity: 1; } }

.rd__obhlava { display: flex; align-items: center; gap: 20px; flex: 0 0 auto;
  padding: 16px 28px; border-bottom: 1px solid var(--linka-jemna); background: #fff; }
.rd__obznacka { display: flex; align-items: center; gap: 11px; }
.rd__obznacka img { height: 19px; width: auto; }
.rd__obznacka b { font-size: 15px; font-weight: 500; }
.rd__obkroky { list-style: none; margin: 0 auto; padding: 0; display: flex; gap: 6px; }
.rd__obkroky li { display: flex; align-items: center; gap: 8px; padding: 5px 13px 5px 5px; border-radius: 999px;
  font-size: 13px; color: var(--tlumene); white-space: nowrap; }
.rd__obkroky li i { display: flex; align-items: center; justify-content: center; width: 22px; height: 22px;
  border: 1.5px solid currentColor; border-radius: 50%; font-size: 12px; font-weight: 600; font-style: normal; }
.rd__obkroky li.je-hotovy { color: var(--zelena); }
.rd__obkroky li.je-hotovy i { background: var(--zelena); border-color: var(--zelena); color: #fff; }
.rd__obkroky li.je-tady { background: var(--pisek-2); color: var(--ink); font-weight: 600; }
.rd__obkroky li.je-tady i { background: var(--ink); border-color: var(--ink); color: #fff; }
.rd .rd__obzavri { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px; border: 0; border-radius: 999px;
  background: transparent; color: var(--tlumene); font-size: 13.5px; cursor: pointer; }
.rd .rd__obzavri:hover { background: var(--pisek-2); color: var(--ink); }

.rd__obtelo { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 540px) minmax(0, 1fr); }
.rd__obtext { overflow-y: auto; padding: 40px 44px 32px; background: #fff;
  border-right: 1px solid var(--linka-jemna); }
.rd__obtext h1 { margin: 0; font-size: clamp(26px, 2.6vw, 34px); font-weight: 500; line-height: 1.14;
  letter-spacing: -.4px; text-wrap: balance; }
.rd__oblead { margin: 12px 0 0; max-width: 46ch; font-size: 16px; line-height: 1.6; color: var(--tlumene); }
.rd__obobsah { margin-top: 24px; display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.rd__obobsah > * { width: 100%; }
.rd__obobsah > .rd__tlacitko { width: auto; }
.rd__obpod { margin: 18px 0 0; padding-top: 15px; border-top: 1px solid var(--linka-jemna);
  font-size: 13.5px; line-height: 1.55; color: var(--tlumene); }
.rd__obscena { position: relative; overflow: hidden; display: grid; place-items: center; padding: 32px;
  background: radial-gradient(circle at 50% 42%, #fff 0, var(--pisek) 68%); }
.rd__obscenaobsah { display: flex; flex-direction: column; align-items: center; gap: 18px;
  animation: rd-obnajezd .45s ease both; }
@keyframes rd-obnajezd { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.rd__obpopisek { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13.5px; color: var(--tlumene); }
.rd__obpopisek b { font-size: 16px; color: var(--ink); }
.rd__obziva { width: 8px; height: 8px; border-radius: 50%; background: var(--zelena); animation: rd-tep 1.8s ease-in-out infinite; }

.rd__obpata { flex: 0 0 auto; display: flex; align-items: center; gap: 18px;
  padding: 14px 28px; border-top: 1px solid var(--linka-jemna); background: #fff; }
.rd__obpruh { flex: 1; height: 4px; border-radius: 2px; background: var(--pisek-2); overflow: hidden; }
.rd__obpruh span { display: block; height: 100%; background: var(--zelena); transition: width .45s ease; }

/* položky vlevo */
.rd__obradky, .rd__obvolby, .rd__obmerime, .rd__obstavba { display: flex; flex-direction: column; gap: 8px;
  margin: 0; padding: 0; list-style: none; }
.rd__obradky li, .rd__obmerime li, .rd__obstavba li { display: flex; align-items: center; gap: 13px;
  padding: 13px 16px; border: 1px solid var(--linka-jemna); border-radius: 14px; }
.rd__obradky li.je-chybi { background: rgba(212,165,116,.16); border-color: rgba(212,165,116,.5); }
.rd__obradky b, .rd__obvolby b, .rd__obmerime b, .rd__obstavba b { display: block; font-size: 15px; font-weight: 500; }
.rd__obradky small, .rd__obvolby small, .rd__obmerime small { display: block; margin-top: 2px; font-size: 13px;
  line-height: 1.45; color: var(--tlumene); }
.rd__obradky .rd__projektnahled { width: 40px; height: 40px; border-radius: 10px; flex: 0 0 auto; }
.rd__obradky li > span:nth-child(2), .rd__obvolby li span:nth-child(2) { flex: 1; min-width: 0; }
.rd__obvolby li button { display: flex; width: 100%; align-items: center; gap: 13px; padding: 12px 16px;
  border: 1px solid var(--linka-jemna); border-radius: 14px; background: transparent; text-align: left; cursor: pointer;
  font: inherit; color: inherit; transition: border-color .15s ease, background .15s ease; }
.rd__obvolby li button:hover { border-color: var(--linka); }
.rd__obvolby li button[aria-pressed="true"] { background: var(--ob-papir); border-color: var(--zelena); }
.rd__obvolby li button > .cislo { flex: 0 0 auto; font-size: 13px; color: var(--tlumene); }
.rd__obfajfka { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 24px; height: 24px;
  border: 1.5px solid var(--linka); border-radius: 50%; color: transparent; transition: background .18s ease, color .18s ease; }
.rd__obfajfka.je-on { background: var(--zelena); border-color: var(--zelena); color: #fff; }
.rd__obikona { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px;
  border-radius: 12px; background: var(--pisek-2); color: var(--ink); }
.rd__obkdy { display: flex; flex-direction: column; gap: 7px; font-size: 13.5px; color: var(--tlumene); }
.rd__obkdy .rd__vyber { width: 100%; }
.rd__obstavba li.je-bezi { border-color: var(--zelena); }
.rd__obstavba li:not(.je-hotovy):not(.je-bezi) { opacity: .5; }

/* scéna: čtení ceníku */
.rd__obcenik { position: relative; width: min(420px, 100%); overflow: hidden;
  border: 1px solid var(--linka-jemna); border-radius: 16px; background: #fff; box-shadow: 0 18px 40px rgba(26,34,32,.08); }
.rd__obcenikhlava { display: flex; justify-content: space-between; gap: 12px; padding: 12px 16px;
  border-bottom: 1px solid var(--linka-jemna); font-size: 12px; color: var(--tlumene); }
.rd__obcenikradek { display: grid; grid-template-columns: 72px 54px minmax(0, 1fr) 20px; align-items: center; gap: 10px;
  padding: 9px 16px; font-size: 13px; opacity: .35; transition: opacity .35s ease, background .35s ease; }
.rd__obcenikradek .cislo { text-align: right; }
.rd__obcenikradek i { display: flex; align-items: center; justify-content: center; width: 18px; height: 18px;
  border-radius: 50%; background: var(--zelena); color: #fff; opacity: 0; transform: scale(.6); transition: opacity .3s ease, transform .3s ease; }
.rd__obcenikradek.je-hotovy { opacity: 1; }
.rd__obcenikradek.je-hotovy i { opacity: 1; transform: none; }
.rd__obpaprsek { position: absolute; left: 0; right: 0; height: 90px; pointer-events: none;
  background: linear-gradient(180deg, rgba(159,224,191,0) 0, rgba(159,224,191,.35) 50%, rgba(159,224,191,0) 100%);
  animation: rd-obpaprsek 2.6s ease-in-out infinite; }
@keyframes rd-obpaprsek { 0% { top: -90px; } 100% { top: 100%; } }

/* scéna: radar */
.rd__obradar { position: relative; display: grid; place-items: center; }
.rd__obkruh { position: absolute; border: 1px solid var(--linka-jemna); border-radius: 50%; }
.rd__obkruh em { position: absolute; left: 50%; top: -9px; transform: translateX(-50%); padding: 0 6px;
  background: var(--pisek); font-style: normal; font-size: 10.5px; color: var(--tlumene); }
.rd__obmetla { position: absolute; inset: 0; border-radius: 50%; pointer-events: none;
  background: conic-gradient(from 0deg, rgba(52,67,64,.14) 0deg, rgba(52,67,64,0) 70deg, rgba(52,67,64,0) 360deg);
  animation: rd-obmetla 5s linear infinite; }
@keyframes rd-obmetla { to { transform: rotate(360deg); } }
.rd__obja { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 500; }
.rd__obja i { width: 13px; height: 13px; border-radius: 50%; background: var(--ink); box-shadow: 0 0 0 5px rgba(52,67,64,.12); }
.rd__obspoj { position: absolute; left: 0; top: 0; pointer-events: none; }
.rd__obspoj line { stroke: rgba(52,67,64,.22); stroke-width: 1; stroke-dasharray: 3 4; }
.rd__obbod { position: absolute; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; gap: 4px;
  animation: rd-obbod .5s ease both; animation-delay: var(--zpozdeni, 0s); }
@keyframes rd-obbod { from { opacity: 0; transform: translate(-50%, -50%) scale(.5); } to { opacity: 1; } }
.rd__obbod i { width: 9px; height: 9px; border-radius: 50%; background: #fff; border: 1.5px solid var(--linka); }
.rd__obbod.je-on i { background: var(--zlata); border-color: var(--zlata); box-shadow: 0 0 0 4px rgba(212,165,116,.2); }
.rd__obbod > span { font-size: 11px; color: var(--tlumene); text-align: center; white-space: nowrap; }
.rd__obbod.je-on > span { color: var(--ink); font-weight: 500; }
.rd__obbod small { display: block; font-size: 10px; color: var(--tlumene); font-weight: 400; }

/* scéna: pondělní e-mail */
.rd__obtelefon { position: relative; width: 268px; padding: 16px 14px 18px; border-radius: 28px; background: #fff;
  border: 1px solid var(--linka-jemna); box-shadow: 0 22px 50px rgba(26,34,32,.12); }
.rd__obvyrez { display: block; width: 74px; height: 5px; margin: 0 auto 14px; border-radius: 3px; background: var(--pisek-2); }
.rd__obpush { display: flex; gap: 10px; padding: 10px 12px; border-radius: 14px; background: var(--ob-papir);
  font-size: 11.5px; line-height: 1.4; animation: rd-obpush .5s ease both .2s; }
@keyframes rd-obpush { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
.rd__obpush b { display: block; font-size: 11px; color: var(--tlumene); font-weight: 500; }
.rd__obappka { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 26px; height: 26px;
  border-radius: 8px; background: var(--ink); color: #fff; }
.rd__obmail { margin-top: 12px; padding: 13px 12px; border: 1px solid var(--linka-jemna); border-radius: 14px; }
.rd__obpredmet { margin: 0; font-size: 13.5px; font-weight: 500; line-height: 1.35; }
.rd__obmailkpi { display: flex; gap: 10px; margin: 11px 0; }
.rd__obmailkpi span { flex: 1; display: flex; flex-direction: column; gap: 2px; padding: 8px 9px; border-radius: 10px;
  background: var(--ob-papir); font-size: 10.5px; color: var(--tlumene); }
.rd__obmailkpi b { font-size: 16px; color: var(--ink); }
.rd__obmailradek { display: flex; align-items: center; gap: 7px; margin: 6px 0 0; font-size: 11.5px; color: var(--tlumene);
  animation: rd-obnajezd .45s ease both; animation-delay: calc(.35s + var(--i) * .16s); }
.rd__obmailradek i { flex: 0 0 auto; width: 5px; height: 5px; border-radius: 50%; background: var(--zlata); }
.rd__obmailcta { display: inline-block; margin-top: 12px; padding: 7px 13px; border-radius: 999px;
  background: var(--ink); color: #fff; font-size: 11.5px; }

/* scéna: skládání přehledu */
.rd__obmini { width: min(400px, 100%); padding: 16px; border: 1px solid var(--linka-jemna); border-radius: 16px;
  background: #fff; box-shadow: 0 18px 40px rgba(26,34,32,.08); }
.rd__obminihlava { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.rd__obminihlava span { height: 7px; border-radius: 4px; background: var(--pisek-2); }
.rd__obminihlava span:first-child { width: 58%; }
.rd__obminihlava span:nth-child(2) { width: 84%; }
.rd__obminihlava span:last-child { width: 40%; }
.rd__obminikpi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.rd__obminikpi div { display: flex; flex-direction: column; gap: 3px; min-height: 54px; padding: 9px 11px;
  border-radius: 11px; background: var(--ob-papir); font-size: 10.5px; color: var(--tlumene);
  animation: rd-obnajezd .4s ease both; animation-delay: calc(var(--i) * .12s); }
.rd__obminikpi b { font-size: 16px; color: var(--ink); }
.rd__obminigraf { display: flex; align-items: flex-end; gap: 6px; height: 74px; margin-top: 12px; }
.rd__obminigraf span { flex: 1; border-radius: 4px 4px 0 0; background: var(--ob-mata);
  transition: height .6s cubic-bezier(.2,.8,.3,1); transition-delay: calc(var(--i) * .07s); }
.rd__obmini.je-hotovy .rd__obminigraf span { background: var(--zelena); }

/* scéna: úplnost listingu */
.rd__obprstenec { position: relative; display: grid; place-items: center; width: 186px; height: 186px; border-radius: 50%;
  background: conic-gradient(var(--zelena) calc(var(--podil) * 1%), var(--pisek-2) 0);
  transition: background .6s ease; }
.rd__obprstenec::after { content: ""; position: absolute; inset: 13px; border-radius: 50%; background: #fff; }
.rd__obprstenec b, .rd__obprstenec small { position: relative; z-index: 1; }
.rd__obprstenec b { font-size: 34px; letter-spacing: -1px; }
.rd__obprstenec small { font-size: 11.5px; color: var(--tlumene); }
.rd__obkarta { display: flex; align-items: center; gap: 13px; width: min(340px, 100%); padding: 13px 15px;
  border: 1px solid var(--linka-jemna); border-radius: 16px; background: #fff; box-shadow: 0 14px 34px rgba(26,34,32,.08); }
.rd__obkarta .rd__projektnahled { width: 52px; height: 52px; border-radius: 12px; flex: 0 0 auto; }
.rd__obkarta > span { min-width: 0; }
.rd__obkarta b { display: block; font-size: 15px; font-weight: 500; }
.rd__obkarta small { display: block; margin-top: 2px; font-size: 12px; color: var(--tlumene); }
.rd__obstitek { display: inline-block; margin-top: 7px; padding: 3px 9px; border-radius: 999px;
  background: var(--pisek-2); font-size: 11px; color: var(--tlumene); }
.rd__obstitek.je-on { background: rgba(159,224,191,.4); color: var(--ink); }

/* scéna: schránka */
.rd__obschranka { width: min(380px, 100%); overflow: hidden; border: 1px solid var(--linka-jemna); border-radius: 16px;
  background: #fff; box-shadow: 0 18px 40px rgba(26,34,32,.08); }
.rd__obschrankahlava { display: flex; align-items: center; gap: 9px; padding: 12px 15px;
  border-bottom: 1px solid var(--linka-jemna); font-size: 12px; color: var(--tlumene); }
.rd__obzprava { display: flex; flex-direction: column; gap: 3px; padding: 13px 15px; border-bottom: 1px solid var(--linka-jemna); }
.rd__obzprava:last-child { border-bottom: 0; }
.rd__obzprava span { font-size: 11px; color: var(--tlumene); }
.rd__obzprava b { font-size: 13.5px; font-weight: 500; }
.rd__obzprava small { font-size: 11.5px; line-height: 1.45; color: var(--tlumene); }
.rd__obzprava.je-nova { background: rgba(159,224,191,.18); animation: rd-obnova .5s ease both; }
@keyframes rd-obnova { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
.rd__obprazdno { padding: 22px 15px; font-size: 12px; color: var(--tlumene); text-align: center;
  border-bottom: 1px solid var(--linka-jemna); }

/* scéna: tři počítadla */
.rd__obpocitadla { display: flex; gap: 10px; }
.rd__obpocitadla div { display: flex; flex-direction: column; gap: 4px; min-width: 108px; padding: 15px 16px;
  border-radius: 14px; background: #fff; border: 1px solid var(--linka-jemna); font-size: 11.5px; color: var(--tlumene);
  animation: rd-obnajezd .45s ease both; animation-delay: calc(var(--i) * .13s); }
.rd__obpocitadla b { font-size: 26px; color: var(--ink); }

@media (max-width: 1020px) {
  .rd__obtelo { grid-template-columns: minmax(0, 1fr); overflow-y: auto; }
  .rd__obtext { border-right: 0; border-bottom: 1px solid var(--linka-jemna); padding: 28px 20px 24px; }
  .rd__obscena { padding: 26px 16px 34px; min-height: auto; }
  .rd__obkroky li:not(.je-tady) span { display: none; }
}
@media (max-width: 640px) {
  .rd__obhlava, .rd__obpata { padding: 12px 16px; gap: 12px; }
  .rd__obznacka b { display: none; }
  .rd__obkroky { gap: 4px; }
  .rd__obkroky li { padding: 4px; font-size: 0; }
  .rd__obkroky li.je-tady { padding: 4px 11px 4px 4px; font-size: 12.5px; }
  .rd__obtext h1 { font-size: 24px; }
  .rd__oblead { font-size: 15px; }
  .rd .rd__obzavri span { display: none; }
  .rd__obtelefon { width: 100%; max-width: 268px; }
}

/* ---------- Resimo Ads: prodejní stránka pro účet jen s Data Studiem ----------
   Postaveno podle handoffu „prodejní Resimo Design System“. Vlastní sada tokenů,
   protože blok má jiný podklad než zbytek panelu; barvy jsou z designového systému. */
.rd__pa { --pa-ink: #344340; --pa-ink2: #4a5956; --pa-muted: #6b7472; --pa-muted2: #8a918f;
  --pa-papir: #FAF8F5; --pa-pisek: #F1EAE1; --pa-pisekl: #DCCFBF; --pa-linka: #F1EDE9;
  --pa-zlata: #D4A574; --pa-bronz: #8a6f52; --pa-zelena: #1D7F57; --pa-zelenat: #E7F2EC;
  --pa-menta: #9FE0BF; --pa-risk: #B4432C; --pa-riskt: #FBEAE4; --pa-riskl: #F2A58E;
  display: flex; flex-direction: column; gap: 20px; }
.rd__pa .rd__karta { border-radius: 22px; padding: clamp(22px, 3.6vw, 44px); }
.rd__pa h2 { margin: 10px 0 0; font-size: clamp(26px, 3.2vw, 40px); line-height: 1.1; font-weight: 500;
  letter-spacing: -.01em; text-wrap: balance; }
.rd__pakicker { margin: 0; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--pa-bronz); }
.rd__palead { margin: 12px 0 0; max-width: 620px; font-size: 16.5px; line-height: 1.55; color: var(--pa-ink2); text-wrap: pretty; }
.rd__pafajfka { flex: none; margin-top: 2px; }

/* hero */
.rd__pahero { position: relative; overflow: hidden; border-radius: 26px; color: #fff;
  background: radial-gradient(80% 120% at 100% 0%, #526761 0%, #344340 48%, #26312F 100%);
  padding: clamp(24px, 4vw, 52px); display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 52px); align-items: center; box-shadow: 0 30px 60px -30px rgba(38,49,47,.85); }
.rd__paodznak { display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 12px; border-radius: 999px;
  background: rgba(255,255,255,.1); font-size: 12.5px; color: rgba(255,255,255,.85); }
.rd__paodznak b { color: var(--pa-zlata); font-weight: 500; letter-spacing: .08em; text-transform: uppercase; font-size: 11.5px; }
.rd__pahero h1 { margin: 18px 0 0; font-size: clamp(30px, 4.2vw, 52px); line-height: 1.05; font-weight: 400;
  letter-spacing: -.015em; text-wrap: balance; }
.rd .rd__pacislo { font-family: "Inter", sans-serif; font-weight: 700; color: var(--pa-zlata); letter-spacing: -.02em; }
.rd__pazapor { color: var(--pa-riskl); font-weight: 500; }
.rd__pahero > div > p { margin: 18px 0 0; max-width: 520px; font-size: 17px; line-height: 1.55; color: rgba(255,255,255,.8); }
.rd__paakce { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 26px; }
.rd .rd__paduch { display: inline-flex; align-items: center; justify-content: center; height: 46px; padding: 0 24px;
  border-radius: 23px; border: 1px solid rgba(255,255,255,.32); background: transparent; color: #fff;
  font: inherit; font-size: 15px; font-weight: 500; cursor: pointer; }
.rd .rd__paduch:hover { background: rgba(255,255,255,.08); }
.rd__paparam { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 14px; font-size: 13.5px; color: rgba(255,255,255,.6); }
.rd__paparam span { display: flex; align-items: center; gap: 6px; }
.rd__paparam .rd__pafajfka { margin-top: 0; }

/* žebříček zájmu */
.rd__patabule { padding: 18px; border-radius: 20px; background: var(--pa-papir); color: var(--pa-ink);
  box-shadow: 0 30px 60px -24px rgba(0,0,0,.55); }
.rd__patabulehlava { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 12px; }
.rd__patabulehlava b { font-size: 14.5px; font-weight: 500; }
.rd__patabulehlava small { display: flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px;
  background: var(--pa-linka); font-size: 11.5px; color: var(--pa-muted); }
.rd__pazebricek { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.rd__pazebricek li { display: grid; grid-template-columns: 20px minmax(0, 1fr) 54px; align-items: center; gap: 10px;
  padding: 9px 10px; border-radius: 12px; background: #fff; font-size: 14px; }
.rd__papozice { font-size: 11.5px; color: var(--pa-muted2); }
.rd__pajmeno { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.rd__pajmeno > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rd__pajmeno small { font-size: 12px; color: #7d2c1c; }
.rd__papruh { height: 5px; border-radius: 3px; background: var(--pa-linka); overflow: hidden; }
.rd__papruh i { display: block; height: 100%; border-radius: 3px; background: var(--pa-ink); }
.rd__pahodnota { font-size: 13.5px; text-align: right; }
.rd__pazebricek li.je-ja { background: var(--pa-riskt); box-shadow: inset 0 0 0 1.5px rgba(180,67,44,.35); }
.rd__pazebricek li.je-ja .rd__pajmeno > span { font-weight: 600; }
.rd__pazebricek li.je-ja .rd__pahodnota { color: var(--pa-risk); }
.rd__patabulepata { display: flex; justify-content: space-between; gap: 12px; margin-top: 12px; font-size: 12.5px; color: var(--pa-muted); }
.rd__patabulepata b { color: var(--pa-ink); }

/* proč Resimo */
.rd__paproc { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.rd__pasrovnani { display: grid; grid-template-columns: 1fr 1fr; border-radius: 18px; overflow: hidden;
  box-shadow: inset 0 0 0 1px var(--pa-linka); }
.rd__pasrovnani > div { display: flex; gap: 10px; align-items: flex-start; padding: 16px 18px;
  font-size: 14.5px; line-height: 1.45; border-top: 1px solid var(--pa-linka); }
.rd__pasrovnani > div:nth-child(-n+2) { border-top: 0; }
.rd__pazahlavi { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--pa-muted); background: var(--pa-papir); }
.rd__pazahlavi.je-my { color: var(--pa-zelena); background: var(--pa-zelenat); }
.rd__paoni { color: var(--pa-muted); }
.rd__pamy { background: #FBFDFC; }

/* jak to funguje */
.rd__pakroky { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 28px; }
.rd__pakrok { display: flex; flex-direction: column; gap: 8px; padding: 22px 20px; border-radius: 18px; background: var(--pa-papir); }
.rd__pakdy { font-family: "Inter", sans-serif; font-weight: 600; font-size: 12px; letter-spacing: .04em;
  text-transform: uppercase; color: var(--pa-bronz); }
.rd__pakrok h3 { margin: 0; font-size: 19px; font-weight: 500; line-height: 1.25; }
.rd__pakrok p { margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--pa-ink2); }
.rd__paodvas { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--pa-linka); font-size: 13px; color: var(--pa-muted); }
.rd__paodvas b { color: var(--pa-ink); font-weight: 500; }

/* dosah */
.rd__padosah { padding: clamp(22px, 3.6vw, 44px); border-radius: 22px; background: var(--pa-pisek); }
.rd__pacisla { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin-top: 28px;
  padding-top: 24px; border-top: 1px solid var(--pa-pisekl); }
.rd__pacisla span { display: block; font-size: clamp(30px, 3.8vw, 48px); line-height: 1; letter-spacing: -.02em; }
.rd__pacisla small { display: block; margin-top: 8px; font-size: 14px; line-height: 1.4; color: var(--pa-ink2); }

/* co uvidíte v aplikaci */
.rd__paaplikace { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(24px, 4vw, 52px); align-items: center; }
.rd__pazisky { list-style: none; margin: 22px 0 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.rd__pazisky li { display: flex; gap: 12px; font-size: 15.5px; line-height: 1.45; }
.rd__pazisky b { display: block; font-weight: 500; }
.rd__pazisky small { display: block; margin-top: 2px; font-size: 13.5px; color: var(--pa-muted); }
.rd__panahled { padding: 16px; border-radius: 18px; background: var(--pa-papir); box-shadow: inset 0 0 0 1px var(--pa-linka); }
.rd__panahledhlava { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px;
  font-size: 13.5px; font-weight: 500; }
.rd__panahledhlava small { display: flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px;
  background: #fff; font-size: 11.5px; font-weight: 400; color: var(--pa-muted); }
.rd__patrychtyr { display: flex; flex-direction: column; gap: 6px; }
.rd__patrychtyr > div { display: grid; grid-template-columns: minmax(0, 1fr) 64px; gap: 10px; align-items: center; font-size: 13px; }
.rd__patrpruh { display: flex; align-items: center; height: 30px; padding: 0 10px; border-radius: 8px;
  white-space: nowrap; overflow: hidden; }
.rd__pakombo { display: flex; gap: 10px; margin-top: 12px; padding: 12px 14px; border-radius: 12px; background: #fff;
  font-size: 13.5px; line-height: 1.45; }
.rd__pakombo b { font-weight: 600; }

/* cena */
.rd__pacena { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 48px); align-items: stretch; }
.rd__paplan { display: flex; flex-direction: column; gap: 16px; padding: clamp(22px, 3vw, 32px); border-radius: 20px; color: #fff;
  background: radial-gradient(120% 80% at 90% 0%, #4A5D58, #344340 50%, #2C3936); }
.rd__paplan .rd__pakicker { color: var(--pa-zlata); }
.rd__paplancena { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.rd .rd__paplancena .cislo { font-family: "Inter", sans-serif; font-weight: 600; font-size: clamp(40px, 5vw, 56px);
  line-height: 1; letter-spacing: -.02em; }
.rd__paplancena small { font-size: 14px; color: rgba(255,255,255,.7); }
.rd__paplan ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.rd__paplan li { display: flex; gap: 10px; font-size: 15px; line-height: 1.4; }
.rd__paplan .rd__cta { margin-top: auto; }
.rd__pakalkulacka { display: flex; flex-direction: column; gap: 18px; justify-content: center; }
.rd__pakalkulacka h3 { margin: 0; font-size: clamp(20px, 2.2vw, 26px); font-weight: 500; line-height: 1.25; text-wrap: balance; }
.rd__pastepper { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: 14.5px; color: var(--pa-ink2); }
.rd__pastep { display: flex; align-items: center; border-radius: 999px; background: var(--pa-papir);
  box-shadow: inset 0 0 0 1px var(--pa-pisekl); }
.rd__pastep button { width: 40px; height: 40px; border: 0; border-radius: 50%; background: transparent; cursor: pointer;
  font-family: "Inter", sans-serif; font-weight: 500; font-size: 20px; color: var(--pa-ink); }
.rd__pastep button:hover { background: var(--pa-linka); }
.rd__pastep .cislo { min-width: 28px; text-align: center; font-size: 17px; }
.rd__pasoucty { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.rd__pasoucty div { padding: 14px 16px; border-radius: 14px; background: var(--pa-papir); }
.rd__pasoucty small { display: block; font-size: 12.5px; color: var(--pa-muted); }
.rd__pasoucty .cislo { display: block; margin-top: 4px; font-size: 22px; }
.rd__pasoucty .je-zvyraznene { grid-column: 1 / -1; background: var(--pa-zelenat); }
.rd__pasoucty .je-zvyraznene .cislo { color: var(--pa-zelena); }

/* otázky */
.rd__pafaq { display: flex; flex-direction: column; margin-top: 22px; }
.rd__pafaq details { border-top: 1px solid var(--pa-linka); }
.rd__pafaq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center;
  gap: 16px; padding: 18px 0; font-size: 17px; font-weight: 500; }
.rd__pafaq summary::-webkit-details-marker { display: none; }
.rd__pafaq summary::after { content: ""; flex: none; width: 12px; height: 12px;
  border-right: 2px solid var(--pa-ink); border-bottom: 2px solid var(--pa-ink);
  transform: rotate(45deg) translate(-3px, -3px); transition: transform .2s; }
.rd__pafaq details[open] summary::after { transform: rotate(225deg) translate(-3px, -3px); }
.rd__pafaq p { margin: 0 0 18px; max-width: 720px; font-size: 15px; line-height: 1.6; color: var(--pa-ink2); }

/* závěr */
.rd__pazaver { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap;
  padding: clamp(28px, 4.4vw, 56px); border-radius: 26px; color: #fff;
  background: radial-gradient(80% 120% at 0% 100%, #526761 0%, #344340 50%, #26312F 100%); }
.rd__pazaver h2 { margin: 0; max-width: 620px; font-size: clamp(26px, 3.4vw, 42px); line-height: 1.1; font-weight: 400; }
.rd__pazaver h2 b { font-weight: 600; color: var(--pa-zlata); }
.rd__pazaver p { margin: 12px 0 0; font-size: 15px; color: rgba(255,255,255,.72); }
.rd__pazaverakce { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.rd__pazaverakce small { font-size: 13px; color: rgba(255,255,255,.6); }

@media (max-width: 900px) {
  .rd__pahero, .rd__paproc, .rd__paaplikace, .rd__pacena { grid-template-columns: 1fr; }
  .rd__pakroky { grid-template-columns: 1fr; }
  .rd__pacisla { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .rd__pasrovnani { grid-template-columns: 1fr; }
  .rd__pazahlavi.je-oni, .rd__paoni { display: none; }
  .rd__pasoucty { grid-template-columns: 1fr; }
  .rd__pahero h1 { font-size: 30px; }
  .rd__paakce .rd__cta, .rd .rd__paduch { width: 100%; }
}