/* v266 · سطح اتاق: نشان «تاج‌گوهر» بالای لایو + شیت روشن «مسیر سطح‌ها» */

/* ═══ نشان بالای اتاق ═══ */
html body #lv126.v266{ height:30px; gap:5px; padding:0 11px 0 2px; border:0; direction:inherit;
  background:linear-gradient(115deg,rgba(46,16,80,.72),color-mix(in srgb,var(--b) 55%,rgba(46,16,80,.7))) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22), inset 0 1px 0 rgba(255,255,255,.25), 0 6px 16px -6px color-mix(in srgb,var(--a) 70%,transparent) !important;
  -webkit-backdrop-filter:blur(10px) saturate(1.3); backdrop-filter:blur(10px) saturate(1.3); position:relative; overflow:hidden; isolation:isolate }
[dir=rtl] html body #lv126.v266, html[dir=rtl] body #lv126.v266{ padding:0 2px 0 11px }
html body #lv126.v266::after{ content:""; position:absolute; z-index:-1; top:0; bottom:0; width:38%; left:-60%; transform:skewX(-20deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),transparent); animation:sh266 3.8s ease-in-out infinite }
@keyframes sh266{ 0%,55%{ left:-60% } 90%,100%{ left:130% } }
html body #lv126.v266 .lv126-e{ width:28px; height:28px }
html body #lv126.v266 .lv126-ring{ inset:-1px; width:30px; height:30px }
html body #lv126.v266 .lv126-ring .bg{ stroke:rgba(255,255,255,.18) }
html body #lv126.v266 .gm266{ filter:drop-shadow(0 1px 3px rgba(0,0,0,.35)) }
.lt266{ display:flex; flex-direction:column; line-height:1; gap:1px }
.lt266 small{ font-size:7.5px; font-weight:800; letter-spacing:.4px; text-transform:uppercase; color:rgba(255,255,255,.72) }
html body #lv126.v266 .lt266 b{ font-size:12.5px; font-weight:900; color:#fff; text-shadow:0 1px 3px rgba(20,6,40,.45) }
html body #lv126.v266.max{ box-shadow:0 0 0 1.5px #FFE9A8, 0 0 18px rgba(200,120,255,.6) !important }

