/* AiBD CMS — Midnight Indigo theme (v1.0.0) */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }

:root {
  --bg:        #0a0a1a;
  --bg-2:      #141432;
  --bg-3:      #1b1b46;
  --border:    #1e1e5a;
  --border-2:  #2a2a6e;
  --primary:   #4f46e5;
  --primary-2: #6366f1;
  --primary-glow: rgba(79,70,229,0.45);
  --accent:    #818cf8;
  --success:   #4ade80;
  --warning:   #f59e0b;
  --danger:    #ef4444;
  --text:      #cbd5e1;
  --text-dim:  #94a3b8;
  --text-mute: #64748b;
  --white:     #ffffff;
  --font-h:    'Space Grotesk', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --font-b:    'DM Sans', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --shadow-md: 0 10px 30px -10px rgba(79,70,229,0.4);
}
body {
  background: var(--bg); color: var(--text); font-family: var(--font-b);
  font-size: 15px; line-height: 1.6; min-height: 100vh; overflow-x: hidden; position: relative;
}
body::before {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(900px 500px at 12% -8%, rgba(79,70,229,0.18), transparent 60%),
    radial-gradient(700px 500px at 100% 110%, rgba(30,30,90,0.55), transparent 60%);
}
main, header, footer, section { position: relative; z-index: 1; }
a { color: var(--accent); text-decoration: none; transition: color .15s ease; }
a:hover { color: var(--white); }
h1, h2, h3, h4 { font-family: var(--font-h); color: var(--white); margin: 0 0 .5em; letter-spacing: -0.02em; }
h1 { font-size: clamp(2rem, 5vw, 3.5rem); line-height: 1.05; font-weight: 700; }
h2 { font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 700; }
h3 { font-size: 1.15rem; font-weight: 600; }
p { margin: 0 0 1em; }
img { max-width: 100%; height: auto; display: block; }
ul { padding-left: 20px; }

.container { max-width: 1120px; margin: 0 auto; padding: 0 20px; }
@media (min-width: 768px) { .container { padding: 0 32px; } }

/* Navbar */
.nav {
  display: grid; grid-template-columns: minmax(0,1fr) auto;
  align-items: center; gap: 16px;
  max-width: 1120px; margin: 0 auto; padding: 20px;
}
@media (min-width: 768px) { .nav { padding: 20px 32px; } }
.nav .brand { display: flex; align-items: center; gap: 12px; min-width: 0; color: var(--white); }
.nav .brand img {
  width: 56px; height: 56px; border-radius: 14px;
  background: linear-gradient(135deg, rgba(139,92,246,.18), rgba(34,211,238,.14));
  padding: 5px;
  box-shadow: 0 8px 22px -10px rgba(139,92,246,.55), inset 0 0 0 1px rgba(255,255,255,.06);
  transition: transform .2s ease, box-shadow .2s ease;
}
.nav .brand:hover img { transform: translateY(-1px) scale(1.03); box-shadow: 0 12px 28px -10px rgba(34,211,238,.55), inset 0 0 0 1px rgba(255,255,255,.08); }
@media (min-width: 768px){ .nav .brand img { width: 64px; height: 64px; } }
.nav .brand-name { font-family: var(--font-h); font-weight: 700; font-size: 1.1rem; color: var(--white); }
@media (min-width: 768px){ .nav .brand-name { font-size: 1.25rem; } }
.nav .brand-name span { color: var(--accent); }
.nav .brand-tag { font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--text-mute); }

/* Inline brand mark for section headings */
.brand-mark{
  display:inline-block; vertical-align:-0.18em;
  width:1.1em; height:1.1em; margin-right:.35em; border-radius:.28em;
  background: linear-gradient(135deg, rgba(139,92,246,.22), rgba(34,211,238,.18));
  padding:.12em; object-fit:contain;
  box-shadow: 0 6px 18px -8px rgba(139,92,246,.55), inset 0 0 0 1px rgba(255,255,255,.08);
}
.brand-mark-lg{ width:1.35em; height:1.35em; vertical-align:-0.28em; }
.nav nav { display: flex; align-items: center; gap: 12px; font-size: 13px; font-weight: 500; }
@media (min-width: 768px) { .nav nav { gap: 24px; font-size: 14px; } }
.nav nav a { color: var(--text-dim); }
.nav nav a:hover { color: var(--white); }
@media (max-width: 640px) { .nav nav a.hide-sm { display: none; } }

/* === Site header nav (Home / Features / Extensions / Pricing / Docs / Community) === */
.site-header { position: sticky; top: 0; z-index: 60; backdrop-filter: blur(10px);
  background: color-mix(in oklab, var(--bg) 78%, transparent);
  border-bottom: 1px solid color-mix(in oklab, var(--border) 70%, transparent); }
.site-header .nav { grid-template-columns: auto 1fr auto; }
.site-nav { display: flex; align-items: center; gap: 22px; font-size: 14px; font-weight: 500; justify-content: flex-end; }
.site-nav a { color: var(--text-dim); position: relative; padding: 6px 2px; transition: color .18s ease; }
.site-nav a:hover { color: #fff; }
.site-nav a::after { content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px; border-radius:2px;
  background: linear-gradient(90deg,#8b5cf6,#22d3ee); transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
.site-nav a:hover::after { transform: scaleX(1); }
.site-nav .site-nav-cta { display: inline-flex; gap: 10px; margin-left: 8px; padding-left: 18px;
  border-left: 1px solid color-mix(in oklab, var(--border) 80%, transparent); }
.site-nav .site-nav-cta a::after { display:none; }

.nav-burger { display: none; width: 42px; height: 42px; border-radius: 12px; background: rgba(255,255,255,.04);
  border: 1px solid var(--border); position: relative; cursor: pointer; }
.nav-burger span { position:absolute; left:10px; right:10px; height:2px; border-radius:2px; background:#fff;
  transition: transform .25s ease, opacity .2s ease, top .25s ease; }
.nav-burger span:nth-child(1){ top:13px; }
.nav-burger span:nth-child(2){ top:20px; }
.nav-burger span:nth-child(3){ top:27px; }
.nav-burger.is-x span:nth-child(1){ top:20px; transform: rotate(45deg); }
.nav-burger.is-x span:nth-child(2){ opacity:0; }
.nav-burger.is-x span:nth-child(3){ top:20px; transform: rotate(-45deg); }
.nav-scrim { display:none; }
body.nav-lock { overflow: hidden; }

@media (max-width: 900px) {
  .site-header { backdrop-filter: none; -webkit-backdrop-filter: none; background: #0a0a1a; }
  .nav-burger { display: block; justify-self: end; margin-left: auto; grid-column: 2; z-index: 80; }
  .site-header .nav { grid-template-columns: minmax(0,1fr) auto; }
  .site-nav { position: fixed; top: 0; right: 0; bottom: auto; width: min(84vw, 340px); height: 100vh; height: 100dvh; max-height: 100vh; max-height: 100dvh;
    flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 4px;
    padding: 84px 20px calc(28px + env(safe-area-inset-bottom)); overflow-y: auto;
    background: #0c0c22; background-image: linear-gradient(180deg, #10102c, #08081a);
    border-left: 1px solid var(--border); box-shadow: -30px 0 60px -20px rgba(0,0,0,.7);
    transform: translateX(100%); transition: transform .32s cubic-bezier(.2,.7,.2,1); z-index: 70; }
  .site-nav.is-open { transform: translateX(0); }
  .site-nav a { display: flex; align-items: center; padding: 14px 14px; border-radius: 12px;
    font-size: 15px; font-weight: 600; color: #f2f2ff; border: 1px solid transparent; }
  .site-nav a:hover, .site-nav a:active { background: rgba(139,92,246,.14); border-color: rgba(139,92,246,.28); color: #fff; }
  .site-nav a::after { display: none; }
  .site-nav .site-nav-cta { margin: 10px 0 0; padding: 14px 0 0; border-left: 0;
    border-top: 1px solid var(--border); flex-direction: column; gap: 10px; }
  .site-nav .site-nav-cta a { justify-content: center; }
  .site-header:has(.site-nav.is-open) .nav-scrim,
  .nav-scrim.is-open { display:block; position:fixed; inset:0; background: rgba(4,4,16,.55);
    backdrop-filter: blur(4px); z-index: 65; }
}
@media (prefers-reduced-motion: reduce) {
  .site-nav { transition: none; }
  .site-nav a::after { transition: none; }
}

/* Buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 20px; border-radius: 12px; font-weight: 600; font-size: 14px;
  font-family: var(--font-b); cursor: pointer; border: 1px solid transparent;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
  text-decoration: none; white-space: nowrap; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { background: var(--primary); color: var(--white); box-shadow: 0 10px 30px -10px var(--primary-glow); }
.btn-primary:hover { background: var(--primary-2); color: var(--white); }
.btn-ghost { background: transparent; color: var(--white); border-color: var(--border); }
.btn-ghost:hover { border-color: var(--primary); background: rgba(79,70,229,0.10); }
.btn-sm { padding: 8px 14px; font-size: 13px; border-radius: 10px; }
.btn-block { display: flex; width: 100%; }

/* Badges & pills */
.pill { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px;
  border: 1px solid var(--border); background: rgba(10,10,26,0.6);
  font-size: 11px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--text-dim); }
.pill .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--success); animation: pulse 2s ease-in-out infinite; }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .4; } }
.badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 600; letter-spacing: .05em;
  background: rgba(129,140,248,0.15); color: var(--accent); border: 1px solid rgba(129,140,248,0.3); }
.badge-new  { background: rgba(74,222,128,0.15);  color: var(--success); border-color: rgba(74,222,128,0.3); }
.badge-best { background: rgba(245,158,11,0.15); color: var(--warning); border-color: rgba(245,158,11,0.3); }

/* Cards */
.card { position: relative; overflow: hidden; background: var(--bg-2); border: 1px solid var(--border);
  border-radius: 20px; padding: 24px; transition: border-color .2s ease, transform .2s ease; }
.card:hover { border-color: var(--border-2); transform: translateY(-2px); }
.card h3 { color: var(--white); margin-bottom: 8px; }
.card p  { color: var(--text-dim); font-size: 14px; margin: 0; }

/* Bento */
.hero-wrap { padding: 8px 0 48px; }
@media (min-width: 768px) { .hero-wrap { padding: 8px 0 80px; } }
.bento { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 900px) {
  .bento { grid-template-columns: repeat(12, 1fr); }
  .b-hero  { grid-column: span 8; }
  .b-side  { grid-column: span 4; }
  .b-half  { grid-column: span 6; }
  .b-third { grid-column: span 4; }
}
.hero { position: relative; padding: 40px; border-radius: 24px; background: var(--bg-2); border: 1px solid var(--border); overflow: hidden; }
@media (min-width: 768px) { .hero { padding: 56px; } }
.hero::after { content: ""; position: absolute; top: -100px; right: -100px; width: 280px; height: 280px;
  border-radius: 50%; background: var(--primary-glow); filter: blur(60px); pointer-events: none; }
.hero h1 span { color: var(--accent); }
.hero p { color: var(--text-dim); max-width: 32em; font-size: 1.05rem; margin-top: 20px; }
.hero .cta { display: flex; gap: 12px; margin-top: 32px; flex-wrap: wrap; }

/* Stat mini */
.stat { background: var(--bg-2); border: 1px solid var(--border); border-radius: 20px; padding: 24px; }
.stat .k { font-family: var(--font-h); font-size: 2rem; font-weight: 700; color: var(--white); }
.stat .v { font-size: 12px; text-transform: uppercase; letter-spacing: .15em; color: var(--text-mute); }

