/* Кабинет поверх светлой темы HostX. Функции прежние, оболочка — PHP Version. */

.theme-navbar .hx-wordmark,
.login-page .hx-wordmark {
    font-family: var(--primary-font);
    font-weight: 700;
    font-size: 26px;
    letter-spacing: -0.04em;
    line-height: 1;
    color: var(--dark);
    text-decoration: none;
}

/* Public landing page */
.hx-page:has(.landing) { padding: 0 0 70px; overflow: hidden; }
.hx-page:has(.landing) > .container { max-width: 1240px; }
.landing { --ink: #111927; --muted: #687486; --blue: #536dff; color: var(--ink); }
.landing-hero { position: relative; display: grid; grid-template-columns: 1fr 1fr; align-items: center; min-height: 570px; padding: 52px 0 74px; }
.landing-copy { position: relative; z-index: 2; padding: 12px 0 0 10px; }
.landing-eyebrow { display: inline-flex; align-items: center; gap: 9px; color: #62718a; font-size: 10px; font-weight: 800; letter-spacing: .15em; }
.landing-pulse { width: 8px; height: 8px; border-radius: 50%; background: #64d9b2; box-shadow: 0 0 0 5px #64d9b222; }
.landing-hero h1 { margin: 22px 0 20px; color: #111927; font-size: clamp(48px, 6.2vw, 76px); font-weight: 750; line-height: .99; letter-spacing: -.065em; }
.landing-hero h1 span, .landing-section-heading h2 span, .landing-bottom-cta h2 span { color: #6476ed; }
.landing-lead { max-width: 455px; margin: 0; color: #697588; font-size: 16px; line-height: 1.75; }
.landing-actions { display: flex; align-items: center; gap: 25px; margin-top: 29px; }
.landing-primary { display: inline-flex; align-items: center; justify-content: center; gap: 22px; min-height: 52px; padding: 0 22px; border: 0; border-radius: 9px; background: #566eff; color: #fff !important; box-shadow: 0 12px 26px #566eff30; font-size: 13px; font-weight: 700; text-decoration: none !important; transition: transform .2s, box-shadow .2s; }
.landing-primary:hover { transform: translateY(-2px); box-shadow: 0 16px 30px #566eff40; }
.landing-primary span { font-size: 18px; }
.landing-secondary { color: #46536a !important; font-size: 13px; font-weight: 700; text-decoration: none !important; }
.landing-secondary span { padding-left: 7px; color: #7384f0; }
.landing-trust { display: flex; align-items: center; gap: 12px; margin-top: 37px; color: #818b9a; font-size: 10px; line-height: 1.55; }
.landing-trust strong { color: #455168; font-weight: 700; }
.landing-avatars { display: flex; padding-left: 4px; }
.landing-avatars i { display: grid; place-items: center; width: 30px; height: 30px; margin-left: -4px; border: 2px solid #f7f9fc; border-radius: 50%; background: #e5e9ff; color: #586ee4; font-size: 10px; font-style: normal; font-weight: 800; }
.landing-avatars i:nth-child(2) { background: #ddf4ed; color: #42a98c; }.landing-avatars i:nth-child(3) { background: #fff0df; color: #cb8c45; }
.landing-visual { position: relative; height: 440px; }
.visual-glow { position: absolute; top: 46px; left: 12%; width: 78%; height: 78%; border-radius: 50%; background: radial-gradient(ellipse, #dfe5ff 0%, #edf0ff 37%, #f6f8ff00 72%); }
.orbit { position: absolute; z-index: 1; top: 43px; left: 13%; width: 74%; height: 74%; border: 1px solid #94a2ed36; border-radius: 50%; transform: rotate(-25deg) scaleY(.44); }.orbit-two { top: 61px; transform: rotate(55deg) scaleY(.55); border-color: #a6b1ed47; }
.server-card { position: absolute; z-index: 2; border: 1px solid #e4e8f2; border-radius: 16px; background: #fff; box-shadow: 0 22px 65px #33416e17; }
.server-card-back { top: 82px; right: 6%; display: flex; align-items: center; gap: 9px; width: 187px; padding: 12px 13px; color: #8792a4; font-size: 8px; font-weight: 800; letter-spacing: .08em; transform: rotate(5deg); }
.server-card-back b { margin-left: auto; color: #44b592; font-size: 7px; }.server-dot { width: 7px; height: 7px; border-radius: 50%; background: #54c7a2; box-shadow: 0 0 0 4px #54c7a21c; }
.server-card-main { top: 113px; left: 14%; width: 72%; min-height: 258px; padding: 17px 19px 13px; transform: rotate(-3deg); }
.server-card-top { display: flex; align-items: center; gap: 9px; color: #8b95a6; font-size: 8px; font-weight: 800; letter-spacing: .12em; }.server-brand-mark { display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:#596fff;color:#fff;font-size:13px;font-weight:800;letter-spacing:-.05em; }.server-menu { margin-left: auto; font-size: 14px; letter-spacing: 2px; }
.server-core { position: relative; display: grid; place-items: center; height: 167px; overflow: hidden; }.core-ring { display:grid;place-items:center;width:116px;height:116px;border:1px solid #8b9af04d;border-radius:50%;background:radial-gradient(circle,#f7f8ff 20%,#eef0ff 72%,#e7eaff);box-shadow:0 0 0 15px #f4f5ff,0 0 0 16px #9eabed30; }.core-inner { display:grid;place-items:center;width:55px;height:55px;border-radius:17px;background:linear-gradient(145deg,#7c8dff,#5166ec);box-shadow:0 8px 24px #576df25c;color:white;font-size:27px; }
.core-line { position:absolute;width:89px;height:1px;background:linear-gradient(90deg,#b4bef8,transparent);transform-origin:left; }.core-line-a { top:42px;left:54%;transform:rotate(28deg); }.core-line-b { top:116px;left:20%;transform:rotate(-16deg); }.core-line-c { top:135px;left:75%;transform:rotate(180deg); }
.server-status { display:flex;justify-content:space-between;padding-top:11px;border-top:1px solid #f0f1f6;color:#788497;font-size:9px; }.server-status span:first-child { display:flex;align-items:center;gap:6px; }.server-status i { width:6px;height:6px;border-radius:50%;background:#4fc29b; }
.floating-chip { position:absolute;z-index:3;display:flex;align-items:center;gap:10px;padding:11px 14px;border:1px solid #edf0f5;border-radius:12px;background:#fff;box-shadow:0 12px 34px #33416e18; }.floating-chip>span { display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#edf0ff;color:#6476ed;font-size:16px; }.floating-chip div { display:grid;gap:3px; }.floating-chip strong { color:#344056;font-size:10px; }.floating-chip small { color:#929bad;font-size:8px; }.chip-speed { top:139px;left:0; }.chip-shield { right:0;bottom:81px; }.chip-shield>span { background:#eaf8f3;color:#44ae8b; }
.visual-caption { position:absolute;right:14%;bottom:31px;color:#929bad;font-size:8px;font-weight:800;letter-spacing:.16em; }.visual-caption span { padding:0 5px;color:#59c6a3; }
.landing-scroll { position:absolute;bottom:21px;left:10px;color:#a0a9b8;font-size:8px;font-weight:800;letter-spacing:.16em; }.landing-scroll span { padding-left:8px;color:#6577ed;font-size:14px; }
.landing-highlights { display:grid;grid-template-columns:repeat(3,1fr);margin:0 0 92px;padding:23px 10px;border-top:1px solid #e9edf3;border-bottom:1px solid #e9edf3; }.landing-highlights article { display:flex;align-items:center;gap:13px;padding:0 24px;border-right:1px solid #e9edf3; }.landing-highlights article:first-child { padding-left:0; }.landing-highlights article:last-child { border:0; }.highlight-icon { display:grid;place-items:center;width:39px;height:39px;flex:none;border-radius:12px;background:#edf0ff;color:#6576ec;font-size:18px; }.landing-highlights article:nth-child(2) .highlight-icon { background:#e9f7f2;color:#48ad8b; }.landing-highlights article:nth-child(3) .highlight-icon { background:#fff3e7;color:#dc9e54; }.landing-highlights strong { color:#273248;font-size:12px; }.landing-highlights p { margin:5px 0 0;color:#909aaa;font-size:10px; }
.landing-plans { scroll-margin-top:30px; }.landing-section-heading { display:flex;align-items:end;justify-content:space-between;gap:30px;margin:0 0 34px; }.landing-section-heading h2,.landing-bottom-cta h2 { margin:12px 0 0;color:#172033;font-size:clamp(34px,4vw,48px);font-weight:750;line-height:1.06;letter-spacing:-.055em; }.landing-section-heading>p { max-width:310px;margin:0 0 5px;color:#7b8698;font-size:12px;line-height:1.8; }
.landing .plans { margin:0; }.landing .plan { height:100%;border:1px solid #e6eaf2;border-radius:14px;box-shadow:0 12px 36px #26375c0b; }.landing .plan.is-mine { border-color:#7d8cff; }.landing .popular-box { border-radius:0 12px 0 8px; }.landing .faq-strip { border-radius:12px; }
.landing-bottom-cta { display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:70px;padding:39px 43px;border:1px solid #e7eaf4;border-radius:16px;background:radial-gradient(ellipse at 88% 20%,#e8ebff,transparent 43%),#f7f8fc; }.landing-bottom-cta h2 { font-size:32px; }

/* Account dashboard */
.dashboard-page { --dash-ink:#172238; --dash-muted:#78859a; --dash-accent:#6678f5; color:var(--dash-ink); }
.dashboard-welcome { position:relative;display:flex;align-items:center;justify-content:space-between;min-height:210px;margin:24px 0 24px;padding:34px 39px;overflow:hidden;border-radius:18px;background:linear-gradient(112deg,#171f3c 0%,#242e56 59%,#303b70 100%);box-shadow:0 18px 45px #202b511c;color:#fff; }
.dashboard-welcome-copy { position:relative;z-index:2; }.dashboard-overline { display:flex;align-items:center;gap:8px;color:#aeb9e5;font-size:9px;font-weight:800;letter-spacing:.16em; }.dashboard-overline span { width:7px;height:7px;border-radius:50%;background:#6ee0b6;box-shadow:0 0 0 4px #6ee0b622; }
.dashboard-welcome h1 { margin:16px 0 8px;color:#fff;font-size:clamp(27px,3vw,37px);font-weight:700;letter-spacing:-.04em; }.dashboard-welcome p { margin:0;color:#b5bfd9;font-size:13px; }
.dashboard-welcome-action { position:relative;z-index:2;display:inline-flex;align-items:center;gap:9px;padding:13px 16px;border:1px solid #ffffff32;border-radius:9px;background:#ffffff12;color:#fff!important;font-size:11px;font-weight:700;text-decoration:none!important;transition:background .2s; }.dashboard-welcome-action:hover { background:#ffffff22; }
.dashboard-welcome-art { position:absolute;top:0;right:13%;width:225px;height:100%;opacity:.78; }.welcome-orbit { position:absolute;top:8px;left:15px;width:190px;height:190px;border:1px solid #b4c0ff31;border-radius:50%;box-shadow:0 0 0 23px #b4c0ff0a,0 0 0 48px #b4c0ff08; }.welcome-cube { position:absolute;top:61px;left:74px;display:grid;place-items:center;width:73px;height:73px;border:1px solid #ffffff4a;border-radius:20px;background:linear-gradient(145deg,#8594ff,#5366db);box-shadow:0 14px 35px #111a4466;color:#fff;font-size:37px;font-weight:800;transform:rotate(-10deg); }.dashboard-welcome-art i,.dashboard-welcome-art b { position:absolute;width:8px;height:8px;border-radius:50%;background:#6ee0b6;box-shadow:0 0 0 7px #6ee0b61a; }.dashboard-welcome-art i { top:45px;right:35px; }.dashboard-welcome-art b { left:20px;bottom:31px;background:#aab6ff;box-shadow:0 0 0 7px #aab6ff1a; }
.dashboard-page .hx-crumbs { display:none; }
.dashboard-page .stats { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin:0 0 24px; }.dashboard-page .stats.cols-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.dashboard-page .stat { position:relative;min-height:145px;margin:0;padding:17px 18px;border:1px solid #e7ebf2;border-radius:13px;background:#fff;box-shadow:0 8px 25px #26375c08; }.dashboard-page .stat-top { margin-bottom:15px;color:#8792a3;font-size:10px;font-weight:650; }.dashboard-page .stat strong { display:block;color:#202b40;font-size:22px;font-weight:750;letter-spacing:-.035em; }.dashboard-page .stat em { display:inline-block;margin-top:5px;font-size:9px;font-style:normal; }.dashboard-page .stat .muted { display:block;margin-top:6px;color:#8994a4;font-size:10px; }.dashboard-page .stat-icon { display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:#f0f2ff;color:#6879ee; }.dashboard-page .stat-icon.copper { background:#fff3e7;color:#d39a54; }.dashboard-page .stat-go { display:inline-flex;align-items:center;gap:5px;margin-top:8px;color:#6577ed!important;font-size:10px;font-weight:700; }.dashboard-page .stat .meter { display:block;height:4px;margin-top:12px;border-radius:8px;background:#edf0f5; }.dashboard-page .stat .meter span { display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#7181f5,#9ba6ff); }
.dashboard-page .bill-grid { display:grid;grid-template-columns:minmax(0,1.08fr) minmax(290px,.92fr);align-items:start;gap:15px;margin-bottom:16px; }.dashboard-page .dash-card { margin:0 0 15px;padding:21px;border:1px solid #e7ebf2;border-radius:13px;background:#fff;box-shadow:0 8px 25px #26375c08; }.dashboard-page .bill-grid>.dash-card,.dashboard-page .bill-grid>form.dash-card { height:100%; }
.dashboard-page .pay-step-head { gap:12px; }.dashboard-page .pay-step-ico { display:grid;place-items:center;width:37px;height:37px;flex:none;border-radius:11px;background:#edf0ff;color:#6476ed; }.dashboard-page .pay-step-head h2 { margin:0 0 4px;color:#202b40;font-size:15px;font-weight:750;letter-spacing:-.02em; }.dashboard-page .pay-step-head .muted,.dashboard-page .pay-step-head p { margin:0;color:#8490a2;font-size:10px;line-height:1.55; }.dashboard-page .pay-step-head>.btn { margin-left:auto;white-space:nowrap; }
.dashboard-page .cred-list { display:grid;gap:10px;margin-top:21px; }.dashboard-page .cred { display:flex;align-items:center;gap:11px; }.dashboard-page .cred-ico { display:grid;place-items:center;width:31px;height:31px;flex:none;border-radius:9px;background:#f4f6fa;color:#7b88a1; }.dashboard-page .cred label { display:block;flex:1;min-width:0;color:#8792a3;font-size:9px;font-weight:700; }.dashboard-page .secret-row { display:flex;gap:6px; }.dashboard-page .cred .secret-row { margin-top:4px; }.dashboard-page .cred input { min-width:0;height:34px;border:1px solid #edf0f4;border-radius:7px;background:#fafbfc;color:#364259;font-size:10px; }.dashboard-page .cred .btn { min-width:34px;padding:5px; }
.dashboard-page .dash-card.stack { display:grid;gap:12px; }.dashboard-page .dash-card.stack label { color:#69768a;font-size:10px;font-weight:650; }.dashboard-page .dash-card.stack input,.dashboard-page .dash-card.stack select { min-height:38px;border:1px solid #e5e9f0;border-radius:8px;background:#fbfcfe;font-size:11px; }.dashboard-page .dash-card.stack .pay-step-head { margin-bottom:2px; }.dashboard-page .pay-submit { width:100%;margin-top:5px; }.dashboard-page .dash-actions { margin:10px 0 0;color:#7d899b;font-size:10px; }.dashboard-page .dash-actions a { color:#6577ed!important;font-weight:700; }.dashboard-page .notice { border:1px solid #ffe1bd;border-radius:11px;background:#fff9f0;color:#7d5528;font-size:11px; }.dashboard-page .hx-guide { margin-bottom:20px;border:1px solid #e6eaf4;border-radius:14px;box-shadow:0 8px 25px #26375c08; }.dashboard-page .hx-guide-head { padding:19px 20px;border-bottom:1px solid #edf0f5; }.dashboard-page .hx-guide-head h2 { color:#202b40;font-size:15px; }.dashboard-page .hx-guide-head .muted,.dashboard-page .hx-guide-steps p { color:#8490a2;font-size:10px; }.dashboard-page .hx-guide-steps { padding:0 20px; }.dashboard-page .hx-guide-steps li { padding:14px 0; }.dashboard-page .hx-guide-num { background:#edf0ff;color:#6476ed; }.dashboard-page .ledger li { border-color:#eef0f5; }.dashboard-page .ledger strong { color:#354158;font-size:11px; }.dashboard-page .ledger .muted { color:#929cad;font-size:9px; }.dashboard-page .faq-strip { margin-top:17px;border:1px solid #e7ebf2;border-radius:12px;background:#fff;box-shadow:0 8px 25px #26375c08; }
@media (max-width: 900px) { .dashboard-page .stats { grid-template-columns:repeat(2,minmax(0,1fr)); }.dashboard-page .bill-grid { grid-template-columns:1fr; }.dashboard-page .bill-grid>.dash-card,.dashboard-page .bill-grid>form.dash-card { height:auto; } }
@media (max-width: 600px) { .dashboard-welcome { min-height:190px;align-items:flex-start;flex-direction:column;gap:19px;margin:12px 0 17px;padding:25px 22px; }.dashboard-welcome h1 { max-width:75%;font-size:27px; }.dashboard-welcome p { max-width:70%;font-size:11px; }.dashboard-welcome-action { padding:10px 12px;font-size:10px; }.dashboard-welcome-art { right:-43px;opacity:.48; }.dashboard-page .stats,.dashboard-page .stats.cols-3 { gap:9px; }.dashboard-page .stat { min-height:130px;padding:14px; }.dashboard-page .stat strong { font-size:19px; }.dashboard-page .stat-top { margin-bottom:10px; }.dashboard-page .dash-card { padding:16px; }.dashboard-page .pay-step-head { flex-wrap:wrap; }.dashboard-page .pay-step-head>.btn { margin:8px 0 0 49px; }.dashboard-page .cred { gap:7px; }.dashboard-page .cred-ico { display:none; } }
@media (max-width: 767px) {
    .hx-page:has(.landing) { padding-top:0; }.landing-hero { grid-template-columns:1fr;min-height:0;padding:44px 0 45px; }.landing-copy { padding:0; }.landing-hero h1 { font-size:clamp(47px,12vw,66px); }.landing-lead { font-size:14px; }.landing-visual { height:350px;margin-top:15px; }.server-card-main { top:90px;left:14%;width:72%;min-height:235px;padding:14px; }.server-core { height:145px; }.server-card-back { top:60px;right:1%; }.chip-speed { top:100px; }.chip-shield { bottom:51px; }.visual-caption { bottom:12px;right:10%; }.landing-scroll { display:none; }
    .landing-highlights { grid-template-columns:1fr;gap:17px;margin-bottom:65px;padding:19px 0; }.landing-highlights article,.landing-highlights article:first-child { padding:0;border:0; }.landing-section-heading { display:block;margin-bottom:24px; }.landing-section-heading h2 { font-size:39px; }.landing-section-heading>p { margin-top:15px; }.landing-bottom-cta { align-items:flex-start;flex-direction:column;margin-top:40px;padding:28px 23px; }.landing-bottom-cta h2 { font-size:29px; }
}
.theme-navbar .nav-bottom .links { flex-wrap: wrap; row-gap: 6px; }
.theme-navbar .buttons {
    display: flex;
    align-items: center;
    gap: 8px;
}
.theme-navbar .buttons form { margin: 0; }

.hx-page {
    padding: 8px 0 56px;
    color: var(--dark);
}
.hx-title {
    font-family: var(--primary-font);
    font-weight: 700;
    font-size: 34px;
    line-height: 1.15;
    margin: 28px 0 10px;
    color: var(--dark);
}
.hx-title::after {
    content: '';
    display: block;
    width: 48px;
    height: 3px;
    margin-top: 10px;
    border-radius: 3px;
    background: var(--primary);
}
.hx-lead {
    max-width: 640px;
    margin: 0 0 28px;
    color: #5c6b80;
}
.hx-page a:not(.btn) { color: var(--primary); }
.hx-page a:not(.btn):hover { text-decoration: underline; }

.icon { width: 18px; height: 18px; flex: none; }

.hx-page .card,
.login-page .flash {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 18px 20px;
    margin-bottom: 14px;
    box-shadow: 0 10px 28px rgba(11, 12, 27, 0.04);
}
.hx-page .card h2,
.hx-page .card h3 {
    font-family: var(--primary-font);
    font-weight: 600;
    color: var(--dark);
    margin: 0 0 10px;
}
.card-sunk { background: var(--light); }
.card-head, .toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
}
.card-head h2 { display: flex; align-items: center; gap: 8px; margin: 0; }
.stack { display: grid; gap: 12px; }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.profile-grid { align-items: stretch; }
.profile-grid .card { height: 100%; margin: 0; }
.muted { color: #5c6b80; }
.plain { list-style: none; padding: 0; margin: 0; }
.plain li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--border);
}
.plain li:last-child { border-bottom: 0; }

.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 14px; }
.stats.cols-3 { grid-template-columns: repeat(3, 1fr); }
.stat {
    position: relative;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 18px 16px 16px;
    box-shadow: 0 10px 28px rgba(11, 12, 27, 0.04);
}
.stat::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 3px;
    background: var(--primary);
}
.stat.is-warn::before { background: var(--gold); }
.stat.is-bad::before { background: var(--red); }
.stat-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.stat .stat-icon {
    width: 36px;
    height: 36px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #e8f0ff;
    color: var(--primary);
}
.stat-go {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 8px;
    font-size: 13px;
    font-weight: 600;
}
.stat-go .icon { width: 14px; height: 14px; }
.stat span, .stat em { color: #5c6b80; font-style: normal; font-size: 13px; }
.stat strong {
    display: block;
    font-family: var(--primary-font);
    font-size: 22px;
    font-weight: 700;
    margin: 8px 0 2px;
    color: var(--dark);
}
.stat.is-warn strong { color: var(--gold); }
.stat.is-bad strong { color: var(--red); }
.meter { display: block; height: 6px; margin-top: 10px; border-radius: 999px; background: #e2e9ee; overflow: hidden; }
.meter > span { display: block; height: 100%; border-radius: inherit; background: var(--primary); }
.stat.is-warn .meter > span { background: var(--gold); }
.stat.is-bad .meter > span { background: var(--red); width: 8% !important; }

.hx-page label,
.login-page .user-form label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark);
}
.hx-page label:has(input[type="checkbox"]),
.login-page label:has(input[type="checkbox"]) {
    flex-direction: row;
    align-items: center;
}
.hx-page input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),
.hx-page select,
.hx-page textarea,
.login-page .user-form input:not([type="checkbox"]):not([type="hidden"]):not([type="radio"]),
.login-page .user-form select,
.login-page .user-form textarea {
    display: block;
    width: 100%;
    height: 48px;
    padding: 0 16px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid var(--border);
    box-shadow: 0 4px 0 rgb(91 105 135 / 0.12);
    color: var(--dark);
    font-size: 14px;
    font-family: var(--secondary-font);
}
.hx-page textarea,
.login-page .user-form textarea {
    height: auto;
    min-height: 96px;
    padding: 12px 16px;
    resize: vertical;
}
.hx-page input:focus,
.hx-page select:focus,
.hx-page textarea:focus,
.login-page .user-form input:focus,
.login-page .user-form select:focus,
.login-page .user-form textarea:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(0, 96, 254, 0.15);
}

.hx-page .btn {
    height: auto;
    min-height: 44px;
    padding: 10px 18px;
    border-radius: 8px;
    letter-spacing: 0;
    overflow: visible;
    white-space: normal;
    font-weight: 500;
    gap: 8px;
    text-decoration: none;
}
.hx-page .btn-primary,
.login-page .user-form .btn-primary {
    background: var(--primary);
    color: #fff;
    border: 0;
}
.hx-page .btn-primary:hover,
.login-page .user-form .btn-primary:hover { filter: brightness(1.06); }
.hx-page .btn-ghost {
    background: #fff;
    border: 1px solid var(--border);
    color: var(--dark);
}
.hx-page .btn-ghost:hover { border-color: var(--primary); color: var(--primary); }
.hx-page .btn-danger { background: var(--red); color: #fff; border: 0; }
.hx-page .btn:disabled { opacity: 0.5; cursor: not-allowed; }
.hx-page .icon-btn { width: 40px; min-height: 40px; padding: 0; }
.login-page .user-form .btn-primary { width: 100%; }
.login-page .user-form h2 {
    font-family: var(--primary-font);
    font-size: 24px;
    font-weight: 700;
    color: var(--dark);
    margin: 0 0 18px;
}
.login-page .user-form .logo.hx-wordmark { margin-bottom: 28px; }
.login-page .user-form .muted { color: #5c6b80; }
.login-page .user-form p a { color: var(--primary); }

.hx-page .se-i .plans .plan {
    padding: 28px 24px 24px;
    box-shadow: 0 16px 40px rgba(11, 12, 27, 0.06);
    transition: transform .2s ease, box-shadow .2s ease;
}
.hx-page .se-i .plans .plan:hover {
    transform: translateY(-3px);
    box-shadow: 0 22px 46px rgba(0, 96, 254, 0.12);
}
.hx-page .se-i .plans .plan-head { margin-bottom: 16px; padding-bottom: 14px; }
.hx-page .se-i .plans .plan-para { min-height: 0; }
.hx-page .se-i .plans .plan-price { margin-bottom: 14px; }
.hx-page .se-i .plans .group { margin-top: 18px; }
.se-i .plans .plan-icon img { width: 54px; height: 54px; object-fit: contain; }
.bill-grid {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 14px;
    align-items: start;
    margin-bottom: 14px;
}
.bill-grid:has(> :only-child) { grid-template-columns: 1fr; }
.bill-grid > .card { margin-bottom: 0; }
.theme-footer .footer-bottom { padding: 22px 0; }
.faqs { margin-bottom: 28px; }
.faqs .box .q .q-h .plus { position: relative; }
.faqs .box .box-des { margin: 0; }
.light-theme .se-i .plans .plan .popular-box { color: var(--dark); font-size: 16px; z-index: 1; }
.se-i .plans .plan .pay-quote-form { margin-top: 22px; display: grid; gap: 12px; }
.se-i .plans .plan .btn { white-space: normal; height: auto; min-height: 48px; }

.badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 3px 9px;
    background: #eef3f8;
    color: var(--dark);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}
.badge-client, .badge-answered, .badge-active { background: #e5f6ec; color: #1c7c45; }
.badge-premium, .badge-open { background: #e8f0ff; color: var(--primary); }
.badge-support { background: #eef2ff; color: #3d4ea3; }
.badge-administrator { background: var(--dark); color: #fff; }
.badge-closed, .badge-deleted, .badge-free { background: #eef3f8; color: #5c6b80; }
.badge-rejected { background: #fdecea; color: var(--red); }

.flash {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    border-radius: 10px;
    padding: 10px 12px;
    margin-bottom: 12px;
    border: 1px solid transparent;
    font-weight: 500;
}
.flash-success { background: #e5f6ec; color: #1c7c45; border-color: #b7e4c7; }
.flash-error { background: #fdecea; color: #9b2c2c; border-color: #f5c2c0; }
.notice {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    background: #e8f0ff;
    border: 1px solid #c9dbff;
    color: var(--dark);
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 14px;
}
.notice p { margin: 0; }

.table-wrap {
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
}
.table { width: 100%; border-collapse: collapse; }
.table th, .table td {
    text-align: left;
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}
.table th {
    font-size: 11px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #5c6b80;
    background: var(--light);
}
.table tr:last-child td { border-bottom: 0; }
.table tbody tr:hover td { background: #f7fbff; }

.secret-row { display: flex; gap: 8px; align-items: center; }
.secret-row input { flex: 1; min-width: 0; font-family: Consolas, "Cascadia Mono", monospace; }
.secret-row:has([data-copy]) { position: relative; display: block; }
.secret-row:has([data-copy]) input { width: 100%; padding-right: 48px; }
.secret-row:has([data-copy]) .btn {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    width: 34px;
    min-height: 34px;
    padding: 0;
}
.cred-grid { display: grid; gap: 12px; }

.pay { display: grid; gap: 14px; }
.pay-hero {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-end;
    background: linear-gradient(120deg, #0060fe 0%, #003eb0 72%);
    border: 0;
    border-radius: 16px;
    padding: 26px 28px;
    box-shadow: 0 16px 36px rgba(0, 96, 254, 0.22);
}
.pay-hero .eyebrow {
    margin: 0;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.82);
}
.pay-balance {
    margin: 4px 0 0;
    font-family: var(--primary-font);
    font-size: 36px;
    font-weight: 700;
    color: #fff;
}
.pay-plan-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
}
.pay-hero-side { max-width: 380px; color: rgba(255, 255, 255, 0.88); text-align: right; }
.pay-hero-side p { margin: 0; }
.pay-hero-main { display: flex; align-items: center; gap: 14px; }
.pay-hero-icon {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    flex: none;
}
.pay-hero-icon .icon { width: 26px; height: 26px; }
.pay-hero-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.pay-hero-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #fff;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    padding: 8px 12px;
    font-weight: 600;
    font-size: 13px;
}
.hx-page a.pay-hero-link,
.hx-page a.pay-hero-link:hover { color: #fff; text-decoration: none; }
.pay-hero-link:hover { background: rgba(255, 255, 255, 0.28); }
.pay-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.75fr);
    gap: 14px;
    align-items: start;
}
.pay-side { position: sticky; top: 16px; }
.pay-step { padding: 18px 18px 10px; }
.pay-step + .pay-step { border-top: 1px solid var(--border); }
.pay-step-head { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 14px; }
.pay-step-head h2 { margin: 0; font-size: 16px; font-family: var(--primary-font); }
.pay-step-head p { margin: 2px 0 0; }
.pay-step-ico {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #e8f0ff;
    color: var(--primary);
    flex: none;
}
.pay-step-submit { padding-bottom: 18px; }
.hx-page label.pay-method { flex-direction: row; align-items: center; }
.hx-page label.pay-plan { display: grid; }
.hx-page .pay-sum-row input {
    border: 0;
    box-shadow: none;
    height: auto;
    background: transparent;
    font-size: 32px;
    font-weight: 700;
    padding: 0;
}
#topup-form .pay-method { min-height: 78px; padding: 14px; }
#topup-form .pay-method-icon { width: 42px; height: 42px; border-radius: 12px; font-size: 18px; }
.pay-plan { grid-template-columns: 1fr auto; align-items: center; }
.pay-plan strong { grid-column: 1; }
.pay-plan > span:not(.pay-plan-check) { grid-column: 1; }
.pay-plan-check {
    display: none;
    grid-column: 2;
    grid-row: 1 / span 2;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--primary);
    color: #fff;
    place-items: center;
}
.pay-plan:has(input:checked) .pay-plan-check { display: grid; }
.pay-plan-check .icon { width: 14px; height: 14px; }
.pay-wallet .icon-btn, .pay-email .icon-btn { width: 40px; min-height: 40px; flex: none; }
.pay-drop { padding: 22px 16px; }
.pay-drop .pay-method-icon { width: 46px; height: 46px; border-radius: 14px; }
.pay-history {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 8px 8px 12px;
}
.pay-panel {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 6px;
    display: grid;
    gap: 4px;
}
.pay-block { padding: 12px 14px 8px; }
.pay-block h2 { margin: 0 0 12px; font-size: 16px; font-family: var(--primary-font); }
.pay-sum-row {
    display: flex;
    align-items: baseline;
    gap: 8px;
    background: var(--light);
    border-radius: 12px;
    padding: 8px 14px;
}
.pay-sum-row input {
    border: 0;
    background: transparent;
    box-shadow: none;
    font-size: 28px;
    font-weight: 700;
    height: auto;
    padding: 0;
}
.pay-currency { font-size: 20px; color: #5c6b80; }
.pay-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.pay-chip {
    border: 1px solid var(--border);
    background: #fff;
    color: var(--dark);
    border-radius: 999px;
    padding: 8px 12px;
    cursor: pointer;
    font-weight: 600;
}
.pay-chip:hover, .pay-chip.is-on { border-color: var(--primary); color: var(--primary); background: #e8f0ff; }
.pay-methods { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; }
.se-i .plans .pay-methods { grid-template-columns: 1fr; }
.pay-method {
    display: flex;
    flex-direction: row;
    align-items: center;
    text-align: left;
    gap: 10px;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 10px 12px;
    background: #fff;
    cursor: pointer;
    position: relative;
}
.pay-method input { position: absolute; opacity: 0; pointer-events: none; }
.pay-method-icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: #e8f0ff;
    color: var(--primary);
    flex: none;
}
.pay-method-copy { display: grid; gap: 2px; min-width: 0; }
.pay-method-copy strong { font-size: 15px; }
.pay-method-copy span { color: #5c6b80; font-size: 13px; font-weight: 500; }
.pay-method-mark {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid var(--border);
    margin-left: auto;
    flex: none;
}
.pay-method:has(input:checked) { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(0, 96, 254, 0.15); }
.pay-method:has(input:checked) .pay-method-mark {
    border-color: var(--primary);
    background: var(--primary);
    box-shadow: inset 0 0 0 3px #fff;
}
.pay-method:has(input:disabled) { opacity: 0.5; cursor: not-allowed; }
.qty-field { display: grid; gap: 6px; font-size: 13px; font-weight: 600; }
.qty-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.qty-unit { color: #5c6b80; font-weight: 500; }
.stepper {
    display: flex;
    align-items: center;
    width: fit-content;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
}
.stepper button {
    width: 36px;
    height: 36px;
    border: 0;
    background: transparent;
    color: var(--dark);
    cursor: pointer;
    font-size: 18px;
}
.stepper input {
    width: 56px;
    height: 36px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    text-align: center;
    padding: 0;
    -moz-appearance: textfield;
    appearance: textfield;
}
.stepper input::-webkit-outer-spin-button,
.stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.brand-ym { background: #6d3d9e; color: #fff; font-weight: 700; }
.brand-crypto { background: #e2a43a; color: #1c1408; }
.pay-field { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600; }
.pay-wallet, .pay-email {
    display: flex;
    gap: 8px;
    align-items: center;
    background: var(--light);
    border-radius: 12px;
    padding: 6px 8px 6px 14px;
}
.pay-wallet input, .pay-email input {
    border: 0;
    background: transparent;
    box-shadow: none;
    height: auto;
    padding: 6px 0;
}
.pay-drop {
    position: relative;
    display: grid;
    justify-items: center;
    gap: 4px;
    text-align: center;
    border: 1.5px dashed var(--border);
    border-radius: 12px;
    padding: 16px;
    background: var(--light);
    cursor: pointer;
}
.pay-drop input { position: absolute; width: 1px; height: 1px; padding: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); }
.pay-plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px; }
.pay-plan {
    position: relative;
    display: grid;
    gap: 2px;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 10px 12px;
    background: #fff;
    cursor: pointer;
}
.pay-plan input { position: absolute; opacity: 0; pointer-events: none; }
.pay-plan:has(input:checked) { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(0, 96, 254, 0.15); }
.pay-submit { width: 100%; }
.pay-hint { margin: 8px 0 0; text-align: center; }
.pay-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.pay-history { display: grid; gap: 8px; }
.pay-row {
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    gap: 12px;
    align-items: center;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 12px;
}
.pay-row-icon {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: #e8f0ff;
    color: var(--primary);
}
.pay-note { grid-column: 2 / -1; margin: 0; }
#yoomoney-fields[hidden], #topup-sum[hidden] { display: none !important; }

.ticket-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.ticket-filter {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: 7px 12px;
    color: var(--dark);
    font-weight: 600;
    font-size: 13px;
    background: #fff;
}
.ticket-filter.is-on { border-color: var(--primary); background: #e8f0ff; color: var(--primary); }
.ticket-list { display: grid; gap: 8px; }
.ticket-row {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 12px;
    align-items: center;
    text-decoration: none;
    color: inherit;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 12px;
}
.ticket-row:hover { border-color: var(--primary); }
.ticket-side { display: grid; justify-items: end; gap: 6px; }
.ticket-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.thread { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.bubble { background: #fff; border: 1px solid var(--border); border-radius: 12px; padding: 12px; }
.bubble header { display: flex; justify-content: space-between; gap: 8px; color: #5c6b80; font-size: 13px; }
.bubble p { margin: 8px 0 0; white-space: pre-wrap; }
.bubble.is-staff { background: #f4f8ff; border-color: #c9dbff; }
.bubble.is-mine { margin-left: 8%; }
.empty { text-align: center; color: #5c6b80; padding: 24px 8px; }
fieldset { border: 1px solid var(--border); border-radius: 12px; padding: 14px; }
fieldset legend { padding: 0 6px; font-weight: 700; font-size: 13px; }
.inline-form { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; align-items: center; }
.log {
    background: var(--dark);
    color: #f4f8fb;
    border-radius: 12px;
    padding: 14px;
    overflow: auto;
    max-height: 360px;
    white-space: pre-wrap;
    font-size: 12.5px;
}

.toaster {
    position: fixed;
    z-index: 80;
    top: 16px;
    right: 16px;
    display: grid;
    gap: 8px;
    width: min(340px, calc(100vw - 24px));
    pointer-events: none;
}
.toaster .flash {
    pointer-events: auto;
    margin: 0;
    box-shadow: 0 14px 32px rgba(11, 12, 27, 0.16);
}

@media (max-width: 980px) {
    .stats, .stats.cols-3, .grid-2, .split, .bill-grid, .pay-layout { grid-template-columns: 1fr; }
    .pay-side { position: static; }
    .pay-hero-meta { align-items: flex-start; }
    .pay-hero { align-items: flex-start; }
    .hx-title { font-size: 28px; }
}
@media (max-width: 640px) {
    .stats, .stats.cols-3, .grid-2, .split, .bill-grid, .pay-hero, .pay-row, .ticket-row, .ticket-head { grid-template-columns: 1fr; }
    .ticket-row { grid-template-columns: auto 1fr; }
    .ticket-side, .pay-row .badge, .pay-row .btn { grid-column: 2; justify-items: start; justify-self: start; }
    .pay-hero-side { text-align: left; max-width: none; }
    .bubble.is-mine { margin-left: 0; }
    .toaster { top: auto; bottom: 12px; left: 12px; right: 12px; width: auto; }
}
.dash-card { padding: 6px 16px 16px; }
.dash-card.pay-quote-form { display: grid; gap: 12px; align-content: start; }
.dash-card .pay-step-head { padding-top: 12px; }
.dash-card .pay-step-head > div { flex: 1; min-width: 0; }
.dash-card .pay-step-head h2 { margin: 0; }
.dash-card .pay-step-head .btn { margin-left: auto; align-self: center; flex: none; }
.cred-list { display: grid; gap: 12px; }
.cred { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 10px; align-items: end; }
.cred-ico {
    width: 40px;
    height: 40px;
    margin-bottom: 4px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #e8f0ff;
    color: var(--primary);
}
.dash-actions { margin: 12px 0 0; }
.dash-card .secret-row .btn:not(.icon-btn) { flex: none; }
.ledger { list-style: none; margin: 0; padding: 0; }
.ledger li {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
}
.ledger li:last-child { border-bottom: 0; }
.ledger strong, .ledger .muted { display: block; }
.amount-plus { color: #1c7c45; }
.amount-minus { color: var(--dark); }
.faq-strip {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 14px;
    padding: 14px 16px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
}
.hx-page a.faq-strip,
.hx-page a.faq-strip:hover { color: var(--dark); text-decoration: none; }
.faq-strip > .icon { width: 22px; height: 22px; color: var(--primary); flex: none; }
.faq-strip > span:first-of-type { display: grid; flex: 1; min-width: 0; }
.faq-go { color: var(--primary); font-weight: 600; font-size: 13px; flex: none; }
.faq-strip:hover { border-color: var(--primary); }
@media (max-width: 640px) {
    .cred { grid-template-columns: 1fr; }
    .cred-ico { display: none; }
    .dash-card .pay-step-head { flex-wrap: wrap; }
    .ledger li { grid-template-columns: auto 1fr; }
    .ledger b { grid-column: 2; }
}
.login-page .user-form { padding: 28px 32px 24px; }
.login-page .auth-head { margin: 0 0 18px; }
.login-page .auth-mark {
    width: 44px;
    height: 44px;
    margin-bottom: 12px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: #e8f0ff;
    color: var(--primary);
}
.login-page .auth-mark .icon { width: 22px; height: 22px; }
.login-page .auth-head h2 { margin: 0; }
.login-page .auth-head h2::after {
    content: '';
    display: block;
    width: 40px;
    height: 3px;
    margin-top: 8px;
    border-radius: 3px;
    background: var(--primary);
}
.login-page .auth-head p { margin: 10px 0 0; font-size: 13px; line-height: 1.45; }
.login-page .auth-form { gap: 14px; }
.login-page .auth-field { display: grid; gap: 6px; }
.login-page .user-form label.auth-label {
    flex-direction: row;
    align-items: center;
    gap: 8px;
}
.login-page .auth-ico {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    display: grid;
    place-items: center;
    background: #e8f0ff;
    color: var(--primary);
}
.login-page .auth-ico .icon { width: 15px; height: 15px; }
.login-page .auth-control { position: relative; }
.login-page .auth-control input:not([type="checkbox"]):not([type="hidden"]):not([type="radio"]) {
    padding-right: 48px;
}
.login-page .auth-reveal {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #5c6b80;
    display: grid;
    place-items: center;
    cursor: pointer;
}
.login-page .auth-reveal:hover,
.login-page .auth-reveal.is-on { color: var(--primary); background: #e8f0ff; }
.login-page .auth-reveal .eye-on,
.login-page .auth-reveal .eye-off { display: grid; }
.login-page .auth-reveal .eye-off,
.login-page .auth-reveal.is-on .eye-on { display: none; }
.login-page .auth-reveal.is-on .eye-off { display: grid; }
.login-page .user-form .btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 48px;
    letter-spacing: 0;
    font-weight: 600;
}
.login-page .auth-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}
.login-page .auth-links a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    padding: 6px 10px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: #fff;
    color: var(--dark);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}
.login-page .auth-links a:hover { border-color: var(--primary); color: var(--primary); }
.login-page .auth-links .icon { width: 14px; height: 14px; }

.tariff-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin: 0 0 18px;
    padding: 12px 14px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
}
.tariff-bar > div { display: grid; min-width: 0; }
.tariff-bar strong { font-family: var(--primary-font); font-size: 20px; line-height: 1.1; }
.tariff-bar .btn { margin-left: auto; }
.hx-page .se-i .plans .plan-icon { width: auto; height: auto; margin: 0 0 14px; border-radius: 0; }
.tariff-mark,
.tariff-ico {
    display: grid;
    place-items: center;
    background: #e8f0ff;
    color: var(--primary);
    flex: none;
}
.tariff-mark {
    width: 48px;
    height: 48px;
    border-radius: 14px;
}
.tariff-mark .icon { width: 22px; height: 22px; }
.tariff-mark.is-free { background: #eef3f8; color: #5c6b80; }
.tariff-mark.is-premium { background: #fff6e4; color: #c4840a; }
.tariff-ico { width: 32px; height: 32px; border-radius: 10px; }
.tariff-ico .icon { width: 16px; height: 16px; }
.tariff-ico.is-benefit { background: #e5f6ec; color: #1c7c45; }
.tariff-chip {
    display: inline-flex;
    margin-top: 8px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #e8f0ff;
    color: var(--primary);
    font-size: 12px;
    font-weight: 600;
}
.hx-page .se-i .plans .plan.is-mine {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(0, 96, 254, 0.12);
}
.tariff-free {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 48px;
    padding: 8px 14px;
    border-radius: 8px;
    background: #e5f6ec;
    color: #1c7c45;
    font-weight: 600;
}
.tariff-facts { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.tariff-fact { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 500; color: var(--dark); }
.tariff-fact.is-off { color: #8b97a8; }
.tariff-fact.is-off .tariff-ico { background: #eef3f8; color: #8b97a8; }
.se-i .plans .plan .tariff-pay { margin-top: 4px; }
.tariff-pay-head { display: flex; align-items: center; gap: 10px; }
.tariff-pay-head > div strong,
.tariff-pay-head > div span { display: block; }
.tariff-pay-head > div span { color: #5c6b80; font-size: 13px; font-weight: 500; }
.tariff-topup {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    justify-self: start;
    font-size: 13px;
    font-weight: 600;
}
.hx-page .stepper input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]) {
    width: 56px;
    height: 36px;
    border: 0;
    box-shadow: none;
    padding: 0;
    background: transparent;
}
.hx-page a.tariff-topup { color: var(--primary); text-decoration: none; }
@media (max-width: 640px) {
    .tariff-bar .btn { margin-left: 0; }
}

.auth-step { display: grid; gap: 12px; }
.auth-step + .auth-step { margin-top: 4px; padding-top: 16px; border-top: 1px solid var(--border); }
.auth-step-head { display: flex; gap: 10px; align-items: flex-start; }
.auth-step-num {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #e8f0ff;
    color: var(--primary);
    font-family: var(--primary-font);
    font-size: 13px;
    font-weight: 700;
    flex: none;
}
.auth-step-head h3 {
    margin: 0;
    font-family: var(--primary-font);
    font-size: 15px;
    font-weight: 700;
    color: var(--dark);
}
.auth-step-head p { margin: 2px 0 0; font-size: 12.5px; line-height: 1.4; }
.login-page .auth-step fieldset { border: 0; padding: 0; margin: 0; }
.login-page .auth-step legend {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.auth-hint, .auth-match { margin: 0; font-size: 12.5px; line-height: 1.4; }
.auth-hint { color: #5c6b80; font-weight: 500; }
.auth-match { color: var(--red); font-weight: 600; }
.auth-match.is-ok { color: #1c7c45; }
.auth-closed {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    font-size: 14px;
}
.auth-closed .icon { color: var(--gold); margin-top: 2px; }
.auth-closed p { margin: 0; }
.login-page .user-form .btn-ghost.auth-gen {
    width: 100%;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: #fff;
    border: 1px solid var(--border);
    color: var(--dark);
    letter-spacing: 0;
    font-weight: 600;
}
.login-page .user-form .btn-ghost.auth-gen:hover { border-color: var(--primary); color: var(--primary); }
.type-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 8px; }
.hx-page label.type-card,
.login-page .user-form label.type-card {
    position: relative;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    column-gap: 10px;
    row-gap: 0;
    align-items: center;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    font-weight: 600;
}
.hx-page label.type-card input,
.login-page .user-form label.type-card input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    opacity: 0;
    pointer-events: none;
}
.type-card .type-icon {
    grid-row: 1 / span 2;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: #e8f0ff;
    color: var(--primary);
}
.type-card .type-icon .icon { width: 16px; height: 16px; }
.type-card strong { font-size: 14px; color: var(--dark); }
.type-card > span:not(.type-icon) { color: #5c6b80; font-size: 12px; font-weight: 500; }
.type-card:has(input:checked) { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(0, 96, 254, 0.15); }
.login-page .type-grid { grid-template-columns: 1fr; }

.home-hero {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 22px;
    align-items: center;
    margin: 12px 0 22px;
    padding: 32px;
    border-radius: 18px;
    background: linear-gradient(135deg, #0060fe 0%, #003bdf 100%);
    color: #fff;
}
.home-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.home-kicker .icon { width: 16px; height: 16px; }
.home-hero h1 {
    margin: 0;
    font-family: var(--primary-font);
    font-size: 40px;
    font-weight: 700;
    line-height: 1.15;
    color: #fff;
}
.home-hero h1::after {
    content: '';
    display: block;
    width: 48px;
    height: 3px;
    margin-top: 12px;
    border-radius: 3px;
    background: #fff;
}
.home-lead { margin: 14px 0 0; max-width: 520px; color: rgba(255, 255, 255, 0.9); }
.home-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.hx-page a.home-btn {
    height: 48px;
    padding: 0 18px;
    border-radius: 8px;
    background: #fff;
    color: var(--primary);
    border: 0;
    font-weight: 600;
    letter-spacing: 0;
    text-decoration: none;
    box-shadow: none;
}
.hx-page a.home-btn:hover { color: var(--primary); text-decoration: none; filter: brightness(0.97); }
.hx-page a.home-btn-ghost {
    background: transparent;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.55);
}
.hx-page a.home-btn-ghost:hover { background: rgba(255, 255, 255, 0.12); color: #fff; }
.home-points { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.home-points li {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    padding: 12px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.12);
}
.home-point-ico {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #fff;
    color: var(--primary);
}
.home-points strong,
.home-points li > span > span { display: block; }
.home-points li > span > span { margin-top: 2px; color: rgba(255, 255, 255, 0.84); font-size: 13px; font-weight: 500; }
.home-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 0 0 28px; }
.home-step {
    position: relative;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 16px 16px 18px;
}
.home-step-num {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #e8f0ff;
    color: var(--primary);
    font-family: var(--primary-font);
    font-size: 13px;
    font-weight: 700;
}
.home-step h2 { margin: 12px 0 6px; font-family: var(--primary-font); font-size: 18px; font-weight: 700; }
.home-step p { margin: 0; color: #5c6b80; font-size: 14px; }
.home-plans-title { margin-top: 4px; }
@media (max-width: 900px) {
    .home-hero, .home-steps { grid-template-columns: 1fr; }
    .home-hero { padding: 22px; }
    .home-hero h1 { font-size: 32px; }
}

.faq-jumps { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.faq-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    margin-top: 8px;
    padding: 4px 10px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: #fff;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}
.faq-jumps .faq-chip { margin-top: 0; }
.hx-page a.faq-chip,
.hx-page a.faq-chip:hover { color: var(--dark); text-decoration: none; }
.hx-page a.faq-chip:hover { border-color: var(--primary); color: var(--primary); }
.faq-chip .icon { width: 14px; height: 14px; }
.hx-page .faqs .box { padding: 22px 22px 8px; border-radius: 12px; }
.faq-head-ico,
.faq-q-ico {
    display: grid;
    place-items: center;
    background: #e8f0ff;
    color: var(--primary);
    flex: none;
}
.faq-head-ico { width: 44px; height: 44px; border-radius: 14px; margin-right: 12px; }
.hx-page .faqs .box .box-head .faq-head-ico .icon { width: 22px; height: 22px; min-width: 0; margin: 0; }
.hx-page .faqs .box .box-body { padding: 6px 0 0; }
.hx-page .faqs .box .q .q-h {
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
    font: inherit;
    align-items: center;
    gap: 12px;
    padding: 14px 0;
}
.faq-q-main { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; }
.faq-q-ico { width: 36px; height: 36px; border-radius: 10px; }
.faq-q-ico .icon { width: 16px; height: 16px; }
.hx-page .faqs .box .q .q-h .text { font-weight: 600; }
.hx-page .faqs .box .q.open .q-h .text { color: var(--primary); }
.hx-page .faqs .box .q .q-h .plus { margin-left: 0; }
.hx-page .faqs .box .q.open .q-b { display: block; }
.hx-page .faqs .box .q .q-b { padding-top: 0; padding-bottom: 16px; padding-left: 48px; }
@media (max-width: 640px) {
    .hx-page .faqs .box { padding: 16px 14px 6px; }
    .hx-page .faqs .box .q .q-b { padding-left: 0; }
}

.cookie-bar {
    position: fixed;
    z-index: 90;
    left: 50%;
    transform: translateX(-50%);
    bottom: 16px;
    width: min(720px, calc(100% - 32px));
    padding: 16px 16px 12px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 16px;
    box-shadow: 0 18px 40px rgba(11, 12, 27, 0.16);
    color: var(--dark);
}
.cookie-bar p { margin: 0; font-size: 14px; line-height: 1.45; }
.cookie-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 12px; }
.cookie-actions form { margin: 0; }
.cookie-bar .btn,
.cookie-page .btn { display: inline-flex; align-items: center; gap: 8px; height: 44px; letter-spacing: 0; text-decoration: none; }
.cookie-bar .btn-primary { background: var(--primary); color: #fff; border: 0; }
.cookie-bar .btn-ghost,
.cookie-page .btn-ghost { background: #fff; border: 1px solid var(--border); color: var(--dark); }
.cookie-langs { display: flex; flex-wrap: wrap; gap: 8px 12px; margin: 10px 0 0; }
.cookie-langs a { font-size: 13px; font-weight: 600; text-decoration: none; }
.cookie-bar .cookie-langs a { color: #5c6b80; }
.cookie-langs a[aria-current="true"] { color: var(--primary); }
.cookie-page .card h2 { margin-bottom: 6px; }
.cookie-page .card p { margin: 0; }
.login-page .cookie-bar .btn-ghost {
    background: #fff;
    border: 1px solid var(--border);
    color: var(--dark);
}
@media (min-width: 992px) {
    .login-page .cookie-bar { left: 420px; right: 20px; width: auto; transform: none; }
}

.plan-card-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; flex-wrap: wrap; }
.plan-card-head h2 { margin: 0; }
.plan-code { margin: 4px 0 0; font-size: 13px; color: #5c6b80; }
.plan-off { opacity: 0.72; }
.plan-staff-title { margin: 8px 0 0; font-size: 18px; }
.hx-page label.plan-switch {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-weight: 600;
    width: auto;
}
.hx-page label.plan-switch input { width: auto; height: auto; }

.hx-page .pay-sum-row input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]) {
    border: 0;
    box-shadow: none;
    height: auto;
    background: transparent;
    font-family: var(--primary-font);
    font-size: 32px;
    font-weight: 700;
    padding: 2px 0;
}

/* ===== Дружелюбный интерфейс: подсказки, шаги, понятные кнопки ===== */

/* Хлебные крошки — пользователь всегда видит, где он и как вернуться. */
.hx-crumbs {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 14px 0 0;
    font-size: 13px;
    font-weight: 600;
    color: #5c6b80;
}
.hx-crumbs a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #5c6b80;
    text-decoration: none;
    padding: 4px 8px;
    border-radius: 8px;
}
.hx-crumbs a:hover { color: var(--primary); background: #eef4ff; text-decoration: none; }
.hx-crumbs .icon { width: 14px; height: 14px; }
.hx-crumbs strong { color: var(--dark); }

/* Блок «С чего начать» на главной странице кабинета. */
.hx-guide {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 18px 20px;
    margin: 16px 0 18px;
    box-shadow: 0 10px 28px rgba(11, 12, 27, 0.04);
}
.hx-guide-head { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 14px; }
.hx-guide-head h2 { margin: 0; font-family: var(--primary-font); font-size: 19px; }
.hx-guide-head p { margin: 4px 0 0; }
.hx-guide-ico {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #0060fe, #003bdf);
    color: #fff;
    flex: none;
}
.hx-guide-ico .icon { width: 22px; height: 22px; }
.hx-guide-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; counter-reset: none; }
.hx-guide-steps li {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    border: 1px dashed var(--border);
    border-radius: 12px;
    background: #f8fbfe;
}
.hx-guide-steps li.is-now { border: 1px solid var(--primary); background: #f2f7ff; }
.hx-guide-num {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #e8f0ff;
    color: var(--primary);
    font-family: var(--primary-font);
    font-weight: 700;
    font-size: 15px;
}
.hx-guide-steps li.is-now .hx-guide-num { background: var(--primary); color: #fff; }
.hx-guide-steps strong { display: block; font-size: 15px; }
.hx-guide-steps p { margin: 2px 0 0; font-size: 13.5px; }
.hx-guide-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13.5px;
    font-weight: 600;
    white-space: nowrap;
}
@media (max-width: 640px) {
    .hx-guide-steps li { grid-template-columns: 34px minmax(0, 1fr); }
    .hx-guide-steps li > .btn,
    .hx-guide-steps li > .hx-guide-link { grid-column: 2; justify-self: start; }
}

/* Быстрые карточки на публичной главной. */
.home-quick { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 0 0 28px; }
.home-quick-card {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 14px 16px;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.home-quick-card:hover {
    border-color: var(--primary);
    box-shadow: 0 12px 26px rgba(0, 96, 254, 0.10);
    transform: translateY(-1px);
    text-decoration: none;
    color: inherit;
}
.home-quick-ico {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #e8f0ff;
    color: var(--primary);
    flex: none;
}
.home-quick-copy { display: grid; gap: 2px; min-width: 0; }
.home-quick-copy strong { font-size: 15px; }
.home-quick-copy span { font-size: 13px; color: #5c6b80; }
.home-quick-go { margin-left: auto; color: #9aa7b8; flex: none; }
.home-quick-card:hover .home-quick-go { color: var(--primary); }
@media (max-width: 900px) { .home-quick { grid-template-columns: 1fr; } }

/* Мобильная навигация: крупная кнопка «Войти / Кабинет» и подпись у «Меню». */
.theme-navbar .menu-icon { display: flex; align-items: center; gap: 6px; cursor: pointer; }
.menu-icon-text {
    font-family: var(--primary-font);
    font-size: 13px;
    font-weight: 600;
    color: var(--dark);
}
.hx-nav-cta {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 40px;
    padding: 0 14px;
    border-radius: 999px;
    background: var(--primary);
    color: #fff !important;
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none !important;
    box-shadow: 0 6px 16px rgba(0, 96, 254, 0.28);
}
.hx-nav-cta .icon { width: 16px; height: 16px; }
.hx-nav-cta:hover { filter: brightness(1.08); }

/* Подсказки под полями форм: куда смотреть и что вводить. */
.hx-hint {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 10px 0 0;
    padding: 10px 12px;
    border-radius: 10px;
    background: #f4f8fb;
    color: #4a5a70;
    font-size: 13.5px;
    line-height: 1.45;
}
.hx-hint .icon { width: 16px; height: 16px; margin-top: 1px; color: var(--primary); }
label > .hx-hint { margin-top: 6px; }

/* Кнопки с иконками не «прыгают» на узких экранах. */
.hx-page .btn .icon { width: 16px; height: 16px; }
.hx-page .btn-sm { min-height: 40px; padding: 8px 14px; }

/* Понятное наведение на кликабельных строках таблиц и карточках тарифов. */
.hx-page .table tbody tr { transition: background 0.12s ease; }
.hx-page .se-i .plans .plan { transition: transform 0.15s ease, box-shadow 0.15s ease; }
.hx-page .se-i .plans .plan:hover { transform: translateY(-2px); }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* Dashboard interaction polish */
.dashboard-page .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 41px;
    padding: 10px 15px;
    border: 1px solid transparent;
    border-radius: 9px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
    transition: background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.dashboard-page .btn-primary,
.dashboard-page .btn-fill-primary {
    border-color: #596ff0;
    background: linear-gradient(135deg, #667bf8, #5368e8);
    color: #fff;
    box-shadow: 0 5px 13px #596ff02c;
}
.dashboard-page .btn-primary:hover,
.dashboard-page .btn-fill-primary:hover { filter: none; background: #4f64df; box-shadow: 0 7px 17px #596ff044; transform: translateY(-1px); }
.dashboard-page .btn-ghost,
.dashboard-page .btn-outline-dark {
    border-color: #e2e7f0;
    background: #fff;
    color: #526078;
}
.dashboard-page .btn-ghost:hover,
.dashboard-page .btn-outline-dark:hover { border-color: #aeb9f5; background: #f7f8ff; color: #5267dc; }
.dashboard-page .btn:focus-visible,
.dashboard-page a:focus-visible,
.dashboard-page input:focus-visible,
.dashboard-page select:focus-visible,
.dashboard-page textarea:focus-visible {
    outline: 3px solid #7182f566;
    outline-offset: 2px;
}
.dashboard-page .btn:active { transform: translateY(0); box-shadow: none; }
.dashboard-page .btn:disabled { transform: none; box-shadow: none; }
.dashboard-page .icon-btn { width: 36px; min-height: 34px; padding: 7px; }
.dashboard-page .hx-guide-steps li.is-now { border-color: #d6dcff; border-radius: 10px; background: #f7f8ff; }
.dashboard-page .qty-field { margin: 7px 0; }
.dashboard-page .qty-label { display: block; margin-bottom: 7px; color: #748197; font-size: 10px; font-weight: 700; }
.dashboard-page .qty-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.dashboard-page .stepper { display: inline-flex; align-items: center; overflow: hidden; border: 1px solid #e4e8f0; border-radius: 9px; background: #fbfcfe; }
.dashboard-page .stepper button { width: 34px; height: 35px; border: 0; background: transparent; color: #6274e9; font-size: 17px; cursor: pointer; }
.dashboard-page .stepper button:hover { background: #eef0ff; }
.dashboard-page .stepper input { width: 43px; height: 35px; padding: 0; border: 0; border-radius: 0; background: transparent; text-align: center; color: #26334a; font-size: 12px; font-weight: 700; }
.dashboard-page .qty-unit { color: #7b8799; font-size: 10px; }
.dashboard-page .pay-hint { margin: 8px 0; padding: 9px 10px; border-radius: 8px; background: #f6f7fc; color: #6e7a8e; font-size: 10px; }
.dashboard-page .pay-quote:empty { display: none; }
.dashboard-page .flash { border-radius: 10px; font-size: 11px; }
.dashboard-page .notice { box-shadow: 0 5px 15px #bd80340a; }
.dashboard-page .ledger li { grid-template-columns: 30px minmax(0,1fr) auto; gap: 11px; padding: 13px 0; }
.dashboard-page .ledger .pay-row-icon { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 9px; background: #f1f3ff; color: #6879ed; }
.dashboard-page .faq-strip { transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.dashboard-page .faq-strip:hover { transform: translateY(-1px); border-color: #d7ddfa; box-shadow: 0 12px 28px #26375c10; }
@media (max-width: 600px) {
    .dashboard-page .btn { min-height: 42px; }
    .dashboard-page .pay-step-head>.btn { margin-left: 0; }
    .dashboard-page .ledger li { grid-template-columns: 28px minmax(0,1fr); }
    .dashboard-page .ledger b { grid-column: 2; }
}

/* Top up page */
.hx-page:has(.topup-page) { position:relative;isolation:isolate;padding-top:15px;background:linear-gradient(180deg,#f5f7fc 0,#f8f9fc 430px,#fff 850px); }
.hx-page:has(.topup-page)::before { position:absolute;z-index:-1;top:0;left:0;width:100%;height:430px;background:radial-gradient(ellipse at 18% 0%,#e8edff 0,transparent 47%),radial-gradient(ellipse at 88% 20%,#e9f5ff 0,transparent 40%);content:"";pointer-events:none; }
.topup-page { --topup-ink:#1e2940;--topup-muted:#7d899c;max-width:1050px;margin:0 auto;color:var(--topup-ink); }
.topup-page .pay-hero { position:relative;min-height:175px;align-items:center;overflow:hidden;margin:15px 0 19px;padding:28px 32px;border:1px solid #ffffff24;border-radius:18px;background:linear-gradient(115deg,#192342 0%,#27345f 65%,#33437b 100%);box-shadow:0 18px 40px #1e2b5423; }
.topup-page .pay-hero-main,.topup-page .pay-hero-meta { position:relative;z-index:2; }.topup-page .pay-hero-icon { width:58px;height:58px;border:1px solid #ffffff30;border-radius:17px;background:#ffffff16;color:#dce2ff; }.topup-page .pay-hero-icon .icon { width:25px;height:25px; }.topup-page .pay-hero .eyebrow { color:#b5c1eb;font-size:10px;font-weight:750;letter-spacing:.15em; }.topup-page .pay-balance { margin-top:5px;font-size:36px;letter-spacing:-.045em; }.topup-page .pay-plan-chip { margin:0;padding:8px 12px;border:1px solid #ffffff28;border-radius:9px;background:#ffffff12;color:#e4e9ff;font-size:10px; }.topup-page .pay-hero-link { border-radius:9px;background:#ffffff16;color:#fff;font-size:10px; }.topup-page .pay-hero-link:hover { background:#ffffff27; }
.topup-hero-orbit { position:absolute;top:-45px;right:19%;width:245px;height:245px;border:1px solid #b7c3ff30;border-radius:50%;box-shadow:0 0 0 25px #b7c3ff0a,0 0 0 52px #b7c3ff08; }.topup-hero-orbit span { position:absolute;top:81px;left:83px;display:grid;place-items:center;width:78px;height:78px;border:1px solid #ffffff58;border-radius:22px;background:linear-gradient(145deg,#8796ff,#5a6edb);box-shadow:0 17px 35px #111b4866;color:#fff;font-size:37px;font-weight:700;transform:rotate(-11deg); }.topup-hero-orbit i,.topup-hero-orbit b { position:absolute;width:8px;height:8px;border-radius:50%;background:#68d7b3;box-shadow:0 0 0 7px #68d7b31a; }.topup-hero-orbit i { top:58px;right:27px; }.topup-hero-orbit b { left:39px;bottom:46px;background:#a9b6ff; }
.topup-page .pay-layout { grid-template-columns:minmax(0,1.4fr) minmax(275px,.8fr);gap:16px; }.topup-page .pay-panel,.topup-page .pay-history { gap:0;padding:5px;border:1px solid #e6eaf2;border-radius:15px;background:#fff;box-shadow:0 10px 30px #26375c0b; }.topup-page .pay-side { padding:5px; }.topup-page .pay-step { padding:19px 20px 16px; }.topup-page .pay-step+.pay-step { border-top:1px solid #edf0f5; }.topup-page .pay-step-head { align-items:center;margin-bottom:15px; }.topup-page .pay-step-head h2 { color:#253149;font-size:14px;font-weight:750;letter-spacing:-.015em; }.topup-page .pay-step-head p { color:#8a95a5;font-size:10px; }.topup-page .pay-step-ico { width:37px;height:37px;border-radius:11px;background:#eef0ff;color:#6577ed; }.topup-page .pay-step:nth-of-type(2) .pay-step-ico { background:#e9f7f2;color:#3da783; }.topup-page .pay-step:nth-of-type(3) .pay-step-ico { background:#fff3e7;color:#d18c3e; }
.topup-page .pay-sum-row { min-height:61px;padding:9px 15px;border:1px solid #e7eaf2;border-radius:10px;background:#fafbfe;transition:border-color .16s,box-shadow .16s; }.topup-page .pay-sum-row:focus-within { border-color:#9aa7f7;box-shadow:0 0 0 3px #7182f51c; }.topup-page .pay-sum-row input { color:#1f2b42;font-size:29px; }.topup-page .pay-currency { color:#66748b;font-size:20px;font-weight:650; }.topup-page .pay-chips { gap:7px;margin-top:10px; }.topup-page .pay-chip { min-height:33px;padding:7px 12px;border-color:#e5e9f1;border-radius:8px;background:#fff;color:#647188;font-size:10px;font-weight:700;transition:all .15s; }.topup-page .pay-chip:hover,.topup-page .pay-chip.is-on { border-color:#9aa7f7;background:#f1f3ff;color:#5368df; }
.topup-page .pay-methods { grid-template-columns:1fr 1fr;gap:9px; }.topup-page #topup-form .pay-method { min-height:74px;gap:10px;padding:11px;border:1px solid #e5e9f1;border-radius:11px;background:#fff;transition:border-color .16s,background .16s,box-shadow .16s; }.topup-page #topup-form .pay-method:hover:not(:has(input:disabled)) { border-color:#b7c0f2;background:#fcfcff; }.topup-page #topup-form .pay-method:has(input:checked) { border-color:#7484ef;background:#f8f9ff;box-shadow:0 0 0 3px #7182f51a; }.topup-page #topup-form .pay-method-icon { width:37px;height:37px;border-radius:11px;font-size:16px; }.topup-page .brand-ym { background:#7042a0;color:#fff; }.topup-page .brand-crypto { background:#fff3da;color:#c58a29; }.topup-page .pay-method-copy strong { color:#344057;font-size:11px; }.topup-page .pay-method-copy span { color:#8c97a8;font-size:9px; }.topup-page .pay-method-mark { width:16px;height:16px;border-width:1.5px; }.topup-page .pay-method:has(input:checked) .pay-method-mark { border-color:#6477ec;background:#6477ec;box-shadow:inset 0 0 0 3px #fff; }
.topup-page .pay-field { gap:5px;color:#778398;font-size:9px;font-weight:700; }.topup-page .pay-wallet,.topup-page .pay-email { min-height:43px;padding:5px 6px 5px 11px;border:1px solid #e8ebf2;border-radius:9px;background:#f9fafc; }.topup-page .pay-wallet input,.topup-page .pay-email input { color:#354158;font-size:10px; }.topup-page .pay-wallet .btn,.topup-page .pay-email .btn { min-width:34px;min-height:33px;border-radius:7px; }.topup-page .pay-step.stack>label:not(.pay-drop) { display:grid;gap:6px;color:#778398;font-size:9px;font-weight:700; }.topup-page .pay-step.stack>label:not(.pay-drop) input { min-height:39px;border:1px solid #e5e9f0;border-radius:8px;background:#fcfcfd;font-size:11px; }.topup-page .pay-drop { min-height:126px;align-content:center;border:1.5px dashed #cbd2e1;border-radius:11px;background:#fafbfe;transition:border-color .16s,background .16s; }.topup-page .pay-drop:hover,.topup-page .pay-drop:focus-within { border-color:#7283ef;background:#f6f7ff; }.topup-page .pay-drop .pay-method-icon { width:38px;height:38px;border-radius:11px;background:#eef0ff;color:#6477ed; }.topup-page .pay-drop strong { color:#42506a;font-size:10px; }.topup-page .pay-drop #shot-name { color:#969faf;font-size:9px; }
.topup-page .pay-plans { grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px; }.topup-page .pay-plan { min-height:60px;gap:4px;border-color:#e6eaf1;border-radius:10px;background:#fff;transition:border-color .16s,background .16s,box-shadow .16s; }.topup-page .pay-plan:hover { border-color:#bdc5f2; }.topup-page .pay-plan:has(input:checked) { border-color:#7585ef;background:#f8f9ff;box-shadow:0 0 0 2px #7182f518; }.topup-page .pay-plan strong { color:#38465d;font-size:10px; }.topup-page .pay-plan>span:not(.pay-plan-check) { color:#8994a5;font-size:9px; }.topup-page .pay-plan-check { background:#687aee; }.topup-page .pay-submit { min-height:46px;border-radius:9px;font-size:11px; }.topup-page .pay-hint { color:#8994a5;font-size:9px; }.topup-page .stepper { border-color:#e5e9f1;border-radius:9px;background:#fafbfe; }.topup-page .stepper button { color:#5e72e8; }.topup-page .stepper button:hover { background:#eff1ff; }.topup-page .qty-unit { color:#808ca0;font-size:10px; }
.topup-page .pay-history { display:grid;gap:9px;margin-top:18px;padding:15px; }.topup-page .pay-history>.pay-step-head { margin:0 0 3px;padding:0 3px; }.topup-page .pay-history>.pay-step-head .pay-step-ico { background:#f0f2ff; }.topup-page .pay-row { grid-template-columns:34px minmax(0,1fr) auto auto;gap:11px;padding:12px;border-color:#e9edf3;border-radius:10px;transition:border-color .16s,box-shadow .16s; }.topup-page .pay-row:hover { border-color:#d6dcf1;box-shadow:0 5px 14px #26375c08; }.topup-page .pay-row-icon { width:33px;height:33px;border-radius:10px;background:#eff1ff;color:#6477ed; }.topup-page .pay-row strong { color:#303d54;font-size:12px; }.topup-page .pay-row .muted { color:#8a96a7;font-size:9px; }.topup-page .pay-row .badge { padding:5px 9px;font-size:9px; }.topup-page .pay-row .btn { min-height:34px;padding:7px 11px;border-radius:8px;font-size:9px; }.topup-page .notice { margin:0 0 13px;border-radius:11px;font-size:11px;box-shadow:0 6px 18px #26375c08; }.topup-page .pay-actions .btn { min-height:38px;border-radius:8px;font-size:10px; }
.topup-page .pay-panel .btn:focus-visible,.topup-page .pay-history a:focus-visible,.topup-page .pay-chip:focus-visible,.topup-page .pay-method:focus-within,.topup-page .pay-plan:focus-within { outline:3px solid #7182f566;outline-offset:2px; }
@media (max-width: 900px) { .topup-page .pay-layout { grid-template-columns:1fr; }.topup-page .pay-side { position:static; } }
@media (max-width: 600px) { .hx-page:has(.topup-page) { padding-top:6px; }.topup-page .pay-hero { min-height:155px;align-items:flex-start;flex-direction:column;gap:14px;padding:22px; }.topup-page .pay-hero-meta { flex-direction:row;align-items:center; }.topup-page .pay-balance { font-size:31px; }.topup-page .pay-hero-icon { width:49px;height:49px; }.topup-hero-orbit { top:-26px;right:-72px;opacity:.45; }.topup-page .pay-step { padding:16px 14px 13px; }.topup-page .pay-methods { grid-template-columns:1fr; }.topup-page .pay-plans { grid-template-columns:1fr 1fr; }.topup-page .pay-row { grid-template-columns:32px minmax(0,1fr); }.topup-page .pay-row .badge,.topup-page .pay-row .btn { grid-column:2;justify-self:start; }.topup-page .pay-note { grid-column:2; } }

/* Unified primary navigation */
.theme-navbar { position:relative;z-index:20;border-bottom:1px solid #e8ebf2;box-shadow:0 5px 22px #25325308; }
.theme-navbar .notices-bar { background:#f2f5ff; }.theme-navbar .notices-bar .content { min-height:34px;padding:4px 44px;gap:10px; }.theme-navbar .notices-bar .text { margin:0;color:#68758d;font-size:10px;font-weight:600; }.theme-navbar .notices-bar .action-btn { margin:0;padding:5px 10px;border-radius:6px;background:#e4e9ff;color:#576be1;font-size:9px;font-weight:750; }.theme-navbar .notices-bar .action-btn:hover { background:#d9e0ff; }.theme-navbar .notices-bar .close-btn { right:10px;display:grid;place-items:center;width:22px;height:22px;border-radius:6px; }.theme-navbar .notices-bar .close-btn:hover { background:#e6eaf4;opacity:1; }
.theme-navbar>.container-fluid,.theme-navbar>.container-fluid .container-fluid { max-width:1240px;margin:0 auto;padding-right:24px;padding-left:24px; }
.theme-navbar .nav-top { min-height:70px;padding:12px 0;border-bottom:0!important; }.theme-navbar .hx-wordmark { display:inline-flex;align-items:center;gap:9px;color:#1d2940;font-size:23px;letter-spacing:-.055em; }.theme-navbar .hx-wordmark::before { content:"f.";display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:linear-gradient(145deg,#7888ff,#5268e6);box-shadow:0 5px 12px #5368e629;color:#fff;font-size:17px;font-weight:800;letter-spacing:-.06em; }
.theme-navbar .options { gap:13px; }.theme-navbar .options .c-link { padding:7px 9px;border-radius:8px; }.theme-navbar .options .c-link:hover { background:#f4f6fb; }.theme-navbar .options .c-link .text { color:#6f7b8e;font-size:11px;font-weight:650; }.theme-navbar .buttons { gap:8px; }.theme-navbar .buttons .btn { display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:8px 13px;border-radius:8px;font-size:10px;font-weight:700; }.theme-navbar .buttons .btn-fill-primary { border:1px solid #5d73ec;background:linear-gradient(135deg,#6b7ef3,#5369e5);box-shadow:0 5px 13px #5b70ed2b; }.theme-navbar .buttons .btn-fill-primary:hover { filter:brightness(.97);box-shadow:0 7px 16px #5b70ed40; }.theme-navbar .buttons .btn-outline-dark { border-color:#e2e7ef;background:#fff;color:#526078; }.theme-navbar .buttons .btn-outline-dark:hover { border-color:#c8d0e1;background:#f9faff; }
.theme-navbar .nav-bottom { min-height:48px;padding:0 0 10px; }.theme-navbar .nav-bottom .links { display:flex;align-items:center;gap:5px; }.theme-navbar .nav-bottom .links .link { margin:0!important; }.theme-navbar .nav-bottom .links .link>a { display:flex;align-items:center;gap:8px;min-height:37px;padding:0 12px;border:1px solid transparent;border-radius:8px;color:#69768b;font-size:10px;font-weight:700;opacity:1;text-decoration:none;transition:color .16s,background .16s,border-color .16s; }.theme-navbar .nav-bottom .links .link>a .icon { width:15px;height:15px;color:#8a96aa;transition:color .16s; }.theme-navbar .nav-bottom .links .link:hover>a { background:#f6f7fb;color:#35435c; }.theme-navbar .nav-bottom .links .link.active>a { border-color:#e3e7ff;background:#f2f4ff;color:#5368dc; }.theme-navbar .nav-bottom .links .link.active>a .icon { color:#6276ed; }.theme-navbar .nav-count { display:inline-grid;place-items:center;min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:#fff0e8;color:#c96e3e;font-size:8px;font-weight:800; }
.theme-navbar .menu-icon-text { color:#657188;font-size:10px;font-weight:700; }.theme-navbar .nav-top .menu-icon img { width:17px;height:17px; }.theme-navbar .hx-nav-cta { min-height:37px;padding:0 12px;border-radius:9px;background:linear-gradient(135deg,#6b7ef3,#5369e5);box-shadow:0 5px 13px #5b70ed2b;font-size:10px;font-weight:700; }.theme-navbar .hx-nav-cta:hover { filter:brightness(.97); }
@media (max-width: 1199.98px) { .theme-navbar .nav-top { min-height:64px; }.theme-navbar .nav-top .menu-icon { display:flex;align-items:center;justify-content:center;gap:6px;width:auto;min-width:0;margin:0 13px 0 0;padding:8px 10px;border:1px solid #e8ebf2;border-radius:8px;background:#fff; }.theme-navbar .nav-top .menu-icon img { filter:invert(1); }.theme-navbar .nav-bottom .links { top:0;bottom:0;left:-340px;width:min(320px,88vw);padding:68px 14px 28px;border-right:1px solid #e7eaf1;border-radius:0 16px 16px 0;background:#fff;box-shadow:none;transition:left .28s cubic-bezier(.2,.75,.25,1); }.theme-navbar .nav-bottom .links.open-links { left:0;box-shadow:18px 0 46px #1b27432b!important; }.theme-navbar .nav-bottom .links .link>a { min-width:0;min-height:45px;padding:0 13px;border-radius:9px;font-size:12px; }.theme-navbar .nav-bottom .links .link.active>a { border-color:#e3e7ff;background:#f2f4ff; }.theme-navbar .nav-bottom .links .close-links-btn { top:19px;right:16px;display:grid;place-items:center;width:32px;height:32px;border:1px solid #e8ebf2;border-radius:8px;background:#fff; }.theme-navbar .nav-bottom .links .close-links-btn img { width:12px;filter:invert(.5); } }
@media (max-width: 600px) { .theme-navbar>.container-fluid,.theme-navbar>.container-fluid .container-fluid { padding-right:15px;padding-left:15px; }.theme-navbar .nav-top { min-height:60px;padding:9px 0; }.theme-navbar .hx-wordmark { font-size:20px; }.theme-navbar .hx-wordmark::before { width:29px;height:29px;border-radius:9px;font-size:15px; }.theme-navbar .menu-icon-text { display:none; }.theme-navbar .nav-top .menu-icon { width:36px;height:36px;padding:0; }.theme-navbar .hx-nav-cta { min-height:36px;padding:0 10px; }.theme-navbar .nav-top .options { display:none!important; } }

/* FAQ help center */
.hx-page:has(.faq-page) { position:relative;isolation:isolate;padding-top:12px;background:linear-gradient(180deg,#f5f7fc 0,#f8f9fc 410px,#fff 800px); }
.hx-page:has(.faq-page)::before { position:absolute;z-index:-1;top:0;left:0;width:100%;height:430px;background:radial-gradient(ellipse at 15% 0%,#e7ecff 0,transparent 45%),radial-gradient(ellipse at 90% 25%,#eaf5ff 0,transparent 42%);content:"";pointer-events:none; }
.faq-page { --faq-ink:#1c2840;max-width:1080px;margin:0 auto;color:var(--faq-ink); }.faq-hero { position:relative;min-height:256px;display:flex;align-items:center;justify-content:space-between;overflow:hidden;margin:15px 0 22px;padding:30px 37px;border:1px solid #ffffff20;border-radius:18px;background:linear-gradient(112deg,#192342 0%,#283660 63%,#34457c 100%);box-shadow:0 18px 40px #1e2b5420;color:#fff; }.faq-hero>div:first-child { position:relative;z-index:2; }.faq-eyebrow { display:inline-flex;align-items:center;gap:8px;color:#b8c3e8;font-size:9px;font-weight:800;letter-spacing:.16em; }.faq-eyebrow i { width:7px;height:7px;border-radius:50%;background:#68d7b3;box-shadow:0 0 0 4px #68d7b322; }.faq-hero h1 { margin:13px 0 10px;color:#fff;font-size:clamp(36px,4.6vw,53px);font-weight:750;line-height:.98;letter-spacing:-.06em; }.faq-hero h1 span { color:#aebaff; }.faq-hero p { max-width:420px;margin:0;color:#bcc6df;font-size:11px;line-height:1.75; }.faq-hero-art { position:absolute;top:0;right:16%;width:240px;height:100%; }.faq-orbit { position:absolute;top:18px;left:10px;width:205px;height:205px;border:1px solid #c4ceff35;border-radius:50%;box-shadow:0 0 0 24px #c4ceff0a,0 0 0 47px #c4ceff08; }.faq-bubble { position:absolute;top:69px;left:79px;display:grid;place-items:center;width:78px;height:78px;border:1px solid #ffffff5c;border-radius:24px;background:linear-gradient(145deg,#8292ff,#576cdb);box-shadow:0 17px 35px #111b4866;color:#fff;font-size:44px;font-weight:650;transform:rotate(9deg); }.faq-hero-art i,.faq-hero-art b { position:absolute;width:8px;height:8px;border-radius:50%;background:#68d7b3;box-shadow:0 0 0 7px #68d7b31a; }.faq-hero-art i { top:42px;right:31px; }.faq-hero-art b { bottom:26px;left:24px;background:#a9b6ff; }.faq-hero-note { position:absolute;right:25px;bottom:21px;z-index:2;display:flex;align-items:center;gap:7px;color:#abb8da;font-size:9px;font-weight:650; }.faq-hero-note span { display:grid;place-items:center;width:20px;height:20px;border-radius:6px;background:#ffffff13;color:#6fe0b7; }.faq-hero-note .icon { width:12px;height:12px; }
.faq-content-grid { display:grid;grid-template-columns:245px minmax(0,1fr);align-items:start;gap:16px; }.faq-sidebar { position:sticky;top:18px;padding:21px;border:1px solid #e6eaf2;border-radius:14px;background:#fff;box-shadow:0 10px 28px #26375c09; }.faq-side-icon { display:grid;place-items:center;width:39px;height:39px;border-radius:11px;background:#eef0ff;color:#6577ed; }.faq-side-icon .icon { width:19px;height:19px; }.faq-sidebar h2 { margin:14px 0 6px;color:#26334a;font-size:15px;font-weight:750; }.faq-sidebar>p { margin:0;color:#8490a2;font-size:10px;line-height:1.7; }.faq-jumps { display:grid;gap:7px;margin:17px 0 15px; }.faq-jumps .faq-chip { display:flex;align-items:center;gap:9px;min-height:39px;margin:0;padding:8px 10px;border:1px solid #edf0f5;border-radius:8px;background:#fbfcfe;color:#59677e;font-size:10px;font-weight:700;transition:all .15s; }.faq-jumps .faq-chip .icon { width:14px;height:14px;color:#7888ed; }.faq-jumps .faq-chip span { margin-left:auto;color:#9ba5b5;font-size:13px; }.faq-jumps .faq-chip:hover { border-color:#d5dcff;background:#f7f8ff;color:#5368dc; }.faq-side-foot { display:flex;align-items:center;gap:8px;padding-top:13px;border-top:1px solid #edf0f5;color:#8a96a7;font-size:9px;font-weight:650; }.faq-online-dot { width:7px;height:7px;border-radius:50%;background:#52c49d;box-shadow:0 0 0 4px #52c49d1c; }
.faq-page .faqs { min-width:0;margin:0; }.faq-page .faqs .box { overflow:hidden;padding:0 20px 8px;border:1px solid #e6eaf2;border-radius:14px;background:#fff;box-shadow:0 10px 28px #26375c09; }.faq-page .faqs .box .box-head { display:flex;align-items:center;gap:12px;padding:19px 0 16px;border-bottom:1px solid #edf0f5; }.faq-page .faqs .box .box-head .faq-head-ico { display:grid;place-items:center;width:39px;height:39px;margin:0;border-radius:11px;background:#eef0ff;color:#6577ed; }.faq-page .faqs .box .box-head .faq-head-ico .icon { width:19px;height:19px;color:inherit; }.faq-page .faqs .box .box-head .box-title { margin:0;color:#26334a;font-size:15px;font-weight:750; }.faq-page .faqs .box .box-head .box-des { margin:4px 0 0;color:#8994a5;font-size:9px; }.faq-page .faqs .box .box-body { padding:1px 0 0; }.faq-page .faqs .box .q { border-bottom:1px solid #edf0f5; }.faq-page .faqs .box .q:last-child { border-bottom:0; }.faq-page .faqs .box .q .q-h { width:100%;min-height:63px;padding:10px 2px;background:transparent;text-align:left; }.faq-page .faqs .box .q .q-h:hover { background:#fbfcff; }.faq-page .faqs .box .q .q-h .faq-q-main { gap:11px; }.faq-page .faqs .box .q .q-h .faq-q-ico { display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:#f3f5fa;color:#8591a5; }.faq-page .faqs .box .q.open .q-h .faq-q-ico { background:#eef0ff;color:#6577ed; }.faq-page .faqs .box .q .q-h .faq-q-ico .icon { width:14px;height:14px;margin:0;color:inherit; }.faq-page .faqs .box .q .q-h .text { color:#3e4b62;font-size:11px;font-weight:700; }.faq-page .faqs .box .q.open .q-h .text { color:#5368dc; }.faq-page .faqs .box .q .q-h .plus { display:grid;place-items:center;width:27px;height:27px;border:1px solid #e9edf3;border-radius:8px;background:#fff; }.faq-page .faqs .box .q .q-h .plus span { background:#8793a6; }.faq-page .faqs .box .q.open .q-h .plus { border-color:#e2e6ff;background:#f5f6ff; }.faq-page .faqs .box .q.open .q-h .plus span { background:#687aeb; }.faq-page .faqs .box .q .q-b { padding:0 3px 17px 44px; }.faq-page .faqs .box .q .q-b p { margin:0 0 10px;color:#768398;font-size:10px;line-height:1.75; }.faq-page .faqs .box .q .q-b .faq-chip { display:inline-flex;align-items:center;gap:6px;min-height:31px;margin:0;padding:6px 10px;border:1px solid #e5e9f1;border-radius:7px;background:#fff;color:#5c6edb;font-size:9px;font-weight:700; }.faq-page .faqs .box .q .q-b .faq-chip:hover { border-color:#cbd2fa;background:#f8f9ff; }.faq-page .faqs .box .q .q-b .faq-chip .icon { width:13px;height:13px; }
@media (max-width: 760px) { .hx-page:has(.faq-page) { padding-top:5px; }.faq-hero { min-height:238px;margin:12px 0 15px;padding:25px 22px; }.faq-hero h1 { font-size:41px; }.faq-hero p { max-width:70%;font-size:10px; }.faq-hero-art { right:-42px;opacity:.5; }.faq-hero-note { right:17px;bottom:15px; }.faq-content-grid { grid-template-columns:1fr;gap:12px; }.faq-sidebar { position:static;padding:16px; }.faq-side-icon { float:left;margin-right:11px; }.faq-sidebar h2 { margin:2px 0 3px; }.faq-sidebar>p { min-height:32px; }.faq-jumps { grid-template-columns:repeat(3,1fr);gap:6px;margin:12px 0 11px; }.faq-jumps .faq-chip { justify-content:center;gap:5px;padding:7px 5px;font-size:9px; }.faq-jumps .faq-chip span { display:none; }.faq-side-foot { padding-top:10px; }.faq-page .faqs .box { padding:0 14px 5px; }.faq-page .faqs .box .q .q-h { min-height:58px; }.faq-page .faqs .box .q .q-b { padding-left:0; } }

/* User agreement */
.hx-page:has(.terms-page) { position:relative;isolation:isolate;padding-top:12px;background:linear-gradient(180deg,#f5f7fc 0,#f8f9fc 410px,#fff 800px); }.hx-page:has(.terms-page)::before { position:absolute;z-index:-1;top:0;left:0;width:100%;height:440px;background:radial-gradient(ellipse at 18% 0%,#e7ecff 0,transparent 47%),radial-gradient(ellipse at 90% 20%,#eaf5ff 0,transparent 42%);content:"";pointer-events:none; }
.terms-page { --terms-ink:#1e2940;max-width:1080px;margin:0 auto 55px;color:var(--terms-ink); }.terms-hero { position:relative;min-height:235px;display:flex;flex-direction:column;justify-content:center;overflow:hidden;margin:15px 0 14px;padding:29px 34px;border:1px solid #ffffff20;border-radius:18px;background:linear-gradient(112deg,#192342,#2c3a6c);box-shadow:0 18px 40px #1e2b5420;color:#fff; }.terms-eyebrow { display:flex;align-items:center;gap:8px;color:#b8c3e8;font-size:9px;font-weight:800;letter-spacing:.15em; }.terms-eyebrow i { width:7px;height:7px;border-radius:50%;background:#68d7b3;box-shadow:0 0 0 4px #68d7b322; }.terms-hero h1 { position:relative;z-index:1;margin:13px 0 8px;color:#fff;font-size:clamp(32px,4.3vw,48px);font-weight:750;line-height:1;letter-spacing:-.06em; }.terms-hero h1 span { color:#aebaff; }.terms-hero>p { position:relative;z-index:1;max-width:460px;margin:0;color:#bdc7df;font-size:10px;line-height:1.7; }.terms-meta { position:relative;z-index:1;display:flex;gap:18px;margin-top:15px; }.terms-meta span,.terms-meta a { display:inline-flex;align-items:center;gap:6px;color:#d2daf0!important;font-size:9px;font-weight:650;text-decoration:none!important; }.terms-meta .icon { width:13px;height:13px;color:#aebaff; }.terms-meta a:hover { color:#fff!important; }.terms-meta a b { margin-left:3px;color:#79dfbd;font-size:13px; }.terms-hero-art { position:absolute;top:0;right:15%;width:220px;height:100%;border:1px solid #bac6ff26;border-radius:50%;transform:scale(.8);box-shadow:0 0 0 25px #bac6ff08,0 0 0 50px #bac6ff06; }.terms-hero-art span { position:absolute;top:58px;left:63px;display:grid;place-items:center;width:76px;height:76px;border:1px solid #ffffff55;border-radius:21px;background:linear-gradient(145deg,#8796ff,#566bda);box-shadow:0 17px 35px #111b4866;color:#fff;font-family:Georgia,serif;font-size:39px;transform:rotate(-9deg); }.terms-hero-art i,.terms-hero-art b { position:absolute;width:8px;height:8px;border-radius:50%;background:#68d7b3;box-shadow:0 0 0 7px #68d7b31a; }.terms-hero-art i { top:40px;right:31px; }.terms-hero-art b { bottom:28px;left:22px;background:#a9b6ff; }
.terms-notice { display:flex;align-items:flex-start;gap:11px;margin:0 0 16px;padding:13px 15px;border:1px solid #f2dfb4;border-radius:10px;background:#fff9ed;color:#76582a; }.terms-notice-icon { display:grid;place-items:center;width:27px;height:27px;flex:none;border-radius:8px;background:#fff0d2;color:#bc8430; }.terms-notice-icon .icon { width:15px;height:15px; }.terms-notice p { margin:0;font-size:10px;line-height:1.7; }.terms-notice strong { color:#63471d; }
.terms-layout { display:grid;grid-template-columns:220px minmax(0,1fr);align-items:start;gap:15px; }.terms-toc { position:sticky;top:16px;display:grid;gap:3px;padding:15px;border:1px solid #e6eaf2;border-radius:12px;background:#fff;box-shadow:0 8px 24px #26375c08; }.terms-toc strong { margin:0 0 6px;padding:0 8px 9px;border-bottom:1px solid #edf0f5;color:#354159;font-size:10px; }.terms-toc a { padding:7px 8px;border-radius:6px;color:#718096!important;font-size:9px;line-height:1.4;text-decoration:none!important; }.terms-toc a:hover { background:#f3f5ff;color:#5368dc!important; }.terms-content { display:grid;gap:10px; }.terms-section { display:grid;grid-template-columns:35px minmax(0,1fr);gap:12px;padding:20px;border:1px solid #e6eaf2;border-radius:12px;background:#fff;box-shadow:0 8px 24px #26375c07;scroll-margin-top:18px; }.terms-section-num { display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:#eff1ff;color:#697bea;font-size:9px;font-weight:800; }.terms-section h2 { margin:2px 0 12px;color:#28354d;font-size:14px;font-weight:750;letter-spacing:-.02em; }.terms-section h3 { margin:16px 0 7px;color:#3a4860;font-size:10px;font-weight:750; }.terms-section p,.terms-section li { color:#69778d;font-size:10px;line-height:1.8; }.terms-section p { margin:0 0 10px; }.terms-section p:last-child { margin-bottom:0; }.terms-section ul { display:grid;gap:6px;margin:7px 0 12px;padding-left:19px; }.terms-section li::marker { color:#7485ed; }.terms-section a { color:#5d70e0!important;text-decoration:none; }.terms-section a:hover { text-decoration:underline; }.terms-traffic { border-color:#dfe4fc;background:linear-gradient(145deg,#fff,#fbfbff); }.terms-traffic .terms-section-num { background:#6579ed;color:#fff; }.terms-traffic .terms-intro { padding:11px 13px;border-left:3px solid #7182ef;border-radius:0 8px 8px 0;background:#f1f3ff;color:#4c5c83;font-weight:650; }
.terms-consent,.login-page .user-form label.terms-consent { display:flex!important;flex-direction:row!important;align-items:flex-start!important;gap:9px;margin:2px 0 4px;color:#66748a;font-size:11px;font-weight:500!important;line-height:1.55; }.terms-consent input { width:16px!important;height:16px!important;flex:none;margin:1px 0 0;accent-color:#6377ec; }.terms-consent a { color:#566bdd!important;font-weight:700; }.terms-consent a:hover { text-decoration:underline; }
@media (max-width: 760px) { .hx-page:has(.terms-page) { padding-top:5px; }.terms-hero { min-height:225px;margin:12px 0;padding:24px 21px; }.terms-hero h1 { font-size:36px; }.terms-hero>p { max-width:72%;font-size:9px; }.terms-hero-art { right:-47px;opacity:.48; }.terms-meta { flex-direction:column;gap:8px; }.terms-layout { grid-template-columns:1fr;gap:11px; }.terms-toc { position:static;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;padding:12px; }.terms-toc strong { grid-column:1/-1; }.terms-section { grid-template-columns:28px minmax(0,1fr);gap:9px;padding:15px 13px; }.terms-section-num { width:27px;height:27px; }.terms-section h2 { font-size:13px; }.terms-section p,.terms-section li { font-size:9px; } }

/* Support tickets */
.hx-page:has(.tickets-page) { position:relative;isolation:isolate;padding-top:12px;background:linear-gradient(180deg,#f5f7fc 0,#f8f9fc 380px,#fff 760px); }.hx-page:has(.tickets-page)::before { position:absolute;z-index:-1;top:0;left:0;width:100%;height:400px;background:radial-gradient(ellipse at 12% 0%,#e8edff 0,transparent 46%),radial-gradient(ellipse at 90% 20%,#eaf5ff 0,transparent 40%);content:"";pointer-events:none; }.tickets-page { --tickets-ink:#1d2940;max-width:1060px;margin:0 auto 48px;color:var(--tickets-ink); }.tickets-heading { display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:154px;margin:14px 0 14px;padding:27px 30px;border:1px solid #e6eaf2;border-radius:16px;background:radial-gradient(ellipse at 94% 15%,#e8ecff,transparent 36%),linear-gradient(110deg,#fff,#fbfcff);box-shadow:0 10px 28px #26375c09; }.tickets-heading h1 { margin:10px 0 6px;color:#1e2a41;font-size:clamp(27px,3.5vw,37px);font-weight:750;letter-spacing:-.05em; }.tickets-heading p { margin:0;color:#7f8b9f;font-size:11px; }.tickets-eyebrow { display:flex;align-items:center;gap:8px;color:#7180a0;font-size:9px;font-weight:800;letter-spacing:.15em; }.tickets-eyebrow i { width:7px;height:7px;border-radius:50%;background:#57c7a1;box-shadow:0 0 0 4px #57c7a11c; }.ticket-new-button { display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:43px;padding:0 15px;border:1px solid #5a70ea;border-radius:9px;background:linear-gradient(135deg,#687cf2,#5369e4);box-shadow:0 7px 17px #586ded30;color:#fff!important;font-size:10px;font-weight:750;text-decoration:none!important;white-space:nowrap;transition:transform .16s,box-shadow .16s,background .16s; }.ticket-new-button:hover { transform:translateY(-1px);box-shadow:0 10px 22px #586ded40;background:#5065dc; }.ticket-new-button .icon { width:15px;height:15px; }.ticket-new-button>span { margin-left:3px;font-size:15px; }.ticket-limit-note { display:flex;align-items:center;gap:8px;max-width:270px;padding:10px 12px;border:1px solid #f0dfbc;border-radius:9px;background:#fff9ed;color:#84652f;font-size:9px;line-height:1.5; }.ticket-limit-note .icon { width:15px;height:15px;flex:none; }
.tickets-page .ticket-filters { display:flex;gap:5px;overflow-x:auto;margin:0 0 13px;padding:4px;border:1px solid #e7ebf2;border-radius:10px;background:#fff;box-shadow:0 6px 18px #26375c06;scrollbar-width:thin; }.tickets-page .ticket-filter { display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 11px;border-color:transparent;border-radius:7px;background:transparent;color:#79869a;font-size:9px;font-weight:700;white-space:nowrap;transition:all .15s; }.tickets-page .ticket-filter b { display:grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:6px;background:#f0f2f6;color:#78859a;font-size:8px; }.tickets-page .ticket-filter:hover { background:#f7f8fc;color:#46546c; }.tickets-page .ticket-filter.is-on { border-color:#e1e6ff;background:#f1f3ff;color:#5368db; }.tickets-page .ticket-filter.is-on b { background:#dfe4ff;color:#5268dd; }.tickets-page .ticket-list { display:grid;gap:8px; }.tickets-page .ticket-row { grid-template-columns:40px minmax(0,1fr) auto 22px;gap:13px;min-height:75px;padding:13px 15px;border-color:#e7ebf2;border-radius:11px;background:#fff;box-shadow:0 5px 17px #26375c06;color:inherit;text-decoration:none;transition:border-color .16s,box-shadow .16s,transform .16s; }.tickets-page .ticket-row:hover { transform:translateY(-1px);border-color:#cfd6fb;box-shadow:0 10px 23px #26375c0c; }.ticket-topic-icon { display:grid;place-items:center;width:39px;height:39px;border-radius:11px;background:#edf0ff;color:#6577ed; }.ticket-topic-icon .icon { width:18px;height:18px; }.ticket-topic-icon.is-billing { background:#eaf7f2;color:#43a988; }.ticket-topic-icon.is-access { background:#fff3e7;color:#d2984e; }.ticket-topic-icon.is-tariff { background:#edf0ff;color:#6577ed; }.ticket-topic-icon.is-other { background:#f2efff;color:#8b70d7; }.tickets-page .ticket-row>span:nth-child(2) { min-width:0;display:grid;gap:6px; }.tickets-page .ticket-row strong { overflow:hidden;color:#29364d;font-size:11px;font-weight:750;text-overflow:ellipsis;white-space:nowrap; }.ticket-row-meta { overflow:hidden;color:#8995a6;font-size:9px;text-overflow:ellipsis;white-space:nowrap; }.tickets-page .ticket-side { justify-items:end;gap:6px; }.tickets-page .ticket-side>.muted { color:#98a2b1;font-size:8px; }.ticket-status { display:inline-flex;align-items:center;gap:6px;min-height:23px;padding:4px 8px;border:1px solid #e6eaf0;border-radius:6px;background:#f6f7fa;color:#718096;font-size:8px;font-weight:750;white-space:nowrap; }.ticket-status i { width:6px;height:6px;border-radius:50%;background:#9aa5b5; }.ticket-status.status-open { border-color:#ffebcb;background:#fff8eb;color:#ab7930; }.ticket-status.status-open i { background:#e7a73d; }.ticket-status.status-answered { border-color:#d9f0e8;background:#effaf5;color:#318e6f; }.ticket-status.status-answered i { background:#4ab68f; }.ticket-status.status-closed { background:#f2f3f6;color:#8993a2; }.ticket-row-go { color:#a8b1bf;font-size:14px;transition:color .16s,transform .16s; }.ticket-row:hover .ticket-row-go { color:#6577ed;transform:translate(1px,-1px); }.ticket-empty { display:grid;justify-items:center;padding:38px 20px;border:1px dashed #dfe4ee;border-radius:13px;background:#fff;text-align:center; }.ticket-empty>span { display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:#eef0ff;color:#6577ed; }.ticket-empty>span .icon { width:22px;height:22px; }.ticket-empty h2 { margin:13px 0 5px;color:#354158;font-size:15px; }.ticket-empty p { max-width:380px;margin:0 0 15px;color:#8995a6;font-size:10px;line-height:1.7; }
.tickets-page .tickets-back { display:inline-flex;align-items:center;gap:6px;margin:0 0 12px;color:#738097!important;font-size:10px;font-weight:700;text-decoration:none!important; }.tickets-page .tickets-back:hover { color:#5368dc!important; }.tickets-page .tickets-back .icon { width:14px;height:14px; }.tickets-heading.compact { min-height:130px;margin-top:2px; }.tickets-compose-page .ticket-form,.tickets-page .ticket-reply-form { display:grid;gap:14px;margin:0;padding:22px;border:1px solid #e6eaf2;border-radius:14px;background:#fff;box-shadow:0 10px 28px #26375c09; }.ticket-form-heading { display:flex;align-items:center;gap:11px;padding-bottom:13px;border-bottom:1px solid #edf0f5; }.ticket-form-heading>span { display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:#eef0ff;color:#6577ed; }.ticket-form-heading>span .icon { width:17px;height:17px; }.ticket-form-heading h2 { margin:0;color:#2a374e;font-size:13px;font-weight:750; }.ticket-form-heading p { margin:4px 0 0;color:#8a95a6;font-size:9px; }.tickets-page .type-grid { grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px; }.tickets-page .type-card { min-height:75px;padding:11px;border-color:#e7ebf2;border-radius:10px;background:#fff;transition:all .16s; }.tickets-page .type-card:hover { border-color:#cdd5fb;background:#fafbff; }.tickets-page .type-card:has(input:checked) { border-color:#7484ef;background:#f5f6ff;box-shadow:0 0 0 3px #7182f51a; }.tickets-page .type-card strong { color:#435069;font-size:10px; }.tickets-page .type-icon { width:31px;height:31px;border-radius:9px;background:#eef0ff;color:#687aeb; }.tickets-page .type-icon .icon { width:16px;height:16px; }.tickets-page .stack>label { display:grid;gap:6px;color:#69768a;font-size:10px;font-weight:700; }.tickets-page .stack input:not([type=radio]),.tickets-page .stack select,.tickets-page .stack textarea { width:100%;min-height:40px;padding:10px 12px;border:1px solid #e4e8f0;border-radius:8px;background:#fbfcfe;color:#364259;font-size:11px;box-shadow:none; }.tickets-page .stack textarea { min-height:125px;resize:vertical;line-height:1.65; }.tickets-page .stack input:focus,.tickets-page .stack select:focus,.tickets-page .stack textarea:focus { border-color:#8998f1;box-shadow:0 0 0 3px #7182f51c;outline:0; }.ticket-form-footer { display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:1px;padding-top:12px;border-top:1px solid #edf0f5; }.ticket-form-footer p,.ticket-form-footer>span { display:flex;align-items:center;gap:6px;margin:0;color:#8995a6;font-size:9px; }.ticket-form-footer p .icon,.ticket-form-footer>span .icon { width:13px;height:13px;color:#7182dd; }
.ticket-detail-head { align-items:center!important;margin:0 0 12px;padding:19px 21px;border:1px solid #e6eaf2;border-radius:13px;background:#fff;box-shadow:0 8px 24px #26375c08; }.ticket-detail-head h2 { margin:9px 0 5px;color:#25324a;font-size:20px;font-weight:750;letter-spacing:-.03em; }.ticket-detail-head p { margin:0 0 7px;color:#8692a4;font-size:9px; }.ticket-tags { display:flex;align-items:center;gap:7px; }.ticket-topic-label { display:inline-flex;align-items:center;min-height:23px;padding:4px 8px;border-radius:6px;background:#f1f3f7;color:#738097;font-size:8px;font-weight:700; }.ticket-created { display:flex;align-items:center;gap:5px;color:#9aa3b1;font-size:8px; }.ticket-created .icon { width:12px;height:12px; }.ticket-detail-head form { flex:none; }.ticket-detail-head form .btn { min-height:36px;padding:8px 12px;border-radius:8px;font-size:9px; }.ticket-thread-wrap { margin-bottom:12px;padding:17px;border:1px solid #e6eaf2;border-radius:13px;background:#fff;box-shadow:0 8px 24px #26375c08; }.ticket-thread-title { display:flex;align-items:center;gap:9px;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid #edf0f5; }.ticket-thread-title>span { display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:#eef0ff;color:#6577ed; }.ticket-thread-title .icon { width:15px;height:15px; }.ticket-thread-title h2 { margin:0;color:#344158;font-size:12px;font-weight:750; }.ticket-thread-title p { margin:3px 0 0;color:#929cac;font-size:8px; }.ticket-detail-page .thread { gap:11px;margin:0; }.ticket-detail-page .bubble { max-width:84%;padding:13px 14px;border:1px solid #e8ebf1;border-radius:12px;background:#fafbfc; }.ticket-detail-page .bubble.is-mine { align-self:flex-end;margin:0 0 0 12%;border-color:#dce2ff;border-bottom-right-radius:4px;background:#f3f5ff; }.ticket-detail-page .bubble.is-staff:not(.is-mine) { border-color:#d9eee7;border-bottom-left-radius:4px;background:#f2faf7; }.ticket-detail-page .bubble header { align-items:center;color:#778499;font-size:8px; }.bubble-author { display:flex;align-items:center;gap:7px; }.bubble-author i { display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:#e9edff;color:#6376e5;font-size:9px;font-style:normal;font-weight:800; }.bubble.is-staff .bubble-author i { background:#e0f3eb;color:#359777; }.bubble-author strong { color:#344158;font-size:9px; }.bubble-author em { padding:3px 6px;border-radius:5px;background:#f0f2f6;color:#8490a1;font-size:7px;font-style:normal;font-weight:650; }.ticket-detail-page .bubble time { color:#9aa4b2;white-space:nowrap; }.ticket-detail-page .bubble p { margin:9px 0 0;color:#59677d;font-size:10px;line-height:1.7; }.tickets-page .ticket-reply-form { margin-top:12px; }.ticket-reply-form .ticket-form-footer { margin-top:0; }.ticket-reply-form .ticket-form-footer .ticket-new-button { flex:none; }
@media (max-width: 700px) { .hx-page:has(.tickets-page) { padding-top:5px; }.tickets-heading { align-items:flex-start;flex-direction:column;min-height:0;margin:12px 0;padding:20px 18px; }.tickets-heading h1 { margin:8px 0 5px;font-size:28px; }.tickets-heading p { max-width:400px;font-size:10px;line-height:1.6; }.ticket-limit-note { max-width:none; }.tickets-page .ticket-filters { gap:3px; }.tickets-page .ticket-filter { padding:0 8px; }.tickets-page .ticket-row { grid-template-columns:36px minmax(0,1fr) auto;gap:9px;padding:11px; }.ticket-topic-icon { width:35px;height:35px; }.tickets-page .ticket-side { grid-column:2;grid-row:2;display:flex;align-items:center;justify-content:flex-start;justify-items:start;gap:8px; }.tickets-page .ticket-row>span:nth-child(2) { grid-column:2/-1; }.ticket-row-go { grid-column:3;grid-row:1; }.tickets-page .ticket-side>.muted { font-size:8px; }.tickets-heading.compact { min-height:0; }.tickets-compose-page .ticket-form,.tickets-page .ticket-reply-form { gap:12px;padding:16px; }.tickets-page .type-grid { grid-template-columns:1fr 1fr; }.tickets-page .type-card { min-height:67px; }.ticket-form-footer { align-items:stretch;flex-direction:column; }.ticket-form-footer .ticket-new-button { width:100%; }.ticket-detail-head { align-items:flex-start!important;flex-direction:column; }.ticket-detail-head form { align-self:flex-end; }.ticket-detail-head h2 { font-size:18px; }.ticket-thread-wrap { padding:12px; }.ticket-detail-page .bubble { max-width:96%; }.ticket-detail-page .bubble header { align-items:flex-start;flex-direction:column;gap:5px; }.ticket-detail-page .bubble.is-mine { margin-left:5%; } }
.tickets-page a:focus-visible,.tickets-page button:focus-visible,.tickets-page input:focus-visible,.tickets-page textarea:focus-visible,.tickets-page select:focus-visible { outline:3px solid #7182f566;outline-offset:2px; }