*{box-sizing:border-box}
body{margin:0;font:16px/1.5 system-ui,Segoe UI,Roboto,Arial,sans-serif;background:#12151c;color:#e6e9ef}
a{color:#f5a623}
.wrap{max-width:1000px;margin:0 auto;padding:0 16px}
.top{background:#0b0d12;border-bottom:2px solid #f5a623;padding:14px 0}
.top .wrap{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.logo{font-size:22px;font-weight:700;color:#fff;text-decoration:none}
.sub{color:#8b93a5}
main{padding:24px 16px 48px}
h1{margin:0 0 8px}
.lead{color:#aab2c3;margin-top:0}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-top:20px}
.card{background:#1b2030;border:1px solid #2a3147;border-radius:10px;padding:18px}
.card.narrow{max-width:480px}
.card h2{margin:0 0 6px;color:#f5a623}
.desc{color:#aab2c3;font-size:14px;margin-bottom:10px}
label{display:block;font-size:13px;color:#8b93a5;margin:10px 0}
input,select,textarea{display:block;width:100%;margin-top:4px;padding:9px 10px;background:#0f1320;color:#e6e9ef;border:1px solid #2a3147;border-radius:6px;font:inherit}
textarea{min-height:90px}
.btn{display:inline-block;margin-top:8px;padding:10px 18px;background:#f5a623;color:#111;border:0;border-radius:6px;font-weight:700;cursor:pointer;text-decoration:none}
.btn.sec{background:#2a3147;color:#e6e9ef}
.btn.danger{background:#c0392b;color:#fff}
.alert{padding:10px 14px;border-radius:6px;margin:12px 0}
.alert.err{background:#3b1a1a;border:1px solid #7a2b2b}
.alert.ok{background:#173324;border:1px solid #2b7a4b}
.alert.warn{background:#3a3217;border:1px solid #7a6a2b}
table{width:100%;border-collapse:collapse;margin:12px 0;font-size:14px}
th,td{text-align:left;padding:8px;border-bottom:1px solid #2a3147;vertical-align:top}
th{color:#8b93a5;font-weight:600}
.nav{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.inline{display:inline}
.foot{border-top:1px solid #2a3147;color:#8b93a5;padding:16px 0;font-size:14px}

/* ---- v2: навигация, статус, формы входа, чат ---- */
body{background:radial-gradient(1200px 500px at 50% -200px,#2a2113 0,#12151c 60%) no-repeat,#12151c}
.bar{justify-content:space-between}
.menu{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.menu a{color:#cfd5e3;text-decoration:none;font-weight:500}
.menu a:hover{color:#f5a623}
.btn.small{padding:6px 12px;margin:0;color:#111}
.linkbtn{background:none;border:0;color:#8b93a5;cursor:pointer;font:inherit;padding:0}
.linkbtn:hover{color:#f5a623}
.status{background:#0f121a;border-bottom:1px solid #222a3d;font-size:14px;color:#aab2c3;padding:7px 0}
.status code{background:#1b2030;padding:1px 6px;border-radius:4px;color:#f5a623}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:4px}
.dot.on{background:#2ecc71;box-shadow:0 0 8px #2ecc71}
.dot.off{background:#c0392b}
.authbox{max-width:420px;margin:20px auto}
.btn.wide{width:100%}
.muted{color:#8b93a5}
.tag{padding:2px 8px;border-radius:10px;background:#3a3217;font-size:12px}
.tag.ok{background:#173324;color:#7ee2a8}
.card{transition:border-color .2s,transform .2s}
.cards .card:hover{border-color:#f5a623;transform:translateY(-2px)}
.chat{background:#1b2030;border:1px solid #2a3147;border-radius:10px;overflow:hidden}
.chat-log{height:420px;overflow-y:auto;padding:12px 14px}
.msg{padding:3px 0;word-wrap:break-word;overflow-wrap:anywhere}
.msg .t{color:#6b7388;font-size:12px;margin-right:8px}
.msg b{color:#f5a623;margin-right:8px}
.chat-form{display:flex;gap:8px;padding:10px;border-top:1px solid #2a3147;background:#151a28}
.chat-form input{margin:0;flex:1}
.chat-form .btn{margin:0}
.chat-err{color:#ff8a80;padding:0 12px 8px;font-size:13px;min-height:4px}
.chat-note{padding:14px;border-top:1px solid #2a3147;color:#aab2c3}
.hero{padding:26px 0 8px}
.hero h1{font-size:34px}
@media(max-width:600px){.hero h1{font-size:26px}.chat-log{height:340px}}

/* ---- v3: анимации и полировка ---- */
html{scroll-behavior:smooth}
body{background:#0e1118;position:relative;overflow-x:hidden}
body::before,body::after{content:"";position:fixed;z-index:-1;border-radius:50%;filter:blur(110px);opacity:.28;pointer-events:none}
body::before{width:520px;height:520px;background:#f5a623;top:-180px;left:-120px;animation:float1 16s ease-in-out infinite}
body::after{width:480px;height:480px;background:#3a6df0;bottom:-200px;right:-140px;animation:float2 19s ease-in-out infinite}
@keyframes float1{0%,100%{transform:translate(0,0)}50%{transform:translate(120px,80px)}}
@keyframes float2{0%,100%{transform:translate(0,0)}50%{transform:translate(-100px,-90px)}}

.top{position:sticky;top:0;z-index:20;backdrop-filter:blur(10px);background:rgba(11,13,18,.82);transition:box-shadow .3s}
.top.scrolled{box-shadow:0 6px 24px rgba(0,0,0,.45)}
.logo{background:linear-gradient(90deg,#fff,#f5a623);-webkit-background-clip:text;background-clip:text;color:transparent}
.menu a{position:relative}
.menu a:not(.btn)::after{content:"";position:absolute;left:0;bottom:-4px;width:0;height:2px;background:#f5a623;transition:width .25s}
.menu a:not(.btn):hover::after{width:100%}

.reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}

.hero{position:relative;text-align:center;padding:48px 10px 34px;margin-bottom:10px}
.hero-glow{position:absolute;left:50%;top:0;width:420px;height:220px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(245,166,35,.28),transparent);pointer-events:none;animation:pulse 4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.6;transform:translateX(-50%) scale(1)}50%{opacity:1;transform:translateX(-50%) scale(1.12)}}
.badge{display:inline-block;padding:4px 14px;border:1px solid #f5a623;border-radius:20px;color:#f5a623;font-size:13px;letter-spacing:.06em;text-transform:uppercase;animation:fadeDown .7s both}
.hero h1{font-size:42px;margin:14px 0 8px;animation:fadeDown .8s .1s both;position:relative}
.grad{background:linear-gradient(90deg,#f5a623,#ff6b3d,#f5a623);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 4s linear infinite}
@keyframes shine{to{background-position:200% center}}
@keyframes fadeDown{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}
.hero .lead{max-width:620px;margin:0 auto;animation:fadeDown .8s .2s both;position:relative}
.hero-stats{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:26px;position:relative}
.hero-stats div{min-width:130px;background:rgba(27,32,48,.75);border:1px solid #2a3147;border-radius:12px;padding:12px 18px;animation:fadeDown .8s .35s both}
.hero-stats div:nth-child(2){animation-delay:.45s}.hero-stats div:nth-child(3){animation-delay:.55s}
.hero-stats b{display:block;font-size:24px;color:#f5a623}
.hero-stats span{font-size:13px;color:#8b93a5}

.card.priv{position:relative;overflow:hidden;background:linear-gradient(160deg,#1d2336,#171b2b)}
.card.priv::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,#f5a623,#ff6b3d);transform:scaleX(0);transform-origin:left;transition:transform .4s}
.card.priv:hover::before{transform:scaleX(1)}
.cards .card:hover{box-shadow:0 12px 34px rgba(245,166,35,.14)}
.priv-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.from{color:#8b93a5;font-size:14px}.from b{color:#fff;font-size:20px}
input:focus,select:focus,textarea:focus{outline:0;border-color:#f5a623;box-shadow:0 0 0 3px rgba(245,166,35,.18)}
input,select,textarea{transition:border-color .2s,box-shadow .2s}

.btn{position:relative;overflow:hidden;transition:transform .15s,box-shadow .2s,filter .2s}
.btn:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(245,166,35,.35);filter:brightness(1.07)}
.btn:active{transform:translateY(1px)}
.btn.sec:hover{box-shadow:0 6px 18px rgba(0,0,0,.35)}
.btn.danger:hover{box-shadow:0 6px 18px rgba(192,57,43,.4)}
.ripple{position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:rgba(255,255,255,.55);animation:ripple .6s ease-out forwards;pointer-events:none}
@keyframes ripple{to{transform:scale(18);opacity:0}}

.steps{margin:44px 0 10px;text-align:center}
.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-top:16px}
.steps-grid div{background:#1b2030;border:1px solid #2a3147;border-radius:12px;padding:18px;transition:transform .25s,border-color .25s}
.steps-grid div:hover{transform:translateY(-4px);border-color:#f5a623}
.steps-grid i{display:inline-flex;width:34px;height:34px;border-radius:50%;background:#f5a623;color:#111;font-style:normal;font-weight:700;align-items:center;justify-content:center;margin-bottom:8px}
.steps-grid b{display:block}.steps-grid span{color:#8b93a5;font-size:14px}

.alert{animation:fadeDown .4s both}
.msg{animation:msgIn .3s both}
@keyframes msgIn{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
.authbox .card{animation:fadeDown .6s both}
main>h1,main>.lead{animation:fadeDown .6s both}
table tr{transition:background .2s}
table tr:hover td{background:rgba(245,166,35,.05)}
.dot.on{animation:blink 2s ease-in-out infinite}
@keyframes blink{50%{opacity:.45}}
.foot{margin-top:30px}

@media(max-width:600px){.hero h1{font-size:28px}.hero{padding-top:30px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

.foot-req{margin-top:6px;font-size:13px}
table.req th{width:34%;white-space:nowrap}

/* ---- v4: поддержка, правила, статус ---- */
.hero.small{padding:30px 10px 18px}
.hero.small h1{font-size:34px}
.srvname{color:#fff}
.tag.off{background:#262b3a;color:#8b93a5}
.tk-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.tk-head h1{margin:0}
.tk-thread{display:flex;flex-direction:column;gap:12px;margin:14px 0}
.bubble{max-width:82%;padding:12px 16px;border-radius:14px;background:#1b2030;border:1px solid #2a3147;animation:bubbleIn .45s both}
.bubble.me{align-self:flex-end;background:#2a2113;border-color:#5a4318;border-bottom-right-radius:4px}
.bubble.adm{align-self:flex-start;border-bottom-left-radius:4px}
.bubble:nth-child(2){animation-delay:.08s}.bubble:nth-child(3){animation-delay:.16s}.bubble:nth-child(4){animation-delay:.24s}
.bubble .who{font-size:12px;color:#8b93a5;margin-bottom:4px}
.bubble .who span{margin-left:8px;opacity:.7}
.bubble .txt{overflow-wrap:anywhere}
@keyframes bubbleIn{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
.rules{display:flex;flex-direction:column;gap:14px;max-width:820px;margin:10px auto 0}
.rule{display:flex;gap:16px;background:linear-gradient(160deg,#1d2336,#171b2b);border:1px solid #2a3147;border-radius:12px;padding:18px;transition:transform .25s,border-color .25s,box-shadow .25s}
.rule:hover{transform:translateX(6px);border-color:#f5a623;box-shadow:0 8px 26px rgba(245,166,35,.12)}
.rule-num{flex:0 0 42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#f5a623,#ff6b3d);color:#111;font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:center}
.rule-body{flex:1;min-width:0}
.rule-body h2{margin:2px 0 8px;font-size:20px}
.rule-body p{margin:6px 0;color:#cfd5e3}
.rule-body ul{margin:6px 0;padding-left:20px;color:#cfd5e3}
.rule-body li{margin:4px 0}
.rule-body li::marker{color:#f5a623}
@media(max-width:600px){.bubble{max-width:94%}.rule{padding:14px}.hero.small h1{font-size:26px}}

/* ---- v5: оплата ---- */
.pay-card .pay-item{display:flex;justify-content:space-between;gap:10px;margin:0 0 6px;font-size:18px}
.pay-card .pay-item span{color:#8b93a5}
.pay-sum{font-size:34px;font-weight:800;color:#f5a623;margin:10px 0 14px}
.pay-note{font-size:13px;margin-top:10px}
.spin{display:inline-block;width:14px;height:14px;border:2px solid #7a6a2b;border-top-color:#f5a623;border-radius:50%;vertical-align:-2px;margin-right:6px;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
code.copy{display:block;padding:10px 12px;background:#0f1320;border:1px solid #2a3147;border-radius:6px;color:#f5a623;overflow-wrap:anywhere;user-select:all}