:root{--bg: #DCEBEA;--text: #111111;--menu-bg: #000000}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:Arial,sans-serif;background:var(--bg);color:var(--text)}.hero{height:100vh;display:flex;align-items:center;justify-content:center}.cta{padding:16px 28px;font-size:18px;border:0;border-radius:999px;background:#111;color:#fff;cursor:pointer}.overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#00000059;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s ease,visibility 0s linear .25s}.overlay.is-open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .25s ease}.menu{width:min(92vw,1400px);height:min(84vh,780px);background:var(--menu-bg);border-radius:32px;position:relative;transform-origin:var(--origin-x, 50%) var(--origin-y, 50%);transform:translateY(10px) scale(.98);opacity:0;transition:transform .28s cubic-bezier(.34,1.56,.64,1),opacity .28s ease}.overlay.is-open .menu{transform:translateY(0) scale(1);opacity:1}.menu-content{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:48px;color:#fff;text-align:center;position:relative}.panels{width:100%;height:auto;display:flex;align-items:center;justify-content:center;margin-top:0}.toggle{width:360px;display:inline-flex;background:#000;padding:6px;border-radius:999px;gap:6px;position:relative;margin:0 0 24px;overflow:hidden}.toggle-btn{border:0;width:50%;padding:10px 0;border-radius:999px;background:transparent;color:#fff;mix-blend-mode:difference;opacity:.7;font-size:14px;cursor:pointer;position:relative;z-index:1;transition:opacity .22s ease}.toggle-btn.is-active{opacity:1;color:#fff}.toggle:before{content:"";position:absolute;top:6px;left:6px;width:calc(50% - 6px);height:calc(100% - 12px);background:#fff;border-radius:999px;transform:translate(0);transition:transform .18s cubic-bezier(.34,1.56,.64,1)}.toggle.is-register:before{transform:translate(100%)}.panel{display:none;flex-direction:column;gap:22px;width:min(560px,100%);min-width:0}.panel.is-active{display:flex}.panel-register .token-step{display:flex;flex-direction:column;gap:22px}.panel-register .register-step{display:none;flex-direction:column;gap:22px;min-height:180px}.panel-register.is-verified .token-step{display:none}.panel-register.is-verified .register-step{display:flex}.panel-fields{display:flex;flex-direction:column;gap:22px;margin-top:0;width:min(420px,100%);margin-left:auto;margin-right:auto}.register-step .panel-fields{margin-top:0}.phone-row,.name-row{display:flex;gap:12px;width:100%}.phone-row .field{margin:0}.name-row .field{margin:0;flex:1}.field-code{max-width:160px}.field-number{flex:1}.field-code .code-trigger{width:100%;height:48px;padding:12px 34px 12px 14px;border-radius:12px}.panel-register .field input,.panel-login .field input{height:48px}.code-dropdown{position:relative;width:100%}.code-trigger{width:100%;padding:12px 34px 12px 14px;border-radius:12px;border:0;background:#000;color:#fff;outline:none;font-size:16px;font-weight:400;cursor:pointer;text-align:left;position:relative}.code-trigger:after{content:"";position:absolute;right:12px;top:50%;width:6px;height:6px;border-right:1.5px solid #ffffff;border-bottom:1.5px solid #ffffff;transform:translateY(-60%) rotate(45deg);transition:transform .2s ease}.code-options{position:absolute;left:0;right:0;top:calc(100% + 6px);background:#000;border:0;border-radius:12px;max-height:0;overflow:hidden;padding:8px;opacity:0;transform:translateY(-6px) scaleY(.96);transform-origin:top;pointer-events:none;transition:opacity .14s ease,transform .18s ease,max-height .18s ease;z-index:10}.code-dropdown.is-open .code-options{max-height:220px;overflow-y:auto;opacity:1;transform:translateY(0) scaleY(1);pointer-events:auto}.code-dropdown.is-open .code-trigger{border:0}.code-dropdown.is-open .code-trigger:after{transform:translateY(-40%) rotate(-135deg)}.code-option{width:100%;text-align:left;padding:10px;border:0;background:#000;margin-bottom:6px;color:#d9d9d9;border-radius:8px;cursor:pointer;font-size:14px}.code-option:hover,.code-option.is-selected{background:#0b0b0b;color:#fff}.code-option:last-child{margin-bottom:0}.panel-actions{display:flex;flex-direction:column;gap:12px;align-items:stretch;width:min(420px,100%);margin-left:auto;margin-right:auto}.strength{width:380px;display:flex;flex-direction:column;gap:8px;margin-top:8px;opacity:0;max-height:0;overflow:hidden;transition:opacity .18s ease,max-height .18s ease}.strength.is-visible{opacity:1;max-height:200px}.strength-bar{height:6px;background:#2a2a2a;border-radius:999px;overflow:hidden}.strength-fill{height:100%;width:0%;background:#e53935;transition:width .22s ease,background .22s ease}.strength-rules{display:flex;flex-direction:row;flex-wrap:wrap;gap:10px;font-size:12px}.rule{color:#e53935;transition:color .16s ease}.rule.is-ok{color:#9ad29a}.panel-register .field{text-align:left}.panel-register .field input{margin:0;text-align:left}.panel-register .check{justify-content:flex-start;text-align:left}.token-error{margin:6px 0 0;font-size:12px;color:#e53935;display:none}.token-error.is-visible{display:block}.register-error{margin:4px 0 0;font-size:12px;color:#e53935}.register-error.is-success{color:#43a047}.field{display:flex;flex-direction:column;gap:8px;font-size:16px;color:#d0d0d0;text-align:left;width:100%}.field input{width:100%;padding:12px 16px;border-radius:12px;border:1px solid #2a2a2a;background:#000;color:#fff;outline:none;font-size:16px;font-weight:400}.field select{width:100%;padding:12px 14px;border-radius:12px;border:1px solid #2a2a2a;background:#000;color:#fff;outline:none;font-size:16px;font-weight:400;appearance:none;background-image:linear-gradient(45deg,transparent 50%,#ffffff 50%),linear-gradient(135deg,#ffffff 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 12px) 50%;background-size:6px 6px,6px 6px;background-repeat:no-repeat}.phone-row .field input{width:100%}.field input::placeholder{color:#6f6f6f}.field.field-readonly input[readonly]{cursor:default;border-color:#303030;background:#090909;color:#f1f1f1}.input-wrap{position:relative;width:100%}.input-wrap input{width:100%;padding-right:44px}.eye{position:absolute;right:12px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:#bdbdbd;font-size:16px;cursor:pointer}.eye svg{width:18px;height:18px;display:block}.eye .eye-outline,.eye .eye-pupil{fill:none;stroke:currentColor;stroke-width:1.8;transition:opacity .2s ease}.eye .eye-pupil{fill:currentColor;stroke:none}.eye .eye-slash{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;opacity:0;transform-origin:50% 50%;transform:scale(.9);transition:opacity .22s ease,transform .22s ease}.eye.is-open .eye-slash{opacity:1;transform:scale(1)}.action-btn{margin-top:6px;width:100%;padding:10px 16px;border-radius:12px;border:0;background:#fff;color:#111;font-size:16px;font-weight:400;cursor:pointer}.action-btn:disabled{opacity:.5;cursor:not-allowed}.check{display:flex;align-items:center;gap:10px;font-size:14px;color:#d0d0d0}.check input{width:16px;height:16px;accent-color:#2f6dff}.check input:checked+span{color:#fff}.close{position:absolute;top:8px;left:8px;right:auto;width:48px;height:48px;border-radius:50%;border:0;background:transparent;color:#fff;font-size:32px;font-weight:100;line-height:1;cursor:pointer}.close:hover,.close:active{background:transparent;color:#fff}