*{box-sizing:border-box}:root{--bg:#080912;--card:#161723;--line:#2d2a40;--muted:#9691a5;--p:#8b5cf6}body{margin:0;background:radial-gradient(circle at top,#28165c,transparent 42%),var(--bg);color:#fff;font-family:Inter,Segoe UI,sans-serif}main{max-width:500px;min-height:100vh;margin:auto;padding:21px 17px 112px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.brand{display:flex;align-items:center;gap:11px}.brand>span,.identity>span{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#a986ff,#6232df);font-weight:900}.brand b{letter-spacing:2px}.brand small{display:block;color:#787384;font-size:7px}header a{color:#fff;text-decoration:none}label{font-size:9px;letter-spacing:2px;color:#a49eaf}h1{font-size:37px;line-height:1.08}h1 em{font-style:normal;color:#aa9bd2}.page{display:none}.page.active{display:block}.trial,.connect,.quick button,.server,.plan,.identity{background:linear-gradient(145deg,#1a1b29,#101119);border:1px solid var(--line);border-radius:22px}.trial{padding:17px;border-color:#6849a5}.trial h3{margin:5px 0}.trial p,.connect p{color:var(--muted);font-size:11px}.actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.actions a,.actions button,.plan button{padding:11px;border:0;border-radius:12px;color:white;text-decoration:none;text-align:center;background:#292737;font-weight:700}.actions button,.plan button{background:linear-gradient(100deg,#7049e7,#a74ce4)}.connect{text-align:center;padding:18px;margin-top:11px}.power{position:relative;width:145px;height:145px;margin:24px auto;border:0;border-radius:50%;display:block;background:radial-gradient(circle at 38% 28%,#b69aff,#8051ec 45%,#3b1d92);box-shadow:0 23px 35px #31187699,0 0 50px #7b4ce966,inset 0 6px 9px #ffffff66,inset 0 -13px 20px #18073f;animation:breath 2.6s ease-in-out infinite}.power:active{transform:translateY(5px) scale(.97)}.power:before,.power:after{content:"";position:absolute;inset:-12px;border:1px solid #9c79ff66;border-radius:50%;animation:pulse 2.4s infinite}.power:after{inset:-25px;animation-delay:.7s}.power svg{width:42px;height:72px;filter:drop-shadow(0 0 12px #fff)}.power path{fill:#fff}.launch{width:100%;display:grid;grid-template-columns:38px 1fr 16px;gap:9px;align-items:center;padding:13px;border:0;border-radius:16px;color:white;background:linear-gradient(100deg,#6844db,#ad4de5);text-align:left}.launch b,.launch small{display:block}.launch small{color:#ddd2f4;font-size:8px;margin-top:4px}.quick{display:grid;grid-template-columns:1fr 1fr;gap:9px}.quick button{padding:15px;color:white;text-align:left}.quick small,.identity small,.server small,.plan small{display:block;color:var(--muted);font-size:8px;margin-bottom:5px}.server,.plan,.identity{padding:17px;margin:10px 0}.server .top,.plan{display:flex;justify-content:space-between;align-items:center}.stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #282635;margin-top:15px;padding-top:14px}.stats small,.stats b{display:block}.identity{display:flex;align-items:center;gap:12px}.menu{width:100%;display:grid;grid-template-columns:30px 1fr 12px;gap:9px;text-align:left;align-items:center;padding:13px;margin:8px 0;color:white;text-decoration:none;background:#171821;border:1px solid var(--line);border-radius:16px}.menu span b,.menu span small{display:block}.menu span small{font-size:8px;color:var(--muted);margin-top:4px}nav{position:fixed;left:50%;bottom:12px;transform:translateX(-50%);width:min(470px,calc(100% - 28px));display:grid;grid-template-columns:repeat(4,1fr);padding:7px;background:#151621ee;border:1px solid var(--line);border-radius:22px}nav button{border:0;background:transparent;color:#777281;padding:9px;border-radius:15px}nav button.active{color:#c1adff;background:#8b5cf61c}nav span,nav small{display:block}dialog{width:min(420px,calc(100% - 28px));background:#151621;color:white;border:1px solid var(--line);border-radius:22px;padding:20px}.dialog-head{display:flex;justify-content:space-between}.dialog-head button{background:none;border:0;color:white;font-size:22px}.method{width:100%;display:grid;grid-template-columns:35px 1fr 12px;gap:8px;align-items:center;text-align:left;padding:13px;margin:8px 0;border:1px solid var(--line);border-radius:14px;background:#1b1b28;color:white}.method b,.method small{display:block}.method small{color:var(--muted);font-size:8px}.detail{padding:14px;margin:8px 0;border:1px solid var(--line);border-radius:15px;background:#0f1018}.detail p{overflow-wrap:anywhere;color:var(--muted)}input,select{width:100%;padding:12px;margin:5px 0;background:#0c0d14;border:1px solid var(--line);border-radius:11px;color:white}.detail button{padding:11px;border:0;border-radius:11px;background:linear-gradient(100deg,#714ae5,#a64be4);color:white}#toast{position:fixed;bottom:95px;left:50%;transform:translateX(-50%);background:#292737;padding:12px 16px;border-radius:11px;opacity:0}#toast.show{opacity:1}@keyframes pulse{50%{transform:scale(1.1);opacity:.05}}@keyframes breath{50%{filter:brightness(1.12)}}
/* v6 unified glass UI */
body{background:radial-gradient(circle at 50% -15%,rgba(117,72,238,.30),transparent 42%),radial-gradient(circle at 10% 75%,rgba(43,84,210,.13),transparent 32%),#080912;background-attachment:fixed}
.trial,.connect,.quick button,.server,.plan,.identity,.menu,dialog{background:linear-gradient(135deg,rgba(255,255,255,.095),rgba(255,255,255,.035))!important;border:1px solid rgba(255,255,255,.13)!important;box-shadow:inset 0 1px rgba(255,255,255,.14),0 18px 50px rgba(0,0,0,.24)!important;backdrop-filter:blur(22px) saturate(135%);-webkit-backdrop-filter:blur(22px) saturate(135%)}
.trial{border-color:rgba(169,130,255,.42)!important}.connect{padding:22px 18px 20px}.power{background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.50),rgba(171,132,255,.62) 20%,rgba(105,62,211,.70) 58%,rgba(42,22,100,.78));border:1px solid rgba(255,255,255,.25);box-shadow:0 25px 55px rgba(45,22,110,.55),0 0 45px rgba(130,83,239,.40),inset 0 7px 13px rgba(255,255,255,.42),inset 0 -18px 28px rgba(28,9,72,.50);backdrop-filter:blur(17px);-webkit-backdrop-filter:blur(17px)}
.power svg{opacity:.93}.launch{min-height:62px;margin-top:17px;background:linear-gradient(115deg,rgba(145,97,248,.62),rgba(177,73,226,.56))!important;border:1px solid rgba(255,255,255,.21)!important;box-shadow:inset 0 1px rgba(255,255,255,.30),0 14px 34px rgba(93,47,183,.29);backdrop-filter:blur(18px);grid-template-columns:12px 1fr}.button-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.88);box-shadow:0 0 12px #fff}.quick{margin-top:22px}.quick button{min-height:68px}.menu{grid-template-columns:minmax(0,1fr);padding:15px 16px}.menu span{min-width:0}.menu span b{font-size:12px}.menu span small{font-size:9px}.empty-server{text-align:center;padding:30px 18px}.empty-server small{margin-top:8px;line-height:1.5}.actions a,.actions button,.plan button,.detail button{background:linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.065));border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px rgba(255,255,255,.12);backdrop-filter:blur(14px)}.actions button,.plan button,.detail button{background:linear-gradient(120deg,rgba(128,77,234,.72),rgba(175,74,226,.68))}.method{background:linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.035));border-color:rgba(255,255,255,.13);backdrop-filter:blur(15px)}nav{background:linear-gradient(135deg,rgba(31,31,46,.74),rgba(18,19,28,.72));border-color:rgba(255,255,255,.13);box-shadow:inset 0 1px rgba(255,255,255,.12),0 18px 42px rgba(0,0,0,.34);backdrop-filter:blur(24px) saturate(140%);-webkit-backdrop-filter:blur(24px) saturate(140%)}nav button{min-height:48px}nav button small{font-size:9px}nav button.active{background:linear-gradient(135deg,rgba(139,92,246,.28),rgba(178,76,239,.16));color:#e4d9ff}

