/* 💻 лендинг SaSiTe (/download): чёрный фон, градиент бренда #FF5A7A → #C04BE8 → #7B61FF.
   Первый экран, мокап окна SST, сравнение, вопросы и низ — здесь; разделы «Запись голосов» / «Передача игры» и плитки приложения — dl-features.css.
   Этими же классами (.dl, .dl-main, .dl-hero, .dl-text, .dl-h, .dl-lead, .dl-get, .dl-win, .dl-meta) сервер рисует «Сейчас много скачиваний» —
   без dl-features.css: стили ниже не должны от него зависеть. Телефон (~440 px) — в конце файла. */
body.dl { color-scheme:dark; background:#000; overflow-x:clip;
  --bg:#000; --card:#0B0B0C; --text:#F2F2F3; --text2:#A3A3AA; --line:#232326; --hover:#18181B; --chip:#161618;
  --blue:#3EA6FF; --blue-soft:rgba(62,166,255,.16); --ok:#34C77B; --violet:#B65BD6; --red:#FF5A52;
  --body:"Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --head:"Segoe UI Variable Display", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --grad:linear-gradient(135deg, #FF5A7A, #C04BE8 55%, #7B61FF);
  --t1:#F2F2F3; --t2:#A3A3AD; --t3:#76767F; --edge:rgba(255,255,255,.09); --panel:#0C0C0F;
  scrollbar-gutter:stable; }
