/* تست شخصیت استایل v3 — مینیمال و مدرن */
.spq{position:relative;isolation:isolate;overflow-x:hidden;min-height:100vh;display:flex;flex-direction:column;direction:rtl;text-align:right;
  font-family:var(--spq-font,Vazirmatn,Tahoma,sans-serif);font-weight:300;line-height:1.9;background:var(--bg);color:var(--ink);transition:background .4s,color .4s}
.spq[data-theme="day"]{--bg:#FAFAF8;--ink:#0F1115;--muted:#6C7079;--line:rgba(15,17,21,.13);--soft:rgba(15,17,21,.04);--btn-bg:#0F1115;--btn-fg:#FAFAF8;--accent:var(--accent-day,#3F6B66)}
.spq[data-theme="night"]{--bg:#0C0D10;--ink:#F3F4F6;--muted:#8D929C;--line:rgba(243,244,246,.15);--soft:rgba(243,244,246,.05);--btn-bg:#F3F4F6;--btn-fg:#0C0D10;--accent:var(--accent-night,#8FCBC2)}
body.spq-full{margin:0}
html.spq-night body.spq-full{background:#0C0D10}
html:not(.spq-night) body.spq-full{background:#FAFAF8}
.spq *,.spq *::before,.spq *::after{box-sizing:border-box}
.spq :where(h1,h2,p,ul,ol){margin:0;padding:0}
.spq :where(h1,h2,h3,p,li,span,small,em,summary){color:inherit}
.spq ul{list-style:none}
.spq,.spq *{text-decoration:none!important}
.spq button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0}
.spq :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.spq svg.i{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.spq svg.i.big{width:30px;height:30px}

.spq-head{display:flex;justify-content:space-between;align-items:center;padding:20px clamp(18px,5vw,56px)}
.spq-brand{display:flex;align-items:center;gap:10px;font-weight:500;font-size:15px;color:var(--ink)}
.spq-brand svg{width:22px;height:22px;color:var(--accent)}
.spq button.spq-theme{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-size:13px;color:var(--ink);transition:border-color .2s}
.spq button.spq-theme:hover{border-color:var(--ink)}
.spq-main{flex:1;width:100%;max-width:1040px;margin:0 auto;padding:6px clamp(18px,5vw,40px) 56px}
.spq-foot{padding:22px;text-align:center;font-size:12px;color:var(--muted)}

/* دکمه‌ها: رنگ متن با اولویت بالا */
.spq button.spq-btn,.spq a.spq-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 24px;border-radius:14px;
  background:var(--btn-bg);color:var(--btn-fg);border:1px solid var(--btn-bg);font-size:15px;font-weight:400;transition:transform .2s,background .2s,color .2s,border-color .2s}
.spq button.spq-btn:hover{transform:translateY(-2px)}
.spq button.spq-btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.spq button.spq-btn.ghost:hover{border-color:var(--ink);background:var(--soft)}
.spq button.spq-btn span,.spq button.spq-btn svg{color:inherit}
.spq button.spq-back{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--muted);padding:6px 0;transition:color .2s}
.spq button.spq-back:hover{color:var(--ink)}

/* صفحه‌ی اول */
.spq-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,5vw,64px);align-items:center;min-height:calc(100vh - 200px)}
.spq-hero h1{font-size:clamp(26px,4vw,44px);white-space:nowrap;font-weight:200;line-height:1.5;letter-spacing:-.01em;animation:spq-up .9s cubic-bezier(.2,.8,.2,1) both}
.spq-sub{margin:18px 0 32px;max-width:30em;font-size:17px;color:var(--muted);animation:spq-up .9s .12s both}
.spq-hcopy .spq-btn{animation:spq-up .9s .24s both}
.spq-facts{margin-top:34px;display:flex;gap:10px 22px;flex-wrap:wrap;font-size:13.5px;color:var(--muted);animation:spq-up .9s .36s both}
.spq-facts li{display:flex;align-items:center;gap:7px}.spq-facts svg{width:17px;height:17px}
@keyframes spq-up{from{opacity:0;transform:translateY(22px)}}
.spq-hart{display:flex;justify-content:center}
.spq-sig{width:min(100%,480px);aspect-ratio:1;display:block}