/* Product grid */
.products { display: grid; grid-template-columns: 1fr; gap: 16px; margin-top: 24px; }
@media (min-width: 640px)  { .products { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .products { grid-template-columns: repeat(4, 1fr); } }
.product { display: flex; flex-direction: column; gap: 12px; }
.product .icon { width: 48px; height: 48px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
  font-family: var(--font-h); font-weight: 700; font-size: 1.1rem; color: var(--white); }
.product .icon.vec  { background: linear-gradient(135deg, #f97316, #f59e0b); }
.product .icon.vec2 { background: linear-gradient(135deg, #10b981, #14b8a6); }
.product .icon.idg  { background: linear-gradient(135deg, #3b82f6, #6366f1); }
.product .icon.png  { background: linear-gradient(135deg, #059669, #10b981); }

/* Section head */
.section-head { margin: 64px 0 24px; }
.section-head .eyebrow { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin-bottom: 8px; }

/* Feature list */
.features { display: grid; grid-template-columns: 1fr; gap: 12px; padding: 0; margin: 20px 0; list-style: none; }
.features li { display: flex; align-items: flex-start; gap: 10px; color: var(--text-dim); font-size: 14px; }
.features li::before { content: ""; flex-shrink: 0; width: 6px; height: 6px; border-radius: 50%;
  background: var(--primary); margin-top: 8px; box-shadow: 0 0 0 4px rgba(79,70,229,.15); }

/* Pricing */
.plans { display: grid; grid-template-columns: 1fr; gap: 20px; margin: 32px 0 64px; }
@media (min-width: 720px)  { .plans { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1080px) { .plans { grid-template-columns: repeat(3, 1fr); } }
.plan { position: relative; overflow: hidden; background: var(--bg-2); border: 1px solid var(--border);
  border-radius: 22px; padding: 28px; display: flex; flex-direction: column; }
.plan::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px;
  background: linear-gradient(90deg, var(--tint-a, var(--primary)), var(--tint-b, var(--accent))); }
.plan .name { color: var(--white); font-family: var(--font-h); font-weight: 600; font-size: 1.05rem; margin-top: 12px; }
.plan .price { display: flex; align-items: baseline; gap: 6px; margin: 14px 0 4px; }
.plan .price .amt { font-family: var(--font-h); font-size: 2.6rem; font-weight: 700; color: var(--white); }
.plan .price .cur { color: var(--text-dim); font-size: 1rem; }
.plan .period { font-size: 12px; text-transform: uppercase; letter-spacing: .15em; color: var(--text-mute); }
.plan .features { flex: 1; }
.plan .btn { margin-top: auto; }
.plan-badge { position: absolute; top: 20px; right: 20px; }

/* Forms & flashes */
.form-card { max-width: 460px; margin: 48px auto; padding: 32px; background: var(--bg-2);
  border: 1px solid var(--border); border-radius: 20px; }
.form-card h1 { font-size: 1.75rem; margin-bottom: 8px; }
.form-card .muted { color: var(--text-mute); margin-bottom: 24px; font-size: 14px; }
.field { margin-bottom: 16px; }
.field label { display: block; margin-bottom: 6px; font-size: 13px; font-weight: 500; color: var(--text-dim); }
.field input, .field textarea, .field select {
  width: 100%; padding: 12px 14px; background: var(--bg); color: var(--white);
  border: 1px solid var(--border); border-radius: 10px; font-size: 14px; font-family: var(--font-b);
  transition: border-color .15s ease, box-shadow .15s ease; }
.field input:focus, .field textarea:focus, .field select:focus {
  outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(79,70,229,.2); }
.flash { padding: 12px 16px; border-radius: 10px; margin: 16px auto; max-width: 1120px; font-size: 14px;
  border: 1px solid var(--border); background: var(--bg-2); }
.flash-success { border-color: rgba(74,222,128,.4); color: var(--success); background: rgba(74,222,128,.08); }
.flash-error   { border-color: rgba(239,68,68,.4);  color: var(--danger);  background: rgba(239,68,68,.08); }
.flash-info    { border-color: rgba(129,140,248,.4); color: var(--accent);  background: rgba(129,140,248,.08); }

/* Footer */
.footer { border-top: 1px solid var(--border); margin-top: 64px; padding: 32px 20px;
  color: var(--text-mute); font-size: 13px; display: flex; flex-wrap: wrap; gap: 12px;
  justify-content: space-between; align-items: center; max-width: 1120px; margin-left: auto; margin-right: auto; }
.footer a { color: var(--text-dim); }
.footer a:hover { color: var(--white); }

/* Utility */
.text-dim { color: var(--text-dim); }
.text-mute { color: var(--text-mute); }
.text-white { color: var(--white); }
.mono { font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace; }
/* === Stage 5: dashboard / admin / checkout === */
.stack{display:grid;gap:12px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:nowrap}
.row-wrap{flex-wrap:wrap}
label{display:grid;gap:6px;color:var(--text-mute);font-size:.9rem}
input[type=text],input[type=email],input[type=password],input[type=search],input[type=number],select,textarea{
  background:var(--surface-2);border:1px solid var(--border);color:var(--text);
  padding:10px 12px;border-radius:10px;font:inherit;width:100%;
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in oklab,var(--accent) 25%,transparent)}
code{font-family:'JetBrains Mono',monospace;background:var(--surface-2);border:1px solid var(--border);padding:2px 8px;border-radius:6px;color:var(--accent)}

.table-wrap{overflow-x:auto}
.table{width:100%;border-collapse:collapse;font-size:.92rem}
.table th,.table td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--border)}
.table th{color:var(--text-mute);font-weight:600;text-transform:uppercase;font-size:.72rem;letter-spacing:.06em}
.table tr:hover td{background:rgba(255,255,255,.02)}

.badge-status-paid,.badge-status-active,.badge-status-open{background:color-mix(in oklab,var(--accent) 25%,transparent);color:var(--accent);border-color:transparent}
.badge-status-pending{background:rgba(245,158,11,.18);color:#fbbf24;border-color:transparent}
.badge-status-failed,.badge-status-closed,.badge-status-refunded{background:rgba(239,68,68,.18);color:#fca5a5;border-color:transparent}

.license-card{display:grid;gap:12px}
.license-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}
.license-key{display:flex;gap:8px;align-items:center}
.license-key code{flex:1;padding:12px 14px;font-size:1rem;letter-spacing:.05em}

.ticket-row{display:flex;justify-content:space-between;align-items:center;text-decoration:none}
.thread{display:grid;gap:14px}
.msg{padding:12px 14px;border-radius:10px;background:var(--surface-2);border:1px solid var(--border)}
.msg-admin{border-left:3px solid var(--accent)}
.msg-user{border-left:3px solid #94a3b8}
.msg-meta{font-size:.75rem;color:var(--text-mute);margin-bottom:6px}
.msg-body{white-space:pre-wrap;color:var(--text)}

.steps{padding-left:20px;margin:16px 0;color:var(--text-mute);line-height:1.9}
.steps li{margin-bottom:6px}

.admin-nav{display:flex;gap:6px;flex-wrap:wrap;padding:10px;margin-bottom:20px}
.admin-nav a{padding:8px 14px;border-radius:8px;color:var(--text-mute);text-decoration:none;font-weight:500;font-size:.9rem}
.admin-nav a:hover{background:var(--surface-2);color:var(--text)}
.admin-nav a.active{background:var(--accent);color:#fff}
.admin-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-bottom:24px}
.admin-tabs{display:flex;gap:6px;margin-bottom:16px}
.admin-tabs a{padding:6px 14px;border:1px solid var(--border);border-radius:999px;color:var(--text-mute);text-decoration:none;text-transform:capitalize;font-size:.85rem}
.admin-tabs a.active{background:var(--accent);color:#fff;border-color:transparent}

.plan-badge{position:absolute;top:12px;right:12px}
.btn-block{width:100%;justify-content:center}

@media (max-width:640px){
  .license-head{flex-direction:column;align-items:flex-start}
  .row{flex-wrap:wrap}
  .table th,.table td{padding:8px 6px;font-size:.85rem}
}

/* ===================== Auth pages (login/register/forgot/reset) ===================== */
.page-auth\/login main,
.page-auth\/forgot main,
.page-auth\/reset main { padding: 0; }

.auth-shell{
  position:relative; min-height: calc(100vh - 96px);
  display:flex; align-items:stretch; justify-content:center;
  padding: 16px; overflow:hidden;
}
@media (min-width: 640px){ .auth-shell{ padding: 24px; } }
.auth-shell::before,
.auth-shell::after{
  content:""; position:absolute; border-radius:50%; filter: blur(90px); pointer-events:none; z-index:0;
}
.auth-shell::before{ width:520px; height:520px; top:-160px; left:-120px; background: rgba(79,70,229,.35); }
.auth-shell::after { width:420px; height:420px; bottom:-140px; right:-100px; background: rgba(129,140,248,.22); }
.auth-shell-compact{ min-height: calc(100vh - 96px); }

.auth-grid{
  position:relative; z-index:1;
  width:100%; max-width:1080px; min-width:0;
  display:grid; grid-template-columns: 1fr; gap: 0;
  border-radius: 20px; overflow:hidden;
  border:1px solid var(--border);
  background: linear-gradient(180deg, rgba(20,20,50,.85), rgba(10,10,26,.85));
  box-shadow: 0 40px 80px -30px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.02) inset;
  backdrop-filter: blur(14px);
}
@media (min-width: 640px){ .auth-grid{ border-radius: 28px; } }
@media (min-width: 900px){
  .auth-grid{ grid-template-columns: 1.05fr 1fr; min-height: 620px; }
}

/* ---- Brand side ---- */
.auth-brand{
  display:none;
  position:relative;
  padding: 40px 44px;
  background:
    radial-gradient(600px 300px at 10% 10%, rgba(99,102,241,.35), transparent 60%),
    radial-gradient(500px 400px at 90% 90%, rgba(30,30,90,.7), transparent 60%),
    linear-gradient(160deg, #14143d 0%, #0d0d28 100%);
  color: var(--white);
  flex-direction:column; justify-content:space-between;
  border-right: 1px solid rgba(255,255,255,.06);
}
@media (min-width: 900px){ .auth-brand{ display:flex; } }
.auth-brand::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 32px 32px;
  mask-image: radial-gradient(ellipse at center, #000 40%, transparent 80%);
}
.auth-brand > *{ position:relative; z-index:1; }
.auth-logo{ display:inline-flex; align-items:center; gap:12px; color:var(--white); }
.auth-logo img{ width:40px; height:40px; border-radius:10px; background: rgba(255,255,255,.06); padding: 3px; }
.auth-logo span{ font-family: var(--font-h); font-weight:700; font-size:1.15rem; letter-spacing:-.02em; }
.auth-logo span b{ color: var(--accent); font-weight:700; }
.auth-eyebrow{
  display:inline-block; margin-bottom:18px;
  padding: 5px 12px; border-radius:999px;
  background: rgba(129,140,248,.14); border:1px solid rgba(129,140,248,.28);
  color: var(--accent); font-size:11px; font-weight:600; letter-spacing:.22em; text-transform:uppercase;
}
.auth-brand-body h1{
  font-size: clamp(1.75rem, 3.2vw, 2.35rem); line-height:1.15; margin: 0 0 16px;
}
.auth-brand-body h1 span{
  background: linear-gradient(90deg, #a5b4fc, #818cf8);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.auth-brand-body p{ color: rgba(203,213,225,.85); max-width: 34ch; font-size:.98rem; }
.auth-points{ list-style:none; padding:0; margin:22px 0 0; display:grid; gap:12px; }
.auth-points li{ display:flex; align-items:center; gap:12px; color: rgba(226,232,240,.9); font-size:.92rem; }
.auth-points li em{
  flex-shrink:0; width:18px; height:18px; border-radius:50%;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  display:inline-block; position:relative;
}
.auth-points li em::after{
  content:""; position:absolute; inset:0; border-radius:50%;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center / 11px 11px no-repeat;
}
.auth-brand-foot{ display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:12px; color: rgba(148,163,184,.9); }
.auth-mark{ display:inline-flex; align-items:center; gap:8px; }
.auth-mark .dot{ width:8px; height:8px; border-radius:50%; background: var(--success); box-shadow: 0 0 0 4px rgba(74,222,128,.15); animation: pulse 2s ease-in-out infinite; }
.auth-mark.muted{ color: rgba(100,116,139,.9); }

/* ---- Form side ---- */
.auth-panel{
  min-width:0;
  padding: 28px 18px;
  display:flex; flex-direction:column; gap: 22px;
  background: rgba(10,10,26,.55);
}
@media (min-width: 640px){ .auth-panel{ padding: 44px 44px; } }
.auth-panel-solo{
  max-width: 460px; width:100%;
  border-radius: 24px; border:1px solid var(--border);
  background: linear-gradient(180deg, rgba(20,20,50,.85), rgba(10,10,26,.85));
  box-shadow: 0 40px 80px -30px rgba(0,0,0,.7);
  backdrop-filter: blur(14px);
  position:relative; z-index:1;
  align-self:center;
}
.auth-mobile-logo{
  display:flex; align-items:center; gap:10px; color:var(--white);
  margin-bottom: 4px;
}
.auth-mobile-logo img{ width:34px; height:34px; border-radius:9px; background:rgba(255,255,255,.06); padding:3px; }
.auth-mobile-logo span{ font-family:var(--font-h); font-weight:700; }
.auth-mobile-logo span b{ color:var(--accent); }
@media (min-width: 900px){ .auth-panel .auth-mobile-logo{ display:none; } }
/* Solo card variant always shows brand logo at top, on every viewport */
.auth-panel-solo .auth-mobile-logo{ display:flex !important; justify-content:center; }
.auth-mobile-logo-lg{ flex-direction:column; gap:8px; margin: 0 auto 6px; text-align:center; }
.auth-mobile-logo-lg img{ width:52px; height:52px; border-radius:14px; }
.auth-mobile-logo-lg span{ font-size:1.15rem; letter-spacing:-.02em; }

.auth-tabs{
  position:relative;
  display:grid; grid-template-columns: 1fr 1fr;
  background: rgba(10,10,26,.7);
  border:1px solid var(--border);
  border-radius: 12px; padding: 4px; gap:0;
}
.auth-tab{
  position:relative; z-index:1;
  background:transparent; border:0; cursor:pointer;
  padding: 10px 14px; font: 600 13px/1 var(--font-b);
  color: var(--text-dim); border-radius: 9px;
  transition: color .2s ease;
}
.auth-tab.active{ color: var(--white); }
.auth-tab-indicator{
  position:absolute; top:4px; bottom:4px; left:4px;
  width: calc(50% - 4px);
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  border-radius: 9px;
  box-shadow: 0 8px 20px -8px var(--primary-glow);
  transition: transform .28s cubic-bezier(.4,0,.2,1);
  z-index:0;
}
.auth-tab:nth-of-type(2).active ~ .auth-tab-indicator{ transform: translateX(100%); }

.auth-form{ display:flex; flex-direction:column; gap:16px; }
.auth-head h2{ font-size: 1.55rem; margin:0 0 6px; }
.auth-head p{ margin:0; color: var(--text-dim); font-size:.92rem; }

.auth-field{ display:flex; flex-direction:column; gap:6px; min-width:0; justify-content:flex-end; }
.auth-field > label,
.auth-label-row label{
  font-size: 12px; font-weight:600; letter-spacing:.06em;
  text-transform: uppercase; color: var(--text-dim);
  margin:0;
}
.auth-field > label,
.auth-label-row{
  display:flex; align-items:center; gap:6px;
  min-height:18px; line-height:18px;
}
.auth-label-row{ justify-content:space-between; }
.auth-field .opt{
  text-transform:none; letter-spacing:0; color: var(--text-mute);
  font-weight:400; margin-left:0; white-space:nowrap;
}
.auth-link-sm{ font-size:12px; color: var(--accent); font-weight:500; }
.auth-link-sm:hover{ color: var(--white); }

.auth-input{
  position:relative;
  display:flex; align-items:center; min-width:0; height:48px;
  border:1px solid var(--border); border-radius: 12px;
  background: rgba(10,10,26,.7);
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.auth-input:focus-within{
  border-color: var(--primary);
  background: rgba(10,10,26,.9);
  box-shadow: 0 0 0 4px rgba(79,70,229,.18);
}
.auth-input svg{
  width:18px; height:18px; margin-left:14px;
  color: var(--text-mute); flex-shrink:0;
}
.auth-input input{
  flex:1; min-width:0; width:100%; height:100%;
  background:transparent; border:0; outline:0;
  padding: 0 14px; color: var(--white);
  font: 500 14px/1.4 var(--font-b);
}
.auth-input input::placeholder{ color: var(--text-mute); font-weight:400; }
.auth-eye{
  background:transparent; border:0; cursor:pointer;
  padding: 0 14px; color: var(--text-mute); display:flex; align-items:center;
}
.auth-eye:hover, .auth-eye.on{ color: var(--accent); }
.auth-eye svg{ width:18px; height:18px; margin:0; }

.auth-row{ display:grid; grid-template-columns: 1fr; gap:14px; min-width:0; align-items:end; }
@media (min-width: 760px){ .auth-row{ grid-template-columns: minmax(0,1fr) minmax(0,1fr); } }

@media (max-width: 420px){
  .auth-shell{ padding: 10px; }
  .auth-panel{ padding: 24px 14px; gap:18px; }
  .auth-tabs{ padding:3px; }
  .auth-tab{ padding:10px 8px; font-size:12px; }
  .auth-head h2{ font-size:1.35rem; }
  .auth-input svg{ margin-left:12px; }
  .auth-input{ height:46px; }
  .auth-input input{ padding:0 10px; font-size:13px; }
  .auth-eye{ padding:0 10px; }
}

.auth-submit{
  margin-top: 6px;
  padding: 13px 20px; font-size: 14px; letter-spacing:.01em;
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  border: 0;
}
.auth-submit:hover{ background: linear-gradient(135deg, var(--primary-2), var(--accent)); }

.auth-switch{
  text-align:center; margin: 4px 0 0; font-size: 13px; color: var(--text-dim);
}
.auth-link{
  background:transparent; border:0; cursor:pointer;
  color: var(--accent); font-weight:600; padding:0; font: inherit;
}
.auth-link:hover{ color: var(--white); }

.auth-terms{
  margin: 6px 0 0; text-align:center;
  font-size: 11px; color: var(--text-mute); letter-spacing:.02em;
}

/* Admin login (reuse auth solo layout) */
.page-abir\/login main{ padding: 0; }

/* ===================== Admin console (v2) ===================== */
html.is-admin body::before { opacity: .55; }
html.is-admin body > header,
html.is-admin body > footer { display: none; }

.admin-side {
  position: fixed; top: 0; left: 0; bottom: 0; z-index: 40;
  width: 248px; padding: 22px 16px;
  background: linear-gradient(180deg, #10102e 0%, #0a0a1f 100%);
  border-right: 1px solid var(--border);
  display: flex; flex-direction: column; gap: 8px;
  transform: translateX(-100%); transition: transform .28s ease;
}
.admin-side::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size: 24px 24px;
  mask-image: radial-gradient(ellipse at top, #000 30%, transparent 80%);
}
.admin-side > * { position: relative; z-index: 1; }
@media (min-width: 900px){ .admin-side{ transform: translateX(0); } }
body.admin-open .admin-side { transform: translateX(0); }
.admin-brand{ display:flex; align-items:center; gap:12px; padding: 4px 8px 14px; border-bottom:1px solid var(--border); }
.admin-brand img{ width:38px; height:38px; border-radius:10px; background: rgba(255,255,255,.06); padding: 3px; }
.admin-brand .ab-name{ font-family: var(--font-h); font-weight: 700; color: var(--white); font-size: 1rem; }
.admin-brand .ab-name span{ color: var(--accent); }
.admin-brand .ab-tag{ font-size: 10px; text-transform: uppercase; letter-spacing:.2em; color: var(--text-mute); }
.admin-side nav{ display:flex; flex-direction:column; gap:2px; padding: 10px 0; flex:1; }
.asi-link{
  display:flex; align-items:center; gap:12px;
  padding: 10px 12px; border-radius: 10px;
  color: var(--text-dim); font-size: 14px; font-weight: 500;
  transition: background .15s ease, color .15s ease;
}
.asi-link:hover{ background: rgba(255,255,255,.04); color: var(--white); }
.asi-link.active{ background: linear-gradient(135deg, rgba(79,70,229,.25), rgba(99,102,241,.15)); color: var(--white); box-shadow: inset 0 0 0 1px rgba(129,140,248,.25); }
.asi-link svg{ opacity:.85; flex-shrink:0; }
.admin-side-foot{ border-top:1px solid var(--border); padding-top:10px; }
.asi-logout{ color: #fca5a5; }
.asi-logout:hover{ background: rgba(239,68,68,.10); color: #fecaca; }

.admin-topbar{
  position: sticky; top:0; z-index: 30;
  display:flex; align-items:center; gap:14px;
  padding: 14px 20px;
  background: rgba(10,10,26,.75); backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
}
@media (min-width: 900px){ .admin-topbar{ margin-left: 248px; } }
.admin-top-title{ font-family: var(--font-h); font-weight: 600; color: var(--white); font-size: 1.05rem; flex:1; }
.admin-top-link{ font-size: 13px; color: var(--text-dim); }
.admin-top-link:hover{ color: var(--white); }
.admin-burger{ background: transparent; border: 1px solid var(--border); border-radius: 10px; width: 40px; height:40px; display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; cursor:pointer; }
.admin-burger span{ width: 18px; height:2px; background: var(--white); border-radius: 2px; }
@media (min-width: 900px){ .admin-burger{ display:none; } }

.admin-scrim{ position: fixed; inset: 0; background: rgba(0,0,0,.55); opacity: 0; pointer-events: none; transition: opacity .2s ease; z-index: 35; }
body.admin-open .admin-scrim{ opacity: 1; pointer-events: auto; }
@media (min-width: 900px){ .admin-scrim{ display:none; } }

.admin-page{ padding: 24px 20px 60px; }
@media (min-width: 900px){ .admin-page{ margin-left: 248px; padding: 32px 40px 80px; max-width: 1400px; } }
.admin-page .ap-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom: 24px; }
.admin-page .ap-head h1{ font-size: clamp(1.5rem, 3vw, 2rem); margin: 4px 0 6px; }
.admin-page .ap-head .eyebrow{ font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); }
.ap-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.ap-link{ color: var(--accent); font-size: 13px; font-weight: 600; }
.ap-card{
  background: linear-gradient(180deg, rgba(20,20,50,.75), rgba(15,15,40,.75));
  border: 1px solid var(--border); border-radius: 18px; padding: 22px;
  box-shadow: 0 12px 32px -18px rgba(0,0,0,.6);
}
.ap-sec-head{ display:flex; align-items:center; justify-content:space-between; margin: 28px 0 14px; }
.ap-sec-head h2{ font-size: 1.15rem; margin: 0; }
.ap-section{ margin-top: 8px; }

.kpi-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; margin-bottom: 8px; }
.kpi{
  display:flex; align-items:center; gap:14px;
  padding: 18px; border-radius: 16px;
  background: linear-gradient(180deg, rgba(20,20,50,.75), rgba(15,15,40,.75));
  border: 1px solid var(--border);
  transition: transform .2s ease, border-color .2s ease;
}
.kpi:hover{ transform: translateY(-2px); border-color: var(--border-2); }
.kpi-icon{
  width: 42px; height: 42px; border-radius: 12px;
  display:flex; align-items:center; justify-content:center;
  color: #fff;
}
.kpi.k-blue   .kpi-icon{ background: linear-gradient(135deg,#3b82f6,#6366f1); }
.kpi.k-purple .kpi-icon{ background: linear-gradient(135deg,#7c3aed,#a855f7); }
.kpi.k-green  .kpi-icon{ background: linear-gradient(135deg,#10b981,#14b8a6); }
.kpi.k-amber  .kpi-icon{ background: linear-gradient(135deg,#f59e0b,#f97316); }
.kpi.k-orange .kpi-icon{ background: linear-gradient(135deg,#f97316,#ef4444); }
.kpi.k-rose   .kpi-icon{ background: linear-gradient(135deg,#f43f5e,#ec4899); }
.kpi-v{ font-family: var(--font-h); font-weight: 700; font-size: 1.6rem; color: var(--white); line-height:1.1; }
.kpi-l{ font-size: 11px; text-transform: uppercase; letter-spacing:.14em; color: var(--text-mute); margin-top: 4px; }

.grid-form{ display:grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap: 12px; align-items:end; }
.grid-form label{ display:grid; gap:6px; color: var(--text-dim); font-size: 12px; font-weight: 600; letter-spacing:.05em; text-transform: uppercase; }
.grid-form .check{ display:flex; align-items:center; gap:8px; text-transform:none; letter-spacing:0; }
.grid-form .check input{ width:auto; }
.grid-form button{ height: 44px; }

.ap-filter{ display:flex; gap:10px; margin: 16px 0; flex-wrap:wrap; }
.ap-filter input, .ap-filter select{ min-width: 180px; }

.table .empty{ text-align:center; color: var(--text-mute); padding: 40px 0; font-style: italic; }
.table .num{ font-variant-numeric: tabular-nums; font-family: var(--font-h); }
.chip{ display:inline-block; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 600; letter-spacing:.05em; background: rgba(129,140,248,.12); border: 1px solid rgba(129,140,248,.22); color: var(--accent); text-transform: capitalize; }
.row-actions{ display:flex; gap:6px; flex-wrap: wrap; }
.row-actions form{ display:inline; margin:0; }
.btn-ghost.danger{ color:#fca5a5; }
.btn-ghost.danger:hover{ background: rgba(239,68,68,.10); border-color: rgba(239,68,68,.4); }

.copy-key{ background:transparent; border:0; padding:0; cursor:pointer; color:inherit; }
.copy-key code{ transition: background .15s ease; }
.copy-key.copied code{ background: rgba(74,222,128,.15); color:#4ade80; border-color: rgba(74,222,128,.35); }
.copy-key:hover code{ border-color: var(--accent); }

.update-grid{ display:grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 900px){ .update-grid{ grid-template-columns: 1.5fr 1fr; } }
.ver-row{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom: 16px; }
.ver-num{ font-family: var(--font-h); font-size: 2.2rem; font-weight: 700; color: var(--white); line-height:1; margin-top: 4px; }
.channel-form{ display:grid; gap: 8px; }
.channel-form label{ font-size: 12px; text-transform: uppercase; letter-spacing:.06em; color: var(--text-dim); font-weight: 600; }

.user-header{ display:flex; align-items:center; gap:16px; }
.user-avatar{ width: 56px; height: 56px; border-radius: 16px; background: linear-gradient(135deg,#4f46e5,#a855f7); color:#fff; display:flex; align-items:center; justify-content:center; font-family: var(--font-h); font-weight:700; font-size: 1.15rem; }

/* Checkout redesign */
.checkout-grid{ display:grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 900px){ .checkout-grid{ grid-template-columns: 1.4fr 1fr; } }
.chk-plan{ padding-bottom: 18px; border-bottom: 1px dashed var(--border); margin-bottom: 18px; }
.chk-plan .price{ display:flex; align-items:baseline; gap:6px; }
.chk-plan .price .amt{ font-family: var(--font-h); font-size: 2.6rem; font-weight: 700; color: var(--white); line-height:1; }
.chk-plan .price .cur{ color: var(--text-dim); font-size: 1rem; }
.chk-steps{ list-style:none; padding:0; margin: 0 0 18px; display:grid; gap:14px; }
.chk-steps li{ display:flex; align-items:flex-start; gap:14px; }
.chk-num{ flex-shrink:0; width:34px; height:34px; border-radius:10px; background: linear-gradient(135deg,#4f46e5,#6366f1); color:#fff; display:flex; align-items:center; justify-content:center; font-family: var(--font-h); font-weight:700; }
.chk-t{ color: var(--text); font-size: 15px; }
.chk-copy{ display:flex; align-items:center; gap:10px; margin-top:6px; }
.chk-copy code{ font-size: 1.05rem; letter-spacing:.06em; padding: 8px 12px; }
.chk-form{ display:grid; gap:14px; margin-top: 6px; }
.chk-note{ margin-top: 14px; padding: 12px 14px; border-radius: 10px; border:1px solid; font-size: 13px; }
.chk-note.pending{ background: rgba(245,158,11,.10); border-color: rgba(245,158,11,.28); color:#fbbf24; }
.chk-side h3{ margin: 0 0 8px; }
.chk-info{ margin-top: 18px; padding-top: 14px; border-top: 1px dashed var(--border); display:grid; gap:8px; font-size: 13px; }

/* Admin login uses auth shell centered */
.page-admin\/login header, .page-admin\/login footer { }

/* Wholesale (admin discount) markers on /pricing */
.badge-wholesale{ background: linear-gradient(135deg,#34d399,#10b981); color:#052e1a; border:none; font-weight:700; letter-spacing:.02em; box-shadow: 0 8px 24px -8px rgba(16,185,129,.55); }
.plan-badge-wholesale{ position:absolute; top:14px; right:14px; }
.wholesale-line{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin: 2px 0 6px; }
.wholesale-orig{ color: var(--text-mute); text-decoration: line-through; font-size: 15px; }
.wholesale-save{ color:#34d399; font-size: 12px; font-weight:600; text-transform: uppercase; letter-spacing:.06em; padding: 3px 8px; border-radius: 999px; background: rgba(16,185,129,.10); border: 1px solid rgba(16,185,129,.28); }

/* ================================================================
   /pricing — hero + tabs + cards (v1.1.18)
   ================================================================ */
.pricing-page{ padding-bottom: 80px; }
.pricing-hero{ position:relative; padding: 64px 0 40px; text-align:center; overflow:hidden; }
.pricing-hero::before{ content:""; position:absolute; inset:-40% 0 auto 0; height: 480px; background:
  radial-gradient(600px 320px at 30% 20%, rgba(79,70,229,.22), transparent 60%),
  radial-gradient(500px 300px at 75% 30%, rgba(129,140,248,.18), transparent 60%);
  pointer-events:none; z-index:0; }
.pricing-hero > .container{ position:relative; z-index:1; }
.pricing-eyebrow{ display:inline-block; padding:6px 14px; border-radius:999px; font-size:12px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--accent); background: rgba(129,140,248,.08); border:1px solid rgba(129,140,248,.25); }
.pricing-title{ font-size: clamp(2rem, 5.5vw, 3.5rem); line-height:1.05; margin: 18px 0 12px; }
.grad-text{ background: linear-gradient(135deg,#818cf8,#4f46e5 60%,#a855f7); -webkit-background-clip:text; background-clip:text; color:transparent; }
.pricing-sub{ color:var(--text-dim); max-width: 44em; margin: 0 auto; font-size: 16px; }

.pricing-tabs{ margin: 28px auto 0; display:inline-flex; padding:5px; gap:4px; background: var(--bg-2);
  border:1px solid var(--border); border-radius: 999px; }
.pt-btn{ appearance:none; border:none; cursor:pointer; padding: 10px 22px; border-radius: 999px;
  font-family: var(--font-h); font-weight:600; font-size:14px; color: var(--text-dim); background: transparent;
  display:inline-flex; align-items:center; gap:8px; transition: all .2s ease; }
.pt-btn:hover{ color: var(--white); }
.pt-btn.is-active{ background: linear-gradient(135deg, var(--primary), var(--primary-2)); color:#fff;
  box-shadow: 0 8px 24px -8px var(--primary-glow); }
.pt-pill{ font-size:10px; padding: 2px 8px; border-radius: 999px; background: rgba(255,255,255,.18); letter-spacing:.05em; }

.pricing-grid{ display:grid; grid-template-columns: 1fr; gap: 22px; margin: 40px 0 56px; }
@media (min-width: 720px){ .pricing-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1120px){ .pricing-grid{ grid-template-columns: repeat(3, 1fr); } }
.pricing-grid[data-active="monthly"] .pcard:not([data-tab="monthly"]){ display:none; }
.pricing-grid[data-active="lifetime"] .pcard:not([data-tab="lifetime"]){ display:none; }
.pricing-grid[data-active="advanced"] .pcard:not([data-tab="advanced"]){ display:none; }

.pcard{ position:relative; padding: 26px 24px 22px; border-radius: 20px;
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0) 40%), var(--bg-2);
  border:1px solid var(--border); display:flex; flex-direction:column; gap: 16px;
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; overflow:hidden; }
.pcard:hover{ transform: translateY(-4px); border-color: color-mix(in oklab, var(--tint-a) 45%, var(--border));
  box-shadow: 0 24px 50px -24px color-mix(in oklab, var(--tint-a) 40%, transparent); }
.pcard.is-featured{ border-color: color-mix(in oklab, var(--tint-a) 55%, var(--border));
  box-shadow: 0 24px 50px -24px color-mix(in oklab, var(--tint-a) 50%, transparent); }
.pcard-glow{ position:absolute; inset:-1px -1px auto -1px; height:4px;
  background: linear-gradient(90deg, var(--tint-a), var(--tint-b)); border-radius: 20px 20px 0 0; }

.pcard-head{ display:grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 12px; align-items:center; }
.pcard-icon{ flex-shrink:0; width:44px; height:44px; border-radius: 12px; display:grid; place-items:center;
  font-family: var(--font-h); font-weight:700; font-size:13px; color:#fff; letter-spacing:.02em;
  background: linear-gradient(135deg, var(--tint-a), var(--tint-b)); box-shadow: 0 10px 20px -10px color-mix(in oklab, var(--tint-a) 60%, transparent); }
.pcard-titles{ min-width:0; }
.pcard-name{ font-size: 1.05rem; margin:0; color: var(--white); font-family: var(--font-h); font-weight:600;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pcard-sub{ color: var(--text-mute); font-size: 12px; margin-top:2px; }
.pcard-badge{ flex-shrink:0; font-size:10px; padding: 5px 10px; border-radius: 999px; letter-spacing:.06em;
  text-transform:uppercase; background: rgba(255,255,255,.06); border:1px solid var(--border-2); color: var(--text-dim); }
.pcard-badge.badge-best{ background: linear-gradient(135deg,#f59e0b,#f43f5e); color:#fff; border:none;
  box-shadow: 0 8px 18px -8px rgba(244,63,94,.55); }
.pcard-badge.badge-new{ background: linear-gradient(135deg,#10b981,#14b8a6); color:#052e1a; border:none; }

.pcard-price{ display:flex; align-items:baseline; gap:6px; margin-top:6px; }
.pp-cur{ color: var(--text-dim); font-size: 1.1rem; }
.pp-amt{ font-family: var(--font-h); font-weight:800; font-size: 2.8rem; line-height:1; color: var(--white);
  background: linear-gradient(180deg,#fff,#cbd5e1); -webkit-background-clip:text; background-clip:text; color:transparent; }
.pp-per{ color: var(--text-mute); font-size: 13px; }

.pcard-save{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:-8px; }
.ps-strike{ color: var(--text-mute); text-decoration: line-through; font-size: 14px; }
.ps-pill{ font-size: 11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  padding: 4px 10px; border-radius: 999px; color:#fbbf24;
  background: rgba(245,158,11,.10); border:1px solid rgba(245,158,11,.28); }
.ps-pill-admin{ color:#34d399; background: rgba(16,185,129,.10); border-color: rgba(16,185,129,.28); }

.pcard-features{ list-style:none; padding:0; margin: 8px 0 4px; display:grid; gap:10px; flex:1; }
.pcard-features li{ display:flex; align-items:flex-start; gap:10px; color: var(--text); font-size: 14px; line-height:1.5; }
.pf-check{ flex-shrink:0; margin-top:3px; color: transparent; stroke: url(#none);
  color: color-mix(in oklab, var(--tint-a) 70%, #fff); }

.pcard-cta{ margin-top: 4px; }
.pcard-foot{ margin-top: 8px; padding-top: 14px; border-top: 1px dashed var(--border);
  color: var(--text-mute); font-size: 11.5px; text-align:center; }

.pricing-trust{ display:grid; grid-template-columns: 1fr; gap: 14px; margin: 8px 0 56px;
  padding: 20px; border-radius: 16px; background: var(--bg-2); border:1px solid var(--border); }
@media (min-width: 800px){ .pricing-trust{ grid-template-columns: repeat(3, 1fr); } }
.pt-item{ display:flex; flex-direction:column; gap:4px; }
.pt-item strong{ color: var(--white); font-family: var(--font-h); font-size: 15px; }
.pt-item span{ color: var(--text-dim); font-size: 13px; }

.pricing-faq{ max-width: 780px; margin: 0 auto; }
.pricing-faq h2{ text-align:center; margin-bottom: 20px; }
.pricing-faq details{ background: var(--bg-2); border:1px solid var(--border); border-radius: 14px;
  padding: 16px 20px; margin-bottom: 12px; transition: border-color .2s ease; }
.pricing-faq details[open]{ border-color: color-mix(in oklab, var(--primary) 40%, var(--border)); }
.pricing-faq summary{ cursor:pointer; color: var(--white); font-family: var(--font-h); font-weight:600;
  font-size: 15px; list-style:none; display:flex; justify-content:space-between; align-items:center; gap: 12px; }
.pricing-faq summary::after{ content:"+"; color: var(--accent); font-size: 22px; line-height:1; transition: transform .2s ease; }
.pricing-faq details[open] summary::after{ transform: rotate(45deg); }
.pricing-faq p{ margin: 10px 0 0; color: var(--text-dim); font-size: 14px; line-height:1.6; }

/* Admin — base price grid */
.base-price-grid{ display:grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 680px){ .base-price-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1080px){ .base-price-grid{ grid-template-columns: repeat(3, 1fr); } }
.base-price-card{ position:relative; padding: 16px; border-radius: 14px; background: var(--bg);
  border:1px solid var(--border); display:flex; flex-direction:column; gap:12px; overflow:hidden; }
.base-price-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px;
  background: linear-gradient(90deg, var(--tint-a), var(--tint-b)); }
.bp-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.bp-name{ color: var(--white); font-family: var(--font-h); font-weight:600; font-size: 14px; margin-top:6px; }
.bp-body{ display:flex; flex-direction:column; gap:8px; }
.bp-field{ display:flex; flex-direction:column; gap:4px; }
.bp-field span{ font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--text-mute); }
.bp-field input{ padding:10px 12px; background: var(--bg-2); border:1px solid var(--border); border-radius:10px;
  color: var(--white); font-family: var(--font-h); font-size: 18px; font-weight:600; }
.bp-field input:focus{ outline:none; border-color: var(--primary); }
.bp-default{ font-size:12px; color: var(--text-dim); }
.bp-actions{ display:flex; gap:8px; flex-wrap:wrap; }

/* ============================================================
   Home v2 — mobile-first responsive redesign (v1.1.26)
   ============================================================ */
.home-v2 { --ta:#818cf8; --tb:#6366f1; }
.home-v2 .hv-section { padding: 56px 0; }
@media (min-width: 768px) { .home-v2 .hv-section { padding: 80px 0; } }

/* Head */
.home-v2 .hv-head { max-width: 720px; margin: 0 0 28px; }
.home-v2 .hv-eye { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin-bottom: 10px; }
.home-v2 .hv-head h2 { font-size: clamp(1.5rem, 3.4vw, 2.2rem); line-height: 1.12; margin: 0 0 10px; }
.home-v2 .hv-head p  { color: var(--text-dim); font-size: 15px; margin: 0; }

/* HERO */
.home-v2 .hv-hero { position: relative; padding: 32px 0 12px; overflow: hidden; }
@media (min-width: 900px) { .home-v2 .hv-hero { padding: 56px 0 24px; } }
.home-v2 .hv-hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background:
    radial-gradient(600px 320px at 15% 0%, rgba(99,102,241,.22), transparent 60%),
    radial-gradient(500px 400px at 100% 100%, rgba(129,140,248,.14), transparent 60%);
}
.home-v2 .hv-hero-inner { position: relative; z-index: 1; display: grid; gap: 32px; grid-template-columns: 1fr; align-items: center; }
@media (min-width: 960px) { .home-v2 .hv-hero-inner { grid-template-columns: 1.05fr .95fr; gap: 48px; } }
.home-v2 .hv-pill { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px;
  border: 1px solid var(--border); background: rgba(10,10,26,0.6);
  font-size: 11px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--text-dim); }
.home-v2 .hv-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--success); animation: pulse 2s ease-in-out infinite; }
.home-v2 .hv-h1 { font-size: clamp(2rem, 6vw, 3.6rem); line-height: 1.03; margin: 18px 0 14px; letter-spacing: -0.025em; }
.home-v2 .hv-grad { background: linear-gradient(90deg, #a5b4fc, #6366f1 40%, #f97316); -webkit-background-clip: text; background-clip: text; color: transparent; }
.home-v2 .hv-lead { color: var(--text-dim); font-size: 1.02rem; max-width: 36em; margin: 0 0 26px; }
.home-v2 .hv-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.home-v2 .hv-trust { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 32px; max-width: 480px; }
@media (min-width: 640px) { .home-v2 .hv-trust { grid-template-columns: repeat(4, 1fr); } }
.home-v2 .hv-trust > div { padding: 12px 14px; background: rgba(255,255,255,0.03); border: 1px solid var(--border); border-radius: 14px; }
.home-v2 .hv-trust strong { display: block; font-family: var(--font-h); font-weight: 700; color: var(--white); font-size: 1.05rem; }
.home-v2 .hv-trust span { display: block; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-mute); margin-top: 4px; }

/* Hero art */
.home-v2 .hv-hero-art { position: relative; min-height: 320px; display: none; }
@media (min-width: 960px) { .home-v2 .hv-hero-art { display: block; } }
.home-v2 .hv-orb { position: absolute; border-radius: 50%; filter: blur(56px); opacity: .55; pointer-events: none; }
.home-v2 .hv-orb-a { width: 260px; height: 260px; background: #6366f1; top: -30px; right: 20px; }
.home-v2 .hv-orb-b { width: 200px; height: 200px; background: #f97316; bottom: -20px; left: -10px; opacity: .35; }
.home-v2 .hv-window {
  position: relative; z-index: 2; border-radius: 18px; padding: 14px;
  background: linear-gradient(180deg, rgba(20,20,50,.9), rgba(10,10,26,.9));
  border: 1px solid var(--border-2);
  box-shadow: 0 30px 80px -30px rgba(0,0,0,.7), 0 0 0 1px rgba(129,140,248,.1) inset;
  font-family: 'JetBrains Mono', monospace; font-size: 12px; color: var(--text);
  transform: rotate(-1.2deg);
}
.home-v2 .hv-win-bar { display: flex; align-items: center; gap: 6px; padding: 4px 6px 12px; border-bottom: 1px solid var(--border); margin-bottom: 10px; }
.home-v2 .hv-win-bar span { width: 10px; height: 10px; border-radius: 50%; background: #334155; }
.home-v2 .hv-win-bar span:nth-child(1) { background: #ef4444; }
.home-v2 .hv-win-bar span:nth-child(2) { background: #f59e0b; }
.home-v2 .hv-win-bar span:nth-child(3) { background: #22c55e; }
.home-v2 .hv-win-bar em { margin-left: auto; font-style: normal; color: var(--text-mute); font-size: 11px; }
.home-v2 .hv-win-row { display: flex; align-items: center; gap: 10px; padding: 7px 4px; border-bottom: 1px dashed rgba(129,140,248,.08); }
.home-v2 .hv-win-row em { margin-left: auto; font-style: normal; color: var(--text-mute); }
.home-v2 .hv-win-row.hv-mute { color: var(--text-mute); }
.home-v2 .hv-chip { width: 20px; height: 20px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center;
  background: rgba(148,163,184,.14); color: var(--text-dim); font-size: 11px; }
.home-v2 .hv-chip-ok { background: rgba(74,222,128,.15); color: #4ade80; }
.home-v2 .hv-chip-run { background: rgba(99,102,241,.18); color: #a5b4fc; animation: pulse 1.4s ease-in-out infinite; }
.home-v2 .hv-win-foot { border-top: 1px solid var(--border); border-bottom: 0; padding: 12px 4px 2px; margin: 8px 0 0; }
.home-v2 .hv-prog { flex: 1; height: 6px; border-radius: 999px; background: rgba(129,140,248,.12); overflow: hidden; }
.home-v2 .hv-prog i { display: block; height: 100%; background: linear-gradient(90deg, #6366f1, #f97316); border-radius: 999px; }

/* Product grid */
.home-v2 .hv-products { display: grid; gap: 18px; grid-template-columns: 1fr; }
@media (min-width: 640px)  { .home-v2 .hv-products { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .home-v2 .hv-products { grid-template-columns: repeat(4, 1fr); } }
.home-v2 .hv-card {
  position: relative; overflow: hidden; padding: 22px; border-radius: 22px;
  background: linear-gradient(180deg, rgba(20,20,50,.85), rgba(10,10,26,.85));
  border: 1px solid var(--border);
  display: flex; flex-direction: column; gap: 14px;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.home-v2 .hv-card:hover { transform: translateY(-4px); border-color: var(--ta); box-shadow: 0 24px 48px -24px color-mix(in oklab, var(--ta) 45%, transparent); }
.home-v2 .hv-card-glow { position: absolute; top: -60px; right: -60px; width: 180px; height: 180px; border-radius: 50%; filter: blur(48px); opacity: .35; background: linear-gradient(135deg, var(--ta), var(--tb)); pointer-events: none; }
.home-v2 .hv-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; position: relative; }
.home-v2 .hv-card-icon { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center;
  font-family: var(--font-h); font-weight: 700; color: var(--white); background: linear-gradient(135deg, var(--ta), var(--tb));
  box-shadow: 0 12px 26px -12px color-mix(in oklab, var(--ta) 60%, transparent); }
.home-v2 .hv-card-name { margin: 0; font-size: 1.1rem; line-height: 1.25; }
.home-v2 .hv-card-blurb { margin: 0; font-size: 14px; color: var(--text-dim); flex: 1; }
.home-v2 .hv-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 0; list-style: none; }
.home-v2 .hv-chips li { font-size: 11px; letter-spacing: .05em; padding: 4px 9px; border-radius: 999px;
  background: rgba(255,255,255,.04); border: 1px solid var(--border); color: var(--text-dim); }
.home-v2 .hv-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 12px; border-top: 1px dashed var(--border); }
.home-v2 .hv-price { display: flex; align-items: baseline; gap: 4px; color: var(--white); }
.home-v2 .hv-cur { font-size: 14px; color: var(--text-dim); }
.home-v2 .hv-amt { font-family: var(--font-h); font-size: 1.5rem; font-weight: 700; }
.home-v2 .hv-per { font-size: 12px; color: var(--text-mute); margin-left: 2px; }
.home-v2 .hv-strike { margin-left: 8px; font-size: 12px; color: var(--text-mute); text-decoration: line-through; }
.home-v2 .hv-more { font-size: 13px; font-weight: 600; color: var(--accent); white-space: nowrap; }
.home-v2 .hv-more:hover { color: var(--white); }

/* Features grid */
.home-v2 .hv-features { display: grid; gap: 14px; grid-template-columns: 1fr; }
@media (min-width: 640px)  { .home-v2 .hv-features { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .home-v2 .hv-features { grid-template-columns: repeat(3, 1fr); } }
.home-v2 .hv-feat { padding: 20px; border-radius: 18px; border: 1px solid var(--border); background: rgba(20,20,50,.55); transition: border-color .2s ease, transform .2s ease; }
.home-v2 .hv-feat:hover { border-color: var(--primary); transform: translateY(-2px); }
.home-v2 .hv-feat-i { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 20px; background: rgba(99,102,241,.14); border: 1px solid rgba(99,102,241,.25); margin-bottom: 12px; }
.home-v2 .hv-feat h4 { margin: 0 0 6px; font-family: var(--font-h); color: var(--white); font-size: 1rem; }
.home-v2 .hv-feat p { margin: 0; color: var(--text-dim); font-size: 14px; }

/* Steps */
.home-v2 .hv-steps { display: grid; gap: 14px; grid-template-columns: 1fr; counter-reset: step; }
@media (min-width: 720px) { .home-v2 .hv-steps { grid-template-columns: repeat(3, 1fr); } }
.home-v2 .hv-step { position: relative; padding: 24px; border-radius: 20px; border: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(20,20,50,.7), rgba(10,10,26,.7)); overflow: hidden; }
.home-v2 .hv-step::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--primary), var(--accent)); opacity: .8; }
.home-v2 .hv-step-n { font-family: var(--font-h); font-size: 2rem; font-weight: 700; color: var(--accent); line-height: 1; margin-bottom: 10px; opacity: .85; }
.home-v2 .hv-step h4 { margin: 0 0 6px; color: var(--white); font-family: var(--font-h); font-size: 1.05rem; }
.home-v2 .hv-step p { margin: 0; color: var(--text-dim); font-size: 14px; }

/* FAQ */
.home-v2 .hv-faq { display: grid; gap: 10px; }
.home-v2 .hv-faq details { border: 1px solid var(--border); border-radius: 14px; background: rgba(20,20,50,.5); padding: 14px 18px; transition: border-color .2s ease; }
.home-v2 .hv-faq details[open] { border-color: var(--primary); }
.home-v2 .hv-faq summary { cursor: pointer; font-weight: 600; color: var(--white); list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.home-v2 .hv-faq summary::-webkit-details-marker { display: none; }
.home-v2 .hv-faq summary::after { content: "+"; font-size: 20px; color: var(--accent); transition: transform .2s ease; }
.home-v2 .hv-faq details[open] summary::after { content: "−"; }
.home-v2 .hv-faq p { margin: 10px 0 0; color: var(--text-dim); font-size: 14px; }

/* CTA band */
.home-v2 .hv-cta-band { display: flex; flex-direction: column; gap: 20px; padding: 32px; border-radius: 24px;
  background: linear-gradient(135deg, rgba(99,102,241,.18), rgba(249,115,22,.10));
  border: 1px solid var(--border-2); position: relative; overflow: hidden; }
@media (min-width: 768px) { .home-v2 .hv-cta-band { flex-direction: row; align-items: center; justify-content: space-between; padding: 40px 48px; } }
.home-v2 .hv-cta-band h2 { margin: 0 0 6px; font-size: clamp(1.4rem, 3vw, 1.9rem); }
.home-v2 .hv-cta-band p { margin: 0; color: var(--text-dim); }
.home-v2 .hv-cta-actions { display: flex; flex-wrap: wrap; gap: 12px; }

/* ============================================================
   Home v3 — hero + dashboard preview redesign (v1.1.27)
   ============================================================ */
.home-v3 { --hv3-line: rgba(129,140,248,.14); }
.home-v3 .hv3-section { padding: 36px 0; }
@media (min-width: 900px) { .home-v3 .hv3-section { padding: 56px 0; } }
.home-v3 .hv3-section + .hv3-section { padding-top: 0; }
.home-v3 .hv3-grad {
  background: linear-gradient(90deg,#a78bfa,#22d3ee 60%,#6366f1);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.home-v3 .hv3-head { max-width: 760px; margin: 0 0 24px; }
.home-v3 .hv3-head-center { margin: 0 auto 18px; text-align: center; }
.home-v3 .hv3-mini { display: inline-block; font-size: 11px; letter-spacing: .28em; color: var(--accent); font-weight: 600; margin-bottom: 12px; }
.home-v3 .hv3-head > .hv3-mini:only-child { margin-bottom: 0; }
.home-v3 .hv3-head h2 { font-size: clamp(1.6rem, 3.6vw, 2.5rem); line-height: 1.15; margin: 0; }
.home-v3 .hv3-head-center h2 { margin: 0 auto; }

/* Buttons */
.home-v3 .hv3-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 22px; border-radius: 12px; font-weight: 600; font-size: 14px; text-decoration: none; transition: transform .15s ease, box-shadow .15s ease, background .15s ease; border: 1px solid transparent; white-space: nowrap; }
.home-v3 .hv3-btn-primary { background: linear-gradient(135deg,#6366f1,#8b5cf6); color: #fff; box-shadow: 0 14px 36px -14px rgba(99,102,241,.7); }
.home-v3 .hv3-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 18px 44px -14px rgba(99,102,241,.9); }
.home-v3 .hv3-btn-ghost { background: rgba(255,255,255,.03); color: #fff; border-color: var(--border-2); }
.home-v3 .hv3-btn-ghost:hover { border-color: var(--accent); background: rgba(129,140,248,.08); }

/* HERO */
.home-v3 .hv3-hero { position: relative; padding: 40px 0 32px; overflow: hidden; }
@media (min-width: 900px) { .home-v3 .hv3-hero { padding: 72px 0 56px; } }
.home-v3 .hv3-hero-bg {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(650px 340px at 12% 0%, rgba(139,92,246,.28), transparent 60%),
    radial-gradient(500px 400px at 96% 60%, rgba(34,211,238,.16), transparent 60%),
    radial-gradient(600px 320px at 100% 100%, rgba(236,72,153,.14), transparent 60%);
}
.home-v3 .hv3-hero-inner { position: relative; display: grid; gap: 40px; grid-template-columns: 1fr; align-items: center; }
@media (min-width: 1000px) { .home-v3 .hv3-hero-inner { grid-template-columns: 1fr 1fr; gap: 56px; } }
.home-v3 .hv3-eyebrow { display: inline-block; padding: 6px 14px; border-radius: 999px; background: rgba(139,92,246,.12); border: 1px solid rgba(139,92,246,.35); color: #c4b5fd; font-size: 11px; font-weight: 600; letter-spacing: .16em; }
.home-v3 .hv3-h1 { font-size: clamp(2.2rem, 6.6vw, 4rem); line-height: 1.03; letter-spacing: -0.03em; margin: 22px 0 18px; color: #fff; }
.home-v3 .hv3-lead { color: var(--text-dim); font-size: 1.05rem; max-width: 34em; margin: 0 0 26px; }
.home-v3 .hv3-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.home-v3 .hv3-trust-row { display: flex; align-items: center; gap: 14px; margin-top: 30px; }
.home-v3 .hv3-avatars { display: flex; }
.home-v3 .hv3-avatars span { width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(135deg,#6366f1,#22d3ee); border: 2px solid #0a0a1a; margin-left: -8px; }
.home-v3 .hv3-avatars span:first-child { margin-left: 0; background: linear-gradient(135deg,#f97316,#f59e0b); }
.home-v3 .hv3-avatars span:nth-child(2) { background: linear-gradient(135deg,#8b5cf6,#ec4899); }
.home-v3 .hv3-avatars span:nth-child(3) { background: linear-gradient(135deg,#10b981,#22d3ee); }
.home-v3 .hv3-stars { color: #fbbf24; font-size: 13px; letter-spacing: 2px; }
.home-v3 .hv3-trust-text { color: var(--text-dim); font-size: 13px; margin-top: 2px; }

/* Preview window */
.home-v3 .hv3-preview { position: relative; }
.home-v3 .hv3-win { position: relative; border-radius: 18px;
  background: linear-gradient(180deg,#0f0f2e,#0a0a1a);
  border: 1px solid var(--border-2);
  box-shadow: 0 40px 80px -30px rgba(0,0,0,.7), 0 0 0 1px rgba(139,92,246,.15) inset, 0 0 60px -10px rgba(99,102,241,.25);
  overflow: hidden;
}
.home-v3 .hv3-win-bar { display: flex; align-items: center; gap: 6px; padding: 12px 14px; border-bottom: 1px solid var(--hv3-line); background: rgba(15,15,46,.8); }
.home-v3 .hv3-win-bar span { width: 10px; height: 10px; border-radius: 50%; }
.home-v3 .hv3-dotr { background: #ef4444; }
.home-v3 .hv3-doty { background: #f59e0b; }
.home-v3 .hv3-dotg { background: #22c55e; }
.home-v3 .hv3-win-bar em { margin-left: 12px; font-style: normal; color: var(--text-dim); font-size: 12px; font-family: 'JetBrains Mono', monospace; }
.home-v3 .hv3-win-body { padding: 16px; display: grid; gap: 14px; }
.home-v3 .hv3-kpi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.home-v3 .hv3-kpi-c { padding: 12px; border: 1px solid var(--hv3-line); border-radius: 12px; background: rgba(20,20,50,.5); }
.home-v3 .hv3-kpi-l { font-size: 10px; letter-spacing: .1em; color: var(--text-mute); text-transform: uppercase; }
.home-v3 .hv3-kpi-n { font-family: var(--font-h); font-size: 1.15rem; font-weight: 700; color: #fff; margin-top: 6px; }
.home-v3 .hv3-kpi-n span { color: var(--accent); }
.home-v3 .hv3-kpi-d { font-size: 10px; color: #4ade80; margin-top: 2px; }
.home-v3 .hv3-tasks { padding: 12px; border: 1px solid var(--hv3-line); border-radius: 14px; background: rgba(20,20,50,.4); }
.home-v3 .hv3-tasks-h { font-size: 12px; color: var(--text-dim); margin-bottom: 10px; font-weight: 600; }
.home-v3 .hv3-task { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px dashed var(--hv3-line); }
.home-v3 .hv3-task:last-child { border-bottom: 0; }
.home-v3 .hv3-t-i { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; font-size: 11px; font-weight: 700; color: #fff; font-family: var(--font-h); background: linear-gradient(135deg, var(--ta), var(--tb)); flex-shrink: 0; }
.home-v3 .hv3-t-body { flex: 1; min-width: 0; }
.home-v3 .hv3-t-n { display: flex; justify-content: space-between; font-size: 12px; color: #e2e8f0; margin-bottom: 5px; }
.home-v3 .hv3-t-n em { font-style: normal; color: var(--text-dim); font-family: 'JetBrains Mono', monospace; font-size: 11px; }
.home-v3 .hv3-bar { height: 5px; background: rgba(148,163,184,.14); border-radius: 999px; overflow: hidden; }
.home-v3 .hv3-bar i { display: block; height: 100%; border-radius: 999px; }

/* Product tiles (reference style) */
.home-v3 .hv3-tiles { display: grid; gap: 14px; grid-template-columns: 1fr; }
@media (min-width: 560px)  { .home-v3 .hv3-tiles { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .home-v3 .hv3-tiles { grid-template-columns: repeat(4, 1fr); } }
.home-v3 .hv3-tile { position: relative; padding: 20px; border-radius: 18px;
  background: linear-gradient(180deg,#111133,#0a0a1a);
  border: 1px solid var(--border);
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
  display: flex; flex-direction: column; gap: 12px;
}
.home-v3 .hv3-tile:hover { transform: translateY(-3px); border-color: var(--ta); box-shadow: 0 24px 44px -22px color-mix(in oklab, var(--ta) 55%, transparent); }
.home-v3 .hv3-tile-icon { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center;
  background: linear-gradient(135deg, var(--ta), var(--tb));
  box-shadow: 0 10px 26px -12px color-mix(in oklab, var(--ta) 60%, transparent); }
.home-v3 .hv3-tile-name { font-family: var(--font-h); font-size: 1rem; margin: 0; color: #fff; }
.home-v3 .hv3-tile-blurb { font-size: 13px; color: var(--text-dim); margin: 0; flex: 1; line-height: 1.55; }
.home-v3 .hv3-tile-foot { display: flex; align-items: center; justify-content: space-between; padding-top: 10px; border-top: 1px solid var(--hv3-line); }
.home-v3 .hv3-price { color: #fff; font-weight: 700; font-family: var(--font-h); }
.home-v3 .hv3-price em { font-style: normal; font-weight: 500; font-size: 11px; color: var(--text-mute); }
.home-v3 .hv3-launch { font-size: 12px; font-weight: 600; color: var(--accent); padding: 6px 12px; border-radius: 8px; border: 1px solid var(--border-2); }
.home-v3 .hv3-launch:hover { color: #fff; border-color: var(--accent); }

.home-v3 .hv3-hot { position: absolute; top: 12px; right: 12px; z-index: 2;
  font-size: 10px; font-weight: 800; letter-spacing: .04em;
  padding: 4px 9px; border-radius: 999px; color: #fff;
  background: linear-gradient(90deg, #f97316, #ef4444);
  box-shadow: 0 6px 18px -6px rgba(239,68,68,.7); text-transform: uppercase; }

/* Steps */
.home-v3 .hv3-steps { display: grid; gap: 20px; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 800px) { .home-v3 .hv3-steps { grid-template-columns: repeat(4, 1fr); } }
.home-v3 .hv3-step { text-align: center; padding: 20px 10px; position: relative; }
@media (min-width: 800px) {
  .home-v3 .hv3-step:not(:last-child)::after { content: ""; position: absolute; top: 40px; right: -12px; width: 24px; height: 2px;
    background: repeating-linear-gradient(90deg, rgba(129,140,248,.5) 0 4px, transparent 4px 8px); }
}
.home-v3 .hv3-step-c { width: 72px; height: 72px; border-radius: 50%; margin: 0 auto 16px;
  background: radial-gradient(circle at 30% 30%, rgba(139,92,246,.55), rgba(99,102,241,.2) 60%, transparent 70%);
  border: 1px solid rgba(139,92,246,.4); display: grid; place-items: center; position: relative;
  box-shadow: 0 0 40px -10px rgba(139,92,246,.55) inset; }
.home-v3 .hv3-step-c span { font-family: var(--font-h); font-weight: 700; font-size: 1.4rem; color: #fff; }
.home-v3 .hv3-step h4 { margin: 0 0 6px; color: #fff; font-family: var(--font-h); font-size: 1rem; }
.home-v3 .hv3-step p { margin: 0; color: var(--text-dim); font-size: 13px; }

/* Compatibility brands */
.home-v3 .hv3-brands { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
@media (min-width: 560px)  { .home-v3 .hv3-brands { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 900px)  { .home-v3 .hv3-brands { grid-template-columns: repeat(5, 1fr); } }
@media (min-width: 1120px) { .home-v3 .hv3-brands { grid-template-columns: repeat(10, 1fr); } }
.home-v3 .hv3-brand { padding: 14px 10px; text-align: center; border-radius: 14px; border: 1px solid var(--border); background: rgba(20,20,50,.5); transition: border-color .15s ease, transform .15s ease; }
.home-v3 .hv3-brand:hover { border-color: var(--accent); transform: translateY(-2px); }
.home-v3 .hv3-brand span { display: grid; place-items: center; width: 40px; height: 40px; margin: 0 auto 8px; border-radius: 10px; font-family: var(--font-h); font-weight: 700; color: #fff; background: linear-gradient(135deg,#6366f1,#8b5cf6); }
.home-v3 .hv3-brand span.hv3-brand-ic { background: transparent; padding: 0; }
.home-v3 .hv3-brand span.hv3-brand-ic svg { width: 40px; height: 40px; display: block; filter: drop-shadow(0 4px 10px rgba(0,0,0,.35)); transition: transform .2s ease; }
.home-v3 .hv3-brand:hover span.hv3-brand-ic svg { transform: scale(1.08) rotate(-2deg); }
.home-v3 .hv3-brand em { font-style: normal; font-size: 12px; color: var(--text-dim); font-weight: 500; }

/* Stats */
.home-v3 .hv3-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; padding: 26px; border-radius: 20px; border: 1px solid var(--border); background: linear-gradient(180deg,#111133,#0a0a1a); }
@media (min-width: 720px) { .home-v3 .hv3-stats { grid-template-columns: repeat(4, 1fr); } }
.home-v3 .hv3-stats > div { text-align: center; padding: 12px; }
.home-v3 .hv3-stat-n { font-family: var(--font-h); font-size: clamp(1.6rem, 4vw, 2.2rem); font-weight: 700; color: #fff; }
.home-v3 .hv3-stat-l { color: var(--text-dim); font-size: 13px; margin-top: 4px; letter-spacing: .04em; }

/* CTA */
.home-v3 .hv3-cta-card { position: relative; overflow: hidden; padding: 40px; border-radius: 24px; border: 1px solid var(--border-2);
  background:
    radial-gradient(600px 320px at 100% 100%, rgba(236,72,153,.16), transparent 60%),
    linear-gradient(135deg, rgba(99,102,241,.22), rgba(34,211,238,.10) 70%, transparent);
}
@media (min-width: 900px) { .home-v3 .hv3-cta-card { padding: 56px 64px; } }
.home-v3 .hv3-cta-card h2 { margin: 0 0 8px; font-size: clamp(1.5rem, 3vw, 2rem); }
.home-v3 .hv3-cta-card p { margin: 0 0 22px; color: var(--text-dim); }
.home-v3 .hv3-cta-card .hv3-cta { position: relative; z-index: 1; }
.home-v3 .hv3-cta-orb { position: absolute; right: -80px; bottom: -80px; width: 240px; height: 240px; border-radius: 50%; background: radial-gradient(circle, rgba(139,92,246,.5), transparent 65%); filter: blur(30px); pointer-events: none; }

/* ===== Features grid ===== */
.home-v3 .hv3-feats { display: grid; gap: 14px; grid-template-columns: 1fr; }
@media (min-width: 600px)  { .home-v3 .hv3-feats { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .home-v3 .hv3-feats { grid-template-columns: repeat(3, 1fr); } }
.home-v3 .hv3-feat { position: relative; padding: 22px; border-radius: 18px;
  border: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(20,20,50,.75), rgba(10,10,26,.85));
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
  overflow: hidden;
}
.home-v3 .hv3-feat::before { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px;
  background: linear-gradient(135deg, color-mix(in oklab, var(--ta) 40%, transparent), transparent 55%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; opacity: .8;
}
.home-v3 .hv3-feat:hover { transform: translateY(-3px); border-color: var(--ta);
  box-shadow: 0 24px 44px -22px color-mix(in oklab, var(--ta) 55%, transparent); }
.home-v3 .hv3-feat-i { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center;
  font-size: 22px; margin-bottom: 14px;
  background: linear-gradient(135deg, color-mix(in oklab, var(--ta) 22%, transparent), color-mix(in oklab, var(--tb) 22%, transparent));
  border: 1px solid color-mix(in oklab, var(--ta) 30%, transparent); }
.home-v3 .hv3-feat h4 { margin: 0 0 6px; color: #fff; font-family: var(--font-h); font-size: 1.02rem; }
.home-v3 .hv3-feat p { margin: 0; color: var(--text-dim); font-size: 13.5px; line-height: 1.6; }
.home-v3 .hv3-feat p a { color: var(--accent); font-weight: 600; }

/* ===== FAQ ===== */
.home-v3 .hv3-faq { max-width: 780px; margin: 0 auto; display: grid; gap: 10px; }
.home-v3 .hv3-faq-i { border: 1px solid var(--border); border-radius: 14px; background: rgba(20,20,50,.5);
  padding: 4px 18px; transition: border-color .18s ease, background .18s ease; overflow: hidden; }
.home-v3 .hv3-faq-i[open] { border-color: color-mix(in oklab, var(--accent) 55%, transparent);
  background: linear-gradient(180deg, rgba(99,102,241,.10), rgba(20,20,50,.6)); }
.home-v3 .hv3-faq-i summary { list-style: none; cursor: pointer; padding: 14px 0; display: flex;
  align-items: center; justify-content: space-between; gap: 14px; color: #fff; font-weight: 600; font-size: 15px; }
.home-v3 .hv3-faq-i summary::-webkit-details-marker { display: none; }
.home-v3 .hv3-faq-i summary i { font-style: normal; width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center;
  border: 1px solid var(--border-2); color: var(--accent); font-weight: 700; transition: transform .2s ease, background .2s ease; flex-shrink: 0; }
.home-v3 .hv3-faq-i[open] summary i { transform: rotate(45deg); background: color-mix(in oklab, var(--accent) 18%, transparent); }
.home-v3 .hv3-faq-i p { margin: 0 0 14px; color: var(--text-dim); font-size: 14px; line-height: 1.65; }

/* Step color tint override */
.home-v3 .hv3-step-c { background: linear-gradient(135deg, color-mix(in oklab, var(--ta,#8b5cf6) 30%, transparent), color-mix(in oklab, var(--tb,#22d3ee) 30%, transparent));
  border: 1px solid color-mix(in oklab, var(--ta,#8b5cf6) 45%, transparent);
  box-shadow: 0 18px 32px -18px color-mix(in oklab, var(--ta,#8b5cf6) 60%, transparent); }

/* ===== How It Works (v2) ===== */
.home-v3 .hv3-hiw-section .hv3-sub { max-width: 620px; margin: 10px auto 0; color: var(--text-dim); font-size: 15px; }
.home-v3 .hv3-hiw { position: relative; margin-top: 44px; display: grid; gap: 18px; grid-template-columns: 1fr; }
@media (min-width: 720px)  { .home-v3 .hv3-hiw { grid-template-columns: repeat(2, 1fr); gap: 22px; } }
@media (min-width: 1080px) { .home-v3 .hv3-hiw { grid-template-columns: repeat(4, 1fr); gap: 20px; } }
.home-v3 .hv3-hiw-rail { display: none; }
@media (min-width: 1080px) {
  .home-v3 .hv3-hiw-rail { display: block; position: absolute; left: 6%; right: 6%; top: 44px; height: 2px;
    background: linear-gradient(90deg, transparent, rgba(139,92,246,.55) 12%, rgba(34,211,238,.55) 50%, rgba(16,185,129,.55) 88%, transparent);
    filter: blur(.3px); }
  .home-v3 .hv3-hiw-rail::after { content: ""; position: absolute; inset: -3px 0; background: inherit; filter: blur(6px); opacity: .55; }
}
.home-v3 .hv3-hiw-item { position: relative; padding: 20px 20px 22px; border-radius: 18px;
  background: linear-gradient(180deg, rgba(20,20,50,.85), rgba(10,10,26,.9));
  border: 1px solid var(--border);
  transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .3s ease, box-shadow .35s ease, opacity .6s ease;
  overflow: hidden; text-align: center;
}
/* Scroll reveal — staggered rise-in */
.home-v3 .hv3-hiw-item { opacity: 0; transform: translateY(22px); }
.home-v3 .hv3-hiw-item.is-in { opacity: 1; transform: translateY(0); }
.home-v3 .hv3-hiw-item.is-in:nth-child(2) { transition-delay: .08s; }
.home-v3 .hv3-hiw-item.is-in:nth-child(3) { transition-delay: .16s; }
.home-v3 .hv3-hiw-item.is-in:nth-child(4) { transition-delay: .24s; }
.home-v3 .hv3-hiw-item.is-in:nth-child(5) { transition-delay: .32s; }
.home-v3 .hv3-hiw-item::before { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px;
  background: linear-gradient(160deg, color-mix(in oklab, var(--ta) 55%, transparent), transparent 55%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; opacity: .9; }
.home-v3 .hv3-hiw-item::after { content: ""; position: absolute; left: 50%; top: 0; width: 60%; height: 70%; transform: translateX(-50%);
  background: radial-gradient(closest-side, color-mix(in oklab, var(--ta) 22%, transparent), transparent 70%);
  pointer-events: none; opacity: .8; transition: opacity .35s ease, transform .5s ease; }
.home-v3 .hv3-hiw-item:hover { transform: translateY(-6px); border-color: color-mix(in oklab, var(--ta) 70%, transparent);
  box-shadow: 0 30px 60px -24px color-mix(in oklab, var(--ta) 65%, transparent); }
.home-v3 .hv3-hiw-item:hover::after { opacity: 1; transform: translateX(-50%) scale(1.08); }
.home-v3 .hv3-hiw-node { position: relative; width: 72px; height: 72px; margin: 4px auto 16px; border-radius: 20px;
  background: linear-gradient(140deg, color-mix(in oklab, var(--ta) 35%, transparent), color-mix(in oklab, var(--tb) 30%, transparent));
  border: 1px solid color-mix(in oklab, var(--ta) 55%, transparent);
  display: grid; place-items: center; color: #fff;
  box-shadow: 0 20px 36px -18px color-mix(in oklab, var(--ta) 70%, transparent), inset 0 1px 0 rgba(255,255,255,.12);
  z-index: 1;
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease;
}
.home-v3 .hv3-hiw-item:hover .hv3-hiw-node { transform: translateY(-2px) scale(1.06) rotate(-2deg);
  box-shadow: 0 28px 44px -18px color-mix(in oklab, var(--ta) 85%, transparent), inset 0 1px 0 rgba(255,255,255,.2); }
.home-v3 .hv3-hiw-ic svg { width: 32px; height: 32px; display: block; transition: transform .5s cubic-bezier(.2,.7,.2,1); }
.home-v3 .hv3-hiw-item:hover .hv3-hiw-ic svg { transform: scale(1.1) rotate(4deg); }
.home-v3 .hv3-hiw-num { position: absolute; top: -8px; right: -8px; min-width: 30px; height: 22px; padding: 0 8px;
  border-radius: 999px; display: grid; place-items: center;
  font-family: var(--font-h); font-size: 11px; font-weight: 700; letter-spacing: .06em; color: #fff;
  background: linear-gradient(135deg, var(--ta), var(--tb));
  border: 1px solid rgba(255,255,255,.18); box-shadow: 0 8px 18px -8px color-mix(in oklab, var(--ta) 80%, transparent);
  transition: transform .35s ease;
}
.home-v3 .hv3-hiw-item:hover .hv3-hiw-num { transform: translateY(-2px) scale(1.08); }
@media (prefers-reduced-motion: reduce) {
  .home-v3 .hv3-hiw-item, .home-v3 .hv3-hiw-item.is-in { opacity: 1 !important; transform: none !important; transition: none !important; }
  .home-v3 .hv3-hiw-item:hover, .home-v3 .hv3-hiw-item:hover .hv3-hiw-node, .home-v3 .hv3-hiw-item:hover .hv3-hiw-ic svg, .home-v3 .hv3-hiw-item:hover .hv3-hiw-num { transform: none !important; }
}
.home-v3 .hv3-hiw-body h4 { margin: 0 0 8px; color: #fff; font-family: var(--font-h); font-size: 1.05rem; letter-spacing: .01em; }
.home-v3 .hv3-hiw-body p { margin: 0; color: var(--text-dim); font-size: 13.5px; line-height: 1.6; }

/* ===== Admin: back button in topbar ===== */
.admin-topbar { display:flex; align-items:center; gap:12px; }
.admin-back { display:inline-flex; align-items:center; gap:6px; padding:8px 12px; border-radius:10px;
  border:1px solid var(--border); background: rgba(20,20,50,.6); color: var(--white); font-size:13px; font-weight:600;
  transition: border-color .15s ease, background .15s ease, transform .15s ease; text-decoration:none; }
.admin-back:hover { border-color: var(--accent); background: rgba(99,102,241,.16); transform: translateX(-2px); }
.admin-top-title { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.admin-top-link { flex-shrink:0; }
@media (max-width: 600px) { .admin-back span { display:none; } .admin-back { padding:8px 10px; } }

/* ===== Admin: quick-access card grid ===== */
.admin-tile-grid { display:grid; gap:12px; grid-template-columns: 1fr; }
@media (min-width: 560px)  { .admin-tile-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px)  { .admin-tile-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1280px) { .admin-tile-grid { grid-template-columns: repeat(4, 1fr); } }

.admin-tile { position:relative; display:flex; align-items:center; gap:14px; padding:16px;
  border-radius:16px; border:1px solid var(--border);
  background: linear-gradient(180deg, rgba(20,20,50,.75), rgba(10,10,26,.85));
  color:#fff; text-decoration:none; overflow:hidden;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.admin-tile::before { content:""; position:absolute; inset:0; border-radius:inherit; padding:1px;
  background: linear-gradient(135deg, color-mix(in oklab, var(--ta) 55%, transparent), transparent 60%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude; pointer-events:none; opacity:.85; }
.admin-tile:hover { transform: translateY(-3px); border-color: var(--ta);
  box-shadow: 0 22px 40px -22px color-mix(in oklab, var(--ta) 60%, transparent); }
.atl-icon { flex-shrink:0; width:46px; height:46px; border-radius:12px; display:grid; place-items:center;
  background: linear-gradient(135deg, var(--ta), var(--tb));
  box-shadow: 0 10px 22px -12px color-mix(in oklab, var(--ta) 70%, transparent); }
.atl-body { flex:1; min-width:0; }
.atl-title { font-family: var(--font-h); font-weight:700; font-size:15px; color:#fff; }
.atl-desc { font-size:12.5px; color: var(--text-dim); margin-top:2px; line-height:1.4; }
.atl-arrow { flex-shrink:0; color: var(--text-mute); transition: color .15s ease, transform .15s ease; }
.admin-tile:hover .atl-arrow { color: var(--ta); transform: translateX(3px); }

/* ===== Admin: mobile side menu polish ===== */
@media (max-width: 899px) {
  .admin-side { transition: transform .28s cubic-bezier(.2,.8,.2,1); box-shadow: 12px 0 40px rgba(0,0,0,.5); }
  body.admin-open { overflow: hidden; }
  .admin-side nav a { padding: 14px 16px; font-size: 14.5px; }
  .admin-burger { transition: border-color .15s ease, background .15s ease; }
  body.admin-open .admin-burger { border-color: var(--accent); background: rgba(99,102,241,.16); }
  body.admin-open .admin-burger span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  body.admin-open .admin-burger span:nth-child(2) { opacity: 0; }
  body.admin-open .admin-burger span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
  .admin-burger span { transition: transform .2s ease, opacity .15s ease; }
}

/* ============================================================
   User Dashboard v2 — modern responsive redesign (v1.1.43)
   ============================================================ */
.udash { padding: 24px 0 72px; color: var(--text); }
.udash .container { max-width: 1180px; }

/* Hero */
.udash-hero {
  position: relative; overflow: hidden;
  border-radius: 28px; padding: 32px 24px;
  background:
    radial-gradient(1200px 400px at 90% -10%, rgba(139,92,246,.28), transparent 60%),
    radial-gradient(900px 380px at -10% 110%, rgba(34,211,238,.22), transparent 60%),
    linear-gradient(180deg, #10102a 0%, #0b0b1e 100%);
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 30px 80px -40px rgba(79,70,229,.55);
  margin-bottom: 32px;
}
@media (min-width: 720px) { .udash-hero { padding: 44px 40px; } }
.udash-hero-inner { position: relative; z-index: 1; max-width: 720px; }
.udash-hero-glow {
  position: absolute; inset: auto -80px -140px auto;
  width: 380px; height: 380px; border-radius: 50%;
  background: radial-gradient(circle, rgba(129,140,248,.35), transparent 60%);
  filter: blur(20px); pointer-events: none;
}
.udash-pill {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 12px; border-radius: 999px;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
  font-size: 12px; color: #cbd5e1; letter-spacing: .02em;
}
.udash-dot { width: 8px; height: 8px; border-radius: 50%; background: #34d399; box-shadow: 0 0 12px #34d399; }
.udash-title {
  margin: 18px 0 12px; font-family: var(--font-h);
  font-size: clamp(1.75rem, 4vw, 2.6rem); font-weight: 800;
  line-height: 1.1; color: #fff; letter-spacing: -.02em;
}
.udash-title-accent {
  background: linear-gradient(90deg,#a78bfa,#22d3ee);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.udash-sub { color: #94a3b8; font-size: 1rem; max-width: 560px; line-height: 1.6; margin: 0 0 22px; }

.udash-cta { display: flex; flex-wrap: wrap; gap: 12px; }
.udash-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 11px 20px; border-radius: 12px;
  font-weight: 600; font-size: .95rem; text-decoration: none;
  border: 1px solid transparent; cursor: pointer;
  transition: transform .15s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
  font-family: inherit;
}
.udash-btn-primary {
  background: linear-gradient(135deg,#6366f1,#8b5cf6);
  color: #fff;
  box-shadow: 0 10px 30px -12px rgba(139,92,246,.7);
}
.udash-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 14px 36px -12px rgba(139,92,246,.85); }
.udash-btn-ghost {
  background: rgba(255,255,255,.04); color: #e2e8f0;
  border-color: rgba(255,255,255,.1);
}
.udash-btn-ghost:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.18); }
.udash-btn-sm { padding: 8px 14px; font-size: .85rem; border-radius: 10px; }
.udash-btn-count {
  display:inline-flex; align-items:center; justify-content:center;
  min-width: 20px; height: 20px; padding: 0 6px;
  border-radius: 999px; background: #ef4444; color:#fff;
  font-size: 11px; font-weight: 700;
}

/* Stats */
.udash-stats {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px;
  margin-top: 32px;
}
@media (min-width: 720px) { .udash-stats { grid-template-columns: repeat(4, 1fr); gap: 16px; } }
.udash-stat {
  display: flex; align-items: center; gap: 14px;
  padding: 16px; border-radius: 18px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(10px);
  transition: transform .2s ease, border-color .2s ease;
}
.udash-stat:hover { transform: translateY(-2px); border-color: rgba(255,255,255,.18); }
.udash-stat-icon {
  width: 44px; height: 44px; border-radius: 12px;
  display: grid; place-items: center; font-size: 20px;
  color: #fff; flex-shrink: 0;
  box-shadow: 0 6px 18px -8px rgba(0,0,0,.6);
}
.udash-stat-body { min-width: 0; }
.udash-stat-k { font-family: var(--font-h); font-size: 1.6rem; font-weight: 700; color: #fff; line-height: 1; }
.udash-stat-v { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: #94a3b8; margin-top: 4px; }

/* Section head */
.udash-section-head {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin: 32px 0 18px;
}
.udash-eyebrow { font-size: 11px; text-transform: uppercase; letter-spacing: .18em; color: #a78bfa; font-weight: 600; }
.udash-h2 { font-family: var(--font-h); font-size: 1.5rem; font-weight: 700; color: #fff; margin: 6px 0 0; }
.udash-link { color: #a78bfa; text-decoration: none; font-size: .9rem; font-weight: 600; }
.udash-link:hover { color: #c4b5fd; }
.udash-muted { color: #94a3b8; margin: 0; }

/* License grid */
.udash-lic-grid { display: grid; gap: 18px; grid-template-columns: 1fr; }

/* ---- Active license summary ---- */
.udash-summary { margin: 26px 0 6px; }
.udash-summary-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.udash-summary-count { font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 6px 12px; border-radius: 999px; background: rgba(16,185,129,.12); color: #34d399; border: 1px solid rgba(52,211,153,.28); white-space: nowrap; }
.udash-summary-grid { display: grid; gap: 14px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .udash-summary-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .udash-summary-grid { grid-template-columns: repeat(3, 1fr); } }
.udash-sum-card { display: block; text-decoration: none; color: inherit; padding: 16px; border-radius: 16px; background: linear-gradient(160deg, rgba(255,255,255,.05), rgba(255,255,255,.015)); border: 1px solid rgba(255,255,255,.09); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.udash-sum-card:hover { transform: translateY(-3px); border-color: rgba(255,255,255,.2); box-shadow: 0 14px 34px rgba(0,0,0,.32); }
.udash-sum-top { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.udash-sum-logo { width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; font-size: 12px; font-weight: 800; color: #fff; flex: none; }
.udash-sum-name { font-size: 13.5px; font-weight: 700; line-height: 1.25; }
.udash-sum-big { font-size: 30px; font-weight: 800; line-height: 1; letter-spacing: -.02em; margin-bottom: 12px; }
.udash-sum-big span { display: block; font-size: 11.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; opacity: .6; margin-top: 6px; }
.udash-sum-row { display: flex; align-items: center; justify-content: space-between; font-size: 12.5px; opacity: .8; margin-bottom: 6px; }
.udash-sum-row strong { font-variant-numeric: tabular-nums; opacity: 1; }
.udash-sum-bar { height: 6px; border-radius: 999px; background: rgba(255,255,255,.08); overflow: hidden; }
.udash-sum-bar i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg,#6366f1,#8b5cf6); }
.udash-sum-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; font-size: 11.5px; opacity: .65; }
.udash-sum-plan { padding: 3px 9px; border-radius: 999px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.09); font-weight: 700; text-transform: capitalize; opacity: 1; }
.udash-sum-card.is-ok .udash-sum-big { color: #34d399; }
.udash-sum-card.is-life .udash-sum-big { color: #fbbf24; }
.udash-sum-card.is-warn .udash-sum-big { color: #f59e0b; }
.udash-sum-card.is-crit .udash-sum-big { color: #f87171; }
.udash-sum-card.is-crit { border-color: rgba(248,113,113,.35); }
@media (min-width: 900px) { .udash-lic-grid { grid-template-columns: repeat(2, 1fr); } }

.udash-lic {
  position: relative; overflow: hidden;
  display: grid; gap: 16px;
  padding: 22px; border-radius: 20px;
  background: linear-gradient(180deg, rgba(20,20,50,.85), rgba(12,12,30,.9));
  border: 1px solid rgba(255,255,255,.08);
  transition: transform .2s ease, border-color .2s ease, box-shadow .25s ease;
}
.udash-lic:hover {
  transform: translateY(-3px); border-color: rgba(167,139,250,.35);
  box-shadow: 0 24px 60px -24px rgba(99,102,241,.5);
}

.udash-lic-top {
  display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px;
  align-items: flex-start;
}
.udash-lic-brand { display: flex; min-width: 0; gap: 12px; align-items: center; }
.udash-lic-serial {
  flex-shrink: 0; min-width: 34px; height: 34px; padding: 0 8px;
  display: grid; place-items: center;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(139,92,246,.22), rgba(59,130,246,.18));
  border: 1px solid rgba(148,163,184,.22);
  color: #e2e8f0; font-weight: 800; font-family: var(--font-h);
  font-size: .85rem; letter-spacing: .02em;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04);
}
.udash-lic-logo {
  width: 46px; height: 46px; border-radius: 12px; flex-shrink: 0;
  display: grid; place-items: center;
  color: #fff; font-weight: 800; font-family: var(--font-h); font-size: 1.1rem;
  box-shadow: 0 8px 22px -10px rgba(0,0,0,.7);
}
.udash-lic-title { min-width: 0; }
.udash-lic-name { color: #fff; font-weight: 700; font-size: 1rem; line-height: 1.25;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.udash-lic-meta { color: #94a3b8; font-size: .8rem; margin-top: 2px; }
.udash-lic-badges { display: flex; flex-direction: column; gap: 6px; align-items: flex-end; flex-shrink: 0; }

.udash-tag {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: 999px;
  font-size: 11px; font-weight: 600; letter-spacing: .04em;
  border: 1px solid transparent;
}
.udash-tag-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.udash-tag-plan { background: rgba(148,163,184,.12); color: #cbd5e1; }
.udash-tag-plan.is-life { background: linear-gradient(135deg,#f59e0b,#f43f5e); color: #fff; }
.udash-tag-active,.udash-tag-paid,.udash-tag-open {
  background: rgba(52,211,153,.14); color: #34d399; border-color: rgba(52,211,153,.25);
}
.udash-tag-pending { background: rgba(245,158,11,.14); color: #fbbf24; border-color: rgba(245,158,11,.25); }
.udash-tag-expired,.udash-tag-failed,.udash-tag-cancelled,.udash-tag-refunded,.udash-tag-fraud,.udash-tag-closed {
  background: rgba(239,68,68,.14); color: #fca5a5; border-color: rgba(239,68,68,.25);
}
.udash-tag-initiated { background: rgba(148,163,184,.14); color:#cbd5e1; }

/* Key */
.udash-key { display: grid; gap: 6px; }
.udash-key-label { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: #64748b; }
.udash-key-row {
  display: flex; align-items: stretch; gap: 8px;
  padding: 4px; border-radius: 12px;
  background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.08);
}
.udash-key-row code {
  flex: 1; min-width: 0;
  background: transparent; border: none; color: #a5f3fc;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  padding: 10px 12px; font-size: .88rem; letter-spacing: .06em;
  overflow-x: auto; white-space: nowrap;
}
.udash-copy {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 14px; border-radius: 9px; flex-shrink: 0; cursor: pointer;
  background: linear-gradient(135deg,#6366f1,#8b5cf6); color:#fff;
  border: none; font-weight: 600; font-size: .82rem;
  transition: transform .15s ease, box-shadow .2s ease;
}
.udash-copy:hover { transform: translateY(-1px); box-shadow: 0 8px 20px -8px rgba(139,92,246,.7); }
.udash-copy.is-copied { background: linear-gradient(135deg,#10b981,#14b8a6); }
.udash-copy-icon { font-size: 1rem; }

/* Note form */
.udash-note {
  display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px;
}
.udash-note input[type=text] {
  background: rgba(0,0,0,.25); border-color: rgba(255,255,255,.08);
  border-radius: 10px; padding: 9px 12px; font-size: .88rem;
}

/* Actions */
.udash-lic-actions { display: flex; flex-wrap: wrap; gap: 10px; }

/* Empty state */
.udash-empty {
  text-align: center; padding: 40px 24px;
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(20,20,50,.6), rgba(12,12,30,.7));
  border: 1px dashed rgba(255,255,255,.12);
}
.udash-empty-sm { padding: 22px; text-align: left; }
.udash-empty-emoji { font-size: 2.5rem; margin-bottom: 12px; }
.udash-empty h3 { color: #fff; margin: 0 0 8px; font-size: 1.25rem; }
.udash-empty p { color: #94a3b8; margin: 0 auto 20px; max-width: 420px; }

/* Orders */
.udash-orders { display: grid; gap: 10px; }
.udash-order {
  display: grid; grid-template-columns: 1fr; gap: 12px;
  padding: 14px 16px; border-radius: 14px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.07);
  transition: border-color .2s ease, background .2s ease;
}
.udash-order:hover { border-color: rgba(167,139,250,.3); background: rgba(255,255,255,.05); }
@media (min-width: 640px) {
  .udash-order { grid-template-columns: 1fr auto; align-items: center; }
}
.udash-order-main { display: flex; align-items: center; gap: 12px; min-width: 0; }
.udash-order-mini {
  width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0;
  display: grid; place-items: center;
  color: #fff; font-weight: 700; font-size: .9rem;
}
.udash-order-info { min-width: 0; }
.udash-order-name { color: #fff; font-weight: 600; font-size: .95rem;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.udash-order-meta { color: #94a3b8; font-size: .78rem; margin-top: 2px; }
.udash-order-side { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.udash-order-amt { color: #fff; font-weight: 700; font-family: var(--font-h); font-size: 1.05rem; }

@media (max-width: 480px) {
  .udash-hero { padding: 24px 18px; border-radius: 22px; }
  .udash-lic { padding: 18px; border-radius: 18px; }
  .udash-lic-badges { flex-direction: row; }
  .udash-copy-label { display: none; }
  .udash-copy { padding: 10px 12px; }
}

/* ============ Dashboard nav (search + notifications) ============ */
.udnav{position:sticky;top:0;z-index:75;background:rgba(15,23,42,.85);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.06)}
.udnav-inner{display:flex;align-items:center;gap:14px;padding:12px 20px}
.udnav-search{position:relative;flex:1;max-width:640px}
.udnav-search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);opacity:.55;pointer-events:none}
.udnav-search input{width:100%;padding:12px 14px 12px 42px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:rgba(15,23,42,.6);color:#e2e8f0;font-size:14px;transition:border-color .15s,box-shadow .15s}
.udnav-search input:focus{outline:0;border-color:rgba(139,92,246,.55);box-shadow:0 0 0 4px rgba(139,92,246,.14)}
.udnav-results{position:absolute;left:0;right:0;top:calc(100% + 8px);background:#0f172a;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:8px;max-height:60vh;overflow:auto;box-shadow:0 24px 60px -20px rgba(0,0,0,.6);z-index:90}
.udnav-res-group{padding:6px 4px}
.udnav-res-h{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#64748b;padding:6px 10px}
.udnav-res{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;color:#e2e8f0;text-decoration:none;font-size:13px}
.udnav-res:hover{background:rgba(255,255,255,.04)}
.udnav-res-tag{font-size:11px;padding:2px 8px;border-radius:999px;background:rgba(99,102,241,.18);color:#c7d2fe;text-transform:uppercase;letter-spacing:.08em}
.udnav-res-meta{margin-left:auto;color:#64748b;font-size:12px}
.udnav-res code{font-family:JetBrains Mono,monospace;font-size:12px;color:#a7f3d0;background:rgba(16,185,129,.08);padding:2px 6px;border-radius:6px}

.udnav-bell{position:relative}
.udnav-bell-btn{position:relative;width:44px;height:44px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:rgba(15,23,42,.6);color:#e2e8f0;font-size:18px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:transform .15s,border-color .15s}
.udnav-bell-btn:hover{transform:translateY(-1px);border-color:rgba(139,92,246,.4)}
.udnav-bell-dot{position:absolute;top:9px;right:10px;width:9px;height:9px;background:#ef4444;border-radius:50%;box-shadow:0 0 0 2px #0f172a;animation:udnavPing 1.6s ease-out infinite}
@keyframes udnavPing{0%{box-shadow:0 0 0 2px #0f172a,0 0 0 0 rgba(239,68,68,.6)}100%{box-shadow:0 0 0 2px #0f172a,0 0 0 8px rgba(239,68,68,0)}}
.udnav-panel{position:absolute;right:0;top:calc(100% + 10px);width:min(380px,92vw);background:#0f172a;border:1px solid rgba(255,255,255,.08);border-radius:16px;box-shadow:0 24px 60px -20px rgba(0,0,0,.6);z-index:90;overflow:hidden}
.udnav-panel-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.06);color:#e2e8f0}
.udnav-mark{background:none;border:0;color:#93c5fd;font-size:12px;cursor:pointer}
.udnav-panel-body{max-height:60vh;overflow:auto;padding:6px}
.udnav-empty{padding:24px;text-align:center;color:#64748b;font-size:13px}
.udnav-item{display:flex;gap:12px;padding:11px 12px;border-radius:11px;color:#e2e8f0;text-decoration:none;transition:background .15s}
.udnav-item:hover{background:rgba(255,255,255,.04)}
.udnav-item.is-unread{background:rgba(99,102,241,.08)}
.udnav-item-ico{width:36px;height:36px;border-radius:10px;background:rgba(139,92,246,.15);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}
.udnav-item-title{font-weight:600;font-size:13px}
.udnav-item-sub{font-size:12px;color:#94a3b8;margin-top:2px}
.udnav-item-time{font-size:11px;color:#64748b;margin-top:4px;font-family:JetBrains Mono,monospace}

/* ============ License card extras ============ */
.udash-lic.is-pinned{border-color:rgba(245,158,11,.35);box-shadow:0 0 0 1px rgba(245,158,11,.25),0 20px 40px -20px rgba(245,158,11,.15)}
.udash-lic.is-soon{border-color:rgba(239,68,68,.35)}
.udash-pin-tag{font-size:12px;margin-left:6px;opacity:.85}
.udash-pin-form{display:inline}
.udash-pin{background:transparent;border:1px solid rgba(255,255,255,.08);color:#64748b;width:32px;height:32px;border-radius:10px;cursor:pointer;font-size:14px;transition:.15s}
.udash-pin:hover{color:#f59e0b;border-color:rgba(245,158,11,.4)}
.udash-pin.is-on{color:#fbbf24;background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.45)}
.udash-countdown{font-family:JetBrains Mono,monospace;font-size:12px;color:#93c5fd}
.udash-countdown.is-urgent{color:#fbbf24}
.udash-countdown.is-expired{color:#ef4444}
.udash-toggle{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:rgba(15,23,42,.5);color:#94a3b8;font-size:12px;font-weight:600;cursor:pointer;transition:.15s}
.udash-toggle:hover{color:#e2e8f0;border-color:rgba(139,92,246,.4)}
.udash-toggle-dot{width:8px;height:8px;border-radius:50%;background:#475569;transition:.15s}
.udash-toggle.is-on{color:#a7f3d0;border-color:rgba(16,185,129,.4);background:rgba(16,185,129,.08)}
.udash-toggle.is-on .udash-toggle-dot{background:#10b981;box-shadow:0 0 8px rgba(16,185,129,.6)}

/* ============ Ticket attachments & file inputs ============ */
.tk-file{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#94a3b8}
.tk-file input[type=file]{padding:10px;border:1px dashed rgba(255,255,255,.15);border-radius:10px;background:rgba(15,23,42,.4);color:#cbd5e1;font-size:13px;cursor:pointer}
.tk-file input[type=file]:hover{border-color:rgba(139,92,246,.5)}
.msg-attach{display:inline-block;margin-top:10px;max-width:280px;border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.msg-attach img{display:block;width:100%;height:auto}

/* ============ Ticket UI v2 (cute + friendly) ============ */
.tk-page{display:flex;flex-direction:column;gap:22px}
.tk-hero{display:flex;gap:16px;align-items:center;padding:20px 22px;border-radius:18px;background:linear-gradient(135deg,rgba(139,92,246,.18),rgba(59,130,246,.12));border:1px solid rgba(139,92,246,.28)}
.tk-hero-icon{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;font-size:28px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);flex-shrink:0}
.tk-hero-title{margin:4px 0 4px;font-size:1.5rem}
.tk-hero-sub{margin:0;color:var(--text-mute);font-size:.9rem}
.tk-hero-sub a{color:#25d366;text-decoration:none;font-weight:600}

.tk-new-card{padding:20px}
.tk-new-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.tk-new-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:rgba(139,92,246,.15);color:#c4b5fd;font-size:.78rem;font-weight:600;border:1px solid rgba(139,92,246,.3)}
.tk-new-hint{font-size:.8rem}
.tk-form{gap:14px}
.tk-field{display:flex;flex-direction:column;gap:6px}
.tk-label{font-size:.78rem;font-weight:600;color:var(--text-mute);text-transform:uppercase;letter-spacing:.05em}
.tk-dropzone{display:flex;align-items:center;gap:12px;padding:14px;border-radius:12px;border:1px dashed rgba(139,92,246,.35);background:rgba(139,92,246,.05);cursor:pointer;transition:.15s;position:relative}
.tk-dropzone:hover{background:rgba(139,92,246,.1);border-color:rgba(139,92,246,.6)}
.tk-drop-ico{font-size:22px}
.tk-drop-copy{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.tk-drop-copy strong{color:var(--text);font-size:.9rem}
.tk-drop-copy em{font-style:normal;color:var(--text-mute);font-size:.75rem}
.tk-dropzone input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.tk-form-actions{display:flex;justify-content:flex-end}
.tk-submit{padding:11px 22px;font-weight:600}

.tk-list-head{display:flex;justify-content:space-between;align-items:baseline;margin-top:6px}
.tk-list-head h3{margin:0;font-size:1.1rem}
.tk-count{font-size:.8rem;color:var(--text-mute);padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid var(--border)}

.tk-list{display:grid;gap:12px}
.tk-card{display:flex;gap:14px;padding:16px;border-radius:14px;background:var(--surface);border:1px solid var(--border);text-decoration:none;color:inherit;transition:.15s;position:relative;overflow:hidden}
.tk-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent);opacity:.6}
.tk-card.tk-status-closed::before{background:#64748b}
.tk-card.tk-status-pending::before{background:#fbbf24}
.tk-card:hover{transform:translateY(-2px);border-color:rgba(139,92,246,.5);box-shadow:0 10px 30px -12px rgba(139,92,246,.35)}
.tk-avatar{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-weight:700;font-size:1.1rem;background:linear-gradient(135deg,rgba(139,92,246,.3),rgba(59,130,246,.2));color:#fff;flex-shrink:0}
.tk-card-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.tk-card-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.tk-subject{color:var(--text);font-size:.98rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tk-card-meta{display:flex;justify-content:space-between;align-items:center;font-size:.78rem;color:var(--text-mute)}
.tk-open{color:var(--accent);font-weight:600;opacity:0;transition:.15s}
.tk-card:hover .tk-open{opacity:1}

.tk-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:44px 20px;text-align:center}
.tk-empty-ico{font-size:44px;margin-bottom:6px}

/* ---- Thread / show ---- */
.tk-back{display:inline-flex;align-items:center;gap:6px;color:var(--text-mute);text-decoration:none;font-size:.88rem;transition:.15s;width:fit-content}
.tk-back:hover{color:var(--accent);transform:translateX(-2px)}
.tk-thread-head{display:flex;gap:16px;align-items:flex-start;padding:20px}
.tk-thread-icon{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;font-size:26px;background:rgba(139,92,246,.15);border:1px solid rgba(139,92,246,.3);flex-shrink:0}
.tk-thread-info{flex:1;min-width:0}
.tk-thread-title{margin:4px 0 8px;font-size:1.35rem;word-break:break-word}
.tk-thread-meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:.82rem}

.tk-chat{display:flex;flex-direction:column;gap:14px;padding:4px 0}
.tk-bubble-row{display:flex;gap:10px;max-width:88%}
.tk-bubble-row.is-user{align-self:flex-end;flex-direction:row-reverse}
.tk-bubble-av{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-size:18px;background:var(--surface-2);border:1px solid var(--border);flex-shrink:0}
.tk-bubble-row.is-admin .tk-bubble-av{background:rgba(139,92,246,.2);border-color:rgba(139,92,246,.4)}
.tk-bubble{padding:12px 14px;border-radius:16px;background:var(--surface);border:1px solid var(--border);position:relative}
.tk-bubble-row.is-admin .tk-bubble{border-top-left-radius:4px;background:linear-gradient(135deg,rgba(139,92,246,.12),rgba(59,130,246,.06));border-color:rgba(139,92,246,.28)}
.tk-bubble-row.is-user .tk-bubble{border-top-right-radius:4px;background:rgba(15,23,42,.6)}
.tk-bubble-meta{font-size:.72rem;color:var(--text-mute);margin-bottom:6px;display:flex;gap:4px;align-items:baseline}
.tk-bubble-meta strong{color:var(--text);font-size:.78rem;font-weight:600}
.tk-bubble-body{white-space:pre-wrap;color:var(--text);font-size:.92rem;line-height:1.55;word-break:break-word}
.tk-bubble-attach{display:block;margin-top:10px;max-width:260px;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.1)}
.tk-bubble-attach img{display:block;width:100%;height:auto}

.tk-reply{padding:16px;display:flex;flex-direction:column;gap:12px}
.tk-reply-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.tk-reply-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:999px;background:rgba(59,130,246,.15);color:#93c5fd;font-size:.78rem;font-weight:600;border:1px solid rgba(59,130,246,.3)}
.tk-reply textarea{resize:vertical;min-height:100px}
.tk-reply-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.tk-file-inline{flex-direction:row;align-items:center;gap:8px;padding:8px 14px;border-radius:10px;border:1px dashed rgba(255,255,255,.15);cursor:pointer;position:relative;font-size:.85rem}
.tk-file-inline:hover{border-color:rgba(139,92,246,.5);background:rgba(139,92,246,.05)}
.tk-file-inline input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;padding:0;border:0}

.tk-closed{display:flex;gap:14px;align-items:center;padding:18px;background:rgba(100,116,139,.08);border:1px solid rgba(100,116,139,.25)}
.tk-closed>span{font-size:28px}
.tk-closed>div{flex:1;display:flex;flex-direction:column;gap:2px}

@media (max-width:640px){
  .tk-hero{flex-direction:column;text-align:center;align-items:center}
  .tk-hero-title{font-size:1.2rem}
  .tk-bubble-row{max-width:96%}
  .tk-thread-head{flex-direction:column;text-align:center;align-items:center}
  .tk-thread-meta{justify-content:center}
  .tk-card-top{flex-direction:column;align-items:flex-start;gap:6px}
  .tk-subject{white-space:normal}
  .tk-open{display:none}
}

/* ============ WhatsApp FAB ============ */
.wa-fab{position:fixed;bottom:22px;right:22px;width:58px;height:58px;border-radius:50%;background:#25d366;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px -6px rgba(37,211,102,.5),0 4px 10px rgba(0,0,0,.2);z-index:200;transition:.2s;text-decoration:none}
.wa-fab:hover{transform:scale(1.08) rotate(-6deg);box-shadow:0 16px 36px -6px rgba(37,211,102,.65)}
.wa-fab::before{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(37,211,102,.4);animation:waPing 2s ease-out infinite}
@keyframes waPing{0%{transform:scale(1);opacity:.6}100%{transform:scale(1.4);opacity:0}}

@media (max-width:640px){
  .udnav-inner{padding:10px 14px;gap:10px}
  .udnav-search input{padding:10px 12px 10px 38px;font-size:13px}
  .wa-fab{width:52px;height:52px;bottom:16px;right:16px}
  .udash-lic-badges{flex-wrap:wrap}
}

/* ============================================================
   Admin — mobile-friendly hardening (v1.1.53)
   ============================================================ */
@media (max-width: 900px){
  .admin-page{ padding: 18px 14px 60px; }
  .admin-topbar{ padding: 12px 14px; gap: 10px; }
  .admin-top-title{ font-size: .98rem; }
  .admin-side{ width: min(84vw, 300px); }
  .ap-card{ padding: 16px; border-radius: 14px; }
  .ap-sec-head{ margin: 22px 0 10px; }
  .ap-sec-head h2{ font-size: 1.05rem; }
  .admin-page .ap-head{ flex-direction: column; align-items: stretch; gap: 10px; margin-bottom: 18px; }
  .admin-page .ap-head h1{ font-size: 1.4rem; }
  .ap-actions{ width: 100%; }
  .ap-actions .btn{ flex: 1 1 auto; min-width: 0; }
  .kpi{ padding: 14px; gap: 12px; border-radius: 14px; }
  .kpi-icon{ width: 38px; height: 38px; border-radius: 10px; }
  .kpi-v{ font-size: 1.35rem; }
  .kpi-l{ font-size: 10px; }
  .grid-form{ grid-template-columns: 1fr; gap: 10px; }
  .grid-form button{ width: 100%; }
  .ap-filter{ flex-direction: column; gap: 8px; }
  .ap-filter input, .ap-filter select, .ap-filter button{ width: 100%; min-width: 0; }
  /* Forms inside cards (announcements, coupons, settings) */
  .ap-card > form[style*="grid-template-columns"]{ grid-template-columns: 1fr !important; }
}

/* Table scroll fade + edge indicator so users know to swipe */
.table-wrap{ position: relative; -webkit-overflow-scrolling: touch; scrollbar-width: thin; border-radius: inherit; }
.table-wrap::-webkit-scrollbar{ height: 6px; }
.table-wrap::-webkit-scrollbar-thumb{ background: rgba(129,140,248,.35); border-radius: 999px; }
@media (max-width: 900px){
  .ap-card.table-wrap{ padding: 8px; }
  .table{ font-size: .82rem; }
  .table th, .table td{ padding: 10px 10px; white-space: nowrap; }
  .table td:first-child, .table th:first-child{ position: sticky; left: 0; background: linear-gradient(90deg, #12123a 92%, transparent); z-index: 1; }
  .row-actions{ gap: 4px; }
  .row-actions .btn{ padding: 6px 10px; font-size: 12px; }
}
@media (max-width: 640px){
  .admin-page{ padding: 14px 10px 60px; }
  .ap-card{ padding: 14px; }
  .admin-topbar{ padding: 10px 12px; }
  .admin-top-title{ font-size: .9rem; }
  .kpi-grid{ grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .kpi{ padding: 12px; flex-direction: column; align-items: flex-start; gap: 8px; }
  .kpi-v{ font-size: 1.2rem; }
  .admin-page .ap-head h1{ font-size: 1.25rem; }
  .ver-row{ flex-direction: column; align-items: flex-start; gap: 8px; }
  .ver-num{ font-size: 1.8rem; }
  .user-header{ flex-direction: column; align-items: flex-start; gap: 10px; }
  .user-avatar{ width: 48px; height: 48px; font-size: 1rem; border-radius: 12px; }
  .base-price-grid{ grid-template-columns: 1fr !important; }
  /* Ticket reply form on admin */
  .card.stack input[type=file]{ width: 100%; }
  /* Buttons stack full-width in inline form rows */
  .row-actions{ width: 100%; }
  .row-actions form, .row-actions .btn{ flex: 1 1 100%; }
  .row-actions .btn{ justify-content: center; }
}

/* Prevent long codes / license keys from breaking layout */
@media (max-width: 900px){
  .table code, .ap-card code{ word-break: break-all; white-space: normal; }
  .table td code{ font-size: 11px; }
}

/* --- Dashboard payment status alert --- */
.udash-payalert{display:flex;gap:16px;align-items:flex-start;margin:0 0 22px;padding:20px 22px;border-radius:20px;border:1px solid rgba(245,158,11,.35);background:linear-gradient(135deg,rgba(245,158,11,.12),rgba(15,15,35,.6));color:#e8ecff}
.udash-payalert-danger{border-color:rgba(239,68,68,.38);background:linear-gradient(135deg,rgba(239,68,68,.13),rgba(15,15,35,.6))}
.udash-payalert-icon{font-size:26px;line-height:1;flex:0 0 auto}
.udash-payalert-body{flex:1 1 auto;min-width:0}
.udash-payalert-title{margin:0 0 6px;font-size:1.12rem;font-weight:800}
.udash-payalert-text{margin:0 0 10px;color:#b9c0e0;font-size:.95rem;line-height:1.55}
.udash-payalert-meta{margin:0 0 12px;font-size:.85rem;color:#8f97bd}
.udash-payalert-meta code{background:rgba(255,255,255,.07);padding:2px 7px;border-radius:6px}
.udash-payalert-steps strong{display:block;margin-bottom:6px;font-size:.9rem;letter-spacing:.02em;text-transform:uppercase;color:#f6c453}
.udash-payalert-danger .udash-payalert-steps strong{color:#fca5a5}
.udash-payalert-steps ol{margin:0 0 14px;padding-left:20px;color:#c5cbe8;font-size:.92rem;line-height:1.65}
.udash-payalert-steps a{color:#a5b4fc;text-decoration:underline}
.udash-payalert-cta{display:flex;flex-wrap:wrap;gap:10px}
@media (max-width:560px){.udash-payalert{flex-direction:column;padding:18px;border-radius:16px}.udash-payalert-cta .udash-btn{flex:1 1 100%;justify-content:center}}
.udash-payalert-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px 18px;margin:0 0 14px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07)}
.udash-payalert-facts dt{font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:#8f97bd;margin-bottom:3px}
.udash-payalert-facts dd{margin:0;font-size:.9rem;color:#e8ecff;word-break:break-all}
.udash-payalert-facts code{background:rgba(255,255,255,.07);padding:2px 6px;border-radius:6px;font-size:.82rem}
.udash-payalert-badge{display:inline-block;padding:3px 10px;border-radius:999px;font-weight:700;font-size:.8rem;background:rgba(245,158,11,.18);color:#fbbf24;border:1px solid rgba(245,158,11,.35)}
.udash-payalert-danger .udash-payalert-badge{background:rgba(239,68,68,.16);color:#fca5a5;border-color:rgba(239,68,68,.35)}
.udash-payalert-form{display:inline-flex;margin:0}
.udash-paywindow{display:inline-flex;align-items:center;gap:5px;font-size:.78rem;font-weight:700;color:#93c5fd;background:rgba(59,130,246,.14);border:1px solid rgba(59,130,246,.3);padding:3px 9px;border-radius:999px}
.udash-paywindow.is-warn{color:#fbbf24;background:rgba(245,158,11,.15);border-color:rgba(245,158,11,.35)}
.udash-paywindow.is-out{color:#fca5a5;background:rgba(239,68,68,.14);border-color:rgba(239,68,68,.32)}
.chk-window{margin-top:12px;display:inline-block;padding:9px 14px;border-radius:12px;font-size:.9rem;color:#93c5fd;background:rgba(59,130,246,.12);border:1px solid rgba(59,130,246,.3)}
.chk-window.is-warn{color:#fbbf24;background:rgba(245,158,11,.13);border-color:rgba(245,158,11,.34)}
.chk-window.is-out{color:#fca5a5;background:rgba(239,68,68,.13);border-color:rgba(239,68,68,.32)}
.chk-window a{color:inherit;text-decoration:underline}

/* ===== Admin: notification bell, advanced filters, feed, backup, popups ===== */
.admin-bell{position:relative;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:11px;color:var(--text-dim);border:1px solid rgba(255,255,255,.08);flex-shrink:0}
.admin-bell:hover{color:#fff;background:rgba(255,255,255,.05)}
.admin-bell-dot{position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:#ef4444;color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center}

.filter-bar{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;align-items:end;margin-bottom:18px}
.filter-bar .fb-grow{grid-column:span 2;min-width:200px}
.filter-bar .fb-sm{max-width:150px}
.fb-field{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--text-dim)}
.fb-field span{letter-spacing:.06em;text-transform:uppercase;font-size:10.5px}
.fb-field input,.fb-field select{width:100%;padding:9px 11px;border-radius:10px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);color:var(--white);font-size:13.5px}
.fb-field input:focus,.fb-field select:focus{outline:none;border-color:rgba(99,102,241,.6)}
.fb-actions{display:flex;gap:8px;align-items:center}
.fb-summary{grid-column:1/-1;font-size:12.5px;color:var(--text-dim);border-top:1px solid rgba(255,255,255,.07);padding-top:10px}
@media(max-width:640px){.filter-bar{grid-template-columns:1fr 1fr}.filter-bar .fb-grow{grid-column:1/-1}.filter-bar .fb-sm{max-width:none}.fb-actions{grid-column:1/-1}.fb-actions .btn{flex:1;justify-content:center}}

.feed{padding:0;overflow:hidden}
.feed-row{display:flex;gap:14px;align-items:flex-start;padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.06);color:inherit}
.feed-row:last-child{border-bottom:0}
.feed-row:hover{background:rgba(255,255,255,.03)}
.feed-row.unread{background:rgba(99,102,241,.08);border-left:3px solid #6366f1}
.feed-ico{font-size:18px;line-height:1.2}
.feed-main{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.feed-main span{font-size:13px;overflow:hidden;text-overflow:ellipsis}
.feed-time{font-size:11.5px;color:var(--text-dim);white-space:nowrap}
@media(max-width:520px){.feed-time{display:none}}

.ap-grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:18px}
.bk-tables{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px;max-height:280px;overflow:auto;padding-right:4px}
.bk-table{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);font-size:13px}
.bk-table span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bk-table em{font-style:normal;color:var(--text-dim);font-size:11.5px}

.grid-form-2{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.btn-danger{background:linear-gradient(135deg,#dc2626,#b91c1c);color:#fff;border:1px solid rgba(255,255,255,.12)}
.btn-danger:hover{filter:brightness(1.08)}

/* ============ Pricing Page Enhancements ============ */
.pcard-badge.badge-hot{background:linear-gradient(90deg,#f97316,#ef4444);color:#fff;box-shadow:0 4px 12px -4px rgba(239,68,68,.6);border:0}
.pcard-save{display:flex;align-items:center;gap:8px;margin-bottom:20px;flex-wrap:wrap}
.ps-strike{font-size:16px;color:var(--text-mute);text-decoration:line-through;opacity:.6}
.ps-pill{display:inline-flex;align-items:center;padding:4px 10px;border-radius:8px;background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.35);color:#a7f3d0;font-size:11px;font-weight:600}
.ps-pill-admin{background:rgba(99,102,241,.12);border-color:rgba(99,102,241,.35);color:#c7d2fe}
.ps-off{background:linear-gradient(90deg,#ef4444,#f97316);border:0;color:#fff;box-shadow:0 4px 10px -4px rgba(239,68,68,.5);font-weight:800;letter-spacing:0.02em}

/* ── Free license cards (pricing) ───────────────────────────────── */
.free-grid{ display:grid; grid-template-columns:1fr; gap:16px; margin:28px 0 6px; }
@media (min-width: 760px){ .free-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
.free-card{
  position:relative; overflow:hidden; margin:0;
  display:flex; flex-direction:column;
  border-radius:18px; border:1px solid rgba(56,189,248,.26);
  background:
    radial-gradient(420px 200px at 10% -30%, color-mix(in srgb, var(--tint-a) 22%, transparent), transparent 62%),
    radial-gradient(360px 220px at 100% 120%, color-mix(in srgb, var(--tint-b) 20%, transparent), transparent 60%),
    linear-gradient(160deg, rgba(8,15,28,.94), rgba(6,11,22,.98));
  box-shadow: 0 18px 46px -28px color-mix(in srgb, var(--tint-a) 65%, transparent);
  transition: transform .18s ease, box-shadow .18s ease;
}
.free-card:hover{ transform: translateY(-3px); box-shadow: 0 26px 60px -30px color-mix(in srgb, var(--tint-b) 75%, transparent); }
.fc-aura{ position:absolute; inset:-50% -20% auto -20%; height:70%;
  background: conic-gradient(from 210deg, transparent, color-mix(in srgb, var(--tint-a) 45%, transparent), transparent 60%);
  filter: blur(56px); opacity:.4; pointer-events:none; animation: fcSpin 16s linear infinite; }
@keyframes fcSpin{ to { transform: rotate(360deg); } }
.fc-brand{ position:relative; display:flex; flex-direction:row; align-items:center;
  gap:10px; padding:14px 16px; border-bottom:1px solid rgba(148,163,184,.12); }
.fc-logo{ position:relative; width:44px; height:44px; border-radius:13px; display:grid; place-items:center; flex:none;
  background: linear-gradient(150deg, color-mix(in srgb, var(--tint-a) 30%, transparent), color-mix(in srgb, var(--tint-b) 22%, transparent));
  border:1px solid rgba(255,255,255,.14);
  box-shadow: 0 10px 24px -14px color-mix(in srgb, var(--tint-b) 80%, transparent); }
.fc-logo img{ width:30px; height:30px; object-fit:contain; }
.fc-brandline{ font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); font-weight:800; }
.fc-body{ position:relative; padding:16px 16px 18px; display:flex; flex-direction:column; flex:1; }
.fc-badge{ margin-left:auto; display:inline-block; padding:4px 10px; border-radius:999px; font-size:10.5px; font-weight:900; letter-spacing:.05em;
  color:#04121a; background: linear-gradient(135deg, var(--tint-a), var(--tint-b)); }
.fc-title{ margin:0 0 3px; font-size:clamp(17px,2.4vw,20px); line-height:1.2; }
.fc-sub{ margin:0; color:var(--muted); font-size:12.5px; }
.fc-price{ display:flex; align-items:baseline; gap:7px; margin:10px 0 2px; }
.fc-amt{ font-size:30px; font-weight:900; letter-spacing:-.02em;
  background: linear-gradient(135deg, var(--tint-a), var(--tint-b)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.fc-per{ color:var(--muted); font-size:12px; font-weight:700; }
.fc-features{ list-style:none; margin:10px 0 14px; padding:0; display:grid; gap:6px; }
.fc-features li{ display:flex; gap:7px; align-items:flex-start; font-size:12.5px; color:var(--text); }
.fc-features svg{ flex:none; margin-top:2px; width:13px; height:13px; color: var(--tint-b); }
.fc-cta{ display:block; margin:auto 0 0; }
.fc-btn{ display:block; width:100%; text-align:center; text-decoration:none; cursor:pointer;
  padding:11px 16px; border:0; border-radius:12px; font-size:13.5px; font-weight:900; color:#04121a;
  background: linear-gradient(135deg, var(--tint-a), var(--tint-b));
  box-shadow: 0 14px 30px -16px color-mix(in srgb, var(--tint-b) 90%, transparent);
  transition: transform .16s ease, filter .16s ease; }
.fc-btn:hover{ transform: translateY(-2px); filter: brightness(1.07); }
.fc-note{ margin:9px 0 0; font-size:11px; color:var(--muted); text-align:center; }
.badge-free{ background: linear-gradient(135deg,#38bdf8,#34d399); color:#04121a; border:none; }

/* ===================== Admin console — mobile responsive pass ===================== */
@media (max-width: 899px){
  html.is-admin, html.is-admin body{ overflow-x: hidden; }
  body.admin-open{ overflow: hidden; }

  .admin-side{ width: min(84vw, 300px); padding: 18px 14px; box-shadow: 0 0 60px rgba(0,0,0,.6); overflow-y:auto; }
  .admin-side nav{ gap: 4px; }
  .asi-link{ padding: 12px 12px; font-size: 15px; }

  .admin-topbar{ gap: 10px; padding: 10px 12px; }
  .admin-top-title{ font-size: .98rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .admin-burger{ width: 38px; height: 38px; flex: none; }
  .admin-back span{ display: none; }
  .admin-bell{ flex: none; }
  .admin-top-link{ display: none; }

  .admin-page{ padding: 18px 14px 72px; }
  .admin-page .ap-head{ align-items: flex-start; gap: 12px; margin-bottom: 18px; }
  .admin-page .ap-head h1{ font-size: 1.35rem; }
  .ap-actions{ width: 100%; }
  .ap-actions .btn{ flex: 1 1 auto; justify-content: center; }
  .ap-card{ padding: 16px; border-radius: 14px; }
  .ap-sec-head{ margin: 22px 0 12px; gap: 10px; }
  .ap-sec-head h2{ font-size: 1.02rem; }

  .kpi-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
  .kpi{ padding: 14px; gap: 10px; }
  .kpi-icon{ width: 36px; height: 36px; border-radius: 10px; }
  .kpi-v{ font-size: 1.25rem; }
  .kpi-l{ font-size: 10px; letter-spacing: .1em; }

  .grid-form{ grid-template-columns: 1fr; }
  .ap-grid-2{ grid-template-columns: 1fr; gap: 14px; }
  .admin-stats{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .admin-tabs{ overflow-x: auto; padding-bottom: 4px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .admin-tabs::-webkit-scrollbar{ display: none; }
  .admin-tabs a{ white-space: nowrap; }

  /* Tables: edge-to-edge horizontal scroll instead of squeezing columns */
  .ap-card.table-wrap{ padding: 0; }
  .table-wrap{ -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
  .table{ min-width: 620px; font-size: .86rem; }
  .table th, .table td{ white-space: nowrap; padding: 10px 12px; }
  .table td .chip, .table td .badge{ white-space: nowrap; }

  /* Long keys / ids must not blow out the layout */
  code{ word-break: break-all; }
  .license-key{ flex-wrap: wrap; }
  .license-key code{ flex: 1 1 100%; font-size: .9rem; }

  /* Comfortable tap targets */
  .btn-sm{ padding: 9px 12px; }
  input[type=text],input[type=email],input[type=password],input[type=search],input[type=number],select,textarea{ font-size: 16px; }
}

@media (max-width: 480px){
  .kpi-grid{ grid-template-columns: 1fr; }
  .admin-stats{ grid-template-columns: 1fr; }
  .admin-page{ padding: 16px 12px 72px; }
  .ap-actions{ flex-direction: column; }
  .ap-actions .btn{ width: 100%; }
}

/* ---------- Extension update badge (dashboard license cards) ---------- */
.udash-lic.has-update { border-color: rgba(59,130,246,.4); box-shadow: 0 0 0 1px rgba(59,130,246,.18); }
.udash-upd {
  border: 1px solid rgba(59,130,246,.32);
  background: linear-gradient(135deg, rgba(59,130,246,.14), rgba(99,102,241,.08));
  border-radius: 14px; padding: 12px 14px; margin-bottom: 14px;
  display: flex; flex-direction: column; gap: 8px;
}
.udash-upd-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.udash-upd-badge {
  font-size: .74rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 999px; color: #bfdbfe;
  background: rgba(59,130,246,.22); border: 1px solid rgba(59,130,246,.4);
  animation: udashUpdPulse 2.4s ease-in-out infinite;
}
@keyframes udashUpdPulse { 0%,100% { opacity: 1 } 50% { opacity: .62 } }
.udash-upd-ver { font-family: ui-monospace, Menlo, monospace; font-size: .78rem; opacity: .8; }
.udash-upd-ver b { color: #fff; }
.udash-upd-title { color: #fff; font-weight: 600; font-size: .92rem; }
.udash-upd-list { margin: 0; padding-left: 18px; font-size: .82rem; opacity: .82; line-height: 1.6; }
.udash-upd-act { display: flex; gap: 8px; flex-wrap: wrap; }
@media (max-width: 520px) { .udash-upd-act .udash-btn { flex: 1 1 auto; text-align: center; } }

/* ---------- Wholesale reseller portal ---------- */
.rs-banner{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:18px 0 6px;padding:12px 16px;border-radius:14px;text-decoration:none;color:#e2e8f0;background:linear-gradient(100deg,rgba(99,102,241,.18),rgba(16,185,129,.14));border:1px solid rgba(148,163,184,.22)}
.rs-banner:hover{border-color:rgba(129,140,248,.55)}
.rs-banner-badge{font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;padding:4px 9px;border-radius:999px;background:rgba(99,102,241,.28);color:#c7d2fe}
.rs-banner-text{flex:1;font-size:14px}
.rs-banner-go{font-weight:600;color:#a5b4fc}
.rs-wrap{padding:34px 20px 70px}
.rs-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.rs-head h1{margin:6px 0 4px;font-size:30px}
.rs-head-actions{display:flex;gap:8px;flex-wrap:wrap}
.rs-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:22px}
.rs-stat{background:rgba(255,255,255,.03);border:1px solid rgba(148,163,184,.16);border-radius:16px;padding:14px 16px}
.rs-stat-v{font-size:22px;font-weight:700;font-family:Space Grotesk,system-ui,sans-serif}
.rs-stat-l{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#94a3b8;margin-top:2px}
.rs-bar{margin-top:10px;height:6px;border-radius:99px;background:rgba(148,163,184,.18);overflow:hidden}
.rs-bar span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#6366f1,#22d3ee)}
.rs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:16px}
.rs-card{background:rgba(255,255,255,.03);border:1px solid rgba(148,163,184,.16);border-radius:18px;padding:20px}
.rs-card h2{margin:0 0 4px;font-size:18px}
.rs-form{display:grid;gap:12px;margin-top:14px}
.rs-form label{display:grid;gap:6px;font-size:13px;color:#cbd5e1}
.rs-form .opt{color:#64748b}
.rs-form input,.rs-form select{width:100%;padding:11px 12px;border-radius:12px;background:rgba(15,23,42,.6);border:1px solid rgba(148,163,184,.22);color:#e2e8f0;font-size:14px}
.rs-note{padding:10px 12px;border-radius:12px;font-size:13px;margin-top:12px}
.rs-note-warn{background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.35);color:#fcd34d}
.rs-section{margin-top:28px}
.rs-section h2{font-size:18px;margin:0 0 12px}
.key-copy{background:transparent;border:0;padding:0;cursor:pointer;color:inherit;font:inherit}
.key-copy code{cursor:pointer}
.chip-picks{display:flex;flex-wrap:wrap;gap:8px}
.chip-pick{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:rgba(148,163,184,.1);border:1px solid rgba(148,163,184,.2);font-size:12px}
@media(max-width:640px){.rs-wrap{padding:22px 14px 60px}.rs-head h1{font-size:24px}}