/* maiVPN v8.0 — dark red native mini app */
:root{--bg:#0c080a;--panel:#171316;--panel2:#20191d;--text:#f8f6f7;--muted:#a69da2;--red:#ff1535;--red2:#d9082a;--line:#30252b;--green:#33d78b;--radius:23px;color-scheme:dark}
html{scroll-behavior:smooth}body{background:radial-gradient(ellipse 90% 28% at 100% 0%,#27070f 0%,transparent 75%),var(--bg);-webkit-tap-highlight-color:transparent}button{transition:transform .22s cubic-bezier(.2,.8,.2,1),background-color .22s,border-color .22s;touch-action:manipulation}button:active{transform:scale(.975)}.app{position:relative}.accent{color:var(--red)}
.brand-symbol{font-size:77px;line-height:.85;font-weight:1000;color:var(--red);letter-spacing:-.145em;font-family:Arial,Helvetica,sans-serif;padding-right:.17em;transform:scaleX(1.06)}.brand-symbol.small{font-size:42px;width:44px;text-align:left}.loader{gap:13px;animation:appear .5s ease both}.loader>span{font-size:23px;letter-spacing:-.05em}.loader small{font-size:12px;font-weight:500;color:var(--muted)}.loader .brand-symbol{animation:logo-in 1.1s ease both}.topbar{height:78px;padding:17px 20px;background:rgba(12,8,10,.88);border-bottom:1px solid rgba(255,255,255,.045);top:0}.brand{gap:10px}.brand b{font-size:19px;letter-spacing:-.05em}.brand span{font-size:11px}.avatar{background:#28141b;border-color:#42222b;font-size:15px}.page{padding:15px 17px 122px}.page.active{animation:page-in .4s cubic-bezier(.16,1,.3,1) both}
.hero{min-height:unset;border:1px solid #61212f;border-radius:29px;padding:23px 22px 20px;background:radial-gradient(circle at 96% -15%,rgba(255,21,53,.26),transparent 45%),linear-gradient(140deg,#2a0b13,#160b10 62%,#1d0c12);box-shadow:none;overflow:hidden;position:relative}.hero:after{content:'m';position:absolute;right:-20px;top:34px;font-weight:1000;font-family:Arial,sans-serif;font-size:220px;line-height:1;color:rgba(255,21,53,.055);letter-spacing:-.13em;pointer-events:none}.hero-top{display:flex;align-items:center;justify-content:space-between;width:100%;position:relative;z-index:1}.hero-chip{background:#43131f;border:1px solid #772034;color:#ffa9b5;padding:7px 10px;border-radius:99px;font-size:10px;font-weight:850;letter-spacing:.08em;display:flex;align-items:center;gap:7px}.hero-chip i{width:6px;height:6px;background:var(--red);border-radius:50%;animation:pulse 2.5s ease-in-out infinite}.hero-mini{font-size:10px;color:#987780;letter-spacing:.12em}.hero h1{font-size:clamp(35px,9vw,51px);line-height:1.04;letter-spacing:-.06em;margin:33px 0 15px;position:relative;z-index:1}.hero h1 span{color:var(--red)}.hero p{color:#bfaeb5;font-size:14px;line-height:1.55;margin:0 0 22px;position:relative;z-index:1;max-width:310px}.hero-cta{width:100%;background:var(--red);border-radius:16px;padding:15px 18px;display:flex;justify-content:space-between;align-items:center;position:relative;z-index:1;box-shadow:0 9px 26px rgba(255,21,53,.15)}.hero-cta span{font-size:19px}.hero-foot{width:100%;display:flex;justify-content:space-between;gap:8px;margin-top:18px;color:#987b85;font-size:10px;position:relative;z-index:1}
.status-card{margin-top:13px;background:#171215;border-color:#3b272e;padding:20px}.status-top>b{font-size:14px}.status-card h3{font-size:25px;letter-spacing:-.045em}.pill{background:#123124;color:#52e99b}.pill.off{background:#362128;color:#ff7e91}.progress{height:6px;background:#34252b}.progress i{background:var(--red);transition:width .7s ease}
.section-title{margin:30px 3px 15px;display:flex;align-items:end;justify-content:space-between}.section-title h2{font-size:23px;letter-spacing:-.035em;margin:5px 0 0}.section-kicker{font-size:10px;font-weight:800;letter-spacing:.19em;color:var(--red)}.section-num{font-size:11px;color:#69545d;margin-bottom:3px}.feature-grid{gap:11px}.feature{background:#171316;border:1px solid #35282f;border-radius:21px;min-height:151px;padding:17px;position:relative;overflow:hidden}.feature:after{content:'↗';position:absolute;right:17px;top:17px;color:#69414d;font-size:17px}.feature .feature-icon{height:47px;width:47px;border-radius:15px;background:#36151f;color:var(--red);display:flex;align-items:center;justify-content:center;margin-bottom:19px;flex:none}.feature b{font-size:14px;letter-spacing:-.01em}.feature small{font-size:11px;color:#91868c}.feature:disabled{opacity:.5;cursor:not-allowed}.feature:active,.tariff:active{border-color:var(--red)}
.locations{margin-top:4px}.location-row{background:var(--panel);border:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:15px;border-radius:17px;margin:9px 0}.flag{font-size:26px;line-height:1}.location-row>div{flex:1;min-width:0}.location-row b{display:block;font-size:14px}.location-row small{display:block;font-size:11px;color:var(--muted);margin-top:4px}.server-indicator{display:flex;align-items:center;gap:6px;color:#6bdeb0;font-size:11px;white-space:nowrap}.server-indicator i{background:var(--green);height:6px;width:6px;border-radius:50%}.location-row.soon{opacity:.65}.soon .server-indicator{color:var(--muted)}
.page-head{padding:19px 4px 22px}.page-head>span{color:var(--red);opacity:1}.page-head h1{font-size:clamp(30px,8vw,42px);line-height:1.05;letter-spacing:-.055em;margin:12px 0}.page-head p{font-size:14px}.tariff-list{gap:12px}.tariff{background:#181216;border-color:#3b2931;border-radius:22px;padding:22px;transition:transform .2s,border-color .2s}.tariff.featured{background:linear-gradient(130deg,#2d111b,#171115 78%);border-color:#ed1640}.tariff.featured:before{content:'';height:100%;width:3px;background:var(--red);position:absolute;top:0;left:0;border-radius:4px}.tariff .badge{color:#ff6078;font-size:10px}.tariff h3{font-size:22px;letter-spacing:-.04em}.tariff .price{font-size:30px;letter-spacing:-.04em}.account-main,.copy-box,.admin-card{background:#181316;border-color:#392730}.account-main .big{color:#fff}.stat{background:#241b20}.btn.primary{background:var(--red);color:#fff}.btn.secondary{background:#251a20;border:1px solid #413039}.btn{border-radius:15px}.menu-list{border-color:var(--line)}.menu-list a{background:#181316;border-color:var(--line)}.bottom-nav{height:78px;background:rgba(16,10,13,.96);border-top:1px solid #36262e;box-shadow:0 -10px 28px rgba(0,0,0,.18);padding-top:10px}.bottom-nav button{font-size:10px;gap:6px;color:#897a83;font-weight:600}.bottom-nav span{display:flex;align-items:center;justify-content:center;height:25px}.bottom-nav button.active{color:var(--red)}.bottom-nav button.active span{animation:nav-pop .35s ease}.gate-icon{margin-bottom:28px;width:auto;height:auto;background:transparent;line-height:1}.gate{gap:0}.gate h1{font-size:33px}.sheet{background:#1b1419;border-color:#59323d;padding-top:34px;animation:sheet-in .35s cubic-bezier(.16,1,.3,1) both}.sheet:before{content:'';width:38px;height:4px;background:#59434b;position:absolute;top:10px;left:calc(50% - 19px);border-radius:5px}.modal{animation:fade-in .22s both}.modal-open{overflow:hidden}.toast{background:#fff4f5;box-shadow:0 10px 35px #0008}.field input{background:#110d10;border-color:#43303a}.admin-tabs,.admin-tabs button.active{background:#281c22}
@keyframes page-in{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:translateY(0)}}@keyframes sheet-in{from{transform:translateY(35px);opacity:.6}to{transform:translateY(0);opacity:1}}@keyframes fade-in{from{opacity:0}to{opacity:1}}@keyframes appear{from{opacity:0}to{opacity:1}}@keyframes logo-in{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scaleX(1.06)}}@keyframes nav-pop{0%{transform:scale(.8)}60%{transform:scale(1.14)}100%{transform:scale(1)}}@keyframes pulse{50%{opacity:.4;transform:scale(.8)}}
@media(min-width:600px){.hero{padding:34px}.hero h1{font-size:58px}.page{padding-left:28px;padding-right:28px}.hero-foot{max-width:370px}}@media(max-width:360px){.hero h1{font-size:34px}.feature{padding:13px}.feature b{font-size:13px}.hero-foot{font-size:9px}.server-indicator{font-size:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}