/* Фонотека: дизайн-система «ночник». Lora для текста и заголовков, Golos Text для интерфейса. */
@font-face{font-family:"Lora";src:url("fonts/lora.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"Golos Text";src:url("fonts/golos.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap}

:root{
  --paper:#fbfaf7;--card:#ffffff;--ink:#1e2238;--ink-2:#5b6078;--ink-3:#8b90a4;--line:#e4e2db;--line-2:#f0eee8;
  --night:#26306b;--night-2:#3a47a6;--lamp:#f2a93b;--lamp-2:#ffd58a;--lamp-ink:#2a1d05;
  --morning-a:#ffe4c7;--morning-b:#fff7ec;--day-a:#d9e9fb;--day-b:#f3f8fe;--evening-a:#f1d6e2;--evening-b:#e7ddf3;--night-a:#1c2456;--night-b:#394aa8;
  --c-baby_sleep:#5663b8;--c-sleep:#2f3b78;--c-nature:#3f8a6b;--c-meditation:#4e8c7a;--c-spa:#9a6a9c;--c-cafe:#a2623a;--c-work:#3f7b64;--c-lofi:#6d5aa6;
  --c-tales:#b56a3c;--c-kids_songs:#d9922a;--c-pets:#c7893d;--c-sport:#d2503c;--c-erotic:#8c2f55;--c-classical:#6b5340;--c-ethnic:#b0552c;
  --serif:"Lora",Georgia,"Times New Roman",serif;--sans:"Golos Text",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --max:1120px;--measure:66ch;--r-tile:14px;--r-chip:999px;--r-small:8px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){--paper:#141726;--card:#1b1f31;--ink:#ecebe4;--ink-2:#a7acbf;--ink-3:#7c819a;--line:#2a3047;--line-2:#222740;
    --morning-a:#4a3520;--morning-b:#2a2238;--day-a:#20355a;--day-b:#1a2236;--evening-a:#4a2a44;--evening-b:#2b2446;--night-a:#0f1434;--night-b:#2a3786}
}
:root[data-theme="dark"]{--paper:#141726;--card:#1b1f31;--ink:#ecebe4;--ink-2:#a7acbf;--ink-3:#7c819a;--line:#2a3047;--line-2:#222740;
  --morning-a:#4a3520;--morning-b:#2a2238;--day-a:#20355a;--day-b:#1a2236;--evening-a:#4a2a44;--evening-b:#2b2446;--night-a:#0f1434;--night-b:#2a3786}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.65 var(--serif);overflow-x:hidden}
body.has-dock{padding-bottom:64px}
a{color:var(--night-2);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--night)}
:focus-visible{outline:3px solid var(--lamp);outline-offset:2px;border-radius:4px}
img,svg{max-width:100%}
.ic{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.15em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px;top:0;background:var(--night);color:#fff;padding:8px 12px;z-index:50;font-family:var(--sans)}
.skip:focus{left:8px}

/* header */
.site-header{background:var(--paper);border-bottom:1px solid var(--line-2);position:relative;z-index:20}
.header-inner{display:flex;flex-direction:column;align-items:flex-start;gap:0;padding-top:4px}
.logo{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);padding:10px 0}
.logo-mark{width:36px;height:36px;flex:none;display:block}
.logo-text{font:600 19px/1 var(--serif);letter-spacing:-.01em}
.logo-text small{display:block;margin-top:4px;font:400 12px/1 var(--sans);color:var(--ink-2)}
.nav{display:flex;gap:2px;margin:0 -20px;padding:0 20px 4px;font-family:var(--sans);font-size:14.5px;overflow-x:auto;scrollbar-width:none;max-width:calc(100% + 40px)}
@media (min-width:960px){.nav{flex-wrap:wrap;overflow:visible}}
.nav::-webkit-scrollbar{display:none}
.nav a{color:var(--ink);text-decoration:none;padding:6px 10px 8px;white-space:nowrap;border-bottom:2px solid transparent;border-radius:0}
.nav a:first-child{padding-left:0}
.nav a:hover{color:var(--night-2)}
.nav a[aria-current]{border-bottom-color:var(--lamp);color:var(--ink)}
.nav .sep{width:1px;background:var(--line);margin:8px 6px}

/* sky heroes */
.sky{position:relative;overflow:hidden;width:100vw;margin-left:calc(50% - 50vw);padding:36px 0 34px;isolation:isolate}
.sky .wrap{position:relative;z-index:2}
.sky:before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,var(--sky-a),var(--sky-b))}
.sky:after{content:"";position:absolute;z-index:1;width:var(--orb,340px);height:var(--orb,340px);border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 50% 50%,var(--orb-c,#ffe6b3) 0,var(--orb-c,#ffe6b3) 38%,transparent 70%);opacity:.9;filter:blur(2px)}
.sky-morning{--sky-a:var(--morning-a);--sky-b:var(--morning-b);--orb-c:#ffd49a}
.sky-morning:after{right:6%;bottom:-150px}
.sky-day{--sky-a:var(--day-a);--sky-b:var(--day-b);--orb-c:#ffe29b}
.sky-day:after{right:12%;top:-170px}
.sky-evening{--sky-a:var(--evening-a);--sky-b:var(--evening-b);--orb-c:#ffb48f}
.sky-evening:after{left:4%;bottom:-200px;--orb:380px}
.sky-night{--sky-a:var(--night-a);--sky-b:var(--night-b);--orb-c:#fff3cf;--orb:120px;color:#f3f1ea}
.sky-night:after{right:10%;top:28px;filter:none;opacity:1;box-shadow:0 0 60px 24px rgba(255,235,180,.22)}
.sky-night .lead,.sky-night .hint,.sky-night .kicker,.sky-night .crumbs a,.sky-night .crumbs span,.sky-night .crumbs li+li:before{color:#d9dcf2}
.sky-night .hublink{color:var(--ink)}
.sky-night .hublink .ic{color:var(--night-2)}
.sky-night a{color:#fff}
.sky-night .chip{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28);color:#fff}
.sky-night .chip:hover{background:rgba(255,255,255,.16)}
.sky-night .chip-primary{background:var(--lamp);color:var(--lamp-ink);border-color:var(--lamp)}
.sky-night .stars{position:absolute;inset:0;z-index:1;pointer-events:none;background:
  radial-gradient(1.5px 1.5px at 12% 30%,#fff 50%,transparent 60%),radial-gradient(1px 1px at 28% 70%,#fff 50%,transparent 60%),
  radial-gradient(1.5px 1.5px at 44% 22%,#fff 50%,transparent 60%),radial-gradient(1px 1px at 62% 58%,#fff 50%,transparent 60%),
  radial-gradient(1.2px 1.2px at 80% 80%,#fff 50%,transparent 60%),radial-gradient(1px 1px at 90% 18%,#fff 50%,transparent 60%),
  radial-gradient(1px 1px at 70% 36%,#fff 50%,transparent 60%);opacity:.7}
@media (prefers-reduced-motion:no-preference){.sky-home:after{animation:glow 9s ease-in-out infinite alternate}}
@media (max-width:700px){.sky:after{--orb:220px;right:-70px;top:-90px;bottom:auto;left:auto;opacity:.75}.sky-night:after{--orb:54px;right:16px;top:-4px;opacity:1}.sky-evening:after{left:auto}}
@keyframes glow{from{transform:translateY(0) scale(1);opacity:.85}to{transform:translateY(-10px) scale(1.04);opacity:1}}

.crumbs{font-family:var(--sans);font-size:13px;color:var(--ink-2)}
.crumbs ol{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-wrap:wrap;gap:2px}
.crumbs li+li:before{content:"/";margin:0 8px;color:var(--ink-3)}
.crumbs a{color:var(--ink-2);text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.kicker{font:500 14px/1.3 var(--sans);color:var(--ink-2);margin:0 0 10px}
.kicker a{color:inherit}
h1{font:600 clamp(30px,4.6vw,46px)/1.12 var(--serif);letter-spacing:-.015em;margin:0 0 14px;max-width:18ch}
h1.wide{max-width:28ch}
.lead{font-size:clamp(17px,1.5vw,19.5px);line-height:1.55;color:var(--ink-2);max-width:62ch;margin:0 0 20px}
h2{font:600 clamp(22px,2.6vw,29px)/1.2 var(--serif);letter-spacing:-.01em;margin:44px 0 14px}
h3{font:600 18px/1.3 var(--serif);margin:0}
.hint{font:400 13.5px/1.45 var(--sans);color:var(--ink-2);margin:10px 0 0;max-width:62ch}
.muted{color:var(--ink-2)}
.small{font-family:var(--sans);font-size:14px}

/* chips (streaming) */
.listen{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 0;font-family:var(--sans)}
.chip{display:inline-flex;align-items:center;gap:8px;padding:9px 14px 9px 12px;border-radius:var(--r-chip);border:1px solid var(--line);background:var(--card);color:var(--ink);
  text-decoration:none;font-weight:500;font-size:14px;line-height:1.2;white-space:nowrap}
.chip:hover{border-color:var(--ink-3);color:var(--ink)}
.chip .pi{width:18px;height:18px;flex:none;color:var(--p,#666);display:block}
.chip-primary{background:var(--lamp);border-color:var(--lamp);color:var(--lamp-ink);font-weight:600}
.chip-primary:hover{background:#f7b24a;border-color:#f7b24a;color:var(--lamp-ink)}
.chip-primary .pi{color:var(--p)}
.listen.compact .chip{padding:6px 11px 6px 9px;font-size:13px;gap:6px;position:relative}
.listen.compact .chip .pi{width:15px;height:15px}
.p-yandex{--p:#ffcc00}.p-zvuk{--p:#7c3aed}.p-vk{--p:#0077ff}.p-spotify{--p:#1db954}.p-apple{--p:#fa2d48}.p-youtube{--p:#ff0033}
@media (max-width:640px){
  .listen.compact .chip-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
  .listen.compact .chip{padding:7px;min-width:34px;justify-content:center}
}
.copybtn{display:inline-flex;align-items:center;gap:6px;font:500 13px/1 var(--sans);color:var(--ink-2);background:none;border:1px solid var(--line);border-radius:var(--r-chip);padding:7px 11px;cursor:pointer}
.copybtn:hover{color:var(--ink);border-color:var(--ink-3)}
.copybtn.done{color:var(--night-2);border-color:var(--night-2)}
.sky-night .copybtn{color:#e6e8f6;border-color:rgba(255,255,255,.3)}

/* layout with rail */
.layout{display:grid;grid-template-columns:minmax(0,1fr);gap:40px;padding-top:8px}
@media (min-width:960px){.layout{grid-template-columns:minmax(0,1fr) 292px;gap:56px}.rail{position:sticky;top:20px;align-self:start}}
.rail-box{border:1px solid var(--line);border-radius:var(--r-tile);padding:18px;background:var(--card);font-family:var(--sans)}
.rail-box h2{font:600 15px/1.3 var(--sans);margin:0 0 10px;color:var(--ink-2)}
.rail-box .listen{flex-direction:column;align-items:stretch;gap:8px}
.rail-box .chip{justify-content:flex-start}
.rail-box+.rail-box{margin-top:14px}
.toc{list-style:none;margin:0;padding:0;font-size:14px}
.toc li{padding:5px 0;border-top:1px solid var(--line-2)}
.toc li:first-child{border-top:0}
.toc a{text-decoration:none;color:var(--ink)}
.toc a:hover{color:var(--night-2)}
@media (max-width:959px){.rail{display:none}}

/* prose */
.prose{max-width:var(--measure)}
.prose p{margin:0 0 16px}
.prose h2{margin-top:36px}
.prose ul{padding-left:22px}
.prose li{margin:4px 0}
.when ul{list-style:none;padding:0;margin:0;max-width:var(--measure)}
.when li{position:relative;padding:8px 0 8px 26px;border-top:1px solid var(--line-2)}
.when li:first-child{border-top:0}
.when li:before{content:"";position:absolute;left:4px;top:17px;width:9px;height:9px;border-radius:50%;background:var(--lamp)}

/* tiles (hubs, playlists) */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(236px,1fr));gap:12px}
.tile{display:flex;flex-direction:column;gap:10px;padding:18px 18px 16px;border-radius:var(--r-tile);text-decoration:none;color:var(--ink);background:var(--card);border:1px solid var(--line);min-height:132px;position:relative}
.tile:hover{border-color:var(--ink-3)}
.tile .ic{width:30px;height:30px;color:var(--tint,var(--night));stroke-width:1.6}
.tile-title{font:600 18px/1.25 var(--serif)}
.tile-sub{font:400 13.5px/1.4 var(--sans);color:var(--ink-2)}
.tile-baby_sleep{--tint:var(--c-baby_sleep)}.tile-sleep{--tint:var(--c-sleep)}.tile-nature{--tint:var(--c-nature)}.tile-meditation{--tint:var(--c-meditation)}.tile-spa{--tint:var(--c-spa)}
.tile-cafe{--tint:var(--c-cafe)}.tile-work{--tint:var(--c-work)}.tile-lofi{--tint:var(--c-lofi)}.tile-tales{--tint:var(--c-tales)}.tile-kids_songs{--tint:var(--c-kids_songs)}
.tile-pets{--tint:var(--c-pets)}.tile-sport{--tint:var(--c-sport)}.tile-erotic{--tint:var(--c-erotic)}.tile-classical{--tint:var(--c-classical)}.tile-ethnic{--tint:var(--c-ethnic)}

/* day strip (home) */
.daystrip{margin:26px 0 0}
.daybar{height:14px;border-radius:999px;background:linear-gradient(90deg,#ffd3a3 0%,#ffe9bd 22%,#cfe3fb 42%,#f4cfe0 64%,#5b6ac4 82%,#1c2456 100%)}
.daycols{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:14px}
.tod-head{display:flex;align-items:center;gap:10px;margin:0 0 10px;min-width:0}
.tod-orb{width:40px;height:40px;flex:none;display:block;filter:drop-shadow(0 4px 10px rgba(255,180,80,.28));transition:transform .35s ease,filter .35s ease}
.daycol{border-radius:16px;padding:8px;margin:-8px;transition:background .35s ease,box-shadow .35s ease}
.daycol:hover .tod-orb{transform:translateY(-2px) scale(1.06)}
.daycol.is-active{background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.sky-home:not(.is-night):not(.is-dusk) .daycol.is-active{background:rgba(38,48,107,.06);box-shadow:inset 0 0 0 1px rgba(38,48,107,.12)}
.day-morning .tod-orb{filter:drop-shadow(0 4px 12px rgba(255,160,70,.4))}
.day-day .tod-orb{filter:drop-shadow(0 4px 14px rgba(255,200,60,.45))}
.day-evening .tod-orb{filter:drop-shadow(0 4px 12px rgba(255,100,100,.35))}
.day-night .tod-orb{filter:drop-shadow(0 4px 14px rgba(180,200,255,.4))}
.daycol h2{font:600 15px/1.2 var(--sans);margin:0;color:var(--ink-2);min-width:0}
.daycol h2 span{display:block;font:400 12px/1.3 var(--sans);color:var(--ink-3);margin-top:3px}
.hublinks{display:flex;flex-direction:column;gap:8px}
.hublink{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font:500 15px/1.3 var(--sans);padding:10px 12px;border-radius:12px;background:var(--card);border:1px solid var(--line)}
.hublink:hover{border-color:var(--ink-3)}
.hublink .ic{width:22px;height:22px;flex:none;color:var(--night-2)}
.hublink small{display:block;font:400 12.5px/1.3 var(--sans);color:var(--ink-2)}
@media (max-width:760px){.daycols{grid-template-columns:1fr 1fr}}
@media (max-width:460px){.daycols{grid-template-columns:1fr}}

/* persona cards */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(236px,1fr));gap:10px}
.pcard{display:flex;gap:12px;align-items:center;padding:10px 12px 10px 10px;border-radius:12px;background:var(--card);border:1px solid var(--line);text-decoration:none;color:var(--ink)}
.pcard:hover{border-color:var(--ink-3)}
.pcard-body{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.pcard-name{font:600 16px/1.25 var(--serif)}
.pcard-tag{font:400 13px/1.35 var(--sans);color:var(--ink-2)}
.pcard-sub{font:400 12px/1.3 var(--sans);color:var(--ink-3);margin-top:2px}
.avatar{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:color-mix(in srgb,var(--tint,var(--night)) 14%,var(--card));color:var(--tint,var(--night))}
.avatar .ic{width:22px;height:22px}
.avatar.big{width:92px;height:92px;border-radius:26px}
.avatar.big .ic{width:44px;height:44px}
.av-baby_sleep{--tint:var(--c-baby_sleep)}.av-sleep{--tint:var(--c-sleep)}.av-nature{--tint:var(--c-nature)}.av-meditation{--tint:var(--c-meditation)}.av-spa{--tint:var(--c-spa)}
.av-cafe{--tint:var(--c-cafe)}.av-work{--tint:var(--c-work)}.av-lofi{--tint:var(--c-lofi)}.av-tales{--tint:var(--c-tales)}.av-kids_songs{--tint:var(--c-kids_songs)}
.av-pets{--tint:var(--c-pets)}.av-sport{--tint:var(--c-sport)}.av-erotic{--tint:var(--c-erotic)}.av-classical{--tint:var(--c-classical)}.av-ethnic{--tint:var(--c-ethnic)}
.sky-night .avatar{background:rgba(255,255,255,.12);color:#fff}
.persona-hero .wrap{display:flex;gap:22px;align-items:flex-start}
@media (max-width:600px){.persona-hero .wrap{flex-direction:column;gap:14px}}

/* album shelf */
.shelf{display:flex;flex-direction:column;gap:10px}
.album{border:1px solid var(--line);border-radius:var(--r-tile);background:var(--card);padding:14px 16px}
.album-head{display:flex;gap:14px;align-items:flex-start}
.cover{flex:none;width:68px;height:68px;border-radius:12px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,var(--tint,var(--night)),color-mix(in srgb,var(--tint,var(--night)) 55%,#fff))}
.cover .ic{width:30px;height:30px;stroke-width:1.5}
.cover[data-v="1"]{background:linear-gradient(200deg,var(--tint,var(--night)),color-mix(in srgb,var(--tint,var(--night)) 60%,#fff))}
.cover[data-v="2"]{background:linear-gradient(120deg,color-mix(in srgb,var(--tint,var(--night)) 80%,#000),var(--tint,var(--night)))}
.cover[data-v="3"]{background:linear-gradient(160deg,color-mix(in srgb,var(--tint,var(--night)) 70%,#fff),var(--tint,var(--night)))}
.cv-baby_sleep{--tint:var(--c-baby_sleep)}.cv-sleep{--tint:var(--c-sleep)}.cv-nature{--tint:var(--c-nature)}.cv-meditation{--tint:var(--c-meditation)}.cv-spa{--tint:var(--c-spa)}
.cv-cafe{--tint:var(--c-cafe)}.cv-work{--tint:var(--c-work)}.cv-lofi{--tint:var(--c-lofi)}.cv-tales{--tint:var(--c-tales)}.cv-kids_songs{--tint:var(--c-kids_songs)}
.cv-pets{--tint:var(--c-pets)}.cv-sport{--tint:var(--c-sport)}.cv-erotic{--tint:var(--c-erotic)}.cv-classical{--tint:var(--c-classical)}.cv-ethnic{--tint:var(--c-ethnic)}
.album-meta{flex:1;min-width:0}
.album-title{font:600 19px/1.25 var(--serif);margin:2px 0 3px}
.album-artists{margin:0;font:400 14px/1.45 var(--sans);color:var(--ink-2)}
.album-artists a{color:var(--ink)}
.album-info{margin:3px 0 0;font:400 13px/1.4 var(--sans);color:var(--ink-3)}
.album-info a{color:var(--ink-2)}
.tracks{margin-top:10px;border-top:1px solid var(--line-2);padding-top:8px;font-family:var(--sans)}
.tracks summary{cursor:pointer;font-weight:500;font-size:14px;color:var(--night-2);list-style:none;display:inline-flex;align-items:center;gap:6px}
.tracks summary::-webkit-details-marker{display:none}
.tracks summary:before{content:"+";display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;border:1px solid currentColor;font-size:13px;line-height:1}
.tracks[open] summary:before{content:"–"}
.tracks ol{columns:2;column-gap:28px;font:400 14.5px/1.5 var(--serif);margin:10px 0 2px;padding-left:26px}
.tracks li{break-inside:avoid;padding:2px 0}
.tracks li::marker{font-family:var(--sans);color:var(--ink-3);font-size:12.5px}
@media (max-width:640px){.tracks ol{columns:1}.cover{width:56px;height:56px}.cover .ic{width:26px;height:26px}}

/* faq */
.faq{max-width:var(--measure)}
.faq-item{border-top:1px solid var(--line);padding:4px 0}
.faq-item:last-child{border-bottom:1px solid var(--line)}
.faq-item summary{cursor:pointer;font:600 17px/1.4 var(--serif);padding:10px 36px 10px 0;list-style:none;position:relative}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:"+";position:absolute;right:4px;top:8px;font:400 22px/1 var(--sans);color:var(--ink-3)}
.faq-item[open] summary:after{content:"–"}
.faq-item p{margin:0 0 14px;color:var(--ink-2)}

/* catalog filters */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px;font-family:var(--sans)}
.filters button{font:500 13.5px/1 var(--sans);padding:8px 12px;border-radius:var(--r-chip);border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer}
.filters button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.search{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:12px;background:var(--card);padding:8px 12px;max-width:460px;margin:0 0 14px;font-family:var(--sans)}
.search input{border:0;background:none;font:400 16px/1.3 var(--sans);color:var(--ink);width:100%;outline:none}
.search .ic{color:var(--ink-3);width:18px;height:18px}
.empty{display:none;color:var(--ink-2);font-family:var(--sans);padding:16px 0}
.compact .album{padding:10px 14px}
.compact .cover{width:48px;height:48px;border-radius:10px}
.compact .cover .ic{width:22px;height:22px}
.compact .album-title{font-size:17px}

/* mobile dock */
.dock{display:none}
@media (max-width:959px){
  .dock{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;gap:8px;align-items:center;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:var(--paper);border-top:1px solid var(--line);font-family:var(--sans);overflow-x:auto}
  .dock .label{font:500 13px/1.2 var(--sans);color:var(--ink-2);white-space:nowrap;margin-right:2px}
  .dock .chip{padding:8px 12px 8px 10px;font-size:13px}
}

/* sections, footer */
.section{margin-top:44px}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap}
.section-head h2{margin:0 0 14px}
.section-head .small a{color:var(--ink-2)}
.site-footer{margin-top:64px;border-top:1px solid var(--line);background:var(--card);font-family:var(--sans);font-size:14px;color:var(--ink-2)}
.footer-inner{display:grid;gap:22px;padding:28px 20px 32px;grid-template-columns:1fr}
.footer-inner h2{font:600 14px/1.3 var(--sans);color:var(--ink);margin:0 0 8px}
.footer-inner ul{list-style:none;margin:0;padding:0}
.footer-inner li{margin:0 0 6px}
.footer-inner a{color:var(--ink-2)}
.footer-inner a:hover{color:var(--ink)}
.footer-note{grid-column:1/-1;font-size:13px;color:var(--ink-3);border-top:1px solid var(--line-2);padding-top:14px}
@media (min-width:720px){.footer-inner{grid-template-columns:1.4fr 1fr 1fr}}

/* images */
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:22px;align-items:center}
@media (min-width:760px){.hero-grid{grid-template-columns:minmax(0,1fr) 300px;gap:40px}}
.hero-art{width:100%;max-width:300px;height:auto;border-radius:28px;box-shadow:0 18px 50px rgba(20,24,56,.25);justify-self:end}
@media (max-width:759px){.hero-art{max-width:220px;justify-self:start;order:-1}}
.portrait{flex:none;width:168px;height:168px;border-radius:36px;object-fit:cover;box-shadow:0 14px 40px rgba(20,24,56,.28)}
@media (max-width:600px){.portrait{width:132px;height:132px;border-radius:28px}}
.avatar-img{object-fit:cover;background:var(--card)}
.cover-img{object-fit:cover;background:var(--card)}
.tile-has-img{padding:0;overflow:hidden;gap:0}
.tile-has-img .tile-img{width:100%;height:132px;object-fit:cover;display:block}
.tile-has-img .tile-title{padding:12px 16px 0}
.tile-has-img .tile-sub{padding:4px 16px 14px}
.tile-has-img:before{display:none}

/* картинки персонажей: мозаика в шапке, крупные карточки, веер аватаров на плитках */
.mosaic{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;max-width:300px;justify-self:end}
.mosaic a{display:block;border-radius:22px;overflow:hidden;box-shadow:0 12px 34px rgba(20,24,56,.22);background:var(--card);aspect-ratio:1}
.mosaic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s ease}
.mosaic a:hover img{transform:scale(1.04)}
.mosaic.n1{grid-template-columns:1fr}.mosaic.n1 a{border-radius:28px}
.mosaic.n3 a:first-child{grid-row:1/3}
@media (max-width:759px){.mosaic{max-width:100%;grid-template-columns:repeat(4,1fr);justify-self:start;order:-1;gap:8px;margin-bottom:18px}.mosaic.n3{grid-template-columns:repeat(3,1fr)}.mosaic.n3 a:first-child{grid-row:auto}.mosaic.n2{grid-template-columns:repeat(2,1fr);max-width:240px}.mosaic a{border-radius:16px}}
@media (prefers-reduced-motion:reduce){.mosaic img{transition:none}.mosaic a:hover img{transform:none}}
.pgrid-big{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.pbig{display:flex;flex-direction:column;gap:10px;padding:10px;border-radius:var(--r-tile);background:var(--card);border:1px solid var(--line);text-decoration:none;color:var(--ink);min-width:0}
.pbig:hover{border-color:var(--ink-3)}
.pbig-img{width:100%;aspect-ratio:1;height:auto;border-radius:12px;object-fit:cover;display:block;background:var(--card)}
.pbig .avatar.pbig-img{display:grid;place-items:center;width:100%;height:auto;border-radius:12px}
.pbig .avatar .ic{width:38px;height:38px}
.pbig .pcard-name{font-size:15.5px}.pbig .pcard-tag{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fan{display:flex;height:40px;margin-bottom:2px}
.fan img{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid var(--card);background:var(--card);box-shadow:0 2px 8px rgba(20,24,56,.14)}
.fan img+img{margin-left:-12px}

/* луна на ночных шапках: настоящий диск вместо плоского круга */
.sky-night{--orb:150px}
.sky-night:after{background:url(sky/moon.svg) center/100% 100% no-repeat;border-radius:50%;box-shadow:0 0 50px 18px rgba(255,236,185,.2),0 0 140px 50px rgba(160,175,255,.12);top:22px;right:9%}
@media (max-width:700px){.sky-night:after{--orb:64px;right:16px;top:6px;box-shadow:0 0 26px 8px rgba(255,236,185,.22)}}

/* главная: солнце/восход/закат/луна по колонке времени дня */
.sky-home:after{content:none}
.sky-home{color:var(--ink);transition:color .9s ease}
.sky-home:before{background:linear-gradient(180deg,var(--day-a) 0%,var(--day-b) 62%,#fff3dc 100%);transition:background .9s ease}
.sky-home .skyfx{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .9s ease;
  background:radial-gradient(120% 70% at 78% 0%,rgba(120,140,255,.28),transparent 60%),linear-gradient(180deg,var(--night-a),var(--night-b))}
.sky-home h1,.sky-home .lead,.sky-home .daycol h2,.sky-home .daycol h2 span{transition:color .7s ease}
.sky-home.is-night .tod-orb{filter:drop-shadow(0 6px 16px rgba(255,220,160,.35))}
.sky-home.is-night .day-night .tod-orb{filter:drop-shadow(0 6px 18px rgba(210,220,255,.55))}
@media (prefers-reduced-motion:reduce){.daycol:hover .tod-orb{transform:none}}
.sky-home .stars{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .9s ease;background:
  radial-gradient(1.5px 1.5px at 12% 30%,#fff 50%,transparent 60%),radial-gradient(1px 1px at 28% 70%,#fff 50%,transparent 60%),
  radial-gradient(1.5px 1.5px at 44% 22%,#fff 50%,transparent 60%),radial-gradient(1px 1px at 62% 58%,#fff 50%,transparent 60%),
  radial-gradient(1.2px 1.2px at 80% 80%,#fff 50%,transparent 60%),radial-gradient(1px 1px at 90% 18%,#fff 50%,transparent 60%),
  radial-gradient(1px 1px at 70% 36%,#fff 50%,transparent 60%),radial-gradient(1.3px 1.3px at 6% 64%,#fff 50%,transparent 60%),
  radial-gradient(1px 1px at 36% 44%,#fff 50%,transparent 60%),radial-gradient(1.2px 1.2px at 54% 12%,#fff 50%,transparent 60%),
  radial-gradient(1px 1px at 96% 52%,#fff 50%,transparent 60%),radial-gradient(1.2px 1.2px at 20% 10%,#fff 50%,transparent 60%)}

/* рассвет */
.sky-home.is-dawn:before{background:linear-gradient(180deg,#9ec8f0 0%,#ffd3a8 48%,#ffe8c8 100%)}
.sky-home.is-dawn .skyfx{opacity:0}
.sky-home.is-dawn .stars{opacity:0}
/* день — дефолт */
.sky-home.is-day:before{background:linear-gradient(180deg,var(--day-a) 0%,var(--day-b) 62%,#fff3dc 100%)}
.sky-home.is-day .skyfx,.sky-home.is-day .stars{opacity:0}
/* закат */
.sky-home.is-dusk{color:#f7efe8}
.sky-home.is-dusk:before{background:linear-gradient(180deg,#3a2a58 0%,#c45a6a 42%,#ffb07a 78%,#ffd8b0 100%)}
.sky-home.is-dusk .skyfx{opacity:.35;background:radial-gradient(90% 60% at 80% 10%,rgba(255,120,90,.25),transparent 55%),linear-gradient(180deg,#2a1a40,#6a3050)}
.sky-home.is-dusk .stars{opacity:.25}
.sky-home.is-dusk h1{color:#fff}
.sky-home.is-dusk .lead{color:#f0d8d0}
.sky-home.is-dusk .daycol h2{color:#f2e6e0}
.sky-home.is-dusk .daycol h2 span{color:#d8b8b0}
/* ночь */
.sky-home.is-night:not(.is-dusk){color:#f3f1ea}
.sky-home.is-night:not(.is-dusk) .skyfx{opacity:1}
.sky-home.is-night:not(.is-dusk) .stars{opacity:.8}
.sky-home.is-night:not(.is-dusk) h1{color:#fff}
.sky-home.is-night:not(.is-dusk) .lead{color:#d9dcf2}
.sky-home.is-night:not(.is-dusk) .daycol h2{color:#e6e8f6}
.sky-home.is-night:not(.is-dusk) .daycol h2 span{color:#aeb4dc}

.celest{position:relative;z-index:1;width:240px;height:240px;justify-self:center;pointer-events:none}
.hero-sky .celest{margin:0 30px}
.homestrip .mosaic{grid-template-columns:repeat(4,78px);max-width:none;justify-self:start;gap:10px;margin-top:6px}
.homestrip .mosaic a{border-radius:18px;box-shadow:0 6px 18px rgba(20,24,56,.2)}
.celest>*{position:absolute;left:0;top:0;width:100%;height:100%}
.celest .halo{border-radius:50%;transform:scale(2.1);background:radial-gradient(circle,rgba(255,214,120,.55) 0,rgba(255,214,120,.18) 32%,transparent 62%);transition:opacity .8s ease,transform .9s ease,background .8s ease}
.celest .halo:after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,rgba(205,218,255,.5) 0,rgba(170,185,255,.16) 30%,transparent 60%);opacity:0;transition:opacity .8s ease}
.celest .orb{opacity:0;transform:translateY(56px) scale(.86);transition:transform .85s cubic-bezier(.33,.1,.25,1),opacity .55s ease;pointer-events:none}
.celest .orb-sun{opacity:1;transform:none}
.celest .orb-moon{filter:drop-shadow(0 0 22px rgba(255,238,190,.35))}
.celest .orb-sunrise,.celest .orb-sunset{filter:drop-shadow(0 8px 24px rgba(255,140,60,.35))}

.sky-home.is-morning .celest .orb{opacity:0;transform:translateY(56px) scale(.86)}
.sky-home.is-morning .celest .orb-sunrise{opacity:1;transform:none}
.sky-home.is-morning .celest .halo{background:radial-gradient(circle,rgba(255,180,100,.55) 0,rgba(255,160,80,.18) 34%,transparent 62%);transform:scale(2)}

.sky-home.is-day .celest .orb{opacity:0;transform:translateY(56px) scale(.86)}
.sky-home.is-day .celest .orb-sun{opacity:1;transform:none}
.sky-home.is-day .celest .halo{background:radial-gradient(circle,rgba(255,214,120,.55) 0,rgba(255,214,120,.18) 32%,transparent 62%);transform:scale(2.1)}
.sky-home.is-day .celest .halo:after{opacity:0}

.sky-home.is-evening .celest .orb{opacity:0;transform:translateY(-40px) scale(.86)}
.sky-home.is-evening .celest .orb-sunset{opacity:1;transform:none}
.sky-home.is-evening .celest .halo{background:radial-gradient(circle,rgba(255,120,90,.5) 0,rgba(200,80,100,.2) 36%,transparent 64%);transform:scale(2.2)}
.sky-home.is-evening .celest .halo:after{opacity:0}

.sky-home.is-night:not(.is-dusk) .celest .orb{opacity:0;transform:translateY(64px) scale(.84)}
.sky-home.is-night:not(.is-dusk) .celest .orb-moon{opacity:1;transform:none}
.sky-home.is-night:not(.is-dusk) .celest .halo{transform:scale(2.4);background:radial-gradient(circle,rgba(255,236,185,0) 0,transparent 1%)}
.sky-home.is-night:not(.is-dusk) .celest .halo:after{opacity:1}

@media (prefers-reduced-motion:no-preference) and (min-width:760px){
  .sky-home.is-day .celest .orb-sun,.sky-home.is-morning .celest .orb-sunrise{animation:sunpulse 7s ease-in-out infinite alternate}
  .sky-home.is-night:not(.is-dusk) .stars{animation:twinkle 5s ease-in-out infinite alternate}
}
@keyframes sunpulse{from{filter:brightness(1)}to{filter:brightness(1.08) drop-shadow(0 0 16px rgba(255,200,90,.5))}}
@keyframes twinkle{from{opacity:.55}to{opacity:.95}}
@media (prefers-reduced-motion:reduce){.celest *,.sky-home .skyfx,.sky-home .stars,.sky-home,.sky-home:before{transition-duration:.01s!important;transition-delay:0s!important;animation:none!important}}
@media (max-width:759px){
  .celest{width:120px;height:120px;order:-1;margin:0 auto 8px}
  .homestrip .mosaic{grid-template-columns:repeat(4,1fr);order:0;margin-bottom:0}
  /* mobile: quieter sky — no pulse/twinkle, shorter travels, no filter thrash */
  .sky-home,.sky-home:before,.sky-home .skyfx,.sky-home .stars,
  .sky-home h1,.sky-home .lead,.sky-home .daycol h2,.sky-home .daycol h2 span{transition-duration:.55s}
  .celest .halo,.celest .halo:after{transition-duration:.5s}
  .celest .orb{transform:translateY(18px) scale(.94);transition:opacity .4s ease,transform .5s ease;filter:none!important}
  .sky-home.is-morning .celest .orb,
  .sky-home.is-day .celest .orb,
  .sky-home.is-night:not(.is-dusk) .celest .orb{transform:translateY(18px) scale(.94)}
  .sky-home.is-evening .celest .orb{transform:translateY(-12px) scale(.94)}
  .sky-home.is-morning .celest .orb-sunrise,
  .sky-home.is-day .celest .orb-sun,
  .sky-home.is-evening .celest .orb-sunset,
  .sky-home.is-night:not(.is-dusk) .celest .orb-moon{opacity:1;transform:none}
  .celest .halo{transform:scale(1.55)!important;opacity:.85}
  .sky-home.is-night:not(.is-dusk) .celest .halo{opacity:0}
  .sky-home.is-night:not(.is-dusk) .stars{opacity:.55;animation:none}
  .daycol{cursor:pointer;-webkit-tap-highlight-color:transparent}
  .daycol:hover .tod-orb{transform:none}
  .tod-orb{transition:none}
}
/* на шапках с портретами луна не конкурирует с ними */
.sky-night:has(.mosaic):after{display:none}