/* ═══ شیت ═══ */
.rl266{ position:fixed; inset:0; z-index:2147482500; display:flex; align-items:flex-end; justify-content:center; background:rgba(46,16,101,0); transition:background .25s; font-family:inherit }
.rl266.in{ background:rgba(46,16,101,.24) } .rl266.out{ background:rgba(46,16,101,0) }
.rl266 button{ font-family:inherit }
.pn266{ position:relative; width:100%; max-width:480px; max-height:86vh; display:flex; flex-direction:column; overflow:hidden; color:#2E1065;
  border-radius:28px 28px 0 0; background:linear-gradient(180deg,#FBF7FF 0%,#FFFFFF 40%,#FFF9F2 100%);
  box-shadow:0 -18px 44px -14px rgba(139,92,246,.45), inset 0 1px 0 #fff; transform:translateY(100%); transition:transform .38s cubic-bezier(.2,.9,.3,1.05) }
.rl266.in .pn266{ transform:none } .rl266.out .pn266{ transform:translateY(100%) }
@media (min-width:600px){ .rl266:not(.dk266) .pn266{ border-radius:28px; margin-bottom:20px } }
.o266{ position:absolute; border-radius:50%; filter:blur(44px); pointer-events:none }
.o266.a{ width:240px; height:240px; top:-80px; inset-inline-start:-70px; background:rgba(255,122,182,.32) }
.o266.b{ width:260px; height:240px; top:40px; inset-inline-end:-100px; background:rgba(167,139,250,.38) }
.gr266{ position:relative; display:block; width:42px; height:5px; margin:10px auto 0; border-radius:99px; background:#E4D6FF; z-index:1 }
.xx266{ position:absolute; z-index:3; top:14px; inset-inline-end:14px; width:36px; height:36px; border:0; border-radius:12px; display:grid; place-items:center; cursor:pointer;
  color:#6D28D9; background:#fff; box-shadow:0 4px 12px -6px rgba(139,92,246,.45), inset 0 0 0 1.5px #EDE4FD }
.xx266 svg{ width:18px; height:18px }
.bd266{ position:relative; z-index:1; flex:1; overflow-y:auto; padding:0 14px 14px; scrollbar-width:none }
.bd266::-webkit-scrollbar{ display:none }

/* قهرمان */
.hr266{ position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; padding:8px 4px 4px }
.ry266{ position:absolute; top:-30px; left:50%; width:280px; height:280px; transform:translateX(-50%); pointer-events:none; opacity:.6;
  background:repeating-conic-gradient(from 0deg,var(--h) 0deg 8deg,transparent 8deg 24deg);
  -webkit-mask:radial-gradient(closest-side,#000 18%,transparent 70%); mask:radial-gradient(closest-side,#000 18%,transparent 70%); animation:ry266 36s linear infinite }
@keyframes ry266{ to{ transform:translateX(-50%) rotate(360deg) } }
.em266{ position:relative; width:96px; height:96px; display:grid; place-items:center; margin-top:8px; animation:fl266 3.2s ease-in-out infinite }
.em266::before{ content:""; position:absolute; inset:6px; border-radius:50%; background:radial-gradient(closest-side,color-mix(in srgb,var(--a) 55%,transparent),transparent); filter:blur(6px) }
.em266 svg{ position:relative; filter:drop-shadow(0 12px 18px color-mix(in srgb,var(--b) 50%,transparent)) }
@keyframes fl266{ 50%{ transform:translateY(-5px) } }
.kk266{ margin-top:6px; font-size:10.5px; font-weight:900; letter-spacing:.6px; text-transform:uppercase; color:var(--b) }
.hr266 > b{ font-size:22px; font-weight:900; line-height:1.25; background:linear-gradient(90deg,var(--b),var(--a) 50%,#C026D3); -webkit-background-clip:text; background-clip:text; color:transparent }
.hr266 > p{ margin:2px 0 0; font-size:12.5px; font-weight:700; color:#7C6A9E }
.hr266 > p strong{ color:var(--b); font-weight:900 }
.tr266{ width:100%; max-width:340px; margin-top:12px }
.tb266{ position:relative; display:block; height:10px; border-radius:99px; background:#EFE7FB; box-shadow:inset 0 1px 2px rgba(91,33,182,.12) }
.tb266 > i:first-child{ position:absolute; inset-block:0; inset-inline-start:0; display:block; border-radius:inherit; background:linear-gradient(90deg,#FF9A62,#FF5EA8,#A855F7); box-shadow:0 0 10px rgba(255,94,168,.5); animation:bw266 1s cubic-bezier(.2,.9,.3,1) both }
@keyframes bw266{ from{ width:0 } }
.tb266 > i:not(:first-child){ position:absolute; top:-2px; width:3px; height:14px; margin-inline-start:-1.5px; border-radius:2px; background:#fff; box-shadow:0 0 0 1px #E4D6FF }
.tn266{ display:flex; justify-content:space-between; margin-top:4px; font-size:10.5px; font-weight:800; color:#9C8CBE }
.ch266{ display:grid; grid-template-columns:1fr 1fr; gap:8px; width:100%; margin-top:12px }
.ch266 span{ display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:8px; align-items:center; padding:9px 10px; border-radius:16px; text-align:start;
  background:#fff; box-shadow:0 8px 18px -14px rgba(91,33,182,.6), inset 0 0 0 1.5px #F1E9FD }
.ch266 svg{ grid-row:1/3; width:28px; height:28px; padding:5px; border-radius:10px; background:#F5F0FF; color:#A855F7 }
.ch266 span:first-child svg{ background:#E9F8FF }
.ch266 b{ font-size:15px; font-weight:900; color:#2E1065 } .ch266 small{ font-size:10.5px; font-weight:700; color:#8E7DB3 }
.dm266{ width:15px; height:15px; vertical-align:-2px }

/* راهنما */
.tp266{ display:flex; gap:10px; align-items:flex-start; margin:12px 0 4px; padding:11px 12px; border-radius:16px; font-size:11.5px; font-weight:700; line-height:1.8; color:#6B5A8E;
  background:linear-gradient(120deg,#FFF6E9,#FFF0F7); box-shadow:inset 0 0 0 1.5px #FBE3D2 }
.tp266 svg{ flex:none; width:26px; height:26px; padding:5px; border-radius:9px; color:#fff; background:linear-gradient(135deg,#FF7AB6,#A855F7) }

/* مسیر سطح‌ها */
.pt266{ position:relative; display:flex; flex-direction:column; gap:8px; margin-top:10px; padding-inline-start:4px }
.pt266::before{ content:""; position:absolute; top:28px; bottom:28px; inset-inline-start:30px; width:3px; border-radius:3px; background:linear-gradient(180deg,#FFB98F,#8BE9F5,#FFD970,#FF9CCB,#D2A8FF); opacity:.5 }
.st266{ position:relative; display:flex; align-items:center; gap:12px; padding:9px 12px 9px 8px; border-radius:18px; background:#fff;
  box-shadow:0 8px 18px -16px rgba(91,33,182,.55), inset 0 0 0 1.5px #F1E9FD; animation:si266 .4s cubic-bezier(.2,.9,.3,1.1) both; animation-delay:var(--d) }
[dir=rtl] .st266{ padding:9px 8px 9px 12px }
@keyframes si266{ from{ opacity:0; transform:translateY(10px) } }
.st266.got{ background:linear-gradient(110deg,var(--l),#fff 70%); box-shadow:0 10px 20px -16px var(--b), inset 0 0 0 1.5px color-mix(in srgb,var(--a) 35%,#fff) }
.st266.nx{ background:#fff; box-shadow:0 0 0 2px var(--a), 0 12px 24px -14px var(--b) }
.st266.lk .nd266 svg{ filter:grayscale(.55) opacity(.75) }
.nd266{ position:relative; flex:none; width:46px; height:46px }
.st266.nx .nd266{ animation:pu266 2s ease-in-out infinite }
@keyframes pu266{ 50%{ transform:scale(1.07) } }
.ok266, .lc266{ position:absolute; bottom:-3px; inset-inline-end:-3px; width:18px; height:18px; border-radius:50%; display:grid; place-items:center; border:2px solid #fff }
.ok266{ background:#10B981; color:#fff } .lc266{ background:#EDE7F8; color:#8E7DB3 }
.ok266 svg, .lc266 svg{ width:10px; height:10px }
.sx266{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px }
.sx266 b{ font-size:14px; font-weight:900; color:#2E1065 }
.sx266 b em{ font-style:normal; font-size:10.5px; font-weight:900; padding:1px 7px; border-radius:99px; color:var(--b); background:var(--l); vertical-align:1px }
.sx266 small{ font-size:11px; font-weight:700; color:#8E7DB3 }
.pb266{ display:block; height:6px; margin-top:3px; border-radius:99px; background:#F1EAFC; overflow:hidden }
.pb266 i{ display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--l),var(--a),var(--b)); animation:bw266 .9s cubic-bezier(.2,.9,.3,1) both }
.nt266{ color:var(--b) !important; font-weight:900 !important }
.rw266{ flex:none; display:flex; flex-direction:column; align-items:flex-end; gap:2px }
.rw266 b{ display:flex; align-items:center; gap:3px; font-size:14px; font-weight:900; color:var(--b); direction:ltr }
.rw266 small{ font-size:10px; font-weight:800; color:#9C8CBE }
.st266.got .rw266 small{ color:#059669 }
.ft266{ position:relative; z-index:2; padding:10px 14px calc(12px + env(safe-area-inset-bottom)); background:linear-gradient(180deg,rgba(255,249,242,0),#FFF9F2 30%) }
.gb266{ width:100%; height:48px; border:0; border-radius:16px; display:flex; align-items:center; justify-content:center; gap:8px; cursor:pointer; color:#fff; font-size:14px; font-weight:900;
  background:linear-gradient(120deg,#FF5EA8,#C026D3 55%,#7C3AED); box-shadow:0 12px 24px -12px rgba(192,38,211,.9), inset 0 1px 0 rgba(255,255,255,.35) }
.gb266 svg{ width:20px; height:20px }
@media (prefers-reduced-motion:reduce){ .rl266 *, html body #lv126.v266::after{ animation:none !important } .pn266{ transition:none } }
.ic267{ object-fit:contain; border-radius:12px }
