/* رسا پرامت · نظام بصری زنده
   پایه: برندبوک (سبز نفتی، مریم‌گلی، مس، عاجی) در نسخهٔ روشن‌تر و زنده‌تر: تیل روشن، نعنایی، مسی گرم و طلایی.
   شعاع: کارت ۲۴، ورودی ۱۶، پنجره ۲۶، دکمه گرد کامل · فاصله: ۴/۸/۱۲/۱۶/۲۴/۳۲/۴۸ · فونت: فقط وزیرمتن
   حرکت: زنده و پیوسته؛ در «کاهش حرکت» سیستم خاموش می‌شود. */
@font-face{font-family:Vazirmatn;src:local('Vazirmatn'),url('/static/fonts/Vazirmatn-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Vazirmatn;src:local('Vazirmatn Bold'),url('/static/fonts/Vazirmatn-Bold.ttf') format('truetype');font-weight:700;font-display:swap}

:root{
 --bg:#F6F3EA;--surface:#FFFFFF;--glass:rgba(255,255,255,.68);--glass-2:rgba(255,255,255,.45);
 --ink:#0F2E33;--muted:#4D6966;--line:rgba(15,46,51,.09);--line-2:rgba(15,46,51,.16);
 --teal:#0C8F88;--mint:#2FC09C;--mint-soft:#DAF3EA;--copper:#E07B3F;--sun:#F2B35A;--sage-l:#E1ECE5;
 --strong:#0F2E33;--on-strong:#F6F3EA;--shadow:rgba(15,46,51,.13);--shadow-2:rgba(15,46,51,.22);
 --grad:linear-gradient(115deg,var(--teal),var(--mint) 40%,var(--sun) 72%,var(--copper));
 --r-card:24px;--r-input:16px;--r-dialog:26px;--r-pill:999px;
 --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;
 --fb:120ms;--fd:180ms;--ease:cubic-bezier(.2,.8,.2,1);--spring:cubic-bezier(.34,1.56,.64,1);
 --ribbon-alpha:.55;color-scheme:light}
:root[data-theme="dark"]{
 --bg:#061517;--surface:#0D2326;--glass:rgba(12,34,37,.66);--glass-2:rgba(12,34,37,.42);
 --ink:#F2EEE4;--muted:#9DB6B1;--line:rgba(242,238,228,.08);--line-2:rgba(242,238,228,.16);
 --teal:#2BC7BA;--mint:#6BE3C2;--mint-soft:rgba(107,227,194,.12);--copper:#FF9452;--sun:#FFC66E;--sage-l:rgba(242,238,228,.07);
 --strong:#F2EEE4;--on-strong:#061517;--shadow:rgba(0,0,0,.4);--shadow-2:rgba(0,0,0,.6);--ribbon-alpha:.7;color-scheme:dark}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
 --bg:#061517;--surface:#0D2326;--glass:rgba(12,34,37,.66);--glass-2:rgba(12,34,37,.42);
 --ink:#F2EEE4;--muted:#9DB6B1;--line:rgba(242,238,228,.08);--line-2:rgba(242,238,228,.16);
 --teal:#2BC7BA;--mint:#6BE3C2;--mint-soft:rgba(107,227,194,.12);--copper:#FF9452;--sun:#FFC66E;--sage-l:rgba(242,238,228,.07);
 --strong:#F2EEE4;--on-strong:#061517;--shadow:rgba(0,0,0,.4);--shadow-2:rgba(0,0,0,.6);--ribbon-alpha:.7;color-scheme:dark}}

/* لوگو و آیکون‌های تک‌رنگ در تم تیره */
.logo-dark{display:none}
:root[data-theme="dark"] .logo-light{display:none}:root[data-theme="dark"] .logo-dark{display:block}
:root[data-theme="dark"] .ico-inv,:root[data-theme="dark"] .dock img,:root[data-theme="dark"] .empty img,:root[data-theme="dark"] .notice>img,:root[data-theme="dark"] .aff-strip>img,:root[data-theme="dark"] .btn.tonal img{filter:invert(1) brightness(1.7) saturate(0)}
@media (prefers-color-scheme:dark){
 :root:not([data-theme="light"]) .logo-light{display:none}:root:not([data-theme="light"]) .logo-dark{display:block}
 :root:not([data-theme="light"]) .dock img,:root:not([data-theme="light"]) .empty img,:root:not([data-theme="light"]) .notice>img,:root:not([data-theme="light"]) .aff-strip>img,:root:not([data-theme="light"]) .btn.tonal img{filter:invert(1) brightness(1.7) saturate(0)}}

/* ─── پایه ─── */
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Vazirmatn,Tahoma,sans-serif;font-size:17px;line-height:1.8;letter-spacing:0;font-synthesis:none;-webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background .5s var(--ease),color .5s var(--ease)}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
:focus-visible{outline:3px solid var(--copper);outline-offset:3px;border-radius:8px}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(32px,5.4vw,64px);font-weight:700;line-height:1.35;margin-bottom:var(--s3)}
h2{font-size:clamp(22px,2.6vw,32px);font-weight:700;line-height:1.5;margin-bottom:var(--s3)}
h3{font-size:17px;font-weight:700;margin:0 0 var(--s1);line-height:1.6}
code{font-family:ui-monospace,Menlo,Consolas,monospace;background:var(--sage-l);padding:1px 8px;border-radius:var(--r-pill);font-size:.92em}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;inset-inline-start:-999px;top:8px;background:var(--strong);color:var(--on-strong);padding:var(--s2) var(--s4);border-radius:var(--r-pill);z-index:50}
.skip:focus{inset-inline-start:8px}
main{position:relative;z-index:1;max-width:1240px;margin:0 auto;padding:0 var(--s5) var(--s7)}

