[hidden]{display:none!important}
.email-visitor{--font-body:'Onest',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--font-display:'Manrope','Onest',sans-serif;--accent-bright:#9a8fdf}
.email-visitor{overflow:auto!important;height:auto!important;min-height:100vh;background:var(--bg-dark)!important}
.email-visitor #app,.email-visitor .ui-layer{height:auto!important;min-height:100vh;overflow:visible!important;position:relative!important}
.email-visitor #app{background:radial-gradient(ellipse at 12% 25%,rgba(122,111,191,.11),transparent 50%),radial-gradient(ellipse at 90% 75%,rgba(154,143,223,.07),transparent 45%)}
.email-visitor .ui-layer::before,.email-visitor .ui-layer::after{display:none!important}
.email-auth{color:var(--text-primary);width:min(1120px,100%);margin:auto;padding:24px 28px 0;font-family:var(--font-body);box-sizing:border-box}
.site-nav{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-radius:20px;background:rgba(20,25,45,.25);border:1px solid rgba(70,80,110,.15);backdrop-filter:blur(10px);gap:20px}
.site-nav a,.site-footer a,.site-secondary{color:var(--text-secondary);text-decoration:none;font-size:13px}
.site-nav .site-brand{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-size:20px;color:var(--text-primary);font-weight:700;letter-spacing:-.5px}.site-brand span{color:var(--accent-bright);font-weight:500;margin-left:-4px}
.site-brand i{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;font-size:17px;color:#c4b8ff;background:linear-gradient(135deg,rgba(122,111,191,.5),rgba(154,143,223,.3));border:1px solid rgba(122,111,191,.3);box-shadow:var(--shadow-sm)}
.site-nav .site-telegram{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;border:1px solid rgba(122,111,191,.2);background:rgba(122,111,191,.08);color:var(--accent-bright)}
.auth-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:56px;align-items:center;padding:68px 12px 72px}
.site-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--accent-bright);background:rgba(122,111,191,.1);border:1px solid rgba(122,111,191,.2);border-radius:30px;padding:8px 12px}
.auth-kicker{font-size:11px;letter-spacing:1.3px;color:var(--accent-bright);font-weight:600}
.site-intro h1{font-family:var(--font-display);font-size:clamp(36px,4.2vw,56px);line-height:1.15;letter-spacing:-1.8px;margin:24px 0;font-weight:700}.site-intro h1 em{font-style:normal;color:var(--accent-bright)}
.site-intro p{max-width:440px;color:var(--text-secondary);font-size:15px;line-height:1.8}.site-features{display:grid;gap:12px;padding:28px 0}.site-features>span{display:flex;align-items:center;gap:12px;background:rgba(20,25,45,.4);border:1px solid rgba(70,80,110,.15);border-radius:16px;padding:13px 15px;color:var(--text-primary);font-size:13px}
.site-features i{display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;border-radius:10px;background:rgba(122,111,191,.12);border:1px solid rgba(122,111,191,.2);color:var(--accent-bright);font-size:14px}
.site-secondary{font-size:12px;line-height:1.8;display:block}.site-secondary:hover{color:var(--accent-bright)}
.auth-card{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:22px;padding:32px;box-shadow:var(--shadow-md);position:relative;overflow:hidden}
.auth-card:before{content:'';position:absolute;right:-60px;top:-70px;width:180px;height:180px;background:radial-gradient(circle,rgba(122,111,191,.12),transparent 70%);pointer-events:none}
.auth-card .auth-card-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:linear-gradient(135deg,rgba(122,111,191,.5),rgba(154,143,223,.3));color:#c4b8ff;font-size:22px;border:1px solid rgba(122,111,191,.3);margin-bottom:22px}
.site-brand img{display:block;width:36px;height:36px;flex-shrink:0;border-radius:12px}
.auth-card .auth-card-icon{width:52px;height:52px;border:0;background:none;border-radius:16px}
.auth-card-icon img{display:block;width:100%;height:100%;object-fit:contain;border-radius:inherit}
.auth-card h2{font-family:var(--font-display);font-size:25px;letter-spacing:-.5px;margin:12px 0 10px}.auth-card p{font-size:13px;line-height:1.7;color:var(--text-secondary)}
.auth-card label{display:block;font-size:12px;margin:24px 0 10px;color:var(--text-secondary)}.auth-card input{display:block;width:100%;box-sizing:border-box;font:inherit;font-size:14px;border:1px solid rgba(70,80,110,.3);border-radius:14px;padding:15px;background:rgba(0,0,0,.2);color:var(--text-primary);outline:none;transition:border-color .2s,box-shadow .2s}.auth-card input:focus{border-color:rgba(122,111,191,.7);box-shadow:0 0 0 3px var(--accent-glow)}.auth-card input::placeholder{color:var(--text-tertiary)}
.auth-card .auth-note{font-size:11px;line-height:1.6;color:var(--text-tertiary);margin-top:10px}.auth-primary.btn{width:100%;margin:20px 0 8px;font-size:14px;padding:15px;justify-content:center}
.auth-link{background:none;border:0;color:var(--text-secondary);cursor:pointer;padding:12px;font:inherit;font-size:12px}.auth-link:hover{color:var(--accent-bright)}button:disabled{opacity:.5;cursor:wait}
.auth-card .auth-terms{font-size:11px;margin:12px 0 0;color:var(--text-tertiary)}.auth-terms a{color:var(--text-secondary)}.auth-card #auth-status{color:var(--message-accent);min-height:18px;font-size:12px;margin-top:12px}
.site-footer{border-top:1px solid var(--glass-border);display:flex;justify-content:space-between;gap:20px;padding:24px 8px;color:var(--text-tertiary);font-size:12px}
.email-visitor{background:linear-gradient(135deg,#000 0%,#0a0e27 50%,#000 100%)!important}
.email-auth{padding-top:12px}
.email-auth .site-nav{padding:10px 14px;background:rgba(20,25,45,.65);border-color:rgba(70,80,110,.2)}
.email-auth .site-brand{font-family:var(--font-display);font-size:19px;font-weight:650;gap:10px}
.email-auth .site-telegram{min-height:44px;padding:10px 14px;border-radius:18px;font-size:12px;color:var(--text-primary);background:rgba(30,35,55,.4);border-color:rgba(70,80,110,.2)}
.email-auth .auth-layout{grid-template-columns:1.2fr 1fr;gap:28px;padding:48px 0 40px;align-items:start}
.email-auth .site-intro{padding:26px;border:1px solid rgba(70,80,110,.15);border-radius:20px;background:rgba(20,25,45,.2);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 2px 8px rgba(0,0,0,.2)}
.email-auth .site-eyebrow{font-size:11px;letter-spacing:0;border-radius:12px;background:rgba(30,35,55,.4);border-color:rgba(70,80,110,.2);color:var(--text-secondary);padding:7px 12px}
.email-auth .site-intro h1{font-size:clamp(32px,3.4vw,44px);font-weight:650;letter-spacing:-.04em;line-height:1.25;margin:20px 0 16px}
.email-auth .site-intro p{font-size:14px;line-height:1.8}
.email-auth .site-features{gap:10px;padding:22px 0}
.email-auth .site-features>span{padding:10px 12px;font-size:12px;background:rgba(30,35,55,.25);border-color:rgba(70,80,110,.15);border-radius:14px}
.email-auth .site-features i{width:30px;height:30px;font-size:13px;border-radius:10px}
.email-auth .auth-card{padding:26px;border-radius:20px;background:rgba(20,25,45,.25);border-color:rgba(70,80,110,.18);box-shadow:0 2px 8px rgba(0,0,0,.2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.email-auth .auth-card h2{font-size:23px;font-weight:650;letter-spacing:-.025em;line-height:1.3}
.email-auth .auth-kicker{font-size:10px;letter-spacing:.07em}
.email-auth .auth-card input{font-size:16px;min-height:48px;border-radius:14px;background:rgba(30,35,55,.4);border-color:rgba(70,80,110,.25)}
.email-auth .auth-primary.btn{min-height:44px;padding:10px 18px;font-size:13px;border-radius:18px;background:linear-gradient(135deg,rgba(122,111,191,.7),rgba(154,143,223,.5));border:1px solid rgba(122,111,191,.3);box-shadow:0 4px 12px rgba(122,111,191,.15)}
.email-auth .auth-primary.btn:hover{transform:translateY(-1px);border-color:rgba(122,111,191,.4);box-shadow:0 6px 16px rgba(122,111,191,.2)}
.email-auth .auth-primary.btn:active{transform:scale(.97)}
.email-auth .auth-link{min-height:44px;padding:10px 12px}
.email-auth .site-footer{font-size:11px;padding:22px 8px;align-items:center}
.email-auth .site-footer a{font-size:12px}
@media(max-width:800px){.email-auth .auth-layout{grid-template-columns:1fr;padding:24px 0 30px;gap:18px}.email-auth .site-intro{padding:22px}.email-auth .site-intro h1{font-size:34px}.email-auth .site-features{grid-template-columns:repeat(3,minmax(0,1fr));padding-block:18px}.email-auth .site-features>span{font-size:10px;padding:10px 6px}.email-auth .auth-card{padding:24px}.email-auth .site-brand{font-size:17px}.site-brand img{width:32px;height:32px}}
@media(max-width:600px){.email-auth .site-intro h1{font-size:30px;margin-block:16px 12px}.email-auth .site-intro p{font-size:13px}.email-auth .site-intro{padding:20px}.email-auth .auth-card{padding:22px}.email-auth .auth-card .auth-card-icon{width:48px;height:48px;margin-bottom:18px}.email-auth .site-features{display:none}.email-auth .site-telegram{font-size:11px;padding-inline:10px;gap:6px}.email-auth .auth-card h2{font-size:22px}}
@media(max-width:360px){.email-auth .site-telegram{font-size:11px;padding-inline:10px}.email-auth .site-telegram i{font-size:14px}.email-auth .site-intro h1{font-size:27px}.email-auth .auth-card,.email-auth .site-intro{padding:18px}.email-auth .site-nav{gap:8px;padding-inline:10px}.email-auth .site-brand{gap:7px;font-size:16px}}
@media(max-width:800px){.email-auth{padding:12px 0 0}.site-nav{padding:10px 14px}.site-nav .site-brand{font-size:17px}.site-nav .site-telegram{font-size:11px;padding:9px 10px}.auth-layout{grid-template-columns:1fr;gap:26px;padding:34px 8px 40px}.site-intro h1{font-size:38px;letter-spacing:-1.2px;margin:18px 0}.site-intro p{font-size:13px}.site-features{grid-template-columns:repeat(3,1fr);gap:7px;padding:20px 0}.site-features>span{flex-direction:column;padding:12px 5px;gap:8px;font-size:10px;text-align:center;line-height:1.5}.site-features i{width:30px;height:30px;font-size:12px}.site-secondary{font-size:11px}.auth-card{padding:24px;border-radius:20px}.auth-card h2{font-size:23px}.site-footer{flex-wrap:wrap;padding:20px 10px}.site-footer span:nth-child(2){display:none}}
@media(prefers-reduced-motion:reduce){#bg-canvas{display:none}}
.email-visitor .toast:not(.show){visibility:hidden;pointer-events:none}

.auth-card #auth-code{font-family:var(--font-display);font-size:24px;letter-spacing:8px;text-align:center;padding-left:23px}
.auth-card input:focus-visible,.email-auth a:focus-visible,.auth-link:focus-visible,.auth-primary:focus-visible{outline:2px solid var(--accent-bright);outline-offset:4px}
.web-cabinet .ui-layer{max-width:1120px;margin:auto}.web-cabinet .header{gap:8px}.web-cabinet .user-info{flex:1}.web-cabinet .user-name{max-width:min(48vw,440px)}
#email-logout,#email-account{flex-shrink:0;min-height:40px;min-width:36px;padding:8px}
@media(max-width:600px){.auth-layout{gap:20px;padding-top:24px}.site-intro h1{font-size:33px;margin:14px 0}.site-features{display:none}.site-secondary{margin-top:12px}.auth-card .auth-card-icon{width:36px;height:36px;font-size:17px;margin-bottom:14px}.auth-card label{margin-top:18px}.auth-card{padding:22px}.web-cabinet .user-name{max-width:34vw}.web-cabinet .balance{padding:6px 8px;white-space:nowrap}.web-cabinet .user-id{font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.email-visitor #splash-screen{display:none!important}
@media(max-width:360px){.site-nav .site-telegram{font-size:0;padding:10px;gap:0}.site-nav .site-telegram i{font-size:17px}.site-intro h1{font-size:30px}.auth-card{padding:20px}}
.web-cabinet .bottom-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}.web-cabinet .nav-item{min-width:0}.web-cabinet .nav-item span{max-width:100%;overflow:hidden;text-overflow:ellipsis}@media(max-width:360px){.web-cabinet .nav-item{font-size:9px;padding:8px 2px}.web-cabinet .nav-item i{font-size:17px}}

.web-cabinet .section-title{overflow-wrap:anywhere}
.web-cabinet #bg-canvas{opacity:.14;filter:blur(3px)}

:root { --accent-bright: #b8aaff; }
.web-cabinet .ui-layer { max-width: 960px; margin-inline: auto; }
.account-card { background: linear-gradient(135deg,rgba(142,120,220,.10),rgba(20,25,45,.5)); border-color: rgba(184,170,255,.18); }
.account-panel h4 { font-size: 18px; margin: 14px 0; }
.account-tabs .btn { min-height: 44px; }
.account-tabs .btn[aria-pressed="true"] { background: rgba(184,170,255,.18); color: #e9e2ff; border-color: #9e88e6; }
.web-cabinet button:focus-visible, .web-cabinet a:focus-visible, .account-input:focus-visible { outline: 2px solid #b8aaff; outline-offset: 3px; }
.web-cabinet .btn.primary { background: linear-gradient(135deg,#8a6dd5,#6c52b2); color: #fff; }
@media(prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }

.profile-page { display:grid; gap:14px; padding:8px 0 16px; }
.profile-hero { position:relative; overflow:hidden; padding:24px 20px 20px; border-radius:24px; border:1px solid rgba(184,170,255,.22); background:radial-gradient(ellipse at 100% 0%,rgba(142,105,235,.22),transparent 65%),linear-gradient(145deg,rgba(33,29,60,.8),rgba(14,17,37,.9)); }
.profile-identity { display:flex; align-items:center; gap:14px; }
.profile-avatar { width:58px; height:58px; flex-shrink:0; display:grid; place-items:center; border-radius:20px; border:1px solid rgba(212,198,255,.28); background:linear-gradient(135deg,#8d70ce,#514074); box-shadow:0 8px 24px rgba(88,65,145,.25); color:#fff; font-size:23px; font-weight:700; }
.profile-identity-text { min-width:0; }
.profile-eyebrow { display:block; color:#b4a9ce; font-size:9px; font-weight:600; letter-spacing:1.6px; margin-bottom:6px; }
.profile-identity h1 { margin:0; color:#f1edf9; font-size:23px; line-height:1.2; font-weight:700; letter-spacing:-.5px; overflow-wrap:anywhere; }
.profile-address { margin:7px 0 0; color:#b9b4ce; font-size:12px; line-height:1.6; overflow-wrap:anywhere; }
.profile-id-row { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; align-items:center; margin:20px 0 16px; padding-top:16px; border-top:1px solid rgba(184,170,255,.12); color:#9690ac; font-size:11px; }
.profile-id-row code { color:#c8c0dd; font-size:11px; }
.profile-summary { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.profile-stat { display:flex; flex-direction:column; gap:7px; padding:14px; background:rgba(7,9,22,.28); border:1px solid rgba(184,170,255,.10); border-radius:15px; min-width:0; }
.profile-stat span { color:#a29bb5; font-size:11px; }
.profile-stat strong { color:#eee8ff; font-size:18px; font-weight:650; overflow-wrap:anywhere; }
.profile-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.profile-actions .btn { min-height:48px; padding:12px 8px; font-size:12px; line-height:1.4; }
.profile-settings,.profile-security-card { padding:20px 16px; background:rgba(17,19,41,.75); border:1px solid rgba(184,170,255,.14); border-radius:24px; min-width:0; }
.profile-settings h2,.profile-security-card h2 { margin:0 0 7px; font-size:17px; color:#ece6fa; }
.profile-settings>.account-note { margin:0 0 18px; }
.profile-settings .account-tabs { position:sticky; top:0; padding:4px 0 10px; background:#111329; z-index:1; gap:6px; }
.profile-settings .account-tabs .btn { padding:10px 5px; font-size:12px; flex:1; }
.profile-settings .account-panel { padding:4px 0 0; }
.profile-settings .account-note { font-size:12px; line-height:1.7; }
.profile-settings .account-panel>.btn { width:100%; margin:8px 0; min-height:46px; }
.profile-status { display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:20px; background:rgba(184,170,255,.08); border:1px solid rgba(184,170,255,.13); color:#b6adc9; font-size:10px; margin-top:6px; }
.profile-status::before { content:""; width:5px; height:5px; border-radius:50%; background:currentColor; }
.profile-status.is-enabled { background:rgba(157,138,255,.08); border-color:rgba(157,138,255,.16); color:var(--message-accent); }
.profile-logout.btn { color:#cda8ba; min-height:46px; background:rgba(160,90,122,.04); border-color:rgba(184,125,153,.14); width:100%; }
.profile-settings .account-card { margin:10px 0; padding:15px; }
.profile-settings .account-card strong { font-size:13px; }
.profile-settings .account-card .btn { width:100%; min-height:44px; }
.profile-page button:focus-visible { outline:2px solid #b8aaff; outline-offset:3px; }
@media(min-width:780px) { .profile-page { grid-template-columns:minmax(260px,.9fr) minmax(320px,1.2fr); gap:18px; align-items:start; } .profile-hero { grid-column:1; grid-row:1; padding:28px; } .profile-actions { grid-column:1; grid-row:2; } .profile-settings,.profile-security-card { grid-column:2; grid-row:1 / span 3; padding:24px; } .profile-logout { grid-column:1; grid-row:3; } }
@media(max-width:360px) { .profile-hero { padding:20px 16px 16px; } .profile-identity h1 { font-size:21px; } .profile-avatar { width:50px; height:50px; border-radius:17px; } .profile-settings { padding:18px 12px; } }

.profile-page .btn:not(.primary) { background:rgba(184,170,255,.08); border:1px solid rgba(184,170,255,.15); color:#d2c9e8; white-space:normal; }
.profile-settings .profile-status { width:fit-content; align-self:flex-start; }
.profile-page .profile-logout.btn { color:#d9afc3; background:rgba(160,90,122,.06); border-color:rgba(184,125,153,.18); }
.profile-overview { display:contents; }
.profile-hero { order:1; }
.profile-actions { order:2; }
.profile-settings,.profile-security-card { order:3; }
.profile-logout { order:4; }
@media(min-width:780px) { .profile-overview { display:grid; gap:14px; grid-column:1; grid-row:1; } .profile-overview>.profile-hero,.profile-overview>.profile-actions,.profile-overview>.profile-logout { grid-column:auto; grid-row:auto; } .profile-settings,.profile-security-card { grid-column:2; grid-row:1; } }

.profile-page .account-tabs .btn[aria-pressed="true"] { background:rgba(184,170,255,.18); color:#f0eaff; border-color:#9e88e6; }

.ui-layer { min-height:0; }
.header,.bottom-nav { flex-shrink:0; }
.content { min-height:0; }
@supports(height:100dvh) { body:not(.email-visitor) { height:100dvh; } }
.profile-page.telegram-profile { grid-template-columns:minmax(0,1fr); width:100%; max-width:620px; margin-inline:auto; }

.profile-avatar { position:relative; overflow:hidden; }
.profile-avatar img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.profile-link-card { padding:22px 20px; border:1px solid rgba(184,170,255,.22); border-radius:24px; background:linear-gradient(135deg,rgba(142,120,220,.1),rgba(20,25,45,.5)); min-width:0; }
.profile-link-card h2 { margin:0 0 12px; font-size:18px; }
.linked-identity { display:flex; align-items:center; gap:16px; justify-content:space-between; padding:14px 0; border-bottom:1px solid rgba(184,170,255,.12); }
.linked-identity span { color:var(--text-secondary); font-size:13px; }
.linked-identity strong { font-size:14px; overflow-wrap:anywhere; text-align:right; min-width:0; }
.link-field { display:grid; gap:8px; margin:14px 0; font-size:13px; color:var(--text-secondary); }
.link-field input,.link-field select { width:100%; min-width:0; border-radius:14px; padding:13px 14px; border:1px solid rgba(184,170,255,.3); background:#17182d; color:var(--text-primary); font:inherit; font-size:16px; }
.link-output { display:grid; gap:10px; margin-top:12px; min-width:0; }
.link-output:empty { display:none; }
.account-link-code { display:block; overflow-wrap:anywhere; padding:14px; border-radius:12px; background:rgba(184,170,255,.1); font-size:14px; user-select:all; }
.link-output a.btn { text-align:center; text-decoration:none; display:block; }
.link-transfer { margin-top:20px; padding-top:16px; border-top:1px solid rgba(184,170,255,.15); }
.link-transfer summary { cursor:pointer; font-size:14px; color:var(--accent-bright); }

.profile-link-card { order:3; }
.profile-settings { order:4; }
.profile-logout { order:5; }
@media(min-width:780px) {
  .profile-page:not(.telegram-profile) .profile-link-card { grid-column:2; grid-row:1; }
  .profile-page:not(.telegram-profile) .profile-settings { grid-column:2; grid-row:2; }
  .profile-page.telegram-profile .profile-link-card { grid-column:1; grid-row:2; }
}

.profile-page.telegram-profile .profile-settings {
  grid-column:1;
  grid-row:auto;
  background:var(--card-surface);
  min-width:0;
}
.profile-page.telegram-profile .profile-settings .account-tabs {
  position:static;
  background:transparent;
  padding:0 0 12px;
}
.profile-page.telegram-profile .profile-settings .account-card {
  background:var(--card-surface);
  border-color:var(--glass-border);
  margin:0;
}

.email-auth,.auth-layout>*,.site-nav>* { min-width:0; }
#modal-body > .btn { display:flex; justify-content:center; width:100%; margin-top:12px; text-decoration:none; }
.connection-help { margin-top:18px; padding:14px; border-radius:14px; background:var(--gray-bg); }
.connection-help summary { cursor:pointer; color:var(--text-primary); }
#modal-buttons .btn:not(.primary) { background:rgba(25,30,52,.9); border:1px solid var(--glass-border); color:var(--text-primary); }
#modal-buttons .btn { font-family:var(--font-body); min-height:44px; }
#modal-body .account-input { font-family:var(--font-body); box-sizing:border-box; }

.quick-connection { display:grid; gap:0; }
.quick-connection > .btn { display:flex; justify-content:center; width:100%; margin-top:12px; text-decoration:none; }
.quick-connection > .btn.primary { gap:10px; min-height:52px; border-radius:16px; background:linear-gradient(125deg,#7564b8,#8b74c8); box-shadow:0 6px 22px rgba(111,88,172,.18); }
.quick-connection .connection-device { display:flex; align-items:center; gap:8px; width:max-content; max-width:100%; padding:8px 12px; border-radius:12px; background:rgba(154,143,223,.08); border:1px solid rgba(154,143,223,.14); }
.connection-device > i { color:var(--accent-bright); font-size:15px; }
.connection-device > div { display:flex; align-items:center; gap:8px; }
.connection-device strong { font:600 12px var(--font-body); }
.connection-device .account-note { margin:0; font-size:11px; }
.connection-step { font:500 12px/1.6 var(--font-body); color:var(--text-secondary); margin:20px 0 10px; }
.connection-clients { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.connection-clients-single { grid-template-columns:minmax(0,1fr); }
.connection-client { position:relative; display:grid; grid-template-columns:44px minmax(0,1fr); gap:4px 10px; align-items:center; text-align:left; min-width:0; padding:18px 12px; border:1px solid rgba(154,143,223,.16); border-radius:20px; background:linear-gradient(145deg,rgba(32,31,54,.75),rgba(18,22,40,.7)); color:var(--text-primary); font-family:var(--font-body); cursor:pointer; transition:border-color .2s,background .2s; }
.connection-client[aria-pressed=true] { border-color:rgba(171,151,234,.6); background:linear-gradient(130deg,rgba(122,111,191,.2),rgba(25,28,48,.8)); box-shadow:inset 0 1px 0 rgba(205,192,255,.06); }
.connection-client-mark { grid-row:span 2; display:block; width:44px; height:44px; border:1px solid rgba(154,143,223,.2); border-radius:14px; object-fit:cover; }
.connection-client strong { font-size:14px; padding-right:10px; }
.connection-client-state { font-size:10px; line-height:1.5; color:var(--text-secondary); overflow-wrap:anywhere; }
.connection-client-check { position:absolute; top:8px; right:8px; display:grid; place-items:center; width:16px; height:16px; border-radius:50%; background:rgba(168,146,235,.2); color:#d7c9ff; font-size:9px; opacity:0; }
.connection-client[aria-pressed=true] .connection-client-check { opacity:1; }
.connection-clients-single .connection-client { grid-template-columns:56px minmax(0,1fr); gap:5px 16px; padding:20px; min-height:96px; }
.connection-clients-single .connection-client-mark { width:56px; height:56px; border-radius:17px; }
.connection-clients-single .connection-client strong { font-size:19px; font-family:var(--font-display); letter-spacing:-.4px; }
.connection-clients-single .connection-client-state { font-size:12px; }
.connection-clients-single .connection-client-check { top:18px; right:18px; width:22px; height:22px; font-size:10px; }
.connection-open-icon { width:24px; height:24px; border-radius:7px; object-fit:cover; flex-shrink:0; }
.connection-client:focus-visible { outline:2px solid var(--accent-bright); outline-offset:3px; }
.connection-opening-note { text-align:center; margin:10px 0!important; font-size:11px; }
.quick-connection .connection-instructions { width:100%; min-height:48px; padding:12px 16px; border:1px solid rgba(154,143,223,.18); background:rgba(25,28,48,.65); border-radius:15px; color:var(--text-primary); font-size:12px; line-height:1.5; white-space:normal; text-align:center; }
.quick-connection .connection-instructions:hover { background:rgba(93,78,157,.22); border-color:rgba(154,143,223,.36); }
.quick-connection .connection-instructions:focus-visible { outline:2px solid #a798e8; outline-offset:3px; }
.quick-connection .connection-manual { padding:12px; border:1px solid rgba(154,143,223,.18); border-radius:15px; background:rgba(25,28,48,.65); }
.quick-connection .connection-manual textarea { width:100%; min-width:0; box-sizing:border-box; }
#subscriptionCard.subscription-overview { padding:20px; border:1px solid rgba(154,143,223,.2); border-radius:26px; background:linear-gradient(150deg,rgba(32,31,58,.9),rgba(13,17,36,.94)); box-shadow:0 10px 32px rgba(0,0,0,.12),inset 0 1px 0 rgba(200,183,255,.04); }
.subscription-overview-header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 0 18px; border-bottom:1px solid rgba(154,143,223,.13); margin-bottom:16px; }
.subscription-overview-plan { min-width:0; }
.subscription-overview-label { display:block; color:var(--text-secondary); font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.subscription-overview-title { font:700 20px/1.3 var(--font-display); color:var(--text-primary); letter-spacing:-.5px; margin:7px 0; }
.subscription-overview-expiry { font-size:11px; color:var(--text-secondary); }
.subscription-overview-days { display:grid; justify-items:center; gap:3px; min-width:64px; padding:11px 10px; border:1px solid rgba(154,143,223,.19); border-radius:18px; background:rgba(154,143,223,.08); color:var(--accent-bright); flex-shrink:0; }
.subscription-overview-days strong { font:700 27px/1 var(--font-display); letter-spacing:-1px; }
.subscription-overview-days span { color:var(--text-secondary); font-size:10px; }
.subscription-overview-metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-bottom:14px; }
.subscription-overview-metric { min-width:0; padding:13px; border:1px solid rgba(154,143,223,.13); border-radius:16px; background:rgba(9,13,29,.26); }
.vpn-connect-button { display:flex; align-items:center; gap:12px; width:100%; padding:16px 14px; border:1px solid rgba(181,161,243,.32); border-radius:20px; background:linear-gradient(120deg,rgba(124,103,183,.3),rgba(52,44,83,.25)); color:var(--text-primary); text-align:left; font-family:var(--font-body); cursor:pointer; box-shadow:inset 0 1px 0 rgba(210,194,255,.07); transition:border-color .2s,transform .2s; }
.vpn-connect-icon { display:grid; place-items:center; width:44px; height:44px; flex-shrink:0; border:1px solid rgba(154,143,223,.25); border-radius:14px; background:rgba(154,143,223,.12); color:#d4c8ff; font-size:18px; overflow:hidden; }
.vpn-connect-icon img { display:block; width:100%; height:100%; object-fit:cover; }
.vpn-connect-text { display:grid; gap:5px; flex:1; min-width:0; }
.vpn-connect-title { font-size:14px; font-weight:700; letter-spacing:-.2px; }
.vpn-connect-description { font-size:10px; line-height:1.5; color:var(--text-secondary); }
.vpn-connect-arrow { display:grid; place-items:center; width:25px; height:25px; flex-shrink:0; color:#c6b7f0; font-size:13px; }
.vpn-connect-button:focus-visible { outline:2px solid var(--accent-bright); outline-offset:3px; }
.vpn-connect-button:active { transform:scale(.99); }
@media(hover:hover) { .vpn-connect-button:hover { border-color:var(--accent-bright); transform:translateY(-1px); } }
@media(max-width:360px) { #subscriptionCard.subscription-overview { padding:16px; } .subscription-overview-title { font-size:18px; } .connection-client { grid-template-columns:minmax(0,1fr); } .connection-client-mark { grid-row:auto; } .connection-clients-single .connection-client { grid-template-columns:48px minmax(0,1fr); padding:18px 16px; } .connection-clients-single .connection-client-mark { width:48px; height:48px; } }
@media(prefers-reduced-motion:reduce) { .vpn-connect-button,.connection-client { transition:none; } .vpn-connect-button:hover,.vpn-connect-button:active { transform:none; } }
.connection-device .fa-desktop { --envy-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='13' rx='2'/%3E%3Cpath d='M12 16v5M8 21h8'/%3E%3C/svg%3E"); }
.site-nav { -webkit-backdrop-filter:blur(10px); }
.site-brand { white-space:nowrap; }
.auth-card input,.account-input { -webkit-appearance:none; appearance:none; }
.email-visitor .email-auth { padding-top:max(12px,var(--safe-top)); padding-bottom:max(12px,var(--safe-bottom)); }
@supports(min-height:100svh) {
  .email-visitor,.email-visitor #app,.email-visitor .ui-layer { min-height:100svh; }
}

.connection-install-card { display:flex; align-items:center; gap:12px; width:100%; padding:14px; box-sizing:border-box; border:1px solid rgba(154,143,223,.2); border-radius:17px; background:linear-gradient(120deg,rgba(93,78,157,.16),rgba(25,28,48,.7)); color:var(--text-primary); text-decoration:none; text-align:left; }
.connection-install-card:hover { background:rgba(93,78,157,.24); border-color:rgba(154,143,223,.4); }
.connection-install-card:focus-visible { outline:2px solid #a798e8; outline-offset:3px; }
.connection-install-card img { width:44px; height:44px; border-radius:12px; flex-shrink:0; object-fit:contain; }
.connection-install-copy { display:flex; flex-direction:column; gap:5px; min-width:0; flex:1; }
.connection-install-copy strong { font-size:13px; font-weight:600; }
.connection-install-copy > span { font-size:11px; line-height:1.5; color:var(--text-secondary); }
.connection-install-arrow { font-size:20px; color:var(--accent-bright); flex-shrink:0; }
.modal-close.modal-back { font-family:var(--font-body); width:auto; min-width:78px; gap:7px; padding:0 12px; border-radius:12px; font-size:12px; }
.modal-guide #modal-title { padding-right:88px; }
#modal-buttons:empty { display:none; }

.connection-sources { display:grid; grid-template-columns:1fr 1fr; gap:6px; padding:5px; border:1px solid rgba(154,143,223,.16); background:rgba(16,19,37,.65); border-radius:14px; }
.connection-sources button { padding:10px 6px; min-height:40px; border:1px solid transparent; border-radius:10px; background:transparent; color:var(--text-secondary); font:inherit; font-size:12px; cursor:pointer; }
.connection-sources button[aria-pressed="true"] { color:var(--text-primary); border-color:rgba(154,143,223,.3); background:rgba(122,111,191,.23); }
.connection-sources button:focus-visible { outline:2px solid #a798e8; outline-offset:1px; }
.connection-downloads { display:grid; gap:9px; min-width:0; }
.connection-downloads-title { margin:0 0 3px; color:var(--text-secondary); font-size:11px; line-height:1.5; }
.connection-download-group { min-width:0; padding:0; border:1px solid rgba(154,143,223,.14); border-radius:16px; background:linear-gradient(135deg,rgba(33,34,57,.7),rgba(17,21,39,.75)); transition:border-color .2s,background .2s; }
.connection-download-group[open] { border-color:rgba(166,149,232,.43); background:linear-gradient(130deg,rgba(110,94,172,.16),rgba(20,24,43,.85)); }
.connection-download-group summary { display:flex; align-items:center; gap:11px; min-height:60px; padding:11px 12px; box-sizing:border-box; list-style:none; cursor:pointer; color:var(--text-primary); -webkit-tap-highlight-color:transparent; }
.connection-download-group summary::-webkit-details-marker { display:none; }
.connection-download-group summary::marker { content:''; }
.connection-download-group summary:focus-visible { outline:2px solid var(--accent-bright); outline-offset:3px; border-radius:16px; }
.connection-platform-icon { display:grid; place-items:center; width:36px; height:36px; flex-shrink:0; border:1px solid rgba(154,143,223,.15); border-radius:11px; background:rgba(122,111,191,.09); color:#aaa3c9; }
.connection-platform-icon svg { width:20px; height:20px; }
.connection-download-group[open] .connection-platform-icon { color:#d4c8ff; background:rgba(122,111,191,.22); border-color:rgba(166,149,232,.3); }
.connection-platform-label { min-width:0; flex:1; font-size:13px; line-height:1.4; font-weight:600; }
.connection-current-device .connection-platform-label::after { content:''; display:inline-block; width:5px; height:5px; margin:0 0 2px 8px; border-radius:50%; background:var(--accent-bright); box-shadow:0 0 8px rgba(154,143,223,.5); }
.connection-platform-chevron { display:grid; place-items:center; color:var(--text-secondary); transition:transform .2s; }
.connection-platform-chevron svg { width:15px; height:15px; }
.connection-download-group[open] .connection-platform-chevron { transform:rotate(90deg); color:var(--accent-bright); }
.connection-download-list { display:grid; gap:7px; padding:10px; border-top:1px solid rgba(154,143,223,.14); }
.connection-download-link { display:flex; align-items:center; gap:10px; padding:10px; border:1px solid rgba(154,143,223,.1); border-radius:12px; background:rgba(13,16,33,.36); color:var(--text-primary); text-decoration:none; min-width:0; transition:background .2s,border-color .2s; }
.connection-download-link:hover { background:rgba(93,78,157,.2); border-color:rgba(154,143,223,.3); }
.connection-download-link:focus-visible { outline:2px solid var(--accent-bright); outline-offset:2px; }
.connection-download-link img { width:32px; height:32px; border-radius:9px; flex-shrink:0; }
.connection-download-link > span:first-of-type { display:grid; gap:4px; flex:1; min-width:0; }
.connection-download-link strong { font-size:12px; font-weight:600; }
.connection-download-link > span:first-of-type > span { font-size:10px; line-height:1.4; color:var(--text-secondary); overflow-wrap:anywhere; }
.connection-download-action { display:grid; place-items:center; width:30px; height:30px; flex-shrink:0; border-radius:9px; background:rgba(122,111,191,.15); color:#b8a9ed; }
.connection-download-action svg { width:16px; height:16px; }
@media(prefers-reduced-motion:reduce) { .connection-download-group,.connection-platform-chevron,.connection-download-link { transition:none; } }

.connection-client-card { min-width:0; overflow:hidden; padding:0 12px 12px; border:1px solid rgba(154,143,223,.16); border-radius:20px; background:linear-gradient(145deg,rgba(32,31,54,.75),rgba(18,22,40,.7)); transition:border-color .2s,background .2s; }
.connection-client-card.selected { border-color:rgba(171,151,234,.6); background:linear-gradient(130deg,rgba(122,111,191,.2),rgba(25,28,48,.8)); }
.connection-client-card .connection-client { width:100%; padding:18px 0 10px; border:0; border-radius:0; background:transparent; box-shadow:none; }
.connection-client-card .connection-client[aria-pressed=true] { border:0; background:transparent; box-shadow:none; }
.connection-clients-single .connection-client-card { padding:0 18px 16px; }
.connection-clients-single .connection-client-card .connection-client { padding:20px 0 10px; }
.connection-client-install-note { margin:0 0 7px; font-size:10px; line-height:1.5; color:var(--text-secondary); }
.connection-client-install { display:flex; align-items:center; justify-content:center; gap:8px; padding:10px 8px; min-height:38px; box-sizing:border-box; border-radius:11px; border:1px solid rgba(154,143,223,.25); background:rgba(122,111,191,.13); color:var(--text-primary); font-size:11px; line-height:1.5; text-decoration:none; text-align:center; }
.connection-client-install:hover { background:rgba(122,111,191,.24); border-color:rgba(154,143,223,.45); }
.connection-client-install:focus-visible { outline:2px solid var(--accent-bright); outline-offset:2px; }
.connection-clients-single .connection-client-install { font-size:12px; }
@media(prefers-reduced-motion:reduce) { .connection-client-card { transition:none; } }