/* v7 definitive spacing, typography and motion */
:root{--glass-bg:rgba(255,255,255,.075);--glass-bg-2:rgba(255,255,255,.025);--glass-border:rgba(255,255,255,.16);--glass-highlight:rgba(255,255,255,.22);--glass-shadow:0 22px 58px rgba(0,0,0,.28)}
.page.active{display:flex;flex-direction:column;gap:24px}
.page>h1,.page>label{margin:0}.page>label+h1{margin-top:-11px}.trial,.connect,.identity,.server,.plan{margin:0!important}
.trial,.connect,.quick button,.server,.plan,.identity,.menu,dialog{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--glass-bg),var(--glass-bg-2))!important;border:1px solid var(--glass-border)!important;box-shadow:inset 0 1px var(--glass-highlight),var(--glass-shadow)!important;backdrop-filter:blur(30px) saturate(155%)!important;-webkit-backdrop-filter:blur(30px) saturate(155%)!important}
.trial:before,.connect:before,.quick button:before,.server:before,.plan:before,.identity:before,.menu:before{content:"";position:absolute;z-index:0;left:-45%;top:-90%;width:70%;height:250%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent);transform:rotate(20deg);animation:glassSweep 8s ease-in-out infinite;pointer-events:none}
.trial>*,.connect>*,.quick button>*,.server>*,.plan>*,.identity>*,.menu>*{position:relative;z-index:1}
.trial{margin-bottom:0!important}.connect{margin-top:0!important}.quick{margin-top:8px!important;gap:14px!important}.quick button{min-height:82px!important;padding:18px!important}.quick button small{font-size:9px!important;margin-bottom:8px!important}.quick button b{font-size:14px!important}
.connect{padding-bottom:23px!important}.launch{margin-top:22px!important;transition:transform .24s ease,box-shadow .24s ease,filter .24s ease}.launch:hover{transform:translateY(-4px) scale(1.012);filter:brightness(1.12);box-shadow:inset 0 1px rgba(255,255,255,.35),0 20px 42px rgba(118,61,219,.43)}.launch:active{transform:translateY(2px) scale(.98)}
.power{transition:transform .22s cubic-bezier(.2,.8,.2,1),filter .22s ease,box-shadow .22s ease}.power:hover{transform:translateY(-7px) scale(1.035);filter:brightness(1.16);box-shadow:0 31px 66px rgba(45,22,110,.64),0 0 64px rgba(130,83,239,.56),inset 0 7px 13px rgba(255,255,255,.46),inset 0 -18px 28px rgba(28,9,72,.50)}.power:active{transform:translateY(5px) scale(.94)}
.actions a,.actions button,.plan button,.detail button,.method,.menu,.quick button{transition:transform .22s ease,background .22s ease,border-color .22s ease,box-shadow .22s ease,filter .22s ease}.actions a:hover,.actions button:hover,.plan button:hover,.detail button:hover,.method:hover,.menu:hover,.quick button:hover{transform:translateY(-4px);border-color:rgba(196,169,255,.38)!important;box-shadow:inset 0 1px rgba(255,255,255,.20),0 16px 35px rgba(72,40,136,.25)!important;filter:brightness(1.09)}.actions a:active,.actions button:active,.plan button:active,.detail button:active,.method:active,.menu:active,.quick button:active{transform:translateY(1px) scale(.985)}
.server,.plan,.identity,.menu{animation:cardIn .52s both}.server:nth-child(2),.plan:nth-child(2),.menu:nth-child(2){animation-delay:.05s}.server:nth-child(3),.plan:nth-child(3),.menu:nth-child(3){animation-delay:.10s}.server:nth-child(4),.plan:nth-child(4),.menu:nth-child(4){animation-delay:.15s}.plan:nth-child(5){animation-delay:.20s}
#profile.page.active{gap:18px}#profile h1{margin-bottom:2px}.identity{padding:21px!important;gap:16px!important}.identity>span{width:56px!important;height:56px!important;font-size:20px}.identity b{font-size:18px!important;line-height:1.2}.identity small{font-size:11px!important;line-height:1.45;margin-top:6px!important;letter-spacing:.25px}
.menu{min-height:86px!important;padding:19px 20px!important;display:flex!important;align-items:center!important}.menu span{display:block!important;width:100%}.menu span b{font-size:17px!important;line-height:1.25}.menu span small{font-size:12px!important;line-height:1.45;margin-top:7px!important;color:#aaa5ba!important;white-space:normal!important}
#servers.page.active,#plans.page.active{gap:20px}#serverList,#planList{display:flex;flex-direction:column;gap:16px}.server,.plan{min-height:108px!important;padding:21px!important}.plan b{font-size:20px}.plan small{font-size:10px!important}.plan button{min-width:102px;min-height:45px}
nav button{transition:transform .22s ease,background .22s ease,color .22s ease,box-shadow .22s ease}nav button:hover{transform:translateY(-2px);color:#ddd1ff}nav button.active{box-shadow:inset 0 1px rgba(255,255,255,.12),0 8px 20px rgba(80,42,156,.18)}
@keyframes glassSweep{0%,62%{left:-60%;opacity:0}70%{opacity:1}86%{left:120%;opacity:0}100%{left:120%;opacity:0}}@keyframes cardIn{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:380px){.page.active{gap:19px}.quick{grid-template-columns:1fr!important}.menu{min-height:78px!important}.menu span b{font-size:16px!important}.menu span small{font-size:11px!important}}

/* v8 telegram avatars */
.avatar-shell{position:relative;overflow:hidden;flex:0 0 auto}.avatar-shell img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;opacity:0;transition:opacity .28s ease}.avatar-shell img.loaded{opacity:1}.avatar-shell i{font-style:normal}.profile-avatar{width:56px!important;height:56px!important;border-radius:18px!important;display:grid!important;place-items:center!important;background:linear-gradient(145deg,#a986ff,#6232df);font-size:20px;font-weight:900}.brand .avatar-shell{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#a986ff,#6232df);font-weight:900}