/* سؤال */
.spq-quiz{max-width:660px;margin:0 auto;padding-top:6px}
.spq-top{display:flex;align-items:center;gap:14px;justify-content:space-between}
.spq-meta{flex:1;display:flex;flex-direction:column;align-items:center;gap:0;font-size:13px;color:var(--muted)}
.spq-chap{display:inline-flex;align-items:center;gap:6px;color:var(--ink)}.spq-chap svg{width:16px;height:16px;color:var(--accent)}
.spq-mini{width:72px;height:72px;flex:none}
.spq-seg{display:flex;gap:6px;margin:10px 0 28px}
.spq-seg i{flex:1;height:3px;border-radius:3px;background:var(--line);overflow:hidden;display:block}
.spq-seg b{display:block;height:100%;background:var(--accent);transition:width .6s cubic-bezier(.2,.8,.2,1)}
.spq-q h2{font-size:clamp(25px,4.4vw,36px);font-weight:300;line-height:1.7;margin-bottom:24px;outline:none}
.spq-q{animation:spq-next .45s cubic-bezier(.2,.8,.2,1)}
@keyframes spq-next{from{opacity:0;transform:translateX(-28px)}}
.spq-opts{display:flex;flex-direction:column;gap:10px}
.spq-opts.g3{display:grid;grid-template-columns:repeat(3,1fr)}
.spq-opts.g2{display:grid;grid-template-columns:repeat(2,1fr)}
.spq-opts li{animation:spq-up .5s calc(var(--i) * 60ms + 80ms) both}
.spq button.spq-opt{width:100%;display:flex;align-items:center;gap:14px;text-align:right;padding:16px 18px;border:1px solid var(--line);border-radius:16px;font-size:16.5px;font-weight:300;color:var(--ink);transition:border-color .2s,background .2s,transform .2s}
.spq button.spq-opt:hover{border-color:var(--ink);transform:translateX(-3px)}
.spq-radio{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;flex:none;transition:all .2s}
.spq-radio svg{width:14px;height:14px;opacity:0;stroke-width:2.2}
.spq button.spq-opt.sel{border-color:var(--ink);background:var(--soft)}
.spq-opt.sel .spq-radio{background:var(--accent);border-color:var(--accent);color:var(--bg)}
.spq-opt.sel .spq-radio svg{opacity:1}
.spq button.spq-gender{flex-direction:column;justify-content:center;padding:22px 10px;text-align:center}
.spq button.spq-gender:hover{transform:translateY(-3px)}
.spq-opts.g2 .spq-opt{justify-content:center;text-align:center}.spq-opts.g2 .spq-radio{display:none}

/* تحلیل */
.spq-think{min-height:65vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center}
.spq-think .spq-sig{width:min(78vw,380px)}
.spq-think p{font-size:20px;font-weight:200;animation:spq-up .5s both}

