/* ==========================================================================
   آلبوم کارت ویزیت گل‌سرخ — استایل ویجت المنتور
   تمام قوانین زیر .gsk-scope محصور شده‌اند تا با قالب سایت تداخل نکنند
   ========================================================================== */

html.gsk-lock, body.gsk-lock{ overflow:hidden !important; height:100%; }

.gsk-scope, .gsk-scope *, .gsk-scope *::before, .gsk-scope *::after{ box-sizing:border-box; }
.gsk-scope{
  --gsk-wine-900:#380d1a;
  --gsk-wine-800:#4a1424;
  --gsk-wine-700:#5c1a2b;
  --gsk-wine-600:#752238;
  --gsk-rose-500:#a13f52;
  --gsk-gold-200:#f3e3b8;
  --gsk-gold-300:#e6cd8f;
  --gsk-gold-400:#d4b46a;
  --gsk-gold-500:#c19a4c;
  --gsk-gold-600:#a67f3a;
  --gsk-ivory-50:#fffdf8;
  --gsk-ivory-100:#faf3e6;
  --gsk-ivory-200:#f1e4cc;
  --gsk-ink-900:#241a17;
  --gsk-ink-700:#3d2c27;
  --gsk-ink-500:#6b5850;
  --gsk-font-display:'Lalezar', system-ui, sans-serif;
  --gsk-font-body:'Vazirmatn', system-ui, sans-serif;
  --gsk-font-accent:'Aref Ruqaa', serif;
  --gsk-noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --gsk-marble:
    radial-gradient(ellipse 55% 38% at 18% 28%, rgba(161,63,82,.32), transparent 60%),
    radial-gradient(ellipse 48% 30% at 82% 18%, rgba(212,180,106,.30), transparent 62%),
    radial-gradient(ellipse 65% 46% at 46% 82%, rgba(117,34,56,.28), transparent 60%),
    radial-gradient(ellipse 38% 55% at 88% 68%, rgba(230,205,143,.22), transparent 60%),
    radial-gradient(ellipse 40% 40% at 8% 78%, rgba(93,20,36,.22), transparent 60%),
    linear-gradient(150deg, var(--gsk-ivory-50), var(--gsk-ivory-200));

  position:relative; isolation:isolate; direction:rtl; text-align:right;
  font-family:var(--gsk-font-body); color:var(--gsk-ink-900);
  -webkit-font-smoothing:antialiased; line-height:1.6;
}
.gsk-scope button{ font-family:inherit; }
.gsk-scope [hidden]{ display:none !important; }
.gsk-scope :focus-visible{ outline:2px solid var(--gsk-gold-400); outline-offset:2px; border-radius:4px; }
.gsk-visually-hidden{ position:absolute !important; width:1px;height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ---------------------------------------------------------------------- */
/* لانچر داخل صفحه — یک کارت دعوت کوچک، نه خود جلد کامل                   */
/* ---------------------------------------------------------------------- */
.gsk-launcher{
  all:unset; box-sizing:border-box; display:flex; align-items:center; gap:16px;
  max-width:420px; width:100%; margin:0 auto; cursor:pointer;
  padding:18px 22px; border-radius:14px;
  background:linear-gradient(155deg, var(--gsk-wine-600), var(--gsk-wine-900) 65%);
  box-shadow:0 18px 40px -18px rgba(0,0,0,.6), 0 0 0 1px rgba(230,205,143,.16) inset;
  transition:transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease;
}
.gsk-launcher:hover, .gsk-launcher:focus-visible{
  transform:translateY(-3px);
  box-shadow:0 24px 50px -18px rgba(0,0,0,.68), 0 0 0 1px rgba(230,205,143,.26) inset;
}
.gsk-launcher-emblem{ flex:none; width:44px; height:44px; }
.gsk-launcher-emblem svg{ width:100%; height:100%; }
.gsk-launcher-text{ flex:1; min-width:0; }
.gsk-launcher-title{
  font-family:var(--gsk-font-display); font-size:clamp(15px,2.2vw,18px);
  background:linear-gradient(180deg, var(--gsk-gold-200), var(--gsk-gold-600));
  -webkit-background-clip:text; background-clip:text; color:transparent; margin:0 0 3px;
}
.gsk-launcher-sub{ font-size:12px; color:var(--gsk-ivory-200); opacity:.8; margin:0; }
.gsk-launcher-cta{
  flex:none; font-size:12px; font-weight:700; color:var(--gsk-wine-900);
  background:linear-gradient(180deg,var(--gsk-gold-300),var(--gsk-gold-600));
  padding:8px 14px; border-radius:999px; white-space:nowrap;
}

/* ---------------------------------------------------------------------- */
/* پوسته تمام‌صفحه (Overlay)                                              */
/* ---------------------------------------------------------------------- */
.gsk-overlay{
  position:fixed; inset:0; z-index:999999;
  display:flex; align-items:center; justify-content:center;
  background:radial-gradient(120% 90% at 50% -8%, #341a26 0%, #1c0d13 52%, #0d0608 100%);
  opacity:0; visibility:hidden;
  transition:opacity .4s ease;
  padding:
    max(18px, env(safe-area-inset-top))
    max(16px, env(safe-area-inset-right))
    max(18px, env(safe-area-inset-bottom))
    max(16px, env(safe-area-inset-left));
}
.gsk-overlay.gsk-overlay-open{ opacity:1; visibility:visible; }
.gsk-overlay-close{
  position:absolute;
  top:max(16px, env(safe-area-inset-top));
  left:max(16px, env(safe-area-inset-left));
  z-index:50; width:42px;height:42px;border-radius:50%;
  background:rgba(20,10,14,.55); border:1px solid rgba(230,205,143,.3); color:var(--gsk-gold-200);
  display:flex; align-items:center; justify-content:center; cursor:pointer; transition:.2s;
}
.gsk-overlay-close:hover{ background:rgba(230,205,143,.2); transform:rotate(90deg); }
.gsk-overlay-close svg{ width:18px;height:18px; }

.gsk-atmosphere{ position:absolute; inset:0; pointer-events:none; z-index:0; }
.gsk-glow{
  position:absolute; top:-16%; left:50%; transform:translateX(-50%);
  width:78%; height:65%; background:radial-gradient(circle, rgba(243,227,184,.16), transparent 70%); filter:blur(6px);
}
.gsk-mote{
  position:absolute; border-radius:50%; background:radial-gradient(circle, rgba(243,227,184,.55), transparent 72%);
  filter:blur(.5px); animation:gskDrift linear infinite;
}
@keyframes gskDrift{ 0%{transform:translate(0,0);opacity:.1;} 50%{opacity:.45;} 100%{transform:translate(var(--dx),var(--dy));opacity:.1;} }

/* ---------------------------------------------------------------------- */
/* جلد بسته (داخل پوسته تمام‌صفحه)                                        */
/* ---------------------------------------------------------------------- */
.gsk-cover-wrap{ position:relative; z-index:5; width:min(46vw, 400px); aspect-ratio:0.68/1; animation:gskCoverFloat 5.5s ease-in-out infinite; }
@keyframes gskCoverFloat{ 0%,100%{transform:translateY(0);} 50%{transform:translateY(-7px);} }
.gsk-cover-btn{ all:unset; display:block; position:relative; width:100%; height:100%; cursor:pointer; perspective:1800px; }
.gsk-cover{
  position:relative; width:100%; height:100%; border-radius:5px 12px 12px 5px;
  background:linear-gradient(155deg, var(--gsk-wine-600), var(--gsk-wine-900) 62%);
  box-shadow:0 34px 64px -22px rgba(0,0,0,.72), 0 0 0 1px rgba(230,205,143,.14) inset, -7px 0 16px rgba(0,0,0,.4) inset;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; padding:8% 9%;
  transition:transform .55s cubic-bezier(.22,1,.36,1), box-shadow .55s; transform-style:preserve-3d;
}
.gsk-cover::before{ content:''; position:absolute; inset:0; border-radius:inherit; background-image:var(--gsk-noise); opacity:.5; mix-blend-mode:overlay; pointer-events:none; }
.gsk-cover::after{ content:''; position:absolute; top:0; bottom:0; right:0; width:12%; background:linear-gradient(to left, rgba(0,0,0,.4), transparent); border-radius:0 12px 12px 0; pointer-events:none; }
.gsk-cover-btn:hover .gsk-cover, .gsk-cover-btn:focus-visible .gsk-cover{ transform:rotateY(-9deg) translateX(3px); box-shadow:12px 34px 64px -20px rgba(0,0,0,.78), 0 0 0 1px rgba(230,205,143,.2) inset; }
.gsk-cover-wrap.gsk-opening{ animation:none; }
.gsk-cover-wrap.gsk-opening .gsk-cover{ transform:rotateY(-108deg) translateX(-14%); opacity:0; box-shadow:none; transition:transform .68s cubic-bezier(.6,.04,.7,.2), opacity .4s ease .3s; }
.gsk-corner{ position:absolute; width:15%; height:15%; opacity:.85; pointer-events:none; }
.gsk-corner svg{ width:100%; height:100%; display:block; }
.gsk-corner.tl{ top:6%; left:6%; } .gsk-corner.tr{ top:6%; right:6%; transform:scaleX(-1); }
.gsk-corner.bl{ bottom:6%; left:6%; transform:scaleY(-1); } .gsk-corner.br{ bottom:6%; right:6%; transform:scale(-1,-1); }
.gsk-cover-emblem{ width:22%; height:22%; margin-bottom:2%; }
.gsk-cover-emblem svg{ width:100%; height:100%; }
.gsk-cover-title{ font-family:var(--gsk-font-display); font-size:clamp(24px,4.4vw,36px); line-height:1.35; text-align:center; background:linear-gradient(180deg, var(--gsk-gold-200), var(--gsk-gold-600)); -webkit-background-clip:text; background-clip:text; color:transparent; filter:drop-shadow(0 1px 0 rgba(255,255,255,.12)); }
.gsk-cover-sub{ font-family:var(--gsk-font-accent); font-size:clamp(12px,1.6vw,15px); color:var(--gsk-ivory-200); opacity:.82; text-align:center; padding:0 4%; }
.gsk-cover-rule{ width:56%; height:1px; background:linear-gradient(90deg, transparent, var(--gsk-gold-500), transparent); }
.gsk-cover-hint{ display:flex; align-items:center; gap:8px; color:var(--gsk-gold-300); font-size:clamp(11px,1.4vw,13px); }
.gsk-cover-hint .gsk-ring{ width:9px;height:9px;border-radius:50%; border:1.4px solid var(--gsk-gold-400); position:relative; }
.gsk-cover-hint .gsk-ring::after{ content:''; position:absolute; inset:-4px; border-radius:50%; border:1.4px solid var(--gsk-gold-400); animation:gskPulse 2.2s ease-out infinite; }
@keyframes gskPulse{ 0%{transform:scale(.6);opacity:.8;} 100%{transform:scale(1.9);opacity:0;} }

/* ---------------------------------------------------------------------- */
/* بدنه اصلی کتاب باز شده — اندازه‌گذاری دقیق آن با JS انجام می‌شود        */
/* (برای جلوگیری از باگ‌های نمایشی ناشی از تلفیق aspect-ratio + max-*)      */
/* ---------------------------------------------------------------------- */
.gsk-book-wrap{ position:relative; z-index:5; display:flex; flex-direction:column; align-items:center; }
.gsk-book{
  position:relative;
  filter:drop-shadow(0 44px 70px rgba(0,0,0,.55));
  opacity:0; transform:scale(.85);
  transition:opacity .5s ease, transform .5s cubic-bezier(.22,1,.36,1);
}
.gsk-book-wrap.gsk-book-visible .gsk-book{ opacity:1; transform:scale(1); }

.gsk-endpaper{ position:absolute; top:0; bottom:0; width:50%; background:var(--gsk-marble); background-size:180% 180%; z-index:0; }
.gsk-endpaper.gsk-left{ left:0; border-radius:6px 0 0 6px; background-position:20% 30%; }
.gsk-endpaper.gsk-right{ right:0; border-radius:0 6px 6px 0; background-position:80% 60%; }
.gsk-spine{ position:absolute; top:1%; bottom:1%; left:50%; width:18px; transform:translateX(-50%); background:linear-gradient(90deg, rgba(0,0,0,.4), rgba(0,0,0,.06) 35%, rgba(0,0,0,.06) 65%, rgba(0,0,0,.4)); z-index:1; pointer-events:none; filter:blur(1px); }

.gsk-pages{ position:absolute; inset:0; z-index:2; }
.gsk-leaf{ position:absolute; top:0; right:0; width:50%; height:100%; transform-style:preserve-3d; transform-origin:left center; transition:transform 1s cubic-bezier(.64,.04,.35,1); will-change:transform; }
.gsk-leaf.gsk-flipped{ transform:rotateY(-180deg); }
.gsk-face{ position:absolute; inset:0; backface-visibility:hidden; background:var(--gsk-ivory-100); box-shadow:0 0 0 1px rgba(36,26,23,.05) inset; overflow:hidden; display:flex; flex-direction:column; }
.gsk-face::before{ content:''; position:absolute; inset:0; background-image:var(--gsk-noise); opacity:.045; mix-blend-mode:multiply; pointer-events:none; }
.gsk-face.gsk-front{ border-radius:0 7px 7px 0; }
.gsk-face.gsk-front::after{ content:''; position:absolute; top:0; bottom:0; left:0; width:13%; pointer-events:none; background:linear-gradient(to right, rgba(0,0,0,.11), transparent); }
.gsk-face.gsk-back{ transform:rotateY(180deg); border-radius:7px 0 0 7px; }
.gsk-face.gsk-back::after{ content:''; position:absolute; top:0; bottom:0; right:0; width:13%; pointer-events:none; background:linear-gradient(to left, rgba(0,0,0,.11), transparent); }

.gsk-hotzone{ position:absolute; bottom:0; width:12%; height:16%; z-index:400; background:transparent; border:0; cursor:pointer; padding:0; }
.gsk-hotzone.gsk-next{ right:0; } .gsk-hotzone.gsk-prev{ left:0; }
.gsk-hotzone::after{ content:''; position:absolute; bottom:0; width:0; height:0; opacity:0; transition:opacity .25s ease; }
.gsk-hotzone.gsk-next::after{ right:0; border-style:solid; border-width:0 0 30px 30px; border-color:transparent transparent transparent rgba(243,227,184,.4); }
.gsk-hotzone.gsk-prev::after{ left:0; border-style:solid; border-width:0 30px 30px 0; border-color:transparent rgba(243,227,184,.4) transparent transparent; }
.gsk-hotzone:hover::after, .gsk-hotzone:focus-visible::after{ opacity:1; }
.gsk-hotzone:disabled{ pointer-events:none; }
@media (hover:none){ .gsk-hotzone{ display:none; } }

/* ---------------------------------------------------------------------- */
/* محتوای صفحات: مقدمه / بسته شدن / خالی — با اسکرول داخلی امن            */
/* ---------------------------------------------------------------------- */
.gsk-page-content{ position:relative; z-index:1; flex:1; display:flex; flex-direction:column; padding:6% 7%; overflow-y:auto; overflow-x:hidden; scrollbar-width:thin; scrollbar-color:var(--gsk-gold-500) transparent; }
.gsk-page-content::-webkit-scrollbar{ width:6px; }
.gsk-page-content::-webkit-scrollbar-thumb{ background:var(--gsk-gold-500); border-radius:3px; }

.gsk-intro-a{ align-items:center; justify-content:center; text-align:center; gap:14px; }
.gsk-intro-emblem{ width:15%; min-width:44px; max-width:64px; opacity:.92; }
.gsk-intro-a h2{ font-family:var(--gsk-font-display); font-size:clamp(21px,3vw,32px); color:var(--gsk-wine-800); margin:6px 0 0; }
.gsk-intro-a p{ font-size:clamp(13px,1.6vw,16px); color:var(--gsk-ink-700); max-width:32em; margin:0; }
.gsk-intro-a ul{ list-style:none; margin:6px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; }
.gsk-intro-a li{ font-size:clamp(12.5px,1.5vw,15px); color:var(--gsk-ink-700); display:flex; align-items:center; gap:8px; justify-content:center; }
.gsk-intro-a li::before{ content:''; width:5px;height:5px;border-radius:50%; background:var(--gsk-gold-500); flex:none; }

.gsk-intro-b h2, .gsk-intro-c h2, .gsk-closing h2{ font-family:var(--gsk-font-display); font-size:clamp(19px,2.6vw,28px); color:var(--gsk-wine-800); margin:0 0 14px; }
.gsk-intro-b .gsk-line{ display:flex; align-items:baseline; gap:8px; font-size:clamp(13px,1.5vw,15.5px); color:var(--gsk-ink-700); padding:9px 0; border-bottom:1px dashed rgba(36,26,23,.15); }
.gsk-intro-b .gsk-line strong{ color:var(--gsk-wine-700); font-weight:700; flex:none; }

.gsk-intro-c .gsk-feature{ display:flex; gap:10px; align-items:flex-start; margin-bottom:14px; }
.gsk-intro-c .gsk-feature-badge{ flex:none; width:32px;height:32px;border-radius:50%; background:linear-gradient(180deg,var(--gsk-gold-300),var(--gsk-gold-600)); color:var(--gsk-wine-900); display:flex; align-items:center; justify-content:center; font-family:var(--gsk-font-display); font-size:14px; }
.gsk-intro-c .gsk-feature h3{ font-size:clamp(13.5px,1.6vw,16px); margin:2px 0 3px; color:var(--gsk-ink-900); }
.gsk-intro-c .gsk-feature p{ font-size:clamp(12px,1.35vw,14px); margin:0; color:var(--gsk-ink-500); }

.gsk-closing{ align-items:center; justify-content:center; text-align:center; gap:12px; }
.gsk-closing p{ font-size:clamp(12.5px,1.5vw,15px); color:var(--gsk-ink-700); max-width:30em; margin:0; }
.gsk-closing-btn{ margin-top:10px; border:1px solid var(--gsk-gold-500); background:transparent; color:var(--gsk-wine-800); padding:10px 24px; border-radius:999px; font-family:var(--gsk-font-body); font-weight:600; cursor:pointer; font-size:13px; transition:.25s; }
.gsk-closing-btn:hover{ background:var(--gsk-gold-400); }
.gsk-blank{ background-image:var(--gsk-marble); background-size:160% 160%; }

/* ---------------------------------------------------------------------- */
/* شبکه کارت‌ ویزیت‌ها + فلیپ نمایش پشت کارت                              */
/* ---------------------------------------------------------------------- */
.gsk-cards-page{ padding:6% 6% 4%; }
.gsk-cards-eyebrow{ font-size:11.5px; letter-spacing:.05em; color:var(--gsk-gold-600); font-weight:700; margin-bottom:12px; display:flex; align-items:center; gap:6px; flex:none; }
.gsk-cards-eyebrow::after{ content:''; flex:1; height:1px; background:linear-gradient(to left, rgba(193,154,76,.5), transparent); }
.gsk-cards-grid{ flex:1; display:grid; grid-template-columns:repeat(var(--gsk-cols,2), 1fr); grid-auto-rows:1fr; gap:5% 4%; align-content:start; }
.gsk-card-cell{ display:flex; flex-direction:column; gap:8px; min-height:0; }

.gsk-card-flip{
  all:unset; box-sizing:border-box; display:block; width:100%; position:relative; aspect-ratio:1.72/1;
  cursor:pointer; perspective:1000px;
  transform:perspective(700px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0));
  transition:transform .3s ease;
}
.gsk-card-flip-inner{ position:relative; width:100%; height:100%; transform-style:preserve-3d; transition:transform .8s cubic-bezier(.34,.06,.22,1); }
.gsk-card-flip:hover{ --ty:-3px; }
.gsk-card-flip.gsk-is-flipped .gsk-card-flip-inner{ transform:rotateY(180deg); }
.gsk-card-face{ position:absolute; inset:0; backface-visibility:hidden; border-radius:10px; overflow:hidden; box-shadow:0 9px 20px -9px rgba(30,10,15,.5), 0 1px 0 rgba(255,255,255,.35) inset; background:var(--v-bg, linear-gradient(135deg,var(--gsk-wine-700),var(--gsk-wine-900))); }
.gsk-card-face-back{ transform:rotateY(180deg); }

.gsk-card-inner{ position:absolute; inset:0; padding:9%; display:flex; flex-direction:column; justify-content:space-between; }
.gsk-card-mark{ width:20%; aspect-ratio:1; border-radius:50%; background:rgba(255,255,255,.14); display:flex; align-items:center; justify-content:center; font-family:var(--gsk-font-display); font-size:clamp(10px,1.3vw,14px); color:var(--v-fg,#fff); }
.gsk-card-lines{ display:flex; flex-direction:column; gap:6%; }
.gsk-card-lines .gsk-line{ display:block; height:8%; min-height:3px; border-radius:3px; background:var(--v-fg,#fff); opacity:.5; }
.gsk-card-lines .gsk-line.w60{ width:60%; } .gsk-card-lines .gsk-line.w40{ width:40%; } .gsk-card-lines .gsk-line.w75{ width:75%; }
.gsk-card-tag{ position:absolute; bottom:8px; left:10px; font-size:clamp(9.5px,1.1vw,12px); color:var(--v-fg,#fff); opacity:.78; letter-spacing:.03em; }

.gsk-card-back-generic{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6%; }
.gsk-card-back-emblem{ width:22%; opacity:.9; }
.gsk-card-back-emblem svg{ width:100%; height:auto; display:block; }
.gsk-card-back-label{ font-family:var(--gsk-font-display); letter-spacing:.12em; font-size:clamp(11px,1.4vw,15px); color:var(--v-fg,#fff); opacity:.85; }

.gsk-flip-hint{ position:absolute; bottom:7px; right:7px; width:9%; min-width:22px; max-width:30px; aspect-ratio:1; border-radius:50%; background:rgba(20,10,14,.55); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); display:flex; align-items:center; justify-content:center; opacity:0; transform:scale(.8); transition:opacity .25s ease, transform .25s ease; pointer-events:none; }
.gsk-card-flip:hover .gsk-flip-hint, .gsk-card-flip:focus-visible .gsk-flip-hint{ opacity:1; transform:scale(1); }
.gsk-flip-hint svg{ width:55%; height:55%; }
@media (hover:none){ .gsk-flip-hint{ opacity:.6; transform:scale(1); } }

/* --- کادر ثبت سفارش: یک قاب یکپارچه، طراحی‌شده با دقت --- */
.gsk-order-row{
  flex:none; display:flex; align-items:stretch; border:1.5px solid var(--gsk-gold-500); border-radius:10px;
  overflow:hidden; background:var(--gsk-ivory-50); box-shadow:0 2px 6px rgba(36,26,23,.08);
}
.gsk-code-input{
  flex:0 0 auto; width:6.2em; min-width:58px; border:0; border-inline-end:1.5px solid var(--gsk-gold-500);
  background:transparent; padding:9px 6px; font-family:inherit; font-weight:700; letter-spacing:.02em;
  font-size:clamp(11.5px,1.3vw,13.5px); text-align:center; color:var(--gsk-wine-800); min-width:0;
}
.gsk-code-input:focus-visible{ outline:none; background:rgba(193,154,76,.14); }
.gsk-order-btn{
  flex:1 1 auto; min-width:0; border:0; padding:9px 8px; font-family:inherit; font-weight:700;
  font-size:clamp(11.5px,1.3vw,13.5px); letter-spacing:.01em; white-space:nowrap;
  background:linear-gradient(180deg,var(--gsk-gold-300),var(--gsk-gold-600)); color:var(--gsk-wine-900);
  cursor:pointer; transition:filter .2s ease, transform .15s ease;
}
.gsk-order-btn:hover{ filter:brightness(1.07); }
.gsk-order-btn:active{ transform:scale(.98); }

/* ---------------------------------------------------------------------- */
/* نوار ابزار پایین آلبوم                                                 */
/* ---------------------------------------------------------------------- */
.gsk-toolbar{
  position:relative; margin-top:14px; display:flex; align-items:center; gap:12px;
  background:rgba(20,10,14,.55); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(230,205,143,.25); border-radius:999px; padding:7px 10px 7px 16px;
  color:var(--gsk-ivory-100); z-index:20; opacity:0; transition:opacity .4s ease .2s; white-space:nowrap;
}
.gsk-book-wrap.gsk-book-visible .gsk-toolbar{ opacity:1; }
.gsk-nav-btn{ width:32px;height:32px;border-radius:50%; border:1px solid rgba(230,205,143,.4); background:rgba(255,255,255,.04); color:var(--gsk-gold-300); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:.2s; }
.gsk-nav-btn svg{ width:15px;height:15px; }
.gsk-nav-btn:hover:not(:disabled){ background:rgba(230,205,143,.2); transform:scale(1.07); }
.gsk-nav-btn:disabled{ opacity:.3; cursor:default; }
.gsk-page-indicator{ font-size:12.5px; letter-spacing:.02em; min-width:58px; text-align:center; }
.gsk-close-album{ margin-inline-start:2px; font-size:12px; color:var(--gsk-gold-300); background:transparent; border:0; cursor:pointer; text-decoration:underline; text-underline-offset:3px; padding:4px; }

/* ---------------------------------------------------------------------- */
/* پیام کوتاه (Toast)                                                     */
/* ---------------------------------------------------------------------- */
.gsk-toast{ position:fixed; bottom:max(24px, env(safe-area-inset-bottom)); left:50%; transform:translate(-50%,10px); background:var(--gsk-wine-900); color:var(--gsk-gold-200); padding:12px 22px; border-radius:10px; font-size:13.5px; box-shadow:0 16px 32px -10px rgba(0,0,0,.5); z-index:1000001; opacity:0; pointer-events:none; transition:opacity .3s ease, transform .3s ease; max-width:88vw; text-align:center; }
.gsk-toast.gsk-show{ opacity:1; transform:translate(-50%,0); }

/* ---------------------------------------------------------------------- */
/* واکنش‌گرایی                                                            */
/* ---------------------------------------------------------------------- */
@media (max-width:640px){
  .gsk-overlay{ padding:12px; }
  .gsk-cover-wrap{ width:min(60vw,290px); }
  .gsk-page-content{ padding:7% 6%; }
  .gsk-cards-page{ padding:7% 5% 4%; }
  .gsk-cards-grid{ gap:6% 4%; }
  .gsk-toolbar{ gap:8px; padding:6px 10px 6px 14px; margin-top:10px; }
  .gsk-nav-btn{ width:34px;height:34px; }
  .gsk-page-indicator{ font-size:11px; min-width:48px; }
  .gsk-close-album{ display:none; }
  .gsk-launcher{ padding:14px 16px; gap:12px; }
  .gsk-launcher-cta{ padding:7px 12px; }
}

/* ---------------------------------------------------------------------- */
/* دسترسی‌پذیری                                                           */
/* ---------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce){
  .gsk-scope *{ animation:none !important; }
  .gsk-leaf, .gsk-cover, .gsk-cover-wrap.gsk-opening .gsk-cover, .gsk-card-flip-inner{ transition-duration:.35s !important; }
  .gsk-overlay, .gsk-book{ transition-duration:.25s !important; }
}