/* kids.css — picture-book look for children 5–7 (RU public site). Fonts self-hosted: Andika (SIL, made for beginning readers) for text,
   Nunito Black for headings. Big tap targets (≥64px), big text (≥20px), bright winter palette. */
@font-face{font-family:"Andika";font-weight:400;font-display:swap;src:url(/fonts/andika-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Andika";font-weight:400;font-display:swap;src:url(/fonts/andika-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Andika";font-weight:700;font-display:swap;src:url(/fonts/andika-cyrillic-700-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Andika";font-weight:700;font-display:swap;src:url(/fonts/andika-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Nunito";font-weight:800;font-display:swap;src:url(/fonts/nunito-cyrillic-800-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Nunito";font-weight:800;font-display:swap;src:url(/fonts/nunito-latin-800-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Nunito";font-weight:900;font-display:swap;src:url(/fonts/nunito-cyrillic-900-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Nunito";font-weight:900;font-display:swap;src:url(/fonts/nunito-latin-900-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}

:root{--kid-ink:#2b1d4a;--kid-blue:#3d8bff;--kid-red:#ff4f6d;--kid-green:#2fbf71;--kid-yellow:#ffc928;--kid-violet:#8a5cff;--kid-orange:#ff8a1f}
body{font-family:"Andika","Nunito",ui-rounded,system-ui,sans-serif;font-size:20px;color:var(--kid-ink)}
h1,h2,h3,.btn,.bignav a,.logo,.say,.friend h3,.song h3,.chip,.tag{font-family:"Nunito",ui-rounded,system-ui,sans-serif;font-weight:900}
.sub,.lead,p{font-size:20px}
small,.tag,.who,.friend .sound,.crumbs{font-size:18px}

/* header: only the logo + big picture navigation */
header.top nav.menu,header.top .burger{display:none!important}
.top .wrap{height:auto;min-height:72px;flex-wrap:wrap;gap:10px;padding-top:8px;padding-bottom:8px}
.logo{font-size:22px}
.bignav{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;width:100%}
.bignav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:72px;border-radius:22px;text-decoration:none;color:#fff;
  font-size:18px;line-height:1.1;text-align:center;padding:8px 6px;box-shadow:0 5px 0 rgba(0,0,0,.15);transition:transform .15s}
.bignav a:active{transform:translateY(3px);box-shadow:0 2px 0 rgba(0,0,0,.15)}
.bignav a:hover{transform:translateY(-2px)}
.bignav a i{font-style:normal;font-size:30px;line-height:1}
.bignav a img{width:34px;height:34px;border-radius:50%;border:2px solid #fff}
.bignav .b1{background:var(--kid-orange)}.bignav .b2{background:var(--kid-blue)}.bignav .b3{background:var(--kid-violet)}.bignav .b4{background:var(--kid-red)}
.bignav a.on{outline:4px solid var(--kid-yellow)}
@media(min-width:820px){.top .wrap{flex-wrap:nowrap}.bignav{width:auto;margin-left:auto;grid-template-columns:repeat(4,minmax(120px,1fr))}.bignav a{flex-direction:row;font-size:20px;padding:10px 16px;gap:8px}}

/* hero buttons bigger */
.btn{min-height:64px;font-size:21px;padding:16px 28px}

/* friends = book covers */
.friend{padding:16px 12px 18px}
.friend h3{font-size:24px}
.friend .sound{font-size:17px}
.friend .read{display:block;margin-top:10px;background:var(--c);color:#fff;border-radius:999px;padding:8px 10px;font-family:"Nunito",sans-serif;font-weight:900;font-size:17px}

/* song cards = kid covers */
.song{border:5px solid #fff;outline:4px solid var(--c)}
.song .thumb{aspect-ratio:3/4}
.song .body{background:var(--c);border-top:0;color:#fff;padding:12px 16px 16px}
.song h3{font-size:24px;line-height:1.15;text-shadow:0 2px 0 rgba(0,0,0,.18)}
.song .story{margin:6px 0 8px;font-size:18px;line-height:1.35;color:#fff}
.song .tag{background:rgba(255,255,255,.9);color:var(--kid-ink)}
.song .play{width:84px;height:84px;margin:-42px;font-size:34px}

/* song page */
.storybox{background:#fff7d6;border:4px dashed var(--kid-yellow);border-radius:28px;padding:16px 20px;margin:14px 0;font-size:22px;line-height:1.5}
.storybox b{font-family:"Nunito",sans-serif}
.lyrbox .lyrics{font-size:clamp(28px,6.6vw,34px);line-height:1.6;font-weight:700;color:var(--kid-ink)}
.lyrbox .lyrics .blk{margin-bottom:26px}
.lyrbox .lyrics .lbl{font-size:16px}
.links a{min-height:56px;font-size:19px}

/* picture book */
.book{max-width:760px;margin:0 auto;text-align:center}
.book h1{font-size:clamp(32px,7vw,52px)}
.pages{position:relative;background:#fff;border-radius:36px;box-shadow:var(--shadow);padding:18px 18px 24px;border:6px solid var(--c,#ffc928)}
.bpage{display:none}.bpage.on{display:block;animation:turn .45s ease}
.no-js .bpage{display:block;margin-bottom:30px}
@keyframes turn{0%{opacity:0;transform:translateX(30px) rotate(1deg)}100%{opacity:1;transform:none}}
.bpage img{width:100%;max-height:min(62vh,640px);object-fit:cover;border-radius:24px;aspect-ratio:4/5}
.bpage p{font-size:clamp(26px,5.6vw,34px);line-height:1.5;margin:18px 6px 6px;font-weight:700}
.bnav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px}
.bnav button{width:84px;height:84px;border-radius:50%;border:0;background:var(--kid-orange);color:#fff;font-size:40px;cursor:pointer;box-shadow:0 6px 0 rgba(0,0,0,.15)}
.bnav button:disabled{opacity:.3;cursor:default}
.dots{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.dots i{width:18px;height:18px;border-radius:50%;background:#e5dcf5}.dots i.on{background:var(--kid-violet);transform:scale(1.2)}
.theend{font-family:"Nunito",sans-serif;font-weight:900;font-size:30px;color:var(--kid-violet)}
.herolist{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.herolist a{background:#fff;border-radius:28px;padding:14px;text-decoration:none;color:var(--kid-ink);box-shadow:var(--shadow);border-top:10px solid var(--c);text-align:center;min-height:64px}
.herolist img{height:130px;width:100%;object-fit:contain;mix-blend-mode:multiply}
.herolist b{display:block;font-family:"Nunito",sans-serif;font-size:26px}
.herolist span{font-size:18px;color:var(--ink-soft)}
@media(min-width:820px){.herolist{grid-template-columns:repeat(3,1fr)}}
.ad{border-top:3px dashed var(--line);padding-top:10px}
.ad::before{content:"Реклама";display:block;font-size:14px;color:#9a8a7a;margin-bottom:6px}

/* karaoke player */
html.kar-open{overflow:hidden}
.kar{position:fixed;inset:0;z-index:60;background:linear-gradient(180deg,#2b1d4a,#4b2a7a 60%,#7a3a8a);color:#fff;display:flex;align-items:center;justify-content:center;padding:14px}
.kar[hidden]{display:none}
.kar-in{width:100%;max-width:900px;height:100%;max-height:820px;display:flex;flex-direction:column;gap:14px;position:relative}
.kar-x{position:absolute;right:0;top:0;width:64px;height:64px;border-radius:50%;border:0;background:rgba(255,255,255,.18);color:#fff;font-size:28px;cursor:pointer}
.kar-top{display:flex;gap:14px;align-items:center;padding-right:70px}
.kar-cover{width:96px;height:128px;object-fit:cover;border-radius:18px;border:4px solid var(--c,#ffc928);flex:none}
.kar-now{font-family:"Nunito",sans-serif;font-weight:900;font-size:18px;color:#ffd84d}
.kar-title{font-size:clamp(24px,5vw,40px);margin:4px 0 0;text-align:left;color:#fff}
.kar-lyrics{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:18px;padding:10px 4px}
.kar-line{font-family:"Andika",sans-serif;font-weight:700;font-size:clamp(32px,7.6vw,60px);line-height:1.3;min-height:1.3em}
.kar-line .w{background:linear-gradient(90deg,#ffd84d var(--p,0%),rgba(255,255,255,.55) var(--p,0%));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.kar-next{font-size:clamp(22px,4.6vw,34px);color:rgba(255,255,255,.6);line-height:1.3}
.kar-bar{height:10px;border-radius:5px;background:rgba(255,255,255,.18);overflow:hidden}.kar-bar i{display:block;height:100%;width:0;background:#ffd84d}
.kar-btns{display:flex;justify-content:center;gap:16px;padding-bottom:6px}
.kar-btns button{width:76px;height:76px;border-radius:50%;border:0;background:rgba(255,255,255,.2);color:#fff;font-size:32px;cursor:pointer}
.kar-btns .kar-play{width:96px;height:96px;background:#ff4f6d;font-size:42px;box-shadow:0 6px 0 rgba(0,0,0,.25)}
.kar-btns .kar-shuf.on{background:#2fbf71}
@media(min-width:820px){.kar-cover{width:130px;height:174px}}
@media(max-width:819px){header.top .logo{display:none}}
.bpage img{max-height:48vh;aspect-ratio:auto}
footer.site .wrap{display:block!important;line-height:2}

/* big kid controls under VK players */
.vctl{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:420px;margin:12px auto 0}
.vctl button{min-height:72px;border:0;border-radius:22px;background:#3d8bff;color:#fff;font-family:"Nunito",sans-serif;font-weight:900;font-size:17px;line-height:1.1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;box-shadow:0 5px 0 rgba(0,0,0,.15)}
.vctl button i{font-style:normal;font-size:28px}
.vctl button[data-a="pause"]{background:#ff8a1f}.vctl button[data-a="fs"]{background:#8a5cff}
.vctl button:active{transform:translateY(3px);box-shadow:0 2px 0 rgba(0,0,0,.15)}
.screen + .vctl{grid-column:1/-1}
html.fs-open{overflow:hidden}
.pseudo-fs{position:fixed!important;inset:0!important;z-index:80!important;width:100vw!important;height:100vh!important;max-width:none!important;aspect-ratio:auto!important;margin:0!important;border:0!important;border-radius:0!important;background:#000}
.pseudo-fs iframe{position:absolute;inset:0;width:100%!important;height:100%!important}
.fs-close{position:absolute;right:12px;top:12px;z-index:81;min-height:64px;padding:0 20px;border:0;border-radius:999px;background:#ff4f6d;color:#fff;font-family:"Nunito",sans-serif;font-weight:900;font-size:20px}
.vplayer:fullscreen,.vplayer:-webkit-full-screen{max-width:none;border:0;border-radius:0}
.vplayer{height:min(56vh,640px);width:auto;max-width:100%}
.vplayer button.fs-close{inset:auto;right:12px;top:12px;width:auto;height:auto;padding:0 22px;min-height:64px;background:#ff4f6d}.vplayer button.fs-close::after{display:none}
.soon{text-align:center;font-family:"Nunito",sans-serif;font-weight:900;font-size:20px;color:#8a5cff;margin:10px 0}

/* 5 big nav buttons + coloring card */
.bignav{grid-template-columns:repeat(5,1fr);gap:8px}
.bignav a{font-size:16px;padding:8px 4px}
.bignav .b5{background:linear-gradient(135deg,#ff4f6d,#ffc928 50%,#2fbf71)}
@media(min-width:820px){.bignav{grid-template-columns:repeat(5,minmax(110px,1fr))}.bignav a{font-size:18px}}
.rcard-wrap{padding:10px 0 30px}
.rcard{display:flex;align-items:center;gap:18px;max-width:760px;margin:0 auto;background:#fff;border-radius:32px;padding:16px;text-decoration:none;color:var(--kid-ink);
  box-shadow:var(--shadow);border:6px dashed #ffc928;position:relative}
.rcard::before,.rcard::after{content:"✏️";position:absolute;font-size:34px}.rcard::before{left:-14px;top:-18px;transform:rotate(-20deg)}.rcard::after{right:-10px;bottom:-16px;content:"🖍";transform:rotate(15deg)}
.rcard img{width:130px;height:173px;object-fit:cover;border-radius:18px;border:4px solid #8a5cff;flex:none;background:#fff}
.rcard b{display:block;font-family:"Nunito",sans-serif;font-size:clamp(24px,5vw,34px);line-height:1.15}
.rcard span{display:block;margin:6px 0 12px;font-size:19px}
.rcard .btn{font-style:normal;pointer-events:none}
@media(max-width:520px){.rcard{flex-direction:column;text-align:center}}
@media(max-width:520px){.bignav{gap:5px}.bignav a{font-size:13px;padding:6px 2px;min-height:68px;border-radius:18px}.bignav a i{font-size:24px}.bignav a img{width:28px;height:28px}}

/* our video player */
.vplayer video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000}
.vplayer .vbig{position:absolute;inset:0;background:transparent;border:0;cursor:pointer}
.vplayer .vbig[hidden]{display:none}
.vplayer .vend{position:absolute;inset:0;display:flex;flex-direction:column;gap:14px;align-items:center;justify-content:center;background:rgba(43,29,74,.75)}
.vplayer .vend[hidden]{display:none}
.vplayer .vend .btn{min-width:220px;justify-content:center}
.pseudo-fs video{object-fit:contain}

/* ===== mobile pass (Igor 12.11): grid, equal cards, play button inside, snow behind, safe areas ===== */
html{-webkit-text-size-adjust:100%}
body{padding-bottom:env(safe-area-inset-bottom);overflow-wrap:normal;word-break:normal;hyphens:manual}
header.top{padding-top:env(safe-area-inset-top)}
.wrap{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
h1{font-size:clamp(28px,7.4vw,52px)}h2{font-size:clamp(26px,6.4vw,44px)}
.songs{display:grid;grid-template-columns:1fr;gap:18px;align-items:stretch}
@media(min-width:600px){.songs{grid-template-columns:repeat(2,1fr)}}
@media(min-width:960px){.songs{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1280px){.songs{grid-template-columns:repeat(4,1fr)}}
.song{display:flex;flex-direction:column;height:100%;outline-offset:-4px}
.song .thumb{flex:none;aspect-ratio:4/3}
.song .thumb img{object-position:center 30%}
.song .body{flex:1;display:flex;flex-direction:column}
.song .story{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:19px}
.song .tags{margin-top:auto}
.song .play{left:auto;top:auto;right:12px;bottom:12px;margin:0;width:64px;height:64px;font-size:28px}
.song h3{font-size:clamp(22px,5.6vw,26px);word-break:normal;overflow-wrap:break-word}
@media(max-width:599px){.song .thumb{aspect-ratio:16/10}}
/* snow behind content: sections with backgrounds sit above it */
.snow{z-index:0!important}
header.top{z-index:30}
main,section,footer,.page{position:relative;z-index:1}
.hero{z-index:1}
@media(max-width:600px){.snow i:nth-child(n+13){display:none}.snow i{font-size:10px!important;opacity:.6!important}}
@media(prefers-reduced-motion:reduce){.snow{display:none!important}}
.more{grid-template-columns:repeat(2,1fr)}@media(min-width:820px){.more{grid-template-columns:repeat(4,1fr)}}
.more img{aspect-ratio:4/3}
.links a,.vctl button,.bnav button,.btn{min-height:56px}
.crumbs a{display:inline-block;padding:10px 0}
footer.site a{display:inline-block;padding:8px 2px}
select,input,textarea{min-height:52px;font-size:19px}
.oform a,.agree a,label a{display:inline-block;padding:10px 2px}
@media(max-width:420px){.herolist{grid-template-columns:1fr}}
.herolist a{min-width:0}
select{-webkit-appearance:none;appearance:none;height:56px;padding:0 44px 0 14px;background:#fffdf8 url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27%3E%3Cpath fill=%27%232b1d4a%27 d=%27M7 10l5 5 5-5z%27/%3E%3C/svg%3E") no-repeat right 12px center/26px;border:2px solid var(--line);border-radius:14px}
.songline{font-size:15px;line-height:1.7;color:var(--ink-soft);padding:14px 0;border-top:1px solid var(--line);background:#fffaf2}.songline a{color:var(--ink-soft);text-decoration:none;white-space:nowrap}.songline a:hover{text-decoration:underline}
/* forms: no control may stick out of its box (iOS Safari date input has an intrinsic min-width; fieldset defaults to min-content) */
form,fieldset,.oform label{min-width:0;max-width:100%}
form input:not([type=checkbox]):not([type=radio]):not([type=range]),form select,form textarea{box-sizing:border-box;display:block;width:100%;max-width:100%;min-width:0}
input[type=date]{-webkit-appearance:none;appearance:none;min-height:56px;line-height:normal;text-align:left;background-color:#fff}
input[type=date]::-webkit-date-and-time-value{text-align:left}
.oform .hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.omsg{font-size:19px;font-weight:700;padding:14px 16px;border-radius:16px;margin:10px 0 0}.omsg.ok{background:#e6f8e9;color:#1d6b2c}.omsg.err{background:#ffe9e6;color:#a3261a}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
/* short contact form */
.oform .olead{font-size:19px;font-weight:700;margin:0 0 6px}
.oform fieldset.via{border:0;padding:0;margin:4px 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.oform fieldset.via legend{font-weight:700;padding:0;margin-bottom:6px}
.oform fieldset.via label{margin:0;position:relative}
.oform fieldset.via input{position:absolute;opacity:0;width:1px;height:1px}
.oform fieldset.via span{display:flex;align-items:center;justify-content:center;min-height:56px;padding:6px 4px;border-radius:16px;border:3px solid #e2d8f6;background:#fff;font-weight:800;font-size:17px;text-align:center;cursor:pointer}
.oform fieldset.via input:checked+span{border-color:#8a5cff;background:#f1eaff;color:#5a2fd0}
.oform fieldset.via input:focus-visible+span{outline:3px solid #ffb02e;outline-offset:2px}
@media (max-width:520px){.oform fieldset.via{grid-template-columns:repeat(2,1fr)}}
.oform label.chk{display:flex;align-items:flex-start;gap:12px;font-size:16px;font-weight:400;line-height:1.4}
.oform label.chk input{flex:none;width:28px;height:28px;margin:0;accent-color:#8a5cff}
.oform label.chk span{flex:1;min-width:0}
.oform label.chk a{display:inline;padding:0}.oform label.chk input[type=checkbox]{width:28px;height:28px;min-width:28px;transform:none}
.oform .oalt{margin:14px 0 0;text-align:center;font-weight:700;color:var(--ink-soft,#6b5a8a)}
.oform .oalt a.tgbtn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 22px;margin-left:6px;border-radius:999px;background:#2aabee;color:#fff;font-weight:900;text-decoration:none;box-shadow:0 4px 0 rgba(0,0,0,.15)}
/* slider puzzle (captcha.js) */
.cap{margin:14px 0 6px;padding:12px;border-radius:20px;background:#f6f1ff;border:3px solid #e2d8f6}
.cap.ok{border-color:#5fc37a;background:#eefaf1}.cap.bad{animation:capshake .35s}
@keyframes capshake{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.cap-t{margin:0 0 8px;font-weight:800;font-size:18px}
.cap-pic{position:relative;width:100%;max-width:420px;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#ddd;margin:0 auto}
.cap-pic img{display:block;position:absolute}.cap-bg{inset:0;width:100%;height:100%}
.cap-pc{left:0;filter:drop-shadow(0 2px 4px rgba(0,0,0,.45));pointer-events:none}
.cap-new{position:absolute;right:6px;top:6px;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.9);font-size:22px;cursor:pointer}
.cap-track{position:relative;height:56px;max-width:420px;margin:10px auto 0;border-radius:999px;background:#fff;border:3px solid #e2d8f6;touch-action:none;-webkit-user-select:none;user-select:none;cursor:grab}
.cap-fill{position:absolute;left:0;top:0;bottom:0;width:28px;border-radius:999px;background:#e9dcff}
.cap-thumb{position:absolute;top:-3px;left:0;width:56px;height:56px;border-radius:50%;background:#8a5cff;color:#fff;font-size:24px;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 0 rgba(0,0,0,.18)}
.cap.drag .cap-thumb{background:#6f3ef0;cursor:grabbing}.cap.ok .cap-thumb{background:#3fae5c}
.cap-msg{min-height:1.4em;margin:8px 0 0;font-weight:700;text-align:center}
.cap-alt{display:block;margin:4px auto 0;background:none;border:0;color:#6b5a8a;text-decoration:underline;font-size:14px;min-height:44px;cursor:pointer}
.cap-q label{display:block;font-weight:700}.cap-q .cap-qa{max-width:120px;display:inline-block}.cap-q .cap-qb{margin-top:8px}
.oform button.cap-locked{opacity:.5;cursor:not-allowed}
/* accounts: header button, gift offer, account pages */
header.top .wrap{position:relative}
.acc-btn{display:inline-flex;flex:none;align-items:center;gap:4px;min-height:44px;padding:0 16px;border-radius:999px;background:#fff;border:3px solid #e2d8f6;color:#5a2fd0;font-weight:900;text-decoration:none;font-size:16px;box-shadow:0 3px 0 rgba(0,0,0,.08)}
.acc-btn.in{border-color:#8a5cff;background:#f1eaff}.acc-btn span{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gift-offer{max-width:900px;margin:18px auto;padding:14px 16px;display:flex;gap:14px;align-items:center;flex-wrap:wrap;background:#fff7e6;border:3px dashed #ffc928;border-radius:22px;box-sizing:border-box}
.gift-offer img{border-radius:50%;flex:none}.gift-offer p{flex:1;min-width:200px;margin:0;font-size:17px}
@media (max-width:640px){.gift-offer{margin:14px 12px}.gift-offer .btn{width:100%;justify-content:center}}
.acc{max-width:620px;margin:0 auto}.acc-card{background:#fff;border-radius:24px;padding:20px;box-shadow:0 4px 0 rgba(0,0,0,.06);margin:10px 0 24px}
.acc-card.center{text-align:center}.acc-card h1{font-size:clamp(24px,6vw,34px);margin:6px 0 10px}.acc-card h2{font-size:22px;margin:22px 0 8px}
.acc-card .lead{font-size:18px}.acc-card .small{font-size:15px;color:#6b5a8a}.acc-card p.center{text-align:center}
.acc-hero{width:150px;height:150px;border-radius:50%;border:6px solid #ffe08a;display:block;margin:0 auto 8px}
.acc-form label{display:block;font-weight:700;margin:12px 0}.acc-form label small{font-weight:400;color:#6b5a8a}
.acc-form input:not([type=checkbox]){min-height:56px;font-size:18px;padding:0 14px;border-radius:14px;border:3px solid #e2d8f6;margin-top:6px}
.acc-form .pw{position:relative;display:block}.acc-form .pw input{padding-right:58px}
.acc-form .eye{position:absolute;right:6px;top:50%;transform:translateY(-38%);width:46px;height:46px;border:0;background:none;font-size:22px;cursor:pointer}
.acc-form label.chk{display:flex;gap:12px;align-items:flex-start;font-weight:400}.acc-form label.chk input{width:28px;height:28px;flex:none;margin:0;accent-color:#8a5cff}
.acc-form .btn{width:100%;justify-content:center;min-height:56px;font-size:19px}
.acc .hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.acc-msg{padding:12px 14px;border-radius:14px;font-weight:700}.acc-msg.ok{background:#e6f8e9;color:#1d6b2c}.acc-msg.err{background:#ffe9e6;color:#a3261a}
.acc .btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.acc .btns .btn{min-height:52px}
.acc .gift img{display:block;max-width:100%;width:340px;margin:10px auto;border-radius:16px;border:4px solid #ffc928;background:#fff}
.acc .gift.small{display:inline-block;text-align:center;text-decoration:none;color:inherit}.acc .gift.small img{width:180px}
.acc details{margin:12px 0;padding:10px 14px;border-radius:16px;background:#f8f5ff}.acc details summary{font-weight:800;cursor:pointer;min-height:32px}
.acc details.danger{background:#fff2f0}.acc .btn.danger{background:#e2453c;color:#fff}.acc-inline{margin:16px 0}
.party{position:relative;overflow:hidden}.confetti{position:absolute;inset:0;pointer-events:none}
.confetti i{position:absolute;top:-12px;width:10px;height:16px;border-radius:3px;animation:conf 2.6s linear forwards}
@keyframes conf{to{transform:translateY(720px) rotate(540deg);opacity:.2}}
@media(prefers-reduced-motion:reduce){.confetti{display:none}}
/* PWA cards + bell */
.push-bell{flex:none;width:44px;height:44px;border-radius:50%;border:3px solid #e2d8f6;background:#fff;font-size:20px;cursor:pointer;filter:grayscale(1);opacity:.75}
.push-bell.on{filter:none;opacity:1;border-color:#ffc928}
.pwa-card{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:60;max-width:520px;margin:0 auto;display:flex;gap:12px;align-items:flex-start;
  background:#fff;border:4px solid #ffc928;border-radius:24px;padding:14px;box-shadow:0 10px 30px rgba(40,20,80,.25);transform:translateY(140%);transition:transform .35s ease}
.pwa-card.on{transform:none}
.pwa-capy{width:72px;height:72px;border-radius:50%;flex:none;animation:wave 1.6s ease-in-out 2}
@keyframes wave{0%,100%{transform:rotate(0)}25%{transform:rotate(-8deg)}75%{transform:rotate(8deg)}}
.pwa-t{flex:1;min-width:0}.pwa-t b{font-size:19px;display:block}.pwa-t p{margin:4px 0 8px;font-size:15px}
.pwa-b{display:flex;gap:8px;flex-wrap:wrap}.pwa-b .btn{min-height:48px;font-size:16px;padding:0 16px}
.pwa-ios{margin:4px 0 10px;padding-left:20px;font-size:15px}.pwa-ios li{margin:4px 0}.ios-ico{display:inline-block;background:#eef3ff;border-radius:8px;padding:0 6px}
@media(prefers-reduced-motion:reduce){.pwa-card{transition:none}.pwa-capy{animation:none}}

/* header layout on every width: logo + 🔔/«Войти» in the first row, the big picture menu below (no overlaps, nothing squeezed) */
header.top .wrap{display:flex;flex-wrap:wrap;align-items:center;column-gap:12px;row-gap:8px}
header.top .logo{order:1;flex:none}
.top-tools{order:2;margin-left:auto;display:flex;align-items:center;gap:8px;flex:none}
header.top .bignav{order:3;width:100%;margin-left:0}
/* hero cards never wider than the screen: grid tracks may shrink below their content, the «Читать сказку» label wraps */
.friends{grid-template-columns:repeat(var(--fcols,6),minmax(0,1fr))}
@media(max-width:1180px){.friends{--fcols:3}}
@media(max-width:640px){.friends{--fcols:2;gap:10px}.friend{padding:12px 8px 14px}.friend h3{font-size:20px}.friend .read{font-size:15px;padding:7px 6px;white-space:normal}}
/* hero cards: one column, the description is a fixed 2-line area, «Читать сказку» pinned to the bottom → all buttons in a row on one line */
.friends{align-items:stretch}
.friend{display:flex;flex-direction:column;align-items:center}
.friend .who{min-height:2.6em;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.friend .sound{max-width:100%}
.friend .read{margin-top:auto;align-self:stretch}
.friend .sound{margin-bottom:10px}

/* «Написать нам» form: same look as the order form (own class so order.js does not pick it up) */
.fbform a,.agree a,label a{display:inline-block;padding:10px 2px}
.fbform .hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.fbform .olead{font-size:19px;font-weight:700;margin:0 0 6px}
.fbform fieldset.via{border:0;padding:0;margin:4px 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.fbform fieldset.via legend{font-weight:700;padding:0;margin-bottom:6px}
.fbform fieldset.via label{margin:0;position:relative}
.fbform fieldset.via input{position:absolute;opacity:0;width:1px;height:1px}
.fbform fieldset.via span{display:flex;align-items:center;justify-content:center;min-height:56px;padding:6px 4px;border-radius:16px;border:3px solid #e2d8f6;background:#fff;font-weight:800;font-size:17px;text-align:center;cursor:pointer}
.fbform fieldset.via input:checked+span{border-color:#8a5cff;background:#f1eaff;color:#5a2fd0}
.fbform fieldset.via input:focus-visible+span{outline:3px solid #ffb02e;outline-offset:2px}
@media (max-width:520px){.fbform fieldset.via{grid-template-columns:repeat(2,1fr)}}
.fbform label.chk{display:flex;align-items:flex-start;gap:12px;font-size:16px;font-weight:400;line-height:1.4}
.fbform label.chk input{flex:none;width:28px;height:28px;margin:0;accent-color:#8a5cff}
.fbform label.chk span{flex:1;min-width:0}
.fbform label.chk a{display:inline;padding:0}.fbform label.chk input[type=checkbox]{width:28px;height:28px;min-width:28px;transform:none}
.fbform .oalt{margin:14px 0 0;text-align:center;font-weight:700;color:var(--ink-soft,#6b5a8a)}
.fbform .oalt a.tgbtn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 22px;margin-left:6px;border-radius:999px;background:#2aabee;color:#fff;font-weight:900;text-decoration:none;box-shadow:0 4px 0 rgba(0,0,0,.15)}
.fbform button.cap-locked{opacity:.5;cursor:not-allowed}
.fbform label{display:block;font-weight:700;margin:12px 0}.fbform textarea{min-height:150px;padding:12px 14px;border-radius:14px;border:3px solid #e2d8f6;font:inherit;font-size:18px;resize:vertical}
.fbform input[name=name],.fbform input[name=contact]{border-radius:14px;border:3px solid #e2d8f6;padding:0 14px;margin-top:6px}
.fbform .btn{width:100%;justify-content:center}.fbform .fb-note{color:#6b5a8a;font-size:15px}.fb-done{font-size:21px;text-align:center;padding:26px 18px}
footer.site .fb-link{font-weight:900}
/* «Зимняя сказка» album block on /pesni/ */
.album{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:26px;align-items:start;background:#fff;border:6px solid #8fd3ff;border-radius:36px;box-shadow:var(--shadow);padding:20px;margin:22px 0 34px}
.album .acover{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:24px;display:block}
.album h2{margin:4px 0 6px;font-size:34px}
.album .ainfo>p{margin:0 0 14px;font-size:19px;line-height:1.4}
.album .tracks{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:8px}
.album .tracks li{display:flex;align-items:center;gap:8px;background:#f3f9ff;border-radius:18px;min-height:52px}
.album .tracks li>a,.album .tracks .row{flex:1;min-width:0;display:flex;align-items:center;gap:10px;padding:8px 12px;color:inherit;text-decoration:none}
.album .tracks .n{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--c,#8fd3ff);color:#fff;font-size:15px}
.album .tracks .t{flex:1;min-width:0;font-family:"Nunito",ui-rounded,sans-serif;font-weight:900;font-size:18px;line-height:1.2}
.album .tracks .d{flex:none;font-size:15px;color:#6d5a48}
.album .tracks .kplay{flex:none;width:44px;height:44px;margin-right:6px;border:0;border-radius:50%;background:var(--c,#8fd3ff);color:#fff;font-size:20px;cursor:pointer}
.album .tracks li.locked{background:#f4f1ec;color:#8a7d70}
.album .tracks li.locked .n{background:#c9bfb3}
.allsongs{text-align:center;margin:10px 0 18px}
@media (max-width:860px){.album{grid-template-columns:minmax(0,1fr);padding:14px;gap:14px;border-radius:28px}.album h2{font-size:28px}}
@media (max-width:420px){.album .tracks .t{font-size:16px}.album .tracks .d{font-size:13px}}