/* =============================================================================
   designs.css — КРУГ ВЫБОРА ОФОРМЛЕНИЯ. Временный файл.
   Тридцать вариантов первого экрана. Каждый ставится атрибутом data-design
   на <html> и открывается адресом ?design=<id> — на боевом сайте, на настоящем
   тексте. Посетитель без параметра видит основной дизайн: ни один вариант
   ниже не применяется сам по себе.
   Варианты различаются РОДОМ решения — материалом, типографикой, ролью цвета
   и тем, что происходит на первом экране, — а не оттенком одного и того же.
   После выбора финалиста файл удаляется вместе со ссылкой в index.html.
   ========================================================================== */

/* ── 04 · Лён и синь ── тканевая база, глубокий синий вместо электрического */
html[data-design="linen-navy"]{
  --bone:#EDE7DA; --bone-2:#E2DACA; --ink:#171A22; --ink-soft:#565C6B;
  --accent:#1B2A5B; --accent-ink:#F0EEE6; --line:rgba(23,26,34,.18);
  --font-d:Georgia,serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="linen-navy"] .hero .blob{
  background:radial-gradient(circle at 35% 35%,#3b4d8f,#1B2A5B 60%,#0d1533);
  filter:blur(38px);animation:none;opacity:.42}

/* ── 06 · Тень от жалюзи ── ритм полос, свет разрезан на линии */
html[data-design="blinds"]{
  --bone:#EFEBE3; --bone-2:#E6E1D6; --ink:#171512; --ink-soft:#575147;
  --accent:#1F1D19; --accent-ink:#EFEBE3; --line:rgba(23,21,18,.2);
  --font-d:'Syne',sans-serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="blinds"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background:repeating-linear-gradient(172deg,rgba(30,26,20,.16) 0 14px,transparent 14px 52px)}
html[data-design="blinds"] .hero .blob{display:none}

/* ── 07 · Сумеречный кабинет ── тёмная база, одна тёплая лампа */
html[data-design="dusk-room"]{
  --bone:#171512; --bone-2:#1F1C18; --ink:#EFE9DE; --ink-soft:#A79E90;
  --accent:#E8A857; --accent-ink:#1A140A; --line:rgba(239,233,222,.16);
  --font-d:'Syne',sans-serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="dusk-room"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(46% 42% at 78% 18%,rgba(232,168,87,.34),transparent 70%)}
html[data-design="dusk-room"] .hero .blob{display:none}

/* ── 10 · Медкарта ── миллиметровка под текстом, спокойный зелёный */
html[data-design="chart"]{
  --bone:#F3F5F0; --bone-2:#EAEEE4; --ink:#161A15; --ink-soft:#586052;
  --accent:#2F6B4F; --accent-ink:#FFFFFF; --line:rgba(22,26,21,.16);
  --font-d:'Space Mono',ui-monospace,monospace; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="chart"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.9;
  background:
    repeating-linear-gradient(0deg,rgba(47,107,79,.22) 0 1px,transparent 1px 22px),
    repeating-linear-gradient(90deg,rgba(47,107,79,.22) 0 1px,transparent 1px 22px)}
html[data-design="chart"] .hero .blob{display:none}

/* ── 11 · Рентген ── тёмно-синее поле, светящиеся тонкие линии */
html[data-design="xray"]{
  --bone:#0B1A2B; --bone-2:#122237; --ink:#DCE9F5; --ink-soft:#8FA6BC;
  --accent:#5FD0FF; --accent-ink:#04121F; --line:rgba(220,233,245,.18);
  --font-d:'Space Mono',ui-monospace,monospace; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="xray"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background:repeating-linear-gradient(90deg,rgba(95,208,255,.16) 0 1px,transparent 1px 60px)}
html[data-design="xray"] .hero .blob{
  background:radial-gradient(circle at 40% 35%,rgba(95,208,255,.5),transparent 65%);filter:blur(26px);animation:none}

/* ── 13 · Мох ── тёплая бумага и приглушённая зелень */
html[data-design="moss"]{
  --bone:#EFEDE1; --bone-2:#E5E3D3; --ink:#1B1F17; --ink-soft:#57604C;
  --accent:#4A5D3A; --accent-ink:#F4F6EC; --line:rgba(27,31,23,.18);
  --font-d:'Syne',sans-serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="moss"] .hero .blob{
  background:radial-gradient(circle at 40% 35%,#6d8455,#4A5D3A 62%,#2c3a22);filter:blur(42px);animation:none;opacity:.38}

/* ── 14 · Камень ── холодный серый, тяжёлая типографика, без цвета */
html[data-design="stone"]{
  --bone:#D9D9D7; --bone-2:#CFCFCC; --ink:#1A1A19; --ink-soft:#565655;
  --accent:#1A1A19; --accent-ink:#D9D9D7; --line:rgba(26,26,25,.24);
  --font-d:'Syne',sans-serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="stone"] .hero .blob{
  background:linear-gradient(150deg,#b8b8b5,#8e8e8b);border-radius:0;filter:none;animation:none;opacity:.55}

/* ── 15 · Вода ── прозрачные слои, бирюза, лёгкость */
html[data-design="water"]{
  --bone:#EFF6F6; --bone-2:#E3EFEF; --ink:#12211F; --ink-soft:#4F6664;
  --accent:#2A8B8B; --accent-ink:#FFFFFF; --line:rgba(18,33,31,.12);
  --font-d:'Syne',sans-serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="water"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.65;
  background:
    radial-gradient(60% 40% at 20% 20%,rgba(42,139,139,.22),transparent 70%),
    radial-gradient(50% 36% at 80% 40%,rgba(120,200,200,.24),transparent 72%)}
html[data-design="water"] .hero .blob{display:none}

/* ── 16 · Дерево ── тёплая древесная база, кольца вместо пятна */
html[data-design="wood"]{
  --bone:#E7D6BB; --bone-2:#DDC9AA; --ink:#2A1F14; --ink-soft:#5D4A34;
  --accent:#8A5A2B; --accent-ink:#F7EEE0; --line:rgba(42,31,20,.22);
  --font-d:Georgia,serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="wood"] .hero .blob{
  background:repeating-radial-gradient(circle at 40% 40%,rgba(138,90,43,.4) 0 6px,transparent 6px 16px);
  filter:none;animation:none;opacity:.7}

/* ── 19 · Пауза ── почти пустой экран: одна фраза и много тишины */
html[data-design="pause"]{
  --bone:#EDEBE6; --bone-2:#E5E2DC; --ink:#1C1B18; --ink-soft:#6A665E;
  --accent:#1C1B18; --accent-ink:#EDEBE6; --line:rgba(28,27,24,.12);
  --font-d:'Syne',sans-serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="pause"] .hero{min-height:100vh;padding-top:12rem}
html[data-design="pause"] .hero .blob{display:none}

/* ── 20 · Двое ── дуотон: два голоса, два цвета, встречаются в центре */
html[data-design="duo"]{
  --bone:#F1EFEA; --bone-2:#E7E4DD; --ink:#15181C; --ink-soft:#565D66;
  --accent:#2F4FA8; --accent-ink:#FFFFFF; --line:rgba(21,24,28,.16);
  --font-d:'Syne',sans-serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="duo"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.7;
  background:
    radial-gradient(46% 52% at 8% 30%,rgba(47,79,168,.3),transparent 70%),
    radial-gradient(46% 52% at 92% 62%,rgba(200,110,60,.3),transparent 70%)}
html[data-design="duo"] .hero .blob{display:none}

/* ── 22 · Слои времени ── полупрозрачные пласты внахлёст */
html[data-design="layers"]{
  --bone:#EEEAE3; --bone-2:#E4DFD6; --ink:#1A1815; --ink-soft:#5C574E;
  --accent:#6B4E71; --accent-ink:#FFFFFF; --line:rgba(26,24,21,.16);
  --font-d:'Syne',sans-serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="layers"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    linear-gradient(120deg,rgba(107,78,113,.2) 0 32%,transparent 32%),
    linear-gradient(200deg,rgba(150,120,90,.18) 0 46%,transparent 46%),
    linear-gradient(60deg,rgba(90,110,120,.16) 0 24%,transparent 24%)}
html[data-design="layers"] .hero .blob{display:none}

/* ── 24 · Ночная лампа ── глубокая темнота и одно тёплое пятно света */
html[data-design="lamp"]{
  --bone:#101010; --bone-2:#181818; --ink:#F0EBE3; --ink-soft:#9A948B;
  --accent:#F2C078; --accent-ink:#1A1206; --line:rgba(240,235,227,.14);
  --font-d:Georgia,serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="lamp"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(38% 34% at 24% 26%,rgba(242,192,120,.4),transparent 72%)}
html[data-design="lamp"] .hero .blob{display:none}

/* ── 25 · Театр теней ── жёсткий контраст, силуэт вместо свечения */
html[data-design="shadow-play"]{
  --bone:#E8E4DA; --bone-2:#DCD7CA; --ink:#0E0D0B; --ink-soft:#4C4840;
  --accent:#0E0D0B; --accent-ink:#E8E4DA; --line:rgba(14,13,11,.3);
  --font-d:'Syne',sans-serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="shadow-play"] .hero .blob{
  background:#0E0D0B;filter:none;animation:none;opacity:.16;
  right:-10vw;top:6vh;border-radius:50% 50% 46% 54% / 58% 42% 58% 42%}

/* ── 26 · Тихий вечер ── приглушённый тёмно-синий, ничего резкого */
html[data-design="quiet-eve"]{
  --bone:#1B2430; --bone-2:#222C3A; --ink:#E7ECF2; --ink-soft:#9AA6B4;
  --accent:#8FB8D9; --accent-ink:#101820; --line:rgba(231,236,242,.16);
  --font-d:'Syne',sans-serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="quiet-eve"] .hero .blob{
  background:radial-gradient(circle at 40% 35%,rgba(143,184,217,.4),transparent 66%);filter:blur(30px);animation:none}

/* ── 28 · Швейцарская сетка ── жёсткий модуль, красный, никакой мягкости */
html[data-design="swiss"]{
  --bone:#F5F5F3; --bone-2:#EAEAE7; --ink:#111111; --ink-soft:#585856;
  --accent:#E4322B; --accent-ink:#FFFFFF; --line:rgba(17,17,17,.2);
  --font-d:'Space Grotesk',system-ui,sans-serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="swiss"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.4;
  background:
    repeating-linear-gradient(90deg,rgba(17,17,17,.16) 0 1px,transparent 1px 25%),
    linear-gradient(180deg,rgba(17,17,17,.16) 0 1px,transparent 1px)}
html[data-design="swiss"] .hero .blob{
  background:var(--accent);border-radius:0;filter:none;animation:none;opacity:.9;
  width:22vw;height:22vw;top:14vh}

/* ── 30 · Обратный ── цвет становится фоном, текст ложится на плашку */
html[data-design="inverse"]{
  --bone:#2E2A6B; --bone-2:#36317E; --ink:#F0EEFF; --ink-soft:#B4AFE0;
  --accent:#F0EEFF; --accent-ink:#2E2A6B; --line:rgba(240,238,255,.2);
  --font-d:'Syne',sans-serif; --font-b:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="inverse"] .hero .blob{
  background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.35),transparent 62%);
  filter:blur(24px);animation:none}

/* ═════════ переделка тринадцати номеров, отклонённых в первом показе ═════════
   Причина отказа: светлая бумажно-бежевая гамма и отсутствие события на экране.
   Поэтому здесь тёмные и насыщенные базы, и у каждого варианта есть предмет,
   который видно сразу: пятно, печать, окно, линия, блок. */

/* ── 01 · Тушь по мокрому ── чернильные разводы, глубокий сине-чёрный */
html[data-design="ink-wash"]{
  --bone:#0C1418; --bone-2:#131E24; --ink:#E8F0F2; --ink-soft:#8FA3AA;
  --accent:#4FB3C9; --accent-ink:#06141A; --line:rgba(232,240,242,.18);
  --font-d:Georgia,serif;
}
html[data-design="ink-wash"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(38% 30% at 22% 18%,rgba(79,179,201,.34),transparent 70%),
    radial-gradient(30% 26% at 68% 42%,rgba(30,80,110,.5),transparent 72%),
    radial-gradient(46% 34% at 84% 8%,rgba(18,44,60,.7),transparent 76%)}
html[data-design="ink-wash"] .hero .blob{
  background:radial-gradient(circle at 42% 38%,rgba(79,179,201,.4),transparent 62%);filter:blur(44px);animation:none}

/* ── 02 · Сургуч ── тёмное бордо и круглая печать */
html[data-design="sealing-wax"]{
  --bone:#241016; --bone-2:#31161F; --ink:#F3E4E2; --ink-soft:#BE9A98;
  --accent:#D2452F; --accent-ink:#FFF3F0; --line:rgba(243,228,226,.18);
  --font-d:Georgia,serif;
}
html[data-design="sealing-wax"] .hero .blob{
  background:radial-gradient(circle at 38% 34%,#e0563c,#9c2a1c 62%,#5c150e);
  filter:none;animation:none;opacity:.9;width:26vw;height:26vw;right:6vw;top:16vh;
  box-shadow:inset 0 0 0 10px rgba(0,0,0,.18)}

/* ── 03 · Витраж ── тёмная база, цветные световые пятна */
html[data-design="stained-glass"]{
  --bone:#0E1016; --bone-2:#171A22; --ink:#EFF0F6; --ink-soft:#9B9FB0;
  --accent:#FFC24D; --accent-ink:#14161C; --line:rgba(239,240,246,.18);
  --font-d:'Syne',sans-serif;
}
html[data-design="stained-glass"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.75;
  background:
    conic-gradient(from 210deg at 78% 12%,rgba(255,194,77,.55),transparent 22%),
    conic-gradient(from 40deg at 62% 30%,rgba(80,140,255,.5),transparent 20%),
    conic-gradient(from 300deg at 88% 34%,rgba(220,70,120,.45),transparent 18%)}

/* ── 05 · Окно ночью ── тёмный кабинет и один тёплый прямоугольник света */
html[data-design="window"]{
  --bone:#101216; --bone-2:#181B21; --ink:#EDEAE4; --ink-soft:#9A968E;
  --accent:#FFC98A; --accent-ink:#1A1409; --line:rgba(237,234,228,.16);
  --font-d:'Syne',sans-serif;
}
html[data-design="window"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    linear-gradient(105deg,transparent 46%,rgba(255,201,138,.22) 46% 62%,transparent 62%),
    linear-gradient(105deg,transparent 64%,rgba(255,201,138,.12) 64% 72%,transparent 72%)}
html[data-design="window"] .hero .blob{display:none}

/* ── 08 · Дым ── тёмно-серая база, мягкие клубы */
html[data-design="smoke"]{
  --bone:#191A1B; --bone-2:#222425; --ink:#ECEDEE; --ink-soft:#9EA1A4;
  --accent:#C7CDD2; --accent-ink:#17181A; --line:rgba(236,237,238,.16);
  --font-d:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="smoke"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(44% 34% at 18% 26%,rgba(190,198,205,.22),transparent 72%),
    radial-gradient(38% 30% at 62% 16%,rgba(150,160,170,.18),transparent 74%),
    radial-gradient(52% 40% at 86% 46%,rgba(120,130,140,.2),transparent 76%)}

/* ── 09 · Неон ── почти чёрный и холодный неоновый контур */
html[data-design="neon"]{
  --bone:#080A0C; --bone-2:#101418; --ink:#E9F6FF; --ink-soft:#8DA3B2;
  --accent:#2BE3FF; --accent-ink:#04161C; --line:rgba(43,227,255,.28);
  --font-d:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="neon"] .hero .blob{
  background:none;border:2px solid rgba(43,227,255,.9);border-radius:50%;filter:none;animation:none;
  box-shadow:0 0 40px rgba(43,227,255,.5),inset 0 0 60px rgba(43,227,255,.25)}

/* ── 12 · Терракота ночью ── обожжённая глина, а не бежевая пыль */
html[data-design="terracotta-night"]{
  --bone:#2E1409; --bone-2:#3D1C0E; --ink:#F6E3D6; --ink-soft:#C09A85;
  --accent:#F0743C; --accent-ink:#2A1108; --line:rgba(246,227,214,.18);
  --font-d:Georgia,serif;
}
html[data-design="terracotta-night"] .hero .blob{
  background:radial-gradient(circle at 38% 34%,#f0743c,#a03c16 60%,#4a1a09);filter:blur(26px);animation:none;opacity:.6}

/* ── 17 · Реплика ── тёмный лист и огромная кавычка */
html[data-design="quote"]{
  --bone:#141317; --bone-2:#1D1C21; --ink:#F1EFF3; --ink-soft:#9E9AA6;
  --accent:#8C7BFF; --accent-ink:#12111A; --line:rgba(241,239,243,.18);
  --font-d:Georgia,'Times New Roman',serif; --font-b:Georgia,'Times New Roman',serif;
}
html[data-design="quote"] .hero .blob{
  background:none;filter:none;animation:none;opacity:1;
  width:auto;height:auto;right:4vw;top:4vh;border-radius:0}
html[data-design="quote"] .hero .blob::after{
  content:"«";font-family:Georgia,serif;font-size:44vw;line-height:.6;color:rgba(140,123,255,.22)}

/* ── 18 · Негатив ── плёночный негатив: зелёно-чёрный, с перфорацией по краю */
html[data-design="negative"]{
  --bone:#0A140E; --bone-2:#112017; --ink:#DFF5E6; --ink-soft:#8CAF98;
  --accent:#7CFFA8; --accent-ink:#04140A; --line:rgba(223,245,230,.18);
  --font-d:'Space Mono',ui-monospace,monospace; --font-b:'Space Mono',ui-monospace,monospace;
}
html[data-design="negative"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.6;
  background:
    repeating-linear-gradient(180deg,rgba(124,255,168,.18) 0 10px,transparent 10px 30px) left/22px 100% no-repeat,
    repeating-linear-gradient(180deg,rgba(124,255,168,.18) 0 10px,transparent 10px 30px) right/22px 100% no-repeat}

/* ── 21 · Пульс ── тёмное поле и одна живая линия */
html[data-design="pulse"]{
  --bone:#101215; --bone-2:#181B1F; --ink:#E9EDF2; --ink-soft:#98A0AA;
  --accent:#FF4D6D; --accent-ink:#16070C; --line:rgba(233,237,242,.16);
  --font-d:'Space Grotesk',system-ui,sans-serif;
}
html[data-design="pulse"] body::before{
  content:"";position:fixed;left:0;right:0;top:52%;height:2px;z-index:0;pointer-events:none;
  background:linear-gradient(90deg,transparent 0 8%,rgba(255,77,109,.75) 8% 12%,rgba(255,77,109,.25) 12% 40%,
    rgba(255,77,109,.9) 42% 44%,rgba(255,77,109,.2) 44% 78%,rgba(255,77,109,.6) 80% 83%,transparent 83%)}

/* ── 23 · Ночная тетрадь ── тёмно-синяя линованная бумага */
html[data-design="night-notebook"]{
  --bone:#101A2B; --bone-2:#17253B; --ink:#E7EDF7; --ink-soft:#93A2B8;
  --accent:#FFD166; --accent-ink:#141B26; --line:rgba(231,237,247,.18);
  --font-d:Georgia,serif; --font-b:Georgia,serif;
}
html[data-design="night-notebook"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.55;
  background:
    repeating-linear-gradient(180deg,transparent 0 33px,rgba(231,237,247,.16) 33px 34px),
    linear-gradient(90deg,transparent 7rem,rgba(255,209,102,.5) 7rem 7.1rem,transparent 7.1rem)}
html[data-design="night-notebook"] .hero .blob{display:none}

/* ── 27 · Афиша ── чёрный лист и крупный цветной блок */
html[data-design="poster"]{
  --bone:#0B0B0B; --bone-2:#151515; --ink:#F5F5F3; --ink-soft:#9A9A97;
  --accent:#FF5A1F; --accent-ink:#0B0B0B; --line:rgba(245,245,243,.18);
  --font-d:'Syne',sans-serif;
}
html[data-design="poster"] .hero .blob{
  background:var(--accent);border-radius:0;filter:none;animation:none;opacity:1;
  width:34vw;height:46vh;right:0;top:0;max-width:none;max-height:none}

/* ── 29 · Уголь ── угольный монохром и одна светящаяся линия */
html[data-design="coal"]{
  --bone:#0D0D0D; --bone-2:#161616; --ink:#EDEDED; --ink-soft:#909090;
  --accent:#EDEDED; --accent-ink:#0D0D0D; --line:rgba(237,237,237,.2);
  --font-d:'Syne',sans-serif;
}
html[data-design="coal"] body::before{
  content:"";position:fixed;left:8%;top:0;bottom:0;width:1px;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.75) 35%,rgba(255,255,255,.75) 65%,transparent);
  box-shadow:0 0 24px rgba(255,255,255,.35)}
html[data-design="coal"] .hero .blob{
  background:radial-gradient(circle at 40% 36%,rgba(255,255,255,.14),transparent 62%);filter:blur(40px);animation:none}

/* Правки после первого прогона переделки: у пяти вариантов оставался исходный
   шар и спорил с приёмом, а блок афиши налезал на шапку. */
html[data-design="smoke"] .hero .blob{
  background:radial-gradient(circle at 42% 38%,rgba(200,208,215,.22),transparent 64%);
  filter:blur(46px);animation:none;opacity:.7}
html[data-design="negative"] .hero .blob{
  background:radial-gradient(circle at 42% 38%,rgba(124,255,168,.22),transparent 62%);
  filter:blur(44px);animation:none;opacity:.6}
html[data-design="pulse"] .hero .blob{
  background:radial-gradient(circle at 42% 38%,rgba(255,77,109,.24),transparent 62%);
  filter:blur(44px);animation:none;opacity:.6}
html[data-design="stained-glass"] .hero .blob{
  background:radial-gradient(circle at 40% 36%,rgba(255,194,77,.22),transparent 62%);
  filter:blur(48px);animation:none;opacity:.6}
html[data-design="poster"] .hero .blob{top:12vh;height:40vh}