/* نتیجه */
.spq-banner{margin:6px 0 18px;padding:14px 18px;border:1px solid var(--line);border-radius:16px;display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;font-size:15px}
.spq-rtop{margin-bottom:8px}
.spq-rhero{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(16px,4vw,56px);align-items:center;padding-bottom:18px;border-bottom:1px solid var(--line)}
.spq-rtitle small{display:block;font-size:14px;color:var(--muted)}
.spq-rtitle h1{font-size:clamp(40px,7vw,72px);font-weight:200;line-height:1.35;color:var(--accent);animation:spq-up .8s .3s both}
.spq-tag{font-size:19px;animation:spq-up .8s .45s both}
.spq-chips{margin-top:18px;display:flex;flex-wrap:wrap;gap:8px}
.spq-chips li{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:3px 14px;font-size:13px}
.spq-chips svg{width:15px;height:15px;color:var(--accent)}
.spq-rare{margin-top:10px;font-size:13.5px;color:var(--muted)}
.spq-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px clamp(24px,5vw,64px);padding-top:30px}
.spq-s.wide{grid-column:1/-1}
.spq-s>*{animation:spq-up .7s both}
.spq-s h2{font-size:14px;font-weight:500;color:var(--muted);margin-bottom:14px;letter-spacing:.02em}
.spq-s h2.gap{margin-top:30px}
.spq-desc{font-size:21px;line-height:2;font-weight:300}
.spq-sub2{margin-top:10px;color:var(--muted);font-size:15.5px}
.spq-tip{margin-top:16px;display:flex;gap:10px;align-items:flex-start;padding:14px 16px;border:1px solid var(--line);border-radius:14px;font-size:15px}
.spq-tip svg{color:var(--accent);margin-top:5px}
.spq-axes{display:flex;flex-direction:column;gap:14px}
.ax-h{display:flex;justify-content:space-between;font-size:14px}.ax-h em{font-style:normal;color:var(--accent)}
.ax-t{position:relative;height:4px;background:var(--line);border-radius:4px;margin:8px 0 5px;direction:ltr}
.ax-t u{position:absolute;left:50%;top:-4px;width:1px;height:12px;background:var(--line)}
.ax-t i{position:absolute;top:0;height:100%;left:50%;width:0;background:var(--accent);border-radius:4px;transition:left 1.1s cubic-bezier(.2,.8,.2,1),width 1.1s cubic-bezier(.2,.8,.2,1)}
.ax-t s{position:absolute;top:-4px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:var(--accent);border:2px solid var(--bg)}
.ax-l{display:flex;justify-content:space-between;font-size:11.5px;color:var(--muted);direction:ltr}.ax-l span{direction:rtl}
.spq-kit{display:grid;grid-template-columns:1fr;gap:10px}
.spq-kit li{display:flex;gap:14px;align-items:center;border:1px solid var(--line);border-radius:16px;padding:12px 16px}
.spq-kit svg{width:26px;height:26px;color:var(--accent);stroke-width:1.4}
.spq-kit small{display:block;font-size:12px;color:var(--muted);line-height:1.5}.spq-kit span{font-size:15px;line-height:1.7}
.spq-pal{display:flex;gap:16px;flex-wrap:wrap}
.spq-pal li{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.spq-pal i{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);display:block}
.spq-iran{font-size:15.5px;line-height:2}
.spq-mix li button{display:flex;width:100%;justify-content:space-between;font-size:15px;padding:2px 0}
.spq-mix em{font-style:normal;color:var(--muted)}
.spq-mix .t{height:3px;background:var(--line);border-radius:3px;margin-bottom:12px;overflow:hidden}
.spq-mix .t i{display:block;height:100%;width:var(--w);background:var(--accent);margin-right:0;margin-left:auto}
.spq-opp{margin-top:8px;display:flex;align-items:center;gap:10px;font-size:14.5px;color:var(--muted)}
.spq-opp button{color:var(--ink);font-weight:400}
.spq-share{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.spq-share+.spq-toast+.spq-share{margin-top:14px}
.spq-toast{margin:10px 0 0;font-size:14px;color:var(--accent);min-height:1.9em;word-break:break-all}

@media (max-width:780px){
  .spq-hero h1{font-size:clamp(26px,7vw,40px)}
  .spq-hero{grid-template-columns:1fr;min-height:0}.spq-hero .spq-hart{order:-1}.spq-hero .spq-sig{width:min(78vw,300px)}
  .spq-rhero,.spq-grid{grid-template-columns:1fr}.spq-rhero .spq-sig{width:min(80vw,320px)}
  .spq-opts.g3{gap:8px}
  .spq-share .spq-btn{flex:1 1 44%}
}
@media (prefers-reduced-motion:reduce){.spq *{animation:none!important;transition:none!important}}
.spq [tabindex="-1"]:focus,.spq [tabindex="-1"]:focus-visible{outline:none}

/* فونت انتخاب‌شده در پنل روی همه‌ی متن‌ها */
.spq,.spq *,.spq button,.spq summary{font-family:var(--spq-font,Vazirmatn,Tahoma,sans-serif)!important}

.spq-opts.multi .spq-radio{border-radius:7px}
.spq button.spq-next{margin-top:18px}
.spq button.spq-next[disabled]{opacity:.35;cursor:not-allowed;transform:none}

.spq-hint{margin:-12px 0 20px;font-size:14px;color:var(--muted)}

@property --accent-day{syntax:'<color>';inherits:true;initial-value:#3F6B66}
@property --accent-night{syntax:'<color>';inherits:true;initial-value:#8FCBC2}
@property --fx1{syntax:'<color>';inherits:true;initial-value:#8FCBC2}
@property --fx2{syntax:'<color>';inherits:true;initial-value:#C9A2FF}
.spq{transition:background .4s,color .4s,--accent-day .8s,--accent-night .8s}
.spq-glow{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(60% 42% at 50% 0%,color-mix(in srgb,var(--accent) 17%,transparent),transparent 72%)}

/* کلمه‌ی «استایل» در تیتر */
.spq-fx{position:relative;display:inline-block;font-weight:800;padding:0 .08em;transform:rotate(-2.5deg);transition:--fx1 1.4s,--fx2 1.4s;
  background:linear-gradient(100deg,var(--fx1),var(--fx2),var(--fx1));background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent;animation:spq-shine 6s linear infinite}
.spq-fx::after{content:"";position:absolute;right:0;left:0;bottom:-.04em;height:.2em;background:linear-gradient(90deg,var(--fx2),var(--fx1));
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8 C20 2 34 12 52 6 S88 3 118 7' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8 C20 2 34 12 52 6 S88 3 118 7' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  clip-path:inset(0 0 0 100%);animation:spq-draw 1s .7s cubic-bezier(.2,.8,.2,1) forwards}
.spq-fx::before{content:"✦";position:absolute;top:-.28em;left:-.2em;font-size:.38em;color:var(--fx2);-webkit-text-fill-color:var(--fx2);animation:spq-twinkle 2.6s ease-in-out infinite}
@keyframes spq-shine{to{background-position:-220% 0}}
@keyframes spq-draw{to{clip-path:inset(0 0 0 0)}}
@keyframes spq-twinkle{0%,100%{opacity:.25;transform:scale(.7) rotate(0)}50%{opacity:1;transform:scale(1.15) rotate(25deg)}}

/* قد و وزن */
.spq-body{display:flex;flex-direction:column;gap:26px;margin:8px 0 26px}
.spq-sl-h{display:flex;justify-content:space-between;align-items:center;font-size:15px;margin-bottom:10px}
.spq-sl-v{display:flex;align-items:center;gap:10px}.spq-sl-v b{font-size:30px;font-weight:300;min-width:2.4em;text-align:center;color:var(--accent)}
.spq-sl-v small{color:var(--muted);font-size:13px}
.spq button.spq-step{width:34px;height:34px;border:1px solid var(--line);border-radius:50%;font-size:18px;line-height:1;display:grid;place-items:center;color:var(--ink);transition:border-color .2s}
.spq button.spq-step:hover{border-color:var(--ink)}
.spq-sl input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:6px;direction:ltr;outline:none;cursor:pointer;
  background:linear-gradient(90deg,var(--accent) var(--p,50%),var(--line) var(--p,50%))}
.spq-sl input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:var(--accent);border:3px solid var(--bg);box-shadow:0 0 0 1px var(--accent)}
.spq-sl input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--accent);border:3px solid var(--bg);box-shadow:0 0 0 1px var(--accent)}
.spq-bact{display:flex;gap:10px;flex-wrap:wrap}

/* نقشه‌ی استایل */
.spq-s.wide .spq-axes{display:grid;grid-template-columns:1fr 1fr;gap:26px clamp(24px,5vw,64px)}
.ax-x{margin-top:8px;font-size:14px;line-height:1.9;color:var(--muted)}
.ax-h b{font-weight:500}.ax-h em{display:inline-flex;align-items:center;gap:6px}.ax-h em svg{width:15px;height:15px}
.ax-t i{transition:left 1.3s var(--d,0ms) cubic-bezier(.2,.8,.2,1),width 1.3s var(--d,0ms) cubic-bezier(.2,.8,.2,1);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 55%,transparent)}
.ax-t s{left:50%;transition:left 1.3s var(--d,0ms) cubic-bezier(.2,.8,.2,1)}
.ax-t s.on::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid var(--accent);animation:spq-ping 2.2s ease-out infinite}
@keyframes spq-ping{from{transform:scale(.6);opacity:.9}to{transform:scale(1.8);opacity:0}}
.ax.lock .ax-h{color:var(--muted)}
.ax-t.fake{overflow:hidden;background:var(--line)}
.ax-t.fake i{position:absolute;left:-40%;width:40%;background:linear-gradient(90deg,transparent,var(--accent),transparent);box-shadow:none;transition:none;animation:spq-sweep 2s linear infinite;opacity:.55}
@keyframes spq-sweep{to{left:100%}}
.blur{filter:blur(5px);user-select:none;pointer-events:none}

