:root {
  --bg: #090d14;
  --bg-soft: #101722;
  --bg-card: rgba(16, 23, 34, 0.78);
  --line: rgba(255,255,255,0.08);
  --text: #eef4ff;
  --muted: #a6b5cb;
  --primary: #3d7bff;
  --primary-strong: #5ea3ff;
  --shadow: 0 30px 80px rgba(0, 0, 0, 0.36);
  --radius-xl: 28px;
  --container: 1360px;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif;
  color: var(--text);
  background:
    radial-gradient(circle at 20% 0%, rgba(61,123,255,.2), transparent 30%),
    radial-gradient(circle at 90% 10%, rgba(29,78,216,.12), transparent 28%),
    linear-gradient(180deg, #06080d 0%, #0a1018 45%, #0b1119 100%);
}
html { scroll-behavior: smooth; }
a { color: inherit; text-decoration: none; }
.container { width: min(var(--container), calc(100% - 32px)); margin: 0 auto; }
.site-shell { min-height: 100vh; }
.section { padding: 46px 0 72px; }
.header { position: sticky; top: 0; z-index: 20; backdrop-filter: blur(18px); background: rgba(8, 12, 18, 0.6); border-bottom: 1px solid rgba(255,255,255,0.06); }
.nav { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.brand { display: inline-flex; align-items: center; gap: 12px; font-weight: 800; letter-spacing: -.03em; }
.brand__mark { width: 38px; height: 38px; border-radius: 14px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, var(--primary), #1644c2); box-shadow: 0 12px 30px rgba(61,123,255,.32); }
.nav-links { display: flex; align-items: center; gap: 14px; }
.inline-form { display: inline-flex; margin: 0; }
.hero { padding-top: 40px; }
.hero-grid, .grid-two { display: grid; grid-template-columns: 1.08fr .92fr; gap: 28px; align-items: start; }
.hero-grid { grid-template-columns: minmax(0, 1fr); }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; padding: 9px 14px; border-radius: 999px; border: 1px solid rgba(94,163,255,.18); background: rgba(61,123,255,.08); color: #b9d4ff; font-size: .85rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
h1, h2, h3 { margin: 0 0 16px; line-height: 1.05; letter-spacing: -.04em; }
h1 { font-size: clamp(2.2rem, 5vw, 4rem); }
h2 { font-size: clamp(1.5rem, 4vw, 2.4rem); }
h3 { font-size: 1.2rem; }
.hero-text, .section-head p, .muted { color: var(--muted); line-height: 1.75; }
.hero-actions { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 14px; }
.hero-points, .feature-list, .stack { display: grid; gap: 12px; }
.point { display: inline-flex; align-items: center; gap: 12px; color: #dce8ff; }
.dot { width: 10px; height: 10px; border-radius: 999px; background: linear-gradient(135deg, var(--primary), #8db7ff); box-shadow: 0 0 0 6px rgba(61,123,255,.12); }
.glass-card { background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)); border: 1px solid var(--line); border-radius: var(--radius-xl); box-shadow: var(--shadow); }
.status-card, .auth-card, .card-pad, .stat-card { padding: 26px; }
.feature-list { padding-left: 18px; }
.feature-list li { color: #dce8ff; }
.feature-list--ordered { padding-left: 22px; }
.feature-list--ordered li { list-style: decimal; }
.btn { appearance: none; border: none; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 18px; border-radius: 14px; font-weight: 700; }
.btn--full { width: 100%; }
.btn--pay-wide { min-width: 220px; padding-inline: 28px; }
.btn--primary { color: #fff; background: linear-gradient(135deg, var(--primary), #1644c2); box-shadow: 0 12px 30px rgba(61,123,255,.32); }
.btn--vkid { color: #fff; background: linear-gradient(135deg, #0077ff, #0057d6); box-shadow: 0 12px 30px rgba(0,119,255,.28); }
.btn--ghost { background: rgba(255,255,255,.03); color: var(--text); border: 1px solid var(--line); }
.field { display: grid; gap: 8px; }
.field span { color: #dce8ff; font-weight: 700; font-size: .95rem; }
.field input { width: 100%; min-height: 50px; border-radius: 14px; border: 1px solid var(--line); background: rgba(255,255,255,.02); color: var(--text); padding: 0 14px; }
.alert { padding: 14px 16px; border-radius: 14px; margin-bottom: 18px; border: 1px solid transparent; }
.alert--success { background: rgba(34,197,94,.12); border-color: rgba(34,197,94,.24); }
.alert--error { background: rgba(239,68,68,.12); border-color: rgba(239,68,68,.24); }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 22px; }
.stat-card span { display: block; color: var(--muted); margin-bottom: 10px; }
.stat-card strong { display: block; font-size: 2rem; }
.table-wrap { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; }
.table th, .table td { text-align: left; padding: 12px 10px; border-bottom: 1px solid rgba(255,255,255,.08); }
.kv-list { display: grid; gap: 12px; }
.kv-list div { display: grid; grid-template-columns: 180px 1fr; gap: 10px; }
.kv-list dt { color: var(--muted); }
.break-all { word-break: break-all; }
@media (max-width: 960px) {
  .hero-grid, .grid-two, .stats-grid { grid-template-columns: 1fr; }
  .nav { flex-wrap: wrap; padding: 14px 0; }
  .kv-list div { grid-template-columns: 1fr; }
}
.field select { width: 100%; min-height: 50px; border-radius: 14px; border: 1px solid var(--line); background: rgba(255,255,255,.02); color: var(--text); padding: 0 14px; color-scheme: dark; }
.field select option { color: #0b1119; background: #ffffff; }
.section-top { margin-top: 24px; }
.gap-lg { gap: 16px; }

.section-top-sm { margin-top: 14px; }
.divider { position: relative; text-align: center; color: var(--muted); font-size: .9rem; }
.divider::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: rgba(255,255,255,.08); }
.divider span { position: relative; display: inline-block; padding: 0 12px; background: rgba(8, 12, 18, .92); }


.cards-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.cards-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.section-head--pay{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.pay-showcase{display:grid;grid-template-columns:minmax(280px,.88fr) minmax(0,1.12fr);gap:24px}
.pay-showcase--full{grid-template-columns:minmax(0,1fr)}
.pay-showcase__intro{display:grid;gap:16px;align-content:start}
.pay-showcase__eyebrow,.pay-builder__eyebrow,.pay-result__eyebrow,.pay-panel__eyebrow{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#8fb4ff}
.pay-showcase__bullets{display:grid;gap:10px}
.pay-showcase__bullets span{display:flex;align-items:center;gap:10px;color:#dce8ff}
.pay-showcase__bullets span::before{content:"";width:10px;height:10px;border-radius:999px;background:linear-gradient(135deg,var(--primary),#8db7ff);box-shadow:0 0 0 6px rgba(61,123,255,.12)}
.pay-builder{display:grid;gap:22px}
.pay-builder__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.pay-builder__meta{max-width:320px;color:var(--muted);line-height:1.6;text-align:right}
.pay-tariffs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pay-tariff{position:relative;display:grid;gap:12px;min-height:220px;padding:22px;border-radius:24px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));cursor:pointer;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease}
.pay-tariff:hover{transform:translateY(-3px);border-color:rgba(94,163,255,.24);box-shadow:0 18px 34px rgba(23,107,255,.14)}
.pay-tariff input{position:absolute;inset:0;opacity:0;cursor:pointer}
.pay-tariff.is-selected{border-color:rgba(120,178,255,.4);background:linear-gradient(180deg,rgba(61,123,255,.16),rgba(255,255,255,.03));box-shadow:0 22px 40px rgba(23,107,255,.18)}
.pay-tariff__badge{display:inline-flex;align-items:center;justify-content:center;width:max-content;min-height:30px;padding:0 12px;border-radius:999px;background:rgba(255,255,255,.08);color:#dce8ff;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.pay-tariff__title{font-size:1.22rem;line-height:1.2}
.pay-tariff__price{font-size:1.85rem;font-weight:800;letter-spacing:-.03em}
.pay-tariff__note{margin-top:auto;color:var(--muted);line-height:1.65}
.pay-builder__footer{display:grid;grid-template-columns:minmax(240px,340px) minmax(0,1fr);gap:18px;align-items:end}
.pay-builder__footer--single{grid-template-columns:minmax(0,1fr)}
.pay-builder__field{margin:0}
.pay-builder__actions{display:grid;gap:12px}
.btn--pay-cta{min-width:220px;min-height:56px;font-size:1rem;white-space:nowrap}
.pay-result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.pay-result,.pay-panel{display:grid;gap:16px}
.pay-result--success{background:linear-gradient(180deg,rgba(34,197,94,.12),rgba(255,255,255,.03))}
.pay-result--failed{background:linear-gradient(180deg,rgba(223,76,76,.14),rgba(255,255,255,.03))}
.pay-result--pending{background:linear-gradient(180deg,rgba(61,123,255,.14),rgba(255,255,255,.03))}
.pay-panel__head{display:grid;gap:6px}
.pay-panel--full{grid-column:1 / -1}
.pay-result__actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pay-result__actions--split{justify-content:space-between}
.pay-downloads{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.pay-downloads .download-card{min-height:0}
.text-link{color:#9fc3ff;text-decoration:underline;text-underline-offset:3px}
.billing-wizard{display:grid;gap:24px}
.wizard-progress{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.wizard-progress__step{display:flex;align-items:center;gap:12px;min-height:68px;padding:0 18px;border-radius:20px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);color:#dce8ff;cursor:pointer;transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease}
.wizard-progress__step:hover{transform:translateY(-2px);border-color:rgba(94,163,255,.18)}
.wizard-progress__step.is-unlocked{background:rgba(61,123,255,.06)}
.wizard-progress__step.is-active{background:linear-gradient(135deg,rgba(61,123,255,.22),rgba(10,91,211,.2));border-color:rgba(94,163,255,.3);box-shadow:0 18px 36px rgba(23,107,255,.16)}
.wizard-progress__step.is-complete{border-color:rgba(34,197,94,.22);background:rgba(34,197,94,.08)}
.wizard-progress__index{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:999px;background:rgba(255,255,255,.08);font-weight:800}
.wizard-progress__text{font-weight:700}
.wizard-panels{position:relative}
.wizard-panel{display:none;opacity:0;transform:translateY(18px) scale(.985);transform-origin:top center}
.wizard-panel.is-active{display:block;animation:wizardPanelIn .32s cubic-bezier(.2,.8,.2,1) forwards}
.wizard-panel.is-complete{display:none}
.step-card{display:flex;flex-direction:column;gap:14px;min-height:100%}
.step-card.is-active{border-color:rgba(94,163,255,.26);box-shadow:0 18px 40px rgba(23,107,255,.14)}
.step-card.is-complete{border-color:rgba(34,197,94,.22)}
.step-card__head{display:grid;gap:10px}
.step-chip{display:inline-flex;align-items:center;justify-content:center;width:max-content;min-height:28px;padding:0 10px;border-radius:999px;background:rgba(61,123,255,.14);border:1px solid rgba(94,163,255,.22);color:#cfe0ff;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.choice-list{display:grid;gap:12px}
.choice-card{display:grid;gap:8px;padding:16px 18px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);color:#eef4ff;transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease}
.choice-card:hover{transform:translateY(-2px);border-color:rgba(94,163,255,.18);background:rgba(61,123,255,.08)}
.choice-card.is-selected{transform:translateY(-1px) scale(1.01);border-color:rgba(94,163,255,.28);background:rgba(61,123,255,.14);box-shadow:0 12px 24px rgba(23,107,255,.14)}
.choice-card--button{width:100%;appearance:none;cursor:pointer;text-align:left;font:inherit}
.wizard-summary{display:grid;gap:16px;padding:18px;border-radius:22px;border:1px solid rgba(94,163,255,.16);background:linear-gradient(180deg,rgba(61,123,255,.08),rgba(255,255,255,.02))}
.wizard-summary__note{margin:0}
.wizard-actions{display:flex;justify-content:space-between;gap:12px}
.payment-next-action{display:flex;justify-content:flex-end}
@keyframes wizardPanelIn{
  from{opacity:0;transform:translateY(18px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.card-nested{background:rgba(255,255,255,.04)}
.download-card{display:grid;gap:8px;min-height:124px;align-content:space-between;transition:transform .2s ease,border-color .2s ease,background .2s ease}
.download-card:hover{transform:translateY(-2px);border-color:rgba(94,163,255,.24);background:rgba(61,123,255,.08)}
.price{font-size:28px;font-weight:700;margin:4px 0 0}
.badge{display:inline-flex;align-items:center;justify-content:center;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;background:rgba(255,255,255,.08)}
.badge--pending,.badge--pending_sync{background:rgba(255,184,77,.18);color:#ffce78}
.badge--paid,.badge--applied{background:rgba(82,196,26,.18);color:#9cff76}
.badge--failed,.badge--cancelled{background:rgba(255,107,107,.18);color:#ff9f9f}
.grid-two--compact{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.checkbox-field{display:flex;align-items:center;gap:10px;padding-top:28px}
.field--actions{display:flex;align-items:flex-end}
.section-head--tight{display:flex;align-items:center;justify-content:space-between;gap:18px}
@media (max-width: 960px){.cards-grid--3,.cards-grid,.grid-two--compact,.wizard-progress,.pay-showcase,.pay-result-grid,.pay-builder__footer{grid-template-columns:1fr}.pay-tariffs,.pay-downloads{grid-template-columns:1fr}.section-head--tight,.section-head--pay,.pay-builder__head{align-items:flex-start;flex-direction:column}.pay-builder__meta{text-align:left;max-width:none}}

.nav-left{display:flex;align-items:center;gap:12px}
.nav-links--compact{gap:10px}
.user-chip{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);color:#dce8ff;font-weight:700}
.profile-menu{position:relative}
.profile-menu__toggle{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 14px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:#eef4ff;cursor:pointer;font:inherit;font-weight:700;transition:background .18s ease,border-color .18s ease,transform .18s ease}
.profile-menu__toggle:hover,.profile-menu.is-open .profile-menu__toggle{background:rgba(61,123,255,.12);border-color:rgba(94,163,255,.18)}
.profile-menu__icon{display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;color:#dce8ff}
.profile-menu__icon svg{width:24px;height:24px;fill:currentColor}
.profile-menu__label{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.profile-menu__dropdown{position:absolute;top:calc(100% + 10px);right:0;z-index:30;display:grid;gap:6px;min-width:180px;padding:10px;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:#0f1622;box-shadow:0 18px 42px rgba(0,0,0,.28);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(8px) scale(.98);transform-origin:top right;transition:opacity .18s ease,transform .18s ease,visibility .18s ease}
.profile-menu.is-open .profile-menu__dropdown{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0) scale(1)}
.profile-menu__form{margin:0}
.profile-menu__link{display:flex;align-items:center;width:100%;min-height:44px;padding:0 12px;border:none;border-radius:12px;background:transparent;color:#eef4ff;font:inherit;font-weight:700;text-align:left;cursor:pointer;transition:background .18s ease,color .18s ease}
.profile-menu__link:hover{background:rgba(255,255,255,.05)}
.profile-menu__link--danger:hover{background:rgba(223,76,76,.12);color:#ffd5d5}
.nav-toggle{display:none;align-items:center;justify-content:center;flex-direction:column;gap:4px;width:44px;height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);cursor:pointer}
.nav-toggle span{display:block;width:18px;height:2px;background:#eef4ff;border-radius:999px}
.layout-grid{display:grid;grid-template-columns:280px minmax(0,1fr);gap:24px;align-items:start}
.content-area{min-width:0}
.sidebar{position:sticky;top:96px;display:flex;flex-direction:column;gap:16px;max-height:calc(100vh - 112px);padding:18px;border-radius:26px}
.sidebar__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.sidebar__eyebrow{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#8fb4ff;margin-bottom:8px}
.sidebar__title{font-size:20px;font-weight:800;letter-spacing:-.03em}
.sidebar__meta{margin-top:10px;color:var(--muted);font-size:.95rem;line-height:1.5}
.sidebar__close{display:none;width:36px;height:36px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:#eef4ff;font-size:24px;line-height:1;cursor:pointer}
.sidebar__nav{display:grid;gap:8px}
.sidebar__footer{margin-top:auto;padding-top:8px}
.sidebar__support{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);box-shadow:none}
.sidebar__support:hover{background:rgba(0,119,255,.12);border-color:rgba(94,163,255,.2);box-shadow:none}
.sidebar__link{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 14px;border-radius:14px;border:1px solid transparent;color:#dce8ff;background:transparent;font-weight:700;transition:.18s ease}
.sidebar__link-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 20px;width:20px;height:20px;color:currentColor}
.sidebar__link-icon svg{width:20px;height:20px;fill:currentColor}
.sidebar__link-label{display:block;min-width:0}
.sidebar__link:hover,.sidebar__link.is-active{background:rgba(61,123,255,.12);border-color:rgba(94,163,255,.18);color:#fff}
.sidebar__link--support-mobile{display:none}
.sidebar-overlay{display:none}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.field input[type="checkbox"]{width:20px;height:20px;min-height:0;padding:0;margin:0}
.field textarea{width:100%;min-height:110px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.02);color:var(--text);padding:12px 14px;resize:vertical}
.form-footer{grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:18px;margin-top:6px;border-top:1px solid rgba(255,255,255,.08)}
.form-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.checkbox-field{display:inline-flex;align-items:center;gap:12px;padding-top:0;font-weight:700;color:#dce8ff}
.card-stack{display:grid;gap:14px}
.card-meta{display:grid;gap:8px;margin-top:10px}
.kv-inline{display:flex;justify-content:space-between;gap:12px;color:var(--muted)}
.tariff-actions{display:grid;gap:10px;margin-top:18px}
.btn--soft{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#fff}
.btn--accent{color:#fff;background:linear-gradient(135deg,#1f8bff,#0a5bd3);box-shadow:0 12px 30px rgba(23,107,255,.28)}
.btn--danger{color:#fff;background:linear-gradient(135deg,#df4c4c,#a51919);box-shadow:0 12px 28px rgba(223,76,76,.24)}
.note{padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);color:#dce8ff}
.table .actions-cell{width:1%;white-space:nowrap}
.icon-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.icon-actions form{margin:0}
.icon-actions--inline{flex-wrap:nowrap;justify-content:flex-end}
.icon-actions--inline .btn{flex:0 0 auto}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:none;border-radius:12px;cursor:pointer;transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease}
.icon-btn:hover{transform:translateY(-1px)}
.icon-btn svg{width:18px;height:18px;fill:currentColor}
.icon-btn--soft{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#fff}
.icon-btn--primary{background:linear-gradient(135deg,#3d7bff,#1644c2);box-shadow:0 10px 24px rgba(61,123,255,.24);color:#fff}
.icon-btn--danger{background:linear-gradient(135deg,#df4c4c,#a51919);box-shadow:0 10px 24px rgba(223,76,76,.2);color:#fff}
.table-user{display:grid;gap:4px}
.table-user strong{font-size:.98rem}
.table-user span{color:var(--muted);font-size:.9rem}
.subscription-expiry-form{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:nowrap}
.subscription-expiry-input{width:148px;min-height:40px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#eef4ff;padding:0 10px;font:inherit}
.subscription-expiry-input:focus{outline:none;border-color:rgba(120,178,255,.44);box-shadow:0 0 0 3px rgba(61,123,255,.2)}
.subscription-expiry-save{display:inline-flex;align-items:center;justify-content:center;gap:0;width:40px;height:40px;padding:0;border:none;border-radius:12px;background:linear-gradient(135deg,#3d7bff,#1644c2);box-shadow:0 10px 24px rgba(61,123,255,.24);color:#fff;cursor:pointer;transition:transform .18s ease,filter .18s ease}
.subscription-expiry-save:hover{transform:translateY(-1px);filter:brightness(1.06)}
.subscription-expiry-save svg{width:16px;height:16px;fill:currentColor;flex:0 0 auto}
.copy-field{display:flex;align-items:center;gap:10px;max-width:100%}
.copy-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;max-width:100%;min-height:42px;padding:10px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:#eef4ff;cursor:pointer;transition:.18s ease;font-weight:700;text-align:left}
.copy-btn:hover,.copy-btn.is-copied{background:rgba(61,123,255,.16);border-color:rgba(94,163,255,.28)}
.copy-btn svg{width:18px;height:18px;fill:currentColor;flex:0 0 auto}
.copy-btn span{min-width:0;overflow-wrap:anywhere}
.copy-btn--hero{width:100%;justify-content:flex-start;min-height:50px;padding:12px 16px;border-color:rgba(94,163,255,.24);background:linear-gradient(135deg,rgba(61,123,255,.18),rgba(16,33,66,.88));box-shadow:0 14px 30px rgba(23,107,255,.18)}
.copy-btn--hero:hover,.copy-btn--hero.is-copied{background:linear-gradient(135deg,rgba(61,123,255,.26),rgba(16,33,66,.96));border-color:rgba(120,178,255,.34)}
.copy-spotlight{display:grid;gap:12px;padding:18px;border-radius:22px;border:1px solid rgba(94,163,255,.18);background:linear-gradient(180deg,rgba(61,123,255,.1),rgba(255,255,255,.03))}
.copy-spotlight__head{display:grid;gap:6px}
.copy-spotlight__eyebrow{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#8fb4ff}
.copy-spotlight__note{margin:0}
.modal-shell{position:fixed;inset:0;z-index:110;display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .26s ease,visibility .26s ease}
.modal-shell.is-open,.modal-shell.is-closing{visibility:visible}
.modal-shell.is-open{opacity:1;pointer-events:auto}
.modal-shell__overlay{position:absolute;inset:0;background:rgba(4,8,15,.72);backdrop-filter:blur(6px);opacity:0;transition:opacity .26s ease}
.modal-card{position:relative;z-index:1;width:min(720px,calc(100vw - 32px));max-height:calc(100vh - 48px);overflow:auto;opacity:0;transform:translateY(24px) scale(.96);transition:opacity .28s cubic-bezier(.2,.8,.2,1),transform .28s cubic-bezier(.2,.8,.2,1)}
.modal-card{background:#0f1622;border-color:rgba(255,255,255,.08)}
.modal-shell.is-open .modal-shell__overlay{opacity:1}
.modal-shell.is-open .modal-card{opacity:1;transform:translateY(0) scale(1)}
.modal-shell.is-closing .modal-shell__overlay{opacity:0}
.modal-shell.is-closing .modal-card{opacity:0;transform:translateY(18px) scale(.975)}
.modal-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}
.modal-card__close{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:#eef4ff;font-size:24px;line-height:1;cursor:pointer}
.modal-card__close:hover{background:rgba(61,123,255,.12);border-color:rgba(94,163,255,.18)}
body.modal-open{overflow:hidden}
.dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
.dashboard-card{display:flex;flex-direction:column;gap:16px;height:100%}
.dashboard-card[id]{scroll-margin-top:110px}
.dashboard-card .kv-list,.dashboard-card .feature-list{margin:0}
.dashboard-card .table-wrap{flex:1 1 auto}
.dashboard-card__footer{margin-top:auto}
.dashboard-card--wide{gap:18px}
.subscription-hero__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.info-card{display:grid;gap:8px;padding:16px 18px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03)}
.info-card--full{grid-column:1 / -1}
.info-card__label{color:var(--muted);font-size:.9rem;line-height:1.4}
.info-card__value{font-size:1.02rem;line-height:1.45;color:#eef4ff;letter-spacing:-.01em}
.toast-stack{position:fixed;right:18px;bottom:18px;z-index:90;display:grid;gap:10px;pointer-events:none}
.toast{min-width:min(320px,calc(100vw - 32px));max-width:min(360px,calc(100vw - 32px));padding:14px 16px;border-radius:16px;border:1px solid rgba(255,255,255,.12);background:rgba(11,17,25,.96);box-shadow:0 18px 42px rgba(0,0,0,.28);color:#eef4ff;opacity:0;transform:translateY(10px);transition:opacity .22s ease,transform .22s ease}
.toast.is-visible{opacity:1;transform:translateY(0)}
.toast--success{border-color:rgba(34,197,94,.24);background:linear-gradient(180deg,rgba(14,24,19,.98),rgba(13,34,23,.96));color:#dff7e8}
.toast--error{border-color:rgba(239,68,68,.26);background:linear-gradient(180deg,rgba(34,14,14,.98),rgba(44,16,16,.96));color:#ffe1e1}
@media (max-width: 1100px){
  .nav-toggle{display:inline-flex}
  .layout-grid{grid-template-columns:1fr}
  .sidebar{position:fixed;top:0;left:0;bottom:0;width:min(86vw,320px);max-height:none;z-index:60;border-radius:0 24px 24px 0;transform:translateX(-105%);transition:transform .22s ease;padding-top:22px;background:#0f1622;border-color:rgba(255,255,255,.08)}
  .sidebar.is-open{transform:translateX(0)}
  .sidebar__close{display:inline-flex;align-items:center;justify-content:center}
  .sidebar-overlay{position:fixed;inset:0;background:rgba(3,7,14,.62);backdrop-filter:blur(3px);z-index:50;opacity:0;pointer-events:none;transition:opacity .2s ease;display:block}
  .sidebar-overlay.is-open{opacity:1;pointer-events:auto}
  body.sidebar-open{overflow:hidden}
}
@media (max-width: 960px){
  .nav{flex-wrap:nowrap;gap:12px}
  .nav-links{width:auto;justify-content:flex-end;flex:0 0 auto;min-width:0}
  .brand__text{font-size:.98rem}
  .section{padding:34px 0 56px}
  .status-card,.auth-card,.card-pad,.stat-card{padding:22px}
  .table th,.table td{padding:11px 8px}
  .profile-menu__toggle{width:44px;min-width:44px;padding:0;justify-content:center}
  .profile-menu__label{display:none}
  .profile-menu__dropdown{right:0;min-width:170px}
  .copy-field{align-items:flex-start}
  .copy-btn{width:100%;justify-content:flex-start}
  .wizard-progress{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
  .wizard-progress__step{justify-content:center;min-height:52px;padding:0}
  .wizard-progress__text{display:none}
  .wizard-progress__index{flex:0 0 32px;width:32px;height:32px}
  .modal-shell{padding:16px}
  .modal-card{width:100%;max-height:calc(100vh - 32px);border-radius:22px}
  .toast-stack{left:auto;right:16px;bottom:16px}
  .dashboard-grid{grid-template-columns:1fr}
  .info-grid{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .form-footer{flex-direction:column;align-items:stretch}
  .form-actions{width:100%}
  .form-actions .btn{width:100%}
  .icon-actions{gap:8px}
}
@media (max-width: 820px){
  .section-head{display:grid;gap:10px}
  .section-head h1{font-size:clamp(1.7rem,8vw,2.4rem)}
  .hero-actions,.wizard-actions,.form-actions{grid-template-columns:1fr}
  .wizard-actions{flex-direction:column}
  .wizard-actions .btn{width:100%}
  .payment-next-action .btn{width:auto}
  .btn--pay-wide{min-width:0;padding-inline:18px}
  .pay-result__actions--split{flex-direction:column;align-items:stretch}
  .pay-result__actions--split .btn,.pay-result__actions--split .inline-form,.pay-result__actions--split .inline-form .btn{width:100%}
  .table-wrap{overflow:visible}
  .table--responsive thead{display:none}
  .table--responsive tbody{display:grid;gap:12px}
  .table--responsive tr{display:block;padding:14px 16px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(255,255,255,.03)}
  .table--responsive td{display:grid;grid-template-columns:minmax(92px,38%) 1fr;gap:12px;align-items:start;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.06)}
  .table--responsive td:last-child{border-bottom:none;padding-bottom:0}
  .table--responsive td::before{content:attr(data-label);color:var(--muted);font-size:.88rem;font-weight:700;line-height:1.4}
  .table--responsive td.actions-cell{display:block;width:auto;white-space:normal}
  .table--responsive td.actions-cell::before{display:block;margin-bottom:10px}
  .table--responsive .icon-actions,.table--responsive .form-actions{justify-content:flex-start}
  .table--responsive .subscription-expiry-form{justify-content:flex-start}
  .table--responsive .table-user{gap:6px}
  .body--admin .nav-toggle,
  .body--dashboard .nav-toggle{display:none}
  .body--admin .section,
  .body--dashboard .section{padding-bottom:120px}
  .body--admin .sidebar-overlay,
  .body--dashboard .sidebar-overlay{display:none!important}
  .body--admin .layout-grid,
  .body--dashboard .layout-grid{display:block}
  .body--admin .sidebar,
  .body--dashboard .sidebar{position:fixed;top:auto;left:0;right:0;bottom:0;width:100%;max-height:none;z-index:65;transform:none;border-radius:24px 24px 0 0;padding:10px 10px calc(10px + env(safe-area-inset-bottom));background:rgba(12,18,28,.96);border:1px solid rgba(255,255,255,.08);border-bottom:none;box-shadow:0 -10px 36px rgba(0,0,0,.24);backdrop-filter:blur(18px)}
  .body--admin .sidebar__head,
  .body--admin .sidebar__footer,
  .body--dashboard .sidebar__head,
  .body--dashboard .sidebar__footer{display:none}
  .body--admin .sidebar__nav,
  .body--dashboard .sidebar__nav{grid-template-columns:repeat(var(--sidebar-link-count, 4),minmax(0,1fr));gap:8px;width:100%}
  .body--admin .sidebar__link,
  .body--dashboard .sidebar__link{flex-direction:column;justify-content:center;gap:8px;min-height:74px;width:100%;padding:10px 6px;border-radius:20px;text-align:center;font-size:.74rem;line-height:1.15}
  .body--admin .sidebar__link-icon,
  .body--dashboard .sidebar__link-icon{flex-basis:24px;width:24px;height:24px}
  .body--admin .sidebar__link-icon svg,
  .body--dashboard .sidebar__link-icon svg{width:24px;height:24px}
  .body--admin .sidebar__link-label,
  .body--dashboard .sidebar__link-label{white-space:normal}
  .body--dashboard .sidebar__link--support-mobile{display:flex}
  .body--admin .content-area,
  .body--dashboard .content-area{padding-bottom:0}
  .body--admin .toast-stack,
  .body--dashboard .toast-stack{left:auto;right:16px;bottom:calc(108px + env(safe-area-inset-bottom))}
}
@media (max-width: 560px){
  .nav-left{min-width:0}
  .brand{min-width:0}
  .brand__text{font-size:.92rem;white-space:nowrap}
  .status-card,.auth-card,.card-pad,.stat-card{padding:18px}
  .sidebar{width:min(92vw,340px)}
  .sidebar__link{min-height:46px;padding:0 12px}
  .body--admin .sidebar,
  .body--dashboard .sidebar{left:0;right:0;bottom:0;width:100%;padding:8px 8px calc(8px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0}
  .body--admin .sidebar__nav,
  .body--dashboard .sidebar__nav{gap:6px}
  .body--admin .sidebar__link,
  .body--dashboard .sidebar__link{min-height:68px;padding:8px 4px;border-radius:18px;font-size:.7rem}
  .body--admin .toast-stack,
  .body--dashboard .toast-stack{left:auto;right:12px;bottom:calc(96px + env(safe-area-inset-bottom))}
  .modal-shell{padding:10px}
  .modal-card{max-height:calc(100vh - 20px)}
}
.hp-field {
    position: absolute !important;
    left: -10000px !important;
    top: auto !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}