/* Домашнее радио «Гладкого тела» — живая комната: камин, свечи, дождь за окном. */

@font-face{font-family:'Playfair';src:url('fonts/playfair-display-cyrillic-400-normal.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Playfair';src:url('fonts/playfair-display-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0000-00FF}
@font-face{font-family:'Playfair';src:url('fonts/playfair-display-cyrillic-600-normal.woff2') format('woff2');font-weight:600;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Inter';src:url('fonts/inter-cyrillic-400-normal.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Inter';src:url('fonts/inter-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0000-00FF}
@font-face{font-family:'Inter';src:url('fonts/inter-cyrillic-500-normal.woff2') format('woff2');font-weight:500;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Inter';src:url('fonts/inter-cyrillic-600-normal.woff2') format('woff2');font-weight:600;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}

:root{
  --serif:'Playfair',Georgia,serif;
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --cream:#FBF3EA;
  --ink:#F8EEE4;
  --muted:rgba(248,238,228,.62);
  --dim:rgba(248,238,228,.38);
  --amber:#F2A45E;
  --fire:#FF8B3D;
  --hot:#FFD9A3;
  --flicker:1;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;font-family:var(--sans);color:var(--ink);background:#160D09;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
a{color:inherit}

/* ---------- сцена ---------- */
.scene{position:fixed;inset:0;overflow:hidden;background:#160D09;z-index:0}

/* рамка ровно по пропорциям фото: размеры и смещение задаёт scene.js,
   поэтому все слои в процентах всегда попадают на свои места */
.frame{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}
.frame__photo{display:block;width:100%;height:100%}
.frame__video{position:absolute;inset:0;object-fit:cover;object-position:center;opacity:0;transition:opacity .7s ease}
.frame__video.is-live{opacity:1}
/* когда в кадре живое видео, нарисованные огонь, свечи и дождь не нужны —
   они привязаны к координатам фотографии и на видео легли бы мимо */
.scene--video .fire,.scene--video .rain,.scene--video .candles{display:none}

.warmth{
  position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;
  opacity:calc(.42 * var(--flicker));
  background:
    radial-gradient(26% 34% at 73.5% 60%, rgba(255,150,60,.52), rgba(255,110,30,.16) 46%, transparent 72%),
    radial-gradient(40% 46% at 73% 56%, rgba(255,120,40,.22), transparent 70%),
    radial-gradient(9% 13% at 59.5% 18.5%, rgba(255,190,120,.30), transparent 72%),
    radial-gradient(8% 12% at 80% 14.5%, rgba(255,190,120,.26), transparent 72%),
    radial-gradient(7% 11% at 48% 12%, rgba(255,190,120,.20), transparent 72%);
}
/* ---------------- свет от камина по комнате ----------------
   координаты взяты с самого кадра: топка 60–80% x, 30–65% y;
   пол перед очагом 55–85% x, 65–90% y; диван 10–50% x, 45–75% y
   с подсвеченным правым подлокотником около 46% x            */
.firelight{
  position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;
  opacity:calc(.72 * var(--flicker));
  animation:fireBreathe 3.7s ease-in-out infinite;
  background:
    /* тёплое пятно на полу перед очагом */
    radial-gradient(46% 30% at 70% 82%, rgba(255,142,52,.50), rgba(255,112,36,.18) 46%, transparent 78%),
    /* самое горячее — у самых поленьев, ближний край ковра */
    radial-gradient(24% 15% at 70% 73%, rgba(255,176,88,.40), transparent 80%),
    /* свет на правом подлокотнике дивана */
    radial-gradient(15% 19% at 46% 58%, rgba(255,152,72,.33), transparent 80%),
    /* мягкая дорожка по сиденью */
    radial-gradient(31% 17% at 33% 68%, rgba(255,132,56,.24), transparent 85%),
    /* край спинки, куда достаёт огонь */
    radial-gradient(17% 13% at 42% 50%, rgba(255,152,72,.26), transparent 82%),
    /* отсвет на стене справа от камина */
    radial-gradient(20% 27% at 85% 40%, rgba(255,122,46,.22), transparent 84%),
    /* общая тёплая волна по низу кадра */
    linear-gradient(to top, rgba(255,122,46,.14) 0%, rgba(255,122,46,0) 48%);
}
/* быстрый неспокойный слой — только возле очага, как настоящее пламя */
.firelight--hot{
  position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;
  opacity:calc(.55 * var(--flicker));
  transform-origin:70% 62%;
  animation:fireFlicker 2.3s steps(1,end) infinite;
  background:
    radial-gradient(22% 14% at 70% 74%, rgba(255,190,110,.42), transparent 78%),
    radial-gradient(12% 10% at 47% 59%, rgba(255,168,92,.30), transparent 80%);
}
@keyframes fireBreathe{
  0%,100%{opacity:calc(.72 * var(--flicker));transform:scale(1)}
  22%{opacity:calc(.64 * var(--flicker))}
  41%{opacity:calc(.80 * var(--flicker));transform:scale(1.012)}
  63%{opacity:calc(.60 * var(--flicker))}
  82%{opacity:calc(.76 * var(--flicker));transform:scale(1.006)}
}
@keyframes fireFlicker{
  0%{opacity:calc(.52 * var(--flicker));transform:scale(1)}
  17%{opacity:calc(.66 * var(--flicker));transform:scale(1.02)}
  33%{opacity:calc(.44 * var(--flicker));transform:scale(1.006)}
  52%{opacity:calc(.70 * var(--flicker));transform:scale(1.025)}
  71%{opacity:calc(.50 * var(--flicker));transform:scale(1.01)}
  88%{opacity:calc(.62 * var(--flicker));transform:scale(1.018)}
}
.veil{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(22% 30% at 21.5% 24%, rgba(150,180,205,.10), transparent 70%),
    linear-gradient(to bottom, rgba(12,7,5,.34) 0%, rgba(12,7,5,0) 24%);
}
.vignette{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(120% 90% at 50% 42%, rgba(0,0,0,0) 36%, rgba(10,6,4,.38) 76%, rgba(8,5,3,.66) 100%),
    linear-gradient(to top, rgba(10,6,4,.80) 0%, rgba(10,6,4,.26) 22%, rgba(10,6,4,0) 46%);
}

.fire{position:absolute;left:64.5%;top:41%;width:19.5%;height:30%;pointer-events:none;overflow:visible}
.rain{position:absolute;left:9%;top:3%;width:25%;height:42%;pointer-events:none}

/* свечи: центры огоньков в процентах от кадра */
.candles{position:absolute;inset:0;pointer-events:none}

/* стрелки настоящих часов над камином: идут по времени посетителя */
.watchhands{
  position:absolute;left:0;top:0;width:9%;aspect-ratio:1/1;visibility:hidden;
  transform:translateY(-50%);pointer-events:none;opacity:.96;
  filter:blur(.25px);
}
.watchhands svg{display:block;width:100%;height:100%}
#ckHour,#ckMin{transform-origin:100px 100px}
#ckSec{transform-origin:100px 100px}
/* пар над чашкой чая */
.steam{position:absolute;left:0;top:0;width:9%;height:16%;pointer-events:none;mix-blend-mode:screen;opacity:.9;visibility:hidden}
.candle{position:absolute;width:var(--s);height:var(--s);transform:translate(-50%,-50%)}
.candle__glow{
  position:absolute;inset:-75%;border-radius:50%;
  background:radial-gradient(circle, rgba(255,196,120,calc(.46 * var(--flicker))) 0%, rgba(255,150,60,.18) 40%, transparent 72%);
  filter:blur(3px);animation:candleGlow var(--gd,3.4s) ease-in-out infinite alternate
}
.candle__flame{
  position:absolute;left:50%;top:50%;width:24%;height:38%;
  border-radius:50% 50% 46% 46%/62% 62% 38% 38%;
  background:radial-gradient(ellipse at 50% 72%, #FFF6DA 0%, #FFC978 44%, #FF9A3E 74%, rgba(255,120,40,0) 100%);
  filter:blur(.5px);animation:candleFlicker var(--fd,2.6s) ease-in-out infinite;
  transform-origin:50% 88%;transform:translate(-50%,-50%)
}
@keyframes candleGlow{from{opacity:.72;transform:scale(.94)}to{opacity:1;transform:scale(1.09)}}
@keyframes candleFlicker{
  0%{transform:translate(-50%,-50%) scale(.92) rotate(-2deg);opacity:.9}
  28%{transform:translate(-50%,-54%) scale(1.04) rotate(2deg);opacity:1}
  52%{transform:translate(-50%,-48%) scale(.96) rotate(-1deg);opacity:.88}
  74%{transform:translate(-50%,-53%) scale(1.06) rotate(3deg);opacity:1}
  100%{transform:translate(-50%,-50%) scale(.93) rotate(-2deg);opacity:.92}
}

/* ---------- шапка ---------- */
.top{
  position:fixed;top:0;left:0;right:0;z-index:3;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:clamp(14px,2.4vw,26px) clamp(16px,4vw,44px);
  padding-top:calc(clamp(14px,2.4vw,26px) + env(safe-area-inset-top,0px));
}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand__mark{width:auto;height:30px;filter:drop-shadow(0 2px 10px rgba(0,0,0,.55))}
.brand__name{
  margin:0;font-family:var(--serif);font-weight:400;font-size:1.06rem;line-height:1.05;
  text-shadow:0 2px 14px rgba(0,0,0,.7)
}
.brand__name small{
  display:block;font-family:var(--sans);font-size:.54rem;letter-spacing:.26em;text-transform:uppercase;
  color:var(--muted);margin-top:5px
}
.top__right{display:flex;align-items:center;gap:14px}
.live{
  display:inline-flex;align-items:center;gap:7px;font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--muted);white-space:nowrap;text-shadow:0 2px 10px rgba(0,0,0,.6)
}
.live i{width:6px;height:6px;border-radius:50%;background:var(--dim);transition:background .3s}
.live.on i{background:var(--fire);box-shadow:0 0 10px 2px rgba(255,139,61,.7);animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.45}}
.online{
  display:inline-flex;align-items:center;gap:7px;margin:0;padding:6px 12px;border-radius:99px;
  border:1px solid rgba(255,232,208,.16);background:rgba(24,13,9,.42);backdrop-filter:blur(10px);
  font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);white-space:nowrap
}
.online b{font-family:var(--serif);font-weight:400;font-size:.9rem;letter-spacing:0;color:var(--muted)}
.online.on{border-color:rgba(255,139,61,.42)}
.online.on b{color:var(--hot)}
.online__dot{width:5px;height:5px;border-radius:50%;background:var(--dim)}
.online.on .online__dot{background:var(--fire);box-shadow:0 0 8px 1px rgba(255,139,61,.7)}

/* ---------- нижняя полоса плеера ---------- */
.dock{
  position:fixed;left:0;right:0;bottom:0;z-index:4;
  background:linear-gradient(180deg, rgba(22,12,9,.32), rgba(13,8,6,.88));
  border-top:1px solid rgba(255,232,208,.13);
  backdrop-filter:blur(20px) saturate(1.12);-webkit-backdrop-filter:blur(20px) saturate(1.12);
  padding-bottom:env(safe-area-inset-bottom,0px)
}
.strip{position:relative;max-width:1180px;margin:0 auto;padding:10px clamp(14px,2.6vw,26px) 12px}
.viz{position:absolute;left:0;right:0;top:0;width:100%;height:18px;opacity:.5;pointer-events:none}
.strip__row{display:flex;align-items:center;gap:clamp(12px,2vw,28px);padding-top:16px}

.now{display:flex;align-items:center;gap:12px;min-width:0;flex:0 1 330px}
.now__text{min-width:0}
.now__kicker{margin:0 0 3px;font-size:.5rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.now__title{
  margin:0 0 2px;font-family:var(--serif);font-weight:400;font-size:1.16rem;line-height:1.1;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.now__meta{margin:0;font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.disc{
  position:relative;width:72px;height:72px;border-radius:50%;flex:none;
  background:radial-gradient(circle at 38% 30%, #2B211B, #14100D 72%);
  box-shadow:0 4px 16px rgba(0,0,0,.5), inset 0 0 0 1px rgba(255,232,208,.10)
}
.disc__grooves{position:absolute;inset:5px;border-radius:50%;background:repeating-radial-gradient(circle at 50% 50%, rgba(255,255,255,.06) 0 1px, transparent 1px 3px)}
.disc__label{
  position:absolute;inset:18%;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 40% 32%, #FFFCF8, #FBF3EA 66%, #EFE2D4 100%);
  box-shadow:inset 0 0 0 1px rgba(33,30,27,.10)
}
.disc__label img{width:72%;height:auto;display:block}
body.is-playing .disc{animation:spin 7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

.controls{display:flex;align-items:center;gap:6px;flex:none}
.btn{
  display:grid;place-items:center;border:0;cursor:pointer;color:var(--ink);
  background:transparent;border-radius:50%;transition:transform .18s, background .2s, box-shadow .3s;
  -webkit-tap-highlight-color:transparent;padding:0
}
.btn--nav{width:32px;height:32px;color:var(--muted)}
.btn--nav:hover{color:var(--ink);background:rgba(255,232,208,.08)}
.btn--play{
  width:50px;height:50px;color:#2A1206;
  background:linear-gradient(160deg, #FFD9A3, var(--amber) 54%, #E07A32);
  box-shadow:0 8px 26px -9px rgba(255,139,61,.95), inset 0 1px 0 rgba(255,255,255,.45)
}
.btn--play:hover{transform:scale(1.04)}
.btn--play svg{grid-area:1/1}
.btn--play .i-pause{display:none}
.btn.playing .i-play{display:none}
.btn.playing .i-pause{display:block}

.scrub{display:flex;align-items:center;gap:10px;flex:1 1 auto;min-width:110px}
.scrub__t{font-size:.58rem;color:var(--dim);letter-spacing:.06em;font-variant-numeric:tabular-nums;flex:none}
.bar{position:relative;height:3px;border-radius:3px;background:rgba(255,232,208,.20);cursor:pointer;touch-action:none;flex:1}
.bar__fill{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:3px;background:linear-gradient(90deg,var(--hot),var(--fire))}
.bar__knob{
  position:absolute;top:50%;left:0;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;
  background:var(--cream);box-shadow:0 2px 8px rgba(0,0,0,.5)
}

.vol{display:flex;align-items:center;gap:7px;color:var(--dim);flex:none}
.vol input[type=range]{
  -webkit-appearance:none;appearance:none;width:72px;height:2px;border-radius:2px;background:rgba(255,232,208,.22);outline:none
}
.vol input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;width:11px;height:11px;border-radius:50%;background:var(--cream);cursor:pointer;
  box-shadow:0 0 0 1px rgba(0,0,0,.25)
}
.vol input[type=range]::-moz-range-thumb{width:11px;height:11px;border:0;border-radius:50%;background:var(--cream);cursor:pointer}

.strip__acts{display:flex;align-items:center;gap:16px;flex:none}
.link{
  display:inline-flex;align-items:baseline;gap:7px;border:0;background:transparent;cursor:pointer;padding:3px 0;
  font-family:var(--sans);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
  transition:color .2s;-webkit-tap-highlight-color:transparent;white-space:nowrap
}
.link:hover{color:var(--cream)}
.link__dim{color:var(--dim);letter-spacing:.08em;text-transform:none;font-size:.6rem}

/* плейлист — раскрывается вверх над полосой */
.tracks{display:none;list-style:none;margin:0;padding:0 clamp(14px,2.6vw,26px);max-width:1180px;margin:0 auto}
.dock.open .tracks{display:block;max-height:46vh;overflow:auto;padding-top:6px;border-bottom:1px solid rgba(255,232,208,.10)}
.tracks li{
  display:grid;grid-template-columns:30px 1fr auto auto;align-items:center;gap:12px;
  padding:10px 4px;border-bottom:1px solid rgba(255,232,208,.07);cursor:pointer;
  font-size:.78rem;color:var(--muted);transition:color .2s,background .2s
}
.tracks li:hover{color:var(--ink);background:rgba(255,232,208,.04)}
.tracks li.active{color:var(--cream)}
.tracks li.active .t-idx{color:var(--fire)}
.t-idx{font-size:.64rem;color:var(--dim);font-variant-numeric:tabular-nums}
.t-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.t-mood{font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.t-dur{font-size:.64rem;color:var(--dim);font-variant-numeric:tabular-nums}

.toast{
  position:fixed;left:50%;top:calc(env(safe-area-inset-top,0px) + 74px);transform:translate(-50%,8px);
  padding:10px 16px;border-radius:99px;background:rgba(20,11,8,.92);border:1px solid rgba(255,232,208,.18);
  font-size:.72rem;color:var(--cream);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;
  z-index:9;white-space:nowrap;max-width:90vw;overflow:hidden;text-overflow:ellipsis
}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* ---------- адаптив ---------- */
@media (max-width:860px){
  .strip__row{flex-wrap:wrap;row-gap:10px;gap:14px}
  .now{order:1;flex:1 1 100%;max-width:none}
  .now__title{font-size:1.1rem}
  .controls{order:2}
  .scrub{order:3;flex:1 1 100%}
  .vol{order:4;display:none}
  .strip__acts{order:5;flex:1 1 100%;justify-content:space-between;border-top:1px solid rgba(255,232,208,.10);padding-top:8px}
  .link__dim{display:none}
  .brand__mark{height:24px}
  .brand__name{font-size:.94rem}
  .brand__name small{font-size:.48rem;letter-spacing:.2em}
  .top__right{gap:10px}
  .online{padding:5px 10px;font-size:.52rem}
  .online b{font-size:.8rem}
  .live{font-size:.52rem;letter-spacing:.18em}
}

@media (prefers-reduced-motion:reduce){
  .candle__glow,.candle__flame,.live.on i,.firelight,.firelight--hot{animation:none}
  body.is-playing .disc{animation:none}
  .warmth{opacity:.42}
}

/* ---------------- шторка «поделиться» ---------------- */
html.shs-lock{overflow:hidden}
.shs{position:fixed;inset:0;z-index:130;display:flex;align-items:flex-end;justify-content:center}
.shs[hidden]{display:none}
.shs__back{position:absolute;inset:0;background:rgba(18,12,10,.48);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:shsFade .18s ease both}
.shs__panel{position:relative;width:min(470px,100%);max-height:92vh;overflow:auto;border-radius:20px 20px 0 0;padding:20px 18px 16px;animation:shsUp .24s cubic-bezier(.2,.85,.25,1) both}
@keyframes shsUp{from{transform:translateY(102%)}to{transform:translateY(0)}}
@keyframes shsFade{from{opacity:0}to{opacity:1}}
.shs__title{margin:0 0 16px;text-align:center;font-size:.68rem;letter-spacing:.24em;text-transform:uppercase}
.shs__grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.shs__item{display:flex;flex-direction:column;align-items:center;gap:9px;padding:10px 2px 4px;border:0;background:none;border-radius:14px;cursor:pointer;font:inherit;font-size:.66rem;letter-spacing:.02em;text-decoration:none;line-height:1.25;text-align:center}
.shs__ico{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;transition:transform .18s ease,box-shadow .18s ease}
.shs__ico svg{width:23px;height:23px;display:block}
.shs__mono{font-size:.8rem;font-weight:600;letter-spacing:.02em}
.shs__item:hover .shs__ico,.shs__item:focus-visible .shs__ico{transform:translateY(-2px)}
.shs__item:focus-visible{outline:1.5px solid currentColor;outline-offset:3px;border-radius:16px}
.shs__copy{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;margin-top:16px;padding:13px;border-radius:13px;background:none;font:inherit;font-size:.85rem;cursor:pointer}
.shs__copy svg{width:17px;height:17px;flex:none}
.shs__x{display:block;width:100%;margin-top:6px;padding:9px;border:0;background:none;font:inherit;font-size:.74rem;cursor:pointer;opacity:.55}
@media (min-width:640px){.shs{align-items:center}.shs__panel{border-radius:20px}}
@media (prefers-reduced-motion:reduce){.shs__back,.shs__panel{animation:none}.shs__ico{transition:none}}
/* домашняя версия — у камина */
.shs__panel{background:rgba(26,15,10,.96);color:var(--ink);border:1px solid rgba(242,164,94,.30);box-shadow:0 -18px 60px -18px rgba(0,0,0,.85),0 0 44px -20px rgba(255,139,61,.7)}
.shs__title{color:var(--muted)}
.shs__ico{border:1px solid rgba(242,164,94,.38);background:rgba(255,139,61,.10);color:var(--amber)}
.shs__item:hover .shs__ico,.shs__item:focus-visible .shs__ico{box-shadow:0 0 24px -6px rgba(255,139,61,.85);border-color:var(--amber)}
.shs__copy{border:1px solid rgba(242,164,94,.38);color:var(--ink)}
.shs__copy:hover,.shs__copy:focus-visible{background:rgba(255,139,61,.12)}
.shs__x{color:var(--dim)}
.shs__item>span:last-child{color:rgba(248,238,228,.88)}
.shs__title{color:rgba(248,238,228,.66)}

@media (max-width:400px){.shs__grid{gap:2px}.shs__item{font-size:.6rem;gap:7px}.shs__ico{width:44px;height:44px}.shs__panel{padding:18px 14px 14px}}

/* тёплый свет от камина растекается по комнате: пол, ковёр, диван, шторы, стена */
.bounce{
  position:absolute;inset:0;pointer-events:none;mix-blend-mode:soft-light;
  opacity:calc(.62 * var(--flicker));
  background:
    radial-gradient(30% 16% at 70% 84%, rgba(255,138,52,.85), transparent 78%),
    radial-gradient(34% 18% at 58% 92%, rgba(255,120,40,.55), transparent 82%),
    radial-gradient(16% 22% at 49% 58%, rgba(255,146,70,.75), transparent 78%),
    radial-gradient(10% 9% at 36% 56%, rgba(255,158,86,.55), transparent 80%),
    radial-gradient(15% 8% at 62% 69%, rgba(255,140,60,.70), transparent 80%),
    radial-gradient(26% 30% at 73% 35%, rgba(255,126,48,.60), transparent 82%),
    radial-gradient(6% 24% at 37% 30%, rgba(255,140,74,.65), transparent 82%),
    radial-gradient(7% 26% at 3% 45%, rgba(255,130,66,.40), transparent 84%),
    radial-gradient(24% 20% at 22% 62%, rgba(255,132,62,.40), transparent 84%),
    radial-gradient(14% 12% at 93% 96%, rgba(255,130,54,.50), transparent 82%);
}
/* сам свет: тёплое яркое пятно растекается от очага по всей комнате */
.bounce--warm{
  position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;
  opacity:calc(.55 * var(--flicker));
  background:
    radial-gradient(30% 16% at 70% 84%, rgba(255,132,54,.44), rgba(255,110,38,.16) 50%, transparent 82%),
    radial-gradient(40% 20% at 56% 94%, rgba(255,112,38,.24), transparent 84%),
    radial-gradient(18% 24% at 49% 58%, rgba(255,138,64,.30), transparent 80%),
    radial-gradient(11% 10% at 36% 56%, rgba(255,150,78,.22), transparent 82%),
    radial-gradient(16% 9% at 62% 69%, rgba(255,132,54,.24), transparent 82%),
    radial-gradient(28% 32% at 73% 36%, rgba(255,118,44,.24), transparent 84%),
    radial-gradient(7% 26% at 37% 30%, rgba(255,132,68,.22), transparent 84%),
    radial-gradient(8% 28% at 3% 46%, rgba(255,122,60,.14), transparent 86%),
    radial-gradient(26% 22% at 22% 62%, rgba(255,124,58,.14), transparent 86%),
    radial-gradient(15% 13% at 93% 96%, rgba(255,124,50,.20), transparent 84%);
}
/* отражения вблизи очага — только там, где они физически возможны */
.bounce--hot{
  position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;
  opacity:calc(.40 * var(--flicker));
  transform-origin:72% 62%;
  animation:bounceSway 7.4s ease-in-out infinite alternate;
  background:
    radial-gradient(7% 7% at 72.5% 60%, rgba(255,180,110,.50), transparent 72%),
    radial-gradient(14% 4% at 71% 79%, rgba(255,168,92,.34), transparent 78%),
    radial-gradient(5% 7% at 48.5% 60%, rgba(255,196,132,.30), transparent 76%),
    radial-gradient(8% 2.6% at 64% 68.5%, rgba(255,178,104,.28), transparent 78%),
    radial-gradient(9% 3% at 76% 90%, rgba(255,170,96,.26), transparent 78%);
}
@keyframes bounceSway{
  from{transform:translate3d(-0.4%,0,0) scale(.996)}
  to{transform:translate3d(0.55%,-0.3%,0) scale(1.008)}
}
@media (prefers-reduced-motion: reduce){ .bounce--hot{animation:none} }