/* ─── زمینهٔ زنده: نوارهای سیال (canvas) + شفق ─── */
.ribbons{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:var(--ribbon-alpha)}
.aurora{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.aurora i{position:absolute;width:56vmax;height:56vmax;border-radius:50%;opacity:.4;will-change:transform;animation:drift 60s ease-in-out infinite alternate}
.aurora i:nth-child(1){background:radial-gradient(circle,var(--mint),transparent 68%);top:-22vmax;inset-inline-end:-14vmax}
.aurora i:nth-child(2){background:radial-gradient(circle,var(--sun),transparent 68%);bottom:-26vmax;inset-inline-start:-16vmax;animation-duration:75s;opacity:.3}
.aurora i:nth-child(3){background:radial-gradient(circle,var(--teal),transparent 68%);top:28%;inset-inline-start:32%;width:36vmax;height:36vmax;animation-duration:90s;opacity:.2}
@keyframes drift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(-6vmax,4vmax) scale(1.12)}100%{transform:translate(5vmax,-3vmax) scale(.94)}}
.progress{position:fixed;top:0;inset-inline:0;height:3px;z-index:40;background:var(--grad);transform-origin:right;transform:scaleX(var(--p,0))}
.glow{position:fixed;z-index:0;width:420px;height:420px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,color-mix(in srgb,var(--mint) 30%,transparent),transparent 65%);transform:translate(calc(var(--gx,-999px) - 50%),calc(var(--gy,-999px) - 50%));transition:opacity .4s;opacity:.7}

/* ─── نوار بالا: شیشه‌ای و شناور ─── */
.nav{position:sticky;top:12px;z-index:30;display:flex;align-items:center;gap:var(--s4);max-width:1240px;margin:12px auto 0;padding:10px 12px 10px 20px;border-radius:var(--r-pill);background:var(--glass);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);border:1px solid var(--line);box-shadow:0 10px 30px var(--shadow);transition:transform .35s var(--ease),box-shadow .35s}
.nav.tuck{transform:translateY(-120%)}
.nav-brand img{height:62px;width:auto;margin-block:-6px}
.nav-links{display:flex;gap:4px;margin-inline-start:var(--s4)}
.nav-links a,.nav-links button{position:relative;padding:8px 16px;border-radius:var(--r-pill);font-size:15px;color:var(--muted);transition:color var(--fd),background var(--fd)}
.nav-links a:hover,.nav-links button:hover{color:var(--ink);background:var(--sage-l)}
.nav-links a.on{color:var(--ink)}
.nav-links a.on::after{content:'';position:absolute;inset-inline:16px;bottom:3px;height:3px;border-radius:3px;background:var(--grad);animation:grow .5s var(--ease) both}
@keyframes grow{from{transform:scaleX(0)}to{transform:none}}
.nav-end{margin-inline-start:auto;display:flex;align-items:center;gap:var(--s2)}
.theme-toggle{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--sage-l);transition:transform .5s var(--spring)}
.theme-toggle:hover{transform:rotate(-25deg)}
.theme-toggle svg{width:22px;height:22px;fill:none;stroke:var(--ink);stroke-width:1.8;stroke-linecap:round}
.theme-toggle .moon{display:none;fill:var(--ink);stroke:none}
:root[data-theme="dark"] .theme-toggle .sun{display:none}:root[data-theme="dark"] .theme-toggle .moon{display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .theme-toggle .sun{display:none}:root:not([data-theme="light"]) .theme-toggle .moon{display:block}}

/* ─── دکمه‌ها ─── */
.btn{position:relative;overflow:hidden;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:48px;padding:0 var(--s5);border-radius:var(--r-pill);background:var(--strong);color:var(--on-strong);font-size:15px;font-weight:700;white-space:nowrap;transition:transform var(--fb) var(--ease),box-shadow var(--fd) var(--ease),background var(--fd)}
.btn img{width:20px;filter:brightness(0) invert(1)}
:root[data-theme="dark"] .btn:not(.tonal):not(.light) img{filter:brightness(0)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .btn:not(.tonal):not(.light) img{filter:brightness(0)}}
.btn:hover{box-shadow:0 10px 26px var(--shadow-2)}
.btn:active{transform:scale(.97)}
.btn.tonal{background:var(--sage-l);color:var(--ink);font-weight:400}
.btn.tonal img{filter:none}
.btn.small{min-height:40px;padding:0 var(--s4);font-size:14px}
.btn.light{background:#F6F3EA;color:#0F2E33}.btn.light img{filter:none}
.btn.ghost{background:transparent;color:inherit;border:1px solid currentColor;font-weight:400}
.bot-cta{background:var(--grad);background-size:200% 100%;color:#06221F;animation:shift 6s ease-in-out infinite}
.bot-cta img{filter:brightness(0)!important}
.btn::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(120%);transition:transform .8s var(--ease)}
.btn:hover::after{transform:translateX(-120%)}
@keyframes shift{0%,100%{background-position:0 0}50%{background-position:100% 0}}
.ripple{position:absolute;border-radius:50%;transform:scale(0);background:currentColor;opacity:.25;pointer-events:none;animation:ripple .6s ease-out forwards}
@keyframes ripple{to{transform:scale(3);opacity:0}}
.chip{display:inline-flex;align-items:center;border-radius:var(--r-pill);background:var(--mint-soft);color:var(--ink);padding:2px 12px;font-size:12px}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--mint);animation:ping 2.2s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--mint) 60%,transparent)}70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}