.dl .bar { background:rgba(0,0,0,.78); border-bottom-color:#161618; -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); }
.dl .bar-in, .dl-main { max-width:1240px; }
.dl .tn.on { background:#2A2A2E; box-shadow:0 1px 3px rgba(0,0,0,.4); }
:where(.dl) .idea-hb { display:none; }   /* «Сейчас много скачиваний» — без account.css/js: кнопки ❗ нет; на лендинге account.css (подключён позже) её показывает */
.dl .ic { width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }

.dl-main { position:relative; margin:0 auto; padding:0 40px 40px; }
/* мягкое свечение бренда за первым экраном (не влияет на размеры) */
.dl-main::before { content:""; position:absolute; z-index:-1; left:0; right:0; top:-120px; height:900px; pointer-events:none;
  background:radial-gradient(40% 45% at 72% 38%, rgba(192,75,232,.22), transparent 70%), radial-gradient(30% 35% at 88% 18%, rgba(255,90,122,.16), transparent 70%),
    radial-gradient(35% 40% at 10% 10%, rgba(123,97,255,.12), transparent 70%); }

/* ── ① первый экран ─────────────────────────────────────── */
.dl-hero { display:grid; grid-template-columns:minmax(0, 560px) minmax(0, 1fr); align-items:center; gap:52px; min-height:min(820px, calc(100vh - 61px)); padding:56px 0 72px; }
.dl-hero:not(:has(.dl-art)) { grid-template-columns:minmax(0, 620px); justify-content:center; }   /* «Сейчас много скачиваний» — только текст */
.dl-eye { display:inline-flex; align-items:center; gap:9px; margin:0 0 22px; padding:6px 14px 6px 11px; border-radius:999px; font-size:13.5px; font-weight:500; color:#E4E4E8;
  background:rgba(255,255,255,.04); box-shadow:inset 0 0 0 1px rgba(255,255,255,.1); }
.dl-eye::before { content:""; flex:none; width:7px; height:7px; border-radius:50%; background:var(--grad); box-shadow:0 0 10px 1px rgba(192,75,232,.8); }
.dl-h { margin:0 0 22px; font-family:var(--head); font-size:56px; line-height:1.04; font-weight:700; letter-spacing:-.035em; color:#fff; text-wrap:balance; }
.dl-h span { display:block; }
.dl-g { background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; padding-bottom:.06em; margin-bottom:-.06em; }
.dl-lead { max-width:520px; margin:0 0 34px; font-size:18px; line-height:1.6; color:#C4C4CB; }

/* кнопки: Windows — главная на компьютере; «в браузере» — ряд под ней */
.dl-get { display:flex; flex-direction:column; align-items:flex-start; }
.dl-win { display:inline-flex; align-items:center; justify-content:center; gap:12px; height:60px; min-width:280px; padding:0 30px 0 26px; border-radius:16px; border:0;
  background:var(--grad); color:#fff; font-size:18px; font-weight:600; text-decoration:none; letter-spacing:.005em; white-space:nowrap;
  box-shadow:0 14px 34px -14px rgba(192,75,232,.75), inset 0 1px 0 rgba(255,255,255,.25); transition:transform .15s, box-shadow .15s, filter .15s; }
a.dl-win:hover { transform:translateY(-2px); filter:brightness(1.07); box-shadow:0 20px 40px -14px rgba(192,75,232,.85), inset 0 1px 0 rgba(255,255,255,.25); }
a.dl-win:active { transform:none; }
.dl-wi { width:22px; height:22px; flex:none; fill:currentColor; }
.dl-win.off { color:#8E8E96; background:#1C1C20; box-shadow:inset 0 0 0 1px #2A2A2F; cursor:default; }
.dl-soon { margin-left:4px; padding:3px 10px; border-radius:999px; font-size:13px; font-weight:500; color:#fff; background:var(--grad); }
.dl-meta { margin:12px 0 0; min-height:20px; font-size:13.5px; color:#8E8E96; font-variant-numeric:tabular-nums; }
.dl-meta a { color:#C9C9CF; }
.dl-pc { display:none; }
/* подсказка после нажатия — место занято заранее, страница не прыгает */
.dl-hint { margin:6px 0 0; min-height:21px; font-size:13.5px; line-height:1.5; color:#C9C9CF; visibility:hidden; opacity:0; transition:opacity .25s; }
.dl-hint.on { visibility:visible; opacity:1; }
.dl-hint a { color:#fff; text-underline-offset:3px; }

.dl-web { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:16px; }
.dl-or { font-size:14px; color:var(--t2); margin-right:2px; }
.dl-wb { display:inline-flex; align-items:center; justify-content:center; gap:8px; height:42px; padding:0 16px 0 13px; border-radius:12px; font-size:14.5px; font-weight:500;
  color:#ECECEF; text-decoration:none; white-space:nowrap; background:rgba(255,255,255,.045); box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
  transition:background-color .15s, box-shadow .15s, transform .15s; }
.dl-wb:hover { background:rgba(255,255,255,.09); box-shadow:inset 0 0 0 1px rgba(255,255,255,.22); transform:translateY(-1px); }
.dl-wb .ic { width:17px; height:17px; color:#E59BFF; }
.dl-wb .w-m { display:none; }

/* 🛡 почему Windows предупреждает — спокойная карточка под кнопками (видна всегда, кнопка не двигается) */
.dl-trust { display:flex; align-items:flex-start; gap:12px; max-width:520px; margin:22px 0 0; padding:13px 16px 13px 14px; border-radius:14px;
  background:linear-gradient(135deg, rgba(52,199,123,.08), rgba(255,255,255,.02) 60%); box-shadow:inset 0 0 0 1px rgba(52,199,123,.18); }
.dl-tr-i { width:22px; height:22px; flex:none; margin-top:1px; fill:rgba(52,199,123,.14); stroke:#34C77B; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.dl-trust p { margin:0; font-size:13px; line-height:1.55; color:#9A9AA3; }
.dl-trust b { color:#E2E2E6; font-weight:500; }
.dl-trust a { color:#fff; white-space:nowrap; text-underline-offset:3px; text-decoration-color:rgba(255,255,255,.35); }
.dl-trust a:hover { text-decoration-color:#fff; }

/* ── мокап окна SST: комната записи с голосом и чатом + карточка «Передачи игры» ── */
.dl-art { position:relative; padding:0 0 112px; }
.mk-win { position:relative; overflow:hidden; border-radius:14px; background:#0B0B0E; font-size:12px; color:var(--t1);
  box-shadow:0 0 0 1px rgba(255,255,255,.1), 0 50px 90px -30px rgba(0,0,0,.9), 0 30px 80px -40px rgba(192,75,232,.55); }
.mk-tb { display:flex; align-items:center; gap:8px; height:36px; padding-left:12px; background:#151518; border-bottom:1px solid #222226; }
.mk-tb > b { font-size:12.5px; font-weight:600; }
.mk-tabs { display:flex; gap:2px; margin-left:10px; padding:2px; border-radius:12px; background:#1E1E22; }
.mk-tabs i { padding:3px 10px; border-radius:10px; font-style:normal; font-size:11px; color:#8E8E96; white-space:nowrap; }
.mk-tabs i.on { color:#fff; background:#2E2E33; }
.mk-wc { display:flex; height:100%; margin-left:auto; }
.mk-wc i { position:relative; width:38px; height:100%; }
.mk-wc i::before, .mk-wc i::after { content:""; position:absolute; left:50%; top:50%; }
.mk-min::before { width:10px; height:1px; background:#BDBDC4; transform:translate(-50%, -50%); }
.mk-max::before { width:9px; height:9px; box-shadow:inset 0 0 0 1px #BDBDC4; transform:translate(-50%, -50%); }
.mk-x::before, .mk-x::after { width:12px; height:1px; background:#BDBDC4; transform:translate(-50%, -50%) rotate(45deg); }
.mk-x::after { transform:translate(-50%, -50%) rotate(-45deg); }
.mk-body { display:grid; grid-template-columns:minmax(0, 1fr) 188px; gap:12px; padding:14px; }
.mk-room, .mk-voice { min-width:0; border-radius:12px; background:#131316; box-shadow:inset 0 0 0 1px #1F1F24; }
.mk-room { display:flex; flex-direction:column; gap:12px; padding:12px; container-type:inline-size; }
/* узкая комната (окно ~1000–1150 px): плашка «WAV · 24 бит» не влезает — обрубок «W…» не показываем */
@container (max-width: 300px) { .mk-fmt { display:none; } }
.mk-rh { display:flex; align-items:center; gap:8px; white-space:nowrap; }
.mk-code { padding:3px 8px; border-radius:7px; font-family:var(--mono); font-size:11px; letter-spacing:.12em; color:#DADAE0; background:#1E1E23; }
.mk-st { display:inline-flex; align-items:center; gap:6px; height:22px; padding:0 9px 0 8px; border-radius:7px; font-size:11px; font-weight:600; color:#FF9C95;
  background:rgba(255,90,82,.12); box-shadow:inset 0 0 0 1px rgba(255,90,82,.35); }
.mk-st i { width:7px; height:7px; border-radius:50%; background:var(--red); box-shadow:0 0 8px var(--red); animation:mkBlink 1.4s ease-in-out infinite; }
.mk-t { width:5ch; font-weight:600; color:#fff; font-variant-numeric:tabular-nums; }
.mk-fmt { margin-left:auto; overflow:hidden; text-overflow:ellipsis; padding:3px 8px; border-radius:7px; font-size:10.5px; color:#9A9AA3; box-shadow:inset 0 0 0 1px rgba(255,255,255,.09); }
@keyframes mkBlink { 0%, 100% { opacity:1; } 50% { opacity:.25; } }
.mk-trs { position:relative; display:grid; gap:8px; padding-top:14px; }
.mk-tr { display:grid; grid-template-columns:52px minmax(0, 1fr); align-items:center; gap:8px; height:44px; }
.mk-nm { display:flex; align-items:center; gap:6px; font-size:11.5px; font-weight:500; color:#D2D2D8; white-space:nowrap; }
.mk-nm::before { content:""; flex:none; width:7px; height:7px; border-radius:50%; background:var(--c); }
.mk-c1 { --c:#FF6F8E; } .mk-c2 { --c:#5AB4FF; } .mk-c3 { --c:#4FD69A; }
.mk-wv { display:flex; align-items:center; gap:2px; height:100%; overflow:hidden; padding:0 6px; border-radius:8px; background:color-mix(in srgb, var(--c) 8%, transparent); }
.mk-wv i { flex:none; width:2.5px; height:80%; border-radius:2px; background:var(--c); transform:scaleY(var(--a, .3)); }
/* хлопок — одна черта через все дорожки: по нему всё и сводится */
.mk-clap { position:absolute; left:72px; top:0; bottom:-4px; width:0; border-left:1.5px dashed rgba(255,214,102,.75); }
.mk-clap span { position:absolute; left:-1px; top:-2px; padding:1px 6px; border-radius:6px; font-style:normal; font-size:9.5px; font-weight:600; color:#2A1E00; background:#FFD666; white-space:nowrap; transform:translateX(-50%); }
.mk-ph { position:absolute; top:12px; bottom:-4px; left:62%; width:2px; border-radius:1px; background:var(--red); box-shadow:0 0 10px rgba(255,90,82,.9); animation:mkPh 16s linear infinite; }
@keyframes mkPh { from { left:44%; } to { left:97%; } }
.mk-exp { display:flex; flex-wrap:wrap; gap:6px; }
.mk-chip { padding:4px 9px; border-radius:7px; font-size:10.5px; color:#BDBDC4; background:#1B1B1F; white-space:nowrap; }
.mk-chip-g { color:#fff; background:linear-gradient(135deg, rgba(255,90,122,.35), rgba(123,97,255,.35)); }
.mk-voice { display:flex; flex-direction:column; gap:10px; padding:10px; }
.mk-vh { display:flex; align-items:center; gap:7px; margin:0; font-size:11.5px; font-weight:600; color:#E4E4E8; }
.mk-vh .ic { width:15px; height:15px; color:var(--ok); }
.mk-vh b { margin-left:auto; padding:0 7px; border-radius:8px; font-size:10.5px; color:#B4F5D2; background:rgba(52,199,123,.15); }
.mk-ppl { display:grid; gap:6px; margin:0; padding:0; list-style:none; }
.mk-ppl li { display:flex; align-items:center; gap:7px; height:26px; font-size:11.5px; color:#D2D2D8; white-space:nowrap; }
.mk-ppl li .ic { width:14px; height:14px; margin-left:auto; color:#8E8E96; }
.mk-ppl li.off .ic { color:var(--red); }
.mk-ppl em { margin-left:auto; padding:1px 6px; border-radius:6px; font-style:normal; font-size:10px; color:#9FD4FF; background:rgba(62,166,255,.16); }
.mk-av { display:grid; place-items:center; flex:none; width:22px; height:22px; border-radius:50%; font-style:normal; font-size:10.5px; font-weight:700; color:#fff; }
.mk-a1 { background:linear-gradient(135deg, #FF7A93, #E0457A); } .mk-a2 { background:linear-gradient(135deg, #6CC0FF, #2F7FE0); }
.mk-a3 { background:linear-gradient(135deg, #5BE0A0, #1FA765); } .mk-a4 { background:linear-gradient(135deg, #B38CFF, #7B4FE0); }
.mk-ppl li.talk .mk-av { box-shadow:0 0 0 2px #131316, 0 0 0 3.5px var(--ok); }
.mk-ctl { display:flex; gap:6px; }
.mk-ctl i { position:relative; display:grid; place-items:center; width:30px; height:30px; border-radius:9px; color:#C9C9CF; background:#1E1E23; }
.mk-ctl i .ic { width:15px; height:15px; }
.mk-ctl i.on { color:#B4F5D2; background:rgba(52,199,123,.16); }
.mk-cb b { position:absolute; right:-4px; top:-4px; min-width:15px; height:15px; padding:0 4px; border-radius:8px; font-size:9.5px; line-height:15px; text-align:center; color:#fff; background:var(--red); }
.mk-chat { display:grid; gap:6px; margin-top:auto; }
.mk-chat p { margin:0; padding:6px 8px; border-radius:9px; font-size:10.5px; line-height:1.4; color:#C9C9CF; background:#1A1A1E; }
.mk-chat b { display:block; font-size:10px; color:#fff; }

/* карточка «Передачи игры» поверх окна */
.mk-live { position:absolute; left:-28px; bottom:0; width:46%; aspect-ratio:16 / 9; overflow:hidden; border-radius:14px; container-type:inline-size;
  box-shadow:0 0 0 1px rgba(255,255,255,.14), 0 30px 60px -20px rgba(0,0,0,.95), 0 20px 50px -24px rgba(255,90,122,.5); }
.mk-scene { position:absolute; inset:0; overflow:hidden; background:linear-gradient(180deg, #0B0519 0%, #1E0D38 36%, #45154F 60%, #5A1A55 64%); }
.mk-sun { position:absolute; left:50%; top:16%; width:30%; aspect-ratio:1; border-radius:50%; transform:translateX(-50%);
  background:linear-gradient(180deg, #FFD58C 0%, #FF8A72 38%, #FF5A7A 62%, #C04BE8 100%);
  -webkit-mask:linear-gradient(#000 0 52%, transparent 0 57%, #000 0 64%, transparent 0 70%, #000 0 77%, transparent 0 84%, #000 0);
  mask:linear-gradient(#000 0 52%, transparent 0 57%, #000 0 64%, transparent 0 70%, #000 0 77%, transparent 0 84%, #000 0); }
.mk-hills { position:absolute; left:0; right:0; bottom:36%; height:18%; background:#2A0D3C; clip-path:polygon(0 100%, 0 60%, 10% 30%, 18% 55%, 28% 10%, 38% 50%, 47% 25%, 58% 60%, 68% 15%, 78% 45%, 88% 20%, 100% 50%, 100% 100%); }
.mk-floor { position:absolute; left:0; right:0; bottom:0; height:36%; background:
  repeating-linear-gradient(90deg, rgba(255,92,180,.55) 0 1px, transparent 1px 9%), repeating-linear-gradient(180deg, rgba(255,92,180,.5) 0 1px, transparent 1px 22%), #0C0416;
  box-shadow:inset 0 1px 0 #FF8AC4, 0 -6px 18px rgba(255,90,170,.5); }
.mk-onair, .mk-fps, .mk-view, .mk-lat { position:absolute; display:inline-flex; align-items:center; gap:5px; height:20px; padding:0 7px; border-radius:6px; font-size:10px; font-weight:600;
  color:#fff; white-space:nowrap; background:rgba(10,5,20,.6); box-shadow:inset 0 0 0 1px rgba(255,255,255,.14); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.mk-onair { left:8px; top:8px; text-transform:uppercase; letter-spacing:.06em; background:rgba(229,57,53,.9); }
.mk-onair i { width:6px; height:6px; border-radius:50%; background:#fff; animation:mkBlink 1.6s ease-in-out infinite; }
.mk-fps { right:8px; top:8px; font-variant-numeric:tabular-nums; }
.mk-fps b { display:inline-block; width:3ch; text-align:right; }
.mk-view { left:8px; bottom:8px; }
.mk-view .ic { width:13px; height:13px; }
.mk-lat { right:8px; bottom:8px; color:#B4F5D2; }

/* ── ⑤ сравнение и ⑥ вопросы ─────────────────────────────── */
.sec-h { margin:0 0 10px; font-family:var(--head); font-size:40px; line-height:1.1; font-weight:700; letter-spacing:-.03em; color:#fff; text-align:center; text-wrap:balance; }
.sec-sub { max-width:600px; margin:0 auto 32px; font-size:16.5px; line-height:1.6; color:var(--t2); text-align:center; }
.cmp { padding:72px 0 24px; }
.cmp-box { max-width:880px; margin:0 auto; overflow:hidden; border-radius:22px; background:linear-gradient(180deg, #0F0F12, #09090B); box-shadow:inset 0 0 0 1px var(--edge); }
.cmp-t { width:100%; border-collapse:collapse; table-layout:fixed; font-size:15px; }
.cmp-t col, .cmp-t th, .cmp-t td { min-width:0; }
.cmp-t thead th { height:60px; font-size:14px; font-weight:600; color:#fff; }
.cmp-t thead th:first-child { width:46%; }
.cmp-th { display:inline-flex; align-items:center; gap:8px; }
.cmp-th .ic { width:16px; height:16px; color:var(--t2); }
.cmp-app .cmp-th .ic { color:#E59BFF; fill:none; }
.cmp-app .cmp-th svg.ic { fill:currentColor; stroke:none; }
.cmp-t th, .cmp-t td { padding:0 18px; text-align:center; }
.cmp-t tbody th { padding:14px 24px; font-weight:400; color:#D8D8DE; text-align:left; line-height:1.4; }
.cmp-t tbody tr { border-top:1px solid #1B1B1F; }
.cmp-t td { height:52px; }
td.cmp-app, th.cmp-app { background:rgba(192,75,232,.06); }
.cmp-t .ok, .cmp-t .no { width:20px; height:20px; vertical-align:middle; fill:none; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.cmp-t .ok { stroke:var(--ok); }
.cmp-t .no { stroke:#4A4A52; }
.cmp-v { display:inline-flex; flex-direction:column; align-items:center; gap:2px; }
.cmp-v small, .cmp-n { font-size:12px; line-height:1.3; color:var(--t2); }
.cmp-n { font-size:13px; color:#C9C9CF; }

.faq { padding:72px 0 24px; }
.faq-list { display:grid; gap:10px; max-width:800px; margin:0 auto; }
.faq-q { border-radius:16px; background:#0D0D10; box-shadow:inset 0 0 0 1px var(--edge); transition:background-color .2s; }
.faq-q[open] { background:#111115; }
.faq-q summary { display:flex; align-items:center; gap:16px; min-height:60px; padding:0 20px 0 22px; cursor:pointer; list-style:none; font-size:16.5px; font-weight:500; color:#fff; border-radius:16px; }
.faq-q summary::-webkit-details-marker { display:none; }
.faq-q summary .ic { width:20px; height:20px; margin-left:auto; color:var(--t2); transition:transform .25s; }
.faq-q[open] summary .ic { transform:rotate(45deg); }
.faq-q summary:hover .ic { color:#fff; }
.faq-q p { margin:0; padding:0 22px 20px; font-size:15px; line-height:1.6; color:var(--t2); max-width:680px; }
.faq-q p a { color:#fff; text-underline-offset:3px; }

/* ── ⑦ низ: ещё раз кнопки ───────────────────────────────── */
.dl-end { padding:80px 0 32px; }
.dl-end-in { position:relative; overflow:hidden; display:flex; flex-direction:column; align-items:center; padding:56px 32px 30px; border-radius:28px; text-align:center;
  background:radial-gradient(60% 90% at 50% 0, rgba(192,75,232,.28), transparent 70%), #0B0B0E; box-shadow:inset 0 0 0 1px rgba(255,255,255,.1); }
.dl-end-h { max-width:640px; margin:0 0 28px; font-family:var(--head); font-size:38px; line-height:1.12; font-weight:700; letter-spacing:-.03em; color:#fff; text-wrap:balance; }
.dl-end-get { flex-direction:row; flex-wrap:wrap; justify-content:center; align-items:center; gap:12px; }
.dl-end-get .dl-win { min-width:0; }
.dl-end-get .dl-wb { height:60px; padding:0 22px 0 18px; border-radius:16px; font-size:16px; }
.dl-end-hint { text-align:center; margin-top:12px; }

.dl-foot { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:6px 18px; max-width:1240px; margin:0 auto;
  padding:28px 24px calc(34px + env(safe-area-inset-bottom)); font-size:13px; color:var(--t3); }
.dl-foot a { color:var(--t2); text-underline-offset:3px; }
.dl-foot a:hover { color:#fff; }
.dl-ver { font-variant-numeric:tabular-nums; }

/* ── ноутбук ────────────────────────────────────────────── */
@media (max-width: 1180px) {
  .dl-hero { grid-template-columns:minmax(0, 460px) minmax(0, 1fr); gap:44px; }
  .dl-h { font-size:50px; }
  .dl-lead { font-size:16.5px; }
  .mk-body { grid-template-columns:minmax(0, 1fr) 168px; }
}
/* ── планшет: в столбик, мокап — под текстом ───────────────── */
@media (max-width: 900px) {
  .dl-main { padding:0 24px 32px; }
  .dl-hero { grid-template-columns:minmax(0, 1fr); gap:44px; min-height:0; padding:44px 0 40px; }
  .dl-art { max-width:680px; padding-left:20px; }
  .sec-h { font-size:34px; }
  .cmp, .faq { padding-top:56px; }
}
/* ── телефон (~440 px): главная кнопка — «Открыть запись в браузере», Windows — вторая ── */
@media (max-width: 640px) {
  .dl-main { padding:0 16px 24px; }
  .dl-hero { padding:28px 0 28px; gap:30px; }
  .dl-eye { margin-bottom:16px; font-size:12.5px; }
  .dl-h { font-size:clamp(32px, 9.4vw, 42px); margin-bottom:14px; }
  .dl-lead { font-size:15.5px; margin-bottom:24px; }
  .dl-get { align-items:stretch; }
  .dl-web { order:-1; display:grid; grid-template-columns:minmax(0, 1fr); gap:10px; margin:0 0 18px; }
  .dl-or { display:none; }
  .dl-wb { height:50px; font-size:15.5px; border-radius:14px; }
  .dl-wb-rec { height:58px; font-size:17px; font-weight:600; color:#fff; background:var(--grad); box-shadow:0 14px 30px -14px rgba(192,75,232,.8), inset 0 1px 0 rgba(255,255,255,.25); }
  .dl-wb-rec:hover { background:var(--grad); box-shadow:0 14px 30px -14px rgba(192,75,232,.8), inset 0 1px 0 rgba(255,255,255,.25); }
  .dl-wb-rec .ic { color:#fff; }
  .dl-wb .w-d { display:none; }
  .dl-wb .w-m { display:inline; }
  .dl-win { min-width:0; height:50px; font-size:15.5px; font-weight:500; border-radius:14px; background:#1A1A1E; box-shadow:inset 0 0 0 1px #2C2C32; }
  a.dl-win:hover { box-shadow:inset 0 0 0 1px #3A3A42; filter:none; }
  .dl-wi { width:19px; height:19px; }
  .dl-meta { text-align:center; margin-top:10px; font-size:12.5px; }
  .dl-pc { display:block; margin-top:2px; color:#B4B4BC; }
  .dl-hint { text-align:center; font-size:12.5px; }
  .dl-trust { margin-top:14px; padding:11px 13px; }
  .dl-trust p { font-size:12.5px; }
  .dl-art { padding:0 0 76px; }
  .mk-body { grid-template-columns:minmax(0, 1fr); padding:10px; }
  .mk-voice, .mk-tabs, .mk-fmt, .mk-exp { display:none; }
  .mk-tb { height:32px; }
  .mk-wc i { width:30px; }
  .mk-tr { grid-template-columns:44px minmax(0, 1fr); height:34px; }
  .mk-clap { left:62px; }
  .mk-live { left:auto; right:-4px; width:56%; }
  .sec-h { font-size:clamp(26px, 7.6vw, 32px); }
  .sec-sub { font-size:15px; margin-bottom:22px; }
  .cmp, .faq { padding-top:48px; }
  .cmp-box { border-radius:18px; }
  .cmp-t { font-size:13.5px; }
  .cmp-t thead th { height:52px; font-size:12.5px; }
  .cmp-t thead th:first-child { width:44%; }
  .cmp-th { flex-direction:column; gap:3px; }
  .cmp-t th, .cmp-t td { padding:0 6px; }
  .cmp-t tbody th { padding:12px 8px 12px 14px; }
  .cmp-t td { height:48px; }
  .cmp-v small, .cmp-n { font-size:11.5px; }
  .faq-q summary { min-height:54px; padding:0 16px 0 18px; font-size:15.5px; }
  .faq-q p { padding:0 18px 18px; font-size:14.5px; }
  .dl-end { padding:56px 0 16px; }
  .dl-end-in { padding:36px 16px 20px; border-radius:22px; }
  .dl-end-h { font-size:clamp(24px, 7vw, 30px); margin-bottom:20px; }
  .dl-end-get { display:grid; grid-template-columns:minmax(0, 1fr); width:100%; gap:10px; }
  .dl-end-get .dl-wb-rec { order:-1; }
  .dl-end-get .dl-win { order:1; }
  .dl-end-in { padding-bottom:10px; }
  .dl-end-get .dl-wb { height:50px; font-size:15.5px; }
  .dl-end-get .dl-wb-rec { height:56px; font-size:16.5px; }
}
@media (max-width: 380px) { .dl-h { font-size:30px; } }

/* без анимаций */
@media (prefers-reduced-motion: reduce) {
  .dl *, .dl *::before, .dl *::after { animation:none !important; transition:none !important; }
}