:root{--bg:#03000A;--bg2:#0B0420;--bg3:#130730;--purple:#7C3AED;--violet:#A78BFA;--pink:#EC4899;--gold:#F5C842;--text:#F0EBFF;--text2:#7B6FA8;--border:rgba(139,92,246,0.25);--r:16px}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:'Nunito',sans-serif;overflow-x:hidden;min-height:100vh}
#stars,#fx{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0}
#fx{z-index:200}
#flash{position:fixed;inset:0;z-index:190;pointer-events:none;opacity:0;background:#fff;transition:opacity .08s}
header{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:rgba(3,0,10,.92);border-bottom:1px solid var(--border)}
.logo{display:flex;align-items:center;gap:7px;text-decoration:none;flex-shrink:0}
.logo-mark{color:var(--gold)}
.logo-text{font-family:'Exo 2',sans-serif;font-weight:900;font-size:17px;color:var(--text)}
.logo-text em{color:var(--violet);font-style:normal;font-weight:400}
.menu-btn{background:var(--bg3);border:1px solid var(--border);color:var(--text2);width:40px;height:40px;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.menu-btn:active{background:var(--purple);color:#fff}
#mobMenu{display:none;position:fixed;inset:0;z-index:99;background:rgba(3,0,10,.97);padding:70px 20px 24px;flex-direction:column;gap:8px;overflow-y:auto}
#mobMenu.open{display:flex}
.mob-close{position:absolute;top:14px;right:16px;background:none;border:none;color:var(--text);font-size:30px;cursor:pointer;line-height:1;padding:4px}
.mob-link{display:block;padding:13px 18px;border-radius:12px;text-decoration:none;font-family:'Exo 2',sans-serif;font-weight:700;font-size:16px;color:var(--text);background:rgba(139,92,246,.08);border:1px solid rgba(139,92,246,.15)}
.mob-link.cur{background:rgba(124,58,237,.25);border-color:rgba(124,58,237,.4)}
main{position:relative;z-index:1;padding:0 16px 48px;max-width:480px;margin:0 auto}
.wish-top{display:flex;align-items:flex-start;gap:11px;margin:14px 0 20px;background:linear-gradient(120deg,rgba(124,58,237,.13),rgba(236,72,153,.07));border:1px solid rgba(167,139,250,.2);border-left:3px solid var(--violet);border-radius:var(--r);padding:14px;text-decoration:none}
.wish-top:active{opacity:.8}
.wish-icon{color:var(--gold);flex-shrink:0;margin-top:2px}
.wish-body{flex:1;min-width:0}
.wish-label{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--violet);text-transform:uppercase;margin-bottom:5px;display:flex;align-items:center;gap:5px}
.wish-dot{width:5px;height:5px;background:var(--gold);border-radius:50%;animation:blink 2s ease-in-out infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
.wish-preview{font-size:13px;color:var(--text);line-height:1.5;font-weight:500;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.wish-cta{font-size:11px;color:var(--violet);margin-top:6px;font-weight:600;display:flex;align-items:center;gap:4px}
.eyebrow{display:flex;align-items:center;gap:7px;font-size:10px;font-weight:700;letter-spacing:2.5px;color:var(--text2);text-transform:uppercase;margin-bottom:8px}
h1{font-family:'Exo 2',sans-serif;font-weight:900;font-size:30px;line-height:1.1;margin-bottom:18px;background:linear-gradient(155deg,var(--text) 45%,var(--violet));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.tool-card{background:var(--bg2);border:1px solid var(--border);border-radius:22px;padding:20px 16px 16px;box-shadow:0 0 50px rgba(124,58,237,.1)}
.card-label{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--text2);text-transform:uppercase;margin-bottom:12px}
.range-row{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.range-sep{color:var(--text2);font-size:16px;flex-shrink:0}
.num-input{flex:1;min-width:0;background:var(--bg3);border:1px solid var(--border);border-radius:10px;padding:8px 6px;font-family:'JetBrains Mono',monospace;font-size:15px;font-weight:700;color:var(--text);text-align:center;outline:none}
.num-input:focus{border-color:var(--violet)}
.result-wrap{display:flex;flex-direction:column;align-items:center;min-height:100px;justify-content:center;margin-bottom:16px}
#rNum{font-family:'JetBrains Mono',monospace;font-weight:800;font-size:76px;line-height:1;letter-spacing:-3px;color:var(--text2)}
#rNum.cnt{color:var(--violet);animation:shimmer .45s ease-in-out infinite}
#rNum.ago{color:var(--pink);animation:agonyFlash .55s ease-in-out}
#rNum.rev{color:var(--gold);text-shadow:0 0 24px rgba(245,200,66,.7),0 0 60px rgba(245,200,66,.3);animation:slam .4s cubic-bezier(.34,1.56,.64,1) forwards,pg 2s .5s ease-in-out infinite}
@keyframes slam{0%{transform:scale(.3);opacity:0}100%{transform:scale(1);opacity:1}}
@keyframes shimmer{0%,100%{opacity:.95;color:#A78BFA}25%{opacity:.78;color:#B8A9F8}50%{opacity:.52;color:#C4B5FD}75%{opacity:.78;color:#B8A9F8}}
@keyframes ap{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@keyframes agonyFlash{0%,100%{opacity:1;color:#EC4899;text-shadow:0 0 20px rgba(236,72,153,.6)}45%{opacity:.45;color:#fda4af;text-shadow:none}75%{opacity:.9;color:#EC4899;text-shadow:0 0 35px rgba(236,72,153,.9)}}
@keyframes pg{0%,100%{text-shadow:0 0 24px rgba(245,200,66,.7),0 0 60px rgba(245,200,66,.3)}50%{text-shadow:0 0 40px rgba(245,200,66,1),0 0 90px rgba(245,200,66,.5)}}
#rSub{font-size:11px;color:var(--text2);margin-top:4px;opacity:0;transition:opacity .4s}
#rSub.show{opacity:1}
.spin-btn{width:100%;padding:17px;border:none;border-radius:var(--r);background:linear-gradient(135deg,var(--purple),var(--pink));color:#fff;font-family:'Exo 2',sans-serif;font-weight:800;font-size:19px;letter-spacing:.5px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 4px 28px rgba(124,58,237,.4);transition:all .15s}
.spin-btn:active:not(:disabled){transform:scale(.97)}
.spin-btn:disabled{opacity:.55;pointer-events:none}
.bi{display:flex;transition:transform .3s}
.spinning .bi{animation:rot .5s linear infinite}
@keyframes rot{to{transform:rotate(360deg)}}
/* ── Без повторов ── */
.nr-row{display:flex;align-items:center;gap:8px;margin:8px 0 0}
.nr-toggle{background:var(--bg3);border:1px solid var(--border);color:var(--text2);border-radius:9px;padding:7px 12px;font-family:'Exo 2',sans-serif;font-weight:700;font-size:11px;letter-spacing:.5px;cursor:pointer;display:flex;align-items:center;gap:7px;transition:all .15s}
.nr-toggle:active,.nr-toggle.active{background:rgba(124,58,237,.2);border-color:var(--purple);color:var(--violet)}
.nr-toggle .nr-check{opacity:0;transition:opacity .15s}
.nr-toggle.active .nr-check{opacity:1}
.nr-left{font-size:11px;color:var(--text2);flex:1;text-align:right}
/* История */
.nr-history{margin:12px 0 0;display:none;overflow:hidden}
.nr-history.show{display:block;margin-bottom:14px}
.nr-attempt{display:block;font-size:10px;font-weight:700;letter-spacing:2px;color:var(--violet);text-transform:uppercase;margin-bottom:7px}
.nr-chips{display:flex;flex-wrap:wrap;gap:5px;max-height:80px;overflow-y:auto}
.nr-chip{display:inline-block;padding:4px 9px;background:rgba(124,58,237,.1);border:1px solid rgba(124,58,237,.22);border-radius:8px;font-family:'JetBrains Mono',monospace;font-weight:700;font-size:11px;color:var(--text2)}
.nr-chip-last{background:rgba(245,200,66,.18);border-color:rgba(245,200,66,.5);color:var(--gold);animation:slam .3s cubic-bezier(.34,1.56,.64,1)}
.nr-done{color:var(--gold)!important}
.nr-reset{margin-top:10px;width:100%;padding:9px;border:1px solid rgba(124,58,237,.4);background:rgba(124,58,237,.1);color:var(--violet);border-radius:10px;font-family:'Exo 2',sans-serif;font-weight:700;font-size:12px;letter-spacing:.3px;cursor:pointer;transition:all .15s}
.nr-reset:active{background:rgba(124,58,237,.25);border-color:var(--purple)}
.nr-dl{background:rgba(245,200,66,.1)!important;border-color:rgba(245,200,66,.35)!important;color:var(--gold)!important}
.nr-dl:active{background:rgba(245,200,66,.22)!important}
.nr-rec-info{font-size:11px;color:var(--violet);text-align:center;padding:6px 0;opacity:.65}
@keyframes nrPulse{0%,100%{color:var(--pink)}50%{color:#fff;transform:scale(1.08)}}
/* ── Счётчик ── */
.ctr-row{text-align:center;font-size:11px;color:var(--text2);margin:10px 0 0;letter-spacing:.3px}
.ctr-row #ctrDisp{color:var(--violet);font-weight:700;font-family:'JetBrains Mono',monospace;font-size:12px}
.more-hint{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:12px;font-size:12px;color:var(--text2);font-weight:600;cursor:pointer;padding:6px}
.more-hint svg{animation:bd 1.8s ease-in-out infinite;color:var(--violet)}
@keyframes bd{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
.pills{display:flex;gap:6px;overflow-x:auto;padding:2px 0 4px;margin-top:6px;scrollbar-width:none}
.pills::-webkit-scrollbar{display:none}
.pill{flex-shrink:0;background:var(--bg3);border:1px solid var(--border);border-radius:20px;padding:6px 11px;font-size:11px;font-weight:600;color:var(--text2);text-decoration:none;display:flex;align-items:center;gap:5px;white-space:nowrap}
.pill:active{background:var(--purple);color:#fff;border-color:var(--purple)}
.popup-ov{position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.75);display:flex;align-items:flex-end;opacity:0;pointer-events:none;transition:opacity .3s}
.popup-ov.show{opacity:1;pointer-events:all}
.popup-card{width:100%;max-width:480px;margin:0 auto;background:var(--bg2);border-radius:24px 24px 0 0;border:1px solid var(--border);border-bottom:none;padding:12px 20px 40px;transform:translateY(100%);transition:transform .42s cubic-bezier(.34,1.3,.64,1);position:relative}
.popup-ov.show .popup-card{transform:translateY(0)}
.popup-handle{width:40px;height:4px;background:var(--border);border-radius:2px;margin:0 auto 20px}
.popup-close{position:absolute;top:12px;right:16px;background:none;border:none;color:var(--text2);font-size:28px;cursor:pointer;line-height:1;padding:4px}
.popup-num{font-family:'JetBrains Mono',monospace;font-size:80px;font-weight:800;line-height:1;color:var(--gold);text-shadow:0 0 30px rgba(245,200,66,.6);text-align:center;margin-bottom:4px}
.popup-range{font-size:12px;color:var(--text2);text-align:center;margin-bottom:20px}
.popup-title{font-family:'Exo 2',sans-serif;font-weight:700;font-size:15px;color:var(--text);text-align:center;margin-bottom:14px}
.pbtn{width:100%;padding:16px;border-radius:14px;border:none;font-family:'Exo 2',sans-serif;font-weight:700;font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:transform .15s;margin-bottom:10px}
.pbtn:active{transform:scale(.97)}
.pbtn:last-child{margin-bottom:0}
.pv{background:linear-gradient(135deg,var(--purple),var(--pink));color:#fff;box-shadow:0 4px 20px rgba(124,58,237,.35)}
.pi{background:var(--bg3);border:1px solid var(--border);color:var(--text)}
.ps{background:transparent;border:1px solid rgba(167,139,250,.3);color:var(--violet)}
.p-ios{font-size:11px;color:var(--text2);text-align:center;margin-top:8px;display:none}
.p-ios.show{display:block}
/* Серия (без повторов) в попапе */
.popup-series-label{font-family:'Exo 2',sans-serif;font-weight:700;font-size:14px;color:var(--text);text-align:center;margin-bottom:18px}
.popup-series-btns{display:flex;flex-direction:column;gap:10px}
.pe{background:linear-gradient(135deg,var(--purple),var(--pink));color:#fff;box-shadow:0 4px 20px rgba(124,58,237,.35)}
.popup-save-row{display:flex;gap:8px;margin-top:10px}
.pbtn-sm{flex:1;padding:10px 8px;border-radius:12px;border:1px solid var(--border);background:var(--bg3);color:var(--text2);font-family:'Exo 2',sans-serif;font-weight:700;font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;transition:all .15s}
.pbtn-sm:active{background:var(--bg2);border-color:var(--violet);color:var(--violet)}
.sec-head{display:flex;align-items:center;gap:12px;margin:28px 0 12px}
.sec-head h2{font-family:'Exo 2',sans-serif;font-weight:700;font-size:15px;color:var(--text);white-space:nowrap}
.sec-head::before,.sec-head::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,var(--border),transparent)}
.sec-head::after{background:linear-gradient(270deg,var(--border),transparent)}
.t-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.t-item{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r);padding:14px 12px;text-decoration:none;display:flex;flex-direction:column;gap:3px;position:relative}
.t-item:active{transform:scale(.96);border-color:var(--violet)}
.t-ico{margin-bottom:4px;display:block}
.t-name{font-family:'Exo 2',sans-serif;font-weight:700;font-size:12px;color:var(--text);line-height:1.2}
.t-desc{font-size:10px;color:var(--text2);line-height:1.3}
.t-arr{position:absolute;top:10px;right:10px;color:rgba(139,92,246,.3)}
/* ── Use Cases ── */
.uc-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.uc-card{border-radius:var(--r);padding:16px 14px;display:flex;flex-direction:column;border-left:3px solid transparent}
.uc-purple{background:linear-gradient(135deg,rgba(124,58,237,.2),rgba(124,58,237,.07));border:1px solid rgba(124,58,237,.35);border-left-color:var(--purple);box-shadow:0 4px 24px rgba(124,58,237,.18)}
.uc-pink{background:linear-gradient(135deg,rgba(236,72,153,.2),rgba(236,72,153,.07));border:1px solid rgba(236,72,153,.35);border-left-color:var(--pink);box-shadow:0 4px 24px rgba(236,72,153,.18)}
.uc-teal{background:linear-gradient(135deg,rgba(20,184,166,.2),rgba(20,184,166,.07));border:1px solid rgba(20,184,166,.35);border-left-color:#14B8A6;box-shadow:0 4px 24px rgba(20,184,166,.18)}
.uc-gold{background:linear-gradient(135deg,rgba(245,200,66,.2),rgba(245,200,66,.07));border:1px solid rgba(245,200,66,.35);border-left-color:var(--gold);box-shadow:0 4px 24px rgba(245,200,66,.18)}
.uc-title{font-family:'Exo 2',sans-serif;font-weight:800;font-size:13px;color:var(--text);margin-bottom:7px;line-height:1.3}
.uc-body{font-size:11px;color:var(--text2);line-height:1.6;margin-bottom:10px;flex:1}
.uc-tags{display:flex;flex-wrap:wrap;gap:4px}
.uc-tag{display:inline-block;padding:4px 9px;background:rgba(167,139,250,.1);border:1px solid rgba(167,139,250,.25);border-radius:10px;font-size:10px;font-weight:700;color:var(--violet);text-decoration:none;font-family:'Exo 2',sans-serif;white-space:nowrap;transition:all .15s}
.uc-tag:active{background:var(--purple);color:#fff;border-color:transparent}
/* ── Steps ── */
.seo-steps{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.seo-step{display:flex;align-items:flex-start;gap:14px;background:linear-gradient(135deg,rgba(11,4,32,.95),rgba(19,7,48,.8));border:1px solid rgba(139,92,246,.22);border-radius:14px;padding:14px 16px}
.seo-step-n{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--purple),var(--pink));color:#fff;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 0 16px rgba(124,58,237,.6);margin-top:1px}
.seo-step-body{display:flex;flex-direction:column;gap:4px}
.seo-step-ttl{font-family:'Exo 2',sans-serif;font-weight:700;font-size:13px;color:var(--text)}
.seo-step-dsc{font-size:12px;color:var(--text2);line-height:1.5}
/* ── FAQ ── */
.faq-list{display:flex;flex-direction:column;gap:5px;margin-top:14px}
.faq-cat{font-family:'Exo 2',sans-serif;font-size:10px;font-weight:700;letter-spacing:2.5px;color:var(--violet);text-transform:uppercase;padding:18px 2px 8px;display:flex;align-items:center;gap:10px}
.faq-cat::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(124,58,237,.35),transparent)}
.faq-item{background:linear-gradient(135deg,rgba(11,4,32,.85),rgba(19,7,48,.6));border:1px solid rgba(139,92,246,.16);border-radius:12px;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.faq-item[open]{border-color:rgba(124,58,237,.45);box-shadow:0 0 20px rgba(124,58,237,.13)}
.faq-q{padding:14px 16px;font-family:'Exo 2',sans-serif;font-weight:700;font-size:13px;color:var(--text);cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;user-select:none;line-height:1.4}
.faq-q::-webkit-details-marker{display:none}
.faq-q::after{content:'';min-width:18px;height:18px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M3 4.5l3 3 3-3' stroke='%237B6FA8' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center;flex-shrink:0;transition:transform .25s}
.faq-item[open] .faq-q{color:var(--violet)}
.faq-item[open] .faq-q::after{transform:rotate(180deg)}
.faq-a{padding:12px 16px 16px;font-size:13px;color:var(--text2);line-height:1.7;border-top:1px solid rgba(139,92,246,.12)}
footer{margin-top:36px;padding:16px;border-top:1px solid var(--border);text-align:center;font-size:11px;color:var(--text2);position:relative;z-index:1}
footer a{color:var(--violet);text-decoration:none}
.foot-links{margin-top:8px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.l-back{display:inline-flex;align-items:center;gap:6px;color:var(--violet);text-decoration:none;font-size:13px;font-weight:600;margin-bottom:20px}
.l-hdr{margin-bottom:28px}
.l-hdr h1{font-family:'Exo 2',sans-serif;font-weight:900;font-size:24px;margin-bottom:6px;background:linear-gradient(135deg,var(--text),var(--violet));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.l-meta{font-size:12px;color:var(--text2)}
.l-sec{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r);padding:20px;margin-bottom:14px}
.l-sec h2{font-family:'Exo 2',sans-serif;font-weight:700;font-size:16px;color:var(--violet);margin-bottom:10px}
.l-sec h3{font-family:'Exo 2',sans-serif;font-weight:600;font-size:14px;color:var(--text);margin:12px 0 6px}
.l-sec p{font-size:13px;color:var(--text2);line-height:1.65;margin-bottom:8px}
.l-sec ul{padding-left:18px;margin-bottom:8px}
.l-sec li{font-size:13px;color:var(--text2);line-height:1.6;margin-bottom:4px}
.l-sec a{color:var(--violet)}
@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}