/* ─── نشان زنده ─── */
.mark path{fill:var(--ink)}
.mark .b2{fill:var(--copper)}
.mark.big .b1,.mark.big .b3{fill:url(#g-ink)}
.mark.big .b2{fill:url(#g-cu)}
.mark.live path{transform-box:fill-box;transform-origin:right center;animation:band-in 900ms var(--ease) both,wave 5s 1.2s ease-in-out infinite}
.mark.live .b2{animation-delay:140ms,1.4s}
.mark.live .b3{animation-delay:280ms,1.6s}
@keyframes band-in{from{opacity:0;transform:translateX(-30%) scaleX(.5)}to{opacity:1;transform:none}}
@keyframes wave{0%,100%{transform:none}25%{transform:translateX(-5%)}50%{transform:translateX(2%) scaleX(1.03)}}

/* ─── قهرمان ─── */
.hero{text-align:center;padding:clamp(40px,8vw,96px) 0 var(--s6);display:grid;justify-items:center}
.hero-mark{position:relative;width:132px;height:132px;margin-bottom:var(--s4);transform-style:preserve-3d;transition:transform .3s var(--ease)}
.hero-mark .mark{width:100%;height:100%;filter:drop-shadow(0 14px 30px color-mix(in srgb,var(--teal) 35%,transparent))}
.orbit{position:absolute;inset:-18px;border-radius:50%;border:1px dashed var(--line-2);animation:spin 26s linear infinite}
.orbit i{position:absolute;width:10px;height:10px;border-radius:50%;background:var(--mint);top:-5px;left:50%;box-shadow:0 0 12px var(--mint)}
.orbit i:nth-child(2){background:var(--copper);top:auto;bottom:-5px;box-shadow:0 0 12px var(--copper)}
.orbit i:nth-child(3){background:var(--sun);top:50%;left:-5px;box-shadow:0 0 12px var(--sun)}
@keyframes spin{to{transform:rotate(360deg)}}
.kicker{display:inline-flex;align-items:center;gap:var(--s2);padding:6px 16px;border-radius:var(--r-pill);background:var(--glass);border:1px solid var(--line);font-size:14px;color:var(--muted);backdrop-filter:blur(10px);margin-bottom:var(--s4);animation:rise .7s var(--ease) both}
.hero h1{max-width:900px}
.rotator{display:inline-block;background:var(--grad);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shift 5s ease-in-out infinite;min-width:2ch}
.rotator.out{animation:word-out .35s var(--ease) forwards,shift 5s ease-in-out infinite}
.rotator.in{animation:word-in .5s var(--spring) both,shift 5s ease-in-out infinite}
@keyframes word-out{to{opacity:0;transform:translateY(-.4em) rotateX(60deg);filter:blur(6px)}}
@keyframes word-in{from{opacity:0;transform:translateY(.5em) rotateX(-60deg);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.split-w{display:inline-block;animation:w-in .8s var(--ease) both;animation-delay:calc(var(--w) * 90ms + 150ms)}
@keyframes w-in{from{opacity:0;transform:translateY(24px);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
.hero-sub{max-width:620px;color:var(--muted);font-size:clamp(16px,1.6vw,19px);margin-bottom:var(--s5);animation:rise .8s .45s var(--ease) both}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ─── جستجو ─── */
.search{position:relative;isolation:isolate;display:flex;align-items:center;gap:var(--s2);width:min(720px,100%);padding:8px;border-radius:var(--r-pill);box-shadow:0 18px 50px var(--shadow);animation:rise .8s .6s var(--ease) both}
.search::after{content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--surface)}
.search::before{content:'';position:absolute;inset:-2px;z-index:-1;border-radius:inherit;background:conic-gradient(from var(--a,0deg),var(--teal),var(--mint),var(--sun),var(--copper),var(--teal));opacity:.55;animation:turn 6s linear infinite}
.search:focus-within::before{opacity:1;filter:blur(1px)}
@property --a{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes turn{to{--a:360deg}}
.search-ico{width:22px;height:22px;flex:none;margin-inline-start:12px;fill:none;stroke:var(--muted);stroke-width:2;stroke-linecap:round}
.search input{flex:1;min-width:0;border:0;outline:none;background:transparent;color:var(--ink);font-size:17px;padding:10px 4px}
.search input::placeholder{color:var(--muted);opacity:1}
.search input::-webkit-search-cancel-button{display:none}
.search .btn{min-height:50px}
.search.compact{width:100%;animation:none;box-shadow:0 8px 24px var(--shadow)}
.search.compact::before{opacity:.35}
.search-pop{position:absolute;top:calc(100% + 10px);inset-inline:0;z-index:20;text-align:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-input);box-shadow:0 24px 60px var(--shadow-2);padding:6px;animation:pop .2s var(--ease)}
.search-pop a{display:flex;align-items:center;gap:var(--s3);padding:6px;border-radius:12px;font-size:15px}
.search-pop a:hover,.search-pop a.act{background:var(--sage-l)}
.search-pop img{width:46px;height:46px;border-radius:10px;object-fit:cover;flex:none;background:var(--sage-l)}
.search-pop span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.search-pop small{font:600 11px ui-monospace,Menlo,Consolas,monospace;color:var(--muted)}
.search-pop .all{justify-content:center;color:var(--teal);font-weight:700}
@keyframes pop{from{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:none}}
.hot{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s2);margin-top:var(--s4);animation:rise .8s .75s var(--ease) both}
.hot a{padding:4px 14px;border-radius:var(--r-pill);border:1px solid var(--line-2);font-size:14px;color:var(--muted);transition:all var(--fd)}
.hot a:hover{color:var(--ink);background:var(--mint-soft);border-color:var(--mint);transform:translateY(-2px)}

/* ─── دروازه‌ها ─── */
.gates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4);margin:var(--s6) 0 var(--s7)}
.gate{position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto auto;column-gap:var(--s4);align-items:center;padding:var(--s5);min-height:150px;border-radius:var(--r-card);background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transform-style:preserve-3d;transition:transform .25s var(--ease),box-shadow .3s,border-color .3s}
.gate::before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(360px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--mint) 26%,transparent),transparent 60%);opacity:0;transition:opacity .3s}
.gate:hover{box-shadow:0 22px 50px var(--shadow);border-color:color-mix(in srgb,var(--mint) 50%,transparent)}
.gate:hover::before{opacity:1}
.gate-ico{grid-row:1/4;width:64px;height:64px;border-radius:20px;display:grid;place-items:center;background:var(--mint-soft);transition:transform .4s var(--spring)}
.gate:hover .gate-ico{transform:scale(1.08) rotate(-6deg)}
.gate-ico svg{width:38px;height:38px;fill:none;stroke:var(--teal);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.gate b{font-size:20px}
.gate small{color:var(--muted);font-size:14px;line-height:1.7}
.gate-count{font-size:13px;color:var(--teal);font-weight:700}
.gate-arrow{position:absolute;inset-inline-end:var(--s5);top:var(--s5);font-style:normal;font-size:20px;color:var(--muted);transition:transform .3s var(--spring),color .3s}
.gate:hover .gate-arrow{transform:translateX(-6px);color:var(--copper)}
.gate .sunny{fill:var(--sun);stroke:none;animation:sunny 3s ease-in-out infinite;transform-origin:31px 19px}
@keyframes sunny{50%{transform:scale(1.35)}}
.gate .playy{fill:var(--copper);stroke:none;animation:beat 1.6s ease-in-out infinite;transform-origin:center;transform-box:fill-box}
@keyframes beat{50%{transform:scale(1.2)}}
.gate .eq rect{fill:var(--teal);stroke:none;transform-origin:center;transform-box:fill-box;animation:eq 1s ease-in-out infinite}
.gate .eq rect:nth-child(2){animation-delay:.2s}.gate .eq rect:nth-child(3){animation-delay:.4s}.gate .eq rect:nth-child(4){animation-delay:.1s}
@keyframes eq{0%,100%{transform:scaleY(.45)}50%{transform:scaleY(1.15)}}
.gate .slash{stroke:var(--copper);animation:blinkc 1.2s steps(1) infinite}
@keyframes blinkc{50%{opacity:.15}}
.gate .spark{stroke:var(--sun);animation:twinkle 1.8s ease-in-out infinite}
@keyframes twinkle{50%{opacity:.2;transform:scale(.8)}}
.gate-bot{background:linear-gradient(135deg,#0F2E33,#0C5F5A 60%,#0C8F88);color:#F6F3EA;border-color:transparent}
.gate-bot small{color:rgba(246,243,234,.78)}
.gate-bot .gate-ico{background:rgba(255,255,255,.12)}
.gate-bot .gate-ico svg{stroke:none;fill:#F6F3EA}
.gate-bot .gate-arrow{color:#F6F3EA}
.gate-badge{position:absolute;top:var(--s4);inset-inline-end:56px;font-size:12px;font-weight:700;padding:2px 10px;border-radius:var(--r-pill);background:var(--sun);color:#3A2410;animation:bob 2.6s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-3px)}}
.gate-bot::after{content:'';position:absolute;inset:0;z-index:-1;background:url('/static/brand/patterns/dialogue-ribbons-tile.svg') 0 0/180px;opacity:.08;animation:pan 30s linear infinite}
@keyframes pan{to{background-position:360px 180px}}

/* ─── قفسه و کارت ─── */
.shelf{margin-bottom:var(--s7)}
.shelf-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s4);margin-bottom:var(--s4)}
.link-more{color:var(--teal);font-weight:700;font-size:15px}
.link-more i{display:inline-block;font-style:normal;transition:transform .3s var(--spring)}
.link-more:hover i{transform:translateX(-6px)}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5)}
.card{position:relative;isolation:isolate;display:flex;flex-direction:column;background:var(--surface);border-radius:var(--r-card);overflow:hidden;border:1px solid var(--line);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.card::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(300px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.18),transparent 60%);opacity:0;transition:opacity .3s}
.card:hover{transform:translateY(-6px);box-shadow:0 26px 50px var(--shadow)}
.card:hover::before{opacity:1}
.card figure{position:relative;margin:0;aspect-ratio:4/3;background:var(--sage-l);overflow:hidden}
.card figure::before{content:'';position:absolute;inset:0;background:url('/static/brand/patterns/prompt-grid-tile.svg') 0 0/140px;opacity:.3}
.card figure img{position:relative;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.card:hover figure img{transform:scale(1.07)}
.card figure.noimg img{display:none}
.card figure::after{content:'';position:absolute;inset:auto 0 0;height:40%;background:linear-gradient(transparent,rgba(6,21,23,.35));pointer-events:none}
.code{position:absolute;z-index:1;inset-block-start:var(--s3);inset-inline-start:var(--s3);background:var(--glass);backdrop-filter:blur(8px);color:var(--ink);border-radius:var(--r-pill);padding:2px 12px;font:600 12px/1.8 ui-monospace,Menlo,Consolas,monospace}
.kind-tag{position:absolute;z-index:1;inset-block-end:var(--s3);inset-inline-start:var(--s3);font-size:12px;color:#fff;background:rgba(6,21,23,.45);backdrop-filter:blur(6px);border-radius:var(--r-pill);padding:2px 10px}
.play{position:absolute;z-index:1;inset-block-end:var(--s3);inset-inline-end:var(--s3);width:42px;height:42px;border-radius:50%;background:var(--copper);box-shadow:0 0 0 0 var(--copper);animation:ping-c 2.4s infinite}
.play::after{content:'';position:absolute;inset:0;margin:auto;width:0;height:0;border-block:8px solid transparent;border-inline-end:13px solid #fff;transform:translateX(-2px)}
@keyframes ping-c{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--copper) 60%,transparent)}70%{box-shadow:0 0 0 12px transparent}100%{box-shadow:0 0 0 0 transparent}}
.card-body{padding:var(--s4) var(--s5) var(--s4);display:flex;flex-direction:column;gap:var(--s1);flex:1}
.card-body h3 a::after{content:'';position:absolute;inset:0;z-index:1}
.card-body p{font-size:14px;color:var(--muted);margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-meta{display:flex;justify-content:space-between;align-items:center;gap:var(--s2);margin-top:auto;padding-top:var(--s3);font-size:12px;color:var(--muted)}
.copy-chip{position:relative;z-index:3;display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 14px;border-radius:var(--r-pill);background:var(--mint-soft);color:var(--ink);font-size:14px;font-weight:700;transition:transform .3s var(--spring),background .2s}
.copy-chip svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.copy-chip:hover{transform:scale(1.06);background:var(--mint);color:#06221F}
.copy-chip.done{background:var(--mint);color:#06221F}
.js-reveal .reveal{opacity:0;transform:translateY(26px) scale(.98)}
.reveal.in{opacity:1;transform:none;transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--d,0) * 70ms)}
.card.reveal.in:hover{transform:translateY(-6px);transition-delay:0s}

/* ─── نوار ربات ─── */
.bot-band{position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:1.3fr 1fr;gap:var(--s6);align-items:center;padding:var(--s7);border-radius:32px;background:linear-gradient(135deg,#0F2E33,#0B4B49 55%,#0C8F88);color:#F6F3EA}
.bot-band::before{content:'';position:absolute;inset:0;z-index:-1;background:url('/static/brand/patterns/dialogue-ribbons-tile.svg') 0 0/220px;opacity:.07;animation:pan 40s linear infinite}
.bot-band::after{content:'';position:absolute;width:420px;height:420px;border-radius:50%;inset-inline-start:-120px;bottom:-200px;z-index:-1;background:radial-gradient(circle,rgba(242,179,90,.45),transparent 65%);animation:drift 14s ease-in-out infinite alternate}
.bot-band p{color:rgba(246,243,234,.82)}
.steps{list-style:none;padding:0;margin:var(--s4) 0 var(--s5);display:grid;gap:var(--s2)}
.steps li{display:flex;align-items:center;gap:var(--s3)}
.steps b{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.14);font-size:14px}
.bot-band-actions{display:flex;flex-wrap:wrap;gap:var(--s3)}
.bot-band-chat{display:grid;gap:var(--s3)}
.bot-band-chat .bubble{animation:float 5s ease-in-out infinite}
.bot-band-chat .bubble:nth-child(2){animation-delay:.8s}.bot-band-chat .bubble:nth-child(3){animation-delay:1.6s}
.bot-band-chat .bubble.me{background:#F6F3EA;color:#0F2E33}
.bot-band-chat .bubble.rasa{background:rgba(255,255,255,.12);color:#F6F3EA}
.bot-band-chat .copyable{background:var(--sun)!important;color:#3A2410!important;font-weight:700;justify-self:start}
@keyframes float{50%{transform:translateY(-8px)}}

/* ─── فهرست ─── */
.crumbs{display:flex;gap:var(--s2);font-size:14px;color:var(--muted);padding-top:var(--s5);flex-wrap:wrap}
.crumbs a:hover{color:var(--teal)}
.list-head{padding-bottom:var(--s4)}
.list-head h1{font-size:clamp(28px,4vw,44px);margin:var(--s2) 0 var(--s4)}
.list-head h1 .count{font-size:16px;font-weight:400;color:var(--muted)}
.tabs{position:relative;display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s4) 0 var(--s3)}
.tabs button{position:relative;z-index:1;min-height:44px;border-radius:var(--r-pill);padding:0 var(--s4);font-size:15px;color:var(--muted);transition:color .3s}
.tabs button small{margin-inline-start:6px;opacity:.7;font-size:12px}
.tabs button[aria-selected="true"]{color:var(--on-strong)}
.tab-ink{position:absolute;z-index:0;height:44px;top:0;border-radius:var(--r-pill);background:var(--strong);transition:all .45s var(--spring)}
.chips{display:flex;gap:var(--s2);overflow-x:auto;padding:var(--s1) 0 var(--s3);scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chips button{flex:none;border-radius:var(--r-pill);background:var(--glass);border:1px solid var(--line);padding:4px 14px;font-size:13px;color:var(--muted);transition:all .25s var(--ease)}
.chips button:hover{border-color:var(--mint);color:var(--ink)}
.chips button.on{background:var(--mint-soft);color:var(--ink);border-color:var(--mint)}
.skeletons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5)}
.skeletons[hidden]{display:none}
.sk{border-radius:var(--r-card);overflow:hidden;background:var(--surface);border:1px solid var(--line);padding-bottom:var(--s4)}
.sk i{display:block;aspect-ratio:4/3}.sk b{display:block;height:14px;margin:var(--s4) var(--s5) 0;border-radius:8px}.sk b+b{width:50%}
.sk i,.sk b{background:linear-gradient(90deg,var(--sage-l) 25%,var(--mint-soft) 50%,var(--sage-l) 75%);background-size:300% 100%;animation:shimmer 1.4s linear infinite}
@keyframes shimmer{to{background-position:-150% 0}}
.more-wrap{display:flex;justify-content:center;margin-top:var(--s6)}
.empty,.notice{text-align:center;padding:var(--s7) var(--s4);display:grid;justify-items:center;gap:var(--s2)}
.empty img,.notice>img{width:56px;margin-bottom:var(--s2);animation:bob 3s ease-in-out infinite}
.notice-actions{display:flex;gap:var(--s3);justify-content:center;flex-wrap:wrap;margin-top:var(--s4)}
.aff-strip{display:flex;align-items:center;gap:var(--s5);background:var(--glass);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--s5) var(--s6);backdrop-filter:blur(12px)}
.aff-strip p{margin:0;color:var(--muted);font-size:15px}
.aff-strip>img{width:36px}.aff-strip>div{flex:1}

/* ─── جزئیات ─── */
.item{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:var(--s7);padding:var(--s4) 0 var(--s7);align-items:start}
.item-media{position:sticky;top:100px;border-radius:28px;overflow:hidden;background:var(--sage-l);box-shadow:0 30px 70px var(--shadow);transition:transform .3s var(--ease)}
.item-media img,.item-media video{width:100%;display:block}
.media-note{position:absolute;inset-block-end:var(--s3);inset-inline-start:var(--s3);font-size:12px;color:#fff;background:rgba(6,21,23,.5);backdrop-filter:blur(6px);border-radius:var(--r-pill);padding:2px 12px}
.eyebrow{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2);font-size:13px;color:var(--muted);margin-bottom:var(--s3)}
.eyebrow .code{position:static;background:var(--sage-l)}
.item-title{font-size:clamp(28px,3.4vw,42px)}
.lead{font-size:18px;color:var(--muted)}
.prompt-box{position:relative;isolation:isolate;margin:var(--s5) 0 var(--s4);background:var(--surface);border-radius:var(--r-dialog);box-shadow:0 18px 50px var(--shadow)}
.prompt-box::before{content:'';position:absolute;inset:-1.5px;z-index:-1;border-radius:inherit;background:conic-gradient(from var(--a,0deg),var(--teal),var(--mint),var(--sun),var(--copper),var(--teal));animation:turn 8s linear infinite;opacity:.7}
.prompt-box::after{content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--surface)}
.prompt-head{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);padding:var(--s3) var(--s4) var(--s3) var(--s5);border-bottom:1px solid var(--line)}
.copy-main{background:var(--grad);background-size:200% 100%;color:#06221F;animation:shift 6s ease-in-out infinite}
.copy-main svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2}
.prompt-box pre{margin:0;padding:var(--s4) var(--s5) var(--s5);max-height:440px;overflow:auto;white-space:pre-wrap;word-break:break-word;text-align:left;font:14px/1.85 ui-monospace,Menlo,Consolas,monospace}
.prompt-box.locked pre{max-height:150px;-webkit-mask-image:linear-gradient(#000 25%,transparent);mask-image:linear-gradient(#000 25%,transparent)}
.lock{display:grid;justify-items:center;gap:var(--s2);padding:0 var(--s5) var(--s5);text-align:center}
.actions{display:flex;flex-wrap:wrap;gap:var(--s2);margin-bottom:var(--s5)}
.why{padding-inline-start:20px;color:var(--muted)}
.why li::marker{color:var(--copper)}
.facts{display:grid;gap:var(--s3);margin:0 0 var(--s4);padding:var(--s4) var(--s5);background:var(--glass);border:1px solid var(--line);border-radius:var(--r-card)}
.facts div{display:grid;grid-template-columns:150px 1fr;gap:var(--s3)}
.facts dt{color:var(--muted)}.facts dd{margin:0}
.credit{font-size:13px;color:var(--muted)}
.credit a{text-decoration:underline;text-underline-offset:4px}
.aff{background:var(--mint-soft);border-radius:var(--r-card);padding:var(--s4) var(--s5);margin-top:var(--s4)}
.aff p{margin:0 0 var(--s2);font-size:14px;color:var(--muted)}
.aff a{font-weight:700;color:var(--teal)}
.aff small{display:block;margin-top:var(--s2);font-size:12px;color:var(--muted)}

/* ─── گفت‌وگو و استودیو ─── */
.avatar{width:44px;height:44px;border-radius:16px;background:var(--mint-soft);display:grid;place-items:center;flex:none}
.avatar .mark{width:30px;height:30px}
.avatar.big{width:68px;height:68px;border-radius:22px}.avatar.big .mark{width:46px;height:46px}
.studio{max-width:900px;margin:auto;padding-bottom:var(--s6)}
.studio-head{display:flex;align-items:center;gap:var(--s4);margin:var(--s4) 0 var(--s5)}
.studio-head h1{font-size:clamp(28px,3.2vw,40px);margin:0}
.studio-head p{margin:0;color:var(--muted);font-size:15px}
.quota{margin-inline-start:auto;flex:none;font-size:13px;background:var(--mint-soft);border-radius:var(--r-pill);padding:4px 14px}
.thread{display:flex;flex-direction:column;gap:var(--s3);overflow:auto;padding:var(--s5);background:var(--glass);border:1px solid var(--line);border-radius:var(--r-dialog);backdrop-filter:blur(14px);min-height:46vh}
.bubble{max-width:92%;padding:var(--s3) var(--s4);border-radius:20px;font-size:15.5px;line-height:1.85;animation:pop .3s var(--ease) both}
.bubble.rasa{align-self:flex-start;background:var(--surface);border-start-start-radius:6px;box-shadow:0 4px 14px var(--shadow)}
.bubble.me{align-self:flex-end;background:var(--strong);color:var(--on-strong);border-start-end-radius:6px}
.bubble pre{direction:ltr;text-align:left;white-space:pre-wrap;word-break:break-word;background:var(--sage-l);border-radius:var(--r-input);padding:var(--s3) var(--s4);margin:var(--s2) 0;font:13.5px/1.75 ui-monospace,Menlo,Consolas,monospace}
.bubble-actions{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s2)}
.typing{display:inline-flex;gap:5px;padding:6px 2px}
.typing i{width:8px;height:8px;border-radius:50%;background:var(--grad);animation:blink 1.1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes blink{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-4px)}}
.composer{display:flex;align-items:flex-end;gap:var(--s2);margin-top:var(--s4);background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-input);padding:6px 6px 6px var(--s2);box-shadow:0 10px 30px var(--shadow);transition:border-color var(--fd),box-shadow var(--fd)}
.composer:focus-within{border-color:var(--mint);box-shadow:0 0 0 4px var(--mint-soft),0 10px 30px var(--shadow)}
.composer textarea{flex:1;min-width:0;border:0;background:transparent;padding:10px var(--s3);outline:none;font-size:16px;resize:none;line-height:1.7}
.send{width:46px;height:46px;flex:none;border-radius:50%;background:var(--sage-l);display:grid;place-items:center;transition:background var(--fd),transform .3s var(--spring)}
.send svg{width:20px;height:20px;fill:var(--ink);transform:scaleX(-1)}
.composer.ready .send{background:var(--grad);animation:nudge 2.2s ease-in-out infinite}
.composer.ready .send svg{fill:#06221F}
.send:active{transform:scale(.9)}
@keyframes nudge{0%,100%{box-shadow:0 0 0 0 transparent}50%{box-shadow:0 0 0 7px color-mix(in srgb,var(--mint) 30%,transparent)}}
.studio-note{font-size:12px;color:var(--muted);text-align:center;margin-top:var(--s3)}

/* ─── اعلان کوچک و ذرات کپی ─── */
.toast{position:fixed;z-index:60;left:50%;bottom:28px;transform:translate(-50%,calc(100% + 60px));visibility:hidden;padding:10px 22px;border-radius:var(--r-pill);background:var(--strong);color:var(--on-strong);font-size:15px;font-weight:700;box-shadow:0 18px 40px var(--shadow-2);transition:transform .45s var(--spring);pointer-events:none}
.toast.show{transform:translate(-50%,0);visibility:visible}
.burst{position:fixed;z-index:70;pointer-events:none;width:0;height:0}
.burst i{position:absolute;width:16px;height:6px;border-radius:6px;animation:fly .9s var(--ease) forwards}
@keyframes fly{from{transform:translate(0,0) rotate(0);opacity:1}to{transform:translate(var(--x),var(--y)) rotate(var(--r));opacity:0}}

/* ─── پانویس و داک موبایل ─── */
.foot{position:relative;z-index:1;isolation:isolate;overflow:hidden;margin-top:var(--s7);background:linear-gradient(160deg,#0B2428,#0F2E33 45%,#0B4B49);color:#F2EEE4;border-radius:40px 40px 0 0}
.foot::before{content:'';position:absolute;inset:0;z-index:-1;background:url('/static/brand/patterns/dialogue-ribbons-tile.svg') 0 0/240px;opacity:.06;filter:invert(1)}
.foot::after{content:'';position:absolute;z-index:-1;width:520px;height:520px;border-radius:50%;inset-inline-end:-160px;top:-260px;background:radial-gradient(circle,rgba(47,192,156,.28),transparent 65%)}
.foot-in{max-width:1240px;margin:0 auto;padding:var(--s7) var(--s5) var(--s6);display:grid;grid-template-columns:auto 1fr;gap:var(--s7)}
.foot-brand img{width:130px;height:auto}
.foot-brand p{margin:var(--s2) 0 0;color:rgba(242,238,228,.7);font-size:14px}
.foot-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5)}
.foot-cols div{display:grid;align-content:start;gap:8px;font-size:14px}
.foot-cols b{margin-bottom:var(--s1);color:#F2B35A}
.foot-cols a,.foot-cols button{color:rgba(242,238,228,.78);text-align:start;padding:0;transition:color .2s,transform .2s}
.foot-cols a:hover,.foot-cols button:hover{color:#6BE3C2;transform:translateX(-3px)}
.foot .coffee-link{color:#F2B35A!important}
.foot-note{grid-column:1/-1;margin:0;padding-top:var(--s4);border-top:1px solid rgba(242,238,228,.12);font-size:12px;color:rgba(242,238,228,.55)}
.dock{display:none}

/* ─── یک لیوان آمریکانو ─── */
.coffee-link{color:var(--copper)!important;font:inherit;cursor:pointer}
.coffee-modal{width:min(430px,calc(100vw - 32px));border:0;border-radius:var(--r-dialog);padding:var(--s6) var(--s5) var(--s5);background:var(--surface);color:var(--ink);box-shadow:0 30px 80px var(--shadow-2);text-align:center;font-family:inherit}
.coffee-modal[open]{animation:pop .35s var(--spring)}
.coffee-modal::backdrop{background:rgba(6,21,23,.55);backdrop-filter:blur(6px)}
.coffee-x{position:absolute;inset-inline-start:12px;top:10px}
.coffee-x button{width:40px;height:40px;border-radius:50%;color:var(--muted);font-size:24px}
.coffee-x button:hover{background:var(--sage-l)}
.coffee-modal h2{font-size:22px;margin:var(--s2) 0}
.coffee-lead{color:var(--muted);line-height:1.9;font-size:15px;margin:0 0 var(--s3)}
.coffee-why{list-style:none;padding:0;margin:0 0 var(--s4);display:flex;flex-wrap:wrap;gap:var(--s2);justify-content:center}
.coffee-why li{background:var(--mint-soft);border-radius:var(--r-pill);padding:4px 12px;font-size:13px}
.coffee-go{width:100%;justify-content:space-between;background:linear-gradient(115deg,var(--sun),var(--copper));color:#2A1606;min-height:56px;font-size:16px;animation:nudge 2.4s ease-in-out 1s 3}
.coffee-go b{background:rgba(255,255,255,.35);padding:4px 12px;border-radius:var(--r-pill)}
.coffee-go[aria-busy=true]{opacity:.7;pointer-events:none}
.coffee-no{margin-top:var(--s2);color:var(--muted);font-size:14px;padding:var(--s3);border-radius:var(--r-pill)}
.coffee-no:hover{color:var(--ink);background:var(--sage-l)}
.coffee-note{font-size:12px;color:var(--muted);margin:var(--s2) 0 0}
.coffee-err{color:#C4532F;font-size:13px;margin:var(--s2) 0 0}
.coffee-art{display:flex;justify-content:center}
.cup{width:128px;height:128px;overflow:visible}
.cup .mug{fill:#FFFDF8;stroke:#0F2E33;stroke-width:4;stroke-linejoin:round}
.cup .handle{stroke:#0F2E33;stroke-width:7;stroke-linecap:round}
.cup .coffee{fill:#5B3A26}
.cup .band{fill:var(--copper)}
.cup .saucer{fill:var(--mint-soft);stroke:var(--mint);stroke-width:2}
.cup .steam path{fill:none;stroke:var(--mint);stroke-width:4;stroke-linecap:round;opacity:0;animation:steam 2.8s ease-in-out infinite}
.cup .steam path:nth-child(2){animation-delay:.6s}.cup .steam path:nth-child(3){animation-delay:1.2s}
@keyframes steam{0%{opacity:0;transform:translateY(10px)}35%{opacity:.9}100%{opacity:0;transform:translateY(-14px)}}
.coffee-done .ref{font-size:14px;color:var(--muted)}
.coffee-done .ref bdi{font-family:monospace;color:var(--ink)}
.coffee-done.ok .cup{animation:bob 3s ease-in-out infinite}

/* ─── سوپرادمین ─── */
.admin{padding:var(--s6) 0}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--s3);margin-bottom:var(--s5)}
.stats div{background:var(--surface);border-radius:var(--r-card);padding:var(--s4);border:1px solid var(--line)}
.stats b{display:block;font-size:26px}.stats span{font-size:13px;color:var(--muted)}
.admin-search{display:flex;flex-wrap:wrap;gap:var(--s2);margin-bottom:var(--s4)}
.admin-search input,.admin-form input{flex:1;min-width:220px;border:1px solid var(--line-2);border-radius:var(--r-input);padding:10px var(--s4);background:var(--surface)}
.admin-form{display:grid;gap:var(--s3);width:min(360px,100%)}
.table-wrap{overflow:auto;background:var(--surface);border-radius:var(--r-card)}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{padding:var(--s3) var(--s4);border-bottom:1px solid var(--line);text-align:start;white-space:nowrap}
th{color:var(--muted);font-weight:400}
.error{color:#C4532F}

/* ─── شکست‌نقطه‌ها (برندبوک: ۱۱۵۰، ۷۶۸، ۳۸۰) ─── */
@media (max-width:1150px){
 .grid,.skeletons{grid-template-columns:repeat(2,minmax(0,1fr))}
 .gates{grid-template-columns:repeat(2,minmax(0,1fr))}
 .item{grid-template-columns:1fr;gap:var(--s5)}.item-media{position:relative;top:0}
 .bot-band{grid-template-columns:1fr}
}
@media (max-width:768px){
 main{padding:0 var(--s4) 110px}
 .nav{top:8px;margin:8px var(--s3) 0;padding:6px 6px 6px 14px}
 .nav-brand img{height:46px;margin-block:-4px}
 .nav-links{display:none}
 .bot-cta{min-height:42px;padding:0 var(--s4)}
 .glow{display:none}
 .hero{padding-top:var(--s6)}
 .hero-mark{width:96px;height:96px}
 .search{padding:6px}.search .btn{min-height:44px;padding:0 var(--s4)}
 .gates{grid-template-columns:1fr;gap:var(--s3)}
 .gate{min-height:0;padding:var(--s4)}
 .gate-ico{width:54px;height:54px}
 .bot-band{padding:var(--s5);border-radius:var(--r-card)}
 .bot-band-chat{display:none}
 .aff-strip{flex-direction:column;align-items:stretch;text-align:center;padding:var(--s5)}
 .facts div{grid-template-columns:1fr;gap:0}
 .studio-head{flex-wrap:wrap}
 .foot{border-radius:28px 28px 0 0}.foot-in{grid-template-columns:1fr;gap:var(--s5);padding-bottom:120px}
 .foot-cols{grid-template-columns:1fr 1fr}
 .dock{position:fixed;z-index:35;display:grid;grid-template-columns:repeat(4,1fr);bottom:12px;inset-inline:12px;padding:6px;border-radius:24px;background:var(--glass);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);border:1px solid var(--line);box-shadow:0 14px 40px var(--shadow-2);padding-bottom:calc(6px + env(safe-area-inset-bottom))}
 .dock a{display:grid;justify-items:center;gap:2px;padding:6px 0;border-radius:18px;font-size:12px;color:var(--muted);transition:background .25s,color .25s}
 .dock a img{width:22px;height:22px}
 .dock a.on{background:var(--mint-soft);color:var(--ink)}
 .dock .dock-bot{background:var(--grad);color:#06221F}
 .dock .dock-bot img{filter:brightness(0)!important}
 .toast{bottom:96px}
}
@media (max-width:380px){
 .grid,.skeletons{grid-template-columns:1fr}
 .tabs button{padding:0 var(--s3)}
 .search .btn{display:none}
 .bot-cta{font-size:0;gap:0;width:42px;padding:0}
 .bot-cta img{width:22px}
}
@media (prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .reveal{opacity:1;transform:none}
 .ribbons,.glow{display:none}
}

/* گذار دایره‌ای تغییر تم */
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-new(root){animation:theme-in .7s var(--ease)}
@keyframes theme-in{from{clip-path:circle(0 at var(--vx,50%) var(--vy,0))}to{clip-path:circle(150vmax at var(--vx,50%) var(--vy,0))}}

/* ─── داخل تلگرام (Mini App): ظاهر اپ؛ تم از خود تلگرام می‌آید ─── */
.tg .theme-toggle,.tg .bot-cta,.tg .dock,.tg .glow,.tg .gate-bot,.tg .bot-band,.tg .foot-cols,.tg .progress{display:none!important}
.tg .nav{top:6px;margin-top:6px;box-shadow:none}
.tg .hero{padding-top:var(--s5)}
.tg .foot{margin-top:var(--s6);border-radius:24px 24px 0 0}
.tg .foot-in{padding:var(--s5) var(--s5) var(--s6);grid-template-columns:1fr;gap:var(--s3)}
.tg .foot-brand img{width:80px}
.tg main{padding-bottom:var(--s5)}
.tg .ribbons{opacity:calc(var(--ribbon-alpha) * .6)}

/* ─── مرکز فرماندهی ─── */
.cmd h1{font-size:clamp(24px,3vw,34px);margin:0}
.cmd h2{margin:var(--s6) 0 var(--s3);font-size:22px;scroll-margin-top:90px}
.cmd-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s3);margin-bottom:var(--s4)}
.cmd-nav{display:flex;flex-wrap:wrap;gap:var(--s2)}
.cmd-nav a{padding:4px 14px;border-radius:var(--r-pill);background:var(--sage-l);font-size:14px}
.cmd-msg{background:var(--mint-soft);border:1px solid var(--mint);border-radius:var(--r-input);padding:var(--s3) var(--s4)}
.cmd-note{color:var(--muted);font-size:14px}
.cmd td small{color:var(--muted);font-size:12px}
.cmd table{white-space:normal}.cmd td,.cmd th{white-space:normal;vertical-align:middle}
.pill{display:inline-block;border-radius:var(--r-pill);padding:2px 10px;font-size:12px}
.pill.on{background:var(--mint-soft)}.pill.off{background:var(--sage-l);color:var(--muted)}
.pill.bad{background:rgba(224,123,63,.18);color:var(--copper)}.pill.run{background:var(--sun);color:#3A2410}
.cmd-add{display:grid;grid-template-columns:2fr 1fr 1fr;gap:var(--s3);align-items:end;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--s4);margin-bottom:var(--s3)}
.cmd-add label{display:grid;gap:4px;font-size:13px;color:var(--muted)}
.cmd-add input,.cmd-add select{border:1px solid var(--line-2);border-radius:var(--r-input);padding:10px var(--s3);background:var(--bg);color:var(--ink)}
.cmd-add .chk{grid-column:1/-1;display:flex;align-items:center;gap:var(--s2)}
.cmd-add .chk input{width:18px;height:18px}
.cmd-add button{grid-column:1/-1;justify-self:start}
.cmd-add small{grid-column:1/-1;color:var(--muted)}
form.inline{display:inline-block;margin-inline-end:4px}
@media (max-width:768px){.cmd-add{grid-template-columns:1fr}}
.chk-group{grid-column:1/-1;border:1px solid var(--line);border-radius:var(--r-input);padding:var(--s3);display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--s2)}
.chk-group legend{color:var(--muted);font-size:13px;padding:0 6px}