/* Палитра и типографика — из дизайн-системы приложения v2.0.
   Страница намеренно однотёмная: продукт про ночь, светлой темы у него нет,
   и лендинг не должен обещать того, чего в приложении не существует. */
:root{
  --bg0:#120D26; --bg1:#1A1330; --bg2:#221840;
  --violet:#9D7BFF; --violet2:#C4A9FF; --violet-dim:#6B4FBB;
  --gold:#E8C877; --gold-soft:#F3DFA8;
  --text:#EEE9FF; --dim:#B7AEE0; --mute:#918AAE;
  --stroke:rgba(255,255,255,.10);
  --stroke-2:rgba(255,255,255,.18);
  --panel:rgba(255,255,255,.05);
  --panel-2:rgba(255,255,255,.08);

  --display:"Cormorant","Iowan Old Style",Georgia,serif;
  --ui:"Onest","Segoe UI",system-ui,-apple-system,sans-serif;

  --measure:63ch;
  --edge:clamp(18px,5vw,64px);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}

body{
  margin:0;background:var(--bg0);color:var(--text);
  font-family:var(--ui);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden; /* страховка от случайного горизонтального скролла */
}

#sky{position:fixed;inset:0;z-index:0;pointer-events:none}
.page{position:relative;z-index:1}
.wrap{max-width:1120px;margin:0 auto;padding-inline:var(--edge)}

a{color:var(--violet2);text-decoration-color:rgba(157,123,255,.4);text-underline-offset:3px}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}

h1,h2,h3{font-family:var(--display);font-weight:600;text-wrap:balance;margin:0;line-height:1.1}
h1{font-size:clamp(36px,8vw,80px);letter-spacing:-.015em}
h2{font-size:clamp(26px,5vw,40px)}
h3{font-size:19px;line-height:1.3}

.eyebrow{
  font-family:var(--ui);font-size:11px;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--mute);margin:0;
}

/* ── Шапка ─────────────────────────────────────────────────────────── */
.top{
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;padding-block:20px;flex-wrap:wrap;
}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-size:21px}
.brand svg{width:32px;height:32px;border-radius:9px;display:block;flex:none}
.top-right{display:flex;align-items:center;gap:22px;margin-left:auto}
.top nav{display:flex;gap:24px;font-size:14px}
.top nav a{color:var(--dim);text-decoration:none;white-space:nowrap}
.top nav a:hover{color:var(--text)}
@media (max-width:820px){.top nav{display:none}}

/* ── Герой ─────────────────────────────────────────────────────────── */
.hero{
  display:grid;
  /* Вторая дорожка задана числом, а не auto. При auto браузер меряет
     max-content телефона, где width:min(302px,100%) не от чего считать:
     он заявляет ~1077px, дорожка забирает 915px, а текстовая колонка
     minmax(0,1fr) схлопывается в ноль — и заголовок рвётся по слову
     в строку. На узких экранах колонка одна, там это неважно. */
  grid-template-columns:minmax(0,1fr) 302px;
  gap:clamp(34px,6vw,80px);align-items:center;
  padding-block:clamp(28px,6vw,72px) clamp(44px,8vw,92px);
}
@media (max-width:920px){
  .hero{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center}
  .hero .lede{margin-inline:auto}
  .hero .cta-row{justify-content:center}
}
.hero h1 em{font-style:italic;color:var(--gold-soft)}
.lede{font-size:clamp(16px,2.2vw,20px);color:var(--dim);max-width:46ch;margin:20px 0 0}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:30px}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:52px;padding:14px 26px;border-radius:14px;
  font-family:var(--ui);font-size:15px;font-weight:600;
  text-decoration:none;border:0;cursor:pointer;
}
.btn-primary{
  color:#fff;background:linear-gradient(135deg,var(--violet-dim),var(--violet));
  box-shadow:0 10px 30px -12px rgba(157,123,255,.9);
}
.btn-primary:hover{filter:brightness(1.08)}
.btn-ghost{color:var(--text);background:transparent;border:1px solid var(--stroke-2)}
.btn-ghost:hover{background:var(--panel)}
@media (max-width:420px){.btn{width:100%}}

