@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#070911;--surface:#10121c;--line:rgba(220,211,255,.10);--text:#f5f3ff;--muted:#8d8b9f;--purple:#ab8bff;--purple2:#7151e8;--cyan:#77d9ff;--highlight:#d4c3ff;font-family:Manrope,Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 46% -32%,#242039 0%,#0b0b16 40%,#070911 78%);color:var(--text)}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}.ambient{position:fixed;border-radius:100%;filter:blur(110px);pointer-events:none;opacity:.3}.ambient-one{width:390px;height:490px;top:-100px;left:calc(50% - 630px);background:#5030a8}.ambient-two{width:280px;height:300px;bottom:-100px;right:calc(50% - 540px);background:#174270}.desktop-caption{text-align:center;position:relative;padding:24px 0 18px;letter-spacing:.3em;font-size:9px;font-weight:800;color:#736f8c}.desktop-star{color:#a088dc;padding:0 20px}.app-shell{margin:0 auto;max-width:440px;min-height:900px;position:relative;overflow:hidden;background:linear-gradient(180deg,#0c0d18 0%,#070911 23%,#080911 100%);box-shadow:0 40px 120px #0009,0 0 0 1px #ffffff12;padding-bottom:104px}.top-hairline{height:3px;background:linear-gradient(90deg,transparent,#987de2 30%,#d9bfff 55%,#6b5ebc 78%,transparent)}.topbar{height:83px;display:flex;align-items:center;justify-content:space-between;padding:8px 24px 0}.brand{display:flex;gap:10px;align-items:center;background:transparent;border:0;color:inherit;padding:0;text-align:left}.brand-emblem{width:36px;height:36px;display:grid;place-items:center;background:linear-gradient(135deg,#d9c8ff,#9675ed);box-shadow:0 0 24px #8d6ce43b;border-radius:12px;color:#141123}.brand-emblem svg{height:26px;width:26px}.brand-type{display:flex;flex-direction:column;gap:3px}.brand-type strong{font-size:17px;line-height:1;letter-spacing:.19em;font-weight:800}.brand-type small{color:#75748b;font-size:6.5px;letter-spacing:.25em;font-weight:800}.profile-button{width:39px;height:39px;background:#161621;border:1px solid #29263b;border-radius:13px;color:#c3b9e2;display:grid;place-items:center}.line-icon{height:19px;width:19px;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;fill:none;flex-shrink:0}.demo-notice{display:flex;justify-content:center;align-items:center;gap:8px;font-size:10px;letter-spacing:.01em;background:#231b32;border:1px solid #4d3867;border-radius:8px;padding:8px 10px;margin:0 24px 15px;color:#ccb6f7}.demo-notice .dot{height:5px;width:5px;border-radius:100%;background:#bfa3ff;box-shadow:0 0 8px #c4a5ff}.demo-sep{opacity:.35}.screen{display:none;padding:8px 22px 16px}.screen-active{display:block;animation:rise .28s ease-out}@keyframes rise{from{opacity:.5;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}.eyebrow{color:#b9a3ff;font-size:9px;font-weight:800;letter-spacing:.24em}.intro{padding:8px 2px 19px}.intro h1,.screen-heading h1{font-size:32px;line-height:1.17;letter-spacing:-1.4px;font-weight:800;margin:10px 0 9px}.intro h1 em,.screen-heading h1 em{font-style:normal;color:#bea8fb}.intro p,.screen-heading p{font-size:12px;color:var(--muted);margin:0}.hero-panel{border:1px solid rgba(201,174,255,.21);border-radius:23px;position:relative;overflow:hidden;padding:20px 21px 21px;background:radial-gradient(ellipse at 50% 41%,#282044 0%,#171425 42%,#100f1d 79%);box-shadow:inset 0 1px 0 #ffffff14,0 18px 45px #0005;isolation:isolate}.hero-panel:before{content:"";position:absolute;inset:0;background:linear-gradient(130deg,#ffffff09,transparent 35%,#af82ff07);pointer-events:none}.hero-halo{position:absolute;border-radius:100%;filter:blur(30px);opacity:.4;pointer-events:none}.halo-a{width:160px;height:160px;top:50px;left:95px;background:#6545d8}.halo-b{width:160px;height:190px;top:120px;right:-70px;background:#1c6a9c;opacity:.22}.hero-top{display:flex;justify-content:space-between;align-items:center;position:relative;z-index:1}.micro-label{color:#9891b5;font-size:9px;letter-spacing:.15em;font-weight:800}.panel-sparkle{font-size:21px;color:#ceb6ff}.orb-wrap{height:205px;display:flex;justify-content:center;align-items:center;position:relative}.orb-orbit{position:absolute;border-radius:50%;border:1px solid rgba(192,167,255,.15)}.orbit-one{width:171px;height:171px;box-shadow:0 0 0 13px #b78cff07}.orbit-two{width:205px;height:205px;border:1px dashed #b89cff21}.orb{height:133px;width:133px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 39% 26%,#bda0ff 0%,#8265d6 25%,#392971 66%,#17132f 100%);border:1px solid #d9c4ff69;box-shadow:0 0 33px #9a72ec50,inset 0 2px 17px #e2d3ff30,0 14px 55px #0009;position:relative;z-index:2;animation:float 5s ease-in-out infinite}.orb:after{content:"";position:absolute;inset:9px;border:1px solid #ffffff13;border-radius:50%}.orb svg{height:58px;width:58px;color:#eee8ff;filter:drop-shadow(0 8px 8px #25164b);z-index:1}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}.hero-status{text-align:center;display:flex;gap:8px;align-items:center;justify-content:center;font-size:13px;font-weight:800;position:relative;z-index:1}.status-beacon{height:7px;width:7px;border-radius:50%;background:#d7b46b;box-shadow:0 0 9px #c99e49}.hero-note{margin:8px 0 22px;font-size:10px;color:#ada4c4;text-align:center}.primary-button{width:100%;min-height:53px;border:1px solid #e7d9ff63;border-radius:13px;background:linear-gradient(110deg,#d2bbff 0%,#b197ef 52%,#9278e8 100%);color:#161124;font-size:12px;font-weight:800;box-shadow:0 6px 24px #9a71f035;display:flex;align-items:center;justify-content:center;gap:10px;position:relative}.primary-button .arrow{position:absolute;right:16px;font-size:18px}.hero-footnote{font-size:9px;margin-top:11px;text-align:center;color:#827992}.section-row{margin:27px 1px 12px;display:flex;align-items:center;justify-content:space-between}.section-row h2{margin:0;font-size:17px;letter-spacing:-.5px}.text-action{padding:6px 0;background:none;border:0;color:#b99bf6;font-size:10px;font-weight:800;display:flex;align-items:center;gap:3px}.text-action .line-icon{width:13px;height:13px}.my-plan{width:100%;text-align:left;display:flex;align-items:center;gap:12px;border-radius:14px;background:linear-gradient(105deg,#1c172b,#12131f);border:1px solid #423258;padding:15px;color:inherit}.plan-logo{height:46px;width:46px;border-radius:12px;background:linear-gradient(145deg,#594192,#211832);border:1px solid #8b6ac75c;display:grid;place-items:center;color:#d9c6ff;font-size:26px}.my-plan-text{display:flex;flex-direction:column;gap:4px;flex:1}.my-plan-text strong{font-size:13px}.my-plan-text span{color:#aaa2bc;font-size:10px}.chevron{color:#8d7fb2;font-size:24px}.server-list{display:grid;gap:9px}.server-card{display:flex;align-items:center;gap:12px;padding:14px 13px;background:linear-gradient(115deg,#181923,#11131d);border:1px solid #242632;border-radius:14px;min-height:74px;width:100%;color:inherit;text-align:left;position:relative;overflow:hidden;transition:transform .15s,border .15s}.server-card:active{transform:scale(.99)}.server-card.featured{border-color:#514367;background:linear-gradient(115deg,#201a31,#131420)}.server-icon{height:42px;width:42px;border-radius:12px;background:#242535;display:grid;place-items:center;font-size:24px;border:1px solid #393044;flex-shrink:0}.server-info{flex:1;min-width:0}.server-name{font-size:12px;font-weight:800;letter-spacing:-.18px;display:block;white-space:normal}.server-meta{font-size:10px;color:#85849b;margin-top:5px;display:flex;align-items:center;gap:7px}.server-meta .mini-line{height:3px;width:3px;background:#777289;border-radius:50%}.server-side{display:flex;flex-direction:column;align-items:flex-end;gap:7px;flex-shrink:0}.server-status{color:#a9a4b7;font-size:9px}.server-status.locked{color:#aa86e8}.lock-icon{height:17px;width:17px;stroke:#a28db8;fill:none;stroke-width:1.5}.disclaimer-box{margin-top:18px;background:#14141e;border:1px solid #292335;border-radius:12px;padding:13px;display:flex;align-items:flex-start;gap:10px;color:#8f899e;font-size:10px;line-height:1.6}.disclaimer-box .line-icon{width:16px;height:16px;color:#baa1e7;margin-top:1px}.screen-heading{padding:15px 1px 23px}.screen-heading h1{margin-top:11px;font-size:30px}.screen-heading p{line-height:1.5}.mode-selector{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;padding:0 0 16px;margin-right:-22px}.mode-selector::-webkit-scrollbar{display:none}.mode{white-space:nowrap;border-radius:10px;border:1px solid #292737;background:#13151f;color:#88879b;padding:10px 13px;font-size:10px;font-weight:800}.mode.active{background:#312445;border-color:#8a6dc5;color:#e1d3ff;box-shadow:inset 0 1px 0 #ffffff10}.plan-list{display:grid;gap:12px}.plan-card{border-radius:17px;border:1px solid #2a2938;background:linear-gradient(135deg,#171722,#10121d);padding:20px;overflow:hidden;position:relative}.plan-card.special{border-color:#8e72db;background:radial-gradient(ellipse at 97% 1%,#332750 0%,#181723 60%,#141420 100%);box-shadow:0 0 33px #563a9424}.plan-ribbon{position:absolute;top:0;right:0;border-radius:0 0 0 12px;background:#ad94ef;color:#181126;font-size:9px;font-weight:800;padding:7px 13px;letter-spacing:.05em}.plan-upper{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.plan-title{font-size:21px;font-weight:800;letter-spacing:-.7px}.plan-description{font-size:10px;color:#9993ab;margin-top:4px}.plan-device{margin-top:14px;border-radius:9px;color:#d4bcff;background:#342743;padding:8px 10px;display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:800}.plan-device svg{width:14px;height:14px}.plan-points{list-style:none;margin:16px 0 17px;padding:0;display:grid;gap:10px}.plan-points li{display:flex;gap:8px;align-items:flex-start;font-size:11px;color:#d2cddf}.plan-points svg{height:14px;width:14px;color:#bda1ff;stroke-width:2}.plan-cta{width:100%;border-radius:10px;padding:11px;border:1px solid #4b405f;background:#272034;color:#d7c4ff;font-size:11px;font-weight:800}.special .plan-cta{background:#c8b1ff;color:#161022;border-color:#c8b1ff}.plan-price{font-size:10px;color:#a3a0b1;margin-top:12px}.account-hero{display:flex;align-items:center;gap:12px;background:linear-gradient(125deg,#231c36,#13141f);border:1px solid #4b3a68;border-radius:16px;padding:18px}.account-avatar{width:48px;height:48px;background:#ac91ef;color:#21182d;display:grid;place-items:center;border-radius:15px;font-size:27px}.account-hero>div:last-child{display:grid;gap:5px}.account-hero strong{font-size:15px}.account-hero span{font-size:10px;color:#b4a5ce}.account-title{color:#777188;font-size:9px;font-weight:800;letter-spacing:.18em;margin:28px 0 11px}.info-card{background:#13141f;border:1px solid #292839;border-radius:15px;padding:0 16px}.info-card div{display:flex;justify-content:space-between;gap:6px;align-items:center;padding:17px 0;border-bottom:1px solid #292635}.info-card div:last-child{border:0}.info-card span{font-size:10px;color:#85839a}.info-card strong{font-size:11px;font-weight:800;text-align:right}.outline-button{width:100%;display:flex;justify-content:space-between;align-items:center;padding:16px;margin-top:13px;border:1px solid #322d40;background:#171622;color:#dcd2ed;border-radius:11px;font-size:11px;font-weight:800}.outline-button span{font-size:17px;color:#b899ed}.tiny-note{text-align:center;font-size:10px;color:#686577;line-height:1.8;margin-top:33px}.bottom-nav{z-index:5;position:absolute;bottom:0;left:0;right:0;height:82px;padding:8px 10px max(10px,env(safe-area-inset-bottom));display:flex;background:linear-gradient(180deg,#11121eea,#0e101bfa);backdrop-filter:blur(20px);border-top:1px solid #32293d;box-shadow:0 -10px 25px #0005}.nav-item{width:25%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;border:0;background:transparent;color:#747188;font-weight:800;font-size:9px}.nav-item .line-icon{width:21px;height:21px;stroke-width:1.7}.nav-item.selected{color:#ccb4ff}.nav-item.selected .line-icon{filter:drop-shadow(0 0 9px #b69bfc55)}.modal-backdrop{position:fixed;inset:0;z-index:20;background:#020209b8;display:none;align-items:flex-end;justify-content:center;backdrop-filter:blur(4px)}.modal-backdrop.visible{display:flex}.modal-sheet{background:linear-gradient(145deg,#211a34,#141521);border:1px solid #655180;border-radius:24px 24px 0 0;padding:15px 23px 28px;width:min(100%,440px);box-shadow:0 -10px 80px #0008;position:relative}.modal-handle{height:4px;width:43px;border-radius:3px;background:#625472;margin:0 auto 29px}.modal-close{position:absolute;right:18px;top:20px;border:0;background:#342b48;color:#cab7ed;height:31px;width:31px;border-radius:9px}.modal-close svg{height:15px;width:15px}.modal-sheet h2{font-size:22px;letter-spacing:-.8px;margin:13px 0}.modal-sheet p{color:#ada3bf;font-size:12px;line-height:1.8;margin:0 0 27px;white-space:pre-line}@media(max-width:500px){.desktop-caption{display:none}.app-shell{width:100%;max-width:none;min-height:100dvh;box-shadow:none;padding-bottom:110px}.bottom-nav{position:fixed;max-width:none}.screen{padding-left:21px;padding-right:21px}.mode-selector{margin-right:-21px}.ambient{display:none}}@media(min-width:501px){.app-shell{border-radius:23px 23px 0 0;margin-bottom:50px}.bottom-nav{position:sticky;bottom:0;margin-top:0;height:75px}.app-shell{padding-bottom:0}.modal-backdrop{align-items:center}.modal-sheet{border-radius:20px;padding-bottom:25px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

