/* ==========================================================================
   Mod Alpha — app styles (current screens, dark theme)
   The current design of every screen (classes .v22 / .v22-* and .ma-*), appended
   per release (look for the "v23.x —" section comments). Light theme: theme-light*.css.
   Loaded after base.css. Everything is scoped to .v22 / .v22-* classes.
   ========================================================================== */
:root{
 --v-panel:#0a1330;--v-panel-2:#0c1738;--v-inner:#0b1532;--v-border:rgba(78,110,196,.28);--v-border-2:rgba(92,128,220,.36);
 --v-text:#eef3ff;--v-sub:#a7b3cf;--v-muted:#7d8bab;--v-green:#3ee089;--v-cyan:#2ed3f5;--v-blue:#3b82f6;--v-violet:#a855f7;--v-active:#3d55f5;
 --v-radius:14px;--v-font:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif
}
.v22,.v22 *{font-family:var(--v-font)}
.v22{color:var(--v-text);letter-spacing:0}
.v22-fund-ret b,.v22-metrics b,.v22-summary b,.v22-result-box b,.v22-kpi-txt b,.v22-akpi b,.v22-est b,.v22-stat3 b,.v22-tip b,.v22-axis,.v22 td,.v22-hero-stats b,.v22-dsum b{font-variant-numeric:tabular-nums}
.v22 h1,.v22 h2,.v22 h3{letter-spacing:-.01em;margin:0}
.v22 p{margin:0}
.v22-ic{width:18px;height:18px;flex:none;vertical-align:middle}
.v22 .pos{color:var(--v-green)!important}.v22 .neg{color:#fb7185!important}
.v22 .pos-soft{color:#a7f3c4!important}
.v22-muted{color:var(--v-muted);font-size:13px}
.v22-note{margin-top:18px;color:#6f7d9c;font-size:12px}
.v22-title h1{font-size:28px;font-weight:700;line-height:1.2}
.v22-title p{margin-top:8px;color:var(--v-sub);font-size:15px}
.v22-card{background:linear-gradient(180deg,rgba(14,25,60,.82),rgba(9,17,42,.9));border:1px solid var(--v-border);border-radius:var(--v-radius);padding:20px 22px;box-shadow:inset 0 1px 0 rgba(140,170,255,.05),0 18px 40px rgba(0,0,0,.25);min-width:0}
.v22-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:14px}
.v22-card-head h2,.v22-h2{font-size:18px;font-weight:700;color:#fff}
.v22-h2.sm{font-size:16px}
.v22-card-head p,.v22-sub{color:var(--v-sub);font-size:14px;margin-top:6px}
.v22-card-head a{color:#38c6f4;font-weight:600;font-size:14px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.v22-label{display:block;color:#c3cde6;font-size:14px;font-weight:500;margin-bottom:10px}
.v22-tags{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.v22-tags span{background:#16285e;border:1px solid #2a4590;color:#c7d6ff;font-size:12px;font-weight:500;padding:4px 10px;border-radius:7px;line-height:1.2}

/* pills / buttons */
.v22-pills{display:flex;gap:8px;flex:none}
.v22-pills button{min-width:44px;height:34px;padding:0 12px;border-radius:8px;border:1px solid var(--v-border-2);background:#0d1838;color:#c8d3ee;font-size:13px!important;font-weight:600}
.v22-pills button:hover{border-color:#5b7cff;color:#fff}
.v22-pills button.active{background:linear-gradient(135deg,#4767ff,#5a4dff);border-color:#7088ff;color:#fff;box-shadow:0 0 18px rgba(80,100,255,.45)}
.v22-grad-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 22px;border:0;border-radius:10px;background:linear-gradient(90deg,#3b82f6,#7c5cfa 55%,#b44cf2);color:#fff;font-weight:600;font-size:15px!important;box-shadow:0 8px 26px rgba(99,102,241,.35);transition:filter .15s,transform .15s}
.v22-grad-btn:hover{filter:brightness(1.1);transform:translateY(-1px)}
.v22-grad-btn.wide{width:100%}.v22-grad-btn.lg{height:52px;font-size:16px!important}
.v22-ghost-btn{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 20px;border-radius:10px;border:1px solid var(--v-border-2);background:rgba(9,16,38,.8);color:#fff;font-weight:600;font-size:15px!important}
.v22-ghost-btn.lg{height:56px;padding:0 24px;font-size:17px!important}
.v22-ghost-btn .v22-ic{width:22px;height:22px}
.v22-outline-btn{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 16px;border-radius:8px;border:1px solid #3c6df0;background:rgba(20,40,100,.35);color:#cfe0ff;font-weight:600;font-size:14px!important;cursor:pointer}
.v22-outline-btn.sm{height:34px;font-size:13px!important;padding:0 12px}
.v22-outline-btn:hover{background:rgba(40,70,170,.45)}

/* inputs */
.v22-field{display:flex;align-items:center;gap:10px;height:46px;padding:0 12px 0 14px;border:1px solid var(--v-border-2);border-radius:10px;background:#081129;color:#9fb0d4;position:relative}
.v22-field:focus-within{border-color:#5b7cff;box-shadow:0 0 0 3px rgba(91,124,255,.18)}
.v22-field input{flex:1;min-width:0;background:transparent;border:0;outline:0;color:#fff;font-size:15px;font-weight:500;height:100%;padding:0}
.v22-rs{color:#d6def3;font-weight:600}
.v22-cal-btn{background:transparent;border:0;color:#c3cde6;padding:4px;display:grid;place-items:center;border-radius:6px}
.v22-cal-btn:hover{background:rgba(91,124,255,.15)}
.v22-hidden-date{position:absolute;right:8px;bottom:0;width:1px;height:1px;opacity:0;pointer-events:none;border:0;padding:0}
.v22-opts{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.v22-opts button{height:38px;min-width:60px;padding:0 16px;border-radius:9px;border:1px solid var(--v-border-2);background:#0d1838;color:#dbe4fb;font-size:14px!important;font-weight:600}
.v22-opts button:hover{border-color:#5b7cff}
.v22-opts button.soft{background:#142250}
.v22-opts button.active{background:linear-gradient(135deg,#3346d9,#4a3fe0);border-color:#7c8cff;color:#fff;box-shadow:0 0 16px rgba(80,90,255,.45)}
.v22-opts.sm button{height:34px;min-width:0;padding:0 12px;font-size:13px!important}

/* ---------- Charts ---------- */
.v22-chart{position:relative;width:100%}
.v22-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.v22-grid{stroke:rgba(110,140,210,.13);stroke-width:1}
.v22-grid.v{stroke-dasharray:3 5;stroke:rgba(110,140,210,.12)}
.v22-axisline{stroke:rgba(120,150,220,.35);stroke-width:1.2}
.v22-axis{fill:#9eabc8;font-size:13px;font-family:var(--v-font);font-weight:500}
.v22-line{filter:drop-shadow(0 0 6px var(--glow))}
.v22-enddot{filter:drop-shadow(0 0 8px var(--glow))}
.v22-ov{position:absolute;pointer-events:none}
.v22-tip{background:rgba(9,16,40,.94);border:1px solid #42528a;border-radius:10px;padding:8px 12px;display:grid;gap:2px;box-shadow:0 10px 30px rgba(0,0,0,.4);white-space:nowrap}
.v22-tip small{color:#b8c3de;font-size:12px}.v22-tip b{font-size:18px;color:#fff;font-weight:700}.v22-tip strong{font-size:17px;color:var(--v-green);font-weight:700}
.v22-tip-left{transform:translate(calc(-100% - 14px),-30%)}
.v22-tip-up{transform:translate(-90%,calc(-100% - 14px))}
.v22-multi-tip{background:rgba(8,14,36,.9);border:1px solid #2e3d6e;border-radius:10px;padding:10px 14px;display:grid;gap:6px;min-width:250px;box-shadow:0 12px 30px rgba(0,0,0,.35)}
.v22-multi-tip small{color:#9fb0d4;font-size:13px}
.v22-multi-tip div{display:flex;align-items:center;gap:9px;font-size:14px;color:#e7edff}
.v22-multi-tip div span{flex:1}.v22-multi-tip div b{color:var(--v-green);font-weight:700}
.v22-multi-tip i,.v22-legend i,.v22-other i{width:10px;height:10px;border-radius:50%;background:var(--c);display:inline-block;box-shadow:0 0 8px var(--c);flex:none}
.v22-multi-tip.compact{min-width:0;padding:8px 12px;gap:4px}.v22-multi-tip.compact div{font-size:12.5px}.v22-multi-tip.compact small{font-size:12.5px;color:#e3e9fb}
.v22-legend{display:flex;gap:22px;flex-wrap:wrap;color:#c9d3ec;font-size:13px}
.v22-legend span{display:inline-flex;align-items:center;gap:8px}
.v22-legend.left{margin:4px 0 6px}
.v22-legend.center{justify-content:center;margin:-4px 0 4px}
.v22-legend.sq i{border-radius:3px;box-shadow:none}
.v22-badge{transform:translate(12px,-50%);padding:6px 12px;border-radius:8px;font-weight:700;font-size:15px;color:#fff;white-space:nowrap}
.v22-badge.cyan{background:linear-gradient(135deg,#1aa4f0,#2f7cf6);box-shadow:0 0 18px rgba(46,170,245,.6)}
.v22-badge.purple{background:linear-gradient(135deg,#8b3df0,#b44cf2);box-shadow:0 0 18px rgba(170,80,245,.55)}
.v22-badge.lg{font-size:14px;padding:6px 10px}
.v22-spark{width:100%;height:100%;display:block}

/* ======================================================================
   Explore
   ====================================================================== */
.v22-explore .v22-title h1{font-size:28px}
.v22-explore-tools{display:grid;grid-template-columns:1fr 200px;gap:12px;margin-top:22px}
.v22-search{display:flex;align-items:center;gap:12px;height:48px;padding:0 14px 0 16px;border:1px solid var(--v-border-2);border-radius:10px;background:#0a1430;color:#c3cde6}
.v22-search:focus-within{border-color:#5b7cff}
.v22-search input{flex:1;background:transparent;border:0;outline:0;color:#fff;font-size:15px;min-width:0}
.v22-search input::placeholder{color:#7f8db0}
.v22-search button{background:transparent;border:0;color:#6c7a99;display:grid;place-items:center;padding:4px}
.v22-select{position:relative;display:block}
.v22-select select{appearance:none;width:100%;height:48px;border:1px solid var(--v-border-2);border-radius:10px;background:#0a1430;color:#e6ecfb;font-size:14px;font-weight:500;padding:0 38px 0 16px}
.v22-select .v22-ic{position:absolute;right:14px;top:15px;pointer-events:none;color:#c3cde6}
.v22-chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.v22-chips button{height:40px;padding:0 16px;border-radius:9px;border:1px solid var(--v-border-2);background:#0b1636;color:#dbe4fb;font-size:14px!important;font-weight:500}
.v22-chips button:hover{border-color:#5b7cff}
.v22-chips button.active{background:linear-gradient(135deg,#2950e0,#2f46c9);border-color:#5e86ff;color:#fff;box-shadow:0 0 16px rgba(60,100,255,.45)}
.v22-sort{display:flex;align-items:center;gap:10px;margin:20px 0 10px;color:#e6ecfb;font-weight:600;font-size:16px}
.v22-fund-list{display:grid;gap:0;border:1px solid var(--v-border);border-radius:var(--v-radius);background:rgba(9,17,42,.6);overflow:hidden}
.v22-fund-row{display:grid;grid-template-columns:minmax(0,38%) 150px 160px 1fr 128px;align-items:center;gap:0 18px;padding:14px 18px;border-top:1px solid var(--v-border);background:linear-gradient(90deg,rgba(16,28,66,.55),rgba(10,18,44,.45))}
.v22-fund-row:first-child{border-top:0}
.v22-fund-row:hover{background:linear-gradient(90deg,rgba(26,44,100,.6),rgba(12,22,54,.5))}
.v22-fund-id{display:flex;align-items:center;gap:16px;min-width:0}
.v22-fund-id b{display:block;font-size:16px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v22-fund-icon{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--fc);box-shadow:0 0 0 3px rgba(255,255,255,.04),0 0 14px color-mix(in srgb,var(--fc) 55%,transparent);flex:none}
.v22-fund-icon svg{width:20px;height:20px}
.v22-fund-icon.is-trophy{background:#1a2033;color:#f4b72f}
.v22-fund-icon.is-trophy .v22-ic{width:20px;height:20px;stroke:#f4b72f}
.v22-spark-box{grid-column:2;height:56px;border:1px solid var(--v-border);border-radius:8px;background:#070f26;padding:4px 6px}
.v22-fund-ret b{display:block;font-size:22px;font-weight:700;color:var(--v-green);line-height:1.1}
.v22-fund-ret small{color:#aab6d2;font-size:13px;font-weight:500;letter-spacing:.02em}
.v22-view{grid-column:5;height:46px;border-radius:9px;border:1px solid #2f4fae;background:linear-gradient(180deg,#132a70,#0f2160);color:#fff;font-weight:600;font-size:15px!important;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.v22-view:hover{border-color:#5b7cff;box-shadow:0 0 16px rgba(80,110,255,.35)}
.v22-empty{padding:30px;text-align:center;color:var(--v-sub)}
.v22-pager{display:flex;justify-content:center;gap:10px;margin-top:20px}
.v22-pager button{width:38px;height:38px;border-radius:8px;border:1px solid var(--v-border-2);background:#0b1636;color:#dbe4fb;font-weight:600;font-size:14px!important;display:grid;place-items:center}
.v22-pager button.active{background:linear-gradient(135deg,#4767ff,#5a4dff);border-color:#7088ff;color:#fff;box-shadow:0 0 16px rgba(80,100,255,.5)}
.v22-pager button:disabled{opacity:.4;cursor:default}

/* ======================================================================
   Fund detail
   ====================================================================== */
.v22-detail-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.v22-detail-id{display:flex;gap:18px;align-items:flex-start}
.v22-detail-avatar{width:52px;height:52px;border-radius:50%;background:var(--fc);display:grid;place-items:center;box-shadow:0 0 22px color-mix(in srgb,var(--fc) 50%,transparent);flex:none;margin-top:2px}
.v22-detail-avatar svg{width:30px;height:30px}
.v22-detail-id h1{font-size:28px;font-weight:700;line-height:1.2}
.v22-detail-id .v22-tags span{font-size:14px;padding:6px 14px;border-radius:8px}
.v22-watch{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 22px;border-radius:10px;border:1.5px solid #3c6df0;background:rgba(14,28,72,.6);color:#dfe8ff;font-weight:600;font-size:15px!important}
.v22-watch .v22-ic{color:#4f8bff;width:20px;height:20px}
.v22-watch:hover{background:rgba(40,70,170,.45)}
.v22-tabs{display:flex;margin-top:20px;width:min(100%,860px);border:1px solid var(--v-border);border-radius:10px;background:#0a1330;overflow:hidden}
.v22-tabs button{flex:1;height:46px;border:0;border-right:1px solid var(--v-border);background:transparent;color:#c9d3ec;font-size:14px!important;font-weight:500}
.v22-tabs button:last-child{border-right:0}
.v22-tabs button.active{background:linear-gradient(180deg,#183482,#122660);color:#fff;font-weight:600;box-shadow:inset 0 -2px 0 #4f8bff}
.v22-metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:14px}
.v22-metrics article,.v22-summary article{background:linear-gradient(180deg,rgba(14,25,60,.82),rgba(9,17,42,.9));border:1px solid var(--v-border);border-radius:12px;padding:18px 12px;text-align:center}
.v22-metrics b{display:block;font-size:26px;font-weight:700;color:var(--v-green);line-height:1.15}
.v22-metrics small{display:block;margin-top:8px;color:#b9c4df;font-size:14px}
.v22-perf{margin-top:14px;padding:22px 22px 14px}
.v22-perf .v22-card-head h2{font-size:20px}
.v22-summary{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:14px}
.v22-summary article{text-align:left;padding:18px 20px}
.v22-summary b{display:block;font-size:24px;font-weight:700;line-height:1.15}
.v22-summary small{display:inline-block;margin-top:10px;color:#c2cce4;font-size:14px}
.v22-summary small.ul{border-bottom:2px solid #6d5bf6;padding-bottom:3px}
.v22 .lav{color:#c4b5fd}.v22 .vio{color:#b78cff}.v22 .sky{color:#60b8ff}
.v22-table{width:100%;border-collapse:collapse;font-size:14px}
.v22-table th{color:#93a3c6;font-weight:500;text-align:left;padding:10px 12px;border-bottom:1px solid var(--v-border)}
.v22-table td{padding:12px;border-bottom:1px solid rgba(78,110,196,.15);color:#e3e9fb}
.v22-info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0 28px;margin-top:12px}
.v22-info-grid div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid rgba(78,110,196,.18);font-size:14px}
.v22-info-grid span{color:var(--v-sub)}.v22-info-grid b{font-weight:600;text-align:right}
.v22-detail #fund-tab-content>.v22-card:first-child,.v22-detail #fund-tab-content>.v22-insight-row{margin-top:14px}

/* ======================================================================
   What If
   ====================================================================== */
.v22-two{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:22px}
.v22-three{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;margin-top:22px}
.v22-input-card{padding:18px 20px 20px}
.v22-input-card .v22-field{max-width:420px}
.v22-two .v22-input-card:last-child .v22-field{max-width:none}
.v22-journey-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:16px;margin-top:16px}
.v22-journey-grid .v22-h2{margin-bottom:6px}
.v22-results{display:flex;flex-direction:column}
.v22-result-box{margin-top:14px;border:1px solid var(--v-border);border-radius:10px;background:rgba(7,14,36,.55);flex:1;display:flex;flex-direction:column}
.v22-result-box>div{flex:1;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 16px;border-top:1px solid var(--v-border)}
.v22-result-box>div:first-child{border-top:0}
.v22-result-box span{color:#c8d2ea;font-size:15px;line-height:1.35}
.v22-result-box b{color:#fff;font-size:20px;font-weight:700;text-align:right}
.v22-result-box b small{display:block;font-size:11.5px;font-weight:600;margin-top:2px}
.v22-insight-row{display:grid;grid-template-columns:96px 1fr;gap:14px;margin-top:16px}
.v22-insight-logo{border:1px solid var(--v-border);border-radius:12px;background:linear-gradient(180deg,rgba(14,25,60,.82),rgba(9,17,42,.9));display:grid;place-items:center;padding:14px}
.v22-insight-logo .v22-mark{width:50px;height:50px;padding:10px;border-radius:12px;background:linear-gradient(135deg,#6d5bf6,#3b82f6);box-shadow:0 0 22px rgba(109,91,246,.6)}
.v22-insight-logo .v22-mark path{fill:#fff}
.v22-insight-body{border:1px solid rgba(140,100,255,.35);border-radius:12px;background:linear-gradient(90deg,rgba(60,40,140,.45),rgba(40,30,110,.35));padding:16px 22px}
.v22-insight-body b{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:600;color:#e9e4ff}
.v22-insight-body b .v22-ic{color:#c4b5fd;width:16px;height:16px}
.v22-insight-body p{margin-top:8px;color:#e3e6f6;font-size:15px;line-height:1.55;padding-left:88px}

/* ======================================================================
   SIP
   ====================================================================== */
.v22-sip-grid{display:grid;grid-template-columns:2.15fr 1fr;gap:16px;margin-top:16px}
.v22-sip-grid .v22-card-head{align-items:center}
.v22-result-box.tall>div{padding:14px 16px}

/* ======================================================================
   Dashboard
   ====================================================================== */
.v22-welcome{display:flex;justify-content:space-between;align-items:flex-end;gap:20px}
.v22-welcome h1{font-size:28px;font-weight:700}
.v22-welcome p{margin-top:6px;color:var(--v-sub);font-size:15px}
.v22-ask{display:flex;align-items:center;gap:12px;width:min(460px,45%);height:50px;padding:0 6px 0 16px;border:1px solid #4b4fd6;border-radius:12px;background:rgba(20,22,70,.6);color:#9a8cff;box-shadow:0 0 22px rgba(90,80,255,.18)}
.v22-ask input{flex:1;background:transparent;border:0;outline:0;color:#fff;font-size:14px;min-width:0}
.v22-ask button{width:38px;height:38px;border-radius:50%;border:0;background:linear-gradient(135deg,#4f6bff,#8b5cf6);color:#fff;display:grid;place-items:center}
.v22-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:20px}
.v22-kpis article{display:flex;gap:14px;align-items:flex-start;padding:18px;border:1px solid var(--v-border);border-radius:var(--v-radius);background:linear-gradient(180deg,rgba(14,25,60,.82),rgba(9,17,42,.9));min-width:0}
.v22-kpi-txt{min-width:0}
.v22-kpi-txt small{display:block;color:#c8d2ea;font-size:13px;font-weight:600;line-height:1.3}
.v22-kpi-txt small em{display:block;font-style:normal;font-weight:400;color:var(--v-muted);font-size:12px}
.v22-kpi-txt b{display:block;font-size:26px;font-weight:700;color:var(--v-green);margin-top:8px;line-height:1.1}
.v22-kpi-txt>span{display:block;margin-top:6px;color:#c8d2ea;font-size:12.5px}
.v22-kpi-txt>span i{font-style:normal;color:#7fa6ff;margin-left:4px}
.v22-tile{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;flex:none;border:1px solid rgba(255,255,255,.06)}
.v22-tile .v22-ic{width:21px;height:21px}
.v22-tile.lg{width:52px;height:52px;border-radius:13px}.v22-tile.lg .v22-ic{width:26px;height:26px}
.v22-tile.gold{background:rgba(245,180,40,.14);color:#f5b42a}
.v22-tile.amber{background:rgba(245,170,40,.14);color:#fbbf24}
.v22-tile.violet{background:rgba(160,80,250,.16);color:#c084fc}
.v22-tile.purple{background:rgba(120,80,250,.2);color:#a78bfa}
.v22-tile.blue{background:rgba(59,130,246,.18);color:#4f9bff}
.v22-tile.teal{background:rgba(20,200,180,.15);color:#2dd4bf}
.v22-tile.green{background:rgba(34,197,94,.15);color:#3ee089}
.v22-dash-top{display:grid;grid-template-columns:1.08fr 1fr;gap:16px;margin-top:16px}
.v22-perf-card{padding:22px 22px 12px}
.v22-cal-card{padding:20px}
.v22-cal-card .v22-card-head{align-items:center}
.v22-i{display:inline-flex;color:#9fb0d4;margin-left:4px}.v22-i .v22-ic{width:18px;height:18px}
.v22-month{display:flex;align-items:center;gap:6px}
.v22-month button{width:34px;height:36px;border-radius:8px;border:1px solid var(--v-border-2);background:#0b1636;color:#dbe4fb;display:grid;place-items:center}
.v22-month b{height:36px;display:flex;align-items:center;padding:0 12px;border:1px solid var(--v-border-2);border-radius:8px;background:#0b1636;font-size:13px;font-weight:500;white-space:nowrap}
.v22-cal-wrap{display:grid;grid-template-columns:1fr 230px;gap:12px}
.v22-cal-card .v22-card-head h2{font-size:17px;white-space:nowrap}
.v22-best-date{white-space:nowrap;font-size:14px!important}
.v22-perf-card,.v22-cal-card{display:flex;flex-direction:column}
#v22-dash-chart{flex:1;display:flex;align-items:center}
.v22-cal{border:1px solid var(--v-border);border-radius:12px;background:rgba(7,14,36,.55);padding:12px 8px}
.v22-cal-week,.v22-cal-days{display:grid;grid-template-columns:repeat(7,1fr);text-align:center}
.v22-cal-week span{color:#c8d2ea;font-size:12.5px;font-weight:500;padding:4px 0 8px}
.v22-cal-days span{height:38px;display:grid;place-items:center;font-size:14px;font-weight:500;color:#e6ecfb;position:relative;z-index:0}
.v22-cal-days span.mute{color:#56627f}
.v22-cal-days span.sel::before,.v22-cal-days span.good::before{content:"";position:absolute;width:32px;height:32px;border-radius:50%;z-index:-1;left:50%;top:50%;transform:translate(-50%,-50%)}
.v22-cal-days span.sel{color:#fff;font-weight:700}
.v22-cal-days span.sel::before{background:linear-gradient(135deg,#3b6cff,#4b4fe0);box-shadow:0 0 0 3px #0a1330,0 0 0 5px #4e78ff,0 0 18px rgba(80,120,255,.7)}
.v22-cal-days span.good::before{background:rgba(20,150,110,.35);border:1px solid rgba(62,224,137,.5)}
.v22-cal-days span.good{color:#a9f5cb;font-weight:600}
.v22-cal-days span.good.pink::before{background:rgba(236,72,153,.22);border-color:rgba(244,114,182,.5)}.v22-cal-days span.good.pink{color:#fbcfe8}
.v22-cal-days span.good.purple::before{background:rgba(168,85,247,.25);border-color:rgba(192,132,252,.5)}.v22-cal-days span.good.purple{color:#e9d5ff}
.v22-cal-side{display:grid;gap:10px;align-content:start}
.v22-best,.v22-other{border:1px solid var(--v-border);border-radius:12px;background:rgba(7,14,36,.55);padding:14px}
.v22-best-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.v22-best-date{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px}
.v22-best-date i{width:12px;height:12px;border-radius:50%;border:3px solid var(--v-green);box-shadow:0 0 8px var(--v-green)}
.v22-best-top em{font-style:normal;background:rgba(34,197,94,.18);color:var(--v-green);font-size:12px;font-weight:600;padding:4px 8px;border-radius:6px}
.v22-best p{margin-top:10px;color:#c8d2ea;font-size:13px;line-height:1.45}
.v22-best strong{display:block;margin:8px 0 12px;color:var(--v-green);font-size:20px;font-weight:700}
.v22-best strong small{font-size:12px;color:#c8d2ea;font-weight:400}
.v22-best .v22-grad-btn{width:100%;height:40px;font-size:14px!important}
.v22-other>b{display:block;font-size:13px;font-weight:500;color:#c8d2ea;margin-bottom:6px}
.v22-other div{display:flex;align-items:center;gap:10px;font-size:13.5px;padding:5px 0}
.v22-other div span{flex:1}.v22-other div b{color:var(--v-green);font-weight:600}
.v22-dash-bottom{display:grid;grid-template-columns:1.3fr 1.25fr 1fr;gap:16px;margin-top:16px;align-items:stretch}
.v22-dash-bottom .v22-card{display:flex;flex-direction:column}
.v22-dash-bottom .v22-h2{font-size:18px}
.v22-dash-bottom .v22-sub{font-size:13px;margin-top:6px}
.v22-mini-inputs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.v22-mini-box{border:1px solid var(--v-border);border-radius:10px;padding:12px;background:rgba(7,14,36,.5);min-width:0}
.v22-mini-box .v22-label{font-size:13px;margin-bottom:8px}
.v22-mini-box .v22-field{height:40px;padding:0 8px 0 10px;gap:8px}
.v22-mini-box .v22-field input{font-size:14px}
.v22-mini-box .v22-ic{width:16px;height:16px}
.v22-mini-box .v22-opts{gap:6px;margin-top:10px}
.v22-mini-box .v22-opts button{flex:1;padding:0 6px}
.v22-est{display:grid;grid-template-columns:1.3fr .9fr .7fr .9fr;gap:8px;align-items:end;margin:14px 0;padding:16px;border:1px solid #2f4fae;border-radius:12px;background:rgba(10,22,60,.55)}
.v22-est small{display:block;color:#c8d2ea;font-size:13px;margin-bottom:6px}
.v22-est b{font-size:19px;font-weight:700;white-space:nowrap}
.v22-est-main b{font-size:26px}
.v22-est .sep{border-left:1px solid var(--v-border);padding-left:12px}
.v22-mini-whatif .v22-grad-btn,.v22-mini-sip .v22-grad-btn{margin-top:auto}
.v22-mini-sip .v22-chart{margin:4px 0 8px}
.v22-mini-sip .v22-axis{font-size:12px}
.v22-stat3{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--v-border);border-radius:10px;background:rgba(7,14,36,.5);margin-bottom:12px}
.v22-stat3 div{text-align:center;padding:12px 6px;border-left:1px solid var(--v-border)}
.v22-stat3 div:first-child{border-left:0}
.v22-stat3 b{display:block;font-size:20px;font-weight:700}
.v22-stat3 small{display:block;margin-top:6px;font-size:12px;color:#c8d2ea;line-height:1.35}
.v22-insights .v22-card-head{margin-bottom:8px}
.v22-ins{display:grid;grid-template-columns:44px 1fr;gap:12px;padding:12px;border:1px solid var(--v-border);border-radius:10px;background:rgba(7,14,36,.5);margin-top:10px}
.v22-ins-top{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.v22-ins-top b{font-size:13.5px;font-weight:600}
.v22-ins-top small{color:var(--v-muted);font-size:11.5px;white-space:nowrap}
.v22-ins p{margin-top:5px;color:#b3bfdb;font-size:12.5px;line-height:1.5}

/* floating assistant */
.chat-fab.v22-fab{width:auto;height:auto;padding:0;border:0;background:transparent;box-shadow:none;display:flex;flex-direction:column;align-items:center;gap:0}
.v22-fab-bot{width:70px;height:70px;border-radius:50%;background:radial-gradient(circle at 50% 40%,#1e3a8a,#0b1022 70%);border:2px solid rgba(96,165,250,.6);box-shadow:0 0 26px rgba(80,140,255,.55);display:grid;place-items:center;overflow:hidden}
.v22-fab-bot svg{width:58px;height:58px;margin-top:6px}
.v22-fab-dot{position:absolute;top:4px;right:4px;width:12px;height:12px;border-radius:50%;background:#f43f5e;border:2px solid #0b1022}
.v22-fab-label{margin-top:-8px;padding:4px 10px;border-radius:12px;background:rgba(15,25,60,.95);border:1px solid var(--v-border-2);color:#e6ecfb;font-size:12px;font-weight:600;white-space:nowrap;font-family:var(--v-font)}

/* ======================================================================
   Login
   ====================================================================== */
.v22-auth{position:relative;min-height:calc(var(--vh100,100vh) - 72px);display:grid;place-items:center;padding:56px 16px 80px;overflow:hidden}
.v22-auth-bg{position:absolute;inset:0;z-index:0}
.v22-auth-bg svg{width:100%;height:100%}
.v22-auth-card{position:relative;z-index:1;width:min(440px,100%);padding:30px 28px 24px;border-radius:18px;border:1px solid rgba(100,130,220,.28);background:linear-gradient(180deg,rgba(18,28,64,.88),rgba(12,20,48,.92));backdrop-filter:blur(14px);box-shadow:0 30px 80px rgba(0,0,0,.45),inset 0 1px 0 rgba(160,190,255,.07);text-align:center}
.v22-auth-brand{display:flex;align-items:center;justify-content:center;gap:10px}
.v22-auth-brand b{font-size:22px;font-weight:700}
.v22-auth h1{margin-top:16px;font-size:26px;font-weight:700}
.v22-auth-card>p{margin-top:8px;color:#c3cde6;font-size:14px}
.v22-seg{display:grid;grid-template-columns:1fr 1fr;margin-top:22px;border:1px solid var(--v-border);border-radius:10px;background:#0a1330;overflow:hidden}
.v22-seg button{height:42px;border:0;background:transparent;color:#e6ecfb;font-weight:600;font-size:14px!important}
.v22-seg button.active{background:linear-gradient(90deg,#1e2f9a,#2a3fc6);color:#fff;border-radius:9px}
#auth-form{display:grid;gap:12px;margin-top:14px;text-align:left}
.v22-auth-in{display:flex;align-items:center;gap:12px;height:48px;padding:0 14px;border:1px solid var(--v-border-2);border-radius:10px;background:#0a1330;color:#b8c3de}
.v22-auth-in:focus-within{border-color:#5b7cff;box-shadow:0 0 0 3px rgba(91,124,255,.18)}
.v22-auth-in input{flex:1;background:transparent;border:0;outline:0;color:#fff;font-size:15px;min-width:0}
.v22-auth-in input::placeholder{color:#8b97b5}
.v22-eye{background:transparent;border:0;color:#c3cde6;padding:4px;display:grid;place-items:center}
.v22-eye.on{color:#60a5fa}
.v22-auth-opts{display:flex;justify-content:space-between;align-items:center;font-size:14px;color:#d6def3;margin:2px 0 6px}
.v22-auth-opts label{display:flex;align-items:center;gap:8px}
.v22-auth-opts input{width:16px;height:16px;accent-color:#3b82f6}
.v22-auth-opts button{background:transparent;border:0;color:#4ea8ff;font-weight:600;font-size:14px!important;padding:0}
.v22-err{color:#fb7185;font-size:13px;min-height:0}
.v22-err:empty{display:none}
.v22-or{display:flex;align-items:center;gap:12px;margin:20px 0 14px;color:#8b97b5;font-size:13px}
.v22-or::before,.v22-or::after{content:"";flex:1;height:1px;background:var(--v-border)}
.v22-social{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.v22-social button{height:52px;border-radius:10px;border:1px solid var(--v-border-2);background:#0a1330;color:#fff;font-weight:600;font-size:15px!important;display:flex;align-items:center;justify-content:center;gap:12px}
.v22-social button:hover{border-color:#5b7cff}
.v22-auth-foot{margin-top:20px;color:#d6def3;font-size:14px}
.v22-auth-foot button{background:transparent;border:0;color:#4ea8ff;font-weight:600;text-decoration:underline;text-underline-offset:3px;font-size:14px!important;padding:0}
.v22-auth-guest{margin-top:10px;font-size:12px;color:#7d8bab;display:flex;gap:8px;justify-content:center}
.v22-auth-guest a{color:#9fb0d4;text-decoration:underline;text-underline-offset:3px}

/* ======================================================================
   Landing hero
   ====================================================================== */
.v22-landing{font-family:var(--v-font)}
.v22-landing .v22-hero,.v22-landing .v22-how{font-family:var(--v-font)}
.v22-hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:640px;padding:44px 5.5% 40px;overflow:hidden;background:radial-gradient(ellipse at 80% 30%,rgba(67,56,202,.28),transparent 55%),radial-gradient(ellipse at 10% 90%,rgba(37,99,235,.18),transparent 50%)}
.v22-hero-copy{position:relative;z-index:2;align-self:center}
.v22-hero-badge{display:inline-flex;align-items:center;gap:10px;height:42px;padding:0 16px;border-radius:9px;border:1px solid rgba(56,189,248,.55);background:rgba(10,30,70,.55);color:#5cc8ff;font-size:16px;font-weight:600;box-shadow:0 0 18px rgba(56,189,248,.18)}
.v22-hero-badge .v22-ic{color:#c7d2fe;width:18px;height:18px}
.v22-hero h1{margin:26px 0 0;font-size:clamp(42px,4.5vw,68px);line-height:1.1;font-weight:800;letter-spacing:-.025em;color:#fff}
.v22-hero .g-cyan{background:linear-gradient(90deg,#5ee0ff,#3b9bff);-webkit-background-clip:text;background-clip:text;color:transparent}
.v22-hero .g-violet{background:linear-gradient(90deg,#a78bfa,#8b5cf6);-webkit-background-clip:text;background-clip:text;color:transparent}
.v22-hero p{margin-top:26px;max-width:600px;color:#d9e1f5;font-size:clamp(16px,1.35vw,19px);line-height:1.6}
.v22-hero-actions{display:flex;gap:16px;margin-top:32px;flex-wrap:wrap}
.v22-hero-actions .v22-grad-btn.lg{height:56px;padding:0 26px;font-size:17px!important;background:linear-gradient(90deg,#4f6bff,#8b5cf6)}
.v22-hero-stats{display:grid;grid-template-columns:repeat(4,auto);justify-content:start;gap:16px 64px;margin-top:64px}
.v22-hero-stats b{display:block;font-size:clamp(24px,2.1vw,30px);font-weight:700;color:#3cc7f5}
.v22-hero-stats small{display:block;margin-top:8px;color:#d6def3;font-size:15px}
.v22-hero-art{position:absolute;right:0;top:0;bottom:0;width:62%;z-index:1;pointer-events:none}
.v22-hero-art>svg{position:absolute;inset:0;width:100%;height:100%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 22%);mask-image:linear-gradient(90deg,transparent,#000 22%)}
.v22-hero-line{filter:drop-shadow(0 0 8px #3b82f6) drop-shadow(0 0 16px rgba(59,130,246,.6))}
.v22-node{filter:drop-shadow(0 0 6px #22d3ee)}
.v22-float{position:absolute;border:1px solid rgba(100,140,240,.45);background:rgba(10,18,48,.82);border-radius:10px;color:#e6ecfb;backdrop-filter:blur(6px);box-shadow:0 10px 30px rgba(0,0,0,.35)}
.v22-float.f1{right:8%;top:15%;padding:14px 22px}
.v22-float.f1 b{display:flex;align-items:center;gap:8px;color:#4ade80;font-size:22px;font-weight:700}
.v22-float.f1 small{display:block;margin-top:4px;color:#d6def3;font-size:14px;line-height:1.35}
.v22-float.f2{right:24%;top:35%;display:flex;align-items:center;gap:14px;padding:14px 20px;font-size:15px;font-weight:500;line-height:1.35}
.v22-float-ic{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#4f46e5,#1e1b6b);color:#a5b4fc;box-shadow:0 0 14px rgba(99,102,241,.6)}
.v22-robot{position:absolute;right:1%;bottom:-6%;width:clamp(170px,17vw,250px)}
.v22-robot svg{width:100%;height:auto;filter:drop-shadow(0 0 30px rgba(80,140,255,.45))}
.v22-eye{filter:drop-shadow(0 0 8px #22d3ee)}

/* ======================================================================
   How Mod Alpha Works
   ====================================================================== */
.v22-how{position:relative;padding:72px 3% 56px;background:radial-gradient(ellipse at 50% 0%,rgba(59,70,200,.22),transparent 55%),radial-gradient(ellipse at 100% 60%,rgba(120,60,220,.14),transparent 45%)}
.v22-how-head{text-align:center}
.v22-how-badge{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 20px;border-radius:22px;border:1px solid rgba(120,110,255,.6);background:rgba(25,25,80,.6);color:#e5e7ff;font-weight:700;font-size:15px;letter-spacing:.02em;box-shadow:0 0 22px rgba(99,102,241,.3)}
.v22-how-badge .v22-ic{color:#7dd3fc}
.v22-how-head h2{margin:22px 0 0;font-size:clamp(36px,4.2vw,60px);font-weight:800;letter-spacing:-.02em;color:#fff}
.v22-how .g-blue{background:linear-gradient(90deg,#4f9bff,#8b5cf6);-webkit-background-clip:text;background-clip:text;color:transparent}
.v22-how-head p{margin-top:18px;color:#c9d3ec;font-size:clamp(15px,1.4vw,20px);line-height:1.55}
.v22-flow{display:grid;grid-template-columns:2.93fr 1.07fr 3.85fr .75fr 3.07fr .88fr 2.7fr .75fr 3.5fr;margin-top:50px;align-items:stretch}
.v22-stage{display:flex;flex-direction:column;min-width:0}
.v22-step-head{display:flex;gap:12px;min-height:150px;padding-right:6px}
.v22-step-no{width:38px;height:38px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:14px;font-weight:700;color:#fff;background:linear-gradient(135deg,#4f6bff,#8b5cf6);box-shadow:0 0 16px rgba(99,102,241,.6)}
.v22-step-head h3{font-size:16px;font-weight:700;line-height:1.3;color:#fff;margin-top:4px}
.v22-step-head p{margin-top:8px;color:#b9c4df;font-size:13px;line-height:1.55}
.v22-vis{flex:1;display:flex;align-items:center;justify-content:center;min-height:320px}
.v22-panel{border:1px solid rgba(90,120,210,.3);border-radius:16px;background:linear-gradient(180deg,rgba(16,26,60,.85),rgba(10,18,44,.9));box-shadow:0 20px 50px rgba(0,0,0,.35),inset 0 1px 0 rgba(160,190,255,.06);width:100%}
.v22-inputs{padding:10px;display:grid;gap:10px}
.v22-input{padding:9px 8px!important;gap:10px!important}
.v22-input{display:flex;gap:12px;align-items:center;padding:10px;border-radius:10px;background:rgba(20,32,72,.6);border:1px solid rgba(90,120,210,.18)}
.v22-in-ic{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;flex:none;color:var(--c);background:color-mix(in srgb,var(--c) 14%,#0b1022)}
.v22-in-ic .v22-ic{width:22px;height:22px}
.v22-input b{display:block;font-size:12.5px;white-space:nowrap;font-weight:600;color:#fff}
.v22-input b.blue{color:#60a5fa}
.v22-input small{display:block;margin-top:3px;color:#a7b3cf;font-size:12px}
.v22-conn{display:flex;align-items:center;justify-content:center;padding-top:150px;min-width:0}
.v22-conn svg{width:100%}
.v22-conn.fibers svg{height:300px}
.v22-fiber-base{fill:none;stroke:#3b82f6;stroke-opacity:.35;stroke-width:1.2}.v22-fiber-base.out{stroke:#8b5cf6}
.v22-fiber{fill:none;stroke:#7dd3fc;stroke-opacity:.95;stroke-width:1.6;stroke-dasharray:10 38;animation:v22Flow 1.6s linear infinite;animation-delay:var(--d);filter:drop-shadow(0 0 3px #3b82f6)}
.v22-fiber.out{stroke:#8b5cf6}
.v22-fdot{fill:#38bdf8;filter:drop-shadow(0 0 6px #38bdf8);animation:v22Pulse 2s ease-in-out infinite;animation-delay:var(--d)}
.v22-arrow{height:40px;filter:drop-shadow(0 0 8px rgba(56,189,248,.8))}
.v22-arrow-flow{stroke:#e0f2fe;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:6 18;animation:v22Flow 1s linear infinite}
@keyframes v22Flow{to{stroke-dashoffset:-48}}
@keyframes v22Pulse{50%{opacity:.35}}
.v22-engine{position:relative;width:100%;aspect-ratio:1/1.02;max-width:380px}
.v22-chip{position:absolute;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;border:1px solid rgba(120,130,240,.4);background:rgba(18,24,66,.85);color:#c4b5fd;z-index:2;box-shadow:0 8px 20px rgba(0,0,0,.3)}
.v22-chip b{font-size:13px;font-weight:500;color:#e6e9ff;line-height:1.25}
.v22-chip .v22-ic{width:22px;height:22px}
.v22-chip.tl{left:0;top:0}.v22-chip.tr{right:0;top:0}.v22-chip.bl{left:0;bottom:0}.v22-chip.br{right:0;bottom:0}
.v22-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:60%;aspect-ratio:1;border-radius:26px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:linear-gradient(160deg,#25307a,#191d5a 60%,#2a1f6e);border:2px solid rgba(140,150,255,.6);box-shadow:0 0 40px rgba(99,102,241,.7),0 0 90px rgba(99,102,241,.35),inset 0 0 30px rgba(140,150,255,.25);z-index:1}
.v22-core b{text-align:center;color:#fff;font-size:clamp(14px,1.3vw,19px);font-weight:700;line-height:1.25}
.v22-core-glow{position:absolute;inset:-18%;border-radius:40px;background:radial-gradient(circle,rgba(99,102,241,.35),transparent 65%);z-index:-1;animation:v22Pulse 3s ease-in-out infinite}
.v22-core .v22-mark{width:28%;height:auto}
.v22-engine-out{position:absolute;right:-16%;top:0;width:18%;height:100%}
.v22-month-an{padding:16px 18px;display:grid;gap:12px}
.v22-month-an>small{color:#a7b3cf;font-size:12px;font-weight:600;letter-spacing:.06em}
.v22-conf{display:flex;gap:12px;align-items:center;padding:10px 14px;border-radius:9px;background:rgba(40,50,80,.55);border-left:4px solid #6b7488}
.v22-conf b{display:block;font-size:15px;font-weight:600}
.v22-conf small{display:block;margin-top:2px;color:#b9c4df;font-size:12.5px}
.v22-conf.low{border-left-color:#e11d48;background:rgba(80,30,50,.45)}.v22-conf.low b,.v22-conf.low small{color:#fda4af}
.v22-conf.best{border:1.5px solid #34d399;border-left-width:1.5px;background:linear-gradient(90deg,#059669,#10b981);box-shadow:0 0 26px rgba(16,185,129,.55);transform:scale(1.04);margin:2px -4px}
.v22-conf.best b,.v22-conf.best small{color:#fff}
.v22-conf-ic{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.25);color:#fff}
.v22-phone-wrap{position:relative;width:100%;max-width:270px;display:flex;flex-direction:column;align-items:center}
.v22-phone{width:86%;height:250px;border-radius:30px 30px 0 0;border:3px solid #4b4fd6;border-bottom:0;background:linear-gradient(180deg,#131a40,#0b1030);box-shadow:0 0 30px rgba(99,102,241,.4);display:flex;flex-direction:column;align-items:center;padding:12px 16px;color:#fff}
.v22-phone-bar{display:flex;justify-content:space-between;width:100%;font-size:10px;color:#cbd5ff;align-items:center}
.v22-phone-bar i{width:60px;height:6px;border-radius:4px;background:#222a5a}
.v22-phone-lock{margin-top:14px;width:16px;height:16px;color:#cbd5ff}
.v22-phone-time{font-size:34px;font-weight:600;margin-top:6px}
.v22-phone-date{font-size:13px;color:#dbe2ff}
.v22-phone-bell{position:absolute;right:-6px;top:58px;width:58px;height:58px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#5b3df0,#3b2a9e);color:#fbbf24;box-shadow:0 0 20px rgba(120,80,250,.6);animation:v22Ring 2.4s ease-in-out infinite}
.v22-phone-bell .v22-ic{width:30px;height:30px;fill:#fbbf24;stroke:#f59e0b}
@keyframes v22Ring{0%,70%,100%{transform:rotate(0)}75%{transform:rotate(12deg)}85%{transform:rotate(-10deg)}}
.v22-notif{width:100%;margin-top:-92px;position:relative;z-index:2;display:flex;gap:10px;align-items:flex-start;padding:12px;border-radius:14px;background:#eef1fb;color:#111827;box-shadow:0 14px 34px rgba(0,0,0,.45);text-align:left}
.v22-notif.modal{margin:0 0 14px}
.v22-notif-logo{width:30px;height:30px;border-radius:8px;background:#141a3c;display:grid;place-items:center;flex:none}
.v22-notif-logo .v22-mark{width:20px;height:20px}
.v22-notif-top{display:flex;justify-content:space-between;align-items:center}
.v22-notif-top b{font-size:13px;color:#111827}.v22-notif-top small{color:#6b7280;font-size:11px}
.v22-notif .t{display:block;font-size:13px;font-weight:700;margin-top:2px;color:#111827}
.v22-notif p{font-size:11.5px;color:#374151;line-height:1.4;margin-top:3px}
.v22-channels{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px;width:100%}
.v22-channels div{text-align:center}
.v22-channels span{width:52px;height:52px;border-radius:12px;margin:0 auto;display:grid;place-items:center;background:rgba(20,32,72,.75);border:1px solid rgba(90,120,210,.3);color:var(--c)}
.v22-channels .v22-ic{width:26px;height:26px}
.v22-channels small{display:block;margin-top:8px;color:#d6def3;font-size:12.5px;line-height:1.3}
.v22-outcome{padding:16px;display:grid;gap:14px}
.v22-outcome-chart{position:relative}
.v22-outcome-chart svg{width:100%;height:auto;display:block}
.v22-oc-label{position:absolute;font-size:12.5px;font-weight:600;color:#fff;padding:6px 10px;border-radius:8px;background:rgba(12,22,60,.92);border:1px solid #3b82f6;line-height:1.3}
.v22-oc-label.top{right:12%;top:4%}
.v22-oc-label.fixed{right:0;bottom:22%;border-color:rgba(140,150,190,.45)}
.v22-oc-foot{display:flex;gap:14px;align-items:center;padding:14px;border-radius:12px;background:rgba(20,32,72,.6);border:1px solid rgba(90,120,210,.2)}
.v22-oc-foot span{color:#22c55e}.v22-oc-foot .v22-ic{width:34px;height:34px}
.v22-oc-foot p{font-size:13px;color:#c9d3ec;line-height:1.5}.v22-oc-foot p b{color:#fff;font-weight:600}
.v22-benefits{display:grid;grid-template-columns:repeat(5,1fr);margin-top:48px;padding:22px 10px;border:1px solid rgba(90,120,210,.25);border-radius:18px;background:rgba(12,20,48,.7)}
.v22-benefits>div{display:flex;gap:14px;align-items:center;padding:0 18px;border-left:1px solid rgba(90,120,210,.22)}
.v22-benefits>div:first-child{border-left:0}
.v22-benefits span{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;flex:none;color:var(--c);background:color-mix(in srgb,var(--c) 16%,#0b1022);box-shadow:0 0 18px color-mix(in srgb,var(--c) 25%,transparent)}
.v22-benefits .v22-ic{width:26px;height:26px}
.v22-benefits b{display:block;font-size:15px;font-weight:700;color:#fff}
.v22-benefits b.cyan{color:#38d2f5}.v22-benefits b.blue{color:#60a5fa}
.v22-benefits small{display:block;margin-top:4px;color:#b9c4df;font-size:13px;line-height:1.45}
.v22-how-replay{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:24px}
.v22-how-replay small{color:#6f7d9c;font-size:12px;text-align:center}
.v22-how-replay .v22-ghost-btn{height:40px;font-size:14px!important}
.v22-how-replay .v22-ghost-btn .v22-ic{width:16px;height:16px}
/* reveal animation (only once playing; content is visible by default) */
.v22-how.is-playing .v22-stage{animation:v22Rise .7s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i)*.45s)}
.v22-how.is-playing .v22-conn{animation:v22Fade .6s ease both;animation-delay:calc(var(--i)*.45s + .35s)}
.v22-how.is-playing .v22-benefits{animation:v22Rise .7s ease both;animation-delay:2.3s}
@keyframes v22Rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes v22Fade{from{opacity:0;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
@media (prefers-reduced-motion:reduce){.v22 *,.v22-how *{animation:none!important}}

/* feature cards icons */
.v22-feature-grid .feature-card>span{display:grid;place-items:center;color:#7cb3ff}
.v22-feature-grid .feature-card>span .v22-ic{width:20px;height:20px}

/* ======================================================================
   Admin + sidebar
   ====================================================================== */
.sidebar.v22-side nav{display:grid;gap:4px}
.sidebar.v22-side .nav-link{display:flex;align-items:center;gap:12px;height:auto;min-height:42px;padding:10px 12px;line-height:1.25;white-space:nowrap;font-family:var(--v-font);font-size:14px;font-weight:500;color:#dbe4fb;width:100%;text-align:left;background:transparent;border:1px solid transparent}
.sidebar.v22-side .nav-link .v22-ic{width:20px;height:20px;color:#c3cde6}
.sidebar.v22-side .nav-link.active{background:linear-gradient(90deg,#2f5ff0,#2443c4);border-color:#4f7bff;color:#fff;box-shadow:0 0 22px rgba(60,100,255,.4)}
.sidebar.v22-side .nav-link.active .v22-ic{color:#fff}
.sidebar.v22-side .nav-link{justify-content:flex-start}
.sidebar.v22-side .nav-link>span{flex:1;text-align:left}
.sidebar.v22-side .caret{width:16px;height:16px}
.v22-subnav{display:none;margin:0 0 4px 26px;border-left:1px solid rgba(120,150,220,.25);padding-left:12px}
.v22-subnav.open{display:grid;gap:2px}
.v22-subnav a{font-family:var(--v-font);font-size:14px;color:#c3cde6;padding:9px 8px;border-radius:8px;position:relative}
.v22-subnav a::before{content:"";position:absolute;left:-15px;top:50%;width:6px;height:1px;background:#6b7aa3}
.v22-subnav a:hover{background:rgba(60,90,180,.2);color:#fff}
.v22-back{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--v-border);border-radius:10px;background:rgba(12,22,54,.6);color:#dbe4fb;font-family:var(--v-font);font-size:14px;font-weight:500}
.sidebar.v22-side .logout-btn{display:flex;align-items:center;gap:10px}
.sidebar.v22-side .logout-btn .v22-ic{width:16px;height:16px}
.v22-admin-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.v22-admin-head h1{font-size:30px;font-weight:800}
.v22-admin-head p{margin-top:8px;color:#c3cde6;font-size:15px}
.v22-range{display:inline-flex;align-items:center;gap:12px;height:44px;padding:0 16px;border-radius:10px;border:1px solid var(--v-border-2);background:#0a1330;color:#e6ecfb;font-size:13.5px!important;font-weight:500;white-space:nowrap}
.v22-akpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:20px}
.v22-akpi{position:relative;display:grid;grid-template-columns:auto 1fr;gap:6px 14px;padding:18px 16px 14px;border:1px solid var(--v-border);border-radius:var(--v-radius);background:linear-gradient(180deg,rgba(14,25,60,.82),rgba(9,17,42,.9));overflow:hidden;min-width:0}
.v22-akpi>div:first-of-type{min-width:0}
.v22-akpi small{display:block;color:#e3e9fb;font-size:13.5px;font-weight:500}
.v22-akpi b{display:block;font-size:28px;font-weight:700;margin-top:6px;line-height:1.1}
.v22-akpi em{display:block;font-style:normal;color:var(--v-green);font-weight:700;font-size:17px}
.v22-akpi-row{display:flex;align-items:flex-end;gap:8px;margin-top:8px}
.v22-akpi-row>div:first-child{flex:none}
.v22-akpi-row>div:first-child span{display:block;color:#c3cde6;font-size:12px;margin-top:2px;white-space:nowrap}
.v22-akpi-ghost{position:absolute;right:14px;top:14px;opacity:.16;color:#9fb6ff}
.v22-akpi-ghost .v22-ic{width:34px;height:34px}
.v22-akpi-spark{flex:1;min-width:0;max-width:170px;margin-left:auto}
.v22-admin-charts{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.v22-admin-charts .v22-card{padding:18px 18px 10px}
.v22-admin-charts .v22-pills button{height:32px;min-width:42px}
.v22-admin-ops{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.v22-op-head{display:flex;gap:14px;align-items:flex-start}
.v22-op-head>div{flex:1;min-width:0}
.v22-op-head h2{font-size:18px;font-weight:700}
.v22-op-head p{margin-top:6px;color:#c3cde6;font-size:13.5px;line-height:1.5}
.v22-sipcfg-row{display:grid;grid-template-columns:1fr 1.15fr;gap:14px;margin-top:18px;align-items:stretch}
.v22-sipcfg-row>div:first-child{padding:12px 0}
.v22-sipcfg-note{border:1px solid rgba(45,212,160,.35);border-radius:12px;background:linear-gradient(135deg,rgba(14,80,80,.45),rgba(10,40,60,.5));padding:14px 16px;display:flex;flex-direction:column;gap:12px}
.v22-sipcfg-note p{color:#5eead4;font-size:13.5px;line-height:1.5}
.v22-sipcfg-note .v22-grad-btn{align-self:flex-end;height:40px;font-size:14px!important;background:linear-gradient(90deg,#5b5cf6,#8b5cf6)}
.v22-upcoming-t{display:block;margin-top:18px;font-size:15px;font-weight:600}
.v22-upcoming{display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;margin-top:10px;padding:10px 12px 10px 16px;border:1px solid var(--v-border);border-radius:10px;background:rgba(10,20,52,.6);font-size:13.5px}
.v22-upcoming .d{color:#60a5fa;font-weight:600}
.v22-upload .v22-outline-btn.sm{flex:none}
.v22-upload-row{display:grid;grid-template-columns:1.2fr 1fr;gap:14px;margin-top:16px}
.v22-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:20px 14px;border:1.5px dashed #3b5bc4;border-radius:12px;background:rgba(10,22,60,.45);text-align:center;cursor:pointer;transition:background .15s}
.v22-drop.over,.v22-drop:hover{background:rgba(30,60,150,.35)}
.v22-drop .up{width:36px;height:36px;color:#60a5fa;filter:drop-shadow(0 0 8px #3b82f6)}
.v22-drop b{color:#60a5fa;font-size:15.5px;font-weight:600}
.v22-drop small{color:#c3cde6;font-size:13px}.v22-drop u{color:#60a5fa;text-decoration:none}
.v22-drop .v22-outline-btn{margin-top:6px}
.v22-last{border:1px solid var(--v-border);border-radius:12px;background:rgba(10,20,52,.6);padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.v22-last>b{font-size:15px}
.v22-last-when{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;flex-wrap:wrap}
.v22-last-when .v22-ic{color:#a78bfa;width:16px;height:16px}
.v22-last-when em{font-style:normal;background:rgba(34,197,94,.2);color:#4ade80;border:1px solid rgba(74,222,128,.4);font-size:12px;padding:3px 8px;border-radius:6px}
.v22-last dl{display:grid;grid-template-columns:auto 1fr;gap:8px 18px;margin:0;font-size:13.5px}
.v22-last dt{color:#c3cde6}.v22-last dd{margin:0;color:#fff;word-break:break-all}
.v22-last .v22-outline-btn{align-self:flex-end;margin-top:auto}
.v22-supported{display:flex;align-items:center;gap:8px;margin-top:12px;color:#4ade80;font-size:13px}
.v22-supported .v22-ic{color:#22c55e;width:18px;height:18px}
.v22-admin-lower{display:grid;grid-template-columns:1.1fr 1.1fr 1fr;gap:16px;margin-top:16px}
.v22-admin-lower .v22-card{padding:16px}
.v22-admin-lower .v22-card-head{align-items:center;margin-bottom:8px}
.v22-admin-lower h2{display:flex;align-items:center;gap:10px;font-size:16px}
.t-ic{width:22px;height:22px;padding:3px;border-radius:6px}
.t-ic.blue{background:#2563eb;color:#fff}.t-ic.gold{color:#f5b42a}.t-ic.teal{color:#2dd4bf}
.v22-updated{display:flex;align-items:center;gap:6px;color:#c3cde6;font-size:12px}
.v22-updated .v22-ic{width:14px;height:14px}
.v22-mini-table{width:100%;border-collapse:collapse;font-size:12.5px}
.v22-mini-table th{text-align:left;color:#b3bfdb;font-weight:500;padding:8px 6px;border-bottom:1px solid var(--v-border);white-space:nowrap}
.v22-mini-table td{padding:9px 6px;color:#e6ecfb;white-space:nowrap;border-bottom:1px solid rgba(78,110,196,.1)}
.v22-mini-table tr:last-child td{border-bottom:0}
.v22-status{display:inline-block;padding:3px 8px;border-radius:6px;background:rgba(34,197,94,.16);color:#4ade80;font-weight:600;font-size:12px}
.v22-tbl-card{overflow-x:auto}
.v22-dsum{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.v22-dsum>div{display:flex;gap:12px;align-items:flex-start;padding:14px 12px;border:1px solid var(--v-border);border-radius:10px;background:rgba(10,20,52,.6);min-width:0}
.v22-dsum small{display:block;color:#c3cde6;font-size:12px}
.v22-dsum b{display:block;font-size:20px;font-weight:700;margin-top:4px}
.v22-dsum em{display:inline-block;font-style:normal;font-size:11.5px;color:#b3bfdb;margin-top:4px}
.v22-dsum em.pos{color:var(--v-green)}
.v22-dsum em.badge{background:rgba(34,197,94,.2);color:#4ade80;padding:2px 6px;border-radius:5px}

/* ======================================================================
   Responsive
   ====================================================================== */
@media (max-width:1560px){
 .v22-dash-bottom{grid-template-columns:1fr 1fr}
 .v22-insights{grid-column:1/-1;display:grid!important;grid-template-columns:1fr 1fr;gap:0 14px;align-content:start}
 .v22-insights .v22-card-head{grid-column:1/-1}
 .v22-admin-lower{grid-template-columns:1fr 1fr}.v22-summary-card{grid-column:1/-1}
 .v22-summary-card .v22-dsum{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:1280px){
 .v22-fund-row{grid-template-columns:minmax(0,1fr) 130px 120px 120px}
 .v22-view{grid-column:4}
}
@media (max-width:1180px){
 .v22-flow{grid-template-columns:1fr;max-width:560px;margin-left:auto;margin-right:auto}
 .v22-step-head{min-height:0;margin-bottom:16px}
 .v22-vis{min-height:0}
 .v22-conn{padding:6px 0;height:70px}
 .v22-conn svg{width:70px;height:40px;transform:rotate(90deg)}
 .v22-conn.fibers svg{width:70px;height:40px}
 .v22-engine-out{display:none}
 .v22-benefits{grid-template-columns:1fr 1fr;gap:18px}
 .v22-benefits>div{border-left:0}
 .v22-hero{grid-template-columns:1fr;min-height:0;padding-bottom:300px}
 .v22-hero-art{width:100%;top:auto;height:340px}
 .v22-hero-stats{gap:16px 40px}
}
@media (max-width:1100px){
 .v22-dash-top,.v22-admin-charts,.v22-admin-ops,.v22-journey-grid,.v22-sip-grid{grid-template-columns:1fr}
 .v22-kpis,.v22-akpis{grid-template-columns:1fr 1fr}
 .v22-metrics,.v22-summary{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:760px){
 .v22-title h1,.v22-detail-id h1,.v22-welcome h1,.v22-admin-head h1{font-size:23px}
 .v22-two,.v22-three,.v22-dash-bottom,.v22-admin-lower,.v22-kpis,.v22-akpis,.v22-mini-inputs,.v22-upload-row,.v22-sipcfg-row{grid-template-columns:1fr}
 .v22-explore-tools{grid-template-columns:1fr}
 .v22-fund-row{grid-template-columns:1fr auto;gap:12px;padding:14px}
 .v22-spark-box{display:none}
 .v22-fund-ret{grid-column:2;grid-row:1;text-align:right}
 .v22-view{grid-column:1/-1;grid-row:2}
 .v22-fund-id b{white-space:normal}
 .v22-detail-head,.v22-welcome,.v22-admin-head{flex-direction:column;align-items:stretch}
 .v22-ask{width:100%}
 .v22-tabs{overflow-x:auto}.v22-tabs button{flex:none;padding:0 16px}
 .v22-metrics,.v22-summary{grid-template-columns:1fr 1fr}
 .v22-insights{grid-template-columns:1fr!important}
 .v22-summary-card .v22-dsum{grid-template-columns:1fr 1fr!important}
 .v22-card-head{flex-direction:column}
 .v22-cal-wrap{grid-template-columns:1fr}
 .v22-est{grid-template-columns:1fr 1fr}
 .v22-est .sep{border-left:0;padding-left:0}
 .v22-insight-row{grid-template-columns:1fr}.v22-insight-logo{display:none}.v22-insight-body p{padding-left:0}
 .v22-upcoming{grid-template-columns:1fr}
 .v22-benefits{grid-template-columns:1fr}
 .v22-hero-stats{grid-template-columns:1fr 1fr}
 .v22-float.f2{display:none}
 .v22-tip b{font-size:15px}.v22-tip strong{font-size:14px}
 .v22-multi-tip{display:none}
}

.v22-journey-grid>.v22-card:first-child{display:flex;flex-direction:column}
#v22-journey{flex:1;display:flex;align-items:center}
.v22-whatif .v22-note,.v22-sip .v22-note{margin-top:22px}

.sidebar.v22-side .nav-link>span{width:auto;height:auto;display:block;background:none}
.v22-opts.sm button{white-space:nowrap;font-size:12.5px!important}
.v22-hero-art line{stroke-opacity:.9}
@media (max-width:760px){
 svg[viewBox^="0 0 1080 "] .v22-axis{font-size:34px}
 svg[viewBox^="0 0 720 "] .v22-axis{font-size:24px}
 svg[viewBox^="0 0 620 "] .v22-axis{font-size:22px}
 svg[viewBox^="0 0 580 "] .v22-axis{font-size:21px}
 svg[viewBox^="0 0 540 "] .v22-axis{font-size:19px}
 svg[viewBox^="0 0 420 "] .v22-axis{font-size:15px}
 .v22-fab-label{display:none}.v22-fab-bot{width:54px;height:54px}.v22-fab-bot svg{width:44px;height:44px}
}

/* ======================================================================
   v22.1 — features, pricing, FAQ, socials, assistant
   ====================================================================== */
.v22-cic{flex:none;display:block}
.v22-sec-head{text-align:center;max-width:860px;margin:0 auto}
.v22-eyebrow{display:inline-flex;align-items:center;height:36px;padding:0 18px;border-radius:20px;border:1px solid rgba(96,130,230,.45);background:rgba(18,30,72,.6);color:#9cc3ff;font-size:12.5px!important;font-weight:700;letter-spacing:.14em}
.v22-sec-head h2{margin-top:18px;font-size:clamp(30px,3.4vw,46px);font-weight:800;line-height:1.15;letter-spacing:-.02em;color:#fff}
.v22-sec-head h2 .g-blue,.v22-faq h2 .g-blue{background:linear-gradient(90deg,#4f9bff,#8b5cf6);-webkit-background-clip:text;background-clip:text;color:transparent}
.v22-sec-head>p{margin-top:14px;color:#b9c4df;font-size:17px;line-height:1.55}
.v22-center{text-align:center;margin-top:26px}
[data-v22-reveal] .v22-feat,[data-v22-reveal] .v22-plan{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1),box-shadow .25s,border-color .25s;transition-delay:calc(var(--i)*.12s)}
[data-v22-reveal].seen .v22-feat,[data-v22-reveal].seen .v22-plan{opacity:1;transform:none}

/* features */
.v22-features{padding:90px 5% 70px;max-width:1440px;margin:0 auto}
.v22-feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:46px}
.v22-feat{position:relative;display:flex;flex-direction:column;padding:26px 24px 22px;border-radius:20px;border:1px solid rgba(90,120,210,.28);background:linear-gradient(180deg,rgba(22,32,72,.9),rgba(13,20,50,.92));box-shadow:0 20px 50px rgba(0,0,0,.3);overflow:hidden}
.v22-feat::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(80,150,255,.0),rgba(140,90,250,.0));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;transition:background .3s;pointer-events:none}
.v22-feat:hover{transform:translateY(-6px)!important;border-color:transparent;box-shadow:0 28px 60px rgba(0,0,0,.4),0 0 40px rgba(80,110,255,.18)}
.v22-feat:hover::before{background:linear-gradient(135deg,#3b82f6,#a855f7)}
.v22-feat-top{display:flex;gap:16px;align-items:center;min-height:64px}
.v22-feat-ic{width:56px;height:56px;border-radius:15px;display:grid;place-items:center;flex:none;background:linear-gradient(160deg,rgba(40,56,110,.9),rgba(20,28,64,.9));border:1px solid rgba(110,140,230,.3);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.v22-feat-ic.brand{background:linear-gradient(160deg,#2a2550,#17142f)}
.v22-feat h3{font-size:19px;font-weight:700;line-height:1.3;color:#fff}
.v22-feat>p{margin-top:18px;color:#c3cde6;font-size:15px;line-height:1.6;flex:1}
.v22-feat-cta{margin-top:18px;display:inline-flex;align-items:center;gap:8px;color:#60b4ff;font-weight:600;font-size:14.5px}
.v22-feat-cta .v22-ic{transition:transform .2s}.v22-feat:hover .v22-feat-cta .v22-ic{transform:translateX(4px)}
.pv{position:relative;margin-top:20px;height:132px;border-radius:14px;border:1px solid rgba(90,120,210,.25);background:#0a1130;overflow:hidden;padding:14px}
.pv *{animation-play-state:paused!important}
.in-view .pv *{animation-play-state:running!important}
/* 1 search */
.pv-box{display:flex;align-items:center;gap:8px;height:34px;padding:0 10px;border-radius:8px;border:1px solid rgba(110,140,230,.35);background:#111b40;color:#9fb0d4;font-size:13px}
.pv-box .v22-ic{width:15px;height:15px}
.pv-type{display:inline-block;overflow:hidden;white-space:nowrap;color:#e6ecfb;width:0;animation:pvType 6s steps(15) infinite}
.pv-caret{width:2px;height:15px;background:#60a5fa;animation:pvBlink .8s step-end infinite}
@keyframes pvType{0%,8%{width:0}40%,85%{width:15ch}100%{width:15ch}}
@keyframes pvBlink{50%{opacity:0}}
.pv-rows{display:grid;gap:9px;margin-top:12px}
.pv-rows div{display:flex;align-items:center;gap:8px;opacity:0;animation:pvRow 6s ease infinite;animation-delay:calc(var(--i)*.25s)}
.pv-rows i{width:9px;height:9px;border-radius:50%;flex:none}
.pv-rows span{height:7px;border-radius:5px;background:linear-gradient(90deg,#3b5bdb,#4c6ef5);width:var(--w);max-width:70%}
.pv-rows b{margin-left:auto;font-size:12px;color:#4ade80;font-weight:700}
@keyframes pvRow{0%,40%{opacity:0;transform:translateX(-10px)}52%,90%{opacity:1;transform:none}100%{opacity:0}}
/* 2 what-if */
.pv-whatif>svg{position:absolute;left:0;right:0;bottom:0;width:100%;height:78%}
.pv-chip{position:relative;z-index:1;display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 9px;border-radius:7px;background:#16224f;border:1px solid rgba(110,140,230,.35);color:#dbe4fb;font-size:12px}
.pv-chip .v22-ic{width:13px;height:13px;color:#f87171}
.pv-line{stroke-dasharray:100;stroke-dashoffset:100;animation:pvDraw 5s ease-in-out infinite;filter:drop-shadow(0 0 5px #38bdf8)}
.pv-area{opacity:0;animation:pvFade 5s ease-in-out infinite}
.pv-dot{opacity:0;animation:pvPop 5s ease-in-out infinite;filter:drop-shadow(0 0 6px #22d3ee)}
.pv-value{position:absolute;right:12px;top:12px;font-weight:700;font-size:15px;color:#fff;opacity:0;animation:pvPop 5s ease-in-out infinite}
.pv-value em{font-style:normal;color:#4ade80;font-size:12px;margin-left:4px}
@keyframes pvDraw{0%,10%{stroke-dashoffset:100}55%,90%{stroke-dashoffset:0}100%{stroke-dashoffset:0;opacity:0}}
@keyframes pvFade{0%,35%{opacity:0}60%,90%{opacity:1}100%{opacity:0}}
@keyframes pvPop{0%,52%{opacity:0;transform:scale(.6)}62%,90%{opacity:1;transform:none}100%{opacity:0}}
.pv-dot{transform-origin:290px 12px}
/* 3 bars */
.pv-bars{display:flex;align-items:flex-end;justify-content:center;gap:34px;padding-bottom:26px}
.pv-bar{position:relative;width:46px;height:100%;display:flex;align-items:flex-end}
.pv-bar span{display:block;width:100%;border-radius:8px 8px 3px 3px;animation:pvGrow 5s cubic-bezier(.2,.7,.2,1) infinite;position:relative}
.pv-bar.fixed span{--h:48%;background:linear-gradient(180deg,#64748b,#334155)}
.pv-bar.mod span{--h:88%;background:linear-gradient(180deg,#38bdf8,#8b5cf6);box-shadow:0 0 18px rgba(99,102,241,.6);animation-delay:.25s}
.pv-bar b{position:absolute;top:-20px;left:50%;transform:translateX(-50%);font-size:11.5px;color:#e6ecfb;white-space:nowrap}
.pv-bar small{position:absolute;bottom:-21px;left:50%;transform:translateX(-50%);font-size:11.5px;color:#9fb0d4;white-space:nowrap}
.pv-badge{position:absolute;right:12px;top:12px;font-style:normal;font-weight:700;font-size:13px;color:#052e16;background:#4ade80;padding:3px 8px;border-radius:7px;opacity:0;animation:pvPop 5s ease infinite}
@keyframes pvGrow{0%{height:4%}45%,88%{height:var(--h)}100%{height:4%}}
/* 4 chat */
.pv-chat{display:flex;flex-direction:column;gap:7px;padding:12px}
.pv-msg{max-width:88%;padding:7px 10px;border-radius:10px;font-size:12px;line-height:1.35;opacity:0}
.pv-msg.me{align-self:flex-end;background:linear-gradient(90deg,#3b82f6,#6366f1);color:#fff;border-bottom-right-radius:3px;animation:pvMsg1 7s ease infinite}
.pv-msg.bot{align-self:flex-start;display:flex;gap:6px;align-items:flex-start;background:#18224d;border:1px solid rgba(110,140,230,.3);color:#e6ecfb;border-bottom-left-radius:3px;animation:pvMsg2 7s ease infinite}
.pv-typing{display:flex;gap:4px;padding:7px 10px;align-self:flex-start;opacity:0;animation:pvTyping 7s ease infinite;background:#18224d;border-radius:10px}
.pv-typing i{width:6px;height:6px;border-radius:50%;background:#a78bfa;animation:pvDots 1s ease-in-out infinite}
.pv-typing i:nth-child(2){animation-delay:.15s}.pv-typing i:nth-child(3){animation-delay:.3s}
@keyframes pvMsg1{0%,5%{opacity:0;transform:translateY(8px)}12%,90%{opacity:1;transform:none}100%{opacity:0}}
@keyframes pvTyping{0%,15%{opacity:0;height:0;padding:0 10px}20%,38%{opacity:1;height:20px;padding:7px 10px}42%,100%{opacity:0;height:0;padding:0 10px}}
@keyframes pvMsg2{0%,40%{opacity:0;transform:translateY(8px)}48%,90%{opacity:1;transform:none}100%{opacity:0}}
@keyframes pvDots{50%{transform:translateY(-3px);opacity:.5}}

/* pricing */
.v22-pricing{padding:80px 5% 30px;max-width:1280px;margin:0 auto}
.v22-billing{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;margin-top:26px;padding:5px;border-radius:14px;border:1px solid rgba(96,130,230,.4);background:#0a1330}
.v22-billing button{position:relative;z-index:1;height:44px;min-width:150px;padding:0 20px;border:0;background:transparent;color:#c9d3ec;font-weight:600;font-size:15px!important;border-radius:10px;display:flex;align-items:center;justify-content:center;gap:8px;transition:color .25s}
.v22-billing button[aria-pressed="true"]{color:#fff}
.v22-billing em{font-style:normal;font-size:11.5px;font-weight:700;color:#052e16;background:#4ade80;padding:2px 7px;border-radius:6px}
.v22-billing-thumb{position:absolute;top:5px;bottom:5px;left:5px;width:calc(50% - 5px);border-radius:10px;background:linear-gradient(90deg,#3b82f6,#7c5cfa);box-shadow:0 6px 20px rgba(99,102,241,.45);transition:transform .35s cubic-bezier(.3,.8,.3,1)}
.v22-billing[data-state="yearly"] .v22-billing-thumb{transform:translateX(100%)}
.v22-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:44px;align-items:stretch}
.v22-plan{position:relative;display:flex;flex-direction:column;padding:28px 26px 26px;border-radius:20px;border:1px solid rgba(90,120,210,.3);background:linear-gradient(180deg,rgba(20,30,70,.9),rgba(12,19,48,.94));box-shadow:0 22px 50px rgba(0,0,0,.3)}
.v22-plan:hover{transform:translateY(-6px)!important;border-color:rgba(120,150,255,.55)}
.v22-plan.popular{border:1.5px solid transparent;background:linear-gradient(180deg,rgba(26,30,84,.97),rgba(16,18,56,.97)) padding-box,linear-gradient(140deg,#3b82f6,#a855f7,#ec4899) border-box;box-shadow:0 26px 60px rgba(0,0,0,.4),0 0 50px rgba(139,92,246,.25)}
.v22-pop{position:absolute;top:-15px;left:50%;transform:translateX(-50%);padding:6px 16px;border-radius:20px;background:linear-gradient(90deg,#6366f1,#a855f7);color:#fff;font-size:12px;font-weight:800;letter-spacing:.08em;box-shadow:0 6px 18px rgba(139,92,246,.5);white-space:nowrap}
.v22-plan-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.v22-plan h3{font-size:22px;font-weight:800;color:#fff}
.v22-plan-head p{margin-top:6px;color:#aab6d2;font-size:14.5px}
.v22-plan-ic{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(160deg,rgba(40,56,110,.9),rgba(20,28,64,.9));border:1px solid rgba(110,140,230,.3)}
.v22-price{display:flex;align-items:baseline;gap:6px;margin-top:24px}
.v22-price b{font-size:44px;font-weight:800;color:#fff;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.v22-price span{color:#aab6d2;font-size:15px}
.v22-price-note{display:block;margin-top:6px;color:#8ea0c4;font-size:13px;min-height:18px}
.v22-plan ul{list-style:none;margin:22px 0 26px;padding:22px 0 0;border-top:1px solid rgba(90,120,210,.25);display:grid;gap:13px;flex:1;align-content:start}
.v22-plan li{display:flex;align-items:center;gap:12px;color:#e6ecfb;font-size:15px}
.v22-plan li.no{color:#7d8bab;text-decoration:line-through;text-decoration-color:rgba(125,139,171,.5)}
.v22-plan .v22-grad-btn,.v22-plan-btn{height:52px;font-size:16px!important;width:100%}
.v22-plan-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:10px;border:1.5px solid #3c6df0;background:rgba(14,28,72,.5);color:#fff;font-weight:700;transition:background .2s,box-shadow .2s;padding:0 20px}
.v22-plan-btn:hover{background:rgba(40,70,170,.45);box-shadow:0 0 20px rgba(60,110,240,.3)}
.v22-plan-btn.sm{height:44px;width:auto;font-size:14.5px!important}
.v22-trust{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:34px;padding:20px 24px;border-radius:18px;border:1px solid rgba(90,120,210,.25);background:rgba(12,20,48,.7)}
.v22-trust>div{display:flex;gap:14px;align-items:center}
.v22-trust b{display:block;font-size:15px;color:#fff}
.v22-trust small{display:block;margin-top:3px;color:#aab6d2;font-size:13px;line-height:1.4}
.v22-fine{margin-top:16px;text-align:center;color:#7d8bab;font-size:13px}

/* FAQ */
.v22-faq{padding:80px 5%;max-width:1280px;margin:0 auto}
.v22-faq-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:start}
.v22-faq-side{position:sticky;top:100px}
.v22-faq-side h2{margin-top:18px;font-size:clamp(30px,3.2vw,44px);font-weight:800;line-height:1.15;letter-spacing:-.02em;color:#fff}
.v22-faq-side>p{margin-top:14px;color:#b9c4df;font-size:16.5px;line-height:1.6}
.v22-faq-help{display:flex;gap:16px;margin-top:28px;padding:22px;border-radius:18px;border:1px solid rgba(110,120,240,.35);background:linear-gradient(135deg,rgba(40,40,120,.45),rgba(16,24,60,.7))}
.v22-faq-help b{display:block;font-size:17px;color:#fff}
.v22-faq-help small{display:block;margin-top:6px;color:#c3cde6;font-size:14px;line-height:1.5}
.v22-faq-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.v22-faq-actions .v22-grad-btn{height:44px;font-size:14.5px!important}
.v22-faq-cats{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.v22-faq-cats button{height:38px;padding:0 16px;border-radius:20px;border:1px solid rgba(96,130,230,.4);background:#0b1636;color:#c9d3ec;font-size:14px!important;font-weight:600}
.v22-faq-cats button.active{background:linear-gradient(90deg,#3b82f6,#7c5cfa);border-color:transparent;color:#fff}
.v22-acc{display:grid;gap:12px}
.v22-acc-item{border-radius:16px;border:1px solid rgba(90,120,210,.28);background:linear-gradient(180deg,rgba(20,30,70,.85),rgba(12,19,48,.9));transition:border-color .25s,box-shadow .25s}
.v22-acc-item.open{border-color:rgba(120,140,255,.6);box-shadow:0 14px 36px rgba(0,0,0,.3),0 0 30px rgba(99,102,241,.15)}
.v22-acc-item[hidden]{display:none}
.v22-acc-q{width:100%;display:flex;align-items:center;gap:14px;padding:18px 20px;border:0;background:transparent;color:#fff;font-size:16.5px!important;font-weight:600;text-align:left;cursor:pointer}
.v22-acc-q span{flex:1;line-height:1.4}
.v22-acc-plus{position:relative;width:30px;height:30px;border-radius:50%;flex:none;background:rgba(60,90,200,.25);border:1px solid rgba(110,140,230,.4);transition:transform .3s,background .3s}
.v22-acc-plus::before,.v22-acc-plus::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;border-radius:2px;background:#c7d7ff;transform:translate(-50%,-50%)}
.v22-acc-plus::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .3s}
.v22-acc-item.open .v22-acc-plus{transform:rotate(180deg);background:linear-gradient(135deg,#3b82f6,#8b5cf6);border-color:transparent}
.v22-acc-item.open .v22-acc-plus::after{transform:translate(-50%,-50%) rotate(0)}
.v22-acc-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease}
.v22-acc-item.open .v22-acc-a{grid-template-rows:1fr}
.v22-acc-a>div{overflow:hidden}
.v22-acc-a p{padding:0 20px 20px 60px;color:#c3cde6;font-size:15px;line-height:1.65;opacity:0;transform:translateY(-6px);transition:opacity .3s,transform .3s}
.v22-acc-item.open .v22-acc-a p{opacity:1;transform:none;transition-delay:.1s}
.v22-public-faq{padding-top:10px}

/* socials + stray toast close */
.footer-socials.v22-socials{display:flex;gap:12px}
.footer-socials.v22-socials a{display:block;width:40px;height:40px;border-radius:10px;transition:transform .2s,box-shadow .2s;line-height:0}
.footer-socials.v22-socials a:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 8px 20px rgba(0,0,0,.4)}
.public-activity-toast:not(.is-visible){visibility:hidden;pointer-events:none}
.activity-toast-close{background:transparent;border:0;color:#9fb0d4;font-size:18px;line-height:1;cursor:pointer}

/* assistant */
.chat-drawer.v22-chat{right:24px;bottom:112px;width:min(440px,calc(100vw - 32px));height:min(660px,calc(var(--vh100,100vh) - 140px));max-height:none;border-radius:22px;border:1px solid rgba(110,140,230,.4);background:linear-gradient(180deg,#121b3e,#0b1230);box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 40px rgba(80,110,255,.18);font-family:var(--v-font);z-index:60}
.v22-chat-head{display:flex;align-items:center;gap:14px;padding:18px 20px;border-bottom:1px solid rgba(110,140,230,.25);background:linear-gradient(90deg,rgba(40,50,120,.5),rgba(20,26,70,.3))}
.v22-chat-av{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 50% 40%,#1e3a8a,#0b1022 70%);border:2px solid rgba(96,165,250,.55);overflow:hidden;flex:none}
.v22-chat-av svg{width:40px;height:40px;margin-top:4px}
.v22-chat-head div{flex:1}
.v22-chat-head b{display:block;font-size:17px;color:#fff}
.v22-chat-head small{display:flex;align-items:center;gap:6px;margin-top:3px;color:#aab6d2;font-size:13px}
.v22-chat-head small i{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 8px #22c55e}
.v22-chat-head button{width:36px;height:36px;border-radius:10px;border:1px solid rgba(110,140,230,.35);background:rgba(20,30,70,.6);color:#dbe4fb;display:grid;place-items:center}
.v22-chat-body{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:12px}
.v22-bubble{max-width:86%;padding:12px 15px;border-radius:16px;font-size:15px;line-height:1.55;color:#e6ecfb;animation:v22Bub .25s ease}
.v22-bubble.bot{align-self:flex-start;background:#1a2552;border:1px solid rgba(110,140,230,.3);border-bottom-left-radius:5px}
.v22-bubble.me{align-self:flex-end;background:linear-gradient(90deg,#3b82f6,#6366f1);color:#fff;border-bottom-right-radius:5px}
.v22-bubble small{display:block;margin-top:8px;color:#8ea0c4;font-size:12px}
.v22-bubble b{color:#fff}
.v22-bubble.typing{display:flex;gap:5px;padding:15px}
.v22-bubble.typing i{width:8px;height:8px;border-radius:50%;background:#a78bfa;animation:pvDots 1s ease-in-out infinite}
.v22-bubble.typing i:nth-child(2){animation-delay:.15s}.v22-bubble.typing i:nth-child(3){animation-delay:.3s}
@keyframes v22Bub{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.v22-chat-prompts{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.v22-chat-prompts button{padding:9px 13px;border-radius:18px;border:1px solid rgba(110,140,230,.4);background:rgba(30,45,100,.45);color:#cfe0ff;font-size:13.5px!important;font-weight:500;text-align:left}
.v22-chat-prompts button:hover{background:rgba(60,90,200,.4);color:#fff}
.v22-chat-compose{display:flex;gap:10px;padding:14px 16px;border-top:1px solid rgba(110,140,230,.25)}
.v22-chat-compose input{flex:1;height:50px;border-radius:14px;border:1px solid rgba(110,140,230,.35);background:#0a1130;color:#fff;font-size:15px;padding:0 16px;outline:0;min-width:0}
.v22-chat-compose input:focus{border-color:#6b8cff;box-shadow:0 0 0 3px rgba(91,124,255,.18)}
.v22-chat-compose button{width:50px;height:50px;border-radius:14px;border:0;background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff;display:grid;place-items:center}
.v22-chat-compose button .v22-ic{width:20px;height:20px}
.v22-chat-note{margin:0;padding:0 16px 12px;text-align:center;color:#7d8bab;font-size:12px}
.v22-fab.is-open .v22-fab-label{opacity:0}

@media (max-width:1180px){.v22-feat-grid{grid-template-columns:1fr 1fr}.v22-plans{grid-template-columns:1fr;max-width:520px;margin-left:auto;margin-right:auto}.v22-faq-grid{grid-template-columns:1fr;gap:28px}.v22-faq-side{position:static}}
@media (max-width:760px){.v22-feat-grid{grid-template-columns:1fr}.v22-trust{grid-template-columns:1fr}.v22-billing button{min-width:0}.v22-acc-a p{padding-left:20px}.v22-features,.v22-pricing,.v22-faq{padding-left:16px;padding-right:16px}.chat-drawer.v22-chat{right:12px;left:12px;width:auto;bottom:96px;height:calc(var(--vh100,100vh) - 120px)}}
@media (prefers-reduced-motion:reduce){.pv *{animation:none!important}.pv-type{width:15ch}.pv-rows div,.pv-area,.pv-dot,.pv-value,.pv-badge,.pv-msg,.pv-typing{opacity:1}.pv-line{stroke-dashoffset:0}.pv-bar span{height:var(--h)}.pv-typing{display:none}[data-v22-reveal] .v22-feat,[data-v22-reveal] .v22-plan{opacity:1;transform:none}}
.v22-faq .v22-acc .v22-acc-q{font-size:16.5px!important;font-weight:600;font-family:var(--v-font)}
.v22-faq .v22-acc-a p{font-size:15px}

/* ======================================================================
   v22.2 — settings, help, admin pages, top bar
   ====================================================================== */
.v22-phead{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:18px}
.v22-crumb{display:inline-block;margin-bottom:8px;color:#7fa6ff;font-size:12px;font-weight:700;letter-spacing:.14em}
.v22-phead h1{font-size:30px;font-weight:800;line-height:1.15;color:#fff}
.v22-phead p{margin-top:8px;color:#b9c4df;font-size:15.5px}
.v22-phead-actions{display:flex;gap:10px;align-items:center}
.v22-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:12.5px;font-weight:600;white-space:nowrap;border:1px solid transparent}
.v22-pill.lg{padding:8px 14px;font-size:13.5px}
.v22-pill.ok{background:rgba(34,197,94,.14);color:#4ade80;border-color:rgba(74,222,128,.3)}
.v22-pill.warn{background:rgba(245,158,11,.14);color:#fbbf24;border-color:rgba(251,191,36,.3)}
.v22-pill.bad{background:rgba(239,68,68,.14);color:#f87171;border-color:rgba(248,113,113,.3)}
.v22-pill.info{background:rgba(59,130,246,.16);color:#7cb3ff;border-color:rgba(96,165,250,.35)}
.v22-pill.neutral{background:rgba(148,163,184,.12);color:#cbd5e1;border-color:rgba(148,163,184,.25)}
.v22-notice{display:flex;align-items:center;gap:14px;margin-bottom:18px;padding:12px 16px;border-radius:14px;border:1px solid rgba(96,130,230,.35);background:linear-gradient(90deg,rgba(30,50,120,.45),rgba(14,22,56,.5))}
.v22-notice.admin{border-color:rgba(45,212,191,.3);background:linear-gradient(90deg,rgba(13,80,90,.35),rgba(14,22,56,.5))}
.v22-notice>div{flex:1;font-size:14px;color:#c9d3ec;line-height:1.5}
.v22-notice b{color:#fff;margin-right:8px}
.v22-notice a{display:inline-flex;align-items:center;gap:6px;color:#60b4ff;font-weight:600;font-size:14px;white-space:nowrap}
.v22-skpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}
.v22-skpis article{display:flex;gap:14px;align-items:flex-start;padding:18px;border-radius:var(--v-radius);border:1px solid var(--v-border);background:linear-gradient(180deg,rgba(14,25,60,.82),rgba(9,17,42,.9))}
.v22-skpi-ic{width:50px;height:50px;border-radius:13px;display:grid;place-items:center;flex:none;background:rgba(30,45,100,.55);border:1px solid rgba(110,140,230,.25)}
.v22-skpis small{display:block;color:#b9c4df;font-size:13.5px}
.v22-skpis b{display:block;font-size:24px;font-weight:700;margin-top:4px;color:#fff;font-variant-numeric:tabular-nums}
.v22-skpis em{display:block;font-style:normal;font-size:12.5px;color:#8ea0c4;margin-top:4px}
.v22-skpis em.pos{color:#4ade80}.v22-skpis em.warn{color:#fbbf24}.v22-skpis em.bad{color:#f87171}
.v22-adm>.v22-card,.v22-adm>section+section,.v22-adm>div+section,.v22-adm>section+div{margin-top:16px}
.v22-filters{display:flex;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.v22-filters .v22-search{flex:1;min-width:240px;height:44px}
.v22-filters .v22-select{min-width:170px}.v22-filters .v22-select select{height:44px}
.v22-select.sm select{height:40px;min-width:170px}
.v22-admin-table td,.v22-admin-table th{white-space:nowrap}
.v22-admin-table th{font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:#8ea0c4}
.v22-admin-table td{font-size:14px;vertical-align:middle}
.v22-admin-table tbody tr{transition:background .15s}
.v22-admin-table tbody tr:hover{background:rgba(60,90,200,.12)}
.v22 .mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace!important;font-size:13px;color:#c7d2fe}
.v22-who{display:flex;align-items:center;gap:12px}
.v22-who b{display:block;font-weight:600;color:#fff}.v22-who small{display:block;color:#8ea0c4;font-size:12.5px;margin-top:2px}
.v22-av{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;flex:none;font-size:13px;font-weight:700;color:#fff;background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 50%,#1e1b4b))}
.v22-row-btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:8px;border:1px solid rgba(96,130,230,.45);background:rgba(20,36,90,.5);color:#dbe4fb;font-size:13px!important;font-weight:600;cursor:pointer}
.v22-row-btn:hover{border-color:#6b8cff;background:rgba(40,70,170,.45)}
.v22-row-btn .v22-ic{width:15px;height:15px}
.v22-tfoot{margin-top:12px;color:#8ea0c4;font-size:13px}
.v22-callout{display:flex;gap:10px;align-items:flex-start;margin-top:16px;padding:12px 14px;border-radius:12px;background:rgba(20,32,72,.55);border:1px solid rgba(90,120,210,.22);color:#b9c4df;font-size:13.5px;line-height:1.5}
.v22-bar{display:block;height:6px;border-radius:6px;background:rgba(148,163,184,.18);overflow:hidden}
.v22-bar.big{height:8px}
.v22-bar em{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#3b82f6,#8b5cf6);transition:width .4s}
.v22-kv>div{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid rgba(90,120,210,.18);font-size:14px}
.v22-kv>div:last-child{border-bottom:0}
.v22-kv span{flex:1;color:#b9c4df}.v22-kv b{color:#fff;font-weight:600;text-align:right}
.v22 .t-ok{color:#4ade80}.v22 .t-warn{color:#fbbf24}.v22 .t-bad{color:#f87171}.v22 .warn-t{color:#fbbf24}
.v22-valbox:empty{display:none}
.v22-valbox{margin-top:14px;padding:14px 16px;border-radius:12px;border:1px solid rgba(74,222,128,.35);background:rgba(10,60,40,.35);font-size:14px;color:#d1fae5;line-height:1.6}
.v22-valbox .secondary-btn{margin-top:10px}

/* forms */
.v22-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px}
.v22-fl{display:flex;flex-direction:column;gap:8px;color:#c3cde6;font-size:14px;font-weight:500;margin-top:4px}
.v22-fl input,.v22-fl textarea{height:46px;border-radius:10px;border:1px solid var(--v-border-2);background:#081129;color:#fff;font-size:15px;padding:0 14px;outline:0;font-family:var(--v-font)}
.v22-fl textarea{height:auto;padding:12px 14px;resize:vertical;line-height:1.5}
.v22-fl input:focus,.v22-fl textarea:focus{border-color:#5b7cff;box-shadow:0 0 0 3px rgba(91,124,255,.18)}
.v22-fl input:disabled{opacity:.6}
.v22-fl small{display:flex;align-items:center;gap:6px;color:#8ea0c4;font-size:12.5px;font-weight:400}
.v22-fl small .v22-ic{width:13px;height:13px}
.v22-fl .v22-select select{height:46px}
.v22-hint{margin-top:14px!important;color:#8ea0c4;font-size:13px}.v22-hint.top{margin:-4px 0 16px!important}
.v22-seg-pills{display:flex;gap:6px;padding:4px;border-radius:12px;border:1px solid var(--v-border-2);background:#081129;width:max-content;max-width:100%;flex-wrap:wrap}
.v22-seg-pills button{height:36px;padding:0 14px;border:0;border-radius:8px;background:transparent;color:#c3cde6;font-size:14px!important;font-weight:600}
.v22-seg-pills button.active{background:linear-gradient(90deg,#3b82f6,#7c5cfa);color:#fff;box-shadow:0 4px 14px rgba(99,102,241,.35)}
.v22-seg-pills.sm button{height:30px;padding:0 10px;font-size:12.5px!important}
.v22-switch{position:relative;display:inline-block;width:48px;height:28px;flex:none;cursor:pointer}
.v22-switch input{opacity:0;width:0;height:0;position:absolute}
.v22-switch span{position:absolute;inset:0;border-radius:20px;background:#2b3557;border:1px solid rgba(148,163,184,.3);transition:background .25s}
.v22-switch span::before{content:"";position:absolute;width:22px;height:22px;left:2px;top:2px;border-radius:50%;background:#e2e8f0;box-shadow:0 2px 6px rgba(0,0,0,.4);transition:transform .25s cubic-bezier(.3,.8,.3,1)}
.v22-switch input:checked+span{background:linear-gradient(90deg,#3b82f6,#8b5cf6);border-color:transparent}
.v22-switch input:checked+span::before{transform:translateX(20px);background:#fff}
.v22-switch input:disabled+span{opacity:.55;cursor:not-allowed}
.v22-switch input:focus-visible+span{outline:2px solid #7cb3ff;outline-offset:2px}
.v22-danger-btn{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 18px;border-radius:10px;border:1.5px solid rgba(248,113,113,.6);background:rgba(127,29,29,.3);color:#fecaca;font-weight:600;font-size:14.5px!important;cursor:pointer}
.v22-danger-btn:hover{background:rgba(185,28,28,.4)}

/* settings */
.v22-set-layout{display:grid;grid-template-columns:300px 1fr;gap:20px;align-items:start}
.v22-set-side{position:sticky;top:84px;border-radius:18px;border:1px solid var(--v-border);background:linear-gradient(180deg,rgba(14,25,60,.82),rgba(9,17,42,.9));padding:16px}
.v22-set-who{display:flex;gap:12px;align-items:center;padding:6px 6px 16px;border-bottom:1px solid var(--v-border);margin-bottom:10px}
.v22-set-who b{display:block;color:#fff;font-size:15px}.v22-set-who small{display:block;color:#8ea0c4;font-size:12.5px;margin-top:2px;overflow:hidden;text-overflow:ellipsis}
.v22-set-side nav{display:grid;gap:6px}
.v22-set-side nav button{display:flex;align-items:center;gap:12px;width:100%;padding:12px;border-radius:12px;border:1px solid transparent;background:transparent;text-align:left;color:#dbe4fb;cursor:pointer;transition:background .2s,border-color .2s}
.v22-set-side nav button:hover{background:rgba(40,60,140,.25)}
.v22-set-side nav button.active{background:linear-gradient(90deg,rgba(59,130,246,.28),rgba(139,92,246,.2));border-color:rgba(110,140,255,.5)}
.v22-set-side nav button span{flex:1}
.v22-set-side nav b{display:block;font-size:15px;font-weight:600}
.v22-set-side nav small{display:block;font-size:12.5px;color:#8ea0c4;margin-top:2px}
.v22-set-side .go{width:16px;height:16px;color:#6b7aa3}
.v22-set-body{display:grid;gap:16px;min-width:0}
.v22-set-card{padding:24px}
.v22-set-h{display:flex;align-items:center;gap:12px;font-size:18px;font-weight:700;color:#fff;margin-bottom:18px!important}
.v22-prof{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.v22-prof-av{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;font-size:30px;font-weight:800;color:#fff;background:linear-gradient(135deg,#3b82f6,#8b5cf6);box-shadow:0 0 0 4px rgba(99,102,241,.25),0 10px 30px rgba(99,102,241,.4);flex:none}
.v22-prof-av.sm{width:44px;height:44px;font-size:18px;box-shadow:0 0 0 3px rgba(99,102,241,.25)}
.v22-prof-main{flex:1;min-width:200px}
.v22-prof-main b{display:block;font-size:22px;color:#fff}.v22-prof-main>span{display:block;color:#b9c4df;font-size:14.5px;margin-top:4px}
.v22-prof-tags{display:flex;gap:8px;margin-top:10px}
.v22-meter{margin-top:22px;padding:16px;border-radius:12px;background:rgba(20,32,72,.5);border:1px solid rgba(90,120,210,.2)}
.v22-meter>div{display:flex;justify-content:space-between;font-size:14px;color:#dbe4fb;margin-bottom:10px}
.v22-meter>div span{color:#7cb3ff;font-weight:700}
.v22-meter>i{display:block;height:8px;border-radius:6px;background:rgba(148,163,184,.18);overflow:hidden}
.v22-meter>i em{display:block;height:100%;background:linear-gradient(90deg,#22d3ee,#8b5cf6);border-radius:inherit}
.v22-meter small{display:block;margin-top:8px;color:#8ea0c4;font-size:13px}
.v22-savebar{position:sticky;bottom:14px;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 18px;border-radius:14px;border:1px solid rgba(110,140,230,.35);background:rgba(12,20,50,.92);backdrop-filter:blur(10px);box-shadow:0 16px 40px rgba(0,0,0,.4)}
.v22-savebar span{color:#8ea0c4;font-size:13.5px}
.v22-theme-cards{display:grid;grid-template-columns:repeat(2,minmax(0,240px));gap:16px}
.v22-theme{display:block;padding:12px;border-radius:14px;border:1.5px solid var(--v-border-2);background:#0a1330;cursor:pointer}
.v22-theme.on{border-color:#6b8cff;box-shadow:0 0 0 3px rgba(91,124,255,.2)}
.v22-theme.off{opacity:.55;cursor:not-allowed}
.v22-theme input{display:none}
.v22-theme-prev{display:grid;grid-template-columns:30% 1fr;grid-template-rows:1fr 1fr;gap:6px;height:90px;padding:8px;border-radius:10px;margin-bottom:10px}
.v22-theme-prev.dark{background:#070d22}.v22-theme-prev.light{background:#eef2fb}
.v22-theme-prev i{border-radius:6px}.v22-theme-prev i:first-child{grid-row:1/3}
.v22-theme-prev.dark i{background:#1a2552}.v22-theme-prev.dark i:nth-child(2){background:linear-gradient(90deg,#3b82f6,#8b5cf6)}
.v22-theme-prev.light i{background:#d6def3}.v22-theme-prev.light i:nth-child(2){background:#93c5fd}
.v22-theme b{display:block;color:#fff;font-size:15px}.v22-theme small{color:#8ea0c4;font-size:12.5px}
.v22-channels-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.v22-chan{display:flex;align-items:center;gap:12px;padding:16px;border-radius:14px;border:1px solid var(--v-border);background:rgba(10,18,44,.6);transition:border-color .2s,background .2s}
.v22-chan.on{border-color:rgba(110,140,255,.55);background:rgba(40,50,130,.3)}
.v22-chan>div{flex:1;min-width:0}.v22-chan b{display:block;color:#fff;font-size:15px}.v22-chan small{display:block;color:#8ea0c4;font-size:12.5px;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v22-trow{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid rgba(90,120,210,.18)}
.v22-trow:last-child{border-bottom:0}
.v22-trow b{display:block;color:#fff;font-size:15.5px;font-weight:600}.v22-trow small{display:block;color:#a7b3cf;font-size:13.5px;margin-top:4px}
.v22-privacy-hero{display:flex;gap:18px;align-items:flex-start}
.v22-privacy-hero b{display:block;font-size:19px;color:#fff}.v22-privacy-hero p{margin-top:6px;color:#c3cde6;font-size:14.5px;line-height:1.6}
.v22-data-chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px;padding-left:62px}
.v22-data-chips span{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;background:rgba(30,45,100,.5);border:1px solid rgba(110,140,230,.3);color:#dbe4fb;font-size:13px}
.v22-two-act{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.v22-act{display:flex;gap:16px;align-items:flex-start;padding:22px}
.v22-act b{display:block;color:#fff;font-size:16.5px}.v22-act p{margin:6px 0 14px!important;color:#b9c4df;font-size:14px;line-height:1.5}
.v22-act.danger{border-color:rgba(248,113,113,.35);background:linear-gradient(180deg,rgba(60,18,30,.6),rgba(30,12,24,.7))}

/* help */
.v22-help-hero{text-align:center;padding:34px 24px 26px;border-radius:20px;border:1px solid rgba(110,120,240,.35);background:radial-gradient(ellipse at 50% 0%,rgba(99,102,241,.35),transparent 65%),linear-gradient(180deg,rgba(20,28,70,.9),rgba(12,18,48,.92))}
.v22-help-hero h2{font-size:26px;font-weight:800;color:#fff}
.v22-help-search{display:flex;align-items:center;gap:12px;max-width:640px;height:56px;margin:18px auto 0;padding:0 18px;border-radius:14px;border:1px solid rgba(110,140,230,.5);background:#081129;color:#9fb0d4;box-shadow:0 10px 30px rgba(0,0,0,.3)}
.v22-help-search:focus-within{border-color:#6b8cff;box-shadow:0 0 0 4px rgba(91,124,255,.2)}
.v22-help-search .v22-ic{width:22px;height:22px}
.v22-help-search input{flex:1;background:transparent;border:0;outline:0;color:#fff;font-size:16px}
.v22-help-topics{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:22px}
.v22-help-topics button{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 10px;border-radius:14px;border:1px solid var(--v-border);background:rgba(10,18,44,.6);color:#dbe4fb;cursor:pointer;transition:transform .2s,border-color .2s,background .2s}
.v22-help-topics button:hover{transform:translateY(-3px)}
.v22-help-topics button.active{border-color:#6b8cff;background:rgba(59,90,220,.25);box-shadow:0 0 22px rgba(80,110,255,.25)}
.v22-help-topics b{font-size:14.5px;color:#fff}.v22-help-topics small{font-size:12px;color:#8ea0c4}
.v22-ht-ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff}
.v22-ht-ic .v22-ic{width:17px;height:17px}
.v22-help-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:18px;margin-top:18px;align-items:start}
.v22-help .v22-acc-q{font-size:15.5px!important;padding:16px 18px}
.v22-help .v22-acc-a p{padding-left:56px}
.v22-help-side{display:grid;gap:14px}
.v22-contact{display:grid;gap:14px}
.v22-contact-top{display:flex;gap:14px;align-items:flex-start}
.v22-contact h3{font-size:19px;color:#fff;font-weight:700}.v22-contact-top p{margin-top:4px;color:#b9c4df;font-size:13.5px}
.v22-count{align-self:flex-end;margin-top:-4px}
.v22-ok{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;background:rgba(10,60,40,.4);border:1px solid rgba(74,222,128,.35);color:#d1fae5;font-size:14px}
.v22-ok[hidden]{display:none}
.v22-quick{display:grid;gap:10px}
.v22-quick>*{display:flex;align-items:center;gap:14px;padding:16px;border-radius:14px;border:1px solid var(--v-border);background:linear-gradient(180deg,rgba(14,25,60,.82),rgba(9,17,42,.9));color:#dbe4fb;text-align:left;cursor:pointer;transition:border-color .2s,transform .2s;width:100%}
.v22-quick>*:hover{border-color:#6b8cff;transform:translateY(-2px)}
.v22-quick span{flex:1}.v22-quick b{display:block;color:#fff;font-size:15px}.v22-quick small{display:block;color:#8ea0c4;font-size:12.5px;margin-top:2px}

/* admin: subscriptions */
.v22-plan-admin{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
.v22-plan-admin .v22-card{display:grid;gap:14px}
.v22-pa-top{display:flex;gap:12px;align-items:center}
.v22-pa-top>div{flex:1}.v22-pa-top b{display:block;color:#fff;font-size:17px}.v22-pa-top small{display:block;color:#8ea0c4;font-size:12.5px}
.v22-pa-price{font-size:30px;font-weight:800;color:#fff}.v22-pa-price span{font-size:14px;font-weight:500;color:#8ea0c4;margin-left:4px}
.v22-pa-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.v22-pa-stats small{display:block;color:#8ea0c4;font-size:12px}.v22-pa-stats b{font-size:16px;color:#fff}
.v22-plan-admin .v22-row-btn{justify-self:start}

/* admin: sip config */
.v22-sip-cfg{display:grid;grid-template-columns:1.5fr 1fr;gap:16px;align-items:start}
.v22-sip-cfg>.v22-card{display:grid;gap:14px}
.v22-steps{display:flex;gap:0;margin:8px 0 4px}
.v22-steps>div{flex:1;display:flex;align-items:center;gap:10px;position:relative;color:#8ea0c4;font-size:14px;font-weight:600}
.v22-steps>div:not(:last-child)::after{content:"";flex:1;height:2px;margin:0 10px;background:rgba(148,163,184,.25)}
.v22-steps i{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:13px;background:#1a2552;border:1px solid rgba(110,140,230,.4);flex:none}
.v22-steps .done{color:#fff}.v22-steps .done i{background:linear-gradient(135deg,#3b82f6,#8b5cf6);border-color:transparent;box-shadow:0 0 14px rgba(99,102,241,.5)}
.v22-steps .done:not(:last-child)::after{background:linear-gradient(90deg,#3b82f6,#8b5cf6)}
.v22-daygrid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.v22-daygrid button{height:42px;border-radius:10px;border:1px solid var(--v-border-2);background:#0b1636;color:#dbe4fb;font-size:14.5px!important;font-weight:600;cursor:pointer;transition:transform .15s}
.v22-daygrid button:hover{transform:translateY(-2px);border-color:#6b8cff}
.v22-daygrid button.alt{border-color:rgba(74,222,128,.45);color:#a7f3c4}
.v22-daygrid button.active{background:linear-gradient(135deg,#3b82f6,#8b5cf6);border-color:transparent;color:#fff;box-shadow:0 0 18px rgba(99,102,241,.55)}
.v22-legend-row{display:flex!important;gap:16px;margin-top:2px}
.v22-legend-row i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}
.v22-legend-row i.a{background:linear-gradient(135deg,#3b82f6,#8b5cf6)}.v22-legend-row i.b{border:1px solid #4ade80}
.v22-sip-side{display:grid;gap:0}
.v22-orb{display:grid;place-items:center;margin:20px 0}
.v22-orb>div{width:180px;height:180px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 35%,#2b3a9e,#121a4a 70%);border:2px solid rgba(120,140,255,.6);box-shadow:0 0 40px rgba(99,102,241,.5),inset 0 0 30px rgba(120,140,255,.3);animation:v22Pulse 3.5s ease-in-out infinite}
.v22-orb small{color:#a5b4fc;font-size:12px;font-weight:700;letter-spacing:.12em}
.v22-orb strong{font-size:64px;font-weight:800;color:#fff;line-height:1}
.v22-orb span{color:#c7d2fe;font-size:12px;letter-spacing:.14em}

/* admin: data */
.v22-pipeline{display:flex;align-items:center;gap:0;margin-bottom:20px;padding:14px;border-radius:14px;background:rgba(10,18,44,.5);border:1px solid var(--v-border)}
.v22-pipeline>div{display:flex;align-items:center;gap:10px;color:#8ea0c4;font-size:14px;opacity:.65}
.v22-pipeline>div.done{opacity:1;color:#fff}
.v22-pipeline>i{flex:1;height:2px;margin:0 12px;background:repeating-linear-gradient(90deg,rgba(110,140,230,.5) 0 6px,transparent 6px 12px)}
.v22-pl-ic{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#f59e0b,#ef4444);color:#fff}.v22-pl-ic .v22-ic{width:16px;height:16px}
.v22-upload-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:18px}
.v22-drop.big{padding:30px 16px;gap:10px;min-height:260px}
.v22-drop.big b{font-size:18px;color:#fff}
.v22-drop.big em{font-style:normal;color:#7cb3ff;font-size:13px}
.v22-upload-fields{display:grid;gap:12px;align-content:start}
.v22-data-two,.v22-method-two,.v22-sys-two,.v22-notif-two{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.v22-schema{display:grid;gap:10px}
.v22-schema>div{display:grid;grid-template-columns:140px 1fr auto;gap:12px;align-items:center;padding:12px 14px;border-radius:10px;background:rgba(10,18,44,.6);border:1px solid var(--v-border)}
.v22-schema code{font-family:ui-monospace,Menlo,monospace;color:#7dd3fc;font-size:13.5px}
.v22-schema span{color:#c3cde6;font-size:14px}.v22-schema em{font-style:normal;font-size:12px;color:#a78bfa;background:rgba(139,92,246,.15);padding:3px 8px;border-radius:6px}
.v22-batch{display:flex;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid rgba(90,120,210,.18)}
.v22-batch:last-child{border-bottom:0}
.v22-batch>div{flex:1;display:grid;gap:6px}.v22-batch b{color:#fff;font-size:14.5px}.v22-batch small{color:#8ea0c4;font-size:12.5px}
/* admin: notifications */
.v22-templates{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.v22-templates article{display:grid;gap:10px;align-content:start;padding:18px;border-radius:14px;border:1px solid var(--v-border);background:rgba(10,18,44,.6);transition:transform .2s,border-color .2s}
.v22-templates article:hover{transform:translateY(-3px);border-color:#6b8cff}
.v22-templates b{color:#fff;font-size:15.5px}.v22-templates small{color:#8ea0c4;font-size:13px;line-height:1.45}
.v22-tpl-ch{display:flex;align-items:center;gap:6px}.v22-tpl-ch .v22-pill{margin-left:auto}
.v22-templates .v22-row-btn{justify-self:start}
.v22-camp{display:grid;grid-template-columns:1.2fr 1fr auto;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid rgba(90,120,210,.18)}
.v22-camp:last-child{border-bottom:0}
.v22-camp b{display:block;color:#fff;font-size:14.5px}.v22-camp small{display:block;color:#8ea0c4;font-size:12.5px;margin-top:4px}
.v22-mailprev{border-radius:14px;background:#f8fafc;color:#0f172a;padding:20px;display:grid;gap:12px}
.v22-mp-head{display:flex;gap:10px;align-items:center;padding-bottom:12px;border-bottom:1px solid #e2e8f0}
.v22-mp-head img{background:#0b1022;padding:4px;border-radius:8px;height:30px!important}
.v22-mp-head b{display:block;font-size:14px;color:#0f172a}.v22-mp-head small{display:block;font-size:12px;color:#64748b}
.v22-mailprev h3{font-size:19px;color:#0f172a}.v22-mailprev p{color:#334155;font-size:14px;line-height:1.6}
.v22-mp-btn{justify-self:start;padding:10px 16px;border-radius:9px;background:linear-gradient(90deg,#3b82f6,#7c5cfa);color:#fff;font-weight:600;font-size:14px}
.v22-mailprev>small{color:#94a3b8;font-size:12px}
/* admin: methodology */
.v22-lockbox{display:flex;gap:16px;align-items:flex-start;padding:20px;border-radius:16px;border:1px solid rgba(251,191,36,.35);background:linear-gradient(90deg,rgba(90,60,10,.35),rgba(20,20,50,.5))}
.v22-lockbox b{display:block;color:#fde68a;font-size:16.5px}.v22-lockbox p{margin-top:6px!important;color:#e7dcc0;font-size:14px;line-height:1.55}
.v22-release{display:flex;gap:14px;align-items:center;padding:14px;border-radius:12px;background:rgba(10,18,44,.6);border:1px solid var(--v-border);margin-bottom:6px}
.v22-release b{display:block;color:#fff;font-size:17px;font-family:ui-monospace,Menlo,monospace}.v22-release small{color:#8ea0c4;font-size:13px}
.v22-kv.icons span{display:flex;align-items:center;gap:10px}
.v22-method-two .v22-outline-btn{margin-top:14px}
.v22-gate-meter{width:min(280px,40%);align-self:center}
.v22-gates{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.v22-gate{display:flex;align-items:center;gap:12px;padding:14px;border-radius:12px;border:1px solid var(--v-border);background:rgba(10,18,44,.6);cursor:pointer;transition:border-color .2s,background .2s}
.v22-gate input{position:absolute;opacity:0;pointer-events:none}
.v22-gate-box{width:24px;height:24px;border-radius:7px;border:1.5px solid rgba(148,163,184,.5);display:grid;place-items:center;flex:none;color:transparent;transition:all .2s}
.v22-gate-box .v22-ic{width:15px;height:15px;stroke-width:3}
.v22-gate input:checked+.v22-gate-box{background:linear-gradient(135deg,#22c55e,#059669);border-color:transparent;color:#fff}
.v22-gate:has(input:checked){border-color:rgba(74,222,128,.45);background:rgba(10,60,40,.3)}
.v22-gate b{color:#e6ecfb;font-size:14px;font-weight:500}
/* admin: audit */
.v22-timeline{display:grid;gap:10px}
.v22-tl{display:grid;grid-template-columns:auto 1fr auto auto;gap:14px;align-items:center;padding:14px 16px;border-radius:12px;border:1px solid var(--v-border);background:rgba(10,18,44,.6);position:relative}
.v22-tl:hover{border-color:#6b8cff}
.v22-tl[hidden]{display:none}
.v22-tl-main b{color:#fff;font-size:14px!important}
.v22-tl-main small{display:block;color:#8ea0c4;font-size:13px;margin-top:3px}
.v22-actor{color:#c7d2fe}
.v22-tl time{color:#b9c4df;font-size:13px;white-space:nowrap}
/* admin: system */
.v22-ints{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.v22-ints article{display:flex;gap:12px;align-items:center;padding:16px;border-radius:14px;border:1px solid var(--v-border);background:rgba(10,18,44,.6)}
.v22-ints article>div{flex:1}.v22-ints b{display:block;color:#fff;font-size:15px}.v22-ints small{display:block;color:#8ea0c4;font-size:12.5px;margin-top:2px}
.v22-card-head>div>p{margin-top:6px}

/* top bar */
.workspace-search>span .v22-ic{width:17px;height:17px;color:#9fb0d4}
.workspace-actions .upgrade-link.v22-upgrade{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 16px 0 12px;border-radius:12px;border:1px solid rgba(251,191,36,.55);background:linear-gradient(135deg,rgba(120,80,10,.35),rgba(60,30,90,.35));color:#fde68a;font-weight:700;font-size:14px;font-family:var(--v-font);box-shadow:0 0 18px rgba(251,191,36,.15);transition:box-shadow .2s,transform .2s}
.workspace-actions .upgrade-link.v22-upgrade:hover{box-shadow:0 0 26px rgba(251,191,36,.35);transform:translateY(-1px)}
.workspace-actions .upgrade-link.v22-upgrade span{background:linear-gradient(90deg,#fde68a,#f59e0b);-webkit-background-clip:text;background-clip:text;color:transparent}
.v22-role-chip{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px;border-radius:12px;border:1px solid rgba(45,212,191,.45);background:rgba(13,80,90,.3);color:#99f6e4;font-weight:600;font-size:13.5px;font-family:var(--v-font)}
.workspace-actions .icon-action.v22-bell{position:relative;width:42px;height:42px;border-radius:12px;border:1px solid rgba(110,140,230,.35);background:rgba(20,30,70,.6);color:#dbe4fb;display:grid;place-items:center;padding:0}
.workspace-actions .icon-action.v22-bell:hover{border-color:#6b8cff;color:#fff}
.v22-bell .v22-ic{width:20px;height:20px}
.v22-bell-badge{position:absolute;top:-6px;right:-6px;min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:linear-gradient(135deg,#f43f5e,#e11d48);color:#fff;font-style:normal;font-size:11px;font-weight:700;display:grid;place-items:center;border:2px solid #0b1022;font-family:var(--v-font)}
.v22-notif-pop{position:absolute;top:54px;right:120px;width:360px;z-index:80;border-radius:16px;border:1px solid rgba(110,140,230,.4);background:#0f1838;box-shadow:0 24px 60px rgba(0,0,0,.55);padding:8px;animation:v22Bub .2s ease}
.v22-notif-pop[hidden]{display:none}
.v22-np-head{display:flex;justify-content:space-between;align-items:center;padding:10px 10px 12px;border-bottom:1px solid rgba(110,140,230,.2)}
.v22-np-head b{color:#fff;font-size:15px}
.v22-np-head button{background:none;border:0;color:#60b4ff;font-size:13px!important;font-weight:600;cursor:pointer}
.v22-np-item{display:flex;gap:12px;align-items:flex-start;padding:12px 10px;border-radius:10px;position:relative}
.v22-np-item:hover{background:rgba(60,90,200,.18)}
.v22-np-item.unread::after{content:"";position:absolute;right:10px;top:16px;width:8px;height:8px;border-radius:50%;background:#3b82f6;box-shadow:0 0 8px #3b82f6}
.v22-np-item div{flex:1}.v22-np-item b{display:block;color:#fff;font-size:14px}.v22-np-item small{display:block;color:#a7b3cf;font-size:12.5px;margin-top:2px}
.v22-np-item time{color:#7d8bab;font-size:11.5px;white-space:nowrap;margin-right:14px}
.v22-np-all{display:flex;justify-content:center;align-items:center;gap:6px;padding:12px;margin-top:4px;border-top:1px solid rgba(110,140,230,.2);color:#60b4ff;font-weight:600;font-size:13.5px}
.profile-menu>b .v22-ic{width:16px;height:16px}

@media (max-width:1280px){.v22-skpis{grid-template-columns:1fr 1fr}.v22-templates{grid-template-columns:1fr 1fr}.v22-help-topics{grid-template-columns:repeat(3,1fr)}}
@media (max-width:1100px){.v22-set-layout,.v22-help-grid,.v22-sip-cfg,.v22-data-two,.v22-method-two,.v22-sys-two,.v22-notif-two,.v22-upload-grid{grid-template-columns:1fr}.v22-set-side{position:static}.v22-plan-admin,.v22-ints{grid-template-columns:1fr 1fr}.v22-channels-grid{grid-template-columns:1fr}}
@media (max-width:760px){.v22-phead{flex-direction:column;align-items:flex-start}.v22-skpis,.v22-plan-admin,.v22-ints,.v22-templates,.v22-gates,.v22-form-grid,.v22-two-act{grid-template-columns:1fr}.v22-help-topics{grid-template-columns:1fr 1fr}.v22-notice{flex-wrap:wrap}.v22-tl{grid-template-columns:auto 1fr}.v22-tl time,.v22-tl .v22-pill{grid-column:2}.v22-pipeline{flex-wrap:wrap;gap:8px}.v22-pipeline>i{display:none}.v22-camp{grid-template-columns:1fr}.v22-schema>div{grid-template-columns:1fr}.v22-steps span{display:none}.v22-data-chips{padding-left:0}.v22-notif-pop{right:0;width:min(360px,calc(100vw - 24px))}.v22-savebar{flex-direction:column;align-items:stretch}.v22-gate-meter{width:100%}}
.v22-help-grid>*,.v22-help-side,.v22-contact>*{min-width:0}
.v22-seg-pills.wrap{width:auto}
.v22-seg-pills.wrap button{flex:1 1 auto}
.v22-skpis article>div{min-width:0}
.v22-skpis b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:clamp(18px,1.6vw,24px)}
.v22-smsprev,.v22-pushprev{display:grid;gap:12px;padding:20px;border-radius:14px;background:#0a1130;border:1px solid var(--v-border)}
.v22-smsprev[hidden],.v22-pushprev[hidden],.v22-mailprev[hidden]{display:none}
.v22-smsprev small,.v22-pushprev small{color:#8ea0c4;font-size:12.5px}
.v22-sms-bubble{max-width:360px;padding:14px 16px;border-radius:18px 18px 18px 4px;background:#1f2a4f;color:#e6ecfb;font-size:14.5px;line-height:1.55}
.v22-sms-bubble b{display:block;font-size:12px;color:#7cb3ff;margin-bottom:4px;letter-spacing:.06em}
.v22-pushprev .v22-notif{max-width:380px}

/* ======================================================================
   v22.3 — data-driven admin, workbook upload
   ====================================================================== */
.v22-head-right{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.v22-src{display:inline-flex;align-items:center;gap:8px;color:#9fb0d4;font-size:12.5px}
.v22-tip-auto{transform:translate(14px,-15%);white-space:nowrap}
.v22-tip-auto.left{transform:translate(calc(-100% - 14px),-15%)}
.v22-dsum em.warnb{background:rgba(245,158,11,.2);color:#fbbf24;padding:2px 6px;border-radius:5px}
.v22-loading{display:flex;align-items:center;gap:16px;padding:26px}
.v22-loading b{display:block;color:#fff;font-size:16px}.v22-loading small{display:block;color:#9fb0d4;font-size:13.5px;margin-top:4px}
.v22-loading.inline{padding:16px 4px}
.v22-spin{width:34px;height:34px;border-radius:50%;border:3px solid rgba(110,140,230,.25);border-top-color:#7c8cff;animation:v22Spin .8s linear infinite;flex:none}
@keyframes v22Spin{to{transform:rotate(360deg)}}
.v22-tpager{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.v22-pager.sm{margin:0;gap:6px}.v22-pager.sm button{width:34px;height:34px;font-size:13px!important}
.v22-ell{color:#6b7aa3;align-self:center;padding:0 2px}
.v22-pipeline>div.fail{opacity:1;color:#f87171}
.v22-rep-fatal{display:flex;gap:12px;align-items:center;margin-top:16px;padding:14px 16px;border-radius:12px;border:1px solid rgba(248,113,113,.4);background:rgba(127,29,29,.25);color:#fecaca;font-size:14px}
.v22-report{margin-top:18px;border-radius:14px;border:1px solid var(--v-border);background:rgba(8,14,36,.55);padding:16px}
.v22-report.ok{border-color:rgba(74,222,128,.4)}.v22-report.bad{border-color:rgba(248,113,113,.4)}
.v22-rep-head{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.v22-rep-head>div:nth-child(2){flex:1;min-width:220px}
.v22-rep-head b{display:block;color:#fff;font-size:16px}.v22-rep-head small{display:block;color:#9fb0d4;font-size:13px;margin-top:3px}
.v22-rep-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.v22-rep-actions .v22-grad-btn{height:40px;font-size:14px!important}
.v22-rep-actions .v22-grad-btn:disabled{opacity:.4;cursor:not-allowed;transform:none;filter:grayscale(.5)}
.v22-rep-sheets{display:grid;gap:8px;margin-top:14px}
.v22-rep-sheet{border-radius:10px;border:1px solid var(--v-border);background:rgba(14,22,54,.7)}
.v22-rep-sheet summary{display:flex;align-items:center;gap:10px;padding:12px 14px;cursor:pointer;list-style:none;flex-wrap:wrap}
.v22-rep-sheet summary::-webkit-details-marker{display:none}
.v22-rep-sheet summary b{color:#fff;font-size:14.5px}.v22-rep-sheet summary>span:not(.v22-pill){color:#9fb0d4;font-size:13px;flex:1}
.v22-issue{display:flex;gap:10px;align-items:baseline;padding:8px 14px;border-top:1px solid rgba(90,120,210,.15);font-size:13px;color:#dbe4fb}
.v22-issue .mono{min-width:64px;color:#9fb0d4}
.v22-issue code{color:#7dd3fc;font-size:12.5px}
.v22-issue.bad{border-left:3px solid #f87171}.v22-issue.warn{border-left:3px solid #fbbf24}.v22-issue.more{color:#9fb0d4}
.v22-sheet-counts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.v22-sheet-counts>div{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:rgba(10,18,44,.6);border:1px solid var(--v-border)}
.v22-sheet-counts span{flex:1;color:#c3cde6;font-size:13.5px}.v22-sheet-counts b{color:#fff;font-size:14px;font-variant-numeric:tabular-nums}
.v22-schema-table td{white-space:normal!important;font-size:13.5px;vertical-align:top}
.v22-schema-table td:first-child,.v22-schema-table td:nth-child(2),.v22-schema-table td:nth-child(3){white-space:nowrap!important}
.v22-schema-table code{color:#7dd3fc}
.v22-upload-fields .v22-callout{margin-top:0}
.v22-upload-fields .v22-callout span{flex:1}
.v22-tip strong em{font-style:normal;color:#a7f3c4;font-size:12px}
@media (max-width:760px){.v22-head-right{align-items:flex-start}.v22-sheet-counts{grid-template-columns:1fr}}
.v22-phead>div:first-child{flex:1;min-width:280px}
.v22-phead{flex-wrap:wrap}
.v22-phead-actions{flex-wrap:wrap;justify-content:flex-end}
.v22-phead-actions .v22-outline-btn{white-space:nowrap}
.v22-last dd{word-break:normal;overflow-wrap:anywhere}
.v22-data-two .v22-card-head{flex-wrap:wrap}
.v22-tip-auto{transform:translate(14px,0)}.v22-tip-auto.left{transform:translate(calc(-100% - 14px),0)}

/* v22.4 — KPI cards without sparklines; interactive chart hover */
.v22-akpi{grid-template-columns:auto 1fr;align-items:start;padding:20px 18px}
.v22-akpi-delta{display:flex;align-items:center;gap:10px;margin-top:12px;flex-wrap:wrap}
.v22-akpi-delta em{display:inline-flex!important;align-items:center;gap:6px;margin:0!important;padding:4px 10px;border-radius:999px;font-size:14px!important;font-weight:700}
.v22-akpi-delta em .v22-ic{width:15px;height:15px}
.v22-akpi-delta.up em{background:rgba(34,197,94,.14);color:#4ade80}
.v22-akpi-delta.down em{background:rgba(239,68,68,.14);color:#f87171}
.v22-akpi-delta.down em .v22-ic{transform:scaleY(-1)}
.v22-akpi-delta span{color:#b9c4df;font-size:13px}
.v22-akpi-prev{display:block;margin-top:10px!important;color:#8ea0c4!important;font-size:12.5px!important;font-weight:400!important}
.v22-akpi-prev b{display:inline!important;font-size:12.5px!important;margin:0!important;color:#dbe4fb;font-weight:600}
.v22-hov{cursor:crosshair;touch-action:pan-y}
.v22-hov rect[data-i]{transition:opacity .15s}
.v22-hov:hover rect[data-i]:not(.hov){opacity:.55}
.v22-hov rect.hov{filter:drop-shadow(0 0 6px rgba(168,85,247,.8))}
.v22-hov-tip{transition:left .12s ease-out}
.v22-hov-line{height:80%;width:0;border-left:1px dashed rgba(200,210,255,.45);opacity:0;transition:left .12s ease-out,opacity .15s}
.v22-hov-line.on{opacity:1}
.v22-akpi-main>small:first-child{padding-right:34px}
.v22-akpi-ghost{opacity:.12}

/* ======================================================================
   v22.5 — brand, top bar, login, range picker, pricing config, integrations
   ====================================================================== */
/* brand mark: keep the artwork's own aspect ratio (530×471) */
.brand .brand-symbol,img.brand-symbol{width:auto!important;max-width:none!important;flex-basis:auto!important;object-fit:contain!important;aspect-ratio:530/471}
.public-topbar .brand .brand-symbol{height:44px!important;max-height:44px!important}
.sidebar .brand .brand-symbol,.side-brand .brand-symbol{height:40px!important;max-height:40px!important}
.brand{gap:12px!important;align-items:center}
.brand:focus{outline:none!important}
.brand:focus-visible{outline:2px solid #6b8cff!important;outline-offset:6px;border-radius:10px}
.brand-wording{gap:3px!important}
.public-topbar .brand-wording strong{font:800 23px/1.05 'Inter',sans-serif!important;letter-spacing:-.02em!important;color:#fff}
.public-topbar .brand-wording small{font:700 10.5px/1.1 'Inter',sans-serif!important;letter-spacing:.2em!important;color:#9fb3d6}
.sidebar .brand-wording strong,.side-brand .brand-wording strong{font:800 20px/1.05 'Inter',sans-serif!important;letter-spacing:-.02em!important}
.sidebar .brand-wording small,.side-brand .brand-wording small{font:700 9.5px/1.1 'Inter',sans-serif!important;letter-spacing:.18em!important}
/* public nav */
.topbar.public-topbar{height:80px}
.public-topbar .public-nav{gap:34px!important}
.public-topbar .public-nav a{font-family:'Inter',sans-serif!important;font-size:16px!important;font-weight:600!important;color:#c3cfe6!important;letter-spacing:0!important}
.public-topbar .public-nav a:hover{color:#fff!important}
.public-topbar .login-outline,.public-topbar .top-cta{font-family:'Inter',sans-serif!important;font-size:15.5px!important;font-weight:700!important;padding:12px 22px!important;border-radius:11px!important}
/* workspace top bar without search */
.workspace-topbar.v22-nosearch{justify-content:flex-end}
.profile-menu[data-v22-profile]{cursor:pointer;border-radius:12px;padding:6px 12px 6px 6px!important;transition:background .2s}
.profile-menu[data-v22-profile]:hover{background:rgba(60,90,200,.2)}
.v22-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px;flex-wrap:wrap}
.v22-aprof .v22-prof-av{width:64px;height:64px;font-size:26px}
/* login */
.v22-auth{min-height:calc(var(--vh100,100vh) - 80px);padding:64px 16px 90px}
.v22-auth-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.v22-auth-bg svg{opacity:.55}
.v22-auth-card{width:min(540px,100%);padding:44px 44px 34px;border-radius:24px;box-shadow:0 40px 100px rgba(0,0,0,.55),0 0 60px rgba(80,110,255,.18),inset 0 1px 0 rgba(160,190,255,.08);animation:v22CardIn .6s cubic-bezier(.2,.7,.2,1) both}
@keyframes v22CardIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
.v22-auth-brand .v22-mark{width:44px;height:44px}
.v22-auth-brand b{font-size:26px}
.v22-auth h1{font-size:32px;margin-top:20px}
.v22-auth-card>p{font-size:16px}
.v22-seg{margin-top:26px}.v22-seg button{height:50px;font-size:15.5px!important}
#auth-form{gap:14px;margin-top:18px}
.v22-auth-in{height:56px;padding:0 16px;border-radius:12px}
.v22-auth-in input{font-size:16px}
.v22-auth-in .v22-ic{width:20px;height:20px}
.v22-auth-opts{font-size:15px}.v22-auth-opts button{font-size:15px!important}
.v22-auth-card .v22-grad-btn.lg{height:58px;font-size:17px!important;border-radius:12px}
.v22-social button{height:56px;font-size:16px!important;border-radius:12px}
.v22-auth-foot{font-size:15px}.v22-auth-foot button{font-size:15px!important}
@media (max-width:600px){.v22-auth-card{padding:30px 22px 26px}.v22-auth h1{font-size:26px}}
/* date range modal */
.v22-range-pre{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.v22-range-pre button{height:36px;padding:0 14px;border-radius:18px;border:1px solid var(--v-border-2);background:#0b1636;color:#dbe4fb;font-size:13.5px!important;font-weight:600;cursor:pointer}
.v22-range-pre button.active,.v22-range-pre button:hover{background:linear-gradient(90deg,#3b82f6,#7c5cfa);border-color:transparent;color:#fff}
.v22-range-modal .v22-fl input[type=date]{color-scheme:dark}
.v22-range{cursor:pointer}
/* pricing config */
.v22-pricing-cfg .v22-sub{margin-bottom:14px}
.v22-pc-list{display:grid;gap:14px;max-height:62vh;overflow:auto;padding-right:4px}
.v22-pc{border:1px solid var(--v-border);border-radius:14px;padding:16px;background:rgba(10,18,44,.6);display:grid;gap:10px}
.v22-pc.focus{border-color:#6b8cff;box-shadow:0 0 0 3px rgba(91,124,255,.2)}
.v22-pc header{display:flex;align-items:center;gap:10px}.v22-pc header b{flex:1;color:#fff;font-size:17px}
.v22-pc-active{display:flex;align-items:center;gap:8px;color:#c3cde6;font-size:13px}
.v22-pc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.v22-pc small[data-pc-save]{color:#4ade80}
@media (max-width:640px){.v22-pc-grid{grid-template-columns:1fr}}
/* integrations */
.v22-int-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.v22-int-stats button{display:grid;gap:6px;justify-items:start;padding:14px;border-radius:12px;border:1px solid var(--v-border);background:rgba(10,18,44,.6);cursor:pointer;text-align:left;transition:border-color .2s}
.v22-int-stats button:hover,.v22-int-stats button.active{border-color:#6b8cff;box-shadow:0 0 0 3px rgba(91,124,255,.15)}
.v22-int-stats b{font-size:26px;color:#fff;font-weight:800}.v22-int-stats small{color:#8ea0c4;font-size:12.5px}
.v22-int-bar{display:flex!important;margin-top:14px}
.v22-int-bar em{border-radius:0!important}.v22-int-bar .s-Ready{background:#22c55e}.v22-int-bar .s-Manual{background:#3b82f6}.v22-int-bar .s-Simulated{background:#f59e0b}
.v22-int-cats{flex:1}
.v22-int-group{margin-top:18px}
.v22-int-group h3{display:flex;align-items:center;gap:10px;font-size:16px;color:#fff;margin-bottom:10px!important}
.v22-int-group h3 span{margin-left:4px;font-size:12px;color:#9fb0d4;background:rgba(60,90,200,.25);padding:2px 8px;border-radius:999px}
.v22-int{border:1px solid var(--v-border);border-radius:12px;background:rgba(10,18,44,.6);margin-top:8px;transition:border-color .2s}
.v22-int[open]{border-color:rgba(110,140,255,.55)}
.v22-int summary{display:flex;align-items:center;gap:12px;padding:12px 14px;cursor:pointer;list-style:none}
.v22-int summary::-webkit-details-marker{display:none}
.v22-int summary b{flex:1;color:#fff;font-size:14.5px;font-weight:600}
.v22-int-id{min-width:72px;color:#7dd3fc!important}
.v22-int-car{width:16px;height:16px;color:#8ea0c4;transition:transform .2s}.v22-int[open] .v22-int-car{transform:rotate(180deg)}
.v22-int-body{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;padding:4px 14px 14px 98px}
.v22-int-body small{display:block;color:#8ea0c4;font-size:11.5px;text-transform:uppercase;letter-spacing:.06em}
.v22-int-body p{margin-top:4px!important;color:#dbe4fb;font-size:13.5px;line-height:1.5}
@media (max-width:1100px){.v22-int-stats{grid-template-columns:repeat(3,1fr)}}
@media (max-width:760px){.v22-int-stats{grid-template-columns:1fr 1fr}.v22-int-body{grid-template-columns:1fr;padding-left:14px}.v22-int summary{flex-wrap:wrap}.public-topbar .brand-wording strong{font-size:19px!important}.public-topbar .brand .brand-symbol{height:36px!important}}
header.topbar.public-topbar .top-actions.public-actions a.top-cta,header.topbar.public-topbar .top-actions.public-actions a.login-outline{font-size:15.5px!important;font-weight:700!important;padding:12px 22px!important;height:auto!important;line-height:1.2!important}
#integrations .v22-filters{flex-direction:column;align-items:stretch}
#integrations .v22-int-cats{width:auto;justify-content:flex-start}
#integrations .v22-int-cats button{flex:0 0 auto}
/* v22.6 */
.brand .brand-symbol,img.brand-symbol{aspect-ratio:488/446}
.v22-features{max-width:none;padding:90px 3.5% 70px}
.v22-feat-grid{gap:24px;max-width:1720px;margin-left:auto;margin-right:auto}
.v22-feat{padding:28px 28px 24px}
.pv{height:150px}
.v22-feat-ic.brand img{height:30px!important;width:auto!important}
/* v22.7 — plans & FAQ use the same width as the feature cards */
.v22-pricing,.v22-faq{max-width:none;padding-left:3.5%;padding-right:3.5%}
.v22-pricing>.v22-plans,.v22-pricing>.v22-trust,.v22-faq>.v22-faq-grid{max-width:1720px;margin-left:auto;margin-right:auto}
.v22-plans{gap:28px}
.v22-plan{padding:32px 32px 28px}
.v22-faq-grid{grid-template-columns:.8fr 1.2fr;gap:64px}
footer.public-footer .public-footer-inner{max-width:1720px!important;width:auto!important;margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important}
footer.public-footer{padding-left:3.5%!important;padding-right:3.5%!important}
footer.public-footer img.v22-foot-mark{height:150px!important;width:auto!important;max-width:none!important;max-height:none!important;display:block!important}
@media (max-width:760px){footer.public-footer img.v22-foot-mark{height:96px!important}}
footer.public-footer .footer-main-grid>.footer-brand-col.v22-foot-brand{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;grid-template-rows:auto!important;align-items:center!important;column-gap:28px!important;row-gap:0!important}
footer.public-footer .v22-foot-brand>.v22-foot-copy{display:flex!important;flex-direction:column!important;gap:12px!important;grid-column:2!important;grid-row:1!important}
footer.public-footer .v22-foot-brand>img.v22-foot-mark{grid-column:1!important;grid-row:1!important;margin:0!important}
footer.public-footer .v22-foot-copy>*{margin:0!important}
@media (max-width:760px){footer.public-footer .footer-main-grid>.footer-brand-col.v22-foot-brand{column-gap:16px!important;align-items:start!important}}

/* ======================================================================
   v22.9 — thin hero lines + hero alternatives (B calendar, C comparison, D phone)
   ====================================================================== */
.v22-hero-line{filter:drop-shadow(0 0 3px rgba(59,130,246,.9)) drop-shadow(0 0 10px rgba(59,130,246,.35))}
.v22-hero .v22-node{filter:drop-shadow(0 0 4px #22d3ee)}
.v22-hero-switch{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:5;display:flex;gap:6px;padding:6px;border-radius:14px;border:1px solid rgba(110,140,230,.4);background:rgba(8,14,36,.85);backdrop-filter:blur(8px)}
.v22-hero-switch a{padding:8px 14px;border-radius:9px;color:#c9d3ec;font-size:13.5px;font-weight:600;white-space:nowrap}
.v22-hero-switch a.active{background:linear-gradient(90deg,#3b82f6,#7c5cfa);color:#fff}
/* shared */
.hb-glow{position:absolute;right:12%;top:12%;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(99,102,241,.35),transparent 65%);filter:blur(10px)}
.v22-hero-art.hb,.v22-hero-art.hc,.v22-hero-art.hd{pointer-events:none}
/* B — calendar spotlight */
.hb-cal{position:absolute;right:9%;top:50%;transform:translateY(-50%) rotate(-2deg);width:min(440px,38vw);padding:22px 22px 18px;border-radius:22px;border:1px solid rgba(120,140,240,.45);background:linear-gradient(180deg,rgba(22,30,74,.92),rgba(12,18,50,.94));box-shadow:0 40px 90px rgba(0,0,0,.5),0 0 60px rgba(99,102,241,.25);animation:hbIn .9s cubic-bezier(.2,.7,.2,1) both}
@keyframes hbIn{from{opacity:0;transform:translateY(-44%) rotate(-6deg) scale(.95)}}
.hb-cal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.hb-cal-head b{color:#fff;font-size:19px}
.hb-cal-head span{display:inline-flex;align-items:center;gap:6px;color:#a5b4fc;font-size:13px;font-weight:600;padding:5px 10px;border-radius:999px;background:rgba(99,102,241,.2)}
.hb-cal-head .v22-ic{width:14px;height:14px}
.hb-week,.hb-days{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;gap:6px 0}
.hb-week span{color:#8ea0c4;font-size:12px;font-weight:600}
.hb-days span{position:relative;height:38px;display:grid;place-items:center;color:#dbe4fb;font-size:14px;font-weight:500;opacity:0;animation:hbDay .4s ease forwards;animation-delay:calc(var(--d)*25ms + .3s)}
.hb-days span.mute{animation:none}
@keyframes hbDay{to{opacity:1}}
.hb-days span.alt::before{content:"";position:absolute;width:32px;height:32px;border-radius:50%;border:1px solid rgba(74,222,128,.55)}
.hb-days span.best{color:#fff;font-weight:800;z-index:0}
.hb-days span.best::before{content:"";position:absolute;width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#8b5cf6);z-index:-1;box-shadow:0 0 22px rgba(99,102,241,.8)}
.hb-days span.best i{position:absolute;width:36px;height:36px;border-radius:50%;border:2px solid #a78bfa;animation:hbPing 2s ease-out infinite;animation-delay:1.3s}
@keyframes hbPing{0%{transform:scale(1);opacity:.9}100%{transform:scale(2.1);opacity:0}}
.hb-cmp{display:grid;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid rgba(110,140,230,.25)}
.hb-cmp>div{display:grid;grid-template-columns:120px 1fr auto;align-items:center;gap:10px}
.hb-cmp small{color:#aab6d2;font-size:12.5px}.hb-cmp b{color:#fff;font-size:13.5px;font-variant-numeric:tabular-nums}
.hb-cmp i{display:block;height:6px;border-radius:6px;background:rgba(148,163,184,.15);overflow:hidden}
.hb-cmp em{display:block;height:100%;width:0;border-radius:inherit;background:#64748b;animation:hbBar 1.2s cubic-bezier(.2,.7,.2,1) forwards 1s}
.hb-cmp .ai em{background:linear-gradient(90deg,#38bdf8,#8b5cf6);box-shadow:0 0 10px rgba(99,102,241,.6)}
.hb-cmp .ai b{color:#4ade80}
@keyframes hbBar{to{width:var(--w)}}
.hb-note{margin-top:10px!important;color:#6f7d9c;font-size:11.5px}
.hb-toast{position:absolute;right:5%;top:12%;display:flex;gap:10px;align-items:center;padding:12px 16px;border-radius:14px;background:#eef1fb;color:#111827;box-shadow:0 18px 40px rgba(0,0,0,.45);animation:hbToast 6s ease-in-out infinite 1.8s;opacity:0}
.hb-toast .v22-mark{background:#141a3c;border-radius:8px;padding:4px;width:30px;height:30px}
.hb-toast b{display:block;font-size:14px}.hb-toast small{color:#4b5563;font-size:12px}
@keyframes hbToast{0%{opacity:0;transform:translateY(-12px)}8%,80%{opacity:1;transform:none}92%,100%{opacity:0;transform:translateY(-12px)}}
.hb-f1{right:auto!important;left:6%;top:auto!important;bottom:16%}
/* C — two thin lines */
.v22-hero-art.hc>svg{position:absolute;right:3%;top:50%;transform:translateY(-50%);width:min(760px,56vw);height:auto}
.hc-mod,.hc-fix{stroke-dasharray:100;stroke-dashoffset:100;animation:hcDraw 2.4s cubic-bezier(.4,.1,.2,1) forwards .3s}
.hc-fix{stroke-dasharray:5 6}
.hc-fix{animation:hcFade 1.2s ease forwards .4s;opacity:0}
@keyframes hcFade{to{opacity:1}}
.hc-mod{filter:drop-shadow(0 0 4px rgba(56,189,248,.8))}
@keyframes hcDraw{to{stroke-dashoffset:0}}
.hc-band{opacity:0;animation:hcFade 1s ease forwards 2.2s}
.hc-dot{opacity:0;animation:hcFade .3s ease forwards;animation-delay:calc(.4s + var(--i)*.3s)}
.hc-lab{position:absolute;right:4%;padding:6px 12px;border-radius:9px;font-size:13px;font-weight:600;color:#dbe4fb;background:rgba(10,16,44,.85);border:1px solid rgba(120,140,240,.45);opacity:0;animation:hcFade .6s ease forwards 2.4s}
.hc-lab b{margin-left:6px;color:#fff}
.hc-lab.mod{top:20%;border-color:rgba(167,139,250,.6)}.hc-lab.mod b{color:#c4b5fd}
.hc-lab.fix{top:48%}
.hc-chip{left:auto!important;right:44%;top:16%!important;padding:12px 18px}
.hc-chip b{display:flex;align-items:center;gap:8px;color:#4ade80;font-size:22px;font-weight:700}
.hc-chip small{display:block;margin-top:4px;color:#d6def3;font-size:13px;line-height:1.35}
.hc-legend{position:absolute;right:6%;bottom:9%;display:flex;gap:18px;align-items:center;color:#aab6d2;font-size:12.5px}
.hc-legend span{display:inline-flex;align-items:center;gap:8px}
.hc-legend i{width:18px;height:2px;display:inline-block}.hc-legend i.m{background:linear-gradient(90deg,#38bdf8,#a78bfa)}.hc-legend i.f{border-top:2px dashed #94a3b8;height:0}
.hc-legend em{font-style:normal;color:#6f7d9c}
/* D — phone */
.hd-bg{position:absolute;inset:0;width:100%;height:100%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 30%);mask-image:linear-gradient(90deg,transparent,#000 30%)}
.hd-phone{position:absolute;right:16%;top:50%;transform:translateY(-50%);width:290px;height:560px;border-radius:44px;padding:16px;border:2px solid rgba(140,150,255,.55);background:linear-gradient(180deg,#141b44,#0a0f2c);box-shadow:0 40px 90px rgba(0,0,0,.55),0 0 50px rgba(99,102,241,.3),inset 0 0 0 6px #070b22;display:flex;flex-direction:column;align-items:center;animation:hbIn .9s cubic-bezier(.2,.7,.2,1) both}
.hd-notch{width:90px;height:24px;border-radius:14px;background:#04060f;margin-top:4px}
.hd-time{margin-top:34px;font-size:56px;font-weight:300;color:#fff;letter-spacing:-.02em}
.hd-date{color:#c7d2fe;font-size:14px}
.hd-card{width:100%;margin-top:18px;border-radius:18px;padding:12px;background:rgba(238,241,251,.95);color:#111827;display:flex;gap:10px;align-items:flex-start;opacity:0;animation:hdCard .6s cubic-bezier(.2,.7,.2,1) forwards}
.hd-card.n1{animation-delay:.9s}.hd-card.n2{animation-delay:1.4s;margin-top:10px;display:block;background:rgba(30,38,90,.85);color:#fff;border:1px solid rgba(140,150,255,.35)}
@keyframes hdCard{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
.hd-card .v22-mark{background:#141a3c;border-radius:7px;padding:4px;width:28px;height:28px;flex:none}
.hd-card b{display:flex;justify-content:space-between;font-size:13px}.hd-card b small{color:#6b7280;font-weight:400}
.hd-card p{font-size:12px;line-height:1.45;color:#374151;margin-top:2px!important}
.hd-best{display:grid;justify-items:center;gap:2px}
.hd-best small{font-size:10.5px;letter-spacing:.12em;color:#a5b4fc;font-weight:700}
.hd-best strong{font-size:44px;font-weight:800;line-height:1;background:linear-gradient(90deg,#7dd3fc,#c4b5fd);-webkit-background-clip:text;background-clip:text;color:transparent}
.hd-best span{display:inline-flex;align-items:center;gap:6px;color:#4ade80;font-size:12px;font-weight:600}.hd-best .v22-ic{width:14px;height:14px}
.hd-alts{display:flex;justify-content:center;gap:8px;margin-top:10px}
.hd-alts span{padding:4px 10px;border-radius:999px;border:1px solid rgba(74,222,128,.45);color:#bbf7d0;font-size:12px}
.hd-home{margin-top:auto;width:110px;height:5px;border-radius:4px;background:rgba(255,255,255,.5)}
.hd-f1{right:auto!important;left:auto;top:30%!important;right:42%!important;display:flex;align-items:center;gap:12px;padding:12px 18px;font-size:14.5px;line-height:1.35}
.hd-f2{right:4%!important;top:14%!important;padding:12px 18px}
.hd-f2 b{display:flex;align-items:center;gap:8px;color:#4ade80;font-size:20px;font-weight:700}
.hd-f2 small{display:block;margin-top:4px;color:#d6def3;font-size:13px;line-height:1.35}
@media (max-width:1180px){.hb-cal{right:50%;transform:translate(50%,-50%) rotate(-2deg);width:min(440px,90vw)}.hd-phone{right:50%;transform:translate(50%,-50%) scale(.75)}.v22-hero-art.hc>svg{width:92vw;right:4vw}.hb-toast,.hd-f1,.hc-chip{display:none}.v22-hero-switch{flex-wrap:wrap;justify-content:center;width:max-content;max-width:94vw}}
@media (prefers-reduced-motion:reduce){.hb-days span,.hb-cmp em,.hb-toast,.hc-mod,.hc-fix,.hc-band,.hc-dot,.hc-lab,.hd-card{animation:none!important;opacity:1!important;stroke-dashoffset:0!important;width:var(--w)}}
/* hero variant fixes */
.v22-hero-switch{position:fixed!important;bottom:18px!important;z-index:70!important;box-shadow:0 14px 40px rgba(0,0,0,.5)}
.v22-hero p.hb-note{font-size:11.5px!important;margin-top:10px!important;max-width:none!important;line-height:1.4!important;color:#6f7d9c!important}
.hb-f1{left:4%!important;top:8%!important;bottom:auto!important}
.hb-toast{right:3%;top:auto;bottom:6%}
.v22-hero-art.hc>svg{-webkit-mask-image:none!important;mask-image:none!important}
.hc-chip{right:auto!important;left:14%!important;top:10%!important}
/* hero D on small screens: phone sits below the copy */
@media (max-width:1180px){
 .v22-hero.hero-d{padding-bottom:40px}
 .v22-hero.hero-d .v22-hero-art.hd{position:relative;width:100%;height:600px;top:auto;bottom:auto;margin-top:24px}
 .v22-hero.hero-d .hd-phone{right:50%;top:0;transform:translateX(50%)}
 .v22-hero.hero-d .hd-f2{display:none}
}
@media (max-width:760px){.v22-hero.hero-d .v22-hero-art.hd{height:500px}.v22-hero.hero-d .hd-phone{transform:translateX(50%) scale(.85);transform-origin:top center}}

/* v23 — environment badge, current-plan card */
.ma-env-badge{position:fixed;left:12px;bottom:12px;z-index:90;padding:4px 10px;border-radius:8px;font:700 11px/1.4 Inter,sans-serif;letter-spacing:.12em;color:#1a1300;background:#fbbf24;box-shadow:0 4px 14px rgba(0,0,0,.4);pointer-events:none}
.ma-cur-plan{margin-bottom:18px}
.v22-ints article small b{color:#dbe4fb;font-weight:600}

.v22-int-bar .s-Mock{background:#f59e0b}
#ma-mocks .v22-ints{grid-template-columns:repeat(2,minmax(0,1fr))}
#ma-mocks .v22-ints article{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:14px}
#ma-mocks .v22-ints article>.v22-pill{flex:none;white-space:nowrap}
#ma-mocks .v22-ints article small{font-size:13px;line-height:1.5;margin-top:4px}
#ma-mocks .v22-ints article small b{font-weight:500;color:#dbe4fb}
#ma-mocks .v22-ints article small.v22-muted{font-size:11.5px;color:#7d8bab;word-break:break-word}
@media (max-width:1100px){#ma-mocks .v22-ints{grid-template-columns:1fr}}

/* v23.2 — user Subscription page (larger type, same components as landing pricing) */
.v22-subpage{display:grid;gap:22px}
.v22-subhead{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;padding:28px 30px;border-radius:20px;border:1px solid var(--v-border);background:radial-gradient(ellipse at 90% 0%,rgba(99,102,241,.25),transparent 60%),linear-gradient(180deg,rgba(18,28,66,.9),rgba(11,18,46,.92))}
.v22-subhead h1{margin-top:16px!important;font-size:34px;font-weight:800;color:#fff;letter-spacing:-.02em}
.v22-subhead p{margin-top:8px!important;color:#c3cde6;font-size:17px}
.v22-subhead .v22-billing{margin-top:0}
.v22-subpage .v22-plans{margin-top:8px}
.v22-subpage .v22-plan h3{font-size:24px}
.v22-subpage .v22-plan-head p{font-size:15.5px}
.v22-subpage .v22-price b{font-size:46px}
.v22-subpage .v22-price span{font-size:16px}
.v22-subpage .v22-price-note{font-size:14px}
.v22-subpage .v22-plan li{font-size:16px}
.v22-subpage .v22-plan .v22-grad-btn,.v22-subpage .v22-plan-btn{height:54px;font-size:16.5px!important;width:100%}
.v22-plan-btn:disabled{opacity:.65;cursor:default;border-color:rgba(74,222,128,.5);color:#bbf7d0}
.v22-plan.is-current{border-color:rgba(74,222,128,.55)}
.v22-pop.cur{background:linear-gradient(90deg,#16a34a,#22c55e)}
.v22-plan.popular.is-current .v22-pop:not(.cur){display:none}
.v22-subnote{color:#9fb0d4;font-size:14.5px;margin-top:-6px!important}
.v22-subinfo .v22-act b{font-size:19px}
.v22-subinfo .v22-act p{font-size:15.5px!important;line-height:1.6}
.v22-subinfo .v22-pill.lg{font-size:14px}
.v22-subinfo .v22-outline-btn{height:44px;font-size:15px!important}
.v22-subfaq .v22-h2{font-size:22px;margin-bottom:16px}
.v22-subfaq .v22-acc-q{font-size:16.5px!important}
.v22-subfaq .v22-acc-a p{font-size:15.5px;padding-left:58px}
/* v23 current-plan card above the page */
.ma-cur-plan h2{font-size:21px!important}
.ma-cur-plan .v22-card-head p{font-size:15.5px!important}
@media (max-width:760px){.v22-subhead{padding:22px}.v22-subhead h1{font-size:27px}.v22-subfaq .v22-acc-a p{padding-left:20px}}

/* ======================================================================
   v23.2 — readability pass: raise small text site-wide (min ~13px)
   ====================================================================== */
/* sidebar & brand */
.sidebar .brand-wording small,.side-brand .brand-wording small{font-size:11px!important}
.public-topbar .brand-wording small{font-size:11.5px!important}
.side-label{font-size:12px!important;letter-spacing:.14em}
.side-demo b{font-size:14px!important}.side-demo small{font-size:12.5px!important}
.sidebar.v22-side .nav-link{font-size:15.5px!important}
.v22-subnav a{font-size:14.5px!important}
.logout-btn,.v22-back{font-size:14.5px!important}
.profile-menu span,.v22-role-chip{font-size:14.5px!important}
/* labels, captions, notes */
.v22-eyebrow{font-size:13.5px!important}
.v22-crumb{font-size:13px!important}
.v22-note,.v22-hint,.v22-muted{font-size:14px!important}
.v22-tags span{font-size:13.5px!important}
.v22-pill{font-size:13.5px!important}
.v22-pop{font-size:13px!important}
.v22-billing em{font-size:12.5px!important}
.v22-fab-label{font-size:13.5px!important}
.v22-legend{font-size:14px!important}
.v22-label,.v22-fl{font-size:15px!important}
.v22-opts.sm button{font-size:14px!important}
.v22-result-box b small{font-size:13px!important}
/* dashboard */
.v22-kpi-txt small{font-size:14.5px!important}.v22-kpi-txt small em{font-size:13.5px!important}.v22-kpi-txt>span{font-size:14px!important}
.v22-best p,.v22-best strong small,.v22-other div,.v22-other>b{font-size:14.5px!important}
.v22-cal-week span{font-size:13.5px!important}.v22-cal-days span{font-size:15px!important}
.v22-est small{font-size:14px!important}
.v22-stat3 small{font-size:13.5px!important}
.v22-ins-top b{font-size:15px!important}.v22-ins-top small{font-size:13px!important}.v22-ins p{font-size:14px!important}
.v22-dash-bottom .v22-sub{font-size:14.5px!important}
/* admin */
.v22-akpi small{font-size:14.5px!important}.v22-akpi-delta span,.v22-akpi-prev,.v22-akpi-prev b{font-size:14px!important}
.v22-src,.v22-updated{font-size:14px!important}
.v22-mini-table{font-size:14px!important}.v22-mini-table th{font-size:13px!important}.v22-mini-table td{font-size:14px!important}
.v22-admin-table td{font-size:15px!important}.v22-admin-table th{font-size:13px!important}
.v22-who small{font-size:13.5px!important}
.v22 .mono{font-size:14px!important}
.v22-skpis small{font-size:14.5px!important}.v22-skpis em{font-size:13.5px!important}
.v22-dsum small{font-size:13.5px!important}.v22-dsum em{font-size:13px!important}
.v22-last dl,.v22-upcoming{font-size:14.5px!important}
.v22-op-head p,.v22-sipcfg-note p{font-size:14.5px!important}
.v22-batch small,.v22-camp small,.v22-tl-main small,.v22-tl time{font-size:13.5px!important}
.v22-ints small,.v22-int-body p{font-size:14px!important}.v22-int-body small{font-size:12.5px!important}
.v22-int summary b{font-size:15.5px!important}
.v22-schema span,.v22-issue{font-size:14px!important}
.v22-seg-pills button{font-size:14.5px!important}
.v22-kv>div{font-size:15px!important}
.v22-callout{font-size:14.5px!important}
/* settings, help, chat */
.v22-set-side nav small,.v22-trow small,.v22-chan small,.v22-set-who small{font-size:13.5px!important}
.v22-trow b{font-size:16px!important}
.v22-help-topics small,.v22-quick small,.v22-faq-help small{font-size:13.5px!important}
.v22-count{font-size:13.5px!important}
.v22-chat-note,.v22-bubble small{font-size:13px!important}
.v22-notice>div{font-size:15px!important}
.v22-np-item small{font-size:13.5px!important}.v22-np-item time{font-size:12.5px!important}
/* landing explainer */
.v22-input small,.v22-conf small,.v22-channels small,.v22-step-head p{font-size:13.5px!important}
.v22-input b{font-size:14px!important}
.v22-oc-label{font-size:13.5px!important}
.v22-benefits small{font-size:14px!important}
.v22-auth-guest{font-size:13.5px!important}
.v22-plan h3,.v22-subpage .v22-plan h3{font-size:24px!important;font-weight:800!important;color:#fff!important}
.v22-subfaq .v22-h2{font-size:22px!important}
.v22-subinfo .v22-act b{font-size:19px!important}

/* v23.5 — layout fixes (both themes) */
.v22-feat-ic{display:grid!important;place-items:center!important;justify-content:center;align-items:center}
.v22-feat-ic.brand img{height:32px!important;width:auto!important;max-width:44px;object-fit:contain;display:block;margin:auto}
/* preset chips never clip their label: wrap onto a second row instead */
.v22-opts button,.v22-chips button,.v22-pills button{white-space:nowrap}
.v22-mini-box .v22-opts button{flex:1 1 auto!important;min-width:max-content!important;padding:0 10px!important}
.v22-opts{flex-wrap:wrap}
.v22-mini-box .v22-opts{display:grid!important;grid-template-columns:1fr 1fr;gap:8px}
.v22-mini-box .v22-opts button{min-width:0!important;width:100%}

/* v23.5 — language switch (A / अ) and Hindi typography */
.ma-lang-toggle{height:42px;flex:none;display:inline-flex;align-items:center;gap:2px;padding:4px;border-radius:12px;border:1px solid rgba(110,140,230,.35);background:rgba(20,30,70,.6);cursor:pointer;font-family:'Inter','Noto Sans Devanagari',sans-serif}
.ma-lang-toggle span{min-width:30px;height:32px;display:grid;place-items:center;border-radius:9px;color:#a7b3cf;font-size:15px;font-weight:700;line-height:1;transition:background .2s,color .2s}
.ma-lang-toggle span.on{background:linear-gradient(135deg,#3b82f6,#7c5cfa);color:#fff}
.ma-lang-toggle:hover{border-color:#6b8cff}
.topbar .top-actions .ma-lang-toggle{height:44px}
html[lang="hi"]{--v-font:'Inter','Noto Sans Devanagari',system-ui,-apple-system,'Segoe UI',sans-serif}
html[lang="hi"] body,html[lang="hi"] body :where(h1,h2,h3,h4,p,span,b,strong,small,em,a,button,label,li,td,th,div,input,select,textarea,option,summary){font-family:'Inter','Noto Sans Devanagari',system-ui,sans-serif!important}
html[lang="hi"] body :where(h1,h2,h3,h4,p,span,b,strong,small,em,a,button,label,li,td,th,div,summary){letter-spacing:0!important}
html[lang="hi"] :where(h1,h2,h3){line-height:1.3!important}
html[lang="hi"] .v22-hero-copy h1{line-height:1.22!important}
html[lang="hi"] :where(button,.v22-pill,.v22-pills button,.nav-link){line-height:1.35}
html[lang="hi"] :where(.v22-eyebrow,.v22-crumb,.side-label,th,.hd-best small){text-transform:none!important}

/* v23.6 — presets on one line (5Y · 3Y · 1Y · Custom) */
.v22-mini-box .v22-opts{display:flex!important;flex-wrap:nowrap!important;gap:6px}
.v22-mini-box .v22-opts button{flex:1 1 0!important;min-width:0!important;width:auto;padding:0 6px!important}
.v22-mini-box .v22-opts button[data-preset="custom"],.v22-mini-box .v22-opts button:last-child{flex:1.5 1 0!important}

/* v23.6 — SIP calendar: pick your own reminder day */
.v22-cal-days span[data-v22-pick]{cursor:pointer;transition:transform .15s}
.v22-cal-days span[data-v22-pick]:hover{transform:scale(1.08)}
.v22-cal-days span[data-v22-pick]:focus-visible{outline:2px solid #6b8cff;outline-offset:2px;border-radius:50%}
.v22-cal-days span.pick{position:relative;color:#fff;font-weight:700}
.v22-cal-days span.pick::before{content:"";position:absolute;inset:50% auto auto 50%;width:36px;height:36px;transform:translate(-50%,-50%);border-radius:50%;border:2px dashed #7c8cff;background:rgba(124,140,255,.18);z-index:-1}
.v22-best.is-custom .v22-best-top em.mine{background:rgba(124,140,255,.18);color:#c7d2fe;border:1px solid rgba(124,140,255,.4)}
.v22-rem-now{display:flex;align-items:center;gap:8px;margin-top:12px!important;font-size:13.5px;color:#c3cde6}
.v22-rem-now .v22-ic{width:16px;height:16px;flex:none;color:#fbbf24}
.v22-rem-now b{color:#fff;font-weight:600}
.v22-rem-hint{margin-top:8px!important;font-size:13px;color:#8ea0c4}
.v22-link-btn{margin-top:8px;background:none;border:0;padding:0;color:#7cb3ff;font-weight:600;font-size:13.5px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.ma-rem-dlg .ma-rem-q{font-size:16px;font-weight:600;line-height:1.5;margin:0 0 12px}
.ma-rem-dlg .ma-rem-list{margin:0 0 20px;padding-left:20px;display:grid;gap:8px;font-size:14.5px;line-height:1.5;color:#c3cde6}
.ma-rem-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}

/* v23.7 — SIP calendar card rebalanced: calendar + good-date chips on the left, compact reminder card on the right */
.v22-cal-wrap{grid-template-columns:minmax(0,1fr) 250px!important;align-items:stretch;gap:14px}
.v22-cal-main{display:flex;flex-direction:column;border:1px solid var(--v-border);border-radius:12px;background:rgba(7,14,36,.55);padding:12px 10px 14px;min-width:0}
.v22-cal-main .v22-cal{border:0!important;background:none!important;padding:0!important}
.v22-cal-foot{margin-top:auto;padding:14px 6px 0;border-top:1px solid var(--v-border)}
.v22-cal-foot-head{display:flex;justify-content:space-between;align-items:baseline;gap:6px 12px;flex-wrap:wrap}
.v22-cal-foot-head b{font-size:14.5px;font-weight:600;color:#e6ecfb}
.v22-cal-foot-head span{font-size:12.5px;color:#8ea0c4}
.v22-alt-chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:8px;margin-top:10px}
.v22-alt-chip{display:flex;align-items:center;gap:8px;min-width:0;padding:9px 11px;border-radius:10px;border:1px solid var(--v-border-2);background:rgba(13,24,56,.7);color:#e6ecfb;font-size:13.5px!important;font-weight:500;cursor:pointer;text-align:left;transition:border-color .15s,transform .15s}
.v22-alt-chip:hover{transform:translateY(-1px);border-color:#6b8cff}
.v22-alt-chip.on{border-color:#7c8cff;box-shadow:0 0 0 2px rgba(124,140,255,.25)}
.v22-alt-chip i{width:10px;height:10px;border-radius:50%;flex:none}
.v22-alt-chip.pink i{background:#f472b6}.v22-alt-chip.green i{background:#22d3a5}.v22-alt-chip.purple i{background:#d946ef}
.v22-alt-chip span{white-space:nowrap}
.v22-alt-chip b{margin-left:auto;color:var(--v-green);font-weight:700;white-space:nowrap}
.v22-cal-legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:12px;font-size:12.5px;color:#8ea0c4}
.v22-cal-legend span{display:inline-flex;align-items:center;gap:6px}
.v22-cal-legend i{width:12px;height:12px;border-radius:50%;flex:none}
.v22-cal-legend .lg-best{background:linear-gradient(135deg,#3b6cff,#4b4fe0);box-shadow:0 0 0 2px #4e78ff}
.v22-cal-legend .lg-good{background:rgba(20,150,110,.35);border:1px solid rgba(62,224,137,.6)}
.v22-cal-legend .lg-pick{border:2px dashed #7c8cff}
.v22-cal-side{display:flex!important;flex-direction:column}
.v22-cal-side .v22-best{flex:1;display:flex;flex-direction:column;padding:16px}
.v22-best-top{min-height:26px}
.v22-best-top .v22-link-btn{margin:0;font-size:12.5px!important;text-align:right}
.v22-best-day{display:flex;align-items:center;gap:14px;margin-top:16px}
.v22-best-day>b{font-size:52px;font-weight:800;line-height:1;letter-spacing:-.02em;color:#fff;font-variant-numeric:tabular-nums}
.v22-best-day span{display:block;font-size:16px;font-weight:700;color:#e6ecfb}
.v22-best-day small{display:block;margin-top:3px;font-size:13.5px;color:#8ea0c4}
.v22-cal-side .v22-best strong{margin:16px 0 0}
.v22-best-sub{margin-top:16px!important;font-size:13.5px!important;color:#8ea0c4!important}
.v22-cal-side .v22-best .v22-grad-btn{margin-top:auto;height:44px}
.v22-cal-side .v22-best strong,.v22-cal-side .v22-best .v22-best-sub{margin-bottom:16px!important}
.v22-cal-side .v22-rem-now{margin-top:12px!important;font-size:13px!important;line-height:1.4}
@media (max-width:1100px){.v22-cal-wrap{grid-template-columns:1fr!important}}
/* v23.7b — balance */
.v22-cal-wrap{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)!important}
.v22-alt-chips{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.v22-alt-chip{display:grid!important;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:7px;row-gap:2px;align-items:center;padding:8px 10px!important}
.v22-alt-chip i{grid-row:1}
.v22-alt-chip span{grid-column:2;font-size:13.5px}
.v22-alt-chip b{grid-column:2;margin-left:0!important;font-size:14px}
.v22-cal-foot-head span{flex-basis:100%;margin-top:2px}
.v22-cal-side .v22-best{justify-content:space-between;gap:10px}
.v22-cal-side .v22-best .v22-grad-btn{margin-top:4px!important}
.v22-cal-side .v22-best strong,.v22-cal-side .v22-best .v22-best-sub{margin:0!important}
.v22-best-day{margin-top:0!important}
.v22-cal-side .v22-rem-now{margin-top:0!important}
/* v23.7c — reminder card: info on top, actions at the bottom */
.v22-cal-side .v22-best{justify-content:space-between!important;gap:18px!important}
.v22-best-info{display:flex;flex-direction:column;gap:16px}
.v22-best-act{display:flex;flex-direction:column;gap:10px;padding-top:16px;border-top:1px solid var(--v-border)}
.v22-best-act .v22-grad-btn{margin:0!important;width:100%}
.v22-best-act .v22-link-btn{align-self:flex-start;margin:0;font-size:13px!important}
.v22-cal-side .v22-best strong.v22-best-gain{font-size:26px;line-height:1.1}
.v22-best-gain small{display:block;margin-top:4px;font-size:13.5px!important;font-weight:500}
.v22-alt-chip span,.v22-alt-chip b{justify-self:start;text-align:left}
.v22-best-day span{white-space:nowrap}
.v22-best-gain small{line-height:1.45!important}

/* v23.8 — visible Log out (sidebar) + security actions */
.sidebar.v22-side .side-bottom{display:grid;gap:8px}
.sidebar.v22-side .logout-btn.v22-logout{width:100%;justify-content:flex-start;padding:11px 14px;border-radius:10px;border:1px solid rgba(251,113,133,.35);background:rgba(251,113,133,.08);color:#fecdd3;font-weight:600;font-family:var(--v-font);cursor:pointer;transition:background .15s,border-color .15s}
.sidebar.v22-side .logout-btn.v22-logout:hover{background:rgba(251,113,133,.16);border-color:rgba(251,113,133,.6);color:#fff}
.v22-sec-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.v22-outline-btn.v22-danger-outline{border-color:rgba(251,113,133,.45)!important;color:#fda4af!important}
.v22-outline-btn.v22-danger-outline:hover{background:rgba(251,113,133,.1)!important}

/* v23.8 — Mod Alpha date picker (src/shared/datepicker.js) */
.ma-dp-scrim{position:fixed;inset:0;z-index:1190;background:transparent}
.ma-dp{position:fixed;z-index:1200;width:312px;padding:14px;border-radius:16px;border:1px solid rgba(110,140,230,.35);background:linear-gradient(180deg,#101a3e,#0b1330);box-shadow:0 24px 60px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.03) inset;color:#e6ecfb;font-family:var(--v-font);opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top center;transition:opacity .16s ease,transform .16s ease}
.ma-dp.in{opacity:1;transform:none}
.ma-dp-head{display:grid;grid-template-columns:36px 1fr 36px;align-items:center;gap:6px;margin-bottom:10px}
.ma-dp-nav,.ma-dp-title{height:36px;border-radius:10px;border:1px solid transparent;background:transparent;color:inherit;display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;font:inherit}
.ma-dp-nav:hover,.ma-dp-title:hover{background:rgba(107,140,255,.14);border-color:rgba(107,140,255,.3)}
.ma-dp-title{font-weight:700;font-size:15px!important}
.ma-dp-title svg{width:16px;height:16px;opacity:.7}
.ma-dp-week,.ma-dp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.ma-dp-week span{text-align:center;font-size:12px;font-weight:600;color:#8ea0c4;padding:4px 0 6px}
.ma-dp-day{position:relative;height:38px;border:0;border-radius:10px;background:transparent;color:#e6ecfb;font:inherit;font-size:14px!important;font-weight:500;cursor:pointer;font-variant-numeric:tabular-nums;transition:background .12s}
.ma-dp-day:hover:not(:disabled){background:rgba(107,140,255,.16)}
.ma-dp-day.out{color:#56627f}
.ma-dp-day.today{box-shadow:inset 0 0 0 1.5px #6b8cff;font-weight:700}
.ma-dp-day.inrange{background:rgba(107,140,255,.14);border-radius:0}
.ma-dp-day.edge{background:rgba(107,140,255,.3)}
.ma-dp-day.sel{background:linear-gradient(135deg,#3b82f6,#7c5cfa)!important;color:#fff!important;font-weight:700;box-shadow:0 6px 16px rgba(80,90,255,.45)}
.ma-dp-day:disabled{color:#3c4766;cursor:not-allowed;text-decoration:line-through;text-decoration-color:rgba(255,255,255,.12)}
.ma-dp-day:focus-visible{outline:2px solid #93c5fd;outline-offset:1px}
.ma-dp-mgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:4px 0}
.ma-dp-mgrid button{height:46px;border-radius:12px;border:1px solid rgba(110,140,230,.25);background:rgba(13,24,56,.6);color:#e6ecfb;font:inherit;font-size:14px!important;font-weight:600;cursor:pointer}
.ma-dp-mgrid button:hover:not(:disabled){border-color:#6b8cff}
.ma-dp-mgrid button.sel{background:linear-gradient(135deg,#3b82f6,#7c5cfa);border-color:transparent;color:#fff}
.ma-dp-mgrid button:disabled{opacity:.35;cursor:not-allowed}
.ma-dp-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(110,140,230,.2)}
.ma-dp-sel{font-size:13px;color:#a7b3cf;font-variant-numeric:tabular-nums}
.ma-dp-foot>div{display:flex;gap:6px}
.ma-dp-today,.ma-dp-link{height:32px;padding:0 12px;border-radius:9px;font:inherit;font-size:13px!important;font-weight:600;cursor:pointer}
.ma-dp-today{border:1px solid rgba(107,140,255,.45);background:rgba(107,140,255,.15);color:#c7d2fe}
.ma-dp-today:disabled{opacity:.4;cursor:not-allowed}
.ma-dp-link{border:0;background:transparent;color:#a7b3cf}
.ma-dp.sheet{left:0!important;right:0;bottom:0;top:auto!important;width:auto;border-radius:20px 20px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom));transform:translateY(20px)}
.ma-dp.sheet.in{transform:none}
.ma-dp.sheet .ma-dp-day{height:44px}
@media (max-width:560px){.ma-dp-scrim{background:rgba(0,0,0,.45)}}
.ma-dp-trigger{width:100%;height:46px;display:flex;align-items:center;gap:10px;padding:0 14px;border-radius:10px;border:1px solid var(--v-border-2);background:#0d1838;color:#e6ecfb;font:inherit;font-size:14.5px!important;font-weight:500;cursor:pointer;text-align:left;font-variant-numeric:tabular-nums}
.ma-dp-trigger:hover{border-color:#6b8cff}
.ma-dp-trigger svg{color:#8ea0c4;flex:none}
.sidebar.v22-side .logout-btn.v22-logout{border:1px solid rgba(251,113,133,.4)!important;background:rgba(251,113,133,.09)!important;color:#fecdd3!important}
.sidebar.v22-side .logout-btn.v22-logout:hover{background:rgba(251,113,133,.18)!important;border-color:rgba(251,113,133,.65)!important;color:#fff!important}

/* v23.9 — logo +20% */
.public-topbar .brand-symbol,.topbar .brand-symbol{width:53px!important;height:53px!important;max-width:53px!important;max-height:53px!important;flex-basis:53px!important}
.public-topbar .brand-wording strong,.topbar .brand-wording strong{font-size:27.5px!important}
.public-topbar .brand-wording small,.topbar .brand-wording small{font-size:13.5px!important}
.side-brand .brand-symbol{width:48px!important;height:48px!important;max-width:48px!important;max-height:48px!important;flex-basis:48px!important}
.side-brand .brand-wording strong{font-size:24px!important}
.side-brand .brand-wording small{font-size:13px!important}

/* v23.9 — hero: wider copy, stat tiles, phone buzz */
.v22-hero{grid-template-columns:minmax(0,1.22fr) minmax(0,.78fr)!important}
.v22-hero p{max-width:720px!important}
.v22-hero-stats{grid-template-columns:repeat(4,minmax(0,max-content))!important;gap:14px!important;margin-top:52px!important}
.v22-stat-tile{display:flex;align-items:center;gap:12px;padding:12px 18px 12px 12px;border-radius:14px;border:1px solid rgba(110,140,230,.3);background:rgba(10,20,52,.55);backdrop-filter:blur(6px);box-shadow:0 8px 24px rgba(0,0,0,.18)}
.v22-stat-tile .v22-stat-ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex:none;color:#fff}
.v22-stat-tile .v22-stat-ic .v22-ic{width:21px;height:21px}
.v22-stat-tile.c1 .v22-stat-ic{background:linear-gradient(135deg,#3b82f6,#2563eb)}
.v22-stat-tile.c2 .v22-stat-ic{background:linear-gradient(135deg,#14b8a6,#0d9488)}
.v22-stat-tile.c3 .v22-stat-ic{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}
.v22-stat-tile.c4 .v22-stat-ic{background:linear-gradient(135deg,#f59e0b,#d97706)}
.v22-stat-tile b{display:block;font-size:22px!important;line-height:1.1;font-weight:800;color:#fff!important}
.v22-stat-tile small{display:block;margin-top:3px!important;font-size:13px!important;color:#a7b3cf!important;white-space:nowrap}
@media (max-width:1180px){.v22-hero-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
/* the phone buzzes when the SIP notification lands, then again every few seconds */
@keyframes hdBuzz{0%,100%{rotate:0deg;translate:0 0}2%{rotate:-3deg;translate:-2px 0}4%{rotate:3deg;translate:2px 0}6%{rotate:-2.5deg;translate:-2px 0}8%{rotate:2.5deg;translate:2px 0}10%{rotate:-1.5deg}12%{rotate:1deg}14%{rotate:0deg}}
.hd-phone{animation:hdBuzz 7s ease-in-out .85s infinite}
@keyframes hdRing{0%,100%{transform:scale(1);opacity:0}2%{opacity:.7}14%{transform:scale(1.35);opacity:0}}
.hd-phone::after{content:"";position:absolute;inset:-6px;border-radius:50px;border:2px solid rgba(124,140,255,.55);opacity:0;pointer-events:none;animation:hdRing 7s ease-out .85s infinite}
.hd-f1 .v22-float-ic{animation:hdBuzz 7s ease-in-out .85s infinite}
@media (prefers-reduced-motion:reduce){.hd-phone,.hd-phone::after,.hd-f1 .v22-float-ic{animation:none!important}}

/* v23.9 — landing: faint animated background + clear section bands */
.v22-land-bg{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.32}
.v22-land-bg>div,.v22-land-bg canvas{position:absolute;inset:0;width:100%;height:100%}
#app>.public-topbar,#app>main.v22-landing,#app>.public-footer{position:relative;z-index:1}
#app>.public-topbar{z-index:20}
.v22-landing>section,.v22-landing>#pricing-preview{position:relative;border-top:1px solid rgba(110,140,230,.14)}
.v22-landing>.v22-hero{border-top:0}
.v22-landing>.v22-features{background-color:rgba(14,24,60,.55)}
.v22-landing>.v22-how{background-color:rgba(5,9,24,.45)}
.v22-landing>#pricing-preview{background-color:rgba(14,24,60,.55)}
.v22-landing>.v22-faq{background-color:rgba(5,9,24,.45)}
#app>.public-footer{background:rgba(4,8,22,.85)!important;border-top:1px solid rgba(110,140,230,.18)!important}
.hd-f1{right:47%!important}

/* v23.9 — dashboard: KPI value + subtitle on one line; equal-height bottom row with scrollable insights */
.v22-kpi-txt b.v22-kpi-val{display:flex!important;align-items:baseline;flex-wrap:wrap;gap:2px 10px}
.v22-kpi-txt b.v22-kpi-val span{font-size:14px!important;font-weight:500;color:#c8d2ea;letter-spacing:0;line-height:1.3}
@media (min-width:1561px){
 .v22-dash-bottom{grid-template-columns:1.3fr 1.25fr 1fr!important}
 .v22-dash-bottom>.v22-insights{grid-column:auto!important;display:flex!important;flex-direction:column;height:0;min-height:100%;overflow:hidden}
}
.v22-ins-list{display:flex;flex-direction:column;gap:10px;flex:1;min-height:0;overflow-y:auto;padding-right:6px;margin-right:-6px;scrollbar-width:thin}
.v22-ins-list::-webkit-scrollbar{width:6px}.v22-ins-list::-webkit-scrollbar-thumb{background:rgba(110,140,230,.35);border-radius:6px}
@media (max-width:1560px){
 .v22-dash-bottom>.v22-insights{display:flex!important;flex-direction:column}
 .v22-ins-list{display:grid!important;grid-template-columns:1fr 1fr;gap:10px 14px;max-height:300px}
}
@media (max-width:900px){.v22-ins-list{grid-template-columns:1fr}}
/* calendar card: "+2.8% vs. fixed date SIP" on one line */
.v22-cal-wrap{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)!important}
.v22-cal-side .v22-best strong.v22-best-gain{font-size:22px!important;white-space:nowrap}
.v22-best-gain small{display:inline!important;margin:0 0 0 5px!important;font-size:12.5px!important;white-space:nowrap}
.v22-est-bars{grid-column:1/-1;display:grid;gap:8px;margin-top:10px;padding-top:12px;border-top:1px solid var(--v-border)}
.v22-est-bars>div{display:grid;grid-template-columns:86px 1fr auto;align-items:center;gap:10px}
.v22-est-bars span{font-size:12.5px;color:#a7b3cf}
.v22-est-bars i{display:block;height:10px;border-radius:6px;background:rgba(148,163,184,.45);min-width:6px}
.v22-est-bars i.now{background:linear-gradient(90deg,#3b82f6,#7c5cfa)}
.v22-est-bars b{font-size:13.5px!important;font-weight:600}
.v22-mini-whatif .v22-est{margin-bottom:auto}
.v22-mini-whatif>.v22-grad-btn,.v22-mini-whatif>button:last-child{margin-top:16px}

/* v23.9 — fund house logos (assets/funds/manifest.js) with monogram fallback */
.v22-fund-logo{position:relative;width:40px;height:40px;flex:none;border-radius:11px;display:grid;place-items:center;overflow:hidden;background:var(--fc);color:#fff;box-shadow:0 4px 12px color-mix(in srgb,var(--fc) 35%,transparent),inset 0 1px 0 rgba(255,255,255,.2)}
.v22-fund-logo b{font-family:'Inter',sans-serif;font-weight:800;letter-spacing:-.02em;line-height:1;font-size:17px}
.v22-fund-logo.l1 b{font-size:20px}.v22-fund-logo.l3 b{font-size:12.5px}.v22-fund-logo.l4 b{font-size:10.5px}
.v22-fund-logo.has-img{background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.08),0 4px 12px rgba(0,0,0,.12)}
.v22-fund-logo.has-img b{display:none}
.v22-fund-logo img{width:78%;height:78%;object-fit:contain}
.v22-fund-logo.lg{width:58px;height:58px;border-radius:15px}
.v22-fund-logo.lg b{font-size:24px}.v22-fund-logo.lg.l1 b{font-size:28px}.v22-fund-logo.lg.l3 b{font-size:17px}.v22-fund-logo.lg.l4 b{font-size:14px}

/* v23.9 — charts: thin strokes, checkered grid (horizontal + vertical) */
.v22-grid,.v22-grid.v{stroke:rgba(110,140,210,.14)!important;stroke-width:1!important;stroke-dasharray:none!important;vector-effect:non-scaling-stroke}
.v22-line{filter:none!important}
/* dashboard "Top Performing Mutual Funds": chart + fund legend fill the card */
.v22-perf-card #v22-dash-chart{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:14px}
.v22-dash-legend{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.v22-dl-item{display:flex;align-items:center;gap:10px;min-width:0;padding:10px 12px;border-radius:12px;border:1px solid var(--v-border);background:rgba(13,24,56,.5);transition:border-color .15s,transform .15s}
.v22-dl-item:hover{border-color:#6b8cff;transform:translateY(-1px)}
.v22-dl-item .v22-fund-logo{width:34px;height:34px;border-radius:9px}
.v22-dl-item .v22-fund-logo b{font-size:14px}.v22-dl-item .v22-fund-logo.l3 b{font-size:11px}.v22-dl-item .v22-fund-logo.l4 b{font-size:9px}
.v22-dl-txt{min-width:0;flex:1}
.v22-dl-txt b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13px;font-weight:600;line-height:1.3;color:#e6ecfb}
.v22-dl-txt em{font-style:normal;font-weight:700;font-size:13.5px;color:var(--v-green);display:flex;align-items:center;gap:6px;margin-top:3px;white-space:nowrap}
.v22-dl-txt em small{font-weight:500;color:#8ea0c4;font-size:12px}
.v22-dl-txt em i{width:8px;height:8px;border-radius:50%;background:var(--c);flex:none}
@media (max-width:1300px){.v22-dash-legend{grid-template-columns:1fr}}

/* v23.9 — notification templates: tidy tiles + wide editor with live preview */
.ma-tpl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.ma-tpl{display:grid;grid-template-rows:auto auto 1fr auto;gap:14px;padding:18px;border-radius:14px;border:1px solid var(--v-border);background:rgba(10,18,44,.6);transition:transform .2s,border-color .2s}
.ma-tpl:hover{transform:translateY(-2px);border-color:#6b8cff}
.ma-tpl header{display:grid;grid-template-columns:auto 1fr auto;align-items:start;gap:12px}
.ma-tpl header b{display:block;font-size:15.5px;font-weight:700;color:#fff;line-height:1.3}
.ma-tpl header small{display:block;margin-top:3px;font-size:13px;color:#8ea0c4;line-height:1.4}
.ma-tpl header .v22-pill{white-space:nowrap}
.ma-tpl-subj{padding:10px 12px;border-radius:10px;background:rgba(5,10,28,.45);border:1px dashed rgba(110,140,230,.25)}
.ma-tpl-subj span{display:block;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#7d8bab}
.ma-tpl-subj p{margin:4px 0 0!important;font-size:13.5px;color:#dbe4fb;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ma-tpl-ch{display:flex;flex-wrap:wrap;gap:6px;align-content:start}
.ma-ch{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:999px;border:1px solid rgba(110,140,230,.3);background:rgba(13,24,56,.6);color:#c8d3ee;font-size:12.5px!important;font-weight:600}
.ma-ch.on{border-color:rgba(124,140,255,.55);color:#fff}
.ma-tpl footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:12px;border-top:1px solid var(--v-border)}
.ma-tpl footer small{font-size:12.5px;color:#7d8bab}
.modal.ma-modal-wide{width:min(1080px,94vw)!important;max-width:none!important}
.ma-tpl-ed{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);grid-template-areas:"form pv" "act act";gap:20px 24px}
.ma-tpl-form{grid-area:form;display:grid;gap:14px;align-content:start}
.ma-tpl-form textarea{min-height:170px;resize:vertical;line-height:1.5}
.ma-vars{font-weight:400;color:#8ea0c4}.ma-vars code{font-size:12px;padding:1px 5px;border-radius:5px;background:rgba(124,140,255,.15)}
.ma-ch-pick,.ma-status-pick{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.ma-ch-pick .ma-ch{cursor:pointer;height:34px}
.ma-ch-pick .ma-ch.on{background:linear-gradient(135deg,#3b82f6,#7c5cfa);border-color:transparent}
.ma-status-pick button{height:34px;padding:0 14px;border-radius:9px;border:1px solid var(--v-border-2);background:transparent;color:#c8d3ee;font-weight:600;cursor:pointer}
.ma-status-pick button.on{background:rgba(62,224,137,.15);border-color:rgba(62,224,137,.5);color:#86efac}
.ma-tpl-pv{grid-area:pv;display:flex;flex-direction:column;gap:12px;padding:14px;border-radius:14px;border:1px solid var(--v-border);background:rgba(5,10,28,.45);min-width:0}
.ma-pv-tabs{display:flex;gap:6px;flex-wrap:wrap}
.ma-pv-tabs button{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:9px;border:1px solid var(--v-border-2);background:transparent;color:#c8d3ee;font-weight:600;font-size:13px!important;cursor:pointer}
.ma-pv-tabs button.on{background:rgba(124,140,255,.2);border-color:#7c8cff;color:#fff}
#ma-tpl-pv-body{flex:1;min-height:300px;display:flex}
.ma-pv-mail{flex:1;border-radius:12px;background:#fff;color:#1f2937;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.ma-pv-mail-h{display:grid;grid-template-columns:70px 1fr;gap:6px 10px;padding:14px 16px;background:#f3f4f6;border-bottom:1px solid #e5e7eb;font-size:13px}
.ma-pv-mail-h span{color:#6b7280}.ma-pv-mail-h b{font-weight:600;color:#111827;word-break:break-word}
.ma-pv-mail-b{padding:16px;font-size:14px;line-height:1.6;color:#1f2937}
.ma-pv-mail-b hr{border:0;border-top:1px solid #e5e7eb;margin:16px 0 10px}
.ma-pv-mail-b small{color:#6b7280;font-size:12px}
.ma-pv-phone{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:20px;border-radius:12px;background:radial-gradient(circle at 30% 10%,#334155,#0f172a)}
.ma-pv-sms{max-width:320px;padding:12px 14px;border-radius:16px 16px 16px 4px;background:#e5e7eb;color:#111827;font-size:14px;line-height:1.45}
.ma-pv-sms small{display:block;color:#6b7280;font-size:11.5px;margin-bottom:4px}
.ma-pv-sms p{margin:0!important}
.ma-pv-phone em{font-style:normal;font-size:12px;color:#cbd5e1}
.ma-pv-push{width:100%;max-width:340px;display:grid;grid-template-columns:auto 1fr auto;gap:10px;padding:12px;border-radius:16px;background:rgba(255,255,255,.92);color:#111827}
.ma-pv-app{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(135deg,#b77a3e,#7d3d5d);color:#fff;font-weight:800}
.ma-pv-push b{display:block;font-size:12.5px;color:#374151}.ma-pv-push strong{display:block;font-size:14px;margin-top:2px}.ma-pv-push p{margin:2px 0 0!important;font-size:13px;color:#374151;line-height:1.4}
.ma-pv-push small{font-size:11.5px;color:#6b7280}
.ma-pv-note{margin:0!important;font-size:12.5px;color:#8ea0c4}
.ma-tpl-actions{grid-area:act;display:flex;justify-content:flex-end;gap:10px;padding-top:14px;border-top:1px solid var(--v-border)}
@media (max-width:860px){.ma-tpl-ed{grid-template-columns:1fr;grid-template-areas:"form" "pv" "act"}}
.ma-tpl-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
@media (max-width:1300px){.ma-tpl-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media (max-width:640px){.ma-tpl-grid{grid-template-columns:1fr!important}}
.ma-tpl footer{margin:0!important;padding:12px 0 0!important;background:none!important;font-size:inherit!important;color:inherit}
.ma-tpl-form .v22-fl{display:grid!important;gap:6px;align-items:start}
.ma-tpl-form textarea,.ma-tpl-form input{display:block;width:100%!important;box-sizing:border-box}
.ma-tpl header{display:block!important}
.ma-tpl-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.ma-tpl header b{font-size:16px!important}
.ma-tpl footer small,.ma-tpl footer .v22-row-btn{white-space:nowrap}
.ma-tpl footer .v22-row-btn{padding:0 12px}
.ma-tpl{min-width:0;overflow:hidden}
.ma-tpl>*{min-width:0}
.ma-tpl footer{flex-wrap:wrap;row-gap:8px}
.ma-tpl footer small{font-size:12px!important}
.ma-tpl footer .v22-row-btn{padding:0 10px;font-size:13px!important}
.ma-tpl-top .v22-pill{flex:none}

/* v23.9 — admin sign-in step 2 (email code + SMS code) */
.v22-auth-card.ma-mfa{text-align:left}
.v22-auth-card.ma-mfa .v22-auth-brand{justify-content:center}
.ma-mfa-badge{display:inline-flex;align-items:center;gap:8px;margin:18px auto 0;padding:6px 12px;border-radius:999px;border:1px solid rgba(62,224,137,.45);background:rgba(62,224,137,.12);color:#86efac;font-size:13px;font-weight:700;width:max-content}
.v22-auth-card.ma-mfa .ma-mfa-badge{display:flex}
.v22-auth-card.ma-mfa h1{text-align:center;margin-top:12px!important}
.ma-mfa-sub{text-align:center;color:#a7b3cf;font-size:15px;line-height:1.55;margin:8px auto 22px!important;max-width:420px}
.ma-mfa-form{display:grid;gap:14px}
.ma-mfa-field{display:grid;gap:8px;padding:14px;border-radius:14px;border:1px solid var(--v-border-2);background:rgba(10,20,52,.5)}
.ma-mfa-lbl{display:flex;align-items:center;gap:8px}
.ma-mfa-lbl .v22-ic{width:18px;height:18px;color:#7cb3ff}
.ma-mfa-lbl b{font-size:14.5px;color:#e6ecfb}
.ma-mfa-lbl small{margin-left:auto;font-size:13px;color:#8ea0c4;font-variant-numeric:tabular-nums}
.ma-mfa-field input{height:52px;border-radius:12px;border:1px solid var(--v-border-2);background:#0a1330;color:#fff;font-size:24px!important;font-weight:700;letter-spacing:.5em;text-align:center;padding-left:.5em;font-variant-numeric:tabular-nums}
.ma-mfa-field input:focus{outline:none;border-color:#6b8cff;box-shadow:0 0 0 3px rgba(107,140,255,.25)}
.ma-mfa-field input.bad{border-color:#fb7185;box-shadow:0 0 0 3px rgba(251,113,133,.2)}
.ma-mfa-dev{margin:0!important;padding:10px 12px;border-radius:10px;background:rgba(251,191,36,.1);border:1px dashed rgba(251,191,36,.5);color:#fde68a;font-size:13px}
.ma-mfa-dev b{letter-spacing:.12em}
.ma-mfa-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px;color:#8ea0c4}
.ma-mfa-link,.ma-mfa-back{background:none;border:0;padding:0;color:#7cb3ff;font-weight:600;font-size:13.5px!important;cursor:pointer}
.ma-mfa-link:disabled{color:#56627f;cursor:default}
.ma-mfa-back{justify-self:center;margin-top:4px;color:#a7b3cf}

/* v23.10 — fixes */
/* every modal fits the screen: header stays, body scrolls */
.modal-backdrop{align-items:center;padding:20px 12px}
.modal{max-height:calc(var(--vh100,100vh) - 40px);display:flex!important;flex-direction:column}
.modal>.modal-body{overflow-y:auto;overscroll-behavior:contain;min-height:0}
.modal.ma-modal-wide>.modal-body{padding-bottom:0}
.ma-tpl-actions{position:sticky;bottom:0;padding:14px 0 18px!important;background:inherit;z-index:2}
.modal.ma-modal-wide .ma-tpl-actions{background:linear-gradient(180deg,rgba(11,19,48,0),#0b1330 30%)}
#ma-tpl-pv-body{min-height:0!important;flex:none!important}
.ma-pv-mail{flex:none!important;width:100%}
.ma-pv-phone{min-height:260px}
/* landing hero: no line chart behind the copy */
.v22-hero-art.hd .hd-bg,.v22-hero-art>svg.hd-bg{display:none!important}
/* admin "recent" tables: two-line cells, never scroll sideways */
.v22-mini-table.v22-compact{width:100%;table-layout:fixed}
.v22-mini-table.v22-compact th:nth-child(1),.v22-mini-table.v22-compact td:nth-child(1){width:46%}
.v22-mini-table.v22-compact th:nth-child(3),.v22-mini-table.v22-compact td:nth-child(3){width:96px;text-align:right}
.v22-mini-table.v22-compact td{vertical-align:middle;overflow:hidden}
.v22-mini-table.v22-compact td b{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v22-mini-table.v22-compact td small{display:block;margin-top:2px;font-size:12.5px;color:#8ea0c4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v22-tbl-card{overflow:hidden}
.v22-tbl-card .v22-mini-table{min-width:0!important}
/* presets: labels never clip — buttons size to their text and wrap if the box is very narrow */
.v22-mini-box .v22-opts{display:flex!important;flex-wrap:wrap!important;gap:6px}
.v22-mini-box .v22-opts button{flex:1 1 auto!important;min-width:max-content!important;padding:0 8px!important;font-size:13px!important;overflow:visible}
.v22-opts button{overflow:visible;text-overflow:clip}

/* v23.11 — sidebar keeps its shape at any resolution/zoom: menu scrolls, footer stays put */
@media (min-width:861px){
 .sidebar.v22-side{display:flex!important;flex-direction:column!important;overflow:hidden!important}
 .sidebar.v22-side>.side-brand,.sidebar.v22-side>.side-label{flex:none}
 .sidebar.v22-side>nav{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;align-content:start;padding-right:2px;scrollbar-width:thin}
 .sidebar.v22-side>.side-bottom{flex:none;margin-top:12px!important;padding-top:12px;border-top:1px solid var(--v-border)}
}
.ma-env-badge{left:auto!important;right:12px!important;bottom:auto!important;top:12px!important}
/* admin KPI tiles: no "Last month" line */
.v22-akpi-prev{display:none!important}
/* user dashboard KPI icons bigger */
.v22-kpis .v22-tile{width:54px!important;height:54px!important;border-radius:14px!important}
.v22-kpis .v22-tile .v22-ic{width:28px!important;height:28px!important}
/* "Your reminder: Mod Alpha date" on one line */
.v22-rem-now span{white-space:nowrap}
.v22-cal-side .v22-rem-now{font-size:12.5px!important}
.v22-cal-wrap{grid-template-columns:minmax(0,1.3fr) minmax(262px,1fr)!important}
.v22-cal-side,.v22-cal-side .v22-best{min-width:0}

/* v23.12 — AI Insight banner */
.v22-insight-row.v2{display:flex!important;align-items:center;gap:16px;padding:16px 20px;border-radius:14px;border:1px solid rgba(140,100,255,.35);border-left:4px solid #8b5cf6;background:linear-gradient(90deg,rgba(60,40,140,.35),rgba(20,28,64,.4))}
.v22-insight-row.v2 .v22-ins-badge{width:52px;height:52px;flex:none;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
.v22-insight-row.v2 .v22-insight-body{border:0!important;background:none!important;padding:0!important}
.v22-insight-row.v2 .v22-insight-body b{display:flex;align-items:center;gap:10px;font-size:15px}
.v22-insight-row.v2 .v22-insight-body b em{font-style:normal;font-size:11.5px;font-weight:600;letter-spacing:.04em;padding:2px 8px;border-radius:999px;background:rgba(196,181,253,.15);color:#c4b5fd}
.v22-insight-row.v2 .v22-insight-body p{padding-left:0!important;margin-top:4px!important}
/* engine: brand mark; fibres reach the card (no gap) */
.v22-core-mark{display:grid;place-items:center;width:64px;height:64px;border-radius:16px;background:rgba(255,255,255,.1)}
.v22-conn.fibers{position:relative;z-index:0}
.v22-conn.fibers svg{overflow:visible}
.v22-conn.fibers{justify-content:flex-start!important}
.v22-stage.engine .v22-core{z-index:2}
.v22-engine-out{left:76%!important;right:auto!important;width:42%!important;z-index:0}

/* v23.12 — hero orbit scene */
.v22-hero.hero-d .v22-hero-art.hd-orbit-art{width:46%!important;left:auto;right:0;overflow:visible}
.hd-stage{position:absolute;left:50%;top:50%;width:580px;height:560px;transform:translate(-50%,-50%) scale(var(--hds,1));transform-origin:center}
@media (max-width:1500px){.hd-stage{--hds:.9}}@media (max-width:1300px){.hd-stage{--hds:.8}}
.hd-orbit-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hd-globe ellipse{fill:none;stroke:rgba(120,150,230,.12);stroke-width:1}
.hd-globe{animation:hdGlobe 14s ease-in-out infinite alternate;transform-origin:290px 372px}
@keyframes hdGlobe{from{transform:scaleX(.92)}to{transform:scaleX(1.06)}}
.hd-arc{fill:none;stroke:rgba(201,154,98,.55);stroke-width:1.4;stroke-dasharray:3 5;animation:hdDash 30s linear infinite}
@keyframes hdDash{to{stroke-dashoffset:-400}}
.hd-dash{fill:none;stroke:rgba(201,154,98,.5);stroke-width:1.2;stroke-dasharray:4 5}
.hd-comet{fill:#ffd9a3;filter:drop-shadow(0 0 6px #ffb86b)}.hd-comet.b{fill:#c4b5fd;filter:drop-shadow(0 0 6px #a78bfa)}
.hd-node{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:10px;z-index:3}
.hd-node span{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;color:#ffe2b4;background:radial-gradient(circle at 35% 30%,#2a2f4d,#121628);border:1.5px solid rgba(201,154,98,.7);box-shadow:0 0 0 8px rgba(201,154,98,.08),0 10px 24px rgba(0,0,0,.35);animation:hdNode 3.6s ease-in-out infinite}
.hd-node:nth-child(4) span{animation-delay:1.2s}.hd-node:nth-child(5) span{animation-delay:2.4s}
@keyframes hdNode{0%,100%{box-shadow:0 0 0 6px rgba(201,154,98,.08),0 10px 24px rgba(0,0,0,.35)}50%{box-shadow:0 0 0 14px rgba(201,154,98,.02),0 0 28px rgba(255,184,107,.45)}}
.hd-node b{font-size:14.5px;font-weight:600;color:#e6ecfb;white-space:nowrap}
.hd-node.top{flex-direction:column-reverse}.hd-node.top b{display:none}
.hd-orbit-art .hd-phone{position:absolute!important;left:290px!important;right:auto!important;top:330px!important;transform:translate(-50%,-50%) scale(.72)!important;margin:0!important;z-index:2}
.hd-orbit-art .hd-phone{animation:hdBuzzC 7s ease-in-out .85s infinite!important}
@keyframes hdBuzzC{0%,14%,100%{rotate:0deg}2%{rotate:-3deg}4%{rotate:3deg}6%{rotate:-2.5deg}8%{rotate:2.5deg}10%{rotate:-1.5deg}12%{rotate:1deg}}
.hd-app{width:28px;height:28px;flex:none;border-radius:7px;display:grid;place-items:center;background:#141a3c}
.hd-info{position:absolute;top:400px;width:176px;padding:12px 14px;border-radius:12px;border:1px solid rgba(201,154,98,.45);background:rgba(12,18,40,.85);backdrop-filter:blur(6px);z-index:3}
.hd-info.l{left:-6px}.hd-info.r{right:-6px}
.hd-info small{display:block;font-size:11.5px;font-weight:800;letter-spacing:.08em;color:#f2c48a}
.hd-info p{margin:6px 0 0!important;font-size:13.5px!important;line-height:1.45;color:#c8d3ee}
.hd-info p b{color:#86efac}
@media (max-width:1180px){.v22-hero.hero-d .v22-hero-art.hd-orbit-art{width:100%!important;position:relative;height:560px}}
@media (prefers-reduced-motion:reduce){.hd-globe,.hd-arc,.hd-node span,.hd-orbit-art .hd-phone{animation:none!important}.hd-comet{display:none}}
.v22-conn.fibers{z-index:3!important}
.v22-conn.fibers{clip-path:none!important}
/* α mark on the cream tile everywhere (both themes) */
.v22-core-mark,.v22-insight-row.v2 .v22-ins-badge,.hd-app{background:linear-gradient(160deg,#fffdf8,#f3e7d3)!important;border:1px solid #e2cfae!important;box-shadow:0 1px 2px rgba(94,64,32,.1),inset 0 1px 0 #fff!important}
.v22-core-mark{width:72px!important;height:72px!important;border-radius:18px!important}

/* ==========================================================================
   v23.15 — Session timeout warning (src/features/auth/session-timeout.js)
   "Are you still there?" dialog shown 60 s before the inactivity sign-out.
   ========================================================================== */
.ma-sw-backdrop{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:16px;background:#020611c4;backdrop-filter:blur(6px);animation:maSwIn .18s ease-out}
.ma-sw{width:min(420px,100%);text-align:center;background:#101b34;border:1px solid #3d5687;border-radius:18px;padding:26px 24px 22px;box-shadow:0 25px 80px #000b;color:#eef3ff}
.ma-sw-ic{width:52px;height:52px;margin:0 auto 12px;border-radius:15px;display:grid;place-items:center;color:#fbbf24;background:#2a2410;border:1px solid #5c4a14}
.ma-sw h3{margin:0 0 6px;font:700 20px Manrope,sans-serif}
.ma-sw p{margin:0 auto 16px;max-width:330px;color:#a9b6d3;font-size:14px;line-height:1.5}
.ma-sw-count{display:flex;flex-direction:column;align-items:center;gap:2px;margin:0 0 20px}
.ma-sw-count b{font:800 40px/1 Manrope,sans-serif;font-variant-numeric:tabular-nums;color:#fbbf24}
.ma-sw-count small{color:#8e9bb7;font-size:12px}
.ma-sw-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.ma-sw-actions button{min-width:150px}
@keyframes maSwIn{from{opacity:0}to{opacity:1}}

/* ==========================================================================
   v23.15 — KYC dialog and status strip (src/features/subscription/kyc.js)
   ========================================================================== */
.ma-kyc{display:flex;flex-direction:column;gap:14px}
.ma-kyc-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ma-kyc-steps li{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#8e9bb7;padding:8px 10px;border-radius:10px;background:rgba(30,45,90,.35);border:1px solid rgba(110,140,230,.18)}
.ma-kyc-steps li span{width:22px;height:22px;flex:none;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:12px;background:#1b2747;color:#a9b6d3}
.ma-kyc-steps li.on{color:#eef3ff;border-color:#5b7cfa}.ma-kyc-steps li.on span{background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff}
.ma-kyc-steps li.done span{background:#10b981;color:#fff}
.ma-kyc-lead{margin:0;color:#a9b6d3;line-height:1.55}
.ma-kyc-form{display:grid;gap:12px}
.ma-kyc-form input[name=pan]{letter-spacing:.12em;text-transform:uppercase;font-family:'SFMono-Regular',Consolas,monospace}
.ma-kyc-consent{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;line-height:1.5;color:#a9b6d3;cursor:pointer}
.ma-kyc-consent input{margin-top:3px;flex:none;width:16px;height:16px}
.ma-kyc-test{margin:0;font-size:12px;color:#8e9bb7}.ma-kyc-test b{font-family:Consolas,monospace;color:#c7d2fe}
.ma-kyc-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-top:4px}
.ma-kyc-result{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:8px 6px}
.ma-kyc-result b{font:700 17px Manrope,sans-serif}.ma-kyc-result p{margin:0;color:#a9b6d3;line-height:1.55;max-width:420px}.ma-kyc-result small{color:#8e9bb7}
.ma-kyc-strip{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 16px;margin:0 0 16px;border-radius:14px;background:rgba(30,45,90,.35);border:1px solid rgba(110,140,230,.22);font-size:13.5px;color:#cbd5f5}
.ma-kyc-strip span{flex:1;min-width:220px}.ma-kyc-strip.ok{border-color:rgba(16,185,129,.45)}.ma-kyc-strip.warn{border-color:rgba(245,158,11,.45)}
.ma-kyc-strip:empty{display:none}
.ma-kyc .ma-kyc-consent{display:flex!important;flex-direction:row!important;align-items:flex-start;gap:10px;margin:0}
.ma-kyc .ma-kyc-consent input{width:18px!important;height:18px!important;min-height:0!important;padding:0!important;margin:2px 0 0!important;flex:none;accent-color:#6366f1}
.ma-kyc .ma-kyc-consent span{flex:1}

/* ==========================================================================
   v23.15 — Admin → System Settings → Build progress
   ========================================================================== */
.ma-prog{border:1px solid rgba(110,140,230,.2);border-radius:16px;padding:18px;margin:0 0 18px;background:rgba(20,30,64,.45)}
.ma-prog-head{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}
.ma-prog-big{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:12px;background:rgba(30,45,90,.4)}
.ma-prog-big b{font:800 26px/1.1 Manrope,sans-serif;color:#eef3ff}.ma-prog-big small{color:#8e9bb7;font-size:12px}
.ma-prog-body{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(260px,1fr);gap:18px}
.ma-prog h3{margin:0 0 10px;font:700 14px Manrope,sans-serif;color:#dce6f9}
.ma-prog-row{display:grid;grid-template-columns:minmax(170px,1.1fr) minmax(120px,1.4fr) minmax(130px,1fr);align-items:center;gap:12px;padding:6px 0}
.ma-prog-row>span{display:flex;align-items:center;gap:8px;min-width:0}.ma-prog-row>span b{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ma-prog-row .v22-bar{display:flex;height:8px;border-radius:99px;overflow:hidden;background:rgba(110,140,230,.18)}
.ma-prog-row small{color:#8e9bb7;font-size:12px;white-space:nowrap}
.ma-prog-key{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:10px 0 0;font-size:11.5px;color:#8e9bb7}
.ma-prog-key span{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:4px;vertical-align:-1px}
.ma-prog-key .s-none{background:rgba(110,140,230,.18)}
.ma-prog-log ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ma-prog-log li{display:grid;grid-template-columns:auto auto;justify-content:start;gap:2px 8px;padding:8px 10px;border-radius:10px;background:rgba(30,45,90,.35)}
.ma-prog-log li span{color:#8e9bb7;font-size:11.5px}.ma-prog-log li b{font-size:11.5px;color:#a5b4fc}
.ma-prog-log li p{grid-column:1/-1;margin:0;font-size:12.5px;line-height:1.45;color:#cbd5f5}
@media (max-width:1100px){.ma-prog-body{grid-template-columns:1fr}}
@media (max-width:640px){.ma-prog-head{grid-template-columns:1fr}.ma-prog-row{grid-template-columns:1fr;gap:4px}}
.ma-prog-row .v22-bar em{border-radius:0}.ma-prog-row .v22-bar em.s-Ready,.ma-prog-key .s-Ready{background:#22c55e}.ma-prog-row .v22-bar em.s-Manual,.ma-prog-key .s-Manual{background:#38bdf8}.ma-prog-row .v22-bar em.s-Mock,.ma-prog-key .s-Mock{background:#f59e0b}
.ma-prog-row{grid-template-columns:minmax(200px,1.25fr) minmax(110px,1.3fr) minmax(150px,1fr)}
.ma-prog-row>span b{white-space:normal;overflow:visible;line-height:1.25}
.ma-prog-log li{display:block}.ma-prog-log li span{margin-right:8px}.ma-prog-log li p{margin-top:3px}

/* ==========================================================================
   v23.15 — landing "joined" notification card (initPublicActivityToast)
   ========================================================================== */
.public-activity-toast.ma-act{display:flex;align-items:center;gap:16px;width:min(440px,calc(100vw - 32px));min-height:0;padding:16px 44px 16px 18px;border-radius:16px;background:#121a2b;border:1px solid rgba(148,163,184,.38);box-shadow:0 18px 50px rgba(0,0,0,.45)}
.ma-act .activity-toast-avatar{width:52px;height:52px;flex:0 0 52px;border-radius:50%;display:grid;place-items:center;font:700 17px Inter,sans-serif;color:#fff;letter-spacing:.02em;background:linear-gradient(140deg,hsl(var(--h,20) 45% 52%),hsl(calc(var(--h,20) + 70) 40% 40%))}
.ma-act .activity-toast-avatar img{width:30px;height:30px;object-fit:contain}
.ma-act .activity-toast-copy{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.ma-act .activity-toast-title{font-size:15.5px;color:#e5e9f2;line-height:1.3}.ma-act .activity-toast-title b{font-weight:700;color:#fff}
.ma-act .activity-toast-line{font-size:15px;color:#cbd5e1;line-height:1.3}
.ma-act .activity-toast-time{font-size:13px;color:#8b95a7}
.ma-act .activity-toast-check{color:#4ade80;font-size:18px;font-weight:700;flex:none}
.ma-act .activity-toast-close{top:6px;right:8px;font-size:16px;opacity:.55}.ma-act .activity-toast-close:hover{opacity:1}

/* ---------- v23.15 date picker: time row for date + time fields ---------- */
.ma-dp-time{display:flex;align-items:center;gap:8px;margin:10px 2px 2px;padding:10px 0 0;border-top:1px solid rgba(110,140,230,.18)}
.ma-dp-time>span{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:#a9b6d3;margin-right:auto}
.ma-dp-time>span svg{width:16px;height:16px}
.ma-dp-time select{appearance:none;-webkit-appearance:none;min-width:48px;padding:7px 10px;border-radius:9px;border:1px solid rgba(110,140,230,.3);background:#0e1730;color:#eef3ff;font:600 14px Inter,sans-serif;text-align:center;cursor:pointer}
.ma-dp-time b{color:#8e9bb7}
.ma-dp-ampm{display:inline-flex;border:1px solid rgba(110,140,230,.3);border-radius:9px;overflow:hidden;margin-left:4px}
.ma-dp-ampm button{border:0;background:transparent;color:#a9b6d3;font:600 12.5px Inter,sans-serif;padding:7px 10px;cursor:pointer}
.ma-dp-ampm button.on{background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff}
.ma-dp [data-dp-done][disabled]{opacity:.5;cursor:not-allowed}

/* ==========================================================================
   v23.15 — default scale and sidebar width
   The design was tuned at 85 % browser zoom, so on desktop / laptop screens the whole page is shown at that
   scale by default (Chrome 100 % now looks like the old 85 %). Phones and tablets (< 1100 px) are unchanged.
   --vh100 keeps full-height parts (sidebar, sections, dialogs) filling the screen under the zoom.
   Positions measured in JavaScript are converted with maZoom() (src/core/state.js).
   ========================================================================== */
:root{--vh100:100vh;--vw100:100vw;--ma-sidebar-width:272px}
@media (min-width:1100px){html{zoom:.85}:root{--vh100:calc(100vh / .85);--vw100:calc(100vw / .85)}}

/* ==========================================================================
   Locked SIP date (no paid plan): blurred placeholder day + lock message + See plans.
   The real day is never sent to these users; the blurred number is a placeholder.
   ========================================================================== */
.ma-sip-locked{position:relative}
.ma-blur{filter:blur(9px);user-select:none;opacity:.75}
.ma-locked-val{font-style:normal;filter:blur(7px);user-select:none}
.ma-lock-over{display:grid;justify-items:center;text-align:center;gap:6px;margin:18px 0 6px;padding:14px;border-radius:12px;border:1px dashed rgba(124,179,255,.35);background:rgba(124,179,255,.06)}
.ma-lock-over b{font-size:15px}
.ma-lock-over small{font-size:12.5px;color:#8ea0c4;max-width:240px}
.ma-sip-locked .v22-best-act a.v22-grad-btn{display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;width:100%}
.ma-cal-locked .v22-cal-days span{pointer-events:none}
html[data-theme="light"] .ma-lock-over{border-color:rgba(139,90,43,.35);background:rgba(139,90,43,.06)}
html[data-theme="light"] .ma-lock-over small{color:#6b5641}

/* Settings → Profile: billing details and privacy sections (v23.18) */
.v22-set-h .v22-set-sub{margin-left:auto;font-size:12.5px;font-weight:500;color:#8ea0c4}
.v22-fl .v22-opt{font-style:normal;font-weight:400;font-size:12px;color:#8ea0c4}
.v22-fl-wide{grid-column:1/-1}
.ma-data-acts{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
.ma-data-acts .v22-act{border:1px solid var(--v-border,rgba(255,255,255,.1));border-radius:14px;padding:16px}
@media (max-width:760px){.ma-data-acts{grid-template-columns:1fr}}
html[data-theme="light"] .v22-set-h .v22-set-sub,html[data-theme="light"] .v22-fl .v22-opt{color:#6b5641}
html[data-theme="light"] .ma-data-acts .v22-act{border-color:rgba(139,90,43,.2)}

/* Sign-in cards (login, sign-up, reset password, admin codes): no logo inside the card — the top bar shows it. */
.v22-auth-card .v22-auth-brand{display:none}

/* Billing history (GST invoices) pop-up: wide enough for one line per invoice */
.modal:has(.ma-inv-hist){width:min(820px,94vw);max-width:820px}
.ma-inv-hist th,.ma-inv-hist td{white-space:nowrap}
.ma-inv-hist .v22-row-btn{display:inline-flex;align-items:center;gap:6px}
.v22-set-who>div{min-width:0}
.v22-set-who small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ma-auth-link{font-weight:700;text-decoration:underline;color:inherit}
/* Billing history: View and PDF side by side, same size */
.ma-inv-acts{display:flex;justify-content:flex-end;align-items:center;gap:8px}
.ma-inv-hist .ma-inv-acts .v22-row-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:34px;min-width:84px;padding:0 14px;margin:0;line-height:1;font-size:13px;font-weight:600;vertical-align:middle;box-sizing:border-box}
.ma-inv-hist .ma-inv-acts .v22-row-btn svg{width:15px;height:15px;flex:none}

/* ==========================================================================
   Insights & Instagram reels (features/insights/insights.js)
   ========================================================================== */
.ma-reel{width:100%;text-align:left;color:inherit;font:inherit;cursor:pointer}
.ma-reel:hover .ma-reel-play{transform:translate(-50%,-50%) scale(1.08)}
.ma-reel-thumb{position:relative;flex:none;width:64px;height:64px;border-radius:12px;overflow:hidden;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#f58529 0%,#dd2a7b 45%,#8134af 75%,#515bd4 100%)}
.ma-reel-thumb img{width:100%;height:100%;object-fit:cover}
.ma-reel-thumb .ma-ig-glyph{width:26px;height:26px;opacity:.9}
.ma-reel-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:rgba(0,0,0,.45);transition:transform .15s}
.ma-reel-play svg{width:28px;height:28px;color:#fff}
.ma-reel-thumb.has-img .ma-reel-play{background:rgba(0,0,0,.5)}
.ma-reel-src{display:inline-flex;align-items:center;gap:5px;margin-top:6px;font-size:12px;font-weight:600;color:#c13584}
.ma-reel-src .ma-ig-glyph{width:13px;height:13px}
.ma-ins-disc{margin:12px 0 0;font-size:11.5px;line-height:1.45;color:#8ea0c4}
.ma-reel-modal{display:grid;gap:12px}
.ma-reel-frame{position:relative;width:100%;aspect-ratio:9/15.5;max-height:calc(var(--vh100,100vh) * .68);border-radius:14px;overflow:hidden;background:#000}
.ma-reel-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#fff}
.ma-reel-frame.sm{aspect-ratio:auto;height:340px}
/* Player dialog: a square window onto Instagram's embed. The embed is a 55px header, a 4:5 video box and a footer;
   the iframe is shifted up by the header plus half of the extra height (12.5% of the square), so the square shows
   the middle of the video only. "Open on Instagram" below the player gives the full post. */
.ma-reel-frame.square{aspect-ratio:1/1;max-height:none}
.ma-reel-frame.square iframe{inset:auto;left:0;top:calc(-55px - 12.5%);width:100%;height:calc(125% + 420px)}
.ma-reel-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ma-reel-foot a{display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.ma-reel-foot .ma-ig-glyph{width:16px;height:16px}
.ma-reel-foot small{color:#8ea0c4;font-size:12px}
/* admin */
.ma-ins-how{display:grid;gap:6px}
.ma-ins-how ol{margin:4px 0 2px 18px;padding:0;display:grid;gap:3px;font-size:14px}
.ma-ins-how small{color:#8ea0c4}
.ma-ins-row{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid var(--v-border,rgba(255,255,255,.08))}
.ma-ins-row:first-of-type{border-top:0}
.ma-ins-kind{flex:none;width:52px;height:52px;border-radius:10px;display:grid;place-items:center;overflow:hidden;background:rgba(124,179,255,.12)}
.ma-ins-kind.instagram{color:#fff;background:linear-gradient(135deg,#f58529,#dd2a7b 45%,#8134af 75%,#515bd4)}
.ma-ins-kind img{width:100%;height:100%;object-fit:cover}
.ma-ins-kind .ma-ig-glyph{width:22px;height:22px}
.ma-ins-main{flex:1;min-width:0;display:grid;gap:4px}
.ma-ins-main small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#8ea0c4}
.ma-ins-main small a{color:inherit}
.ma-ins-tags{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px}
.ma-ins-acts{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.ma-ins-acts .v22-row-btn{display:inline-flex;align-items:center;gap:5px;height:32px;padding:0 12px;margin:0}
.ma-ins-acts .v22-row-btn svg{width:14px;height:14px}
.ma-ins-acts .v22-row-btn.danger{color:#e5484d}
.ma-ins-cover{display:flex;align-items:center;gap:12px}
.ma-ins-cover #ma-ins-cv{width:56px;height:56px;border-radius:10px;overflow:hidden;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#f58529,#dd2a7b 45%,#8134af 75%,#515bd4)}
.ma-ins-cover #ma-ins-cv img{width:100%;height:100%;object-fit:cover}
.ma-ins-cover .ma-ig-glyph{width:22px;height:22px}
.ma-ins-opts{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:end}
.ma-checks{display:grid;gap:10px;padding-bottom:8px}
.ma-ins-ed .ma-check{display:flex!important;flex-direction:row!important;align-items:center;gap:10px;font-size:14px;cursor:pointer;margin:0}
.ma-ins-ed .ma-check input{margin:0!important;flex:none}
.ma-check input{width:16px;height:16px;accent-color:#a8692f}
.v22-phead-actions .ma-ig-glyph{width:18px;height:18px;flex:none}
.v22-phead-actions [data-ma-ins-new]{white-space:nowrap;display:inline-flex;align-items:center;gap:8px}
.v22-ins.ma-reel{grid-template-columns:64px 1fr;align-items:start}
.modal:has(.ma-ins-ed){width:min(560px,94vw)}
.ma-ins-ed textarea{width:100%;resize:vertical}
@media (max-width:760px){.ma-ins-row{flex-wrap:wrap}.ma-ins-acts{width:100%;justify-content:flex-start}}
html[data-theme="light"] .ma-ins-disc,html[data-theme="light"] .ma-ins-main small,html[data-theme="light"] .ma-ins-how small,html[data-theme="light"] .ma-reel-foot small{color:#6b5641}
html[data-theme="light"] .ma-ins-row{border-color:rgba(139,90,43,.15)}
html[data-theme="light"] .ma-ins-kind.text{background:rgba(168,105,47,.1);color:#8b5a2b}

/* Reel player pop-up, Instagram style: a narrow portrait card — video on top, title + caption below.
   Width is capped so the whole card (video + caption) fits the screen height. The Instagram player is sized from
   the card width (container units): its header (account) stays, the like/comment bar under the video is cut off. */
.modal:has(.ma-reel-modal){width:min(650px,calc(100vw - 24px),calc((var(--vh100,100vh) - 350px) / 1.25 + 32px))!important;max-width:none!important;min-width:300px;height:auto;max-height:calc(var(--vh100,100vh) - 24px)}
.modal:has(.ma-reel-modal)>.modal-body{overflow-y:auto;padding:0 0 4px!important}
.modal:has(.ma-reel-modal) .modal-head{padding:12px 16px!important}
.ma-reel-head{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:700}
.ma-reel-head .ma-ig-glyph{width:18px;height:18px;color:#c13584}
.ma-reel-modal{display:block!important;container-type:inline-size}
.ma-reel-stage{position:relative;margin:14px 16px 0;width:auto;height:calc(55px + (100cqw - 32px) * 1.25);overflow:hidden;background:#000;border-radius:12px}
.ma-reel-stage iframe{position:absolute;inset:0 auto auto 0;width:100%;height:calc(55px + (100cqw - 32px) * 1.25 + 140px);border:0;background:#fff}
.ma-reel-cap{padding:14px 16px 6px;display:grid;gap:6px}
.ma-reel-cap b{font-size:15.5px;line-height:1.35}
.ma-reel-cap p{margin:0;font-size:14px;line-height:1.5;white-space:pre-line}
.ma-reel-time{font-size:12px;color:#8ea0c4}
.ma-reel-acts{margin-top:6px}
.ma-reel-acts a{display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.ma-reel-acts .ma-ig-glyph{width:16px;height:16px}
.ma-reel-disc{font-size:12px;color:#8ea0c4}
html[data-theme="light"] .ma-reel-time,html[data-theme="light"] .ma-reel-disc{color:#6b5641}

/* "View All" insights pop-up: 60% of the page wide */
.modal:has(.ma-ins-all){width:calc(var(--vw100,100vw) * .6)!important;max-width:calc(var(--vw100,100vw) - 32px)!important}
@media (max-width:760px){.modal:has(.ma-ins-all){width:calc(100vw - 24px)!important}}
.ma-ins-all .v22-ins-list{display:grid!important;grid-template-columns:1fr 1fr;gap:12px 14px;max-height:none!important;overflow:visible!important;padding-right:0;margin-right:0}
.ma-ins-all .v22-ins{margin-top:0}
@media (max-width:900px){.ma-ins-all .v22-ins-list{grid-template-columns:1fr}}
/* View All pop-up: bigger cards to match the wider pop-up — larger square thumbnail / icon, roomier text,
   equal-height cards in each row, long captions trimmed to 4 lines (full text in the reel player) */
.ma-ins-all .v22-ins-list{align-items:stretch}
.ma-ins-all .v22-ins{grid-template-columns:56px 1fr;gap:16px;padding:18px;border-radius:14px;height:100%;box-sizing:border-box}
.ma-ins-all .v22-ins.ma-reel{grid-template-columns:104px 1fr}
.ma-ins-all .ma-reel-thumb{width:104px;height:104px;border-radius:14px}
.ma-ins-all .ma-reel-thumb .ma-ig-glyph{width:34px;height:34px}
.ma-ins-all .ma-reel-play,.ma-ins-all .ma-reel-play svg{width:38px;height:38px}
.ma-ins-all .v22-ins>.v22-tile{width:56px;height:56px;border-radius:14px}
.ma-ins-all .v22-ins>.v22-tile svg{width:26px;height:26px}
.ma-ins-all .v22-ins-top{align-items:flex-start}
.ma-ins-all .v22-ins-top b{font-size:16px!important;line-height:1.35}
.ma-ins-all .v22-ins p{font-size:14px!important;line-height:1.55;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.ma-ins-all .ma-reel-src{margin-top:10px;font-size:13px}
@media (max-width:760px){.ma-ins-all .v22-ins.ma-reel{grid-template-columns:72px 1fr}.ma-ins-all .ma-reel-thumb{width:72px;height:72px}}
.ma-ins-all .ma-ins-disc{margin-top:16px}

/* Sign-out notice at the top of the login card (session-timeout.js) */
.ma-signout-note{display:grid;grid-template-columns:40px 1fr 28px;gap:12px;align-items:start;text-align:left;margin:0 0 22px;padding:14px 14px 14px 16px;border-radius:14px;border:1px solid rgba(245,177,61,.45);background:linear-gradient(135deg,rgba(245,177,61,.16),rgba(245,177,61,.06));animation:maSnIn .35s ease-out}
.ma-signout-note.info{border-color:rgba(46,211,145,.4);background:linear-gradient(135deg,rgba(46,211,145,.14),rgba(46,211,145,.05))}
.ma-sn-ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(245,177,61,.2);color:#f5b13d}
.ma-signout-note.info .ma-sn-ic{background:rgba(46,211,145,.18);color:#2ed391}
.ma-sn-ic svg{width:22px;height:22px}
.ma-sn-txt b{display:block;font-size:15px;font-weight:700;line-height:1.3}
.ma-sn-txt p{margin:4px 0 0;font-size:14px;line-height:1.45}
.ma-sn-txt small{display:block;margin-top:4px;font-size:12.5px;color:#8ea0c4}
.ma-sn-x{width:28px;height:28px;border:0;border-radius:8px;background:transparent;color:inherit;font-size:20px;line-height:1;cursor:pointer;opacity:.6}
.ma-sn-x:hover{opacity:1;background:rgba(0,0,0,.06)}
@keyframes maSnIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.ma-signout-note{animation:none}}

/* ==========================================================================
   Phone layout (≤ 760 px) — features/mobile/mobile-shell.js
   Drawer menu, compact sticky top bar, bottom tab bar, single-column cards.
   ========================================================================== */
.ma-m-lead,.ma-bottom-nav,.ma-drawer-scrim{display:none}
@media (max-width:760px){
  html body .app-shell{display:block!important;padding-bottom:calc(68px + env(safe-area-inset-bottom))}
  html body .sidebar.v22-side{position:fixed!important;top:0!important;left:0!important;bottom:0!important;width:min(300px,84vw)!important;height:100dvh!important;min-height:0!important;max-height:none!important;padding:14px 12px!important;z-index:1300!important;transform:translateX(-104%);transition:transform .25s ease;overflow-y:auto!important;border-right:1px solid var(--v-border,rgba(255,255,255,.1))!important;border-bottom:0!important;box-shadow:none}
  html.ma-drawer-open body .sidebar.v22-side{transform:none;box-shadow:12px 0 40px rgba(0,0,0,.25)}
  .ma-drawer-scrim{display:block;position:fixed;inset:0;z-index:1250;background:rgba(15,10,5,.38);opacity:0;pointer-events:none;transition:opacity .25s}
  html.ma-drawer-open .ma-drawer-scrim{opacity:1;pointer-events:auto}
  html body .main-area{margin-left:0!important;padding:0 14px 16px!important}
  html body .workspace-topbar{position:sticky!important;top:0;z-index:900;height:58px!important;margin:0 -14px 10px!important;padding:0 10px 0 6px!important;display:flex!important;align-items:center;justify-content:space-between;gap:8px;backdrop-filter:blur(10px)}
  .ma-m-lead{display:flex;align-items:center;gap:4px;min-width:0}
  .ma-m-menu{width:44px;height:44px;display:grid;place-items:center;border:0;background:transparent;color:inherit;border-radius:12px;cursor:pointer}
  .ma-m-menu svg{width:24px;height:24px}
  .ma-m-logo{display:flex;align-items:center;gap:7px;text-decoration:none;color:inherit;min-width:0}
  .ma-m-logo b{font-size:16px;font-weight:800;white-space:nowrap}
  .ma-m-logo svg{width:26px;height:26px;flex:none}
  html body .workspace-topbar .workspace-actions{width:auto!important;gap:6px!important;margin:0!important;flex:none}
  html body .workspace-topbar .v22-upgrade span,html body .workspace-topbar .v22-profile span:last-child,html body .workspace-topbar .profile-menu>span:not(.avatar),html body .workspace-topbar .profile-menu>b{display:none!important}
  html body .workspace-topbar .v22-upgrade{padding:0 10px!important;min-width:0!important}
  html body .workspace-topbar .ma-lang-toggle,html body .workspace-topbar .ma-theme-toggle{transform:scale(.92)}
  .mobile-page-nav{display:none!important}
  .ma-bottom-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:1000;height:calc(64px + env(safe-area-inset-bottom));padding:6px 4px env(safe-area-inset-bottom);border-top:1px solid var(--v-border,rgba(255,255,255,.1));background:rgba(9,15,34,.96);backdrop-filter:blur(12px)}
  .ma-bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none;color:#8ea0c4;font-size:11.5px;font-weight:600;border-radius:12px}
  .ma-bottom-nav a svg{width:22px;height:22px}
  .ma-bottom-nav a.on{color:#fff}
  .ma-bottom-nav a.on svg{background:linear-gradient(135deg,#4f7cff,#8b5cf6);color:#fff;border-radius:14px;padding:4px 14px;width:52px;height:28px;box-sizing:border-box}
  html body .chat-fab.v22-fab{bottom:calc(78px + env(safe-area-inset-bottom))!important;right:12px!important;transform:scale(.86);transform-origin:bottom right}
  .workspace-footer{display:none!important}
  /* dashboard SIP calendar: calendar on top, Best Date card below */
  html body .v22-cal-wrap{display:grid!important;grid-template-columns:1fr!important;gap:14px!important}
  html body .v22-cal-main,html body .v22-cal-side{width:auto!important;min-width:0!important;max-width:none!important}
  html body .v22-cal-card .v22-card-head{flex-wrap:wrap;gap:10px}
  /* billing history table scrolls sideways inside the pop-up */
  .ma-inv-hist{overflow-x:auto}
  .modal:has(.ma-inv-hist){width:calc(100vw - 20px)!important}
}
html[data-theme="light"] body .ma-bottom-nav{background:rgba(251,246,238,.97)!important;border-top-color:#e7d6bd!important}
html[data-theme="light"] body .ma-bottom-nav a{color:#7a6248!important}
html[data-theme="light"] body .ma-bottom-nav a.on{color:#3b2a14!important}
html[data-theme="light"] body .ma-bottom-nav a.on svg{background:linear-gradient(135deg,#a8692f,#7a3f5e)!important;color:#fff!important}
html[data-theme="light"] .ma-drawer-scrim{background:rgba(60,40,20,.32)}
@media (max-width:760px){html[data-theme="light"] body .workspace-topbar{background:rgba(251,246,238,.92)!important}html[data-theme="light"] body .sidebar.v22-side{background:#fbf6ee!important}}

/* Public pages on a phone (≤ 600 px): logo + actions on one row, menu links scroll underneath;
   landing hero stacks the text above the phone illustration */
@media (max-width:600px){
  html body header.public-topbar{display:flex!important;flex-wrap:wrap!important;align-items:center!important;height:auto!important;min-height:0!important;padding:10px 14px 6px!important;gap:6px 8px!important}
  html body header.public-topbar .brand{flex:none!important;width:auto!important;min-width:0!important;order:0}
  html body header.public-topbar .brand .brand-symbol{height:30px!important;width:auto!important}
  html body header.public-topbar .brand-wording small{display:none!important}
  html body header.public-topbar .brand-wording strong{font-size:16px!important}
  html body header.public-topbar .public-actions{order:1;margin-left:auto!important;gap:6px!important;flex:none!important;width:auto!important}
  html body header.public-topbar .public-actions .ma-lang-toggle{display:none!important}
  html body header.public-topbar .public-actions a,html body header.public-topbar .public-actions button{padding-left:12px!important;padding-right:12px!important;font-size:13.5px!important;height:38px!important}
  html body header.public-topbar .public-actions .ma-theme-toggle{padding:0!important;width:38px!important}
  html body header.public-topbar .public-nav{order:2;width:100%!important;display:flex!important;overflow-x:auto;gap:18px!important;padding:4px 2px 2px!important;scrollbar-width:none;justify-content:flex-start!important}
  html body header.public-topbar .public-nav::-webkit-scrollbar{display:none}
  html body header.public-topbar .public-nav a{white-space:nowrap;font-size:13.5px!important}
  html body .v22-hero.hero-d{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;padding-top:18px!important}
  html body .v22-hero.hero-d .v22-hero-copy{width:auto!important;max-width:none!important}
  html body .v22-hero.hero-d h1{font-size:40px!important;line-height:1.08!important}
  html body .v22-hero.hero-d .v22-hero-art{width:100%!important;height:440px!important;min-height:0!important;margin:0!important}
  html body .v22-hero.hero-d .hd-stage{--hds:.72}
}
@media (max-width:600px){
  html body header.public-topbar .brand .brand-symbol{height:26px!important}
  html body header.public-topbar .brand-wording strong{font-size:15px!important}
  html body header.public-topbar .public-actions .ma-theme-toggle{width:34px!important;height:34px!important}
  html body header.public-topbar .public-actions .login-outline,html body header.public-topbar .public-actions .top-cta{height:36px!important;padding:0 11px!important;font-size:13px!important;display:inline-flex!important;align-items:center!important;white-space:nowrap!important;min-width:0!important}
  html body header.public-topbar .public-actions .top-cta svg{display:none}
}
@media (max-width:760px){
  html body .v22-faq-grid{grid-template-columns:1fr!important;gap:18px!important}
}
@media (max-width:600px){
  html body header.topbar.public-topbar .top-actions.public-actions a.top-cta,html body header.topbar.public-topbar .top-actions.public-actions .login-outline{font-size:13px!important;padding:0 12px!important;height:34px!important;line-height:34px!important;display:inline-flex!important;align-items:center!important;white-space:nowrap!important;min-width:0!important}
  html body header.topbar.public-topbar .top-actions.public-actions a.top-cta svg{display:none!important}
}

/* ==========================================================================
   Phone (≤ 600 px)
   • Mobile browser: the FULL website, laid out for a narrow screen (scrolls normally, footer included).
   • Android / installed app (html.ma-app — set in index.html for an app WebView, an installed PWA, or ?app=1):
     landing becomes a short welcome screen (headline, pitch, illustration, Get started / Log in); the long
     marketing sections, menu links, activity pop-up and footer are left out.
   ========================================================================== */
@media (max-width:600px){
  html body .v22-hero.hero-d .v22-hero-badge{font-size:12px!important;padding:5px 10px!important}
  html body .v22-hero.hero-d h1{font-size:34px!important;margin:12px 0 10px!important}
  html body .v22-hero.hero-d .v22-hero-copy>p{font-size:15px!important;line-height:1.5!important}
  html body .v22-hero.hero-d .v22-hero-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;margin-top:16px!important}
  html body .v22-hero.hero-d .v22-hero-actions>*{width:100%!important;justify-content:center!important;font-size:15px!important;padding:13px 10px!important;margin:0!important}
  html body .v22-hero.hero-d .hd-stage{--hds:.6}
  html body .v22-hero.hero-d .v22-hero-art{height:330px!important}
  /* app only */
  html.ma-app body header.public-topbar .public-nav{display:none!important}
  html.ma-app body .public-footer{display:none!important}
  html.ma-app body .public-activity-toast{display:none!important}
  html.ma-app body main.v22-landing>section:not(.v22-hero),html.ma-app body main.v22-landing>div:not(.public-activity-toast){display:none!important}
  html.ma-app body .v22-hero.hero-d{min-height:calc(100dvh - 60px)!important;align-content:start!important;padding-bottom:24px!important}
  html.ma-app body .v22-hero.hero-d .v22-hero-stats{display:none!important}
  html.ma-app body .v22-hero.hero-d .v22-hero-copy>p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  html.ma-app body .v22-hero.hero-d .v22-hero-art{order:-1;margin:-6px 0 -10px!important}
}

/* Phone: signed-in screens — compact, app-like (less chrome, smaller type, 2-up tiles) */
@media (max-width:600px){
  .ma-m-logo img{height:26px;width:auto}
  /* dashboard */
  html body .v22-welcome h1{font-size:22px!important}
  html body .v22-welcome p{font-size:13.5px!important}
  html body .v22-kpis{grid-template-columns:1fr 1fr!important;gap:10px!important;margin-top:14px!important}
  html body .v22-kpis article{flex-direction:column!important;gap:8px!important;padding:12px!important;min-width:0}
  html body .v22-kpis .v22-tile{width:34px!important;height:34px!important}
  html body .v22-kpis .v22-tile svg{width:18px!important;height:18px!important}
  html body .v22-kpis .v22-kpi-txt small{font-size:12px!important;line-height:1.3}
  html body .v22-kpis .v22-kpi-txt small em{display:block}
  html body .v22-kpis .v22-kpi-val{font-size:22px!important;display:block}
  html body .v22-kpis .v22-kpi-val span{display:block;font-size:11.5px!important;margin:2px 0 0!important;white-space:normal}
  html body .v22 .v22-card{padding:16px!important;border-radius:16px!important}
  html body .v22 .v22-card-head h2,html body .v22 .v22-h2{font-size:17px!important}
  html body .v22 .v22-card-head p,html body .v22 .v22-sub{font-size:13px!important}
  html body .v22-phead h1,html body .v22 .v22-subhead h1{font-size:24px!important}
  html body .v22-phead p{font-size:13.5px!important}
  html body .v22-note{display:none}
  /* settings: tabs across the top, no side card */
  html body .v22-set-layout{display:block!important}
  html body .v22-set-side{position:static!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;margin-bottom:12px}
  html body .v22-set-side .v22-set-who{display:none!important}
  html body .v22-set-side nav{display:grid!important;grid-template-columns:1fr 1fr;gap:8px}
  html body .v22-set-side nav button{padding:10px!important;border-radius:12px!important;justify-content:center}
  html body .v22-set-side nav button small,html body .v22-set-side nav button .go,html body .v22-set-side nav button>svg:first-child,html body .v22-set-side nav button>.v22-cic,html body .v22-set-side nav button>span:first-child:not(:only-of-type)>svg{display:none!important}
  html body .v22-prof{flex-wrap:wrap;gap:12px!important}
  html body .v22-prof .v22-prof-av{width:52px!important;height:52px!important;font-size:22px!important}
  html body .v22-prof .v22-sec-actions{width:100%;display:grid!important;grid-template-columns:1fr 1fr;gap:8px}
  html body .v22-prof .v22-sec-actions button{font-size:12.5px!important;padding:9px 8px!important;justify-content:center}
  html body .v22-prof-main span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;max-width:240px}
  html body .v22-form-grid{grid-template-columns:1fr!important}
  /* billing history: one card per invoice */
  .ma-inv-hist table,.ma-inv-hist tbody,.ma-inv-hist tr,.ma-inv-hist td{display:block;width:100%}
  .ma-inv-hist thead{display:none}
  .ma-inv-hist tr{padding:12px 0;border-bottom:1px solid rgba(139,90,43,.15)}
  .ma-inv-hist td{padding:2px 0!important;border:0!important;text-align:left!important;white-space:normal!important}
  .ma-inv-hist td:first-child{font-weight:700}
  .ma-inv-hist .ma-inv-acts{justify-content:flex-start;margin-top:8px}
}
@media (max-width:760px){
  /* top bar stays visible while scrolling (sticky is broken by an overflow rule on an ancestor) */
  html body .workspace-topbar{position:fixed!important;top:0!important;left:0!important;right:0!important;margin:0!important;width:auto!important}
  html body .main-area{padding-top:66px!important}
}
@media (max-width:600px){
  html body .v22-prof-tags{display:flex!important;flex-wrap:wrap!important;gap:6px!important}
  html body .v22-prof-tags .v22-pill{max-width:none!important;overflow:visible!important;white-space:nowrap!important;text-overflow:clip!important}
  html body .v22-prof-main{min-width:0;flex:1 1 180px}
}
.ma-to-admin{text-decoration:none;color:inherit}