*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;color:inherit}:root{--bg: var(--tg-theme-bg-color, #ffffff);--bg-secondary: var(--tg-theme-secondary-bg-color, #f0f0f0);--text: var(--tg-theme-text-color, #000000);--hint: var(--tg-theme-hint-color, #999999);--link: var(--tg-theme-link-color, #2481cc);--btn: var(--tg-theme-button-color, #2481cc);--btn-text: var(--tg-theme-button-text-color, #ffffff);--accent: var(--btn);--danger: #ff3b30;--success: #34c759;--radius: 12px;--radius-sm: 8px;--shadow: 0 2px 12px rgba(0, 0, 0, .08)}button,input,select,textarea{color:var(--text);font-family:inherit;font-size:inherit}html,body{height:100%;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}#root{height:100%}.app-shell{display:flex;flex-direction:column;height:100vh;height:100dvh}.app-content{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding-bottom:80px}.page{padding:16px;max-width:600px;margin:0 auto}.page-header{margin-bottom:20px}.page-title{font-size:22px;font-weight:700}.welcome{font-size:20px;font-weight:700;margin-bottom:4px}.service-name{font-size:14px;color:var(--hint);margin-bottom:16px}.bottom-nav{position:fixed;bottom:0;left:0;right:0;height:60px;background:var(--bg);border-top:1px solid rgba(0,0,0,.1);display:flex;align-items:center;justify-content:space-around;padding-bottom:env(safe-area-inset-bottom);z-index:100}.nav-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 16px;border:none;background:none;cursor:pointer;color:var(--hint);transition:color .2s;min-width:64px}.nav-item--active{color:var(--accent)}.nav-icon{font-size:20px;line-height:1}.nav-label{font-size:10px;font-weight:500}.card{background:var(--bg-secondary);border-radius:var(--radius);padding:16px;margin-bottom:12px}.balance-card{background:linear-gradient(135deg,var(--accent) 0%,#1a6db5 100%);color:#fff}.balance-row{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.balance-label{font-size:12px;opacity:.8;margin-bottom:4px}.balance-amount{font-size:28px;font-weight:700}.balance-days{font-size:20px;font-weight:700}.balance-days--low{color:#fc0}.balance-cost{font-size:14px;opacity:.9;margin-bottom:4px}.balance-end-date{font-size:12px;opacity:.7;margin-bottom:12px}.chips-row{display:flex;flex-wrap:wrap;gap:8px}.client-id{font-size:12px;color:var(--hint);margin-top:2px}.chip{background:#fff3;color:#fff;border-radius:20px;padding:4px 12px;font-size:12px;font-weight:500}.chip--active{background:#ffffff59}.chip--inactive{background:#ffffff14;opacity:.55}.chip--premium{background:#fc06}.chip--btn{border:none;cursor:pointer;-webkit-tap-highlight-color:transparent}.chip--btn:active{opacity:.7}.setup-section-label{font-size:12px;color:var(--hint);text-align:center;margin-top:4px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:none;border-radius:var(--radius-sm);padding:10px 16px;font-size:15px;font-weight:600;cursor:pointer;transition:opacity .15s,transform .1s;-webkit-tap-highlight-color:transparent}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:default}.btn--primary{background:var(--btn);color:var(--btn-text)}.btn--secondary{background:var(--bg-secondary);color:var(--text)}.btn--danger{background:var(--danger);color:#fff}.btn--full{width:100%;margin-top:12px}.btn--sm{padding:6px 12px;font-size:13px}.device-card{padding:14px}.device-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.device-name{font-weight:600;font-size:15px}.device-key{background:var(--bg);border-radius:var(--radius-sm);padding:8px 12px;margin-bottom:10px;overflow:hidden}.key-text{font-family:monospace;font-size:12px;color:var(--hint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}.device-actions{display:flex;gap:8px;flex-wrap:wrap}.devices-count{font-size:14px;color:var(--hint);margin-top:4px}.empty-state{text-align:center;padding:40px 20px;color:var(--hint)}.empty-icon{font-size:48px;margin-bottom:12px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:flex-end;justify-content:center;z-index:200}.modal-content{background:var(--bg);border-radius:var(--radius) var(--radius) 0 0;padding:20px;width:100%;max-width:500px}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.modal-header h3{font-size:17px;font-weight:600}.modal-close{border:none;background:none;font-size:20px;cursor:pointer;color:var(--hint);padding:4px 8px}.qr-wrapper{display:flex;justify-content:center;padding:16px 0}.qr-hint{text-align:center;color:var(--hint);font-size:13px;margin-top:8px}.steps-indicator{display:flex;gap:8px;margin-bottom:24px}.step-dot{height:4px;flex:1;background:var(--bg-secondary);border-radius:2px;transition:background .3s}.step-dot--active{background:var(--accent)}.section-title{font-size:16px;font-weight:600;margin-bottom:16px;color:var(--hint);text-transform:uppercase;letter-spacing:.5px;font-size:13px}.platforms-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.platform-btn{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 8px;background:var(--bg-secondary);border:none;border-radius:var(--radius);cursor:pointer;transition:background .2s}.platform-btn:active{background:var(--accent);color:#fff}.platform-icon{font-size:28px}.platform-name{font-size:12px;font-weight:500}.clients-list{display:flex;flex-direction:column;gap:10px}.client-btn{padding:14px 16px;background:var(--bg-secondary);border:none;border-radius:var(--radius);font-size:16px;font-weight:500;text-align:left;cursor:pointer}.client-btn:active{background:var(--accent);color:#fff}.tabs{display:flex;gap:0;background:var(--bg-secondary);border-radius:var(--radius-sm);padding:4px;margin-bottom:20px}.tab{flex:1;padding:8px;border:none;border-radius:6px;background:none;font-size:13px;font-weight:500;cursor:pointer;color:var(--hint);transition:all .2s}.tab--active{background:var(--bg);color:var(--text);box-shadow:0 1px 4px #0000001a}.setup-tab{display:flex;flex-direction:column;gap:12px}.setup-hint{color:var(--hint);font-size:14px;text-align:center}.setup-note{color:var(--hint);font-size:12px;text-align:center}.key-display{background:var(--bg-secondary);border-radius:var(--radius-sm);padding:12px;display:flex;align-items:center;justify-content:space-between;gap:8px}.key-text-full{font-family:monospace;font-size:12px;word-break:break-all;flex:1}.back-btn{border:none;background:none;color:var(--accent);font-size:15px;cursor:pointer;padding:0;margin-bottom:8px;display:block}.mode-toggle{display:flex;gap:0;background:var(--bg);border-radius:var(--radius-sm);padding:3px;margin-bottom:16px}.mode-btn{flex:1;padding:8px;border:none;border-radius:6px;background:none;font-size:14px;cursor:pointer;color:var(--hint);transition:all .2s}.mode-btn--active{background:var(--bg-secondary);color:var(--text);font-weight:600}.stepper{display:flex;align-items:center;justify-content:center;gap:20px;margin-bottom:12px}.stepper-btn{width:40px;height:40px;border-radius:50%;border:none;background:var(--bg);font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center}.stepper-value{font-size:18px;font-weight:600;min-width:80px;text-align:center}.calc-result{text-align:center}.calc-total{font-size:28px;font-weight:700;color:var(--accent)}.calc-per{color:var(--hint);font-size:13px}.input-group{position:relative}.amount-input{width:100%;padding:12px 40px 12px 16px;border:2px solid var(--bg);border-radius:var(--radius-sm);background:var(--bg);font-size:18px;color:var(--text);outline:none}.amount-input:focus{border-color:var(--accent)}.input-suffix{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--hint);font-size:18px}.payment-methods{display:flex;flex-direction:column;gap:10px}.payment-card{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--bg-secondary);border:none;border-radius:var(--radius);cursor:pointer;transition:opacity .2s;text-align:left;width:100%}.payment-card--disabled{opacity:.5;cursor:default;color:var(--hint)}.payment-icon{font-size:28px}.payment-info{flex:1}.payment-name{font-size:15px;font-weight:600;display:flex;align-items:center;gap:8px}.payment-desc{font-size:13px;color:var(--hint)}.payment-arrow{color:var(--hint);font-size:20px}.badge-soon{background:var(--accent);color:#fff;font-size:10px;font-weight:700;padding:2px 6px;border-radius:4px}.tariff-card{margin-bottom:14px}.tariff-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.tariff-emoji{font-size:22px}.tariff-name{font-size:17px;font-weight:700}.tariff-features{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px;font-size:13px;color:var(--hint)}.period-selector{display:flex;gap:6px;margin-bottom:12px}.period-btn{flex:1;padding:6px;border:2px solid var(--bg);border-radius:var(--radius-sm);background:var(--bg);font-size:13px;font-weight:500;cursor:pointer;color:var(--hint);transition:all .2s}.period-btn--active{border-color:var(--accent);color:var(--accent);background:var(--bg)}.tariff-price{font-size:26px;font-weight:700;color:var(--accent);margin-bottom:8px}.plans-grid{display:flex;flex-direction:column;gap:12px}.plan-card{border:2px solid transparent}.plan-card--premium{border-color:gold}.plan-card--current{border-color:var(--accent)}.plan-badge{font-size:18px;font-weight:700;margin-bottom:8px}.plan-features{color:var(--hint);font-size:14px;margin-bottom:12px;line-height:1.6}.plan-price{font-size:20px;font-weight:700;color:var(--accent);margin-bottom:8px}.plan-current-label{text-align:center;color:var(--success);font-weight:600;padding:10px}.cost-summary{margin-bottom:16px}.cost-row{display:flex;justify-content:space-between;padding:6px 0}.cost-value{font-weight:600;color:var(--accent)}.options-list{display:flex;flex-direction:column;gap:12px}.option-card{display:flex;align-items:center;justify-content:space-between;gap:16px;border:2px solid transparent;transition:border-color .2s}.option-card--active{border-color:var(--success)}.option-info{flex:1}.option-title{font-size:15px;font-weight:600;margin-bottom:4px}.option-desc{font-size:13px;color:var(--hint);margin-bottom:4px}.option-price{font-size:13px;font-weight:600;color:var(--accent)}.option-trial-link{display:inline-block;margin-top:6px;font-size:12px;color:var(--accent);text-decoration:underline;cursor:pointer}.option-impact{font-size:11px;color:var(--hint);margin-top:4px}.toggle{width:51px;height:31px;border-radius:16px;background:#e5e5ea;border:none;cursor:pointer;position:relative;transition:background .3s;flex-shrink:0}.toggle--on{background:var(--success)}.toggle-thumb{position:absolute;top:2px;left:2px;width:27px;height:27px;background:#fff;border-radius:50%;box-shadow:0 2px 4px #0003;transition:transform .3s}.toggle--on .toggle-thumb{transform:translate(20px)}.skeleton{background:linear-gradient(90deg,var(--bg-secondary) 25%,rgba(0,0,0,.05) 50%,var(--bg-secondary) 75%);background-size:200% 100%;animation:skeleton-loading 1.5s infinite}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.spinner{width:36px;height:36px;border:3px solid var(--bg-secondary);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-page{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:80vh;text-align:center;gap:12px}.error-icon{font-size:56px}.error-msg{color:var(--danger);font-size:14px}.error-hint{color:var(--hint);font-size:13px}