/* Tier-specific accents: visual status, not additional network privileges. */
.app-shell{--tier:#af92f5;--tier-dark:#593f90;--tier-rgb:175,146,245}
.app-shell[data-theme="lite"]{--tier:#74dcff;--tier-dark:#20546f;--tier-rgb:116,220,255}
.app-shell[data-theme="standard"]{--tier:#407dff;--tier-dark:#1b397a;--tier-rgb:64,125,255}
.app-shell[data-theme="premium"]{--tier:#b874ff;--tier-dark:#5f278f;--tier-rgb:184,116,255}
.app-shell .top-hairline{background:linear-gradient(90deg,transparent,var(--tier),#f2e9ff,var(--tier),transparent)}
.app-shell .my-plan,.app-shell .account-hero{border-color:rgba(var(--tier-rgb),.45);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 8px 34px rgba(var(--tier-rgb),.08)}
.app-shell .account-avatar{background:var(--tier);color:#111321;box-shadow:0 0 26px rgba(var(--tier-rgb),.32)}
.app-shell .nav-item.selected,.app-shell .eyebrow,.app-shell .text-action{color:var(--tier)}
.app-shell[data-theme="premium"] #screen-account.screen-active:before{content:"";z-index:0;position:absolute;pointer-events:none;inset:0;background:radial-gradient(circle at 90% 12%,rgba(120,51,206,.22),transparent 32%),radial-gradient(circle at 15% 38%,rgba(71,17,139,.23),transparent 35%);animation:premiumBackdrop 8s ease-in-out infinite alternate}
.app-shell[data-theme="standard"] #screen-account.screen-active:before,.app-shell[data-theme="lite"] #screen-account.screen-active:before{content:"";position:absolute;pointer-events:none;inset:0;background:radial-gradient(circle at 80% 20%,rgba(var(--tier-rgb),.11),transparent 45%)}
#screen-account{position:relative;isolation:isolate}
#screen-account>*{position:relative}
@keyframes premiumBackdrop{from{opacity:.55;transform:translateY(-14px)}to{opacity:1;transform:translateY(14px)}}
.device-addon{position:relative;isolation:isolate;margin-top:19px;padding:21px 19px 16px;border:1px solid rgba(var(--tier-rgb),.38);background:linear-gradient(120deg,rgba(var(--tier-rgb),.13),#14151f 60%,#11141b);border-radius:19px;box-shadow:inset 0 1px 0 #ffffff14,0 14px 30px #0002;overflow:hidden}
.addon-sheen{position:absolute;pointer-events:none;width:180px;height:180px;right:-65px;top:-65px;border-radius:50%;background:rgba(var(--tier-rgb),.18);filter:blur(55px)}
.addon-kicker{font-size:9px;letter-spacing:.22em;color:var(--tier);font-weight:800}
.addon-title-row{display:flex;justify-content:space-between;align-items:flex-start;margin-top:14px}
.addon-title-row h2{font-size:21px;letter-spacing:-.7px;margin:0 0 5px}
.addon-title-row p{font-size:10px;color:#9996ad;margin:0}
.addon-symbol{font-size:34px;color:var(--tier);filter:drop-shadow(0 0 12px rgba(var(--tier-rgb),.6))}
.addon-counter-row{display:flex;align-items:center;justify-content:space-between;margin:22px 0 18px;gap:12px}
.addon-count-label{font-size:10px;color:#9d9aaf;margin-bottom:4px}
.addon-counter-row strong{font-size:31px;font-weight:800;line-height:1.1;font-variant-numeric:tabular-nums}
.counter-control{display:flex;align-items:center;gap:14px;background:#080c16aa;border:1px solid rgba(var(--tier-rgb),.33);border-radius:13px;padding:6px}
.counter-control button{display:grid;place-items:center;border:0;width:36px;height:36px;border-radius:9px;background:rgba(var(--tier-rgb),.18);color:var(--tier);font-size:23px;font-weight:500}
.counter-control button:disabled{opacity:.24;cursor:not-allowed}
.counter-control span{font-size:17px;font-weight:800;font-variant-numeric:tabular-nums;min-width:16px;text-align:center}
.addon-price-row{border-top:1px solid rgba(var(--tier-rgb),.20);padding-top:16px;display:flex;justify-content:space-between;align-items:center;gap:10px}
.addon-price-row>div{display:grid;gap:5px}.addon-price-row span{font-size:11px;font-weight:800}.addon-price-row small{font-size:9px;color:#8f8ca3}
.addon-price-row>strong{color:var(--tier);font-size:23px;letter-spacing:-.8px;white-space:nowrap;font-variant-numeric:tabular-nums}
.addon-price-row>strong small{font-size:10px;letter-spacing:normal}
.addon-warning{color:#868199;font-size:9px;line-height:1.6;margin:14px 0 0}
@media(prefers-reduced-motion:reduce){.app-shell[data-theme="premium"] #screen-account.screen-active:before{animation:none}}

/* Subscription-specific accents and wallpaper-like atmospheric backgrounds */
.app-shell{--tier:#ad8bff;--tier-glow:rgba(156,91,255,.25);--tier-soft:#362348}
.app-shell[data-tier="lite"]{--tier:#7fe8ff;--tier-glow:rgba(71,222,255,.20);--tier-soft:#153b48}
.app-shell[data-tier="standard"]{--tier:#538bff;--tier-glow:rgba(50,99,255,.24);--tier-soft:#1a2754}
.app-shell[data-tier="premium"]{--tier:#c17bff;--tier-glow:rgba(187,92,255,.30);--tier-soft:#47225d}
.app-shell:before{content:"";position:absolute;inset:80px -130px 0;pointer-events:none;z-index:0;opacity:.84;background:radial-gradient(ellipse at 68% 4%,var(--tier-glow),transparent 27%),radial-gradient(ellipse at 15% 38%,var(--tier-glow),transparent 26%);filter:blur(12px);}
.app-shell[data-tier="premium"]:before{background:radial-gradient(ellipse at 85% 4%,#b051ff45,transparent 36%),radial-gradient(ellipse at 2% 40%,#6f35e040,transparent 30%),repeating-linear-gradient(118deg,transparent 0 75px,#b474ff08 76px 77px,transparent 78px 130px);animation:phantom-nebula 18s ease-in-out infinite alternate}
@keyframes phantom-nebula{from{transform:translateY(-8px) scale(1)}to{transform:translateY(20px) scale(1.045)}}
/* Keep panels above wallpaper. Do not override bottom nav's fixed/sticky positioning. */
.topbar,.demo-notice,.screen{position:relative;z-index:1}
.nav-item.selected,.text-action{color:var(--tier)}
.my-plan{border-color:color-mix(in srgb,var(--tier) 35%,#1d1d29)}
.plan-logo,.account-avatar{background:linear-gradient(135deg,var(--tier-soft),#171524);color:var(--tier);box-shadow:0 0 25px var(--tier-glow)}
.account-hero{position:relative;overflow:hidden;border-color:color-mix(in srgb,var(--tier) 45%,#262336);background:linear-gradient(125deg,var(--tier-soft),#13141f 78%)}
.account-hero:before{content:"✦   ✧";position:absolute;inset:-44px -5px auto auto;transform:rotate(-18deg);font-size:105px;letter-spacing:10px;opacity:.075;color:var(--tier);pointer-events:none}
.account-hero > *{position:relative;z-index:1}
.plan-price{display:flex;align-items:baseline;gap:5px;margin-top:13px}
.plan-price strong{font-size:22px;letter-spacing:-.7px;color:#f8f6ff}
.plan-price span{font-size:10px;color:#aaa4b9}
.device-picker{margin-top:10px;border:1px solid color-mix(in srgb,var(--tier) 35%,#282436);border-radius:17px;padding:16px;background:radial-gradient(ellipse at 95% 0%,var(--tier-glow),transparent 57%),linear-gradient(125deg,#171723,#10121d)}
.device-picker-top,.device-picker-middle,.device-picker-total{display:flex;justify-content:space-between;align-items:center;gap:10px}
.device-mini-label{font-size:9px;letter-spacing:.14em;color:#d2c9db;font-weight:800}
.device-mini-price{font-size:9px;color:#a89cb6}
.device-picker-middle{padding:20px 0 16px}
.device-picker-caption{font-size:12px;color:#ded8eb;font-weight:800}
.device-picker-control{display:flex;align-items:center;gap:12px}
.device-picker-control button{height:35px;width:35px;border-radius:11px;border:1px solid color-mix(in srgb,var(--tier) 35%,#292a33);background:var(--tier-soft);color:var(--tier);font-size:23px;line-height:1}
.device-picker-control button:disabled{opacity:.35;cursor:not-allowed}
.device-picker-control strong{min-width:19px;text-align:center;font-size:18px}
.device-picker-total{border-top:1px solid #ffffff16;padding-top:14px}
.device-picker-total div{display:flex;flex-direction:column;gap:5px}
.device-picker-total small{font-size:9px;letter-spacing:.1em;color:#aaa4bb;font-weight:800}
.device-picker-total strong{font-size:21px;letter-spacing:-.5px;color:var(--tier)}
.device-picker-total>span{font-size:30px;color:var(--tier);filter:drop-shadow(0 0 10px var(--tier))}
.device-picker p{font-size:10px;line-height:1.5;margin:12px 0 0;color:#a6a0b5}
.device-picker #deviceMode{margin-top:4px;color:#777085}
@media(prefers-reduced-motion:reduce){.app-shell[data-tier="premium"]:before{animation:none}}

/* PHANTOM 0.3 — authored wallpaper layers + consistent plan visual system */
.app-shell[data-theme="lite"]{--tier:#80e8ff;--tier-rgb:128,232,255;--tier-glow:rgba(128,232,255,.20)}
.app-shell[data-theme="standard"]{--tier:#5b93ff;--tier-rgb:91,147,255;--tier-glow:rgba(91,147,255,.20)}
.app-shell[data-theme="premium"]{--tier:#cb83ff;--tier-rgb:203,131,255;--tier-glow:rgba(203,131,255,.28)}
.app-shell{isolation:isolate;overflow:hidden}
.app-shell::before{position:absolute!important;inset:65px 0 0!important;background-image:url('/static/wallpapers/premium.svg')!important;background-size:100% auto!important;background-position:center top!important;background-repeat:repeat-y!important;filter:none!important;z-index:-1!important;opacity:.39!important;animation:none!important;transform:none!important}
.app-shell[data-theme="lite"]::before{background-image:url('/static/wallpapers/lite.svg')!important;opacity:.30!important}
.app-shell[data-theme="standard"]::before{background-image:url('/static/wallpapers/standard.svg')!important;opacity:.34!important}
.app-shell[data-theme="premium"]::before{opacity:.57!important;animation:phantomDrift 18s ease-in-out infinite alternate!important}
@keyframes phantomDrift{from{transform:translateY(-14px) scale(1)!important}to{transform:translateY(22px) scale(1.06)!important}}
.app-shell .primary-button,.app-shell .counter-control button{box-shadow:0 0 24px rgba(var(--tier-rgb),.16)}
.app-shell .my-plan,.app-shell .account-hero{background:linear-gradient(135deg,rgba(var(--tier-rgb),.13),rgba(13,16,26,.88) 65%)}
.app-shell .plan-logo{color:var(--tier)}
.app-shell[data-theme="premium"] .account-hero{box-shadow:0 0 30px rgba(194,96,255,.14),inset 0 1px 0 #ffffff23}
.account-badge{display:inline-flex;align-items:center;gap:6px;font-size:9px;font-weight:900;letter-spacing:.19em;color:var(--tier);padding:6px 9px;border:1px solid rgba(var(--tier-rgb),.38);border-radius:30px;background:rgba(var(--tier-rgb),.09);margin-top:8px}
.account-badge::before{content:'✦';font-size:13px}
.account-badge.premium{box-shadow:0 0 25px rgba(203,131,255,.28);animation:badgeGlint 4s ease-in-out infinite alternate}
@keyframes badgeGlint{from{filter:brightness(.92)}to{filter:brightness(1.22)}}
.user-devices{margin-top:14px;display:grid;gap:9px}
.user-device{border:1px solid rgba(var(--tier-rgb),.19);border-radius:13px;padding:12px;background:#0e111bba;display:flex;align-items:center;justify-content:space-between;gap:9px}
.user-device strong{font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px}
.user-device small{font-size:10px;color:#8e8ba0;display:block;margin-top:4px}
.mini-cta{border:1px solid rgba(var(--tier-rgb),.5);border-radius:10px;padding:9px 10px;background:rgba(var(--tier-rgb),.12);font-size:10px;font-weight:800;color:var(--tier);white-space:nowrap}
.mini-cta:disabled{opacity:.4}
.price-recap{padding:12px 0 0;border-top:1px solid rgba(var(--tier-rgb),.18);display:flex;align-items:center;justify-content:space-between;gap:8px;font-weight:800;font-size:11px}
.price-recap strong{font-size:18px;color:var(--tier)}
.plan-cta.checkout{background:linear-gradient(90deg,rgba(var(--tier-rgb),.3),rgba(var(--tier-rgb),.12));border-color:rgba(var(--tier-rgb),.4)}
@media(prefers-reduced-motion:reduce){.app-shell[data-theme="premium"]::before,.account-badge.premium{animation:none!important}}

/* Official Happ installation choices · matches active Lite/Standard/Premium theme */
.happ-download-card{position:relative;isolation:isolate;overflow:hidden;margin:18px 0 2px;padding:18px 18px 16px;border:1px solid rgba(var(--tier-rgb,203,131,255),.30);border-radius:20px;background:radial-gradient(ellipse at 95% 0%,rgba(var(--tier-rgb,203,131,255),.13),transparent 56%),linear-gradient(135deg,rgba(23,24,39,.98),rgba(12,14,25,.97));box-shadow:inset 0 1px 0 #ffffff18,0 11px 35px #0003}
.happ-download-card:after{content:"";position:absolute;inset:-55px -60px auto auto;width:170px;height:170px;border-radius:50%;background:rgba(var(--tier-rgb,203,131,255),.10);filter:blur(35px);pointer-events:none;z-index:-1}
.happ-download-top{display:flex;align-items:center;gap:8px}
.happ-download-emblem{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;color:var(--tier);border:1px solid rgba(var(--tier-rgb),.25);background:rgba(var(--tier-rgb),.11)}
.happ-download-emblem .line-icon{width:15px;height:15px}
.happ-download-eyebrow{font-size:9px;letter-spacing:.2em;font-weight:800;color:var(--tier)}
.happ-download-card h2{margin:14px 0 5px;font-size:23px;letter-spacing:-.9px;line-height:1.15}
.happ-download-card h2 em{font-style:normal;color:var(--tier)}
.happ-download-card>p{margin:0 0 14px;color:#a7a2b5;font-size:10px;line-height:1.6}
.happ-download-links{display:grid;gap:8px}
.happ-download-link{display:flex;align-items:center;gap:12px;min-height:56px;padding:9px 12px;border-radius:13px;border:1px solid rgba(212,203,246,.12);background:linear-gradient(110deg,#1a1b29,#10131e);text-decoration:none;color:#f7f5ff;transition:background .15s,border-color .15s,transform .15s;-webkit-tap-highlight-color:transparent}
.happ-download-link:active{transform:scale(.99)}
.happ-download-link:hover,.happ-download-link:focus-visible{border-color:rgba(var(--tier-rgb),.5);background:linear-gradient(110deg,rgba(var(--tier-rgb),.15),#10131e)}
.happ-platform-icon{display:grid;place-items:center;width:35px;height:35px;flex-shrink:0;border-radius:10px;color:var(--tier);background:rgba(var(--tier-rgb),.12);font-size:23px;font-weight:700}
.happ-platform-icon .line-icon{width:20px;height:20px}
.happ-platform-label{display:flex;flex-direction:column;gap:3px;flex:1}
.happ-platform-label strong{font-size:12px;font-weight:800}
.happ-platform-label small{font-size:10px;color:#a49eb5}
.happ-download-arrow{color:var(--tier);font-size:17px}
.happ-download-help{margin-top:14px;font-size:9px;line-height:1.6;color:#8f8a9d}
.happ-download-help a{color:var(--tier);text-decoration:none;border-bottom:1px solid rgba(var(--tier-rgb),.40)}

.happ-ios-mark{font-size:12px;font-weight:900;letter-spacing:-.3px}

/* Paid setup is not merely visually dimmed: hidden blocks never render for guests. */
[hidden]{display:none!important}
.paid-setup{position:relative;display:grid;gap:12px;margin:17px 0;padding:19px 16px;border:1px solid rgba(var(--tier-rgb),.36);border-radius:20px;background:radial-gradient(ellipse at top right,rgba(var(--tier-rgb),.17),transparent 68%),#10121ebf;box-shadow:0 20px 60px #0003,inset 0 1px #ffffff16}
.paid-setup-kicker{font-size:9px;font-weight:900;letter-spacing:.18em;color:var(--tier)}
.paid-setup h2{font-size:21px;line-height:1.18;margin:0 0 4px;letter-spacing:-.6px}
.paid-setup h2 em{font-style:normal;color:var(--tier)}
.paid-step{display:flex;align-items:flex-start;gap:12px;padding:7px 0}
.step-digit{font-weight:900;font-size:15px;color:var(--tier);padding:6px 9px;border-radius:9px;background:rgba(var(--tier-rgb),.10);border:1px solid rgba(var(--tier-rgb),.22)}
.paid-step strong{display:block;font-size:12px;color:#f7f5ff;margin-bottom:4px}
.paid-step p{font-size:10px;color:#aba6bb;line-height:1.55;margin:0}
.paid-setup .primary-button{margin:0}
.happ-download-card[hidden],.paid-setup[hidden]{display:none!important}
.preview-paid-switch{display:inline-flex;margin:8px 0 0;align-items:center;gap:8px;font-size:10px;font-weight:700;color:#bbaee3;border:1px dashed #8066ab;padding:9px 11px;border-radius:13px;background:#161321}

.mini-danger{border-color:#aa53666e;color:#ff8a9e;padding:8px 11px;flex-shrink:0}.user-device{flex-wrap:wrap}.user-device>div{flex:1;min-width:120px}

/* Independent reachability laboratory (not a claimed whitelist bypass). */
.network-diagnostic{position:relative;overflow:hidden;margin:22px 0 18px;padding:22px 20px 18px;border:1px solid rgba(161,128,255,.31);border-radius:23px;background:radial-gradient(ellipse at top right,rgba(107,64,187,.23),transparent 62%),linear-gradient(148deg,rgba(21,19,41,.97),rgba(11,13,26,.98));box-shadow:inset 0 1px 0 rgba(255,255,255,.055)}
.diagnostic-kicker{font-size:10px;font-weight:750;letter-spacing:.18em;color:#baa5ed}
.network-diagnostic h2{font-size:23px;margin:8px 0 9px;line-height:1.2;color:#fff}
.network-diagnostic h2 em{font-style:normal;color:#c8a3ff}
.network-diagnostic p{font-size:12px;line-height:1.65;color:#c4bfd8;margin:0 0 14px}
.network-diagnostic p strong{color:#fff;font-weight:650}
.network-diagnostic .outline-button{margin-bottom:10px}
.network-probe-result{min-height:34px;white-space:pre-line}
.network-probe-result.ok{color:#7fdfbe!important}
.network-probe-result.warn{color:#ffd596!important}