.free-note{font-size:13.5px;color:var(--mute);margin:14px 0 0}
.free-note b{color:var(--gold);font-weight:600}

/* ── Телефон ───────────────────────────────────────────────────────── */
.phone{
  width:302px;max-width:100%;flex:none;
  border-radius:38px;padding:10px;
  background:linear-gradient(160deg,#3b2f63,#1a1330 60%);
  border:1px solid var(--stroke-2);
  box-shadow:0 40px 90px -30px rgba(0,0,0,.9),0 0 0 1px rgba(0,0,0,.4);
}
.screen{
  border-radius:29px;overflow:hidden;text-align:left;
  background:radial-gradient(120% 80% at 60% 0%,#2a1e56 0%,var(--bg0) 62%);
  padding:18px 16px 16px;
}
.status{
  display:flex;justify-content:space-between;font-size:11px;color:var(--mute);
  margin-bottom:14px;font-variant-numeric:tabular-nums;
}
/* Порядок правил важен: .screen p идёт ниже и специфичнее (класс + тег),
   поэтому заголовок карточки описывается через .screen p.screen-title —
   иначе кегль 25px молча перебивался на 12.5px, и засечный шрифт в размере
   основного текста выглядел как сбой вёрстки. */
.screen p{font-size:12.5px;line-height:1.65;color:var(--dim);margin:0 0 12px}
.screen p.screen-title{
  font-family:var(--display);font-size:25px;font-weight:600;
  margin:0 0 10px;color:var(--gold-soft);line-height:1.15;
}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.chip{
  font-size:10.5px;padding:5px 9px;border-radius:999px;
  background:var(--panel-2);border:1px solid var(--stroke);color:var(--violet2);
}
.cta-card{
  border-radius:13px;padding:11px 12px;
  background:rgba(232,200,119,.10);border:1px solid rgba(232,200,119,.32);
}
.cta-label{
  display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold);margin-bottom:5px;
}
.cta-card p{margin:0;font-size:12px;color:var(--gold-soft);line-height:1.5}

/* ── Секции ────────────────────────────────────────────────────────── */
section{padding-block:clamp(46px,8vw,92px)}
.section-head{max-width:var(--measure);margin-bottom:clamp(28px,4vw,40px)}
.section-head h2{margin-top:12px}
.section-head p:not(.eyebrow){color:var(--dim);margin:14px 0 0}

/* Шаги: настоящая последовательность, поэтому нумерация здесь не декор */
.steps{
  list-style:none;margin:0;padding:0;display:grid;gap:1px;
  background:var(--stroke);border-block:1px solid var(--stroke);
}
@media (min-width:560px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (min-width:900px){.steps{grid-template-columns:repeat(4,1fr)}}
.steps li{background:var(--bg0);padding:26px 22px 28px;display:flex;flex-direction:column;gap:8px}
.steps .num{
  font-family:var(--display);font-size:32px;color:var(--violet-dim);
  line-height:1;font-variant-numeric:tabular-nums;
}
.steps p{margin:0;font-size:14px;color:var(--mute);line-height:1.55}

/* Возможности */
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.feat{padding:24px;border-radius:16px;background:var(--panel);border:1px solid var(--stroke)}
.feat .k{
  font-family:var(--display);font-style:italic;font-size:15px;
  color:var(--gold);display:block;margin-bottom:12px;
}
.feat h3{margin-bottom:8px}
.feat p{margin:0;font-size:14px;color:var(--mute);line-height:1.6}

/* Пример толкования */
.sample{display:grid;gap:clamp(26px,4vw,52px);align-items:start;grid-template-columns:minmax(0,1fr)}
@media (min-width:900px){.sample{grid-template-columns:.85fr 1.15fr}}
.dream-quote{
  font-family:var(--display);font-style:italic;font-size:clamp(20px,3.4vw,28px);
  line-height:1.4;color:var(--text);margin:0;
  padding-left:20px;border-left:2px solid var(--gold);
}
.dream-quote cite{
  display:block;font-family:var(--ui);font-style:normal;font-size:12px;
  color:var(--mute);margin-top:16px;letter-spacing:.04em;
}
.readout{display:grid;gap:0;margin:0}
.row{
  display:grid;grid-template-columns:120px minmax(0,1fr);gap:18px;
  padding:15px 0;border-top:1px solid var(--stroke);
}
.row:last-child{border-bottom:1px solid var(--stroke)}
.row dt{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);padding-top:3px}
.row dd{margin:0;font-size:15px;color:var(--text);line-height:1.55}
.row dd b{color:var(--violet2);font-weight:600}
@media (max-width:620px){.row{grid-template-columns:minmax(0,1fr);gap:5px}}

/* Цены */
.plans{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));align-items:start}
.plan{padding:26px 24px;border-radius:18px;border:1px solid var(--stroke);background:var(--panel)}
.plan.best{border-color:rgba(232,200,119,.45);background:linear-gradient(170deg,rgba(232,200,119,.10),var(--panel) 55%)}
.plan .name{font-family:var(--display);font-size:22px;font-weight:600;margin:0}
.plan .price{font-size:32px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.02em;margin:10px 0 2px;white-space:nowrap}
.plan .per{font-size:13px;color:var(--mute);margin:0}
.plan ul{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:9px;font-size:14px;color:var(--dim)}
.plan li{display:flex;gap:9px;align-items:baseline}
.plan li::before{content:"·";color:var(--gold);font-weight:700}
.tag{
  display:inline-block;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold);margin-bottom:6px;
}

