/* درون شمشک — پوسته‌ی رنگی و بچگانه. فقط وقتی body.sk باشد اعمال می‌شود. */

body.sk{
  /* پالتِ روشن و شاد — مستقل از تمِ تیره/کاغذی */
  --bg:#fff7ef; --surface:#ffffff; --surface-2:#fff0e0;
  --line:#ffe0c2; --line-2:#ffcfa3;
  --text:#3b2a63; --muted:#7c6ca0; --faint:#a99ec7; --inv:#fff;
  --radius:24px;
  --shadow:0 2px 0 rgba(255,255,255,.6), 0 22px 40px -26px rgba(139,92,246,.5);
  --c-pink:#ff5c8a; --c-orange:#ff9f1c; --c-yellow:#ffd23f;
  --c-green:#2ec4a0; --c-blue:#3a86ff; --c-purple:#9b5de5;
  background:
    radial-gradient(1200px 600px at 8% -12%, #ffe6f2 0, transparent 55%),
    radial-gradient(1000px 520px at 100% 0%, #e8f0ff 0, transparent 52%),
    var(--bg);
  background-attachment:fixed;
}

/* ——— هدر ——— */
body.sk .site-head{background:color-mix(in srgb,#fff 82%,transparent);border-bottom:0}
body.sk .site-head::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:4px;
  background:linear-gradient(90deg,var(--c-pink),var(--c-orange),var(--c-yellow),var(--c-green),var(--c-blue),var(--c-purple))}
body.sk .brand .mark,body.sk .nav a{color:var(--text)}
body.sk .nav a:hover{background:#fff0e0;color:var(--c-purple)}
body.sk .nav a.on{color:var(--c-purple)}
body.sk .sk-link{font-weight:800;color:var(--c-purple)}
body.sk .tgl{display:none}                 /* روی صفحه‌ی بچگانه سوییچِ تم لازم نیست */
body.sk .crumb{color:var(--muted)}
body.sk .crumb:hover{color:var(--c-purple)}

/* ——— هیرو ——— */
.sk-hero{position:relative;overflow:hidden;padding:44px 0 22px}
.sk-hero>*{position:relative;z-index:1}
.sk-head{display:flex;align-items:center;gap:26px;justify-content:space-between}
.sk-copy{flex:1;min-width:0}
.sk-hero .kick{color:var(--c-purple);font-weight:800}
.sk-hero h1{font-size:clamp(42px,10vw,86px);font-weight:800;line-height:1.05;letter-spacing:-.5px}
.sk-hero h1 .sk-word{background:linear-gradient(90deg,var(--c-pink),var(--c-purple));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--c-purple)}
.sk-hero .say{color:var(--text);font-weight:700}
.sk-hero .say b{color:var(--c-pink)}
.sk-hero .lead{color:var(--muted);max-width:42ch}
.sk-mascot{flex:none;width:clamp(120px,25vw,188px)}
.sk-mascot svg{width:100%;height:auto;filter:drop-shadow(0 16px 22px rgba(139,92,246,.28));animation:sk-bob 3.6s ease-in-out infinite}
.sk-wiggle{transform-origin:70px 70px;animation:sk-wig 5s ease-in-out infinite}
@keyframes sk-bob{50%{transform:translateY(-10px)}}
@keyframes sk-wig{25%{transform:rotate(-4deg)}75%{transform:rotate(4deg)}}

/* حباب‌های رنگی پشتِ هیرو */
.sk-blob{position:absolute;border-radius:50%;filter:blur(7px);opacity:.45;z-index:0;pointer-events:none}
.sk-blob.b1{width:120px;height:120px;background:var(--c-yellow);top:6px;inset-inline-start:-34px}
.sk-blob.b2{width:78px;height:78px;background:var(--c-green);bottom:2px;inset-inline-start:32%}
.sk-blob.b3{width:104px;height:104px;background:var(--c-blue);top:16px;inset-inline-end:34%}

/* ——— سرتیترها ——— */
body.sk section{scroll-margin-top:84px}
body.sk #episodes,body.sk #listen{margin-top:44px}
body.sk .eyebrow h2{color:var(--c-purple);font-weight:800;font-size:15px;letter-spacing:.3px}
body.sk .eyebrow .rule{height:3px;border-radius:3px;
  background:repeating-linear-gradient(90deg,var(--line-2) 0 8px,transparent 8px 15px)}
body.sk .eyebrow .count{background:var(--c-yellow);color:#5b4a00;font-weight:800;border-radius:20px;padding:2px 11px;font-family:inherit}

/* ——— کارتِ قصه ——— */
body.sk .grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
body.sk .ep{border:3px solid var(--line);border-radius:26px;background:#fff}
body.sk .ep:hover{transform:translateY(-6px) rotate(-1deg);box-shadow:var(--shadow)}
body.sk .ep .num{background:#fff;color:var(--c-purple);border:2px solid var(--line-2);font-weight:800;
  display:inline-flex;align-items:center;gap:4px;font-family:inherit;border-radius:20px;top:12px;right:12px}
body.sk .ep .work{color:var(--text);font-weight:800}
body.sk .ep .hook{color:var(--muted)}
body.sk .ep .meta .go{color:#fff;background:var(--c-purple);border-radius:20px;padding:5px 12px;font-weight:800;
  display:inline-flex;align-items:center;gap:6px;margin-inline-start:auto;transition:.2s}
body.sk .ep:hover .meta .go{background:var(--c-pink);transform:none}
body.sk .ep .meta .go svg{width:15px;height:15px}
/* بوردرِ رنگیِ چرخشی */
body.sk .sk-grid .ep:nth-child(6n+1){border-color:#ffd0dd}
body.sk .sk-grid .ep:nth-child(6n+2){border-color:#ffe1b0}
body.sk .sk-grid .ep:nth-child(6n+3){border-color:#c9f0e4}
body.sk .sk-grid .ep:nth-child(6n+4){border-color:#cfe0ff}
body.sk .sk-grid .ep:nth-child(6n+5){border-color:#e5d6ff}
body.sk .sk-grid .ep:nth-child(6n){border-color:#fff0b8}

/* ——— به‌زودی ——— */
.sk-soon{text-align:center;background:#fff;border:3px dashed var(--line-2);border-radius:28px;padding:40px 26px}
.sk-soon-ic{width:120px;margin:0 auto 4px}
.sk-soon-ic svg{width:100%;height:auto}
.sk-soon h3{font-size:clamp(20px,3.4vw,26px);font-weight:800;color:var(--text);margin-bottom:8px}
.sk-soon p{color:var(--muted);max-width:44ch;margin:0 auto 18px}
.sk-btn{display:inline-flex;align-items:center;gap:8px;background:var(--c-purple);color:#fff;font-weight:800;
  border-radius:22px;padding:12px 22px;box-shadow:0 12px 22px -10px rgba(139,92,246,.65);transition:.2s}
.sk-btn:hover{background:var(--c-pink);transform:translateY(-2px)}
.sk-btn svg{width:16px;height:16px}

/* ——— دکمه‌های پادگیر ——— */
body.sk .plat{border:3px solid var(--line);border-radius:20px;background:#fff}
body.sk .plat:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
body.sk .plat .ic{color:var(--c-purple)}
body.sk .plat .tx b{color:var(--text)}
body.sk .plat .tx span{color:var(--faint)}
body.sk .plat .go{color:var(--c-purple)}
body.sk .listen .plat:nth-child(1){border-color:#c9f0e4}
body.sk .listen .plat:nth-child(2){border-color:#ffd0dd}
body.sk .listen .plat:nth-child(3){border-color:#ffe1b0}

/* ——— کارتِ بزرگ‌ترها ——— */
.sk-grown-wrap{margin-top:52px}
.sk-grown{display:flex;align-items:center;gap:16px;justify-content:space-between;color:#fff;
  background:linear-gradient(120deg,#2a2540,#3b2a63);border-radius:24px;padding:24px 26px;transition:.24s}
.sk-grown:hover{transform:translateY(-3px);box-shadow:0 24px 40px -26px rgba(59,42,99,.7)}
.sk-grown .tag{background:rgba(255,255,255,.15);border:0;color:#ffd7e6}
.sk-grown h3{font-size:22px;font-weight:800;margin-bottom:4px}
.sk-grown p{color:#cbc2e6;font-size:14px;max-width:52ch;line-height:1.7}
.sk-grown .go{flex:none;color:#fff}.sk-grown .go svg{width:22px;height:22px}

/* ——— فوتر ——— */
body.sk .site-foot{border-top:0;box-shadow:0 -2px 0 var(--line);color:var(--muted)}
body.sk .site-foot .mark{color:var(--c-purple)}
body.sk .site-foot .links a{color:var(--muted)}
body.sk .site-foot .links a:hover{color:var(--c-purple)}
body.sk .site-foot .sig{color:var(--line-2)}
body.sk .site-foot .cr b{color:var(--c-purple)}

@media (max-width:720px){
  .sk-head{flex-direction:column-reverse;align-items:flex-start;gap:10px}
  .sk-mascot{width:118px}
  .sk-grown{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){
  .sk-mascot svg,.sk-wiggle{animation:none}
}