/* GENERATED by tools/build_design_css.py from the design files. Do not edit by hand. */

/* ===== Main.dc.html  (scope .s-main) ===== */
.s-main a{color:#B9A8FF}
.s-main a:hover{color:#D9D0FF}
.app.s-main{position:relative;width:390px;height:844px;overflow:hidden;font-family:'Rubik',system-ui,sans-serif;color:#F3F1FB;background:radial-gradient(520px 380px at 85% -8%,rgba(124,92,255,.34),transparent 62%),radial-gradient(420px 360px at -12% 40%,rgba(54,226,196,.13),transparent 60%),#07070F}
.app.s-main::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.06) 1px,transparent 1px);background-size:22px 22px;-webkit-mask-image:linear-gradient(180deg,#000,transparent 70%);mask-image:linear-gradient(180deg,#000,transparent 70%);pointer-events:none}
.s-main .disp{font-family:'Unbounded','Rubik',system-ui,sans-serif}
.s-main .he{font-family:'Rubik',system-ui,sans-serif;direction:rtl}
.s-main .en{direction:ltr;unicode-bidi:isolate}
.app.s-main[dir=rtl] .flip{transform:scaleX(-1)}
.s-main .ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.s-main .grad{background:linear-gradient(90deg,#A890FF,#36E2C4);-webkit-background-clip:text;background-clip:text;color:transparent}
.s-main .chip{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:#F3F1FB;font:500 13px 'Rubik',system-ui,sans-serif;text-decoration:none;box-sizing:border-box}
.s-main .chip:hover{background:rgba(255,255,255,.1);color:#fff}
.s-main .lang{display:inline-flex;align-items:center;gap:2px;height:44px;padding:4px;box-sizing:border-box;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);cursor:pointer;flex:none}
.s-main .lang span{min-width:34px;height:34px;padding:0 4px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-radius:999px;font:600 12px 'Rubik',system-ui,sans-serif;color:#9C98B8;transition:background .3s,color .3s}
.s-main .lang span.on{background:linear-gradient(135deg,#8C70FF,#6446F2);color:#fff;box-shadow:0 0 14px -2px rgba(124,92,255,.8)}
.s-main .glass{background:rgba(24,22,44,.66);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.s-main .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.s-main .field{flex:1;min-width:0;background:transparent;border:0;outline:0;color:#F3F1FB;font:400 17px 'Rubik',system-ui,sans-serif}
.s-main .field::placeholder{color:#8783A6}
.s-main .cta{display:flex;align-items:center;justify-content:center;gap:10px;height:54px;border-radius:18px;background:linear-gradient(135deg,#8C70FF,#6446F2);color:#fff;font:600 16px 'Rubik',system-ui,sans-serif;text-decoration:none;box-shadow:0 10px 30px -8px rgba(124,92,255,.8),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .2s}
.s-main .cta:hover{color:#fff;transform:translateY(-1px)}
.s-main .micbtn{width:44px;height:44px;border-radius:14px;display:flex;align-items:center;justify-content:center;color:#36E2C4;background:rgba(54,226,196,.1);border:1px solid rgba(54,226,196,.25);text-decoration:none;flex:none}
.s-main .tile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;height:170px;padding:16px;border-radius:24px;box-sizing:border-box;text-decoration:none;color:#F3F1FB;overflow:hidden;transition:transform .25s}
.s-main .tile:hover{transform:translateY(-3px);color:#F3F1FB}
.s-main .orb{position:absolute;border-radius:50%;animation:main-breathe 4s ease-in-out infinite}
.s-main .orb i{position:absolute;inset:0;border-radius:50%;filter:blur(6px)}
.s-main .orb i:nth-child(1){background:radial-gradient(circle at 30% 30%,#7C5CFF,transparent 62%);animation:main-spin 6s linear infinite}
.s-main .orb i:nth-child(2){background:radial-gradient(circle at 72% 42%,#36E2C4,transparent 58%);animation:main-spin 8s linear infinite reverse}
.s-main .orb i:nth-child(3){background:radial-gradient(circle at 45% 78%,#FF6FB5,transparent 58%);animation:main-spin 7s linear infinite}
.s-main .orb b{position:absolute;inset:22%;border-radius:50%;background:radial-gradient(circle at 40% 35%,rgba(255,255,255,.95),rgba(255,255,255,.12) 45%,transparent 70%)}
.s-main .vf{position:absolute;top:18px;inset-inline-end:18px;width:70px;height:70px}
.s-main .vf span{position:absolute;width:16px;height:16px;border-color:#36E2C4;border-style:solid;border-width:0}
.s-main .vf span:nth-child(1){top:0;left:0;border-top-width:2px;border-left-width:2px;border-top-left-radius:6px}
.s-main .vf span:nth-child(2){top:0;right:0;border-top-width:2px;border-right-width:2px;border-top-right-radius:6px}
.s-main .vf span:nth-child(3){bottom:0;left:0;border-bottom-width:2px;border-left-width:2px;border-bottom-left-radius:6px}
.s-main .vf span:nth-child(4){bottom:0;right:0;border-bottom-width:2px;border-right-width:2px;border-bottom-right-radius:6px}
.s-main .vf em{position:absolute;left:6px;right:6px;height:2px;top:8px;background:#36E2C4;box-shadow:0 0 12px 2px rgba(54,226,196,.8);border-radius:2px;animation:main-sweep 2.4s ease-in-out infinite}
.s-main .fade{-webkit-mask-image:linear-gradient(90deg,#000 80%,transparent);mask-image:linear-gradient(90deg,#000 80%,transparent)}
.app.s-main[dir=rtl] .fade{-webkit-mask-image:linear-gradient(270deg,#000 80%,transparent);mask-image:linear-gradient(270deg,#000 80%,transparent)}
.s-main .recent{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:14px;white-space:nowrap;text-decoration:none;color:#F3F1FB;font-size:14px}
.s-main .recent:hover{color:#fff;background:rgba(255,255,255,.08)}
.s-main .recent .he{color:#7FF0DA;font-weight:500}
.s-main .rise{animation:main-rise .8s cubic-bezier(.2,.8,.2,1) both}
.s-main .d1{animation-delay:.08s}
.s-main .d2{animation-delay:.16s}
.s-main .d3{animation-delay:.24s}
.s-main .d4{animation-delay:.32s}
.s-main .d5{animation-delay:.4s}
@keyframes main-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes main-spin{to{transform:rotate(360deg)}}
@keyframes main-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@keyframes main-sweep{0%,100%{top:8px}50%{top:60px}}
.s-main .nav{position:absolute;left:14px;right:14px;bottom:16px;height:70px;border-radius:26px;display:flex;align-items:center;justify-content:space-around;padding:0 4px;z-index:5;box-sizing:border-box}
.s-main .tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:58px;min-height:52px;color:#8E8AAB;text-decoration:none;font-size:11px;font-weight:500}
.s-main .tab:hover,.s-main .tab.on{color:#F3F1FB}
.s-main .tab.on .ic{color:#A890FF;filter:drop-shadow(0 0 8px rgba(160,139,255,.85))}
.s-main .navorb{position:relative;width:62px;height:62px;margin-top:-34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;text-decoration:none;box-shadow:0 0 0 6px #0A0A14,0 10px 34px rgba(124,92,255,.65)}
.s-main .navorb::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,#7C5CFF,#36E2C4,#FF6FB5,#7C5CFF);animation:main-spin 5s linear infinite}
.s-main .navorb::after{content:"";position:absolute;inset:3px;border-radius:50%;background:radial-gradient(circle at 35% 28%,#3A2F78,#100E22 72%)}
.s-main .navorb .ic{position:relative;z-index:1;width:24px;height:24px}
.s-main .navorb:hover{color:#fff}

/* ===== Listening.dc.html  (scope .s-live) ===== */
.s-live a{color:#B9A8FF}
.s-live a:hover{color:#D9D0FF}
.app.s-live{position:relative;width:390px;height:844px;overflow:hidden;font-family:'Rubik',system-ui,sans-serif;color:#F3F1FB;background:radial-gradient(460px 460px at 50% 40%,rgba(124,92,255,.32),transparent 65%),radial-gradient(300px 260px at 20% 80%,rgba(54,226,196,.12),transparent 60%),#05050C}
.s-live .disp{font-family:'Unbounded','Rubik',system-ui,sans-serif}
.s-live .he{font-family:'Rubik',system-ui,sans-serif;direction:rtl}
.s-live .en{direction:ltr;unicode-bidi:isolate}
.s-live .ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.s-live .grad{background:linear-gradient(90deg,#A890FF,#36E2C4);-webkit-background-clip:text;background-clip:text;color:transparent}
.s-live .glass{background:rgba(24,22,44,.66);border:1px solid rgba(255,255,255,.09);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.s-live .lang{display:inline-flex;align-items:center;gap:2px;height:44px;padding:4px;box-sizing:border-box;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);cursor:pointer;flex:none}
.s-live .lang span{min-width:34px;height:34px;padding:0 4px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-radius:999px;font:600 12px 'Rubik',system-ui,sans-serif;color:#9C98B8;transition:background .3s,color .3s}
.s-live .lang span.on{background:linear-gradient(135deg,#8C70FF,#6446F2);color:#fff;box-shadow:0 0 14px -2px rgba(124,92,255,.8)}
.s-live .round{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#F3F1FB;text-decoration:none}
.s-live .round:hover{color:#fff;background:rgba(255,255,255,.12)}
.s-live .stage{position:relative;width:250px;height:250px}
.s-live .ring{position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(160,139,255,.55);animation:live-ping 3.2s cubic-bezier(.2,.6,.3,1) infinite}
.s-live .ring:nth-child(2){animation-delay:1.06s;border-color:rgba(54,226,196,.45)}
.s-live .ring:nth-child(3){animation-delay:2.12s;border-color:rgba(255,111,181,.4)}
.s-live .orb{position:absolute;inset:20px;border-radius:50%;animation:live-breathe 2.6s ease-in-out infinite}
.s-live .orb i{position:absolute;inset:0;border-radius:50%;filter:blur(14px)}
.s-live .orb i:nth-child(1){background:radial-gradient(circle at 30% 30%,#7C5CFF,transparent 62%);animation:live-spin 5s linear infinite}
.s-live .orb i:nth-child(2){background:radial-gradient(circle at 72% 42%,#36E2C4,transparent 58%);animation:live-spin 7s linear infinite reverse}
.s-live .orb i:nth-child(3){background:radial-gradient(circle at 45% 78%,#FF6FB5,transparent 58%);animation:live-spin 6s linear infinite}
.s-live .orb i:nth-child(4){inset:10%;background:radial-gradient(circle at 60% 30%,#5B8CFF,transparent 60%);animation:live-spin 9s linear infinite reverse}
.s-live .orb b{position:absolute;inset:26%;border-radius:50%;background:radial-gradient(circle at 40% 35%,rgba(255,255,255,.95),rgba(255,255,255,.18) 45%,transparent 72%);filter:blur(3px)}
.s-live .wave{display:flex;align-items:center;justify-content:center;gap:4px;height:46px}
.s-live .wave i{display:block;width:4px;height:100%;border-radius:4px;background:linear-gradient(#A890FF,#36E2C4);animation:live-eq 1.1s ease-in-out infinite}
.s-live .wave i:nth-child(2n){animation-duration:.85s}
.s-live .wave i:nth-child(3n){animation-duration:1.35s;animation-delay:-.4s}
.s-live .wave i:nth-child(4n+1){animation-delay:-.2s}
.s-live .wave i:nth-child(5n){animation-delay:-.7s}
.s-live .wave i:nth-child(1),.s-live .wave i:nth-child(22){opacity:.4}
.s-live .wave i:nth-child(2),.s-live .wave i:nth-child(21){opacity:.65}
.s-live .live{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:999px;font-size:13px;font-weight:500;color:#D7D3EE}
.s-live .live em{width:8px;height:8px;border-radius:50%;background:#36E2C4;box-shadow:0 0 10px #36E2C4;animation:live-blink 1.4s ease-in-out infinite}
.s-live .caret{display:inline-block;width:3px;height:30px;margin-left:4px;vertical-align:-4px;background:#36E2C4;border-radius:2px;animation:live-blink 1s steps(2) infinite}
.s-live .peek{position:absolute;left:16px;right:16px;bottom:112px;border-radius:24px;padding:16px;display:flex;align-items:center;gap:14px;text-decoration:none;color:#F3F1FB;animation:live-peek .9s 1.2s cubic-bezier(.2,.9,.25,1.2) both;box-shadow:0 20px 50px -10px rgba(0,0,0,.7),0 0 0 1px rgba(160,139,255,.25)}
.s-live .peek:hover{color:#fff}
.s-live .stop{position:absolute;left:20px;right:20px;bottom:32px;height:56px;border-radius:18px;display:flex;align-items:center;justify-content:center;gap:10px;font:600 16px 'Rubik',system-ui,sans-serif;color:#F3F1FB;text-decoration:none;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14)}
.s-live .stop:hover{color:#fff;background:rgba(255,255,255,.1)}
.s-live .rise{animation:live-rise .8s cubic-bezier(.2,.8,.2,1) both}
.s-live .d1{animation-delay:.1s}
.s-live .d2{animation-delay:.25s}
.s-live .d3{animation-delay:.4s}
@keyframes live-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes live-peek{from{opacity:0;transform:translateY(60px) scale(.96)}to{opacity:1;transform:none}}
@keyframes live-spin{to{transform:rotate(360deg)}}
@keyframes live-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
@keyframes live-ping{from{transform:scale(.85);opacity:.9}to{transform:scale(1.75);opacity:0}}
@keyframes live-eq{0%,100%{transform:scaleY(.18)}50%{transform:scaleY(1)}}
@keyframes live-blink{0%,100%{opacity:1}50%{opacity:.25}}

/* ===== Result.dc.html  (scope .s-result) ===== */
.s-result a{color:#B9A8FF}
.s-result a:hover{color:#D9D0FF}
.app.s-result{position:relative;width:390px;height:844px;overflow:hidden;font-family:'Rubik',system-ui,sans-serif;color:#F3F1FB;background:radial-gradient(520px 360px at 20% -6%,rgba(124,92,255,.36),transparent 62%),radial-gradient(420px 360px at 110% 40%,rgba(54,226,196,.14),transparent 60%),#07070F}
.app.s-result::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.06) 1px,transparent 1px);background-size:22px 22px;-webkit-mask-image:linear-gradient(180deg,#000,transparent 60%);mask-image:linear-gradient(180deg,#000,transparent 60%);pointer-events:none}
.s-result .disp{font-family:'Unbounded','Rubik',system-ui,sans-serif}
.s-result .he{font-family:'Rubik',system-ui,sans-serif;direction:rtl}
.s-result .en{direction:ltr;unicode-bidi:isolate}
.app.s-result[dir=rtl] .flip{transform:scaleX(-1)}
.s-result .ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.s-result .glass{background:rgba(24,22,44,.66);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.s-result .lang{display:inline-flex;align-items:center;gap:2px;height:44px;padding:4px;box-sizing:border-box;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);cursor:pointer;flex:none}
.s-result .lang span{min-width:34px;height:34px;padding:0 4px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-radius:999px;font:600 12px 'Rubik',system-ui,sans-serif;color:#9C98B8;transition:background .3s,color .3s}
.s-result .lang span.on{background:linear-gradient(135deg,#8C70FF,#6446F2);color:#fff;box-shadow:0 0 14px -2px rgba(124,92,255,.8)}
.s-result .round{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#F3F1FB;text-decoration:none;flex:none}
.s-result .round:hover{color:#fff;background:rgba(255,255,255,.12)}
.s-result .speak{position:relative;width:56px;height:56px;border-radius:50%;border:0;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;background:linear-gradient(135deg,#8C70FF,#6446F2);box-shadow:0 10px 30px -6px rgba(124,92,255,.8);flex:none}
.s-result .speak::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1.5px solid rgba(160,139,255,.6);animation:result-ping 2.2s ease-out infinite}
.s-result .saved{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:999px;background:rgba(54,226,196,.12);border:1px solid rgba(54,226,196,.35);color:#7FF0DA;font-size:13px;font-weight:600;white-space:nowrap;animation:result-pop .6s .9s cubic-bezier(.2,1.4,.4,1) both}
.s-result .hecard{position:relative;border-radius:26px;padding:20px 22px;overflow:hidden;background:linear-gradient(135deg,rgba(54,226,196,.16),rgba(124,92,255,.14));border:1px solid rgba(127,240,218,.28)}
.s-result .hecard::after{content:"";position:absolute;top:0;bottom:0;width:60%;left:-70%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.14),transparent);animation:result-shine 3.6s 1.2s ease-in-out infinite}
.s-result .pill{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;background:rgba(160,139,255,.16);color:#CFC4FF;font-size:12px;font-weight:600;letter-spacing:.04em}
.s-result .mini{width:44px;height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:#CFC4FF;display:flex;align-items:center;justify-content:center;cursor:pointer;flex:none}
.s-result .btn{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;height:54px;border-radius:18px;font:600 15px 'Rubik',system-ui,sans-serif;text-decoration:none}
.s-result .btn.pri{color:#fff;background:linear-gradient(135deg,#8C70FF,#6446F2);box-shadow:0 10px 30px -8px rgba(124,92,255,.8),inset 0 1px 0 rgba(255,255,255,.25)}
.s-result .btn.sec{color:#F3F1FB;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
.s-result .btn:hover{color:#fff}
.s-result .rise{animation:result-rise .8s cubic-bezier(.2,.8,.2,1) both}
.s-result .d1{animation-delay:.1s}
.s-result .d2{animation-delay:.22s}
.s-result .d3{animation-delay:.34s}
.s-result .d4{animation-delay:.46s}
.s-result .word{animation:result-land 1s cubic-bezier(.2,.9,.25,1) both;text-shadow:0 0 40px rgba(160,139,255,.55)}
@keyframes result-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes result-land{from{opacity:0;letter-spacing:.3em;filter:blur(10px)}to{opacity:1;letter-spacing:-.03em;filter:blur(0)}}
@keyframes result-pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes result-ping{from{transform:scale(.9);opacity:.9}to{transform:scale(1.5);opacity:0}}
@keyframes result-shine{0%{left:-70%}55%,100%{left:120%}}
@keyframes result-spin{to{transform:rotate(360deg)}}
.s-result .nav{position:absolute;left:14px;right:14px;bottom:16px;height:70px;border-radius:26px;display:flex;align-items:center;justify-content:space-around;padding:0 4px;z-index:5;box-sizing:border-box}
.s-result .tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:58px;min-height:52px;color:#8E8AAB;text-decoration:none;font-size:11px;font-weight:500}
.s-result .tab:hover,.s-result .tab.on{color:#F3F1FB}
.s-result .tab.on .ic{color:#A890FF;filter:drop-shadow(0 0 8px rgba(160,139,255,.85))}
.s-result .navorb{position:relative;width:62px;height:62px;margin-top:-34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;text-decoration:none;box-shadow:0 0 0 6px #0A0A14,0 10px 34px rgba(124,92,255,.65)}
.s-result .navorb::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,#7C5CFF,#36E2C4,#FF6FB5,#7C5CFF);animation:result-spin 5s linear infinite}
.s-result .navorb::after{content:"";position:absolute;inset:3px;border-radius:50%;background:radial-gradient(circle at 35% 28%,#3A2F78,#100E22 72%)}
.s-result .navorb .ic{position:relative;z-index:1;width:24px;height:24px}
.s-result .navorb:hover{color:#fff}

/* ===== Scan.dc.html  (scope .s-scan) ===== */
.s-scan a{color:#B9A8FF}
.s-scan a:hover{color:#D9D0FF}
.app.s-scan{position:relative;width:390px;height:844px;overflow:hidden;font-family:'Rubik',system-ui,sans-serif;color:#F3F1FB;background:radial-gradient(400px 300px at 50% 30%,#2A2438,transparent 70%),#0B0A10}
.s-scan .disp{font-family:'Unbounded','Rubik',system-ui,sans-serif}
.s-scan .he{font-family:'Rubik',system-ui,sans-serif;direction:rtl}
.s-scan .en{direction:ltr;unicode-bidi:isolate}
.s-scan .ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.s-scan .glass{background:rgba(20,18,36,.72);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.s-scan .lang{display:inline-flex;align-items:center;gap:2px;height:44px;padding:4px;box-sizing:border-box;border-radius:999px;background:rgba(20,18,36,.72);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);cursor:pointer;flex:none}
.s-scan .lang span{min-width:34px;height:34px;padding:0 4px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-radius:999px;font:600 12px 'Rubik',system-ui,sans-serif;color:#9C98B8;transition:background .3s,color .3s}
.s-scan .lang span.on{background:linear-gradient(135deg,#8C70FF,#6446F2);color:#fff;box-shadow:0 0 14px -2px rgba(124,92,255,.8)}
.s-scan .round{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#F3F1FB;text-decoration:none;flex:none}
.s-scan .round:hover{color:#fff;background:rgba(255,255,255,.14)}
.s-scan .paper{position:absolute;left:34px;right:34px;top:136px;height:400px;padding:30px 26px;box-sizing:border-box;border-radius:6px;background:linear-gradient(180deg,#F4EEE2,#E9E1D0);color:#2B2620;font-family:'Literata',Georgia,serif;font-size:15.5px;line-height:1.75;transform:rotate(-2.5deg);box-shadow:0 30px 60px -20px rgba(0,0,0,.8);filter:saturate(.9)}
.s-scan .paper p{margin:0 0 12px;text-wrap:pretty}
.s-scan .hl{position:relative;border-radius:4px;padding:1px 3px;margin:0 -3px;animation:scan-hl .6s both}
.s-scan .hl.a{animation-delay:1.3s}
.s-scan .hl.b{animation-delay:1.6s}
.s-scan .hl.c{animation-delay:1.9s}
.s-scan .frame{position:absolute;left:22px;right:22px;top:118px;height:436px}
.s-scan .frame span{position:absolute;width:34px;height:34px;border-color:#36E2C4;border-style:solid;border-width:0;filter:drop-shadow(0 0 6px rgba(54,226,196,.7))}
.s-scan .frame span:nth-child(1){top:0;left:0;border-top-width:3px;border-left-width:3px;border-top-left-radius:14px}
.s-scan .frame span:nth-child(2){top:0;right:0;border-top-width:3px;border-right-width:3px;border-top-right-radius:14px}
.s-scan .frame span:nth-child(3){bottom:0;left:0;border-bottom-width:3px;border-left-width:3px;border-bottom-left-radius:14px}
.s-scan .frame span:nth-child(4){bottom:0;right:0;border-bottom-width:3px;border-right-width:3px;border-bottom-right-radius:14px}
.s-scan .beam{position:absolute;left:10px;right:10px;height:70px;top:0;background:linear-gradient(180deg,transparent,rgba(54,226,196,.22));border-bottom:2px solid #36E2C4;box-shadow:0 8px 18px -4px rgba(54,226,196,.8);animation:scan-beam 2.8s ease-in-out infinite}
.s-scan .sheet{position:absolute;left:0;right:0;bottom:0;padding:12px 20px 30px;border-radius:30px 30px 0 0;display:flex;flex-direction:column;gap:14px;animation:scan-up .8s .4s cubic-bezier(.2,.8,.2,1) both}
.s-scan .found{display:flex;align-items:center;gap:10px;min-height:48px;padding:0 8px 0 14px;padding-inline:14px 8px;border-radius:16px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);text-decoration:none;color:#F3F1FB;animation:scan-rise .6s cubic-bezier(.2,.8,.2,1) both}
.s-scan .found:hover{color:#fff;background:rgba(255,255,255,.09)}
.s-scan .found:nth-child(1){animation-delay:1.4s}
.s-scan .found:nth-child(2){animation-delay:1.7s}
.s-scan .found:nth-child(3){animation-delay:2s}
.s-scan .add{width:36px;height:36px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(124,92,255,.2);color:#CFC4FF}
.s-scan .shutter{width:72px;height:72px;border-radius:50%;border:4px solid rgba(255,255,255,.85);background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.s-scan .shutter span{width:56px;height:56px;border-radius:50%;background:#fff;transition:transform .2s}
.s-scan .shutter:hover span{transform:scale(.92)}
@keyframes scan-beam{0%{top:0}50%{top:366px}100%{top:0}}
@keyframes scan-hl{to{background:rgba(124,92,255,.28);box-shadow:inset 0 -2px 0 #7C5CFF}}
@keyframes scan-up{from{transform:translateY(100%)}to{transform:none}}
@keyframes scan-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* ===== Words.dc.html  (scope .s-words) ===== */
.s-words a{color:#B9A8FF}
.s-words a:hover{color:#D9D0FF}
.app.s-words{position:relative;width:390px;height:844px;overflow:hidden;font-family:'Rubik',system-ui,sans-serif;color:#F3F1FB;background:radial-gradient(520px 380px at 90% -8%,rgba(124,92,255,.3),transparent 62%),radial-gradient(420px 360px at -12% 55%,rgba(54,226,196,.1),transparent 60%),#07070F}
.s-words .disp{font-family:'Unbounded','Rubik',system-ui,sans-serif}
.s-words .he{font-family:'Rubik',system-ui,sans-serif;direction:rtl}
.s-words .en{direction:ltr;unicode-bidi:isolate}
.app.s-words[dir=rtl] .flip{transform:scaleX(-1)}
.s-words .ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.s-words .glass{background:rgba(24,22,44,.66);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.s-words .lang{display:inline-flex;align-items:center;gap:2px;height:44px;padding:4px;box-sizing:border-box;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);cursor:pointer;flex:none}
.s-words .lang span{min-width:34px;height:34px;padding:0 4px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-radius:999px;font:600 12px 'Rubik',system-ui,sans-serif;color:#9C98B8;transition:background .3s,color .3s}
.s-words .lang span.on{background:linear-gradient(135deg,#8C70FF,#6446F2);color:#fff;box-shadow:0 0 14px -2px rgba(124,92,255,.8)}
.s-words .iconbtn{width:44px;height:44px;border-radius:14px;display:flex;align-items:center;justify-content:center;color:#D7D3EE;cursor:pointer;padding:0;flex:none}
.s-words .iconbtn:hover{color:#fff;background:rgba(255,255,255,.1)}
.s-words .sess{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;font:500 14px 'Rubik',system-ui,sans-serif;color:#BDB8DA;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);cursor:pointer;white-space:nowrap;flex:none}
.s-words .sess b{font-weight:600;font-size:12px;color:#8E8AAB}
.s-words .sess.on{color:#fff;background:linear-gradient(135deg,rgba(140,112,255,.4),rgba(100,70,242,.25));border-color:rgba(168,144,255,.6);box-shadow:0 0 20px -4px rgba(124,92,255,.6)}
.s-words .sess.on b{color:#D9D0FF}
.s-words .banner{position:relative;overflow:hidden;border-radius:24px;padding:18px;display:flex;align-items:center;gap:14px;background:linear-gradient(120deg,#6446F2,#8C70FF 55%,#36C9B0);box-shadow:0 18px 40px -16px rgba(124,92,255,.9)}
.s-words .banner::before{content:"";position:absolute;width:180px;height:180px;right:-50px;top:-80px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.35),transparent 65%);animation:words-drift 6s ease-in-out infinite}
.s-words .go{position:relative;display:flex;align-items:center;gap:8px;height:46px;padding:0 18px;border-radius:14px;background:#0B0A16;color:#fff;font-weight:600;font-size:14px;text-decoration:none;white-space:nowrap}
.s-words .go:hover{color:#fff;background:#16142A}
.s-words .row{display:flex;align-items:center;gap:12px;padding:12px 14px;min-height:68px;box-sizing:border-box;border-top:1px solid rgba(255,255,255,.06);animation:words-rise .7s cubic-bezier(.2,.8,.2,1) both}
.s-words .row:first-child{border-top:0}
.s-words .row:nth-child(2){animation-delay:.08s}
.s-words .row:nth-child(3){animation-delay:.16s}
.s-words .row:nth-child(4){animation-delay:.24s}
.s-words .row:nth-child(5){animation-delay:.32s}
.s-words .say{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);color:#CFC4FF;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;flex:none}
.s-words .say:hover{background:rgba(160,139,255,.18);color:#fff}
.s-words .dots{display:flex;gap:3px;flex:none}
.s-words .dots i{width:14px;height:4px;border-radius:2px;background:rgba(255,255,255,.14)}
.s-words .dots i.f{background:#36E2C4}
.s-words .rise{animation:words-rise .8s cubic-bezier(.2,.8,.2,1) both}
.s-words .d1{animation-delay:.08s}
.s-words .d2{animation-delay:.16s}
.s-words .d3{animation-delay:.24s}
@keyframes words-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes words-drift{0%,100%{transform:translate(0,0)}50%{transform:translate(-30px,20px)}}
@keyframes words-spin{to{transform:rotate(360deg)}}
.s-words .nav{position:absolute;left:14px;right:14px;bottom:16px;height:70px;border-radius:26px;display:flex;align-items:center;justify-content:space-around;padding:0 4px;z-index:5;box-sizing:border-box}
.s-words .tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:58px;min-height:52px;color:#8E8AAB;text-decoration:none;font-size:11px;font-weight:500}
.s-words .tab:hover,.s-words .tab.on{color:#F3F1FB}
.s-words .tab.on .ic{color:#A890FF;filter:drop-shadow(0 0 8px rgba(160,139,255,.85))}
.s-words .navorb{position:relative;width:62px;height:62px;margin-top:-34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;text-decoration:none;box-shadow:0 0 0 6px #0A0A14,0 10px 34px rgba(124,92,255,.65)}
.s-words .navorb::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,#7C5CFF,#36E2C4,#FF6FB5,#7C5CFF);animation:words-spin 5s linear infinite}
.s-words .navorb::after{content:"";position:absolute;inset:3px;border-radius:50%;background:radial-gradient(circle at 35% 28%,#3A2F78,#100E22 72%)}
.s-words .navorb .ic{position:relative;z-index:1;width:24px;height:24px}
.s-words .navorb:hover{color:#fff}

/* ===== Practice.dc.html  (scope .s-practice) ===== */
.s-practice a{color:#B9A8FF}
.s-practice a:hover{color:#D9D0FF}
.app.s-practice{position:relative;width:390px;height:844px;overflow:hidden;font-family:'Rubik',system-ui,sans-serif;color:#F3F1FB;background:radial-gradient(520px 380px at 10% -8%,rgba(124,92,255,.32),transparent 62%),radial-gradient(420px 360px at 110% 70%,rgba(255,111,181,.1),transparent 60%),#07070F}
.s-practice .disp{font-family:'Unbounded','Rubik',system-ui,sans-serif}
.s-practice .he{font-family:'Rubik',system-ui,sans-serif;direction:rtl}
.s-practice .en{direction:ltr;unicode-bidi:isolate}
.app.s-practice[dir=rtl] .flip{transform:scaleX(-1)}
.s-practice .ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.s-practice .glass{background:rgba(24,22,44,.66);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.s-practice .lang{display:inline-flex;align-items:center;gap:2px;height:44px;padding:4px;box-sizing:border-box;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);cursor:pointer;flex:none}
.s-practice .lang span{min-width:34px;height:34px;padding:0 4px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-radius:999px;font:600 12px 'Rubik',system-ui,sans-serif;color:#9C98B8;transition:background .3s,color .3s}
.s-practice .lang span.on{background:linear-gradient(135deg,#8C70FF,#6446F2);color:#fff;box-shadow:0 0 14px -2px rgba(124,92,255,.8)}
.s-practice .chip{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:#F3F1FB;font:500 13px 'Rubik',system-ui,sans-serif;text-decoration:none;box-sizing:border-box;white-space:nowrap}
.s-practice .chip:hover{color:#fff;background:rgba(255,255,255,.1)}
.s-practice .mode{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;padding:18px;border-radius:28px;text-decoration:none;color:#F3F1FB;box-sizing:border-box;transition:transform .25s}
.s-practice .mode:hover{transform:translateY(-3px);color:#fff}
.s-practice .mode .go{position:absolute;top:16px;inset-inline-start:16px;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.12)}
.s-practice .stack{position:absolute;inset-inline-end:26px;top:26px;width:118px;height:150px}
.s-practice .stack span{position:absolute;inset:0;border-radius:18px;display:flex;align-items:center;justify-content:center;font-family:'Unbounded','Rubik',sans-serif;font-weight:700;font-size:18px;box-shadow:0 14px 30px -10px rgba(0,0,0,.6)}
.s-practice .stack span:nth-child(1){background:#2D2560;transform:rotate(-14deg) translate(-18px,6px);animation:practice-fanA 4s ease-in-out infinite}
.s-practice .stack span:nth-child(2){background:#1E5F58;transform:rotate(-4deg);animation:practice-fanB 4s ease-in-out infinite}
.s-practice .stack span:nth-child(3){background:linear-gradient(150deg,#F7F5FF,#DCD5FF);color:#1B1640;transform:rotate(8deg) translate(14px,-4px);animation:practice-fanC 4s ease-in-out infinite}
.s-practice .tiles{position:absolute;inset-inline-end:16px;top:16px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;width:96px}
.s-practice .tiles i{height:28px;border-radius:8px;background:rgba(255,255,255,.12);animation:practice-flipT 3.6s ease-in-out infinite}
.s-practice .tiles i:nth-child(2){animation-delay:.3s}
.s-practice .tiles i:nth-child(4){animation-delay:.9s}
.s-practice .tiles i:nth-child(6){animation-delay:1.5s}
.s-practice .tiles i:nth-child(5){animation-delay:2.1s}
.s-practice .abcd{position:absolute;inset-inline-end:16px;top:18px;display:flex;flex-direction:column;gap:6px;width:100px}
.s-practice .abcd i{height:14px;border-radius:7px;background:rgba(255,255,255,.14)}
.s-practice .abcd i:nth-child(2){background:#36E2C4;box-shadow:0 0 14px rgba(54,226,196,.7);animation:practice-pulse 2s ease-in-out infinite}
.s-practice .rise{animation:practice-rise .8s cubic-bezier(.2,.8,.2,1) both}
.s-practice .d1{animation-delay:.08s}
.s-practice .d2{animation-delay:.18s}
.s-practice .d3{animation-delay:.28s}
@keyframes practice-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes practice-fanA{0%,100%{transform:rotate(-14deg) translate(-18px,6px)}50%{transform:rotate(-20deg) translate(-26px,10px)}}
@keyframes practice-fanB{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(-6deg) translate(-4px,2px)}}
@keyframes practice-fanC{0%,100%{transform:rotate(8deg) translate(14px,-4px)}50%{transform:rotate(13deg) translate(22px,-10px)}}
@keyframes practice-flipT{0%,70%,100%{transform:rotateY(0);background:rgba(255,255,255,.12)}80%,90%{transform:rotateY(180deg);background:#FF6FB5}}
@keyframes practice-pulse{0%,100%{opacity:1}50%{opacity:.55}}
@keyframes practice-spin{to{transform:rotate(360deg)}}
.s-practice .nav{position:absolute;left:14px;right:14px;bottom:16px;height:70px;border-radius:26px;display:flex;align-items:center;justify-content:space-around;padding:0 4px;z-index:5;box-sizing:border-box}
.s-practice .tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:58px;min-height:52px;color:#8E8AAB;text-decoration:none;font-size:11px;font-weight:500}
.s-practice .tab:hover,.s-practice .tab.on{color:#F3F1FB}
.s-practice .tab.on .ic{color:#A890FF;filter:drop-shadow(0 0 8px rgba(160,139,255,.85))}
.s-practice .navorb{position:relative;width:62px;height:62px;margin-top:-34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;text-decoration:none;box-shadow:0 0 0 6px #0A0A14,0 10px 34px rgba(124,92,255,.65)}
.s-practice .navorb::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,#7C5CFF,#36E2C4,#FF6FB5,#7C5CFF);animation:practice-spin 5s linear infinite}
.s-practice .navorb::after{content:"";position:absolute;inset:3px;border-radius:50%;background:radial-gradient(circle at 35% 28%,#3A2F78,#100E22 72%)}
.s-practice .navorb .ic{position:relative;z-index:1;width:24px;height:24px}
.s-practice .navorb:hover{color:#fff}

/* ===== Flashcards.dc.html  (scope .s-cards) ===== */
.s-cards a{color:#B9A8FF}
.s-cards a:hover{color:#D9D0FF}
.app.s-cards{position:relative;width:390px;height:844px;overflow:hidden;font-family:'Rubik',system-ui,sans-serif;color:#F3F1FB;background:radial-gradient(520px 420px at 50% 45%,rgba(124,92,255,.26),transparent 65%),#07070F}
.s-cards .disp{font-family:'Unbounded','Rubik',system-ui,sans-serif}
.s-cards .he{font-family:'Rubik',system-ui,sans-serif;direction:rtl}
.s-cards .en{direction:ltr;unicode-bidi:isolate}
.app.s-cards[dir=rtl] .flip{transform:scaleX(-1)}
.s-cards .ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.s-cards .glass{background:rgba(24,22,44,.66);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.s-cards .lang{display:inline-flex;align-items:center;gap:2px;height:44px;padding:4px;box-sizing:border-box;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);cursor:pointer;flex:none}
.s-cards .lang span{min-width:34px;height:34px;padding:0 4px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-radius:999px;font:600 12px 'Rubik',system-ui,sans-serif;color:#9C98B8;transition:background .3s,color .3s}
.s-cards .lang span.on{background:linear-gradient(135deg,#8C70FF,#6446F2);color:#fff;box-shadow:0 0 14px -2px rgba(124,92,255,.8)}
.s-cards .round{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#F3F1FB;text-decoration:none;flex:none}
.s-cards .round:hover{color:#fff;background:rgba(255,255,255,.12)}
.s-cards .segs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.s-cards .seg{height:5px;border-radius:3px;background:rgba(255,255,255,.12);transition:background .4s,box-shadow .4s}
.s-cards .seg.on{background:linear-gradient(90deg,#8C70FF,#36E2C4);box-shadow:0 0 10px rgba(124,92,255,.7)}
.s-cards .card3d{position:relative;display:block;width:100%;height:430px;padding:0;border:0;background:transparent;perspective:1400px;cursor:pointer;color:inherit;font:inherit}
.s-cards .inner{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.s-cards .inner.turned{transform:rotateY(180deg)}
.s-cards .face{position:absolute;inset:0;border-radius:32px;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:28px;box-sizing:border-box;overflow:hidden}
.s-cards .front{background:radial-gradient(260px 200px at 50% 30%,rgba(140,112,255,.35),transparent 70%),linear-gradient(170deg,#1D1A3A,#120F26);border:1px solid rgba(168,144,255,.35);box-shadow:0 30px 70px -30px rgba(124,92,255,.9)}
.s-cards .back{transform:rotateY(180deg);background:radial-gradient(260px 200px at 50% 30%,rgba(54,226,196,.3),transparent 70%),linear-gradient(170deg,#12302F,#0D1A22);border:1px solid rgba(127,240,218,.35);box-shadow:0 30px 70px -30px rgba(54,226,196,.8)}
.s-cards .front::before,.s-cards .back::before{content:"";position:absolute;inset:14px;border-radius:22px;border:1px dashed rgba(255,255,255,.08)}
.s-cards .hint{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:#A6A2C3;animation:cards-nudge 2.4s ease-in-out infinite}
.s-cards .pill{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;background:rgba(255,255,255,.1);color:#CFF7EE;font-size:12px;font-weight:600}
.s-cards .say{position:absolute;top:18px;inset-inline-end:18px;z-index:3;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.s-cards .say:hover{background:rgba(255,255,255,.16)}
.s-cards .ctl{width:60px;height:60px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:#F3F1FB;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.s-cards .ctl:hover{background:rgba(255,255,255,.12)}
.s-cards .ctl.pri{border:0;background:linear-gradient(135deg,#8C70FF,#6446F2);box-shadow:0 12px 30px -8px rgba(124,92,255,.85)}
.s-cards .shuf{display:flex;align-items:center;gap:8px;height:52px;padding:0 20px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#D7D3EE;font:500 14px 'Rubik',system-ui,sans-serif;cursor:pointer}
.s-cards .shuf:hover{color:#fff;background:rgba(255,255,255,.1)}
@keyframes cards-nudge{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}

/* ===== Memory.dc.html  (scope .s-memory) ===== */
.s-memory a{color:#B9A8FF}
.s-memory a:hover{color:#D9D0FF}
.app.s-memory{position:relative;width:390px;height:844px;overflow:hidden;font-family:'Rubik',system-ui,sans-serif;color:#F3F1FB;background:radial-gradient(480px 360px at 90% 0%,rgba(255,111,181,.2),transparent 62%),radial-gradient(480px 400px at 0% 70%,rgba(124,92,255,.22),transparent 60%),#07070F}
.s-memory .disp{font-family:'Unbounded','Rubik',system-ui,sans-serif}
.s-memory .en{direction:ltr;unicode-bidi:isolate}
.app.s-memory[dir=rtl] .flip{transform:scaleX(-1)}
.s-memory .ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.s-memory .glass{background:rgba(24,22,44,.66);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.s-memory .lang{display:inline-flex;align-items:center;gap:2px;height:44px;padding:4px;box-sizing:border-box;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);cursor:pointer;flex:none}
.s-memory .lang span{min-width:34px;height:34px;padding:0 4px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-radius:999px;font:600 12px 'Rubik',system-ui,sans-serif;color:#9C98B8;transition:background .3s,color .3s}
.s-memory .lang span.on{background:linear-gradient(135deg,#8C70FF,#6446F2);color:#fff;box-shadow:0 0 14px -2px rgba(124,92,255,.8)}
.s-memory .round{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#F3F1FB;text-decoration:none;flex:none}
.s-memory .round:hover{color:#fff;background:rgba(255,255,255,.12)}
.s-memory .stat{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 0;border-radius:16px}
.s-memory .stat b{font-family:'Unbounded','Rubik',sans-serif;font-size:18px;font-weight:700}
.s-memory .stat span{font-size:12px;color:#A6A2C3}
.s-memory .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.s-memory .tile{position:relative;height:96px;padding:0;border:0;background:transparent;perspective:900px;cursor:pointer;color:inherit;font:inherit}
.s-memory .tin{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.s-memory .tile.up .tin{transform:rotateY(180deg)}
.s-memory .side{position:absolute;inset:0;border-radius:20px;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;align-items:center;justify-content:center;padding:10px 14px;box-sizing:border-box;text-align:center}
.s-memory .cover{background:linear-gradient(140deg,#6446F2,#3B2A9E);border:1px solid rgba(168,144,255,.45);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 10px 24px -14px rgba(124,92,255,.9);background-image:radial-gradient(rgba(255,255,255,.14) 1.2px,transparent 1.2px),linear-gradient(140deg,#6446F2,#3B2A9E);background-size:14px 14px,100% 100%}
.s-memory .cover i{width:26px;height:26px;border-radius:50%;background:conic-gradient(#A890FF,#36E2C4,#FF6FB5,#A890FF);box-shadow:0 0 16px rgba(255,255,255,.35)}
.s-memory .tile:hover .cover{filter:brightness(1.12)}
.s-memory .face{transform:rotateY(180deg);background:#16142C;border:1px solid rgba(255,255,255,.14)}
.s-memory .face.w{font-family:'Unbounded','Rubik',sans-serif;font-weight:700;font-size:17px;border-color:rgba(168,144,255,.5);background:linear-gradient(160deg,#241E52,#16142C)}
.s-memory .face.d{font-size:13px;line-height:1.35;color:#DDF7F1;border-color:rgba(127,240,218,.4);background:linear-gradient(160deg,#123632,#14182A)}
.s-memory .tile.done .face{border-color:#36E2C4;box-shadow:0 0 0 2px rgba(54,226,196,.5),0 0 26px rgba(54,226,196,.45);animation:memory-matched .6s ease}
.s-memory .win{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(7,7,15,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:memory-fade .4s both}
.s-memory .wincard{width:100%;border-radius:30px;padding:30px 24px;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;animation:memory-pop .6s cubic-bezier(.2,1.4,.4,1) both}
.s-memory .again{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:54px;border:0;border-radius:18px;background:linear-gradient(135deg,#8C70FF,#6446F2);color:#fff;font:600 16px 'Rubik',system-ui,sans-serif;cursor:pointer;box-shadow:0 10px 30px -8px rgba(124,92,255,.8)}
@keyframes memory-matched{0%{transform:rotateY(180deg) scale(1)}50%{transform:rotateY(180deg) scale(1.06)}100%{transform:rotateY(180deg) scale(1)}}
@keyframes memory-fade{from{opacity:0}to{opacity:1}}
@keyframes memory-pop{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}

/* ===== Quiz.dc.html  (scope .s-quiz) ===== */
.s-quiz a{color:#B9A8FF}
.s-quiz a:hover{color:#D9D0FF}
.app.s-quiz{position:relative;width:390px;height:844px;overflow:hidden;font-family:'Rubik',system-ui,sans-serif;color:#F3F1FB;background:radial-gradient(500px 380px at 50% -5%,rgba(54,226,196,.18),transparent 62%),radial-gradient(480px 400px at 100% 80%,rgba(124,92,255,.2),transparent 60%),#07070F}
.s-quiz .disp{font-family:'Unbounded','Rubik',system-ui,sans-serif}
.s-quiz .he{font-family:'Rubik',system-ui,sans-serif;direction:rtl}
.s-quiz .en{direction:ltr;unicode-bidi:isolate}
.app.s-quiz[dir=rtl] .flip{transform:scaleX(-1)}
.s-quiz .ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.s-quiz .glass{background:rgba(24,22,44,.66);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.s-quiz .lang{display:inline-flex;align-items:center;gap:2px;height:44px;padding:4px;box-sizing:border-box;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);cursor:pointer;flex:none}
.s-quiz .lang span{min-width:34px;height:34px;padding:0 4px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-radius:999px;font:600 12px 'Rubik',system-ui,sans-serif;color:#9C98B8;transition:background .3s,color .3s}
.s-quiz .lang span.on{background:linear-gradient(135deg,#8C70FF,#6446F2);color:#fff;box-shadow:0 0 14px -2px rgba(124,92,255,.8)}
.s-quiz .round{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#F3F1FB;text-decoration:none;flex:none}
.s-quiz .round:hover{color:#fff;background:rgba(255,255,255,.12)}
.s-quiz .segs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.s-quiz .seg{height:5px;border-radius:3px;background:rgba(255,255,255,.12);transition:background .4s}
.s-quiz .seg.on{background:linear-gradient(90deg,#36E2C4,#8C70FF);box-shadow:0 0 10px rgba(54,226,196,.6)}
.s-quiz .prompt{border-radius:26px;padding:24px 22px;min-height:150px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;animation:quiz-rise .5s cubic-bezier(.2,.8,.2,1) both}
.s-quiz .opt{display:flex;align-items:center;gap:14px;width:100%;min-height:60px;padding:0 16px;border-radius:18px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);color:#F3F1FB;font:500 17px 'Rubik',system-ui,sans-serif;cursor:pointer;text-align:start;transition:background .25s,border-color .25s,transform .2s,opacity .25s;animation:quiz-rise .5s cubic-bezier(.2,.8,.2,1) both}
.s-quiz .opt:hover{background:rgba(255,255,255,.08);transform:translateY(-1px)}
.s-quiz .opt .num{width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.08);font-size:14px;font-weight:600;color:#BDB8DA;flex:none}
.s-quiz .opt.ok{border-color:#36E2C4;background:rgba(54,226,196,.14);box-shadow:0 0 24px -6px rgba(54,226,196,.7)}
.s-quiz .opt.ok .num{background:#36E2C4;color:#062A24}
.s-quiz .opt.bad{border-color:#FF8A5B;background:rgba(255,138,91,.12);animation:quiz-shake .4s}
.s-quiz .opt.bad .num{background:#FF8A5B;color:#2A1006}
.s-quiz .opt.dim{opacity:.45}
.s-quiz .opt:nth-child(2){animation-delay:.05s}
.s-quiz .opt:nth-child(3){animation-delay:.1s}
.s-quiz .opt:nth-child(4){animation-delay:.15s}
.s-quiz .fb{position:absolute;left:20px;right:20px;bottom:32px;display:flex;flex-direction:column;gap:12px;animation:quiz-up .45s cubic-bezier(.2,.8,.2,1) both}
.s-quiz .fbi{width:36px;height:36px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex:none}
.s-quiz .fbi.ok{background:rgba(54,226,196,.16);color:#36E2C4}
.s-quiz .fbi.bad{background:rgba(255,138,91,.16);color:#FF8A5B}
.s-quiz .q{font-size:20px;line-height:1.4;font-weight:500;text-wrap:pretty}
.s-quiz .q.he{font-size:36px;font-weight:700}
.s-quiz .q.disp{font-size:30px;font-weight:700;letter-spacing:-.02em}
.s-quiz .next{display:flex;align-items:center;justify-content:center;gap:8px;height:56px;border:0;border-radius:18px;background:linear-gradient(135deg,#8C70FF,#6446F2);color:#fff;font:600 16px 'Rubik',system-ui,sans-serif;cursor:pointer;box-shadow:0 10px 30px -8px rgba(124,92,255,.8)}
.s-quiz .ring{width:170px;height:170px;border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative;animation:quiz-pop .7s cubic-bezier(.2,1.4,.4,1) both}
.s-quiz .ring::after{content:"";position:absolute;inset:14px;border-radius:50%;background:#0D0C1C}
.s-quiz .ring b{position:relative;z-index:1}
.s-quiz .r0{background:conic-gradient(#36E2C4 0%,rgba(255,255,255,.08) 0)}
.s-quiz .r1{background:conic-gradient(#36E2C4 20%,rgba(255,255,255,.08) 0)}
.s-quiz .r2{background:conic-gradient(#36E2C4 40%,rgba(255,255,255,.08) 0)}
.s-quiz .r3{background:conic-gradient(#36E2C4 60%,rgba(255,255,255,.08) 0)}
.s-quiz .r4{background:conic-gradient(#36E2C4 80%,rgba(255,255,255,.08) 0)}
.s-quiz .r5{background:conic-gradient(#36E2C4 100%,rgba(255,255,255,.08) 0);box-shadow:0 0 50px rgba(54,226,196,.5)}
@keyframes quiz-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes quiz-up{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
@keyframes quiz-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
@keyframes quiz-pop{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}