/* Оплата: сама оплата и QR — на странице /pay (pay.html). */
.pay{
  display:flex;flex-wrap:wrap;gap:18px 32px;align-items:center;justify-content:space-between;
  padding:clamp(22px,4vw,32px);border-radius:18px;
  border:1px solid rgba(232,200,119,.30);
  background:linear-gradient(170deg,rgba(232,200,119,.08),var(--panel) 60%);
}
.pay-prices{display:flex;flex-wrap:wrap;gap:10px 22px;margin:0;font-size:14px;color:var(--mute)}
.pay-prices b{font-size:24px;color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}

/* Приватность */
.privacy{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.privacy div{padding:20px 0 0;border-top:2px solid var(--violet-dim)}
.privacy h3{font-family:var(--ui);font-size:15px;font-weight:600;margin-bottom:7px}
.privacy p{margin:0;font-size:13.5px;color:var(--mute);line-height:1.6}

/* Дисклеймер — отдельная заметная секция, а не сноска */
.disclaimer-box{
  margin-top:34px;padding:20px 22px;border-radius:14px;
  background:rgba(232,200,119,.06);border:1px solid rgba(232,200,119,.22);
}
.disclaimer-box h3{
  font-family:var(--ui);font-size:13px;font-weight:600;letter-spacing:.02em;
  color:var(--gold);margin:0 0 8px;
}
.disclaimer-box p{margin:0;font-size:13.5px;color:var(--dim);line-height:1.6;max-width:var(--measure)}

/* Ссылки идут отдельной строкой: в потоке текста три подряд читались
   как одна фраза без границ. */
.links-row{
  margin-top:22px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;
  font-size:13.5px;
}
.links-row span{color:var(--stroke-2)}

/* Подвал */
footer{border-top:1px solid var(--stroke);padding-block:32px 44px;margin-top:36px}
.foot{
  display:flex;flex-wrap:wrap;gap:14px 28px;justify-content:space-between;
  align-items:center;font-size:13px;color:var(--mute);
}
.foot a{color:var(--dim);text-decoration:none}
.foot a:hover{color:var(--text);text-decoration:underline}
.foot .dot{color:var(--stroke-2)}

/* ══ Добавлено для сайта 21.10.2026: витрина, облако, демо, языки ═════ */

.brand{color:var(--text);text-decoration:none}
.btn-small{min-height:40px;padding:9px 16px;font-size:13.5px;border-radius:11px}
@media (max-width:420px){.btn-small{width:auto}}
.top-right{gap:16px}
.note{font-size:13.5px;color:var(--gold-soft);opacity:.85}

/* Переключатель языка — <details>, работает и без скриптов */
.lang{position:relative}
.lang summary{
  list-style:none;cursor:pointer;font-size:13px;font-weight:600;letter-spacing:.06em;
  color:var(--dim);padding:8px 10px;border:1px solid var(--stroke);border-radius:10px;
}
.lang summary::-webkit-details-marker{display:none}
.lang summary::after{content:" \25BE";font-size:10px}
.lang[open] summary{color:var(--text);border-color:var(--stroke-2)}
.lang ul{
  position:absolute;right:0;top:calc(100% + 6px);z-index:20;margin:0;padding:6px;
  list-style:none;min-width:150px;border-radius:12px;
  background:var(--bg2);border:1px solid var(--stroke-2);box-shadow:0 20px 40px -20px #000;
}
.lang li a,.lang li span{display:block;padding:9px 12px;border-radius:8px;font-size:14px;text-decoration:none;color:var(--text)}
.lang li a:hover{background:var(--panel-2)}
.lang li span{color:var(--gold)}

/* Кнопки магазинов */
.stores{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.stores.ios-first [data-store="appstore"]{order:-1}
@media (max-width:920px){.hero .stores{justify-content:center}}
.store{
  display:inline-flex;align-items:center;gap:11px;min-height:56px;padding:9px 18px 9px 14px;
  border-radius:14px;background:#0B0818;border:1px solid var(--stroke-2);color:var(--text);
  text-decoration:none;line-height:1.15;font-size:17px;font-weight:600;text-align:left;
}
.store svg{width:24px;height:24px;flex:none;color:var(--gold)}
.store small{display:block;font-size:10.5px;font-weight:500;letter-spacing:.04em;color:var(--mute)}
a.store:hover{border-color:var(--violet);background:#140E2A}
.store.is-soon{opacity:.62;cursor:default}
.store.is-soon small{color:var(--gold)}

.counter{margin:10px 0 0;font-size:13.5px;color:var(--dim);font-variant-numeric:tabular-nums}
.counter b{color:var(--text);font-weight:600}

/* Таблетки-переключатели */
.seg{display:flex;flex-wrap:wrap;gap:8px}
.pill{
  font:inherit;font-size:13.5px;cursor:pointer;color:var(--dim);
  padding:9px 15px;border-radius:999px;background:var(--panel);border:1px solid var(--stroke);
}
.pill:hover{color:var(--text);border-color:var(--stroke-2)}
.pill[aria-pressed="true"],.pill[aria-selected="true"]{
  color:var(--bg0);background:var(--gold-soft);border-color:var(--gold-soft);font-weight:600;
}
.pill:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* Демо толкования */
.demo{display:grid;gap:22px}
.demo-body{display:grid;gap:clamp(22px,4vw,48px);grid-template-columns:minmax(0,1fr);min-height:320px;align-items:start}
@media (min-width:900px){.demo-body{grid-template-columns:.85fr 1.15fr}}
.demo-title{font-family:var(--display);font-size:clamp(24px,3.6vw,32px);color:var(--gold-soft);margin:0 0 6px;line-height:1.15}
.reveal{opacity:0;transform:translateY(8px);transition:opacity .5s ease,transform .5s ease}
.reveal.on{opacity:1;transform:none}

/* Облако тегов — сфера */
.cloud-bar,.show-bar{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between;margin-bottom:18px}
.legend{margin:0;font-size:12.5px;color:var(--mute);display:flex;align-items:center;gap:7px}
.legend span{display:inline-block;width:9px;height:9px;border-radius:50%}
.legend .lg-s{background:var(--violet2)}
.legend .lg-a{background:var(--gold);margin-left:10px}
.sphere-wrap{position:relative;display:flex;justify-content:center}
.sphere{
  position:relative;width:min(100%,620px);aspect-ratio:1/1;
  touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none;
  border-radius:50%;
  background:radial-gradient(closest-side,rgba(157,123,255,.13),rgba(157,123,255,.04) 70%,transparent);
}
.sphere.dragging{cursor:grabbing}
.sphere .tg{
  position:absolute;left:0;top:0;white-space:nowrap;
  font:inherit;font-family:var(--display);font-weight:600;line-height:1;
  background:none;border:0;padding:4px 6px;margin:0;cursor:pointer;color:var(--violet2);
  will-change:transform,opacity;border-radius:6px;
}
.sphere .tg.a{color:var(--gold);font-style:italic}
.sphere .tg:hover,.sphere .tg:focus-visible{color:#fff;text-shadow:0 0 14px rgba(232,200,119,.9)}
.sphere-msg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--mute);font-size:14px;padding:0 20%;margin:0}
/* Без движения — обычное облако слов */
.sphere.flat{aspect-ratio:auto;border-radius:18px;display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;align-items:center;padding:28px 18px;cursor:default}
.sphere.flat .tg{position:static;transform:none!important;opacity:1!important}

/* Витрина */
.filter{margin:0;font-size:14px;color:var(--dim);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.filter b{color:var(--gold-soft);font-weight:600}
.linkish{font:inherit;background:none;border:0;padding:0;color:var(--violet2);cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(157,123,255,.4)}
.cards{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.card{
  display:flex;flex-direction:column;gap:10px;padding:22px;border-radius:18px;
  background:var(--panel);border:1px solid var(--stroke);transition:border-color .2s ease;
}
.card:hover{border-color:var(--stroke-2)}
.card h3{font-size:23px}
.card h3 a{color:var(--text);text-decoration:none}
.card h3 a:hover{color:var(--gold-soft)}
.card-meta{margin:0;font-size:12px;color:var(--mute);display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.arch{color:var(--gold);letter-spacing:.08em;text-transform:uppercase;font-size:10.5px;font-weight:600}
.excerpt{margin:0;font-size:14.5px;color:var(--dim);line-height:1.6;flex:1;overflow-wrap:anywhere}
.card .chips{margin:0}
.card .chip{cursor:pointer;font:inherit;font-size:11.5px}
.card-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:4px}
.read{font-size:13.5px;white-space:nowrap}
.card.crown{
  grid-column:1/-1;padding:clamp(24px,4vw,38px);
  border-color:rgba(232,200,119,.45);
  background:linear-gradient(160deg,rgba(232,200,119,.12),var(--panel) 55%);
}
.card.crown h3{font-size:clamp(28px,4.4vw,40px)}
.card.crown .excerpt{font-size:16px;max-width:70ch}
.crown-label{font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);display:flex;align-items:center;gap:8px;margin:0}
.crown-label::before{content:"\265B";font-size:16px;letter-spacing:0}

.vote{
  display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 14px;
  font:inherit;font-size:14px;font-weight:600;font-variant-numeric:tabular-nums;cursor:pointer;
  color:var(--dim);background:transparent;border:1px solid var(--stroke-2);border-radius:999px;
  transition:color .2s ease,border-color .2s ease,background .2s ease;
}
.vote svg,.votes-static svg{width:17px;height:17px}
.vote svg path{fill:none;stroke:currentColor;stroke-width:1.8}
.vote:hover{color:var(--text);border-color:var(--violet)}
.vote[aria-pressed="true"]{color:#FF9FB8;border-color:rgba(255,159,184,.55);background:rgba(255,159,184,.08)}
.vote[aria-pressed="true"] svg path{fill:currentColor}
.vote.pop svg{animation:pop .45s ease}
@keyframes pop{40%{transform:scale(1.35)}}
.vote[disabled]{opacity:.6;cursor:progress}
.votes-static{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;color:var(--mute)}
.show-msg{color:var(--mute);font-size:14px;text-align:center;margin:18px 0 0}
.more-row{display:flex;justify-content:center;margin-top:22px}
.skeleton{min-height:210px;border-radius:18px;background:linear-gradient(100deg,var(--panel) 40%,var(--panel-2) 50%,var(--panel) 60%);background-size:200% 100%;animation:shim 1.4s linear infinite}
@keyframes shim{to{background-position:-200% 0}}
.toast{
  position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:50;
  padding:12px 18px;border-radius:12px;background:var(--bg2);border:1px solid var(--stroke-2);
  font-size:14px;color:var(--text);box-shadow:0 20px 40px -20px #000;max-width:calc(100% - 32px);
}

/* Оплата в блоке цен */
.pay{margin-top:28px}
.pay h3{font-size:22px;margin-bottom:6px}
.pay p{margin:0;color:var(--mute);font-size:14px;max-width:56ch}

/* FAQ */
.faq{max-width:820px;border-top:1px solid var(--stroke)}
.faq details{border-bottom:1px solid var(--stroke)}
.faq summary{
  cursor:pointer;list-style:none;padding:18px 36px 18px 0;position:relative;
  font-size:16.5px;font-weight:500;color:var(--text);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:13px;font-size:24px;color:var(--gold);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{margin:0 0 20px;color:var(--dim);font-size:15px;max-width:var(--measure)}

/* Финальный призыв */
.final{text-align:center;display:flex;flex-direction:column;align-items:center}
.final h2{font-size:clamp(30px,6vw,54px)}
.final p{color:var(--dim);margin:14px 0 0;max-width:46ch}
.final .stores{justify-content:center}
.final.small{margin-top:40px;padding:clamp(28px,5vw,44px) 20px;border-radius:22px;border:1px solid var(--stroke);background:var(--panel)}
.final.small h2{font-size:clamp(26px,4.5vw,36px)}

/* Страницы сна и символа */
.doc{max-width:820px;padding-block:clamp(20px,4vw,40px) 20px}
.doc h1{font-size:clamp(34px,7vw,60px);margin:12px 0 0}
.doc .lede{margin-top:16px}
.crumbs{margin:0 0 22px;font-size:14px}
.crumbs a{text-decoration:none;color:var(--dim)}
.crumbs a:hover{color:var(--text)}
.label{font-family:var(--ui);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);margin:38px 0 14px}
.dream .dream-quote p{margin:0}
.interp p{margin:0 0 14px;font-size:17px;line-height:1.7;color:var(--text)}
.arch-note{color:var(--dim);font-style:italic;font-family:var(--display);font-size:19px}
.question{font-family:var(--display);font-style:italic;font-size:clamp(22px,3.4vw,28px);color:var(--gold-soft);margin:0;line-height:1.35}
.chips.big .chip{font-size:13px;padding:7px 13px}
.vote-row{display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center;margin-top:24px}
.share{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;font-size:14px;color:var(--mute)}
.readout dt a{color:var(--violet2)}
.similar{padding-block:34px 0}
.similar h2{font-size:clamp(24px,4vw,32px);margin-bottom:12px}
.similar ul{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.similar li a{font-size:17px}
.doc .cards{margin-top:6px}
@media (max-width:560px){.top-right{gap:10px}.top .btn-small{display:none}}
.readout dt a{text-transform:none;letter-spacing:0;font-size:14px;line-height:1.4}