:root{--primary: #3390ec;--primary-hover: #2787e7;--primary-press: #1d7ddb;--primary-light: #eef6ff;--primary-glow: rgba(51, 144, 236, .32);--text: #0f1419;--text-secondary: #707579;--text-tertiary: #a8a8a8;--border: #dadce0;--border-strong: #b8bcc0;--border-focus: #3390ec;--error: #e53935;--error-bg: #fdecea;--success: #4dba6c;--bg: #ffffff;--bg-soft: #f4f4f5;--bg-page: #ffffff;--bg-hover: rgba(112, 117, 121, .08);--bg-active: rgba(112, 117, 121, .16);--radius: 10px;--radius-lg: 14px;--radius-modal: 16px;--shadow-1: 0 1px 2px rgba(0, 0, 0, .06);--shadow-card: 0 1px 4px rgba(0, 0, 0, .04), 0 10px 30px rgba(0, 0, 0, .06);--shadow-modal: 0 24px 60px rgba(0, 0, 0, .22);--ease: cubic-bezier(.4, 0, .2, 1);--ease-out: cubic-bezier(.2, .7, .2, 1);--ease-bounce: cubic-bezier(.34, 1.56, .64, 1);--transition: .18s var(--ease);--transition-slow: .26s var(--ease)}@media (prefers-color-scheme: dark){:root{--primary: #3390ec;--primary-hover: #4ba0ee;--primary-press: #5db2f3;--primary-light: rgba(51, 144, 236, .14);--primary-glow: rgba(51, 144, 236, .45);--text: #ffffff;--text-secondary: #aaaaaa;--text-tertiary: #707579;--border: #2c2c2c;--border-strong: #3a3a3a;--error-bg: rgba(229, 57, 53, .16);--bg: #212121;--bg-soft: #1a1a1a;--bg-page: #212121;--bg-hover: rgba(255, 255, 255, .06);--bg-active: rgba(255, 255, 255, .1)}}*,*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;padding:0;min-height:100%}body{font-family:Roboto,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;font-size:14px;line-height:1.45;color:var(--text);background:var(--bg-page);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}button,input{font-family:inherit}::selection{background:var(--primary-light);color:var(--primary)}.app{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 16px;background:var(--bg-page)}.card{position:relative;z-index:1;width:100%;max-width:360px;display:flex;flex-direction:column;align-items:center}.card-title{font-size:26px;line-height:1.18;font-weight:500;letter-spacing:-.01em;margin:20px 0 8px;text-align:center;color:var(--text)}.card-subtitle{margin:0 0 28px;color:var(--text-secondary);font-size:14px;line-height:1.45;text-align:center;max-width:320px;white-space:pre-line}.card-subtitle strong{color:var(--text);font-weight:500;white-space:nowrap}.step{display:flex;flex-direction:column;align-items:center;width:100%;animation:step-in .28s var(--ease-out)}.step[data-shake=true]{animation:shake .42s var(--ease)}@keyframes step-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes shake{0%,to{transform:translate(0)}15%{transform:translate(-8px)}30%{transform:translate(8px)}45%{transform:translate(-6px)}60%{transform:translate(6px)}75%{transform:translate(-3px)}90%{transform:translate(3px)}}.logo{position:relative;width:140px;height:140px;display:flex;align-items:center;justify-content:center;animation:logo-in .62s var(--ease-bounce),logo-float 5s ease-in-out .7s infinite;transition:filter var(--transition),opacity var(--transition)}.logo svg{width:100%;height:100%}.logo-halo{position:absolute;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle,var(--primary-glow) 0%,transparent 70%);filter:blur(22px);opacity:.55;pointer-events:none;z-index:-1}.logo-dim{filter:grayscale(.4) brightness(.92);opacity:.88}@keyframes logo-in{0%{opacity:0;transform:scale(.55)}to{opacity:1;transform:scale(1)}}@keyframes logo-float{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@media (prefers-reduced-motion: reduce){.logo,.step,.check-circle,.check-path,.qr-wrap{animation:none!important}.check-circle circle,.check-path{stroke-dashoffset:0!important}}form{width:100%;display:flex;flex-direction:column}.field{position:relative;width:100%;margin-bottom:18px}.field input{width:100%;height:48px;padding:11px 18px;font-size:16px;line-height:20px;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);outline:none;transition:border-color .15s ease,box-shadow .15s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none;caret-color:var(--primary)}.field input:hover:not(:disabled):not(:focus){border-color:var(--primary)}.field input:disabled{color:var(--text-tertiary);background:var(--bg-soft);cursor:not-allowed}.field input:focus{border-color:var(--primary);box-shadow:inset 0 0 0 1px var(--primary)}.field input::placeholder{color:transparent}.field label{position:absolute;left:8px;top:11px;transform-origin:left center;pointer-events:none;color:var(--text-secondary);font-size:16px;line-height:20px;background:var(--bg);padding:0 8px;border-radius:16px;white-space:nowrap;transition:transform .15s ease-out,color .15s ease-out}.field input:focus+label,.field input:not(:placeholder-shown)+label,.field.has-value label{transform:scale(.75) translateY(-1.6rem)}.field input:hover:not(:disabled)+label{color:var(--primary)}.field input:focus+label{color:var(--primary)}.field.error input{border-color:var(--error);box-shadow:inset 0 0 0 1px var(--error)}.field.error input:focus+label,.field.error.has-value label{color:var(--error)}.field-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:36px;height:36px;border:none;background:transparent;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;margin:0;padding:0;color:var(--text-tertiary);transition:background var(--transition),color var(--transition),transform .12s var(--ease)}.field-toggle:hover{background:var(--bg-hover);color:var(--text-secondary)}.field-toggle:active{transform:translateY(-50%) scale(.92)}.country-trigger{position:relative;margin-bottom:18px}.country-trigger-btn{width:100%;height:48px;padding:11px 44px 11px 18px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);font-size:16px;line-height:20px;color:var(--text);text-align:left;cursor:pointer;display:flex;align-items:center;gap:12px;transition:border-color .15s ease,box-shadow .15s ease;margin:0}.country-trigger-btn:hover:not(:disabled){border-color:var(--primary)}.country-trigger-btn:focus-visible,.country-trigger.is-open .country-trigger-btn{outline:none;border-color:var(--primary);box-shadow:inset 0 0 0 1px var(--primary)}.country-trigger-btn:disabled{color:var(--text-tertiary);background:var(--bg-soft);cursor:not-allowed}.country-trigger.error .country-trigger-btn{border-color:var(--error);box-shadow:inset 0 0 0 1px var(--error)}.country-trigger-flag{font-size:22px;line-height:1;flex:0 0 auto}.country-trigger-name{flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}.country-trigger-chevron{position:absolute;right:16px;top:50%;transform:translateY(-50%);color:var(--text-tertiary);pointer-events:none;transition:transform var(--transition)}.country-trigger label{position:absolute;left:8px;top:11px;transform-origin:left center;pointer-events:none;color:var(--text-secondary);font-size:16px;line-height:20px;background:var(--bg);padding:0 8px;border-radius:16px;white-space:nowrap;transition:transform .15s ease-out,color .15s ease-out}.country-trigger.has-value label,.country-trigger.is-open label,.country-trigger:focus-within label{transform:scale(.75) translateY(-1.6rem)}.country-trigger.is-open label,.country-trigger:focus-within label{color:var(--primary)}.country-trigger.error label,.country-trigger.error.has-value label{color:var(--error)}.country-trigger.is-open .country-trigger-chevron{transform:translateY(-50%) rotate(180deg)}.country-pop{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:50;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-modal);display:flex;flex-direction:column;overflow:hidden;max-height:340px;animation:pop-in .2s var(--ease-out)}@keyframes pop-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.country-sheet-backdrop{display:none}.country-search{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--border);color:var(--text-tertiary)}.country-search>svg:first-child{flex:0 0 auto}.country-search input{flex:1 1 auto;height:32px;background:transparent;border:none;outline:none;font-size:15px;color:var(--text)}.country-search input::placeholder{color:var(--text-tertiary)}.country-search-clear{flex:0 0 auto;width:26px;height:26px;background:transparent;border:none;border-radius:50%;cursor:pointer;color:var(--text-tertiary);display:flex;align-items:center;justify-content:center;margin:0;padding:0;transition:background var(--transition),color var(--transition)}.country-search-clear:hover{background:var(--bg-hover);color:var(--text-secondary)}.country-list{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;padding:4px 0 6px;-webkit-overflow-scrolling:touch}.country-item{width:100%;display:flex;align-items:center;gap:14px;padding:10px 14px;background:transparent;border:none;cursor:pointer;font-family:inherit;font-size:15px;color:var(--text);text-align:left;transition:background 80ms var(--ease);margin:0;border-radius:0;height:auto}.country-item:hover{background:var(--bg-hover)}.country-item.selected{background:var(--primary-light)}.country-flag{font-size:22px;line-height:1;flex:0 0 auto}.country-name{flex:1 1 auto;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.country-code{flex:0 0 auto;color:var(--text-secondary);font-variant-numeric:tabular-nums;font-size:14px}.country-empty{padding:28px 16px;text-align:center;color:var(--text-tertiary);font-size:14px}@media (max-width: 480px){.country-sheet-backdrop{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:99;background:#0f141973;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:backdrop-in .2s ease-out}.country-pop{position:fixed;inset:auto 0 0 0;top:auto;z-index:100;max-height:80vh;border-radius:var(--radius-modal) var(--radius-modal) 0 0;border:none;padding-top:18px;animation:sheet-up .28s var(--ease-out)}.country-pop:before{content:"";position:absolute;top:6px;left:50%;transform:translate(-50%);width:36px;height:4px;border-radius:2px;background:var(--text-tertiary);opacity:.45}@keyframes sheet-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes backdrop-in{0%{opacity:0}to{opacity:1}}}@media (prefers-color-scheme: dark){.country-sheet-backdrop{background:#0009}}.code-input{display:flex;gap:10px;justify-content:center;margin-bottom:16px;width:100%}.code-input input{width:52px;height:60px;text-align:center;font-size:26px;font-weight:500;color:var(--text);background:transparent;border:1px solid var(--border);border-radius:var(--radius);outline:none;transition:border-color var(--transition),border-width var(--transition),background var(--transition),transform var(--transition);-webkit-appearance:none;-moz-appearance:none;appearance:none;caret-color:var(--primary)}.code-input input:hover:not(:disabled):not(:focus){border-color:var(--border-strong)}.code-input input:focus{border-color:var(--border-focus);border-width:2px}.code-input input:not(:placeholder-shown):not(:focus){background:var(--primary-light);border-color:var(--primary)}.code-input.error input{border-color:var(--error);border-width:2px;animation:cell-shake .36s var(--ease)}@keyframes cell-shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}50%{transform:translate(4px)}75%{transform:translate(-2px)}}.btn{width:100%;height:54px;padding:0 20px;font-size:15px;font-weight:500;letter-spacing:.01em;border:none;border-radius:var(--radius);cursor:pointer;transition:background var(--transition),color var(--transition),transform .12s var(--ease),box-shadow var(--transition);display:flex;align-items:center;justify-content:center;gap:10px;margin-top:6px;-webkit-tap-highlight-color:transparent}.btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--primary-glow)}.btn-primary{background:var(--primary);color:#fff;box-shadow:0 1px 2px #3390ec2e,0 6px 16px #3390ec24}.btn-primary:hover:not(:disabled){background:var(--primary-hover)}.btn-primary:active:not(:disabled){background:var(--primary-press);transform:translateY(1px);box-shadow:0 1px 2px #3390ec26}.btn-primary:disabled{background:var(--primary);opacity:.55;cursor:not-allowed;box-shadow:none}.btn-secondary{background:transparent;color:var(--primary);margin-top:2px;height:48px}.btn-secondary:hover:not(:disabled){background:var(--primary-light)}.btn-secondary:active:not(:disabled){background:var(--primary-light);transform:translateY(1px)}.btn-secondary:disabled{color:var(--text-tertiary);cursor:not-allowed}.spinner{width:18px;height:18px;border:2px solid rgba(255,255,255,.32);border-top-color:#fff;border-radius:50%;animation:spin .72s linear infinite}.spinner-dark{border-color:#3390ec33;border-top-color:var(--primary);width:28px;height:28px}@keyframes spin{to{transform:rotate(360deg)}}.phone-sending{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:8px;height:54px;color:var(--text-secondary);font-size:14px;animation:step-in .2s ease-out}.phone-sending .spinner{width:18px;height:18px}.error-msg{width:100%;margin-top:12px;padding:10px 14px;background:var(--error-bg);border-radius:var(--radius);color:var(--error);font-size:13px;line-height:1.45;animation:step-in .22s ease-out}.qr-step{padding-top:4px}.qr-wrap{position:relative;width:232px;height:232px;padding:16px;border-radius:22px;background:var(--bg);border:1px solid var(--border);box-shadow:var(--shadow-card);display:flex;align-items:center;justify-content:center;color:var(--text);margin-bottom:24px;animation:qr-in .36s var(--ease-bounce);transition:filter var(--transition)}@keyframes qr-in{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.qr-wrap[data-accepted=true]{filter:blur(2px) brightness(1.04)}.qr-wrap svg{width:100%;height:100%;display:block}.qr-placeholder{display:flex;flex-direction:column;align-items:center;gap:14px;color:var(--text-secondary);font-size:14px;text-align:center;padding:16px}.qr-accepted-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#ffffffb8;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:22px;color:var(--success);animation:step-in .22s ease-out}@media (prefers-color-scheme: dark){.qr-accepted-overlay{background:#212121b8}}.qr-accepted-overlay svg{width:84px;height:84px}.qr-accepted-overlay path{stroke-dasharray:60;stroke-dashoffset:60;animation:draw-check .46s .1s var(--ease) forwards}@keyframes draw-check{to{stroke-dashoffset:0}}.qr-steps{list-style:none;padding:0;margin:0 0 22px;width:100%;max-width:320px;display:flex;flex-direction:column;gap:12px}.qr-steps li{position:relative;padding-left:36px;font-size:14px;color:var(--text);line-height:1.45;text-align:left}.qr-num{position:absolute;left:0;top:1px;width:24px;height:24px;border-radius:50%;background:var(--primary-light);color:var(--primary);font-size:12.5px;font-weight:600;display:flex;align-items:center;justify-content:center}.qr-status{margin:-6px 0 14px;color:var(--success);font-size:14px;font-weight:500;text-align:center;animation:step-in .22s ease-out}.step.success{display:flex;flex-direction:column;align-items:center;gap:18px;padding:8px 0}.check-circle{width:84px;height:84px;color:var(--success);animation:check-pop .38s cubic-bezier(.175,.885,.32,1.275) both}.check-circle svg{width:100%;height:100%;display:block;overflow:visible}.check-circle circle{stroke:currentColor;stroke-width:3;fill:none;stroke-dasharray:158;stroke-dashoffset:158;transform-origin:50% 50%;transform:rotate(-90deg);animation:check-circle-draw .42s ease-out 80ms forwards}.check-path{stroke-dasharray:38;stroke-dashoffset:38;animation:check-path-draw .32s ease-out .32s forwards}.step.success .card-title{margin:0;text-align:center}@keyframes check-pop{0%{opacity:0;transform:scale(.55)}to{opacity:1;transform:scale(1)}}@keyframes check-circle-draw{to{stroke-dashoffset:0}}@keyframes check-path-draw{to{stroke-dashoffset:0}}@media (max-width: 400px){.card{max-width:100%}.logo{width:124px;height:124px}.card-title{font-size:24px;margin-top:16px}.card-subtitle{font-size:13.5px;margin-bottom:24px}.field input,.country-trigger-btn,.btn{height:52px}.btn-secondary{height:46px}.code-input{gap:6px}.code-input input{width:46px;height:54px;font-size:22px}.qr-wrap{width:208px;height:208px;padding:12px;border-radius:18px}.qr-steps li{font-size:13.5px}}@media (max-width: 340px){.code-input input{width:40px;height:48px;font-size:20px}}