/* قفل و نتیجه‌ی کامل */
.spq-unlock{border:1px solid var(--line);border-radius:20px;padding:22px clamp(16px,3vw,28px);background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 10%,transparent),transparent 60%)}
.ul-h{display:flex;gap:16px;align-items:flex-start}.ul-h svg{color:var(--accent);margin-top:6px}
.spq-unlock h2{font-size:18px;font-weight:500;color:var(--ink);margin-bottom:6px}.ul-h p{font-size:15px;color:var(--muted);line-height:1.95}
.ul-act{margin-top:16px}.ul-act:empty{display:none}
.ul-code{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.ul-code input{flex:1 1 220px;min-height:48px;border:1px solid var(--line);border-radius:14px;background:transparent;color:var(--ink);padding:0 16px;font:inherit;font-size:15px;text-align:left}
.ul-code input:focus{outline:2px solid var(--accent);outline-offset:2px}
.ul-msg{margin-top:8px;font-size:13.5px;color:var(--accent);min-height:1.6em}
.spq-kit li.prem{align-items:flex-start}.spq-kit li.prem svg{margin-top:6px}
.spq-kit li.prem>div{flex:1}
.spq-kit li.lock{position:relative;align-items:center}.spq-kit li.lock svg.lk{margin-inline-start:auto;color:var(--muted);width:20px;height:20px}
.spq-kit .pk{margin:0 0 8px}.spq-kit .pk:last-child{margin-bottom:0}
.spq-kit .pk b{display:block;font-weight:500;font-size:15px;line-height:1.7;direction:rtl}
.spq-kit .pk span{display:block;font-size:13.5px;color:var(--muted);line-height:1.8}
.spq-pal li.lock i{display:grid;place-items:center;background:var(--soft);border-style:dashed}.spq-pal li.lock i svg{width:20px;height:20px;color:var(--muted)}
.spq-chips.fit{margin:0 0 12px}.spq-iran.gapp{margin-top:8px}

@media (max-width:780px){.spq-s.wide .spq-axes{grid-template-columns:1fr}}