:root{--bg:#0b141a;--card:#202c33;--text:#e9edef;--sub:#849aab;--accent:#00a884;--border:#2b3c43}
:root.light{--bg:#f0f2f5;--card:#fff;--text:#41525d;--sub:#6c7a85;--accent:#222;--border:#d1d7db}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:Outfit,system-ui,sans-serif;padding-top:64px;transition:background .3s,color .3s}
.wrap{max-width:780px;margin:0 auto;padding:0 16px}
.nav{position:fixed;inset:0 0 auto 0;height:64px;background:var(--card);border-bottom:1px solid var(--border);z-index:10}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{font-weight:700;font-size:1.25rem;color:var(--text);text-decoration:none}
.icon-btn{background:none;border:1px solid var(--border);color:var(--text);border-radius:8px;width:38px;height:38px;font-size:1.1rem;cursor:pointer}
.hero{background:var(--card);border-bottom:1px solid var(--border);padding:36px 0 32px}
.tag{display:inline-block;background:rgba(0,168,132,.2);color:var(--accent);padding:6px 14px;border-radius:99px;font-size:.85rem;font-weight:600}
:root.light .tag{background:rgba(34,34,34,.1)}
h1{font-size:1.7rem;line-height:1.2;margin:14px 0 10px}
.hero p{color:var(--sub);margin:0 0 18px}
section{margin-top:28px}
h2{font-size:1.15rem;margin:0 0 12px}
.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:12px}
.head{display:flex;align-items:center;gap:12px}
.logo{width:48px;height:48px;border-radius:12px;background:#fff;display:grid;place-items:center;overflow:hidden;flex:none}
.logo img{width:100%;height:100%;object-fit:contain;padding:6px}
.logo.fb{color:#fff;font-weight:700;font-size:1rem}
.head b{font-size:1.05rem}
.num{font-family:'Courier New',monospace;font-size:1.2rem;letter-spacing:.5px;word-break:break-all}
.num.soon{font-family:inherit;color:var(--sub);font-size:1rem}
.who{font-size:.85rem;color:var(--sub)}
.btn,.copy{border:0;border-radius:10px;padding:10px 14px;font:inherit;font-weight:600;cursor:pointer;background:var(--accent);color:#fff;text-align:center;text-decoration:none;display:inline-block}
:root.light .btn,:root.light .copy{background:#222}
.copy:disabled{opacity:.4;cursor:not-allowed}
.copy.ok{background:#198754}
.note{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:18px;margin-bottom:28px}
.note h3{margin:0 0 8px}.note ol{margin:0 0 14px;padding-left:20px;color:var(--sub);line-height:1.7}
.foot{border-top:1px solid var(--border);background:var(--card);color:var(--sub);padding:18px 0;font-size:.9rem}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:var(--accent);color:#fff;padding:10px 18px;border-radius:10px;opacity:0;pointer-events:none;transition:.25s}
.toast.show{opacity:1;transform:translate(-50%,0)}
[hidden]{display:none!important}

.qbox{background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:hidden}
.qbox details+details{border-top:1px solid var(--border)}
.qbox summary{cursor:pointer;padding:14px 16px;font-weight:600;color:var(--accent);list-style:none;display:flex;justify-content:space-between}
.qbox summary::-webkit-details-marker{display:none}
.qbox summary::after{content:"\25BE";transition:.2s}
.qbox details[open]>summary::after{transform:rotate(180deg)}
.qbody{padding:0 16px 16px;display:flex;flex-direction:column;align-items:center;gap:14px}
.qimg{width:100%;max-width:420px;border-radius:12px;background:#fff;border:1px solid var(--border)}
.info{width:100%;max-width:420px;border-collapse:collapse;font-size:.95rem}
.info td{padding:10px 8px;border-bottom:1px solid var(--border)}.info td:last-child{text-align:right;font-weight:600}
.warn{margin:0;background:var(--bg);border-radius:10px;padding:12px;color:var(--sub);text-align:center;max-width:420px;font-size:.92rem}
.chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.chips span{border:1px solid var(--border);background:var(--bg);border-radius:8px;padding:6px 10px;font-size:.85rem;font-weight:500}
.steps{align-self:stretch;margin:0;padding-left:20px;color:var(--sub);line-height:1.7}

.switch{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:.95rem;user-select:none}
.switch input{position:absolute;opacity:0}
.track{width:2.4em;height:1.25em;border-radius:99px;background:var(--bg);border:1px solid var(--border);position:relative;transition:.2s}
.track i{position:absolute;top:50%;left:.15em;width:.9em;height:.9em;margin-top:-.45em;border-radius:50%;background:var(--sub);transition:.2s}
.switch input:checked+.track{background:var(--accent);border-color:var(--accent)}
:root.light .switch input:checked+.track{background:#222;border-color:#222}
.switch input:checked+.track i{left:1.35em;background:#fff}
.switch input:focus-visible+.track{outline:2px solid var(--accent);outline-offset:2px}
.apps{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:10px;width:100%}
.app{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font-size:.75rem;color:var(--sub)}
.app .logo{width:56px;height:56px;border:1px solid var(--border)}

#loader{position:fixed;inset:0;z-index:100;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;transition:opacity .45s,visibility .45s}
#loader.done{opacity:0;visibility:hidden}
.ld{position:relative;width:84px;height:84px;display:grid;place-items:center;color:var(--accent)}
:root.light .ld{color:#222}
.ring{position:absolute;inset:0;border-radius:50%;border:3px solid var(--border);border-top-color:var(--accent);animation:spin 1s linear infinite}
:root.light .ring{border-top-color:#222}
.ico{animation:pulse 1.4s ease-in-out infinite}
.ld-t{margin:0;font-weight:500;color:var(--text)}
.dots i{font-style:normal;animation:blink 1.2s infinite}.dots i:nth-child(2){animation-delay:.2s}.dots i:nth-child(3){animation-delay:.4s}
.bar{width:160px;height:4px;border-radius:99px;background:var(--border);overflow:hidden}
.bar span{display:block;height:100%;width:40%;border-radius:99px;background:var(--accent);animation:slide 1.2s ease-in-out infinite}
:root.light .bar span{background:#222}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.15)}}
@keyframes blink{0%,100%{opacity:.2}50%{opacity:1}}
@keyframes slide{0%{transform:translateX(-100%)}100%{transform:translateX(260%)}}
@media (prefers-reduced-motion:reduce){.ring,.ico,.bar span,.dots i{animation-duration:3s}}

.foot{padding:26px 0 18px}
.fgrid{display:grid;gap:22px;grid-template-columns:1fr}
@media(min-width:640px){.fgrid{grid-template-columns:1fr 1.4fr}}
.foot h4{margin:0 0 10px;color:var(--text);font-size:1rem}
.flist,.terms{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.flist a{color:var(--accent);text-decoration:none}
:root.light .flist a{color:#222;text-decoration:underline}
.terms li{position:relative;padding-left:16px;line-height:1.5}
.terms li::before{content:"\2022";position:absolute;left:3px;color:var(--accent)}
.copy-line{margin-top:20px;padding-top:14px;border-top:1px solid var(--border);text-align:center}