/* =====================================================================
   U0C — Ultra layer
   Signature interactions: custom cursor, live canvas, tilt, magnetic,
   spotlight, marquee, scroll progress.
   Loaded only on public pages.
   ===================================================================== */

/* ---------------------------------------------------------- backdrop */
#u0c-canvas{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  opacity:.9;
}
.aurora{
  position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden;
}
.aurora i{
  position:absolute; display:block; border-radius:50%;
  opacity:.42;
  animation:auroraDrift 28s var(--ease,ease) infinite alternate;
}
.aurora i:nth-child(1){width:640px;height:640px;top:-200px;inset-inline-start:-140px;
  background:radial-gradient(circle,rgba(139,92,246,.38),transparent 62%)}
.aurora i:nth-child(2){width:520px;height:520px;bottom:-180px;inset-inline-end:-120px;
  background:radial-gradient(circle,rgba(52,211,153,.16),transparent 65%);animation-delay:-9s}
.aurora i:nth-child(3){width:420px;height:420px;top:36%;inset-inline-start:54%;
  background:radial-gradient(circle,rgba(139,92,246,.2),transparent 65%);animation-delay:-16s;opacity:.3}
@keyframes auroraDrift{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(36px,-28px,0) scale(1.07)}
  100%{transform:translate3d(-28px,36px,0) scale(.95)}
}

.uc-grid{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(to right, rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size:78px 78px;
  mask-image:radial-gradient(ellipse 75% 55% at 50% 0%, #000 15%, transparent 72%);
  -webkit-mask-image:radial-gradient(ellipse 75% 55% at 50% 0%, #000 15%, transparent 72%);
}

.uc-grain{
  position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='150' height='150' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}

/* everything above the backdrop */
body > main, body > header, body > footer{ position:relative; z-index:2; }

/* ------------------------------------------------------ scroll meter */
.uc-progress{
  position:fixed; top:0; inset-inline:0; height:2px; z-index:120; pointer-events:none;
  background:rgba(255,255,255,.05);
}
.uc-progress i{
  display:block; height:100%; width:0;
  background:linear-gradient(90deg,var(--nile,#FACC15),var(--lime));
  box-shadow:0 0 12px var(--lime);
}

/* --------------------------------------------------- custom cursor */
@media (pointer:fine){
  html.uc-cursor, html.uc-cursor body{cursor:none}
  html.uc-cursor a, html.uc-cursor button, html.uc-cursor input,
  html.uc-cursor textarea, html.uc-cursor select, html.uc-cursor label,
  html.uc-cursor summary{cursor:none}

  .uc-dot{
    position:fixed; top:0; left:0; z-index:9999; pointer-events:none;
    width:7px; height:7px; border-radius:50%; background:var(--lime); box-shadow:0 0 10px rgba(52,211,153,.55);
    transform:translate(-50%,-50%); opacity:0; will-change:transform; contain:layout style;
    transition:width .2s,height .2s,opacity .2s;
  }
  .uc-ring{
    position:fixed; top:0; left:0; z-index:9998; pointer-events:none;
    width:34px; height:34px; border-radius:50%;
    border:1.5px solid color-mix(in srgb, var(--lime) 70%, transparent);
    transform:translate(-50%,-50%); opacity:0; will-change:transform;
    transition:width .28s var(--ease,ease),height .28s var(--ease,ease),
               border-color .28s,background .28s,opacity .2s;
  }
  .uc-ring.is-hover{
    width:64px; height:64px;
    background:color-mix(in srgb, var(--lime) 10%, transparent);
    border-color:var(--lime);
  }
  .uc-ring.is-down{ width:26px; height:26px; }
  .uc-label{
    position:fixed; top:0; left:0; z-index:9999; pointer-events:none;
    transform:translate(-50%,-50%) scale(.6);
    font-family:var(--font-mono,monospace); font-size:.62rem; letter-spacing:.18em;
    text-transform:uppercase; color:#04121C; background:var(--lime);
    padding:5px 10px; border-radius:999px; opacity:0;
    transition:opacity .2s,transform .25s var(--ease,ease);
  }
  .uc-label.is-visible{ opacity:1; transform:translate(-50%,-50%) scale(1); }
}

/* touch / reduced motion: no cursor layer */
@media (pointer:coarse){
  .uc-dot,.uc-ring,.uc-label{ display:none !important; }
}

/* ------------------------------------------------------ hero polish */
.uc-hero{
  position:relative;overflow:hidden;isolation:isolate;
  padding:calc(var(--hero-pad,120px)*0.7) 0 var(--hero-pad,120px);
}
.uc-hero::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(1100px 520px at 78% -12%,
             color-mix(in srgb,var(--hero-from,#34D399) 14%,transparent),transparent 62%);
}
.uc-hero__grid{display:grid;grid-template-columns:1.12fr .88fr;gap:56px;align-items:center}
@media(max-width:980px){.uc-hero__grid{grid-template-columns:1fr;gap:44px}}

.uc-badge{
  display:inline-flex;align-items:center;gap:9px;
  border:1px solid color-mix(in srgb, var(--lime) 26%, transparent);
  background:color-mix(in srgb, var(--lime) 6%, transparent);
  color:var(--lime);border-radius:999px;padding:7px 16px;
  font-size:.76rem;letter-spacing:.02em;
}
.uc-badge .pulse{width:6px;height:6px;border-radius:50%;background:var(--lime);animation:ucPulse 2.4s infinite}
@keyframes ucPulse{
  0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--lime) 55%,transparent)}
  70%{box-shadow:0 0 0 10px transparent}
  100%{box-shadow:0 0 0 0 transparent}
}

.uc-title{
  font-size:clamp(2.4rem,5.6vw,4.4rem);line-height:1.08;margin-top:24px;font-weight:800;
}
.uc-title .grad{
  background:linear-gradient(100deg,#A7F3D0,var(--lime) 38%,#8A7DFF 72%,#F472B6);
  background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:ucShimmer 7s linear infinite;
}
@keyframes ucShimmer{to{background-position:200% 0}}

.uc-title .word{display:inline-block;opacity:0;transform:translateY(.5em) rotate(2deg);
  animation:ucWord .8s var(--ease,ease) forwards}
@keyframes ucWord{to{opacity:1;transform:none}}

.uc-lead{margin-top:22px;max-width:46ch;color:var(--muted);font-size:1.05rem}

/* floating chips around the orb */
.uc-orb-wrap{position:relative;display:grid;place-items:center;min-height:420px}
.uc-orb{
  width:min(300px,66vw);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;
  border:1px solid color-mix(in srgb,var(--lime) 18%,transparent);
  background:radial-gradient(circle at 50% 45%, rgba(244,114,182,.18), transparent 62%);
  box-shadow:inset 0 0 80px rgba(244,114,182,.12), 0 0 90px -18px color-mix(in srgb,var(--lime) 35%,transparent);
  animation:ucFloat 9s ease-in-out infinite;
}
.uc-orb svg{width:52%}
@keyframes ucFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}

.uc-orb-wrap::before,.uc-orb-wrap::after{
  content:"";position:absolute;border-radius:50%;pointer-events:none;
}
.uc-orb-wrap::before{inset:6%;border:1px dashed rgba(255,255,255,.07);animation:ucSpin 44s linear infinite}
.uc-orb-wrap::after{inset:-4%;border:1px solid rgba(255,255,255,.05)}
@keyframes ucSpin{to{transform:rotate(360deg)}}

.uc-chip{
  position:absolute;display:flex;align-items:center;gap:7px;
  background:rgba(5,7,12,.82);
  border:1px solid var(--line);border-radius:999px;
  padding:7px 13px;font-size:.72rem;color:var(--text);white-space:nowrap;
  box-shadow:0 18px 40px -24px #000;
  animation:ucChip 7s ease-in-out infinite;
}
.uc-chip b{color:var(--lime);font-family:var(--font-mono,monospace);font-size:.72rem}
.uc-chip:nth-child(2){top:8%;inset-inline-end:2%;animation-delay:-1s}
.uc-chip:nth-child(3){bottom:16%;inset-inline-start:-2%;animation-delay:-3s}
.uc-chip:nth-child(4){bottom:2%;inset-inline-end:8%;animation-delay:-5s}
@keyframes ucChip{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@media(max-width:980px){.uc-chip{display:none}}

/* --------------------------------------------------------- counters */
.uc-stats{display:grid;grid-template-columns:repeat(3,1fr);margin-top:48px;border-top:1px solid var(--line)}
.uc-stats > div{padding:22px 8px 0;text-align:center;position:relative}
.uc-stats > div + div::before{content:"";position:absolute;inset-inline-start:0;top:26px;bottom:0;width:1px;background:var(--line)}
.uc-stats b{display:block;font-family:var(--font-mono,monospace);font-size:clamp(1.6rem,3.6vw,2.1rem);line-height:1;font-weight:500}
.uc-stats span{display:block;margin-top:7px;font-size:.74rem;color:var(--muted-2,var(--muted))}

/* ---------------------------------------------------------- marquee */
.uc-marquee{
  position:relative;border-block:1px solid var(--line);padding:16px 0;overflow:hidden;
  background:rgba(255,255,255,.012);
  mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);
}
.uc-marquee__track{display:flex;gap:46px;width:max-content;animation:ucScroll 40s linear infinite}
.uc-marquee:hover .uc-marquee__track{animation-play-state:paused}
.uc-marquee span{
  display:flex;align-items:center;gap:12px;white-space:nowrap;
  font-family:var(--font-mono,monospace);font-size:.74rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--muted-2,var(--muted));
}
.uc-marquee span::before{content:"";width:5px;height:5px;border-radius:50%;
  background:color-mix(in srgb,var(--lime) 60%,transparent)}
@keyframes ucScroll{to{transform:translateX(50%)}}

/* --------------------------------------------------------- sections */
.uc-sec{position:relative;padding:var(--section-pad,100px) 0}
.uc-eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-mono,monospace);font-size:.68rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--lime);margin-bottom:14px;
}
.uc-eyebrow::before{content:"";width:24px;height:1px;background:linear-gradient(90deg,var(--lime),transparent)}
.uc-sec h2{font-size:clamp(1.8rem,3.6vw,2.8rem);line-height:1.15}
.uc-sec .sub{margin-top:16px;color:var(--muted);max-width:56ch}

/* ------------------------------------------------------------- tilt */
.uc-tilt{
  transform-style:preserve-3d;
  transition:transform .25s var(--ease,ease),border-color .4s,box-shadow .4s;
  position:relative;overflow:hidden;
}
.uc-tilt::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .4s;
  background:radial-gradient(420px circle at var(--cx,50%) var(--cy,0%),
             color-mix(in srgb,var(--lime) 12%,transparent),transparent 45%);
}
.uc-tilt:hover::before{opacity:1}
.uc-tilt:hover{border-color:color-mix(in srgb,var(--lime) 32%,transparent)}

/* --------------------------------------------------------- magnetic */
.uc-magnetic{will-change:transform}

/* ------------------------------------------------------- link arrow */
.uc-link{display:inline-flex;align-items:center;gap:8px;color:var(--lime);font-size:.9rem}
.uc-link svg{transition:transform .35s var(--ease,ease)}
.uc-link:hover svg{transform:translateX(-5px)}
[dir="ltr"] .uc-link:hover svg{transform:translateX(5px)}

/* -------------------------------------------------- reveal (new set) */
.uc-reveal{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease,ease),transform .8s var(--ease,ease)}
.uc-reveal.in{opacity:1;transform:none}

/* ----------------------------------------------------- glow divider */
.uc-glow-line{
  height:1px;width:100%;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--lime) 40%,transparent),transparent);
}

@media (prefers-reduced-motion: reduce){
  #u0c-canvas,.aurora,.uc-grain{display:none}
  .uc-reveal{opacity:1;transform:none}
  .uc-orb,.uc-chip,.uc-marquee__track{animation:none}
}

/* ---------------------------------------------------- media library */
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.media-item{margin:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:rgba(255,255,255,.02)}
.media-thumb{aspect-ratio:4/3;background:#0A0F1A;overflow:hidden;position:relative;display:grid;place-items:center}
.media-thumb img,.media-thumb video{width:100%;height:100%;object-fit:cover}
.media-badge{position:absolute;inset-inline-start:8px;top:8px;background:rgba(0,0,0,.65);color:var(--lime);
  border-radius:999px;padding:2px 9px;font-size:.7rem}
.media-item figcaption{padding:10px}
video.video-local{width:100%;height:100%;object-fit:contain;background:#000}
.track-cover{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:12px;border:1px solid var(--line);margin-bottom:18px}
/* ------------------------------------------------------- announcement */
.uc-banner{
  position:relative; z-index:60; text-align:center;
  padding:9px 20px; font-size:.84rem; font-weight:500;
  color:#04121C; background:linear-gradient(90deg,var(--lime),#9BE87A 55%,var(--lime));
  background-size:200% 100%; animation:ucShimmer 6s linear infinite;
}
/* -------------------------------------------------------------- flags */
.flag{
  display:inline-block;vertical-align:middle;border-radius:6px;
  border:1px solid var(--line-2);object-fit:cover;background:#fff;
  box-shadow:0 4px 14px -6px rgba(0,0,0,.55);
}
.flag--lg{width:56px;height:auto;border-radius:8px}
.flag--md{width:32px;height:auto}
.flag--sm{width:22px;height:auto}
/* ------------------------------------------------------ pricing page */
.billing-toggle{display:inline-flex;gap:4px;padding:4px;border-radius:999px;
  border:1px solid var(--line-2);background:rgba(255,255,255,.03);margin-top:22px}
.billing-toggle button{position:relative;border:0;background:none;color:var(--muted);
  padding:9px 20px;border-radius:999px;font:inherit;font-size:.86rem;cursor:pointer;transition:.25s}
.billing-toggle button.is-active{background:var(--lime);color:#04121C;font-weight:600}
.billing-toggle .save{font-size:.64rem;background:rgba(0,0,0,.18);padding:2px 6px;border-radius:999px;margin-inline-start:6px}

.plan-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}
@media(max-width:1100px){.plan-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.plan-grid{grid-template-columns:1fr}}

.plan{position:relative;display:flex;flex-direction:column;gap:12px;padding:28px 24px;
  border:1px solid var(--line);border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012))}
.plan--hot{border-color:rgba(52,211,153,.5);background:
  radial-gradient(120% 90% at 50% 0%,rgba(52,211,153,.14),transparent 60%),
  linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));
  box-shadow:0 30px 80px -50px rgba(52,211,153,.8);transform:translateY(-6px)}
/* keep the highlighted card's -6px lift: .uc-reveal.in{transform:none} (0,2,0)
   would otherwise cancel .plan--hot's transform (0,1,0) once the card is revealed */
.plan--hot.uc-reveal.in{transform:translateY(-6px)}
.plan__tag{font-family:var(--font-mono);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted-2)}
.plan__ribbon{position:absolute;top:-11px;inset-inline-start:22px;background:var(--lime);color:#04121C;
  font-size:.66rem;font-weight:700;padding:4px 12px;border-radius:999px}
.plan h3{font-size:1.15rem;margin-top:4px}
.plan__blurb{color:var(--muted);font-size:.82rem;min-height:2.6em}
.plan__price{display:flex;align-items:baseline;gap:8px;margin:6px 0}
.plan__price b{font-family:var(--font-mono);font-size:2.2rem;font-weight:600;line-height:1}
.plan__price span{color:var(--muted-2);font-size:.75rem}
.plan__list{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:9px;font-size:.84rem}
.plan__list li{display:flex;gap:9px;align-items:flex-start;color:var(--text)}
.plan__list li .yes{color:var(--lime);font-weight:700}
.plan__list li.is-off{color:var(--muted-2);text-decoration:line-through}
.plan__list li.is-off span{color:var(--rose)}

.compare th.is-hot{color:var(--lime)}
.compare td.mono{text-align:center;font-size:.82rem}
.compare td.is-off{color:var(--muted-2)}
/* light theme — pricing (white-on-ivory washes out the dark-theme translucent surfaces) */
html[data-theme="light"] .billing-toggle{background:rgba(23,19,12,.05)}
html[data-theme="light"] .billing-toggle button.is-active{color:#fff}
html[data-theme="light"] .plan{
  background:#fff;border-color:var(--line);
  box-shadow:0 1px 2px rgba(23,19,12,.04), 0 18px 40px -30px rgba(23,19,12,.18)}
html[data-theme="light"] .plan--hot{
  border-color:rgba(4,120,87,.5);
  background:radial-gradient(120% 90% at 50% 0%,rgba(4,120,87,.06),transparent 60%),#fff;
  box-shadow:0 1px 2px rgba(23,19,12,.04), 0 30px 80px -50px rgba(4,120,87,.45)}
html[data-theme="light"] .plan__ribbon{color:#fff}
/* -------------------------------------------------- email composer */
.email-combo__row{display:flex;align-items:center;gap:0;border:1px solid var(--line-2);
  border-radius:10px;background:rgba(255,255,255,.035);padding:0 12px;transition:border-color .25s,box-shadow .25s,background .25s}
.email-combo__row:focus-within{border-color:var(--lime);box-shadow:0 0 0 4px rgba(52,211,153,.10)}
.email-combo__row input{border:0;background:none;outline:none;flex:1;min-width:0;
  min-height:46px;padding:0;color:var(--text);font:inherit;direction:ltr}
.email-combo__row select{border:0;background:none;outline:none;color:var(--muted);
  font:inherit;font-size:.9rem;direction:ltr;padding:0 4px;cursor:pointer;min-height:46px}
.email-combo__row select option{background:#0D1522;color:#EAF2FF}
.email-combo__at{color:var(--muted-2);margin-inline:2px;font-family:var(--font-mono)}
.email-combo__check{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;
  background:rgba(52,211,153,.15);color:#34D399;opacity:0;transition:opacity .25s,transform .25s;transform:scale(.8)}
.email-combo.is-valid .email-combo__check{opacity:1;transform:scale(1)}
.email-combo.is-valid .email-combo__row{border-color:rgba(52,211,153,.75);
  box-shadow:0 0 0 4px rgba(52,211,153,.12), 0 0 22px -6px rgba(52,211,153,.55);background:rgba(52,211,153,.04)}
html[data-theme="light"] .email-combo__row select option{background:#fff;color:#17130C}
/* =============================================== global FX layer */
.fx-ripple{
  position:fixed;width:16px;height:16px;border-radius:50%;pointer-events:none;z-index:9990;
  border:2px solid var(--lime);transform:translate(-50%,-50%) scale(0);
  box-shadow:0 0 22px var(--lime);animation:fxRipple .7s cubic-bezier(.2,.7,.3,1) forwards;
}
@keyframes fxRipple{
  0%{transform:translate(-50%,-50%) scale(.2);opacity:.9}
  100%{transform:translate(-50%,-50%) scale(8);opacity:0}
}

.fx-spark{
  position:fixed;width:5px;height:5px;border-radius:50%;pointer-events:none;z-index:9991;
  background:var(--lime);transform:translate(-50%,-50%);
  box-shadow:0 0 10px var(--lime);animation:fxSpark .65s cubic-bezier(.2,.7,.3,1) forwards;
}
@keyframes fxSpark{
  0%{transform:translate(-50%,-50%) scale(1);opacity:1}
  100%{transform:translate(calc(-50% + var(--dx,0px)), calc(-50% + var(--dy,0px))) scale(0);opacity:0}
}

.fx-pop{animation:fxPop .55s cubic-bezier(.2,1.5,.4,1)}
@keyframes fxPop{
  0%{transform:scale(1)}
  35%{transform:scale(1.04)}
  100%{transform:scale(1)}
}

/* hover glow for cards (pointer position driven) */
.card,.plan,.stat,.chart-card{position:relative;overflow:hidden}
.card::after,.plan::after,.stat::after,.chart-card::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  opacity:0;transition:opacity .35s;
  background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%),
             rgba(52,211,153,.14), transparent 62%);
}
.card:hover::after,.plan:hover::after,.stat:hover::after,.chart-card:hover::after{opacity:1}

/* buttons get a permanent subtle sheen */
.btn-primary{position:relative;overflow:hidden}
.btn-primary::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.35) 50%,transparent 60%);
  transform:translateX(-120%);transition:transform .6s ease;
}
.btn-primary:hover::after{transform:translateX(120%)}

@media (prefers-reduced-motion: reduce){
  .fx-ripple,.fx-spark{display:none}
}
/* ================================================= content pages */
.page-hero{padding:70px 0 30px;position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.page-hero::before{content:"";position:absolute;inset:-40% -10% auto auto;width:620px;height:620px;
  background:radial-gradient(circle,rgba(52,211,153,.16),transparent 62%);pointer-events:none}
.page-hero__grid{display:grid;grid-template-columns:1.25fr .75fr;gap:40px;align-items:center;position:relative;z-index:1}
@media(max-width:860px){.page-hero__grid{grid-template-columns:1fr}.page-hero__art{display:none}}
.page-hero h1{font-size:clamp(2rem,4.6vw,3.2rem);line-height:1.1}
.page-hero__meta{margin-top:12px;font-size:.78rem;color:var(--muted-2);font-family:var(--font-mono)}
.page-hero__art svg{width:100%;max-width:340px;display:block;margin-inline:auto}

.page-grid{display:grid;grid-template-columns:1fr 300px;gap:44px;align-items:start}
@media(max-width:980px){.page-grid{grid-template-columns:1fr}}
.page-side{position:sticky;top:100px}
@media(max-width:980px){.page-side{position:static}}

.toc{display:grid;gap:2px}
.toc a{display:block;padding:7px 10px;border-radius:8px;font-size:.84rem;color:var(--muted);
  border-inline-start:2px solid transparent;transition:.2s}
.toc a:hover{color:var(--text);background:rgba(255,255,255,.04);border-inline-start-color:var(--lime)}

/* rich typography */
.prose{max-width:70ch;font-size:1.02rem;line-height:1.95;color:rgba(234,242,255,.82)}
.prose > h1:first-child{display:none}
.prose h1,.prose h2,.prose h3{color:var(--text);font-family:var(--font-display);line-height:1.25;letter-spacing:-.01em}
.prose h1{font-size:1.9rem;margin:38px 0 14px}
.prose h2{font-size:1.45rem;margin:44px 0 14px;padding-top:10px;position:relative}
.prose h2::before{content:"";position:absolute;top:-14px;inset-inline-start:0;width:38px;height:3px;
  border-radius:2px;background:linear-gradient(90deg,var(--lime),#FACC15)}
.prose h3{font-size:1.12rem;margin:26px 0 8px;color:var(--lime)}
.prose p{margin:0 0 16px}
.prose strong{color:var(--text);font-weight:600}
.prose em{color:var(--lime);font-style:normal}
.prose a{color:var(--lime);text-decoration:underline;text-underline-offset:3px}
.prose ul,.prose ol{margin:0 0 20px;padding-inline-start:22px;display:grid;gap:8px}
.prose li::marker{color:var(--lime)}
.prose blockquote{margin:24px 0;padding:16px 20px;border-radius:12px;color:var(--text);
  border:1px solid var(--line);border-inline-start:3px solid var(--lime);
  background:linear-gradient(180deg,rgba(52,211,153,.07),rgba(255,255,255,.01))}
.prose code{font-family:var(--font-mono);font-size:.86em;background:rgba(52,211,153,.12);
  color:var(--lime);padding:2px 7px;border-radius:6px}
.prose pre.code{background:#0A0F1A;border:1px solid var(--line);border-radius:12px;padding:18px;
  overflow:auto;direction:ltr;text-align:left;margin:0 0 20px}
.prose pre.code code{background:none;color:#A7F3D0;padding:0}
.prose img{width:100%;border-radius:14px;border:1px solid var(--line);margin:22px 0;display:block}
.prose hr{border:0;height:1px;margin:34px 0;background:var(--line)}
.prose table{width:100%;border-collapse:collapse;margin:0 0 22px;font-size:.9rem}
.prose th{text-align:start;padding:10px 12px;border-bottom:1px solid var(--line-2);color:var(--muted-2);font-size:.75rem;text-transform:uppercase;letter-spacing:.08em}
.prose td{padding:10px 12px;border-bottom:1px solid var(--line)}

html[data-theme="light"] .prose{color:rgba(23,19,12,.78)}
html[data-theme="light"] .prose h1,html[data-theme="light"] .prose h2,html[data-theme="light"] .prose h3{color:#17130C}
html[data-theme="light"] .prose h3{color:#047857}
/* ============================================ page section cards */
.page-blocks{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:34px}
@media(max-width:860px){.page-blocks{grid-template-columns:1fr}}
.page-block{padding:26px 24px;position:relative;overflow:hidden}
.page-block__num{position:absolute;top:16px;inset-inline-end:18px;font-family:var(--font-mono);
  font-size:.7rem;letter-spacing:.2em;color:var(--muted-2)}
.page-block h3{font-family:var(--font-display);font-size:1.08rem;font-weight:700;margin:0 0 12px;
  padding-inline-start:12px;position:relative;color:var(--text)}
.page-block h3::before{content:"";position:absolute;inset-inline-start:0;top:6px;bottom:6px;width:3px;
  border-radius:2px;background:linear-gradient(180deg,var(--lime),#FACC15)}
.prose--sm{font-size:.92rem;line-height:1.85;color:var(--muted);max-width:none}
.prose--sm p{margin:0 0 10px}
.prose--sm p:last-child{margin-bottom:0}
.prose--sm ul,.prose--sm ol{gap:6px;margin-bottom:0}
.prose--sm strong{color:var(--text)}
.prose--sm li::marker{color:var(--lime)}
/* ================================================ page-wide effects */
@keyframes pageIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
main{animation:pageIn .55s cubic-bezier(.2,.7,.3,1) both}

/* staggered cards */
.fx-stagger{opacity:0;transform:translateY(18px)}
.fx-stagger.fx-show{
  opacity:1;transform:none;
  transition:opacity .6s cubic-bezier(.2,.7,.3,1), transform .6s cubic-bezier(.2,.7,.3,1);
}

/* animated gradient border on hover */
.card,.plan,.page-block,.stat,.chart-card{
  position:relative;
}
.card::before,.plan::before,.page-block::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;
  background:linear-gradient(130deg,rgba(52,211,153,.55),transparent 35%,transparent 65%,rgba(244,114,182,.4));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .45s;
}
.card:hover::before,.plan:hover::before,.page-block:hover::before{opacity:1}

/* heading sweep */
.prose h2,.uc-sec h2,.section-head h2{
  background-image:linear-gradient(90deg,var(--text) 0%,var(--text) 55%,var(--lime) 100%);
  background-size:220% 100%;background-position:0 0;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  transition:background-position .9s cubic-bezier(.2,.7,.3,1);
}
.prose h2:hover,.uc-sec h2:hover,.section-head h2:hover{background-position:100% 0}

/* link underline slide */
.prose a,.foot-col a{position:relative}
.prose a::after{
  content:"";position:absolute;inset-inline:0;bottom:-2px;height:1px;
  background:linear-gradient(90deg,var(--lime),#FACC15);
  transform:scaleX(0);transform-origin:var(--uo,right);transition:transform .35s cubic-bezier(.2,.7,.3,1);
}
.prose a:hover::after{transform:scaleX(1)}

/* image zoom */
.prose img{transition:transform .6s cubic-bezier(.2,.7,.3,1),box-shadow .6s}
.prose img:hover{transform:scale(1.02);box-shadow:0 30px 70px -40px rgba(52,211,153,.55)}

/* list stagger */
.prose li{transition:transform .3s,color .3s}
.prose li:hover{transform:translateX(-4px);color:var(--text)}

/* section divider glow */
.prose h2::after{
  content:"";display:block;height:1px;margin-top:14px;
  background:linear-gradient(90deg,rgba(52,211,153,.5),rgba(244,114,182,.3),transparent);
}

/* buttons pulse on hover */
.btn-primary:hover{animation:btnPulse 1.6s ease-in-out infinite}
@keyframes btnPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(52,211,153,.45)}
  50%{box-shadow:0 0 0 8px rgba(52,211,153,0)}
}

/* light theme tweaks */
html[data-theme="light"] .prose h2,
html[data-theme="light"] .uc-sec h2,
html[data-theme="light"] .section-head h2{
  background-image:linear-gradient(90deg,#17130C 0%,#17130C 55%,#047857 100%);
}
/* --------------------------------------------------- user chip */
.user-chip{
  display:inline-flex;align-items:center;gap:9px;padding:5px 12px 5px 8px;
  border:1px solid var(--line-2);border-radius:999px;text-decoration:none;
  background:rgba(255,255,255,.03);transition:.25s;max-width:230px;
}
.user-chip:hover{border-color:rgba(52,211,153,.55);background:rgba(52,211,153,.07);
  box-shadow:0 0 0 3px rgba(52,211,153,.08)}
.user-chip img{width:22px;border-radius:5px;flex:0 0 auto}
.user-chip__meta{display:grid;line-height:1.15;min-width:0}
.user-chip__name{font-size:.8rem;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-chip__handle{font-family:var(--font-mono);font-size:.66rem;color:var(--muted-2);direction:ltr}
@media(max-width:640px){.user-chip__meta{display:none}}
/* --------------------------------------------------- user dropdown */
.user-menu{position:relative}
.user-chip{border:1px solid var(--line-2);cursor:pointer;font:inherit}
.user-drop{
  position:absolute;top:calc(100% + 12px);inset-inline-end:0;width:262px;z-index:95;
  padding:8px;border-radius:16px;border:1px solid var(--line-2);
  background:rgba(10,12,16,.97);backdrop-filter:blur(16px);
  box-shadow:0 40px 90px -40px rgba(4,18,14,.95);
  opacity:0;transform:translateY(-8px) scale(.97);pointer-events:none;
  transition:opacity .2s,transform .25s cubic-bezier(.2,.8,.3,1.1);
}
.user-drop.is-open{opacity:1;transform:none;pointer-events:auto}
.user-drop__head{display:flex;gap:10px;align-items:center;padding:10px;border-radius:12px;
  background:linear-gradient(180deg,rgba(52,211,153,.10),rgba(255,255,255,.02));margin-bottom:6px}
.user-drop__name{font-size:.86rem;color:var(--text)}
.user-drop__mail{font-size:.7rem;color:var(--muted-2);direction:ltr}
.user-drop a,.user-drop__out{
  display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-radius:10px;
  background:none;color:var(--muted);font:inherit;font-size:.84rem;cursor:pointer;text-align:start;
  transition:.18s;
}
.user-drop a:hover,.user-drop__out:hover{background:rgba(52,211,153,.10);color:var(--text)}
.user-drop__out:hover{background:rgba(250,204,21,.12);color:#FDE68A}
.user-drop__sep{height:1px;margin:6px 8px;background:var(--line)}
html[data-theme="light"] .user-drop{background:rgba(255,255,255,.98)}
/* ================================================ student dashboard */
.dash-hero{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:24px;
  padding:30px 28px;margin-bottom:22px;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.012))}
.dash-hero__glow{position:absolute;inset:-40% -10% auto auto;width:520px;height:520px;pointer-events:none;
  background:radial-gradient(circle,rgba(52,211,153,.18),transparent 62%)}
.dash-hero__rings{position:absolute;inset:0;pointer-events:none}
.dash-hero__rings i{position:absolute;border-radius:50%;border:1px solid rgba(52,211,153,.18)}
.dash-hero__rings i:nth-child(1){width:300px;height:300px;inset-inline-end:-60px;top:-90px;animation:dashSpin 26s linear infinite}
.dash-hero__rings i:nth-child(2){width:420px;height:420px;inset-inline-end:-120px;top:-150px;border-color:rgba(244,114,182,.14);animation:dashSpin 40s linear infinite reverse}
.dash-hero__rings i:nth-child(3){width:520px;height:520px;inset-inline-end:-170px;top:-210px;border-style:dashed;animation:dashSpin 60s linear infinite}
@keyframes dashSpin{to{transform:rotate(360deg)}}

.dash-hero__body{position:relative;z-index:1;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center}
.dash-hero__title{font-size:clamp(1.5rem,3vw,2.1rem);line-height:1.15;margin-top:6px}
.dash-hero__title .grad{background:linear-gradient(100deg,#A7F3D0,var(--lime) 45%,#F472B6);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.dash-hero__actions{display:flex;gap:8px;flex-wrap:wrap}

.dash-hero__stats{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);
  gap:12px;margin-top:24px}
.dstat{display:flex;flex-direction:column;gap:4px;padding:16px;border-radius:16px;
  border:1px solid var(--line);background:rgba(255,255,255,.03);transition:.3s}
.dstat:hover{border-color:rgba(52,211,153,.5);transform:translateY(-2px);
  box-shadow:0 20px 44px -30px rgba(52,211,153,.8)}
.dstat__ico{font-size:1.1rem}
.dstat b{font-family:var(--font-mono);font-size:1.7rem;line-height:1;color:var(--text)}
.dstat span{font-size:.7rem;color:var(--muted-2)}
.dstat--hot b{color:#FDE68A}

.continue-card{position:relative;overflow:hidden;display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  padding:22px 24px;border-radius:20px;border:1px solid rgba(52,211,153,.35);
  background:linear-gradient(110deg,rgba(52,211,153,.12),rgba(244,114,182,.07) 70%,transparent)}
.continue-card__art{flex:0 0 auto;width:84px}
.continue-card__art svg{width:84px;height:84px}
.continue-card__body{flex:1;min-width:180px}
.continue-card h2{font-size:1.08rem;margin-top:4px}

.track-card{display:flex;gap:16px;align-items:center}
.track-card__ring{position:relative;flex:0 0 auto;width:58px;height:58px;display:grid;place-items:center}
.track-card__ring .progress-ring{width:58px;height:58px;position:absolute;inset:0}
.track-card__pct{font-family:var(--font-mono);font-size:.72rem;color:var(--lime)}
.track-card__bar{height:4px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;margin-top:10px}
.track-card__bar i{display:block;height:100%;border-radius:99px;
  background:linear-gradient(90deg,var(--lime),#FACC15);transition:width .8s cubic-bezier(.2,.8,.3,1)}

.quick-link{display:flex;align-items:center;gap:10px;padding:16px 18px;text-decoration:none;
  color:var(--muted);font-size:.86rem;transition:.3s}
.quick-link:hover{color:var(--text);transform:translateY(-3px);
  border-color:rgba(52,211,153,.45);box-shadow:0 24px 50px -34px rgba(52,211,153,.9)}
.quick-link__ico{font-size:1.05rem}
.quick-link__arrow{margin-inline-start:auto;color:var(--lime);transition:transform .3s}
.quick-link:hover .quick-link__arrow{transform:translateX(-4px)}

@media(max-width:640px){.dash-hero__stats{grid-template-columns:1fr 1fr}}
/* ---------------------------------------------------- avatar picker */
.avatar-picker{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-top:8px}
@media(max-width:560px){.avatar-picker{grid-template-columns:repeat(4,1fr)}}
.avatar-option{position:relative;cursor:pointer}
.avatar-option input{position:absolute;opacity:0;pointer-events:none}
.avatar-option__face{
  display:grid;place-items:center;aspect-ratio:1;border-radius:50%;
  font-family:var(--font-display);font-weight:800;font-size:1rem;color:#04121A;
  border:2px solid transparent;transition:.25s;transform:translateZ(0);
}
.avatar-option__face[data-a="1"]{background:linear-gradient(135deg,#34D399,#047857)}
.avatar-option__face[data-a="2"]{background:linear-gradient(135deg,#FACC15,#7A1049);color:#FFF}
.avatar-option__face[data-a="3"]{background:linear-gradient(135deg,#A7F3D0,#FDE68A)}
.avatar-option__face[data-a="4"]{background:linear-gradient(135deg,#34D399,#047857)}
.avatar-option__face[data-a="5"]{background:linear-gradient(135deg,#F5A524,#FACC15)}
.avatar-option__face[data-a="6"]{background:linear-gradient(135deg,#A78BFA,#34D399)}
.avatar-option__face[data-a="7"]{background:linear-gradient(135deg,#FB7185,#7C2D12);color:#FFF}
.avatar-option__face[data-a="8"]{background:linear-gradient(135deg,#34D399,#A78BFA)}
.avatar-option__face[data-a="9"]{background:linear-gradient(135deg,#0EA5E9,#22C55E)}
.avatar-option__face[data-a="10"]{background:linear-gradient(135deg,#F472B6,#FBBF24)}
.avatar-option__face[data-a="11"]{background:linear-gradient(135deg,#94A3B8,#1E293B);color:#FFF}
.avatar-option__face[data-a="12"]{background:linear-gradient(135deg,#FACC15,#34D399);color:#FFF}
.avatar-option:hover .avatar-option__face{transform:translateY(-3px) scale(1.06)}
.avatar-option input:checked + .avatar-option__face{
  border-color:#34D399;transform:scale(1.08);
  box-shadow:0 0 0 4px rgba(52,211,153,.22), 0 14px 30px -16px rgba(52,211,153,.9);
}
/* ------------------------------------------------------- wallet */
.wallet-hero{position:relative;overflow:hidden;display:flex;justify-content:space-between;
  align-items:center;gap:18px;flex-wrap:wrap;padding:28px;border-radius:22px;
  border:1px solid rgba(52,211,153,.35);
  background:linear-gradient(115deg,rgba(52,211,153,.13),rgba(250,204,21,.08) 65%,transparent)}
.wallet-hero__glow{position:absolute;inset:-60% -10% auto auto;width:420px;height:420px;
  background:radial-gradient(circle,rgba(52,211,153,.22),transparent 62%);pointer-events:none}
.wallet-balance{display:flex;align-items:baseline;gap:8px;margin-top:10px}
.wallet-balance b{font-family:var(--font-mono);font-size:clamp(2rem,5vw,3rem);line-height:1;
  background:linear-gradient(100deg,#A7F3D0,#34D399 45%,#FACC15);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.wallet-balance span{color:var(--muted-2);font-size:.9rem}
.quick-amounts{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.quick-amount{border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--muted);
  border-radius:999px;padding:7px 16px;font:inherit;font-size:.8rem;cursor:pointer;transition:.2s}
.quick-amount:hover{border-color:rgba(52,211,153,.6);color:var(--text);background:rgba(52,211,153,.1)}
/* ================================================= banking */
.wallet-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.wchip{font-family:var(--font-mono);font-size:.72rem;padding:4px 10px;border-radius:999px;border:1px solid}
.wchip--in{color:#A7F3D0;border-color:rgba(52,211,153,.5);background:rgba(52,211,153,.10)}
.wchip--out{color:#FDE68A;border-color:rgba(250,204,21,.5);background:rgba(250,204,21,.10)}
.wchip--hold{color:#FBBF24;border-color:rgba(251,191,36,.5);background:rgba(251,191,36,.10)}
.bank-title{font-size:.95rem;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.bank-title--in{color:#A7F3D0}
.bank-title--out{color:#FDE68A}
.tx-type{display:inline-flex;align-items:center;gap:5px;font-size:.78rem}
.tx-type.is-in{color:#A7F3D0}
.tx-type.is-out{color:#FDE68A}
.tx-amount{font-weight:600}
.tx-amount.is-in{color:#A7F3D0;text-shadow:0 0 14px rgba(52,211,153,.45)}
.tx-amount.is-out{color:#FDE68A;text-shadow:0 0 14px rgba(250,204,21,.4)}

.fin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:900px){.fin-stats{grid-template-columns:repeat(2,1fr)}}
.fin-stat{padding:16px 18px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
.fin-stat span{display:block;font-size:.72rem;color:var(--muted-2)}
.fin-stat b{display:block;font-family:var(--font-mono);font-size:1.4rem;margin-top:6px;color:var(--text)}
.fin-stat--in{border-color:rgba(52,211,153,.4);background:linear-gradient(180deg,rgba(52,211,153,.10),transparent)}
.fin-stat--in b{color:#A7F3D0}
.fin-stat--out{border-color:rgba(250,204,21,.38);background:linear-gradient(180deg,rgba(250,204,21,.09),transparent)}
.fin-stat--out b{color:#FDE68A}
.fin-stat--hold{border-color:rgba(251,191,36,.35)}
.fin-stat--hold b{color:#FBBF24}
.fin-chart{width:100%;height:150px;margin-top:6px}
.top-balance{display:flex;align-items:center;gap:10px;margin-bottom:9px;font-size:.78rem}
.top-balance__name{flex:0 0 38%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}
.top-balance__bar{flex:1;height:5px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
.top-balance__bar i{display:block;height:100%;background:linear-gradient(90deg,#34D399,#FACC15);border-radius:99px}
.top-balance__val{font-family:var(--font-mono);color:var(--lime);font-size:.74rem}
/* -------------------------------------------------- header balance */
.balance-chip{
  display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:999px;
  border:1px solid rgba(52,211,153,.45);
  background:linear-gradient(135deg,rgba(52,211,153,.14),rgba(250,204,21,.08));
  text-decoration:none;transition:.3s;white-space:nowrap;
}
.balance-chip:hover{border-color:rgba(52,211,153,.85);
  box-shadow:0 0 0 4px rgba(52,211,153,.10), 0 10px 26px -14px rgba(52,211,153,.9);
  transform:translateY(-1px)}
.balance-chip__dot{width:6px;height:6px;border-radius:50%;background:#34D399;
  box-shadow:0 0 8px #34D399;animation:balPulse 2.4s ease-in-out infinite}
@keyframes balPulse{0%,100%{opacity:.5;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}
.balance-chip__val{font-family:var(--font-mono);font-size:.82rem;color:#A7F3D0;letter-spacing:.02em}
.balance-chip__cur{font-size:.62rem;color:var(--muted-2)}
@media(max-width:520px){.balance-chip__cur{display:none}}
/* ================================================== premium wallet */
.wallet-wrap{position:relative}
.money-rain{position:absolute;inset:-40px -30px auto;height:420px;overflow:hidden;pointer-events:none;z-index:0;
  mask-image:linear-gradient(to bottom,#000,transparent);-webkit-mask-image:linear-gradient(to bottom,#000,transparent)}
.money-rain i{position:absolute;top:-40px;left:var(--x);font-size:var(--s);font-family:var(--font-mono);
  color:rgba(52,211,153,.30);text-shadow:0 0 16px rgba(52,211,153,.5);
  animation:moneyFall var(--d) linear infinite;animation-delay:var(--delay)}
@keyframes moneyFall{
  0%{transform:translateY(-60px) rotate(0deg);opacity:0}
  12%{opacity:1}
  100%{transform:translateY(430px) rotate(220deg);opacity:0}
}

.w-hero{position:relative;z-index:1;display:grid;grid-template-columns:230px 1fr;gap:26px;align-items:center;
  padding:34px 32px;border-radius:26px;overflow:hidden;
  border:1px solid rgba(52,211,153,.35);
  background:linear-gradient(120deg,rgba(52,211,153,.13),rgba(250,204,21,.08) 60%,rgba(255,255,255,.02))}
@media(max-width:820px){.w-hero{grid-template-columns:1fr;text-align:center}}
.w-hero__glow{position:absolute;inset:-60% -10% auto auto;width:520px;height:520px;pointer-events:none;
  background:radial-gradient(circle,rgba(52,211,153,.25),transparent 62%);animation:wGlow 9s ease-in-out infinite}
@keyframes wGlow{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-30px,20px) scale(1.08)}}
.w-hero__art svg{width:100%;max-width:230px;display:block;margin-inline:auto;
  animation:wFloat 8s ease-in-out infinite;filter:drop-shadow(0 0 34px rgba(52,211,153,.35))}
@keyframes wFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

.w-total{display:flex;align-items:baseline;gap:10px;margin:8px 0 4px;flex-wrap:wrap}
.w-total__cur{font-family:var(--font-mono);font-size:.8rem;color:var(--muted-2);letter-spacing:.12em}
.w-total__num{font-family:var(--font-mono);font-size:clamp(2.4rem,6vw,4rem);line-height:1;font-weight:700;
  background:linear-gradient(100deg,#A7F3D0,#34D399 40%,#FACC15 100%);
  background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:wShine 7s linear infinite}
@keyframes wShine{to{background-position:200% 0}}
.w-hero__sub{color:var(--muted-2);font-size:.8rem}

.w-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.wchip{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:.74rem;
  padding:6px 12px;border-radius:999px;border:1px solid}
.wchip i{font-style:normal}
.wchip--in{color:#A7F3D0;border-color:rgba(52,211,153,.55);background:rgba(52,211,153,.12);
  box-shadow:0 0 24px -8px rgba(52,211,153,.8)}
.wchip--out{color:#FDE68A;border-color:rgba(250,204,21,.55);background:rgba(250,204,21,.12);
  box-shadow:0 0 24px -8px rgba(250,204,21,.8)}
.wchip--hold{color:#FBBF24;border-color:rgba(251,191,36,.5);background:rgba(251,191,36,.10)}

.w-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px;position:relative;z-index:1}
@media(max-width:900px){.w-actions{grid-template-columns:1fr}}
.w-box{padding:24px;border-radius:20px;border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.012));transition:.35s}
.w-box:hover{transform:translateY(-3px)}
.w-box--in:hover{border-color:rgba(52,211,153,.6);box-shadow:0 30px 60px -40px rgba(52,211,153,1)}
.w-box--out:hover{border-color:rgba(250,204,21,.6);box-shadow:0 30px 60px -40px rgba(250,204,21,1)}
.w-box__head{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.w-box__ico{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;font-size:1rem;
  background:rgba(52,211,153,.16);color:#A7F3D0;box-shadow:0 0 20px -6px rgba(52,211,153,.9)}
.w-box__ico--out{background:rgba(250,204,21,.16);color:#FDE68A;box-shadow:0 0 20px -6px rgba(250,204,21,.9)}
.w-box__ico--send{background:rgba(167,139,250,.16);color:#C4B5FD;box-shadow:0 0 20px -6px rgba(167,139,250,.9)}
.w-box h3{font-size:.95rem;margin:0}
.w-box .btn{width:100%}

.w-title{font-size:1.05rem;margin:30px 0 14px;position:relative;z-index:1}
.w-ledger{display:grid;gap:8px;position:relative;z-index:1}
.w-row{display:flex;align-items:center;gap:12px;padding:14px 18px;border-radius:14px;
  border:1px solid var(--line);background:rgba(255,255,255,.025);transition:.25s}
.w-row:hover{transform:translateX(-3px)}
.w-row--in{border-inline-start:3px solid #34D399;background:linear-gradient(90deg,rgba(52,211,153,.07),transparent)}
.w-row--out{border-inline-start:3px solid #FACC15;background:linear-gradient(90deg,rgba(250,204,21,.07),transparent)}
.w-row__ico{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:.8rem;flex:0 0 auto}
.w-row--in .w-row__ico{background:rgba(52,211,153,.15);color:#A7F3D0}
.w-row--out .w-row__ico{background:rgba(250,204,21,.15);color:#FDE68A}
.w-row__main{flex:1;min-width:0;display:grid}
.w-row__type{font-size:.86rem;color:var(--text)}
.w-row__meta{font-size:.68rem;color:var(--muted-2);font-family:var(--font-mono)}
.w-row__amount{font-family:var(--font-mono);font-size:.95rem;font-weight:600}
.w-row--in .w-row__amount{color:#A7F3D0;text-shadow:0 0 16px rgba(52,211,153,.5)}
.w-row--out .w-row__amount{color:#FDE68A;text-shadow:0 0 16px rgba(250,204,21,.45)}
.w-row__status{font-size:.64rem;padding:3px 9px;border-radius:999px;border:1px solid}
.w-row__status.is-ok{color:#A7F3D0;border-color:rgba(52,211,153,.45);background:rgba(52,211,153,.1)}
.w-row__status.is-no{color:#FDE68A;border-color:rgba(250,204,21,.45);background:rgba(250,204,21,.1)}
.w-row__status.is-hold{color:#FBBF24;border-color:rgba(251,191,36,.45);background:rgba(251,191,36,.1)}
.w-empty{text-align:center;padding:40px;color:var(--muted-2);border:1px dashed var(--line-2);border-radius:16px}
/* ================================================== receipt */
.receipt-wrap{max-width:760px;margin-inline:auto}
.receipt{position:relative;padding:34px 34px 26px;border-radius:22px;overflow:hidden;
  border:1px solid var(--line-2);
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015))}
.receipt::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background:radial-gradient(70% 50% at 50% 0%,rgba(52,211,153,.12),transparent 65%)}
.receipt.is-approved{border-color:rgba(52,211,153,.45)}
.receipt.is-rejected{border-color:rgba(250,204,21,.45)}
.receipt__head{display:flex;align-items:center;justify-content:space-between;gap:18px;position:relative;z-index:1}
.receipt__title{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-2);text-align:end}
.receipt__ref{font-family:var(--font-mono);font-size:.95rem;color:var(--lime);direction:ltr;text-align:end;margin-top:4px}
.receipt__stamp{width:96px;color:var(--lime);flex:0 0 auto}
.receipt.is-stamping .receipt__stamp{animation:stampIn .6s cubic-bezier(.2,1.4,.4,1)}
@keyframes stampIn{0%{transform:scale(2.2) rotate(-18deg);opacity:0}60%{transform:scale(.94) rotate(-8deg);opacity:1}100%{transform:scale(1) rotate(-10deg)}}
.receipt__stamp{transform:rotate(-10deg)}

.receipt__amount{display:flex;align-items:baseline;justify-content:center;gap:6px;margin:30px 0 4px;
  font-family:var(--font-mono);position:relative;z-index:1}
.receipt__sign{font-size:1.4rem;opacity:.7}
.receipt__amount b{font-size:clamp(2.2rem,6vw,3.4rem);line-height:1}
.receipt__amount.is-in b{color:#A7F3D0;text-shadow:0 0 26px rgba(52,211,153,.45)}
.receipt__amount.is-out b{color:#FDE68A;text-shadow:0 0 26px rgba(250,204,21,.4)}
.receipt__cur{font-size:.8rem;color:var(--muted-2)}
.receipt__type{text-align:center;color:var(--muted);font-size:.85rem}
.receipt__status{text-align:center;margin-top:14px}
.rstamp{display:inline-flex;align-items:center;gap:6px;font-size:.7rem;letter-spacing:.14em;
  text-transform:uppercase;padding:6px 14px;border-radius:999px;border:1.5px solid}
.rstamp--ok{color:#A7F3D0;border-color:rgba(52,211,153,.6);background:rgba(52,211,153,.10)}
.rstamp--hold{color:#FBBF24;border-color:rgba(251,191,36,.55);background:rgba(251,191,36,.1)}

.receipt__rows{margin:26px 0 0;position:relative;z-index:1}
.receipt__rows > div{display:flex;justify-content:space-between;gap:16px;padding:11px 0;
  border-bottom:1px dashed var(--line)}
.receipt__rows dt{color:var(--muted-2);font-size:.78rem}
.receipt__rows dd{margin:0;color:var(--text);font-size:.84rem;text-align:end}
.receipt__foot{margin-top:22px;text-align:center;color:var(--muted-2);font-size:.68rem;line-height:1.8;position:relative;z-index:1}
.receipt-actions{display:flex;gap:10px;justify-content:center;margin-top:18px}

@media print{
  body *{visibility:hidden}
  .receipt,.receipt *{visibility:visible}
  .receipt{position:absolute;inset:0;border:0;background:#fff;color:#0D1522}
  .receipt-actions{display:none}
}
/* --------------------------------------------- hero + heading readability (final) */
/* The h1 owns its base color per theme; ONLY .grad carries a gradient
   (background-clip:text) — scoped rules, no !important wars. */
.uc-hero h1, .uc-hero h1 span:not(.grad){color:#F4FBF7}
html[data-theme="light"] .uc-hero h1,
html[data-theme="light"] .uc-hero h1 span:not(.grad){color:#0C1F17}
:root{--glow:rgba(52,211,153,.28)}
.btn-primary{box-shadow:0 12px 34px -16px rgba(52,211,153,.85)}
/* ---------------------------------------- real avatar images */
.avatar-option__face{
  display:block;width:100%;aspect-ratio:1;border-radius:50%;object-fit:cover;
  border:2px solid transparent;background:rgba(52,211,153,.08);transition:.25s;
}
.avatar-option:hover .avatar-option__face{border-color:rgba(52,211,153,.55);transform:translateY(-3px) scale(1.05)}
.avatar-option input:checked + .avatar-option__face{
  border-color:#34D399;transform:scale(1.06);
  box-shadow:0 0 0 4px rgba(52,211,153,.22), 0 14px 30px -16px rgba(52,211,153,.9);
}
/* ---------------------------------------- compact avatar picker */
.avatar-select{position:relative}
.avatar-trigger{display:inline-flex;align-items:center;gap:10px;padding:6px 12px 6px 6px;
  border:1px solid var(--line-2);border-radius:999px;background:rgba(52,211,153,.06);
  color:var(--text);font:inherit;font-size:.82rem;cursor:pointer;transition:.25s}
.avatar-trigger:hover{border-color:rgba(52,211,153,.65);
  box-shadow:0 0 0 4px rgba(52,211,153,.10)}
.avatar-trigger__text{color:var(--muted)}
.avatar-trigger svg{opacity:.6;transition:transform .25s}
.avatar-trigger[aria-expanded="true"] svg{transform:rotate(180deg)}

.avatar-menu{position:absolute;top:calc(100% + 8px);inset-inline-start:0;z-index:80;
  display:grid;grid-template-columns:repeat(6,44px);gap:6px;padding:8px;border-radius:14px;
  border:1px solid var(--line-2);background:rgba(5,9,16,.98);
  box-shadow:0 30px 60px -30px rgba(0,0,0,.9);
  opacity:0;transform:translateY(-6px) scale(.97);pointer-events:none;
  transition:opacity .2s,transform .22s cubic-bezier(.2,.8,.3,1.1)}
.avatar-menu.is-open{opacity:1;transform:none;pointer-events:auto}
.avatar-mini{position:relative;cursor:pointer;display:block}
.avatar-mini input{position:absolute;opacity:0;pointer-events:none}
.avatar-mini img{width:44px;height:44px;border-radius:50%;display:block;object-fit:cover;
  border:2px solid transparent;background:rgba(52,211,153,.08);transition:.2s}
.avatar-mini:hover img{border-color:rgba(52,211,153,.55);transform:scale(1.06)}
.avatar-mini input:checked + img{border-color:#34D399;transform:scale(1.06);
  box-shadow:0 0 0 3px rgba(52,211,153,.22)}
html[data-theme="light"] .avatar-menu{background:#fff}
/* ---------------------------------------------- modern dropzone */
.dropzone{position:relative;overflow:hidden;display:flex;align-items:center;gap:14px;
  padding:18px 20px;border-radius:16px;cursor:pointer;
  border:1.5px dashed rgba(52,211,153,.45);background:rgba(52,211,153,.045);
  transition:.3s;outline:none}
.dropzone:hover,.dropzone:focus-visible{border-color:rgba(52,211,153,.9);
  background:rgba(52,211,153,.08);box-shadow:0 0 0 4px rgba(52,211,153,.10)}
.dropzone.is-dragging{border-color:#34D399;border-style:solid;
  background:rgba(52,211,153,.14);box-shadow:0 0 0 6px rgba(52,211,153,.14),0 20px 50px -30px rgba(52,211,153,.9)}
.dropzone.is-error{border-color:rgba(250,204,21,.8);background:rgba(250,204,21,.07)}
.dropzone__glow{position:absolute;inset:-60% auto auto -10%;width:260px;height:260px;pointer-events:none;
  background:radial-gradient(circle,rgba(52,211,153,.18),transparent 62%);
  opacity:0;transition:opacity .35s}
.dropzone:hover .dropzone__glow,.dropzone.is-dragging .dropzone__glow{opacity:1}
.dropzone__icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;flex:0 0 auto;
  background:rgba(52,211,153,.14);color:#34D399;
  box-shadow:0 0 22px -8px rgba(52,211,153,.9)}
.dropzone__body{display:grid;gap:2px;position:relative;z-index:1}
.dropzone__body b{font-size:.88rem;color:var(--text);font-weight:600}
.dropzone__body span{font-size:.76rem;color:var(--muted)}
.dropzone__body em{font-size:.64rem;color:var(--muted-2);font-style:normal;font-family:var(--font-mono);letter-spacing:.06em}
.dropzone__preview{display:flex;align-items:center;gap:10px;margin-inline-start:auto;position:relative;z-index:1}
.dropzone__preview img{width:52px;height:52px;border-radius:12px;object-fit:cover;
  border:1px solid rgba(52,211,153,.5)}
.dropzone__file{font-family:var(--font-mono);font-size:.62rem;color:var(--muted-2);max-width:130px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dropzone__remove{position:absolute;top:-6px;inset-inline-end:-6px;width:20px;height:20px;border-radius:50%;
  border:1px solid rgba(250,204,21,.6);background:#0A101A;color:#FACC15;font-size:.62rem;
  cursor:pointer;display:grid;place-items:center;line-height:1}
.dropzone__remove:hover{background:#FACC15;color:#0A0F1A}
.dropzone.has-file{border-style:solid;border-color:rgba(52,211,153,.7)}
.dropzone__preview[hidden]{display:none !important}
.dropzone__preview img[src=""]{display:none}
/* tidy the profile form into clean paired boxes */
form.card .grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
form.card .grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
form.card .grid-3 .field,form.card .grid-2 .field{margin-bottom:0}
@media(max-width:820px){
  form.card .grid-3,form.card .grid-2{grid-template-columns:1fr}
}
/* profile form: one clean column */
.profile-form .grid-3,
.profile-form .grid-2{display:block !important}
.profile-form .field{margin-bottom:16px}
.profile-form .field:last-of-type{margin-bottom:20px}
.profile-form .row{gap:10px}
/* force the profile form to a single vertical column */
form.profile-form,
form.profile-form .grid-2,
form.profile-form .grid-3{
  display:block !important;
  column-count:auto !important;
  flex-direction:column !important;
}
form.profile-form > div,
form.profile-form > .field,
form.profile-form .grid-2 > div,
form.profile-form .grid-3 > div{
  display:block !important;
  width:100% !important;
  float:none !important;
}
form.profile-form .field{margin-bottom:16px !important}
form.profile-form .row{display:flex !important;flex-wrap:wrap}

/* ====================== frontpage luxury pass ====================== */

/* stat numbers — gradient text + neon glow */
.uc-stats b{
  background:linear-gradient(100deg,#A7F3D0 0%,var(--lime,#34D399) 38%,#8A7DFF 70%,var(--rose,#F472B6) 100%);
  -webkit-background-clip:text;background-clip:text;
  color:transparent;
  filter:drop-shadow(0 0 12px var(--glow,rgba(52,211,153,.28)));
}

/* reverse marquee row */
.uc-marquee--rev{border-top:0}
.uc-marquee--rev .uc-marquee__track{animation-direction:reverse}

/* hero scroll cue */
.uc-hero{position:relative;z-index:0}
.uc-scroll-cue{
  position:absolute;bottom:22px;left:50%;transform:translateX(-50%);
  width:26px;height:42px;overflow:hidden;
  border:1px solid color-mix(in srgb,var(--lime,#34D399) 38%,transparent);
  border-radius:999px;z-index:2;display:block;
  box-shadow:0 0 0 1px rgba(0,0,0,.25),0 10px 30px -18px var(--glow,rgba(52,211,153,.40));
}
.uc-scroll-cue i{
  position:absolute;top:7px;left:50%;margin-left:-2px;width:4px;height:4px;border-radius:50%;
  background:var(--lime,#34D399);opacity:0;animation:ucCue 1.7s ease-in-out infinite;
}
.uc-scroll-cue i:nth-child(2){animation-delay:.55s}
@keyframes ucCue{
  0%{transform:translateY(0);opacity:0}
  25%{opacity:1}
  70%{opacity:.9}
  100%{transform:translateY(20px);opacity:0}
}

/* hero orb mouse parallax — JS feeds --px/--py in -0.5..0.5 */
.uc-orb-wrap{
  transform:translate3d(calc(var(--px,0) * 16px),calc(var(--py,0) * 14px),0);
  transition:transform .12s linear;
  will-change:transform;
}

/* FAQ — custom chevron + open animation */
#faq details summary{display:flex;align-items:center;justify-content:space-between;gap:18px;list-style:none}
#faq details summary::-webkit-details-marker{display:none}
#faq details summary::after{
  content:"+";flex:0 0 auto;
  font-family:var(--font-mono,monospace);font-size:1.2rem;font-weight:400;
  color:var(--lime,#34D399);
  transition:transform .3s var(--ease,ease),color .3s;
}
#faq details[open] summary::after{transform:rotate(45deg)}
@keyframes ucFaqIn{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:none}}
#faq details[open] p{animation:ucFaqIn .4s var(--ease,ease)}

@media (prefers-reduced-motion: reduce){
  .uc-marquee--rev .uc-marquee__track{animation:none}
  .uc-scroll-cue i{animation:none;opacity:.8}
  .uc-orb-wrap{transform:none;transition:none}
}

/* floating logo wall — frontpage live background */
.uc-float{
  position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;
  mask-image:radial-gradient(75% 90% at 30% 45%,transparent 18%,#000 65%);
  -webkit-mask-image:radial-gradient(75% 90% at 30% 45%,transparent 18%,#000 65%);
}
.uc-float__i{
  position:absolute;left:var(--fx,50%);top:var(--fy,50%);
  width:42px;height:42px;display:grid;place-items:center;
  border-radius:12px;
  background:rgba(5,7,12,.60);
  border:1px solid color-mix(in srgb,var(--lime,#34D399) 26%,transparent);
  color:var(--lime,#34D399);
  box-shadow:0 0 18px -8px var(--glow,rgba(52,211,153,.45)),inset 0 0 12px -6px var(--glow,rgba(52,211,153,.30));
  opacity:.55;
  animation:ucFloaty var(--fd,24s) ease-in-out infinite;
  animation-delay:var(--fdel,0s);
  will-change:transform;
}
.uc-float__i.m{
  border-color:color-mix(in srgb,var(--rose,#F472B6) 32%,transparent);
  color:var(--rose,#F472B6);
  box-shadow:0 0 18px -8px rgba(244,114,182,.50),inset 0 0 12px -6px rgba(244,114,182,.32);
}
.uc-float__i b{font-family:var(--font-mono,monospace);font-size:.64rem;letter-spacing:.10em;font-weight:500}
.uc-float__i svg{width:19px;height:19px;stroke-width:1.6}
.uc-float__i.x{animation-name:ucFloatyX}
@keyframes ucFloaty{
  0%,100%{transform:translate3d(0,0,0) rotate(-5deg)}
  50%{transform:translate3d(0,-18px,0) rotate(5deg)}
}
@keyframes ucFloatyX{
  0%,100%{transform:translate3d(0,0,0) rotate(3deg)}
  50%{transform:translate3d(16px,-8px,0) rotate(-3deg)}
}
@media (max-width:980px){.uc-float{display:none}}
@media (prefers-reduced-motion: reduce){.uc-float{display:none}}

/* ------------------------------------------- neon wave canvas (hero) */
.uc-wave{
  position:absolute;left:0;right:0;bottom:0;
  width:100%;height:300px;
  z-index:0;pointer-events:none;
}
.uc-hero>.wrap{position:relative;z-index:1}
@media (max-width:980px){.uc-wave{height:210px}}
@media (prefers-reduced-motion: reduce){.uc-wave{display:none}}

/* =============================================== NOVA — frontpage layer */

/* ---- intro boot sequence ---- */
#nxIntro{position:fixed;inset:0;z-index:180;pointer-events:none;background:#05070C;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:34px;
  animation:nxIntroHide .55s cubic-bezier(.5,0,.2,1) 1.35s forwards}
#nxIntro .nx-intro__mark{position:relative;display:grid;place-items:center;animation:nxMark 1s var(--ease,ease) both}
#nxIntro svg{width:120px;height:120px;display:block}
#nxIntro svg circle{fill:none;stroke:var(--lime,#34D399);stroke-width:2.5;stroke-linecap:round;
  stroke-dasharray:400;stroke-dashoffset:400;transform:rotate(-90deg);transform-origin:50% 50%;
  filter:drop-shadow(0 0 16px color-mix(in srgb,var(--lime,#34D399) 55%,transparent));
  animation:nxDraw 1s var(--ease,ease) .08s forwards}
#nxIntro b{position:absolute;font-family:var(--font-mono,monospace);font-weight:600;font-size:1.35rem;
  letter-spacing:.5em;text-indent:.5em;color:#F4FBF7;animation:nxWord .7s var(--ease,ease) .4s both}
#nxIntro .nx-intro__bar{width:180px;height:2px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
#nxIntro .nx-intro__bar i{display:block;height:100%;border-radius:inherit;
  background:linear-gradient(90deg,var(--lime,#34D399),#F472B6);
  transform:scaleX(0);transform-origin:left;animation:nxBar 1.2s var(--ease,ease) .12s forwards}
@keyframes nxIntroHide{to{opacity:0;visibility:hidden}}
@keyframes nxDraw{to{stroke-dashoffset:0}}
@keyframes nxWord{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
@keyframes nxBar{to{transform:scaleX(1)}}
@keyframes nxMark{from{opacity:0;transform:scale(.92)}}

/* ---- hero spotlight (cursor-follow glow) ---- */
.nx-spot{position:absolute;inset:0;z-index:0;pointer-events:none;mix-blend-mode:screen;opacity:.55;
  background:radial-gradient(360px circle at var(--sx,68%) var(--sy,30%),rgba(52,211,153,.15),transparent 64%)}

/* ---- rotating conic ring on the hero badge ---- */
.nx-badge{position:relative;isolation:isolate}
.nx-badge::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;padding:1px;
  background:conic-gradient(from 0deg,transparent 0 58%,color-mix(in srgb,var(--lime,#34D399) 80%,transparent) 74%,transparent 92%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  animation:nxRot 4.5s linear infinite}
@keyframes nxRot{to{transform:rotate(360deg)}}

/* ---- CTA shine sweep + click ripple ---- */
.nx-shine{position:relative;overflow:hidden}
.nx-shine::after{content:"";position:absolute;top:-30%;bottom:-30%;left:-45%;width:34%;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.26),transparent);
  transform:translateX(-170%) skewX(-18deg)}
.nx-shine:hover::after{animation:nxSweep .8s var(--ease,ease)}
@keyframes nxSweep{to{transform:translateX(560%) skewX(-18deg)}}
.nx-rip{position:absolute;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,color-mix(in srgb,var(--lime,#34D399) 45%,transparent),transparent 70%);
  transform:scale(0);opacity:.65;animation:nxRip .6s ease-out forwards}
@keyframes nxRip{to{transform:scale(1);opacity:0}}

/* ---- live category filter toolbar ---- */
.nx-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:28px}
.nx-chip{display:inline-flex;align-items:center;gap:8px;cursor:pointer;
  border:1px solid var(--line-2);background:rgba(255,255,255,.02);color:var(--muted);
  border-radius:999px;padding:8px 16px;font-size:.8rem;font-family:inherit;
  transition:color .25s,background .25s,border-color .25s,transform .25s,box-shadow .25s}
.nx-chip i{font-style:normal;font-family:var(--font-mono,monospace);font-size:.62rem;
  border:1px solid var(--line-2);border-radius:999px;padding:1px 7px;color:var(--muted-2,var(--muted))}
.nx-chip:hover{color:var(--text);border-color:color-mix(in srgb,var(--lime,#34D399) 45%,transparent);transform:translateY(-2px)}
.nx-chip.is-on{color:#04121C;background:var(--lime,#34D399);border-color:var(--lime,#34D399);font-weight:600;
  box-shadow:0 10px 30px -14px color-mix(in srgb,var(--lime,#34D399) 70%,transparent)}
.nx-chip.is-on i{color:#04121C;border-color:rgba(4,18,28,.35)}
.nx-count{margin-inline-start:auto;font-size:.74rem;color:var(--muted-2,var(--muted));letter-spacing:.1em;
  font-family:var(--font-mono,monospace);white-space:nowrap}
.nx-count b{color:var(--lime,#34D399);font-size:.98rem;font-weight:600}
@media (max-width:980px){.nx-count{width:100%;margin:6px 0 0}}

/* ---- nova cards (tracks / why / certify) ---- */
.nx-card{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;
  border-radius:20px;padding:22px;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.012));
  border:1px solid var(--line);
  transition:transform .4s var(--ease,ease),box-shadow .4s var(--ease,ease),border-color .4s var(--ease,ease)}
.nx-card:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--lime,#34D399) 32%,transparent);
  box-shadow:0 40px 90px -55px color-mix(in srgb,var(--lime,#34D399) 65%,transparent)}
.nx-beam{position:absolute;inset:0;border-radius:inherit;padding:1px;opacity:0;pointer-events:none;z-index:0;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  transition:opacity .45s var(--ease,ease);overflow:hidden}
.nx-beam i{position:absolute;inset:-120%;display:block;animation:nxRot 3.2s linear infinite;animation-play-state:paused;
  background:conic-gradient(transparent 0 76%,color-mix(in srgb,var(--lime,#34D399) 85%,transparent) 87%,color-mix(in srgb,var(--rose,#F472B6) 85%,transparent) 95%,transparent 100%)}
.nx-card:hover .nx-beam{opacity:1}
.nx-card:hover .nx-beam i{animation-play-state:running}
.nx-card__top{display:flex;justify-content:space-between;align-items:center}
.nx-card__idx{font-size:.68rem;color:var(--muted-2,var(--muted))}
.nx-card__title{font-size:1.12rem;margin-top:18px;font-weight:700}
.nx-card__sub{color:var(--muted);font-size:.85rem;margin-top:8px;flex:1}
.nx-card__meta{display:flex;gap:14px;margin-top:18px;font-size:.72rem;color:var(--muted-2,var(--muted));align-items:center;flex-wrap:wrap}
.nx-cat-tag{margin-inline-start:auto;color:var(--lime,#34D399);font-family:var(--font-mono,monospace);font-size:.68rem}
.nx-card__go{margin-top:16px}
.nx-card.nx-gone{display:none}
.nx-card.nx-pop{animation:nxPop .5s var(--ease,ease) both}
@keyframes nxPop{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}

/* ---- program tiles ---- */
.nx-progs{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:34px}
.nx-prog{position:relative;isolation:isolate;display:block;text-decoration:none;color:inherit;
  border:1px solid var(--line);border-radius:18px;padding:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));
  transition:transform .35s var(--ease,ease),border-color .35s,background .35s}
.nx-prog:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--lime,#34D399) 34%,transparent);
  background:color-mix(in srgb,var(--lime,#34D399) 4%,transparent)}
.nx-prog__num{font-size:.62rem;color:var(--muted-2,var(--muted))}
.nx-prog__n{font-size:.68rem;color:var(--muted-2,var(--muted))}
.nx-prog__ico{margin-top:14px;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;
  color:var(--lime,#34D399);border:1px solid color-mix(in srgb,var(--lime,#34D399) 30%,transparent);
  background:color-mix(in srgb,var(--lime,#34D399) 7%,transparent)}
.nx-prog__ico svg{width:17px;height:17px}
.nx-prog h3{font-size:.98rem;margin-top:12px}
@media (max-width:980px){.nx-progs{grid-template-columns:repeat(2,1fr)}}

/* ---- why icon tiles ---- */
.nx-ico{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;
  color:var(--lime,#34D399);border:1px solid color-mix(in srgb,var(--lime,#34D399) 30%,transparent);
  background:color-mix(in srgb,var(--lime,#34D399) 7%,transparent);
  box-shadow:inset 0 0 14px -6px color-mix(in srgb,var(--lime,#34D399) 55%,transparent)}
.nx-ico svg{width:19px;height:19px;stroke-width:1.6}

/* ---- how steps rail ---- */
.nx-steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:26px;margin-top:44px}
.nx-steps::before{content:"";position:absolute;top:5px;inset-inline:26px;height:1px;
  background:linear-gradient(90deg,transparent,var(--lime,#34D399),color-mix(in srgb,var(--rose,#F472B6) 70%,transparent),transparent)}
.nx-step{position:relative;padding-top:28px}
.nx-step__dot{position:absolute;top:0;inset-inline-start:0;width:11px;height:11px;border-radius:50%;
  background:var(--lime,#34D399);
  box-shadow:0 0 0 5px color-mix(in srgb,var(--lime,#34D399) 16%,transparent),0 0 18px color-mix(in srgb,var(--lime,#34D399) 70%,transparent);
  animation:nxBreath 2.8s ease-in-out infinite}
.nx-step:nth-child(2) .nx-step__dot{animation-delay:-.9s}
.nx-step:nth-child(3) .nx-step__dot{animation-delay:-1.8s}
.nx-step:nth-child(4) .nx-step__dot{animation-delay:-2.4s}
.nx-step__num{font-size:.68rem;letter-spacing:.22em;color:var(--lime,#34D399);opacity:.75}
.nx-step h3{font-size:1rem;margin-top:10px}
.nx-step p{margin-top:6px;font-size:.86rem;color:var(--muted)}
@keyframes nxBreath{0%,100%{transform:scale(1)}50%{transform:scale(1.35)}}
@media (max-width:980px){.nx-steps{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.nx-steps{grid-template-columns:1fr}.nx-steps::before{display:none}}

/* ---- certificate gold shimmer ---- */
.nx-cert-sweep{position:relative;overflow:hidden}
.nx-cert-sweep::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(250,204,21,.25),transparent);
  transform:translateX(-180%) skewX(-16deg);animation:nxGold 6s ease-in-out 2.2s infinite}
@keyframes nxGold{0%{transform:translateX(-180%) skewX(-16deg)}45%,100%{transform:translateX(520%) skewX(-16deg)}}

/* ---- nova fallbacks ---- */
@media (max-width:980px){.nx-spot{display:none}}
@media (prefers-reduced-motion: reduce){
  #nxIntro{display:none}
  .nx-spot{display:none}
  .nx-badge::before,.nx-beam i,.nx-cert-sweep::after,.nx-step__dot{animation:none}
}

/* =====================================================================
   PROFILE PAGES — public /u/{key} + dashboard edit  (.prx-*)
   ===================================================================== */

/* ---- public hero ---- */
.prx .wrap{max-width:980px}
.prx-hero{position:relative;display:flex;gap:26px;flex-wrap:wrap;align-items:flex-start;padding:30px;overflow:hidden}
.prx-hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(640px 240px at 88% -40%,rgba(52,211,153,.09),transparent 70%),
             radial-gradient(480px 200px at 0% 110%,rgba(244,114,182,.07),transparent 70%)}
.prx-ring{position:relative;flex:0 0 auto;display:grid;place-items:center;width:132px;height:132px}
.prx-ring::before{content:"";position:absolute;inset:-7px;border-radius:50%;padding:2px;
  background:conic-gradient(from 0deg,#34D399,#F472B6,#FACC15,#34D399);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  animation:prxSpin 6s linear infinite;opacity:.9}
.prx-ring::after{content:"";position:absolute;inset:-18px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(52,211,153,.14),transparent 72%)}
@keyframes prxSpin{to{transform:rotate(360deg)}}
.prx-ring img{position:relative;z-index:1;box-shadow:0 18px 44px -18px rgba(52,211,153,.55) !important}

.prx-id{flex:1 1 260px;min-width:240px;position:relative;z-index:1}
.prx-id h1{margin:0;font-size:1.7rem;font-family:var(--font-display,inherit)}
.prx-handle{display:inline-block;margin-top:5px;font-size:.78rem;color:var(--muted-2);
  background:rgba(52,211,153,.07);border:1px solid rgba(52,211,153,.25);border-radius:999px;padding:3px 11px}
.prx-h2 i{font-style:normal;font-size:.72rem;color:var(--lime,#34D399);border:1px solid rgba(52,211,153,.35);
  border-radius:999px;padding:1px 10px;background:rgba(52,211,153,.07);font-family:var(--font-mono,monospace)}
.prx-headline{color:var(--lime,#34D399);margin:7px 0 0;font-size:.95rem}
.prx-meta{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:13px;font-size:.78rem;color:var(--muted-2);align-items:center}

.prx-side{display:grid;gap:10px;min-width:210px;margin-inline-start:auto;position:relative;z-index:1}
.prx-side .prx-act{display:block}
.prx-btn{display:inline-flex;width:100%;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;
  border-radius:12px;border:1px solid var(--line-2,#2A3A34);background:rgba(255,255,255,.04);color:var(--text,#EAF6EF);
  font-family:inherit;font-size:.82rem;cursor:pointer;transition:.22s;text-decoration:none}
.prx-btn svg{fill:currentColor;flex:0 0 auto}
.prx-btn--follow{background:linear-gradient(135deg,rgba(52,211,153,.16),rgba(52,211,153,.05));
  border-color:rgba(52,211,153,.5);color:#9BEBFF}
.prx-btn--follow:hover{box-shadow:0 0 22px -6px rgba(52,211,153,.8);transform:translateY(-1px)}
.prx-act.is-on .prx-btn--follow{background:rgba(52,211,153,.18);color:#BFF3FF}
.prx-btn--like{border-color:rgba(244,114,182,.45);color:#FFB4D9;
  background:linear-gradient(135deg,rgba(244,114,182,.12),rgba(244,114,182,.03))}
.prx-btn--like:hover{box-shadow:0 0 22px -6px rgba(244,114,182,.75);transform:translateY(-1px)}
.prx-btn--like b{font-family:var(--font-mono,monospace);font-size:.8rem}
.prx-act.is-on .prx-btn--like{background:rgba(244,114,182,.24);color:#FFD5EA;box-shadow:0 0 18px -4px rgba(244,114,182,.85)}
.prx-act.is-on .prx-btn--like svg{fill:#F472B6;filter:drop-shadow(0 0 6px rgba(244,114,182,.9))}
.prx-btn--poke{border-color:rgba(250,204,21,.4);color:#FDE68A;
  background:linear-gradient(135deg,rgba(250,204,21,.1),rgba(250,204,21,.03))}
.prx-btn--poke:hover{box-shadow:0 0 22px -6px rgba(250,204,21,.7);transform:translateY(-1px)}
.prx-wait{display:none;font-family:var(--font-mono,monospace);font-size:.7rem;background:rgba(0,0,0,.35);
  border-radius:6px;padding:2px 8px;margin-inline-start:4px}
.prx-act.is-wait .prx-wait{display:inline-block}
.prx-act.is-wait .prx-btn--poke{opacity:.55}
.js-social.is-busy{opacity:.65;pointer-events:none}
.prx-s.s-off{display:inline}
.prx-s.s-on{display:none}
.prx-act.is-on .s-off{display:none}
.prx-act.is-on .s-on{display:inline}

.prx-views{display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:.74rem;
  color:var(--muted-2);border:1px solid var(--line-2,#2A3A34);border-radius:999px;padding:8px 12px;
  background:rgba(255,255,255,.03);font-family:var(--font-mono,monospace)}
.prx-views svg{fill:var(--lime,#34D399)}
.prx-views b{color:var(--text,#EAF6EF);font-weight:700}
.prx-you{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--lime,#34D399);
  border:1px dashed rgba(52,211,153,.4);border-radius:999px;padding:5px 12px;background:rgba(52,211,153,.05);justify-self:center}
.prx-burst{position:absolute;top:10px;inset-inline-end:34px;pointer-events:none;z-index:2}

/* ---- stats grid ---- */
.prx-stats{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.prx-stat{position:relative;display:grid;gap:4px;justify-items:center;padding:16px 8px;
  border:1px solid var(--line,#1E2E28);border-radius:16px;
  background:linear-gradient(180deg,rgba(255,255,255,.03),transparent);overflow:hidden;transition:.25s}
.prx-stat::before{content:"";position:absolute;inset:-30% 15% auto;height:70%;opacity:0;transition:.4s;
  background:radial-gradient(closest-side,rgba(52,211,153,.12),transparent 72%)}
.prx-stat:hover{border-color:rgba(52,211,153,.45);transform:translateY(-3px);box-shadow:0 16px 34px -18px rgba(0,0,0,.85)}
.prx-stat:hover::before{opacity:1}
.prx-stat i{font-style:normal;font-size:1.15rem;line-height:1}
.prx-stat b{font-family:var(--font-mono,monospace);font-size:1.25rem;color:var(--text,#EAF6EF)}
.prx-stat span{font-size:.66rem;color:var(--muted-2);letter-spacing:.05em;text-align:center}

/* ---- graphs ---- */
.prx-graph{padding:20px}
.prx-graph__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.prx-graph__head h3{margin:0;font-size:.78rem;color:var(--muted-2);letter-spacing:.12em;text-transform:uppercase}
.prx-svg{width:100%;height:96px;display:block}
.prx-line{filter:drop-shadow(0 0 6px rgba(52,211,153,.55))}
.prx-dot{fill:#F472B6;filter:drop-shadow(0 0 7px rgba(244,114,182,.95));animation:prxDot 2.4s ease-in-out infinite}
@keyframes prxDot{0%,100%{opacity:1}50%{opacity:.4}}
.prx-graph g rect{transition:.3s}
.prx-graph:hover g rect{filter:drop-shadow(0 0 5px rgba(52,211,153,.55))}

/* ---- about / chips ---- */
.prx-about{padding:24px;position:relative}
.prx-web{position:absolute;top:20px;inset-inline-end:22px;font-size:.7rem;font-family:var(--font-mono,monospace);
  color:var(--lime,#34D399);text-decoration:none;border:1px solid rgba(52,211,153,.3);border-radius:999px;
  padding:4px 12px;background:rgba(52,211,153,.06);transition:.25s}
.prx-web:hover{box-shadow:0 0 18px -6px rgba(52,211,153,.8)}
.prx-bio{margin:0;line-height:1.9;font-size:.95rem;color:var(--muted)}
.prx-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.prx-chip{padding:5px 13px;border-radius:999px;font-size:.74rem;border:1px solid rgba(52,211,153,.3);
  background:rgba(52,211,153,.07);color:#9BEBFF;transition:.2s}
.prx-chip:hover{background:rgba(52,211,153,.16);transform:translateY(-1px)}

/* ---- learning + experience ---- */
.prx-learn,.prx-exp{padding:24px}
.prx-title{margin:0 0 16px;font-size:.78rem;color:var(--muted-2);letter-spacing:.14em;text-transform:uppercase}
.prx-track__top{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:.88rem;margin-bottom:6px}
.prx-track__top b{color:var(--lime,#34D399)}
.prx-bar{height:9px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--line-2,#2A3A34);overflow:hidden}
.prx-bar span{position:relative;display:block;height:100%;border-radius:999px;overflow:hidden;
  background:linear-gradient(90deg,#34D399,#F472B6);box-shadow:0 0 12px -2px rgba(52,211,153,.8)}
.prx-bar span::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);
  transform:translateX(-100%);animation:prxShimmer 2.6s linear infinite}
@keyframes prxShimmer{to{transform:translateX(100%)}}
.prx-job{position:relative;padding:0 0 14px;padding-inline-start:22px;
  border-inline-start:2px solid rgba(52,211,153,.35);margin-inline-start:6px}
.prx-job:last-child{padding-bottom:2px}
.prx-job::before{content:"";position:absolute;top:4px;inset-inline-start:-7px;width:12px;height:12px;border-radius:50%;
  background:#05070C;border:2px solid #34D399;box-shadow:0 0 10px rgba(52,211,153,.85)}
.prx-job__co{font-weight:600}
.prx-job__role{font-size:.83rem;color:var(--muted-2);margin-top:2px}

/* ---- certs ---- */
.prx-h2{font-size:1.05rem;margin:30px 0 14px;display:flex;gap:10px;align-items:center}
.prx-cert h3{font-size:.98rem;margin:10px 0 6px}
.prx-cert p{margin:0;font-size:.72rem;color:var(--muted-2)}

/* =====================================================================
   PROFILE EDIT (dashboard) — .prx-strip + .pf-* + form widgets
   ===================================================================== */
.prx-strip{display:flex;flex-direction:column;gap:14px;padding:18px 20px;margin-bottom:20px}
.prx-strip__head{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
.prx-strip__head .uc-eyebrow{margin:0}
.prx-strip__link{font-size:.7rem;color:var(--lime,#34D399);text-decoration:none;border:1px dashed rgba(52,211,153,.4);
  padding:4px 10px;border-radius:8px;background:rgba(52,211,153,.05);direction:ltr;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.prx-strip__link:hover{box-shadow:0 0 16px -6px rgba(52,211,153,.8)}
.prx-strip__row{display:flex;flex-wrap:wrap;gap:10px}
.prx-pill{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:999px;
  border:1px solid var(--line-2,#2A3A34);background:rgba(255,255,255,.03);font-size:.72rem;color:var(--muted-2);transition:.2s}
.prx-pill:hover{border-color:rgba(52,211,153,.4);transform:translateY(-1px)}
.prx-pill i{font-style:normal}
.prx-pill b{font-family:var(--font-mono,monospace);color:var(--text,#EAF6EF);font-size:.82rem}
.prx-pill__text{color:var(--text,#EAF6EF)}

.pf-head{display:flex;gap:26px;align-items:flex-start;flex-wrap:wrap;margin-bottom:24px}
.pf-photo{flex:0 0 min(300px,100%)}
.pf-photo .dropzone{max-width:300px;width:100%;padding:12px 14px;gap:10px;border-radius:14px;margin:0}
.pf-ava{flex:1;display:flex;align-items:center;gap:18px;flex-wrap:wrap;min-width:220px}

/* keep the old one-field-per-row rhythm, scoped to this form only */
.profile-form .grid-2,.profile-form .grid-3{display:block !important}
.profile-form .grid-2 > div,.profile-form .grid-3 > div{width:100% !important}
.profile-form .row:has(.field){display:block !important}
.profile-form .row:not(:has(.field)){display:flex !important;flex-wrap:wrap;gap:10px}
.profile-form .column{transition:border-color .25s}
.profile-form .field:focus-within{filter:drop-shadow(0 0 12px rgba(52,211,153,.2))}

.skills-search input{width:100%;margin-bottom:12px;min-height:44px}
.skills-groups{max-height:320px;overflow:auto;padding-inline-end:6px;display:grid;gap:14px}
.skills-group h4{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2);margin:0 0 8px}
.skills-list{display:flex;flex-wrap:wrap;gap:6px}
.skill-chip{border:1px solid var(--line-2,#2A3A34);background:rgba(255,255,255,.03);color:var(--muted);
  border-radius:999px;padding:5px 12px;font-size:.74rem;cursor:pointer;transition:.18s;font-family:inherit}
.skill-chip:hover{border-color:rgba(52,211,153,.6);color:var(--text,#EAF6EF)}
.skill-chip{position:relative;overflow:hidden}
.skill-chip.is-on{background:rgba(52,211,153,.14);border-color:#34D399;color:#BFF3FF;
  box-shadow:0 0 14px -6px rgba(52,211,153,.9);animation:chipPop .38s cubic-bezier(.2,1.4,.4,1)}
@keyframes chipPop{0%{transform:scale(.9)}55%{transform:scale(1.08)}100%{transform:scale(1)}}
.skill-chip.is-on::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 50% 50%,rgba(52,211,153,.5),transparent 62%);
  animation:chipFlash .55s ease-out forwards}
@keyframes chipFlash{0%{opacity:.9;transform:scale(.4)}100%{opacity:0;transform:scale(1.6)}}
.skills-selected{display:flex;flex-wrap:wrap;gap:8px;min-height:44px;padding:10px 12px;border:1px solid var(--line-2,#2A3A34);
  border-radius:12px;background:rgba(52,211,153,.05);margin-bottom:12px}
.skills-empty{font-size:.78rem;color:var(--muted-2)}
.skill-pill{display:inline-flex;align-items:center;gap:6px;padding:5px 6px 5px 12px;border-radius:999px;
  background:rgba(52,211,153,.14);border:1px solid rgba(52,211,153,.45);color:#BFF3FF;font-size:.76rem;
  animation:pillIn .3s cubic-bezier(.2,1.3,.4,1)}
@keyframes pillIn{from{opacity:0;transform:translateY(6px) scale(.9)}to{opacity:1;transform:none}}
.skill-pill button{border:0;background:rgba(0,0,0,.25);color:#BFF3FF;width:16px;height:16px;border-radius:50%;cursor:pointer;
  font-size:.6rem;line-height:1;display:grid;place-items:center}
.skill-pill button:hover{background:#F472B6;color:#1A0512}

.profile-form .check{display:flex;align-items:center;gap:11px;margin:8px 0 20px;padding:10px 14px;border-radius:12px;
  border:1px solid var(--line-2,#2A3A34);background:rgba(255,255,255,.025);transition:.3s;cursor:pointer}
.profile-form .check:hover{border-color:rgba(52,211,153,.45);background:rgba(52,211,153,.05)}
.profile-form .check input[type="checkbox"]{appearance:none;-webkit-appearance:none;-moz-appearance:none;
  width:22px;height:22px;min-height:22px;flex:0 0 22px;margin:0;cursor:pointer;border-radius:7px;
  border:1.5px solid rgba(52,211,153,.55);background:rgba(52,211,153,.07);
  background-position:center;background-repeat:no-repeat;background-size:14px;
  transition:background-color .25s,border-color .25s,box-shadow .3s,transform .2s}
.profile-form .check input[type="checkbox"]:hover{border-color:#34D399;transform:scale(1.06)}
.profile-form .check input[type="checkbox"]:checked{border-color:#34D399;background-color:#34D399;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2305070C' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'><path d='M4 12.5l5 5L20 6.5'/></svg>");
  box-shadow:0 0 0 4px rgba(52,211,153,.16),0 10px 24px -14px rgba(52,211,153,.95);
  animation:cbPop .35s cubic-bezier(.2,1.5,.4,1)}
@keyframes cbPop{0%{transform:scale(.85)}60%{transform:scale(1.12)}100%{transform:scale(1)}}
.profile-form .check label{font-size:.82rem !important;margin:0 !important;cursor:pointer;color:var(--muted)}
.profile-form .check input:checked ~ label{color:var(--text,#EAF6EF)}
.avatar-preset.is-bump{animation:avBump .45s cubic-bezier(.2,1.4,.4,1)}
@keyframes avBump{0%{transform:scale(.9)}55%{transform:scale(1.12)}100%{transform:scale(1)}}

/* ---- profile fallbacks ---- */
@media (max-width:980px){
  .prx-stats{grid-template-columns:repeat(3,1fr)}
  .pf-head{flex-direction:column}
  .prx-side{width:100%}
  .prx-burst{display:none}
}
@media (prefers-reduced-motion: reduce){
  .prx-ring::before,.prx-dot,.prx-bar span::after {animation:none}
  .prx-stat,.prx-chip,.prx-pill,.prx-stat b,.prx-btn{transition:none}
}

/* =====================================================================
   WALLET — U0C VAULT  (.vault .vw-* .wv-*)
   ===================================================================== */

/* ---- vault intro (fixed overlay; doors part at 1.05s, JS removes node) ---- */
#vwIntro{position:fixed;inset:0;z-index:9000;pointer-events:none;display:grid;place-items:center}
.vw-door{position:absolute;top:0;bottom:0;width:50.6%;
  background:linear-gradient(120deg,#08131a,#05070C 55%,#0A141C);
  box-shadow:inset 0 0 60px rgba(0,0,0,.75)}
.vw-door--l{left:0;box-shadow:inset -16px 0 34px -14px rgba(52,211,153,.4);
  animation:vwDoorL .95s cubic-bezier(.75,0,.25,1) 1.05s forwards}
.vw-door--r{right:0;box-shadow:inset 16px 0 34px -14px rgba(244,114,182,.4);
  animation:vwDoorR .95s cubic-bezier(.75,0,.25,1) 1.05s forwards}
@keyframes vwDoorL{to{transform:translateX(-102%)}}
@keyframes vwDoorR{to{transform:translateX(102%)}}
.vw-door--l::after,.vw-door--r::after{content:"";position:absolute;inset-block:44px;width:7px;border-radius:8px;opacity:.55;
  background:repeating-linear-gradient(180deg,rgba(250,204,21,.55) 0 3px,transparent 3px 24px)}
.vw-door--l::after{right:12px}
.vw-door--r::after{left:12px}
.vw-dial{position:relative;width:150px;height:150px;display:grid;place-items:center;
  animation:vwDialFade .55s ease 1.0s forwards}
@keyframes vwDialFade{to{opacity:0}}
.vw-dial i{position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(from 0deg,#34D399,#F472B6,#FACC15,#34D399);
  -webkit-mask:radial-gradient(closest-side,transparent 62%,#000 63%,#000 71%,transparent 72%);
          mask:radial-gradient(closest-side,transparent 62%,#000 63%,#000 71%,transparent 72%);
  animation:vwSpin 1.15s linear infinite}
.vw-dial i.r2{inset:19px;animation-duration:.85s;animation-direction:reverse;opacity:.9}
.vw-dial b{font-family:var(--font-mono,monospace);font-size:.92rem;color:#FACC15;
  letter-spacing:.3em;text-indent:.3em;text-shadow:0 0 14px rgba(250,204,21,.85)}
@keyframes vwSpin{to{transform:rotate(360deg)}}

/* ---- hero + storm ---- */
.vw-hero{position:relative;padding:26px;overflow:hidden;border:1px solid rgba(52,211,153,.28)}
.vw-hero::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(560px 230px at 12% -10%,rgba(52,211,153,.10),transparent 70%),
             radial-gradient(420px 210px at 100% 115%,rgba(244,114,182,.11),transparent 72%)}
#vwStorm{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:.9}
.vw-hero__r{position:relative;z-index:1;display:flex;gap:28px;flex-wrap:wrap;align-items:center}

/* ---- holo money card ---- */
.wv-card{position:relative;flex:0 1 460px;min-width:300px;aspect-ratio:1.72;
  border-radius:18px;padding:20px 22px;display:flex;flex-direction:column;justify-content:space-between;
  background:linear-gradient(130deg,#0A1A20 0%,#071018 45%,#120A1C 100%);
  border:1px solid rgba(52,211,153,.4);
  box-shadow:0 30px 70px -30px rgba(52,211,153,.4),0 12px 32px -18px rgba(0,0,0,.9);
  transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  will-change:transform;overflow:hidden}
.wv-card__ring{position:absolute;inset:-2px;border-radius:20px;padding:1.5px;pointer-events:none;
  background:conic-gradient(from 0deg,#34D399,transparent 12%,#F472B6 27%,transparent 45%,#FACC15 59%,transparent 76%,#34D399);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  animation:vwSpin 5.5s linear infinite;opacity:.85}
.wv-card::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.16;mix-blend-mode:color-dodge;
  background:linear-gradient(115deg,transparent 30%,rgba(52,211,153,.55) 38%,rgba(244,114,182,.55) 46%,rgba(250,204,21,.55) 54%,transparent 62%);
  background-size:280% 100%;animation:vwHolo 7s ease-in-out infinite alternate}
@keyframes vwHolo{from{background-position:0% 0}to{background-position:100% 0}}
.wv-chip{width:44px;height:32px;border-radius:7px;position:relative;overflow:hidden;flex:0 0 auto;
  background:linear-gradient(140deg,#FACC15 0%,#8A6A00 38%,#FACC15 52%,#6B5200 70%,#FACC15);
  box-shadow:0 2px 8px rgba(0,0,0,.5)}
.wv-chip i{position:absolute;left:0;right:0;border-top:1px solid rgba(5,7,12,.55)}
.wv-chip i:nth-child(1){top:7px}
.wv-chip i:nth-child(2){top:14px}
.wv-chip i:nth-child(3){top:21px}
.wv-chip i:nth-child(4){top:27px}
.wv-chip::after{content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;background:rgba(5,7,12,.5)}
.wv-nfc{color:rgba(52,211,153,.85);fill:none;stroke:currentColor;stroke-width:1.7;margin-left:auto}
.wv-card__top{display:flex;align-items:flex-start}
.wv-card__bal small{display:block;font-family:var(--font-mono,monospace);font-size:.6rem;letter-spacing:.32em;
  text-transform:uppercase;color:var(--muted-2);margin-bottom:7px}
.vword{display:inline-flex;align-items:baseline;font-family:var(--font-mono,monospace);
  font-size:clamp(1.65rem,3.4vw,2.4rem);font-weight:700;letter-spacing:.02em;
  color:#EAFCFF;text-shadow:0 0 26px rgba(52,211,153,.45)}
.vwd{display:inline-block;width:.64em;height:1.15em;overflow:hidden;text-align:center}
.vwd__strip{display:block;transition:transform .95s cubic-bezier(.16,.8,.2,1)}
.vwd__strip b{display:block;height:1.15em;line-height:1.15em;font-weight:700}
.vwd-cur{font-size:.42em;color:#FACC15;margin-left:9px;text-shadow:0 0 12px rgba(250,204,21,.75)}
/* ---- money digit organization (2026-10-22) ---- */
.vword{font-variant-numeric:tabular-nums;white-space:nowrap;max-width:100%}
.vwd--p{width:.34em;opacity:.62}
.vw-stat b{font-variant-numeric:tabular-nums;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.vw-chip b{font-variant-numeric:tabular-nums}
.vw-chip__wrap,.vw-chip{min-width:0;white-space:nowrap}
.w-row__amount,.w-row__rb{font-variant-numeric:tabular-nums;letter-spacing:.02em}
.w-row__amount{white-space:nowrap}
@media (max-width:1100px){.vw-stat b{font-size:.88rem}}
@media (max-width:760px){.vw-stat b{font-size:.8rem}}
.wv-card__foot{display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.wv-card__no{font-size:.66rem;color:var(--muted-2);letter-spacing:.16em}
.wv-card__no b{color:var(--text,#EAF6EF);margin-right:6px;font-weight:500;letter-spacing:.1em}
.wv-card__brand{font-size:.68rem;letter-spacing:.26em;color:#34D399;font-weight:700}
.wv-card__brand i{color:#F472B6;font-style:normal;text-shadow:0 0 12px rgba(244,114,182,.85)}
.wv-card__sheen{position:absolute;top:-70%;left:0;width:55%;height:240%;pointer-events:none;
  transform:rotate(18deg) translateX(-160px);
  background:linear-gradient(90deg,transparent,rgba(234,252,255,.11),transparent);
  animation:vwSheen 7.5s ease-in-out infinite}
@keyframes vwSheen{0%,62%{transform:rotate(18deg) translateX(-160px)}82%,94%{transform:rotate(18deg) translateX(560px)}100%{transform:rotate(18deg) translateX(-160px)}}
.wv-card__holo{position:absolute;width:190px;height:190px;border-radius:50%;pointer-events:none;
  left:var(--hx,50%);top:var(--hy,50%);transform:translate(-50%,-50%);
  background:radial-gradient(closest-side,rgba(140,255,240,.17),rgba(52,211,153,.06) 46%,transparent 72%);
  mix-blend-mode:screen;animation:vwHue 5s linear infinite}
@keyframes vwHue{to{filter:hue-rotate(360deg)}}

/* ---- side chips ---- */
.vw-side{display:grid;gap:13px;flex:1;min-width:250px;justify-items:start}
.vw-chips{display:grid;gap:8px}
.vw-chip{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono,monospace);
  font-size:.72rem;padding:7px 13px;border-radius:999px;border:1px solid;width:max-content}
.vw-chip i{font-style:normal}
.vw-chip b{font-weight:700}
.vw-chip em{font-style:normal;color:var(--muted-2);font-size:.62rem;letter-spacing:.06em}
.vw-chip--in{color:#9BEBFF;border-color:rgba(52,211,153,.55);background:rgba(52,211,153,.09)}
.vw-chip--out{color:#FFB4D9;border-color:rgba(244,114,182,.5);background:rgba(244,114,182,.08)}
.vw-chip--hold{color:#FDE68A;border-color:rgba(251,191,36,.5);background:rgba(251,191,36,.08);
  animation:vwHold 2.2s ease-in-out infinite}
@keyframes vwHold{0%,100%{box-shadow:0 0 0 0 rgba(251,191,36,0)}50%{box-shadow:0 0 16px 0 rgba(251,191,36,.4)}}
.vw-chip--mon{color:#FDE68A;border-color:rgba(250,204,21,.45);background:rgba(250,204,21,.07)}
.vw-chip--mon b.is-neg{color:#FFB4D9}
.vw-secure{font-size:.62rem;color:var(--muted-2);letter-spacing:.2em;margin:2px 0 0}
.vw-secure::before{content:"🔐 "}

/* ---- stats ---- */
.vw-stats{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:16px}
.vw-stat{position:relative;display:grid;gap:4px;justify-items:center;padding:14px 8px;
  border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:.25s;
  background:linear-gradient(180deg,rgba(255,255,255,.03),transparent)}
.vw-stat::before{content:"";position:absolute;inset:-30% 15% auto;height:70%;opacity:0;transition:.4s;
  background:radial-gradient(closest-side,rgba(250,204,21,.15),transparent 72%)}
.vw-stat:hover{border-color:rgba(250,204,21,.5);transform:translateY(-3px);box-shadow:0 18px 36px -20px rgba(0,0,0,.9)}
.vw-stat:hover::before{opacity:1}
.vw-stat i{font-style:normal;color:#FACC15;font-size:1rem;line-height:1}
.vw-stat b{font-family:var(--font-mono,monospace);font-size:1rem;text-align:center}
.vw-stat b.is-pos{color:#9BEBFF}
.vw-stat b.is-neg{color:#FFB4D9}
.vw-stat span{font-size:.62rem;color:var(--muted-2);letter-spacing:.06em;text-align:center}

/* ---- cash-flow chart ---- */
.vw-chart{padding:20px}
.vw-chart__head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.vw-chart__head h3{margin:0;font-size:.76rem;color:var(--muted-2);letter-spacing:.14em;text-transform:uppercase}
.vw-chart__legend{display:flex;gap:14px;font-size:.64rem;letter-spacing:.08em}
.vw-chart__legend .is-in{color:#34D399}
.vw-chart__legend .is-out{color:#F472B6}
.vw-svg{width:100%;height:120px;display:block}
.vw-line--in{filter:drop-shadow(0 0 6px rgba(52,211,153,.6))}
.vw-line--out{filter:drop-shadow(0 0 6px rgba(244,114,182,.6))}
.vw-col{fill:transparent;transition:fill .2s}
.vw-col:hover{fill:rgba(52,211,153,.09)}

/* ---- ops console ---- */
.vw-ops{padding:20px}
.wv-tabs{position:relative;display:flex;gap:6px;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:18px}
.wv-tab{position:relative;z-index:1;border:0;background:none;color:var(--muted-2);font-family:inherit;
  font-size:.8rem;padding:9px 16px;border-radius:10px;cursor:pointer;display:inline-flex;gap:8px;align-items:center;
  transition:color .25s,background .25s}
.wv-tab i{font-style:normal;font-size:.88rem}
.wv-tab:hover{color:var(--text,#EAF6EF);background:rgba(255,255,255,.04)}
.wv-tab.is-on{background:rgba(52,211,153,.08)}
.wv-tab.is-on[data-tab="d"]{color:#9BEBFF}
.wv-tab.is-on[data-tab="t"]{color:#FF9ECF}
.wv-tab.is-on[data-tab="w"]{color:#FDE68A}
.wv-ink{position:absolute;bottom:-1px;left:0;height:2px;border-radius:2px;width:90px;
  background:linear-gradient(90deg,#34D399,#F472B6);box-shadow:0 0 12px rgba(52,211,153,.8);
  transition:transform .35s cubic-bezier(.2,.9,.3,1),width .35s}
.wv-panels .wv-panel{display:grid;gap:13px;max-width:460px}
@keyframes vwPanelIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.vw-ops .wv-submit{margin-top:4px}

/* ---- ledger (terminal) ---- */
.vw-ledgerhead{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.vw-ledgerhead h2{margin:0;font-size:1rem}
.vw-filters{display:flex;gap:7px;flex-wrap:wrap}
.vw-f{border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--muted-2);
  border-radius:999px;padding:6px 14px;font-size:.74rem;cursor:pointer;font-family:inherit;transition:.2s}
.vw-f:hover{color:var(--text,#EAF6EF);border-color:rgba(52,211,153,.5)}
.vw-f.is-on{background:rgba(52,211,153,.16);border-color:#34D399;color:#BFF3FF;box-shadow:0 0 14px -6px rgba(52,211,153,.9)}
.wv-ledger{display:grid;gap:8px}
.w-row{position:relative;display:grid;grid-template-columns:auto auto minmax(0,1fr) auto auto auto auto;
  align-items:center;gap:12px;padding:12px 16px;border-radius:13px;border:1px solid var(--line);
  background:rgba(255,255,255,.025);text-decoration:none;color:inherit;overflow:hidden;transition:border-color .25s,transform .25s}
.w-row::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:.3s;
  background:linear-gradient(90deg,transparent,rgba(52,211,153,.055),transparent)}
.w-row:hover{border-color:rgba(52,211,153,.45);transform:translateY(-2px)}
.w-row:hover::after{opacity:1}
.w-row--in{border-inline-start:3px solid #34D399;
  background:linear-gradient(90deg,rgba(52,211,153,.06),transparent)}
.w-row--out{border-inline-start:3px solid #F472B6;
  background:linear-gradient(90deg,rgba(244,114,182,.06),transparent)}
.w-row.is-pending{border-color:rgba(251,191,36,.42)}
.w-row.vw-gone{display:none !important}
@keyframes vwRowIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.w-row__idx{font-size:.6rem;color:var(--muted-2)}
.w-row__ico{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:.72rem;flex:0 0 auto}
.w-row--in .w-row__ico{background:rgba(52,211,153,.14);color:#9BEBFF}
.w-row--out .w-row__ico{background:rgba(244,114,182,.14);color:#FFB4D9}
.w-row__main{min-width:0;display:grid}
.w-row__type{font-size:.82rem;color:var(--text,#EAF6EF)}
.w-row__meta{font-size:.62rem;color:var(--muted-2);font-family:var(--font-mono,monospace);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wv-mchip{font-size:.58rem;border:1px solid var(--line-2);border-radius:6px;padding:1px 6px;
  margin:0 2px;background:rgba(255,255,255,.03)}
.w-row__rb{font-size:.66rem;color:var(--muted-2);direction:ltr;
  border-inline-start:1px solid var(--line);padding-inline-start:12px}
.w-row__amount{font-family:var(--font-mono,monospace);font-size:.92rem;font-weight:600;direction:ltr}
.w-row--in .w-row__amount{color:#9BEBFF;text-shadow:0 0 12px rgba(52,211,153,.4)}
.w-row--out .w-row__amount{color:#FFB4D9;text-shadow:0 0 12px rgba(244,114,182,.4)}
.wv-go{color:#34D399;opacity:0;transform:scale(.7);transition:.2s}
.w-row:hover .wv-go{opacity:1;transform:none}
.w-row__ref{font-family:var(--font-mono,monospace);font-size:.6rem;color:#34D399;opacity:.85;
  direction:ltr;display:inline-block}
.w-row__status{font-size:.58rem;padding:3px 9px;border-radius:999px;border:1px solid;justify-self:end}
.w-row__status.is-ok{color:#9BEBFF;border-color:rgba(52,211,153,.45);background:rgba(52,211,153,.08)}
.w-row__status.is-no{color:#FFB4D9;border-color:rgba(244,114,182,.45);background:rgba(244,114,182,.08)}
.w-row__status.is-hold{color:#FDE68A;border-color:rgba(251,191,36,.45);background:rgba(251,191,36,.09)}
.w-empty{text-align:center;padding:34px;color:var(--muted-2);border:1px dashed var(--line-2);border-radius:14px}

/* ---- coin burst (fixed spans injected on submit) ---- */
.vw-coin{position:fixed;z-index:9500;pointer-events:none;font-family:var(--font-mono,monospace);font-size:.9rem;
  color:#FACC15;text-shadow:0 0 10px rgba(250,204,21,.9);
  animation:vwFly .8s cubic-bezier(.2,.8,.4,1) forwards}
@keyframes vwFly{0%{opacity:1;transform:translate(0,0) scale(1) rotate(0)}
  100%{opacity:0;transform:translate(var(--dx),calc(var(--dy) + 40px)) scale(.5) rotate(160deg)}}

/* ---- vault fallbacks ---- */
@media (max-width:900px){
  .vw-stats{grid-template-columns:repeat(3,1fr)}
  .w-row{grid-template-columns:auto auto minmax(0,1fr) auto}
  .w-row__idx,.w-row__rb,.wv-go{display:none}
}
@media (prefers-reduced-motion: reduce){
  #vwIntro{display:none !important}
  .vw-door--l,.vw-door--r{animation:none}
  .wv-card__ring,.wv-card::after,.wv-card__sheen,.wv-card__holo{animation:none}
  .vw-chip--hold,.w-row.is-pending{animation:none}
  .vwd__strip{transition:none}
  .vw-stat,.vw-f,.w-row{transition:none}
}

/* ---- ops as three standalone sections (deposit / transfer / withdraw) ---- */
.vw-ops{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;padding:0;margin-inline:0}
.vw-op{position:relative;display:flex;flex-direction:column;gap:14px;padding:20px;overflow:hidden;
  border-radius:18px;animation:vwPanelIn .5s cubic-bezier(.2,.9,.3,1) both}
.vw-op:nth-child(1){animation-delay:60ms}
.vw-op:nth-child(2){animation-delay:160ms}
.vw-op:nth-child(3){animation-delay:260ms}
.vw-op::before{content:"";position:absolute;inset:-40% 20% auto;height:90%;pointer-events:none;opacity:0;transition:.4s;
  background:radial-gradient(closest-side,rgba(250,204,21,.14),transparent 72%)}
.vw-op:hover{transform:translateY(-3px)}
.vw-op:hover::before{opacity:1}
.vw-op form{display:grid;gap:12px}
.vw-op__head{display:flex;align-items:center;gap:12px}
.vw-op__ico{flex:0 0 auto;width:40px;height:40px;border-radius:13px;display:grid;place-items:center;font-size:1.05rem;
  border:1px solid;transition:.25s}
.vw-op__ttl{min-width:0}
.vw-op__ttl h3{margin:0;font-size:.95rem;letter-spacing:.02em}
.vw-op__hint{margin:3px 0 0;font-size:.66rem;color:var(--muted-2)}
.vw-op__min{margin-inline-start:auto;flex:0 0 auto;font-family:var(--font-mono,monospace);font-size:.58rem;
  letter-spacing:.08em;padding:4px 9px;border-radius:999px;border:1px solid}
.vw-op--d{border-color:rgba(52,211,153,.4);box-shadow:0 0 0 1px rgba(52,211,153,.08),0 18px 40px -26px rgba(52,211,153,.5)}
.vw-op--d::before{background:radial-gradient(closest-side,rgba(52,211,153,.13),transparent 72%)}
.vw-op--d:hover{box-shadow:0 0 0 1px rgba(52,211,153,.2),0 24px 52px -28px rgba(52,211,153,.65)}
.vw-op--d .vw-op__ico{color:#9BEBFF;border-color:rgba(52,211,153,.55);background:rgba(52,211,153,.1);box-shadow:0 0 16px -6px rgba(52,211,153,.7)}
.vw-op--d .vw-op__min{color:#9BEBFF;border-color:rgba(52,211,153,.4);background:rgba(52,211,153,.07)}
.vw-op--t{border-color:rgba(244,114,182,.4);box-shadow:0 0 0 1px rgba(244,114,182,.08),0 18px 40px -26px rgba(244,114,182,.5)}
.vw-op--t::before{background:radial-gradient(closest-side,rgba(244,114,182,.13),transparent 72%)}
.vw-op--t:hover{box-shadow:0 0 0 1px rgba(244,114,182,.2),0 24px 52px -28px rgba(244,114,182,.65)}
.vw-op--t .vw-op__ico{color:#FF9ECF;border-color:rgba(244,114,182,.55);background:rgba(244,114,182,.1);box-shadow:0 0 16px -6px rgba(244,114,182,.7)}
.vw-op--t .vw-op__min{color:#FF9ECF;border-color:rgba(244,114,182,.4);background:rgba(244,114,182,.07)}
.vw-op--w{border-color:rgba(250,204,21,.42);box-shadow:0 0 0 1px rgba(250,204,21,.08),0 18px 40px -26px rgba(250,204,21,.5)}
.vw-op--w::before{background:radial-gradient(closest-side,rgba(250,204,21,.13),transparent 72%)}
.vw-op--w:hover{box-shadow:0 0 0 1px rgba(250,204,21,.2),0 24px 52px -28px rgba(250,204,21,.65)}
.vw-op--w .vw-op__ico{color:#FDE68A;border-color:rgba(250,204,21,.55);background:rgba(250,204,21,.1);box-shadow:0 0 16px -6px rgba(250,204,21,.7)}
.vw-op--w .vw-op__min{color:#FDE68A;border-color:rgba(250,204,21,.4);background:rgba(250,204,21,.07)}
@media (prefers-reduced-motion: reduce){
  .vw-op{animation:none}
  .vw-op,.vw-op:hover{transition:none}
}

/* ---- header identity avatars (sidebar pill + user chip + drop head) ---- */
.avatar-img.hd-ava,.avatar-preset.hd-ava{flex:0 0 auto}
.user-chip .avatar-img.hd-ava,.user-chip .avatar-preset.hd-ava{
  box-shadow:0 0 0 2px rgba(52,211,153,.45),0 6px 16px -8px rgba(52,211,153,.9) !important}
.app-side .avatar-img.hd-ava,.app-side .avatar-preset.hd-ava{
  box-shadow:0 0 0 2px rgba(52,211,153,.4),0 6px 14px -8px rgba(52,211,153,.8) !important}
.user-drop__head .avatar-img.hd-ava,.user-drop__head .avatar-preset.hd-ava{
  box-shadow:0 0 0 2px rgba(52,211,153,.45),0 10px 24px -12px rgba(52,211,153,.9) !important}

/* ---- notification bell (header + topbar) ---- */
.nbell{position:relative;display:inline-flex;flex:0 0 auto}
.nbell__btn{position:relative;display:grid;place-items:center;width:36px;height:36px;border-radius:12px;cursor:pointer;
  color:var(--muted);background:rgba(52,211,153,.05);border:1px solid var(--line-2);transition:.22s}
.nbell__btn:hover,.nbell.is-open .nbell__btn{color:#9BEBFF;border-color:rgba(52,211,153,.5);
  background:rgba(52,211,153,.1);box-shadow:0 0 16px -6px rgba(52,211,153,.7)}
.nbell__bdg{position:absolute;top:-5px;inset-inline-end:-5px;min-width:17px;height:17px;padding:0 4px;border-radius:999px;
  display:grid;place-items:center;font-family:var(--font-mono,monospace);font-size:.56rem;font-weight:700;letter-spacing:.02em;
  color:#04141C;background:#34D399;box-shadow:0 0 10px -2px rgba(52,211,153,.8);border:1px solid rgba(52,211,153,.9)}
.nbell__drop{position:absolute;top:calc(100% + 10px);inset-inline-end:0;z-index:80;width:min(340px,86vw);
  background:var(--panel,#0A1512);border:1px solid var(--line-2);border-radius:16px;padding:14px;
  box-shadow:0 30px 70px -30px rgba(0,0,0,.85),0 0 0 1px rgba(52,211,153,.08),0 24px 52px -30px rgba(52,211,153,.35);
  animation:nbellIn .18s ease}
@keyframes nbellIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.nbell__head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:2px 2px 10px;
  border-bottom:1px solid var(--line-2);margin-bottom:8px}
.nbell__head strong{font-size:.86rem;letter-spacing:.02em;color:#F2FEFF}
.nbell__mark{background:none;border:0;cursor:pointer;color:#9BEBFF;font-size:.68rem;letter-spacing:.03em;padding:0}
.nbell__mark:hover{text-decoration:underline}
.nbell__list{max-height:320px;overflow-y:auto;display:flex;flex-direction:column;gap:2px}
.nbell__empty{padding:22px 8px;text-align:center;color:var(--muted-2);font-size:.74rem}
.nbell__item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:12px;text-decoration:none;
  border:1px solid transparent;transition:.18s}
.nbell__item:hover{background:rgba(52,211,153,.06);border-color:rgba(52,211,153,.18)}
.nbell__item .nbell__ava{width:32px;height:32px;border-radius:50%;object-fit:cover;flex:0 0 auto;box-shadow:0 0 0 2px rgba(52,211,153,.45),0 0 10px -2px rgba(52,211,153,.5)}
.nbell__wrap{min-width:0;display:flex;flex-direction:column;gap:2px}
.nbell__txt{font-size:.74rem;line-height:1.35;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;color:#C9E9E4}
.nbell__meta{font-size:.62rem;color:var(--muted-2);font-family:var(--font-mono,monospace)}
.nbell__txt b,.nbell__who{color:#7FF3FF;font-weight:700;text-shadow:0 0 12px rgba(52,211,153,.35)}
.nbell__item.is-unread .nbell__txt{font-weight:700;color:#F2FEFF;text-shadow:0 0 14px rgba(52,211,153,.25)}
.nbell__item.is-unread::after{content:'';width:7px;height:7px;border-radius:50%;background:#34D399;flex:0 0 auto;
  align-self:center;box-shadow:0 0 8px rgba(52,211,153,.9)}
.nbell__all{display:block;margin-top:8px;padding:9px 0 2px;text-align:center;color:#9BEBFF;font-size:.72rem;
  letter-spacing:.03em;text-decoration:none;border-top:1px solid var(--line-2)}
.nbell__all:hover{text-decoration:underline}
@media (prefers-reduced-motion: reduce){
  .nbell__drop{animation:none}
  .nbell__btn,.nbell__item{transition:none}
}

/* ---- notifications feed page (/notifications) ---- */
.nfeed{max-width:860px}
.nfeed__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.nfeed__head h3{margin:0}
.nfeed__list{display:flex;flex-direction:column;gap:4px}
.nfeed__row{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:14px;text-decoration:none;
  border:1px solid var(--line-2);background:rgba(255,255,255,.02);transition:.2s}
.nfeed__row:hover{border-color:rgba(52,211,153,.35);box-shadow:0 12px 30px -20px rgba(52,211,153,.7)}
.nfeed__row .nfeed__ava{flex:0 0 auto;border-radius:50%;box-shadow:0 0 0 2px rgba(52,211,153,.45),0 0 10px -2px rgba(52,211,153,.5)}
.nfeed__body{min-width:0;display:flex;flex-direction:column;gap:3px;flex:1 1 auto}
.nfeed__txt{font-size:.88rem;line-height:1.4;color:#E3FBF6}
.nfeed__txt b{color:#7FF3FF;font-weight:700;text-shadow:0 0 12px rgba(52,211,153,.35)}
.nfeed__meta{font-size:.68rem;color:var(--muted-2);font-family:var(--font-mono,monospace);direction:ltr;text-align:start}
.nfeed__dot{width:8px;height:8px;border-radius:50%;background:#34D399;flex:0 0 auto;align-self:center;
  box-shadow:0 0 10px rgba(52,211,153,.9)}
.nfeed__row.is-unread{background:rgba(52,211,153,.05);border-color:rgba(52,211,153,.25)}
.nfeed__empty{padding:48px 20px;text-align:center;color:var(--muted-2)}
.nfeed__empty p{margin:12px 0 0;font-size:.85rem}
.nfeed__pager{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:16px}
.nfeed__pg{font-size:.72rem;color:var(--muted-2)}
.rtl .nfeed__meta{direction:ltr;text-align:end}
/* light-theme legibility: the bright hexes above are hardcoded for the dark theme */
html[data-theme="light"] .nbell__head strong{color:#17130C}
html[data-theme="light"] .nbell__mark,html[data-theme="light"] .nbell__all{color:#0E7490}
html[data-theme="light"] .nbell__txt{color:rgba(23,19,12,.82)}
html[data-theme="light"] .nbell__item.is-unread .nbell__txt{color:#17130C;text-shadow:none}
html[data-theme="light"] .nbell__txt b,html[data-theme="light"] .nbell__who{color:#0E7490;text-shadow:none}
html[data-theme="light"] .nfeed__txt{color:rgba(23,19,12,.82)}
html[data-theme="light"] .nfeed__txt b{color:#0E7490;text-shadow:none}
html[data-theme="light"] .nbell__item .nbell__ava,
html[data-theme="light"] .nfeed__row .nfeed__ava{box-shadow:0 0 0 2px rgba(6,182,212,.55),0 0 10px -2px rgba(6,182,212,.4)}

/* ---- profile posts (Facebook/Twitter-style composer + feed) ---- */
.prx-composer{padding:16px}
.prx-composer__row{display:flex;gap:12px;align-items:flex-start}
.prx-composer__row .prx-ava{flex:0 0 auto}
.prx-composer__row textarea{flex:1 1 auto;min-height:74px;resize:vertical;background:rgba(52,211,153,.04);
  border:1px solid var(--line-2);border-radius:12px;padding:10px 12px;color:var(--ink,#F2FEFF);font:inherit;font-size:.88rem}
.prx-composer__row textarea:focus{outline:none;border-color:rgba(52,211,153,.55);box-shadow:0 0 0 3px rgba(52,211,153,.12)}
.prx-composer__bar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line-2);flex-wrap:wrap}
.prx-composer__photo{display:inline-flex;align-items:center;gap:8px;cursor:pointer;color:#9BEBFF;font-size:.74rem;min-width:0;
  padding:8px 12px;border-radius:999px;border:1px solid rgba(52,211,153,.35);background:rgba(52,211,153,.06);transition:.2s}
.prx-composer__photo:hover{background:rgba(52,211,153,.12);border-color:rgba(52,211,153,.55)}
.prx-composer__photo input[type=file]{display:none}
.prx-composer__file{font-family:var(--font-mono,monospace);font-weight:400;font-size:.62rem;color:var(--muted-2);
  max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prx-post{padding:16px}
.prx-post__head{display:flex;align-items:center;gap:10px}
.prx-post__who{min-width:0;display:flex;flex-direction:column;gap:2px}
.prx-post__who b{font-size:.9rem}
.prx-post__who .mono{font-size:.62rem;color:var(--muted-2)}
.prx-post__time{margin-inline-start:auto;font-size:.62rem;color:var(--muted-2);flex:0 0 auto}
.prx-post__del{margin-inline-start:6px;flex:0 0 auto}
.prx-post__del button{background:none;border:1px solid transparent;border-radius:9px;color:var(--muted);cursor:pointer;
  display:grid;place-items:center;width:28px;height:28px;padding:0;transition:.2s}
.prx-post__del button:hover{color:#F472B6;border-color:rgba(244,114,182,.4);background:rgba(244,114,182,.08)}
.prx-post__body{margin:10px 0 0;font-size:.9rem;line-height:1.55;word-wrap:break-word;overflow-wrap:anywhere}
.prx-post__img{display:block;margin-top:12px;border-radius:14px;overflow:hidden;border:1px solid var(--line-2);max-width:560px}
.prx-post__img img{display:block;width:100%;max-height:420px;object-fit:cover}
.prx-post--empty p{margin:0;text-align:center;color:var(--muted-2);font-size:.85rem}

/* ---- post reactions + comments (Facebook-style) ---- */
.prx-post__foot{margin-top:12px;border-top:1px dashed var(--line-2);padding-top:10px}
.prx-react-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.prx-react-chip{display:inline-flex;align-items:center;gap:4px;background:rgba(52,211,153,.08);
  border:1px solid rgba(52,211,153,.35);border-radius:999px;padding:1px 8px 1px 4px;font-size:.72rem}
.prx-react-chip i{font-style:normal;font-size:.85rem;line-height:1}
.prx-react-chip b{font-weight:600;color:var(--fg)}
.prx-react-note{margin-inline-start:auto;font-size:.7rem;color:var(--muted-2)}
.prx-post__actions{display:flex;align-items:center;gap:10px;margin-top:9px}
.prx-react{position:relative;display:inline-block}
.prx-react__btn{display:inline-flex;align-items:center;gap:7px;background:none;cursor:pointer;
  border:1px solid var(--line-2);border-radius:999px;padding:5px 14px;color:var(--muted);
  font-size:.8rem;font-weight:500;transition:.18s}
.prx-react__btn:hover{border-color:rgba(52,211,153,.5);color:var(--fg);background:rgba(52,211,153,.06)}
.prx-react__btn.is-on{border-color:transparent;background:rgba(52,211,153,.1)}
.prx-react__btn.rxt-love.is-on{color:#FF4E6A;background:rgba(244,114,182,.12)}
.prx-react__btn.rxt-like.is-on{color:#34D399}
.prx-react__btn.rxt-haha.is-on{color:#FACC15}
.prx-react__btn.rxt-wow.is-on{color:#FB923C}
.prx-react__btn.rxt-sad.is-on{color:#60A5FA}
.prx-react__btn.rxt-angry.is-on{color:#EF4444}
.prx-react__face{font-style:normal;font-size:.95rem;line-height:1}
.prx-picker{position:absolute;bottom:calc(100% + 8px);inset-inline-start:-6px;z-index:30;display:flex;gap:2px;
  background:rgba(7,26,20,.97);border:1px solid var(--line-2);border-radius:999px;padding:4px 6px;
  box-shadow:0 14px 34px -12px rgba(0,0,0,.65);opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s}
.prx-react:hover .prx-picker,.prx-react:focus-within .prx-picker{opacity:1;visibility:visible;transform:translateY(0)}
.prx-picker__e{background:none;border:none;cursor:pointer;font-size:1.15rem;line-height:1;padding:4px 6px;
  border-radius:999px;transition:.15s}
.prx-picker__e:hover{transform:scale(1.28)}
.prx-picker__e.is-mine{background:rgba(52,211,153,.16);box-shadow:0 0 0 1px rgba(52,211,153,.5)}
.prx-comments{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.prx-comment{display:flex;align-items:flex-start;gap:8px}
.prx-comment__bubble{min-width:0;background:rgba(255,255,255,.035);border:1px solid var(--line-2);
  border-radius:14px;border-start-start-radius:4px;padding:7px 12px;max-width:100%}
.prx-comment__who{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.prx-comment__who b{font-size:.78rem}
.prx-comment__who .mono{font-size:.6rem;color:var(--muted-2)}
.prx-comment__bubble p{margin:2px 0 3px;font-size:.82rem;line-height:1.5;white-space:pre-wrap;
  word-wrap:break-word;overflow-wrap:anywhere}
.prx-comment__bubble time{font-size:.6rem;color:var(--muted-2)}
.prx-comment__del{flex:0 0 auto}
.prx-comment__del button{background:none;border:1px solid transparent;border-radius:9px;color:var(--muted);
  cursor:pointer;font-size:.9rem;width:26px;height:26px;display:grid;place-items:center;padding:0;transition:.2s}
.prx-comment__del button:hover{color:#F472B6;border-color:rgba(244,114,182,.4);background:rgba(244,114,182,.08)}
.prx-comment__form{display:flex;align-items:center;gap:8px;margin-top:2px}
.prx-comment__form input{flex:1;min-width:0;background:rgba(255,255,255,.035);border:1px solid var(--line-2);
  border-radius:999px;padding:7px 14px;color:var(--fg);font-size:.82rem;outline:none;transition:.18s}
.prx-comment__form input:focus{border-color:rgba(52,211,153,.6);box-shadow:0 0 0 3px rgba(52,211,153,.1)}
.prx-comment__form button{background:rgba(52,211,153,.12);border:1px solid rgba(52,211,153,.4);border-radius:999px;
  color:#7FF3FF;cursor:pointer;width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;transition:.18s}
.prx-comment__form button:hover{background:rgba(52,211,153,.24)}
.prx-comment__form button:disabled{opacity:.5;cursor:wait}
.prx-ava-mini{width:28px;height:28px;border-radius:50%;flex:0 0 auto;overflow:hidden;display:grid;place-items:center;
  background:rgba(52,211,153,.1);border:1px solid rgba(52,211,153,.4);color:#7FF3FF;font-size:.75rem;font-weight:600}
.prx-ava-mini img{width:100%;height:100%;object-fit:cover;border-radius:50%}

/* ---- photo viewer overlay (Facebook-style lightbox) ---- */
.prx-lb{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;flex-direction:column;
  background:rgba(2,10,8,.92);backdrop-filter:blur(6px)}
.prx-lb.is-open{display:flex}
.prx-lb__fig{margin:0;max-width:min(92vw,1200px);display:flex;flex-direction:column;align-items:center}
.prx-lb__img{max-width:92vw;max-height:76vh;object-fit:contain;border-radius:10px;
  border:1px solid rgba(52,211,153,.25);background:#04120d}
.prx-lb__cap{max-width:min(92vw,720px);margin-top:14px;text-align:center;color:var(--fg)}
.prx-lb__who{display:flex;align-items:baseline;justify-content:center;gap:10px;flex-wrap:wrap}
.prx-lb__who b{font-size:1rem}
.prx-lb__who .mono{font-size:.68rem;color:var(--muted-2)}
.prx-lb__cap p{margin:6px 0 0;font-size:.9rem;line-height:1.6;color:#cfe9e2;white-space:pre-wrap;
  word-wrap:break-word;overflow-wrap:anywhere}
.prx-lb__count{position:absolute;top:18px;inset-inline-start:22px;font-size:.78rem;color:var(--muted-2)}
.prx-lb__close{position:absolute;top:14px;inset-inline-end:18px;z-index:2;background:rgba(255,255,255,.07);
  border:1px solid var(--line-2);border-radius:50%;width:40px;height:40px;color:var(--fg);font-size:1.15rem;
  cursor:pointer;transition:.18s}
.prx-lb__close:hover{background:rgba(244,114,182,.18);border-color:rgba(244,114,182,.5);color:#FFB7D0}
.prx-lb__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;background:rgba(255,255,255,.06);
  border:1px solid var(--line-2);border-radius:50%;width:46px;height:46px;color:var(--fg);font-size:1.6rem;
  line-height:1;cursor:pointer;transition:.18s;user-select:none}
.prx-lb__nav:hover{background:rgba(52,211,153,.14);border-color:rgba(52,211,153,.5)}
.prx-lb__prev{inset-inline-start:18px}
.prx-lb__next{inset-inline-end:18px}
body.prx-lb-open{overflow:hidden}
.prx-post__img{cursor:zoom-in}

/* ---- comment threads: votes (like/dislike) + inline replies (Facebook-style) ---- */
.prx-comment{display:grid;grid-template-columns:28px minmax(0,1fr);gap:4px 8px;align-items:start}
.prx-comment__bubble{grid-column:2}
.prx-comment__actions{grid-column:2;display:flex;align-items:center;flex-wrap:wrap;gap:2px;margin:-2px 0 0}
.prx-cvote,.prx-reply-btn{background:none;border:0;cursor:pointer;font:inherit;font-size:.67rem;color:var(--muted);
  display:inline-flex;align-items:center;gap:5px;padding:2px 7px;border-radius:8px;line-height:1.4;transition:.15s}
.prx-cvote b{font-weight:600}
.prx-cvote b[hidden]{display:none}
.prx-cvote:hover,.prx-reply-btn:hover{color:#7FF3FF;background:rgba(52,211,153,.09)}
.prx-cvote.is-on[data-cv="like"]{color:#34D399}
.prx-cvote.is-on[data-cv="dislike"]{color:#F472B6}
.prx-reply-btn{padding-block:3px}
.prx-comment__actions .prx-comment__del{margin-inline-start:auto}
.prx-comment__rep{display:block;font-size:.72rem;color:#6BD4FF;padding-inline-start:2px}
.prx-comment__replies{grid-column:2;display:flex;flex-direction:column;gap:8px;margin:2px 0 2px 1px;
  padding-inline-start:12px;border-inline-start:2px solid rgba(52,211,153,.18)}
.prx-comment__replies:empty{display:none}
.prx-comment__form[hidden]{display:none}
.prx-comment > form.prx-reply-form{grid-column:1 / -1;margin-inline-start:36px;margin-block-start:2px}

/* =============================================== PRICING v2 (2026-10-21) */
.billing-toggle{position:relative}
.billing-toggle__ink{position:absolute;z-index:0;top:4px;bottom:4px;left:4px;width:calc(50% - 8px);
  border-radius:999px;background:linear-gradient(115deg,var(--lime),#9BE87A);
  box-shadow:0 8px 26px -10px rgba(52,211,153,.75);
  transition:left .32s var(--ease,ease),width .32s var(--ease,ease)}
.billing-toggle button{position:relative;z-index:1;background:transparent}
.billing-toggle button.is-active{background:transparent;color:#04121C}

.pr-title{color:#F2FEFF;text-shadow:0 2px 40px rgba(52,211,153,.28)}
.pr-chips{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:18px}
.pr-chip{display:inline-flex;align-items:center;gap:8px;font-size:.76rem;color:var(--muted);
  border:1px solid var(--line-2);border-radius:999px;padding:7px 14px;background:rgba(255,255,255,.02);
  transition:border-color .25s}
.pr-chip:hover{border-color:color-mix(in srgb,var(--lime,#34D399) 45%,transparent)}
.pr-chip i{width:6px;height:6px;border-radius:999px;background:var(--lime);box-shadow:0 0 10px var(--lime);
  animation:prBlink 2.6s ease-in-out infinite}
.pr-chip:nth-child(2) i{animation-delay:.5s}
.pr-chip:nth-child(3) i{animation-delay:1s}
@keyframes prBlink{0%,100%{opacity:1}50%{opacity:.3}}

.plan-grid{gap:18px}
.plan{isolation:isolate;translate:0 0;
  transition:opacity .8s var(--ease,ease),transform .8s var(--ease,ease),translate .32s var(--ease,ease),
             border-color .35s,box-shadow .4s var(--ease,ease)}
.plan:hover{translate:0 -8px;border-color:rgba(52,211,153,.4);
  box-shadow:0 36px 96px -58px rgba(52,211,153,.6)}
.plan__beam{position:absolute;inset:0;z-index:0;display:block;border-radius:inherit;padding:1px;opacity:0;pointer-events:none;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  transition:opacity .45s var(--ease,ease);overflow:hidden}
.plan__beam i{position:absolute;inset:-120%;display:block;
  background:conic-gradient(transparent 0 78%,color-mix(in srgb,var(--lime,#34D399) 85%,transparent) 88%,
             color-mix(in srgb,var(--rose,#F472B6) 85%,transparent) 96%,transparent 100%)}
.plan:hover .plan__beam,.plan:focus-within .plan__beam{opacity:1}
.plan:hover .plan__beam i,.plan:focus-within .plan__beam i,.plan--hot .plan__beam i{animation:prRot 4.2s linear infinite}
.plan--hot .plan__beam{opacity:.95}
.plan--hot .plan__beam i{animation:prRot 6.5s linear infinite}
@keyframes prRot{to{transform:rotate(360deg)}}
.plan--hot{animation:prHot 4.6s ease-in-out infinite}
@keyframes prHot{0%,100%{box-shadow:0 30px 80px -50px rgba(52,211,153,.8)}
  50%{box-shadow:0 36px 110px -46px rgba(52,211,153,1)}}

.plan__ribbon{position:static;align-self:center;display:inline-flex;align-items:center;gap:6px;
  margin:0 0 10px;padding:5px 14px;border-radius:999px;color:#04121C;
  font-size:.68rem;font-weight:700;letter-spacing:.08em;
  background:linear-gradient(90deg,var(--lime),#9BE87A 55%,var(--lime));background-size:200% 100%;
  box-shadow:0 10px 30px -12px rgba(52,211,153,.8);
  animation:ribFloat 3.6s ease-in-out infinite alternate,ucShimmer 5s linear infinite}
.plan__ribbon i{font-style:normal;font-weight:400}
@keyframes ribFloat{from{transform:translateY(-2px)}to{transform:translateY(2px)}}
.plan__tag{align-self:center;display:flex;align-items:center;min-height:26px;text-align:center}

.plan__price{align-items:baseline;gap:10px;margin:4px 0 16px;min-height:58px}
.plan__price b{display:inline-block;font-size:2.55rem;font-weight:700;letter-spacing:-.02em;
  color:#F2FEFF;text-shadow:0 2px 26px rgba(52,211,153,.35)}
.plan--hot .plan__price b{text-shadow:0 2px 30px rgba(52,211,153,.5),0 0 60px rgba(52,211,153,.22)}
.plan__price b.is-flash{animation:prFlash .55s var(--ease,ease)}
@keyframes prFlash{0%{transform:scale(.88);opacity:.3}55%{transform:scale(1.06)}100%{transform:scale(1);opacity:1}}
.plan__price [data-unit]{border:1px solid var(--line-2);border-radius:999px;padding:3px 10px;
  font-size:.7rem;color:var(--muted-2);background:rgba(255,255,255,.03);white-space:nowrap}

.plan .btn{margin-top:auto}
.plan__list{margin:14px 0 16px;flex:1}
.plan__list li{opacity:0;transform:translateY(9px)}
.plan.uc-reveal.in .plan__list li{animation:prLi .55s var(--ease,ease) both}
.plan__list li:nth-child(1){animation-delay:.1s}
.plan__list li:nth-child(2){animation-delay:.17s}
.plan__list li:nth-child(3){animation-delay:.24s}
.plan__list li:nth-child(4){animation-delay:.31s}
.plan__list li:nth-child(5){animation-delay:.38s}
.plan__list li:nth-child(6){animation-delay:.45s}
.plan__list li:nth-child(7){animation-delay:.52s}
.plan__list li:nth-child(8){animation-delay:.59s}
@keyframes prLi{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}

.compare th.is-hot,.compare td.is-hot{background:rgba(52,211,153,.055)}
.compare thead th.is-hot{box-shadow:inset 0 -2px 0 var(--lime)}

.pr-tico{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;color:var(--lime);
  background:rgba(52,211,153,.08);box-shadow:inset 0 0 0 1px rgba(52,211,153,.28),0 10px 26px -18px rgba(52,211,153,.6);
  animation:prBreath 3.6s ease-in-out infinite}
.pr-tico svg{width:20px;height:20px}
.pr-trust .card:nth-child(1) .pr-tico{animation-delay:0s}
.pr-trust .card:nth-child(2) .pr-tico{animation-delay:.55s}
.pr-trust .card:nth-child(3) .pr-tico{animation-delay:1.1s}
@keyframes prBreath{0%,100%{box-shadow:inset 0 0 0 1px rgba(52,211,153,.28),0 10px 26px -18px rgba(52,211,153,.6)}
  50%{box-shadow:inset 0 0 0 1px rgba(52,211,153,.48),0 14px 36px -16px rgba(52,211,153,.85)}}

.pr-cta{position:relative;isolation:isolate;overflow:hidden;margin-top:44px;text-align:center;
  border:1px solid var(--line-2);border-radius:28px;padding:58px 26px;
  background:radial-gradient(120% 130% at 50% 0%,rgba(52,211,153,.10),transparent 55%),
             linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.012))}
.pr-cta::before{content:"";position:absolute;top:-150px;left:50%;width:440px;height:440px;margin-left:-220px;z-index:-1;
  border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(52,211,153,.22),transparent 62%);
  animation:prDrift 9s ease-in-out infinite alternate}
.pr-cta__orb{position:absolute;bottom:-150px;inset-inline-start:6%;width:380px;height:380px;z-index:-1;
  border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(244,114,182,.16),transparent 65%);
  animation:prDrift 11s ease-in-out infinite alternate;animation-delay:-4s}
@keyframes prDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(46px,30px,0) scale(1.06)}}
.pr-cta h2{font-size:clamp(1.5rem,3vw,2.2rem);position:relative;z-index:1}
.pr-cta .sub{margin-inline:auto;margin-top:10px;position:relative;z-index:1}
.pr-cta__btn{margin-top:24px;padding:15px 40px;font-size:1.02rem;position:relative;z-index:1}
.pr-cta__note{margin-top:16px;font-size:.78rem;color:var(--muted-2);position:relative;z-index:1}

/* light theme — pricing v2 */
html[data-theme="light"] .pr-title{color:#17130C;text-shadow:none}
html[data-theme="light"] .pr-chip{background:#fff}
html[data-theme="light"] .plan__price b{color:#17130C;text-shadow:none}
html[data-theme="light"] .plan--hot .plan__price b{color:#047857;text-shadow:none}
html[data-theme="light"] .plan__ribbon{background:linear-gradient(90deg,var(--lime),#0aa576 55%,var(--lime))}
html[data-theme="light"] .pr-tico{background:rgba(4,120,87,.07);color:#047857;
  box-shadow:inset 0 0 0 1px rgba(4,120,87,.3),0 10px 26px -18px rgba(4,120,87,.5)}
html[data-theme="light"] .pr-cta{background:#fff;border-color:var(--line);
  box-shadow:0 1px 2px rgba(23,19,12,.04),0 22px 60px -40px rgba(23,19,12,.2)}
html[data-theme="light"] .pr-cta::before{background:radial-gradient(circle,rgba(4,120,87,.10),transparent 62%)}
html[data-theme="light"] .pr-cta__orb{background:radial-gradient(circle,rgba(244,114,182,.09),transparent 65%)}
html[data-theme="light"] .compare th.is-hot,html[data-theme="light"] .compare td.is-hot{background:rgba(4,120,87,.06)}
html[data-theme="light"] .billing-toggle__ink{box-shadow:0 8px 26px -12px rgba(4,120,87,.55)}

@media (prefers-reduced-motion: reduce){
  .billing-toggle__ink{transition:none}
  .pr-chip i,.pr-tico,.plan__ribbon,.plan--hot,.plan__price b.is-flash{animation:none}
  .pr-cta::before,.pr-cta__orb{animation:none}
  .plan__list li{opacity:1;transform:none;animation:none}
  .plan:hover{translate:0 0}
  .plan--hot .plan__beam,.plan--hot .plan__beam i{animation:none}
}

/* =========================================================
   STOREFRONT — cart / checkout / payment / receipts
   ========================================================= */

/* ---- header bag chip ---- */
.cart-chip{position:relative;display:inline-flex;width:34px;height:34px;border-radius:11px;
  align-items:center;justify-content:center;border:1px solid var(--line);color:var(--text);
  background:rgba(255,255,255,.03);transition:.25s;flex:0 0 auto}
.cart-chip svg{width:16px;height:16px;opacity:.85}
.cart-chip__n{position:absolute;top:-5px;inset-inline-end:-6px;min-width:16px;height:16px;padding:0 4px;
  border-radius:999px;background:#F472B6;color:#fff;font-size:.58rem;font-weight:800;
  display:flex;align-items:center;justify-content:center;box-shadow:0 0 10px rgba(244,114,182,.55)}
.cart-chip:hover{border-color:rgba(52,211,153,.55);box-shadow:0 0 14px rgba(52,211,153,.25);transform:translateY(-1px)}

/* ---- shared storefront bits ---- */
.st-title{font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.15;margin:10px 0 8px}
.st-h3{margin:0 0 12px;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2)}
.st-panel{padding:22px}
.st-note{font-size:.74rem;color:var(--muted-2);line-height:1.6;margin-top:6px}
.st-rail{display:grid;gap:16px}
.st-2col{gap:0 14px}
.st-cardfield{display:flex;flex-direction:column}
[data-newcard].is-hidden{display:none}
.st-check{display:flex;align-items:center;gap:9px;font-size:.82rem;color:var(--text);cursor:pointer;margin:14px 0 4px}
.st-check input{accent-color:#34D399;width:16px;height:16px}

/* ---- steps rail ---- */
.st-steps{display:flex;align-items:center;gap:10px;margin:26px 0;flex-wrap:wrap}
.st-step{display:inline-flex;align-items:center;gap:8px;font-size:.78rem;color:var(--muted);opacity:.65}
.st-step i{width:22px;height:22px;border-radius:8px;border:1px solid var(--line);font-style:normal;
  font-size:.68rem;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono,monospace);font-style:normal}
.st-step.is-on{color:var(--text);opacity:1}
.st-step.is-on i{color:#05070C;background:linear-gradient(135deg,#34D399,#4de2ff);border-color:transparent;
  font-weight:700;animation:stPulse 2.4s ease-in-out infinite}
@keyframes stPulse{0%,100%{box-shadow:0 0 0 0 rgba(52,211,153,.45)}50%{box-shadow:0 0 0 6px rgba(52,211,153,0)}}
.st-step__dot{width:4px;height:4px;border-radius:50%;background:var(--line-2)}

/* ---- cart page ---- */
.st-item{display:flex;gap:16px;padding:18px;transition:.25s;transition-delay:var(--st-d,0ms)}
.st-item:hover{border-color:rgba(52,211,153,.3)}
.st-item__img{flex:0 0 92px;height:92px;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.st-item__img img{width:100%;height:100%;object-fit:cover}
.st-item__glyph{display:flex;width:100%;height:100%;align-items:center;justify-content:center;color:#9BEBFF;
  background:radial-gradient(120px 90px at 30% 20%,rgba(52,211,153,.14),transparent 70%)}
.st-item__glyph svg{width:34px;height:34px}
.st-item__body{flex:1;min-width:0}
.st-item__body h3{margin:8px 0 0;font-size:.98rem;line-height:1.35}
.st-item__side{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.st-item__price{font-family:var(--font-mono,monospace);font-size:1rem}
.st-tag{font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;padding:4px 10px;border-radius:999px;
  border:1px solid var(--line);color:var(--muted);width:max-content}
.st-tag--plan{color:#FFB4D9;border-color:rgba(244,114,182,.4);background:rgba(244,114,182,.07)}
.st-qty{font-family:var(--font-mono,monospace);min-width:26px;text-align:center;font-size:.92rem}
.st-qty__b{width:28px;height:28px;border-radius:9px;border:1px solid var(--line);background:rgba(255,255,255,.03);
  color:var(--text);font-size:.9rem;cursor:pointer;transition:.2s;line-height:1;font-family:var(--font-mono,monospace)}
.st-qty__b:hover{border-color:rgba(52,211,153,.6);color:#9BEBFF;box-shadow:0 0 10px rgba(52,211,153,.2)}
.st-remove{display:inline-flex;align-items:center;gap:6px;border:0;background:none;color:var(--muted-2);
  font-size:.68rem;cursor:pointer;transition:.2s;font-family:inherit;padding:0}
.st-remove:hover{color:#F472B6}

.st-empty{display:grid;justify-items:center;text-align:center;padding:64px 24px;gap:10px}
.st-empty__bag{width:120px;height:120px;color:var(--muted-2);animation:stFloat 3.4s ease-in-out infinite}
.st-empty__bag svg{width:100%;height:100%}
@keyframes stFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}

/* ---- summary rail ---- */
.st-summary{position:sticky;top:18px}
.st-summary__t{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2);margin:0 0 12px}
.st-total{padding-top:14px}
.st-total b{font-family:var(--font-mono,monospace);font-size:1.25rem}
.st-total span{color:var(--text);font-weight:600}
.st-checkout{margin-top:16px;position:relative;overflow:hidden}
.st-checkout::after{content:"";position:absolute;top:-60%;inset-inline-start:-40%;width:40%;height:220%;
  transform:rotate(18deg);pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);
  animation:stSweep 4.5s ease-in-out infinite}
@keyframes stSweep{0%,55%{inset-inline-start:-45%}85%,100%{inset-inline-start:135%}}
.st-trust{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:16px}
.st-trust span{font-size:.62rem;color:var(--muted-2);border:1px solid var(--line);border-radius:999px;padding:4px 10px}

/* ---- saved addresses / cards ---- */
.st-savedlist{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px}
.st-saved{position:relative;display:flex;flex-direction:column;gap:3px;align-items:flex-start;min-width:130px;
  padding:12px 14px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.03);
  color:var(--text);font-family:inherit;cursor:pointer;transition:.22s;text-align:start}
.st-saved b{font-size:.82rem}
.st-saved span{font-size:.68rem;color:var(--muted)}
.st-saved em{font-size:.62rem;color:var(--muted-2);letter-spacing:.06em}
.st-saved::before{content:"";position:absolute;top:9px;inset-inline-end:9px;width:7px;height:7px;border-radius:50%;
  background:var(--line-2);transition:.25s}
.st-saved.is-on{border-color:rgba(52,211,153,.6);
  box-shadow:0 0 0 3px rgba(52,211,153,.12),0 10px 24px -14px rgba(52,211,153,.4)}
.st-saved.is-on::before{background:#34D399;box-shadow:0 0 8px rgba(52,211,153,.8)}
.st-saved:hover{transform:translateY(-2px)}
.st-saved.is-default em{color:#9BEBFF}

/* ---- payment method tiles ---- */
.pm-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.pm-tile{position:relative;display:flex;flex-direction:column;gap:5px;padding:14px;border-radius:14px;
  border:1px solid var(--line);cursor:pointer;transition:.22s;background:rgba(255,255,255,.02)}
.pm-tile input{position:absolute;inset:0;opacity:0;pointer-events:none}
.pm-tile:hover{border-color:rgba(52,211,153,.35);transform:translateY(-2px)}
.pm-tile.is-on{border-color:rgba(52,211,153,.75);background:rgba(52,211,153,.06);
  box-shadow:0 0 0 3px rgba(52,211,153,.1),0 14px 30px -16px rgba(52,211,153,.45)}
.pm-ico{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  color:var(--muted);border:1px solid var(--line);transition:.25s;flex:0 0 auto}
.pm-ico svg{width:20px;height:20px;display:block}
.pm-tile.is-on .pm-ico{color:#34D399;border-color:rgba(52,211,153,.5);filter:drop-shadow(0 0 8px rgba(52,211,153,.6))}
.pm-tile b{font-size:.82rem}
.pm-note{font-size:.66rem;color:var(--muted-2);line-height:1.5}

/* ---- holo payment preview card (stays dark — like a real card) ---- */
.py-card{position:relative;max-width:430px;aspect-ratio:1.62;border-radius:18px;padding:22px;
  display:flex;flex-direction:column;justify-content:space-between;margin-bottom:20px;
  background:linear-gradient(130deg,#0A1A20 0%,#071018 45%,#120A1C 100%);
  border:1px solid rgba(52,211,153,.4);
  box-shadow:0 30px 60px -28px rgba(52,211,153,.35),0 12px 30px -16px rgba(0,0,0,.9);
  transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  transition:transform .18s ease-out;will-change:transform;overflow:hidden}
.py-card__ring{position:absolute;inset:-2px;border-radius:20px;padding:1.5px;pointer-events:none;
  background:conic-gradient(from 0deg,#34D399,transparent 12%,#F472B6 27%,transparent 45%,#FACC15 59%,transparent 76%,#34D399);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  animation:stSpin 6s linear infinite;opacity:.9}
@keyframes stSpin{to{transform:rotate(360deg)}}
.py-card::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.15;mix-blend-mode:color-dodge;
  background:linear-gradient(115deg,transparent 30%,rgba(52,211,153,.55) 38%,rgba(244,114,182,.55) 46%,rgba(250,204,21,.55) 54%,transparent 62%);
  background-size:280% 100%;animation:stHolo 8s ease-in-out infinite alternate}
@keyframes stHolo{from{background-position:0% 0}to{background-position:100% 0}}
.py-card.is-back::after{opacity:.4}
.py-card__top{display:flex;align-items:center;gap:12px}
.py-brand{margin-inline-start:auto;font-size:.7rem;letter-spacing:.3em;color:#34D399;font-weight:700;
  text-shadow:0 0 14px rgba(52,211,153,.6);direction:ltr}
.py-num{font-family:var(--font-mono,monospace);font-size:clamp(1.1rem,2.6vw,1.5rem);letter-spacing:.14em;
  color:#EAFCFF;text-shadow:0 0 22px rgba(52,211,153,.4);direction:ltr;white-space:pre}
.py-card__foot{display:flex;justify-content:space-between;gap:16px}
.py-lab{display:flex;flex-direction:column;gap:3px;font-size:.56rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--muted-2);min-width:0}
.py-lab b{font-size:.78rem;color:#EAFCFF;text-transform:none;letter-spacing:.08em;font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}

/* ---- offline method panel ---- */
.st-handle{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  margin:18px 0;padding:16px;border-radius:14px;border:1.5px dashed rgba(52,211,153,.5);
  background:rgba(52,211,153,.05)}
.st-handle > b{font-size:1.12rem;color:#9BEBFF;text-shadow:0 0 16px rgba(52,211,153,.5);letter-spacing:.06em}
.st-bank{margin-bottom:14px}
.st-bank .kv{font-size:.78rem;padding:7px 0}

/* ---- order receipt ---- */
.st-order-wrap{max-width:780px}
.st-receipt{position:relative}
.st-receipt__head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px}
.st-receipt__sum{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.st-receipt__sum b{font-family:var(--font-mono,monospace);font-size:1.4rem;color:#34D399;
  text-shadow:0 0 18px rgba(52,211,153,.4)}
.st-rows{margin:0}
.st-rows > div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;
  border-bottom:1px dashed var(--line);font-size:.8rem}
.st-rows dt{color:var(--muted-2);font-size:.74rem;flex:0 0 auto}
.st-rows dd{margin:0;text-align:end;max-width:62%;overflow-wrap:anywhere}
.st-tfoot td{border-top:1.5px solid var(--line-2);color:var(--text);font-weight:700;padding-top:10px}
.st-certlink{display:inline-flex;align-items:center;gap:5px;margin-top:4px;color:#9BEBFF;font-size:.74rem;
  text-decoration:none;border:1px solid rgba(52,211,153,.35);border-radius:999px;padding:3px 10px;transition:.2s}
.st-certlink:hover{background:rgba(52,211,153,.09)}
footer.st-receipt__foot{margin-top:18px;text-align:center;color:var(--muted-2);font-size:.62rem;letter-spacing:.08em}

/* ---- done / pending badges on receipts ---- */
.st-done{width:74px;height:74px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  margin-bottom:14px;color:#34D399;border:2px solid rgba(52,211,153,.5);background:rgba(52,211,153,.08);
  animation:stPop .7s cubic-bezier(.16,.8,.2,1) both}
.st-done svg{width:32px;height:32px}
.st-done--hold{color:#FACC15;border-color:rgba(250,204,21,.5);background:rgba(250,204,21,.07)}
@keyframes stPop{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.12)}100%{transform:scale(1);opacity:1}}

/* ---- responsive ---- */
@media (max-width:860px){
  .st-cart-grid{grid-template-columns:1fr !important}
  .st-summary{position:static}
  .st-item{flex-wrap:wrap}
  .st-item__side{flex-direction:row;width:100%;justify-content:space-between;align-items:center}
  .py-card{margin-inline:auto}
}

/* ---- light theme ---- */
[data-theme="light"] .st-item__glyph{color:#047857;background:radial-gradient(120px 90px at 30% 20%,rgba(4,120,87,.12),transparent 70%)}
[data-theme="light"] .st-item__img,[data-theme="light"] .pm-tile,[data-theme="light"] .st-saved,[data-theme="light"] .cart-chip{background:#fff}
[data-theme="light"] .pm-tile.is-on{background:rgba(52,211,153,.07)}
[data-theme="light"] .st-handle{background:rgba(52,211,153,.06);border-color:rgba(4,120,87,.35)}
[data-theme="light"] .st-handle > b{color:#047857;text-shadow:none}
[data-theme="light"] .st-receipt__sum b{text-shadow:none}
[data-theme="light"] .st-checkout::after{display:none}
[data-theme="light"] .st-step.is-on i{color:#fff}

/* ---- reduced motion ---- */
@media (prefers-reduced-motion: reduce){
  .cart-chip:hover{transform:none}
  .st-step.is-on i{animation:none}
  .py-card__ring,.py-card::after,.py-card .wv-card__sheen{animation:none}
  .st-checkout::after{display:none}
  .st-done,.st-empty__bag{animation:none}
  .st-saved:hover,.pm-tile:hover{transform:none}
  .st-item{transition:none}
}

/* ---- pay with wallet balance ---- */
.st-saved--funds{border-color:rgba(255,196,77,.4);
  background:linear-gradient(135deg,rgba(255,196,77,.09),rgba(52,211,153,.04))}
.st-saved--funds b{color:#FFD98A}
.st-saved--funds em{color:#F5C872;letter-spacing:.02em}
.st-saved--funds::before{background:#FFC44D;box-shadow:0 0 8px rgba(255,196,77,.75)}
.st-saved--funds.is-on{border-color:rgba(255,196,77,.8);
  box-shadow:0 0 0 3px rgba(255,196,77,.15),0 12px 26px -14px rgba(255,196,77,.5)}
.st-saved.is-off{opacity:.45;filter:grayscale(.35)}
.st-saved.is-off::before{opacity:.35}
.st-funds{position:relative;overflow:hidden;border-color:rgba(255,196,77,.45);
  background:linear-gradient(155deg,rgba(255,196,77,.07),rgba(52,211,153,.03))}
.st-funds::after{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:3px;border-radius:2px;
  background:linear-gradient(180deg,#FFC44D,#34D399)}
[data-funds-panel].is-hidden{display:none}

/* wallet balance — light theme */
[data-theme="light"] .st-saved--funds{background:linear-gradient(135deg,rgba(217,119,6,.10),rgba(4,120,87,.05))}
[data-theme="light"] .st-saved--funds b{color:#92400E}
[data-theme="light"] .st-saved--funds em{color:#B45309}
[data-theme="light"] .st-funds{border-color:rgba(217,119,6,.35);
  background:linear-gradient(155deg,rgba(217,119,6,.08),rgba(4,120,87,.04))}
[data-theme="light"] .st-funds::after{background:linear-gradient(180deg,#D97706,#047857)}

/* ============================================================= *
   GIFT CARDS — foil tickets, scratch-to-reveal, confetti
 * ============================================================= */
.gc-zone{margin-top:18px}
.gc-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.gc-head h2{margin:0;font-size:1.12rem;display:flex;align-items:center;gap:8px}
.gc-ico{font-style:normal;font-size:1.25rem;filter:drop-shadow(0 0 10px rgba(250,204,21,.5))}
.gc-sub{margin:4px 0 0;color:var(--muted);font-size:.8rem}

.gc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-bottom:16px}
.gc-card{position:relative;display:flex;flex-direction:column;gap:10px;border-radius:18px;padding:16px;isolation:isolate;
  background:linear-gradient(138deg,#241A05 0%,#3A2A08 42%,#1D1406 100%);
  border:1px solid rgba(250,204,21,.5);
  box-shadow:0 20px 44px -22px rgba(250,204,21,.4),inset 0 1px 0 rgba(255,236,170,.14)}
.gc-card::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(130px 70px at 86% 10%,rgba(250,204,21,.28),transparent 70%),
    radial-gradient(170px 100px at 8% 92%,rgba(52,211,153,.14),transparent 70%)}
.gc-card::after{content:"";position:absolute;top:-60%;bottom:-60%;left:-85%;width:52%;z-index:0;pointer-events:none;
  background:linear-gradient(100deg,transparent 12%,rgba(255,246,216,.2) 50%,transparent 88%);
  transform:rotate(14deg);animation:gcSheen 5.2s ease-in-out infinite}
@keyframes gcSheen{0%,55%{left:-85%}85%,100%{left:135%}}
.gc-top{display:flex;justify-content:space-between;align-items:center;gap:8px;position:relative;z-index:1}
.gc-badge{font-size:.6rem;font-weight:700;letter-spacing:.16em;color:#FACC15;border:1px solid rgba(250,204,21,.5);
  border-radius:999px;padding:3px 10px;background:rgba(250,204,21,.08)}
.gc-amount{font-weight:800;color:#FFE8A3;text-shadow:0 0 20px rgba(250,204,21,.5)}
.gc-mid{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;min-height:64px;
  padding:10px;border-radius:13px;border:1px dashed rgba(250,204,21,.35);background:rgba(0,0,0,.28);overflow:hidden}
.gc-code{font-size:1rem;letter-spacing:.1em;color:#EAF6FF;text-shadow:0 0 14px rgba(52,211,153,.35)}
.gc-scratch{position:absolute;inset:0;width:100%;height:100%;z-index:2;border-radius:13px;cursor:grab;touch-action:none;
  transition:opacity .5s ease .15s}
.gc-scratch:active{cursor:grabbing}
.gc-card.is-revealed .gc-scratch{opacity:0;pointer-events:none;transition:opacity .45s ease}
.gc-card.is-revealed{border-color:rgba(250,204,21,.85);
  box-shadow:0 22px 48px -22px rgba(250,204,21,.6),inset 0 1px 0 rgba(255,236,170,.2)}
.gc-card.is-used{filter:grayscale(.5);opacity:.72}
.gc-hint{margin:0;font-size:.68rem;color:#D8C58A;text-align:center;position:relative;z-index:1}
.gc-form{position:relative;z-index:1;margin:0}
.btn.gc-redeem{background:linear-gradient(135deg,#E9B834,#C79B22);border-color:#A57F1A;color:#2D2004;font-weight:700}
.btn.gc-redeem:hover{filter:brightness(1.08)}
.btn.gc-redeem::after{display:none}
.gc-serial{font-size:.6rem;letter-spacing:.14em;color:rgba(255,232,163,.5);text-align:center;position:relative;z-index:1}

.gc-open{margin:0 0 14px;padding:14px 16px}
.gc-open__lbl{display:block;font-size:.8rem;font-weight:700;margin-bottom:8px}
.gc-open__row{display:flex;gap:10px;flex-wrap:wrap}
.gc-open__row input{flex:1;min-width:200px}

.gc-used{margin-top:6px}
.gc-used h3{margin:0 0 8px;font-size:.95rem}
.gc-used__row{display:flex;flex-wrap:wrap;gap:8px}
.gc-usedchip{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:10px;
  border:1px solid var(--line);background:rgba(255,255,255,.03);font-size:.72rem}
.gc-usedchip b{color:#D8C58A}
.gc-usedchip i{font-style:normal}
.gc-usedchip em{font-style:normal;color:var(--muted)}
.gc-none{margin:6px 0 0;font-size:.8rem}

/* gift cards — light theme */
[data-theme="light"] .gc-card{background:linear-gradient(138deg,#FFF7E0 0%,#FFEFC2 42%,#FFF3D6 100%);
  border-color:#D9A93C;box-shadow:0 20px 40px -24px rgba(160,113,5,.45),inset 0 1px 0 #FFFDF6}
[data-theme="light"] .gc-card::before{background:
  radial-gradient(130px 70px at 86% 10%,rgba(212,160,15,.18),transparent 70%),
  radial-gradient(170px 100px at 8% 92%,rgba(4,120,87,.1),transparent 70%)}
[data-theme="light"] .gc-badge{color:#8A6300;border-color:rgba(138,99,0,.4);background:rgba(138,99,0,.06)}
[data-theme="light"] .gc-amount{color:#8A6300;text-shadow:none}
[data-theme="light"] .gc-mid{background:rgba(255,255,255,.6);border-color:rgba(138,99,0,.35)}
[data-theme="light"] .gc-code{color:#3D2E00;text-shadow:none}
[data-theme="light"] .gc-hint{color:#8A6300}
[data-theme="light"] .gc-serial{color:rgba(138,99,0,.6)}
[data-theme="light"] .gc-usedchip{background:rgba(138,99,0,.06);border-color:rgba(138,99,0,.25)}
[data-theme="light"] .gc-usedchip b{color:#8A6300}

@media (prefers-reduced-motion: reduce){
  .gc-card::after{animation:none;display:none}
  .gc-scratch{transition:none}
}

/* ================= services marketplace — mk-* ================= */
.mk-head{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.mk-title{margin:0;font-size:1.55rem;font-weight:800}
.mk-title{font-family:var(--font-display)}

.mk-search{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.mk-search .mk-q{flex:1;min-width:220px;max-width:520px;padding:11px 16px;border-radius:var(--r-sm);
  border:1px solid var(--line);background:var(--panel);color:var(--text);outline:none;transition:border-color .2s,box-shadow .2s}
.mk-search .mk-q:focus{border-color:var(--lime);box-shadow:0 0 0 3px var(--lime-dim)}
.mk-sort{display:flex;gap:6px;flex-wrap:wrap}

.mk-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.mk-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:var(--pill);
  border:1px solid var(--line);background:var(--panel);color:var(--muted);font-size:.8rem;
  text-decoration:none;transition:all .18s var(--ease)}
.mk-chip b{color:inherit;font-size:.74rem}
.mk-chip:hover{color:var(--text);border-color:var(--line-2);transform:translateY(-1px)}
.mk-chip.is-on{color:#001318;background:var(--lime);border-color:var(--lime);font-weight:700;
  box-shadow:0 6px 18px -8px rgba(52,211,153,.5)}

.mk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(272px,1fr));gap:18px}
.mk-card{display:flex;flex-direction:column;border-radius:var(--r-md);overflow:hidden;
  border:1px solid var(--line);background:var(--panel);text-decoration:none;color:var(--text);
  transition:transform .22s var(--ease),border-color .22s,box-shadow .22s}
.mk-card:hover{transform:translateY(-4px);border-color:rgba(52,211,153,.45);
  box-shadow:0 18px 40px -18px rgba(52,211,153,.28)}
.mk-card__media{position:relative;aspect-ratio:16/10;background:var(--ink-2);overflow:hidden}
.mk-card__media img{width:100%;height:100%;object-fit:cover;display:block}
.mk-card__ph{display:flex;width:100%;height:100%;align-items:center;justify-content:center;
  font-size:2.6rem;font-weight:800;color:var(--lime);opacity:.55;
  background:linear-gradient(135deg,var(--ink-2),var(--ink));font-family:var(--font-display)}
.mk-card__ph--big{font-size:4.2rem;border-radius:var(--r-md)}
.mk-card__cat{position:absolute;top:10px;inset-inline-start:10px;padding:4px 10px;border-radius:var(--pill);
  font-size:.68rem;font-weight:700;color:var(--lime);background:rgba(52,211,153,.12);
  border:1px solid rgba(52,211,153,.35);backdrop-filter:blur(6px)}
.mk-card__body{display:flex;flex-direction:column;gap:8px;padding:14px 16px 10px;flex:1}
.mk-card__title{margin:0;font-size:.95rem;font-weight:700;line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mk-card__seller{display:flex;align-items:center;gap:7px;font-size:.76rem;color:var(--muted)}
.mk-card__meta{display:flex;align-items:center;gap:8px;font-size:.76rem;flex-wrap:wrap;margin-top:auto}
.mk-card__price{display:flex;justify-content:space-between;align-items:center;gap:8px;
  padding:10px 16px;border-top:1px solid var(--line);background:rgba(52,211,153,.04)}
.mk-card__price b{font-size:1.02rem;color:var(--lime)}
.mk-dot{width:3px;height:3px;border-radius:50%;background:var(--muted);flex:none}
.mk-ava{border-radius:50%;flex:none;display:inline-block;vertical-align:middle}
.mk-ava--lg{box-shadow:0 0 0 2px rgba(52,211,153,.35),0 0 16px rgba(52,211,153,.25)}
.mk-stars{color:var(--nile);letter-spacing:2px;font-size:.82rem;white-space:nowrap}
.mk-stars--sm{font-size:.74rem}

.mk-empty{grid-column:1/-1;text-align:center;padding:56px 24px}
.mk-empty__ico{font-size:2.6rem;margin-bottom:8px;opacity:.8}
.mk-empty h3{margin:0 0 6px}
.mk-empty .btn{margin-top:14px}

.mk-pager{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:24px}

.mk-back{display:inline-flex;align-items:center;margin-bottom:14px;font-size:.82rem;
  color:var(--muted);text-decoration:none;transition:color .18s}
.mk-back:hover{color:var(--lime)}

.mk-detail{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,.9fr);gap:22px;align-items:start}
.mk-cover{overflow:hidden;padding:0}
.mk-cover__img{width:100%;max-height:420px;object-fit:cover;display:block}
.mk-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin-top:12px}
.mk-gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-sm);
  border:1px solid var(--line)}
.mk-h1{margin:0 0 10px;font-size:1.35rem;font-weight:800;line-height:1.5}
.mk-sub{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:.8rem;color:var(--muted)}
.mk-sub > span{display:inline-flex;align-items:center;gap:6px}
.mk-desc{margin-top:14px;font-size:.9rem;line-height:2;opacity:.92;
  overflow-wrap:anywhere;white-space:pre-wrap}

.mk-note{padding:14px 16px;font-size:.84rem;line-height:1.7}
.mk-note--warn{border-inline-start:3px solid var(--amber)}
.mk-delivered{border-inline-start:3px solid var(--ok)}

.mk-review{padding:14px 0;border-bottom:1px dashed var(--line)}
.mk-review:last-child{border-bottom:0}
.mk-review__head{display:flex;align-items:center;gap:10px}
.mk-review__head > div{flex:1;min-width:0}
.mk-review__body{margin:8px 0 0;font-size:.86rem;line-height:1.8}
.mk-reply{margin-top:10px;padding:10px 12px;border-radius:var(--r-sm);font-size:.8rem;line-height:1.7;
  background:rgba(52,211,153,.06);border:1px solid rgba(52,211,153,.2)}

.mk-seller{display:flex;align-items:center;gap:12px;padding:16px;margin-bottom:14px}
.mk-packs{display:flex;flex-direction:column;gap:12px}
.mk-pack{padding:16px;position:relative}
.mk-pack.is-hot{border-color:rgba(52,211,153,.5);box-shadow:0 12px 30px -14px rgba(52,211,153,.3)}
.mk-pack__price{font-size:1.25rem;font-weight:700;color:var(--lime);margin-bottom:8px}
.mk-pack__list{list-style:none;margin:0 0 12px;padding:0;font-size:.8rem;color:var(--muted);
  display:flex;flex-direction:column;gap:6px}
.mk-note-in{width:100%;padding:10px 12px;border-radius:var(--r-sm);border:1px solid var(--line);
  background:var(--ink-2);color:var(--text);font:inherit;font-size:.82rem;resize:vertical;outline:none}
.mk-note-in:focus{border-color:var(--lime);box-shadow:0 0 0 3px var(--lime-dim)}
select.mk-rate, .mk-form textarea, .mk-form select, .mk-oacts textarea{width:100%;padding:10px 12px;
  border-radius:var(--r-sm);border:1px solid var(--line);background:var(--ink-2);color:var(--text);
  font:inherit;font-size:.86rem;outline:none}
select.mk-rate:focus, .mk-form textarea:focus, .mk-form select:focus{border-color:var(--lime);
  box-shadow:0 0 0 3px var(--lime-dim)}

.mk-sum-gig{font-weight:700}
.mk-sum-note{margin:10px 0;padding:10px 12px;border-radius:var(--r-sm);background:var(--panel);
  border:1px dashed var(--line);font-size:.78rem}

/* order page */
.mk-ostate{padding:16px}
.mk-ostate--awaiting,.mk-ostate--cancelled{border-inline-start:3px solid var(--amber)}
.mk-ostate--active,.mk-ostate--delivered,.mk-ostate--completed{border-inline-start:3px solid var(--ok)}
.mk-ostate--disputed{border-inline-start:3px solid var(--rose)}
.mk-ostate__row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.mk-osb--awaiting,.mk-osb--cancelled{color:var(--nile);border-color:rgba(250,204,21,.4);background:rgba(250,204,21,.08)}
.mk-osb--active,.mk-osb--delivered,.mk-osb--completed{color:var(--ok);border-color:rgba(44,229,167,.4);background:rgba(44,229,167,.08)}
.mk-osb--disputed{color:var(--rose);border-color:rgba(244,114,182,.4);background:rgba(244,114,182,.08)}
.mk-osum .kv{font-size:.82rem}
.mk-ostate__people{display:flex;gap:18px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px dashed var(--line)}
.mk-ostate__people > div{display:flex;align-items:center;gap:7px}
.mk-oacts{display:flex;flex-direction:column;gap:2px}
.mk-olink{color:var(--lime);text-decoration:none;font-size:inherit}
.mk-olink:hover{text-decoration:underline}
.mk-details summary{cursor:pointer;font-size:.82rem;color:var(--muted);padding:6px 0;list-style:none}
.mk-details summary::-webkit-details-marker{display:none}
.mk-details summary:hover{color:var(--lime)}
.mk-details textarea, .mk-details input{width:100%;padding:9px 12px;border-radius:var(--r-sm);
  border:1px solid var(--line);background:var(--ink-2);color:var(--text);font:inherit;font-size:.8rem;
  resize:vertical;outline:none}
.mk-details textarea:focus, .mk-details input:focus{border-color:var(--lime)}

/* dashboards */
.mk-dhead{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.mk-gigs{display:flex;flex-direction:column;gap:12px}
.mk-gigrow{display:grid;grid-template-columns:96px minmax(0,1fr) auto auto;gap:16px;align-items:center;padding:12px 16px}
.mk-gigrow__media{width:96px;height:64px;border-radius:var(--r-sm);overflow:hidden;flex:none;
  background:var(--ink-2);display:flex;align-items:center;justify-content:center}
.mk-gigrow__media img{width:100%;height:100%;object-fit:cover;display:block}
.mk-gigrow__media .mk-card__ph{font-size:1.4rem}
.mk-gigrow__title{display:block;font-size:.9rem}
.mk-gigrow__meta{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.mk-gigrow__acts{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.mk-rejnote{margin-top:8px;font-size:.76rem;color:var(--amber);line-height:1.6}
.mk-stat-link{color:var(--lime);font-size:.8rem;text-decoration:none}
.mk-stat-link:hover{text-decoration:underline}
.acts .mk-details summary{padding:0}

.mk-orow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px;margin-bottom:12px}
.mk-orow__media{display:none}
.mk-orow__head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.mk-orow__gig{font-size:.92rem}
.mk-orow__buyer{display:flex;align-items:center;gap:7px;margin-top:10px;font-size:.78rem;color:var(--muted)}
.mk-orow__side{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex:none}
.mk-thumb{width:74px;height:52px;object-fit:cover;border-radius:8px;border:1px solid var(--line);
  margin-top:8px;display:block}

.mk-form{max-width:860px;padding:20px}
.mk-form .field > label{font-size:.78rem;font-weight:700;color:var(--muted)}
.mk-form__foot{margin-top:20px;padding-top:16px;border-top:1px dashed var(--line)}
.mk-2col{align-items:end}
.mk-3col{align-items:end}

@media (max-width:960px){
  .mk-detail{grid-template-columns:1fr}
  .mk-gigrow{grid-template-columns:72px minmax(0,1fr) auto}
  .mk-gigrow__meta{display:none}
  .mk-gigrow__media{width:72px;height:52px}
}
@media (max-width:640px){
  .mk-orow{grid-template-columns:1fr}
  .mk-orow__side{align-items:stretch}
  .mk-orow__side .btn{width:100%}
  .mk-orow__media{display:block;width:100%;height:150px;margin-bottom:12px}
  .mk-orow__media img,.mk-orow__media .mk-card__ph{width:100%;height:100%;border-radius:var(--r-sm)}
  .mk-orow__media .mk-card__ph{display:flex}
}
@media (max-width:520px){
  .mk-gigrow{grid-template-columns:1fr}
  .mk-gigrow__media{width:100%;height:120px}
  .mk-orow__side{flex-direction:row;justify-content:space-between;align-items:center}
}

/* marketplace — light theme */
[data-theme="light"] .mk-card{background:#fff;border-color:#E2E8F0;box-shadow:0 2px 10px rgba(15,23,42,.05)}
[data-theme="light"] .mk-card:hover{border-color:rgba(4,116,142,.5);box-shadow:0 16px 34px -16px rgba(14,116,144,.3)}
[data-theme="light"] .mk-card__ph{background:linear-gradient(135deg,#E8EEF4,#F4F7FA);color:#0E7490;opacity:.5}
[data-theme="light"] .mk-card__price{background:rgba(6,182,212,.06);border-top-color:#EDF2F7}
[data-theme="light"] .mk-card__price b{color:#0E7490}
[data-theme="light"] .mk-card__cat{color:#0E7490;background:rgba(6,182,212,.1);border-color:rgba(6,182,212,.35)}
[data-theme="light"] .mk-chip{background:#fff;color:#64748B;border-color:#E2E8F0}
[data-theme="light"] .mk-chip:hover{color:#0F172A;border-color:#CBD5E1}
[data-theme="light"] .mk-chip.is-on{color:#fff;background:#0891B2;border-color:#0891B2;box-shadow:0 6px 16px -6px rgba(8,145,178,.5)}
[data-theme="light"] .mk-search .mk-q{background:#fff;border-color:#E2E8F0}
[data-theme="light"] .mk-search .mk-q:focus{border-color:#0891B2;box-shadow:0 0 0 3px rgba(8,145,178,.15)}
[data-theme="light"] .mk-pack.is-hot{border-color:rgba(8,145,178,.45);box-shadow:0 12px 26px -12px rgba(8,145,178,.25)}
[data-theme="light"] .mk-pack__price{color:#0E7490}
[data-theme="light"] .mk-reply{background:rgba(8,145,178,.05);border-color:rgba(8,145,178,.2)}
[data-theme="light"] .mk-note-in, [data-theme="light"] .mk-details textarea,
[data-theme="light"] .mk-details input, [data-theme="light"] select.mk-rate,
[data-theme="light"] .mk-form textarea, [data-theme="light"] .mk-form select,
[data-theme="light"] .mk-oacts textarea{background:#fff;border-color:#E2E8F0;color:#0F172A}
[data-theme="light"] .mk-olink{color:#0E7490}
[data-theme="light"] .mk-stat-link{color:#0E7490}
[data-theme="light"] .mk-back:hover{color:#0E7490}
[data-theme="light"] .mk-osb--awaiting,[data-theme="light"] .mk-osb--cancelled{color:#A16207;border-color:rgba(161,98,7,.35);background:rgba(250,204,21,.14)}
[data-theme="light"] .mk-osb--active,[data-theme="light"] .mk-osb--delivered,
[data-theme="light"] .mk-osb--completed{color:#047857;border-color:rgba(4,120,87,.35);background:rgba(16,185,129,.12)}
[data-theme="light"] .mk-osb--disputed{color:#BE185D;border-color:rgba(190,24,93,.3);background:rgba(244,63,94,.1)}
[data-theme="light"] .mk-delivered{border-inline-start-color:#10B981}
[data-theme="light"] .mk-note--warn{border-inline-start-color:#F59E0B}
[data-theme="light"] .mk-ostate--active,[data-theme="light"] .mk-ostate--delivered,
[data-theme="light"] .mk-ostate--completed{border-inline-start-color:#10B981}
[data-theme="light"] .mk-ostate--awaiting,[data-theme="light"] .mk-ostate--cancelled{border-inline-start-color:#F59E0B}
[data-theme="light"] .mk-ostate--disputed{border-inline-start-color:#F43F5E}
[data-theme="light"] .mk-rejnote{color:#B45309}
[data-theme="light"] .mk-stars{color:#D97706}

@media (prefers-reduced-motion: reduce){
  .mk-card,.mk-chip,.mk-card__media img{transition:none}
  .mk-card:hover{transform:none}
}

/* =====================================================================
   ADMIN NEXUS — command-center shell + live deck (2026-10-21)
   Namespace: nx-* (shell) · cc-* (command center) · loaded AFTER app.css
   ===================================================================== */
#nxAurora{position:fixed;inset:0;z-index:-1;pointer-events:none;display:block}
#nxSpot{position:fixed;left:0;top:0;width:400px;height:400px;z-index:0;pointer-events:none;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--lime) 14%,transparent) 0%,transparent 62%);
  mix-blend-mode:screen;opacity:0;transition:opacity .5s}
#nxScrim{position:fixed;inset:0;z-index:55;background:rgba(2,4,8,.6);backdrop-filter:blur(3px);
  opacity:0;visibility:hidden;transition:.3s}
#nxScrim.on{opacity:1;visibility:visible}

.nx-shell{grid-template-columns:272px minmax(0,1fr);gap:0}
.nx-body{min-width:0;display:flex;flex-direction:column;position:relative;z-index:1}
.nx-main{padding:26px 30px 34px}
.nx-foot{display:flex;align-items:center;gap:10px;justify-content:center;padding:14px 20px 22px;
  font:500 11px/1 "Space Grotesk",monospace;letter-spacing:.22em;color:var(--muted);text-transform:uppercase}
.nx-foot em{font-style:normal;letter-spacing:.12em;opacity:.65;text-transform:none}
.nx-foot .nx-foot__brand{margin-inline-start:auto;opacity:.4}
.nx-led{width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 10px 2px color-mix(in srgb,var(--lime) 55%,transparent);animation:nxLed 2.2s ease-in-out infinite}
@keyframes nxLed{0%,100%{opacity:1}50%{opacity:.35}}

/* ---------------------------------------------------------- sidebar */
.nx-side{display:flex;flex-direction:column;gap:16px;padding:24px 16px 20px;position:sticky;top:0;height:100vh;overflow-y:auto;
  background:color-mix(in srgb,var(--panel) 78%,transparent);backdrop-filter:blur(20px);
  border-inline-end:1px solid color-mix(in srgb,var(--lime) 12%,transparent);
  box-shadow:inset -14px 0 34px -22px color-mix(in srgb,var(--lime) 26%,transparent)}
.nx-brand{display:grid;gap:8px;justify-items:center;padding-bottom:14px;border-bottom:1px dashed rgba(128,152,200,.18)}
.nx-brand .side-brand{display:block}
.nx-mark{font:700 11px/1 "Space Grotesk",system-ui;letter-spacing:.42em;color:var(--text);
  background:linear-gradient(90deg,var(--lime),var(--rose));-webkit-background-clip:text;background-clip:text;color:transparent}
.nx-ver{font-size:9px;letter-spacing:.18em;color:var(--muted);opacity:.8}
.nx-clock{display:grid;gap:3px;justify-items:center;padding:10px 12px;border:1px solid rgba(52,211,153,.14);border-radius:12px;
  background:color-mix(in srgb,var(--lime) 5%,transparent)}
.nx-clock b{font:700 1.05rem/1 "Space Grotesk",monospace;color:var(--lime);letter-spacing:.14em;text-shadow:0 0 14px color-mix(in srgb,var(--lime) 45%,transparent);font-variant-numeric:tabular-nums}
.nx-clock span{font:500 9px/1 "Space Grotesk",monospace;letter-spacing:.3em;color:var(--muted)}

.nx-navs{display:grid;gap:16px;flex:1}
.nx-group{display:grid;gap:3px;counter-reset:nxg}
.nx-glbl{display:flex;align-items:center;gap:8px;font:700 9px/1 "Space Grotesk",system-ui;letter-spacing:.32em;
  color:var(--muted);text-transform:uppercase;padding:0 10px 6px;opacity:.85}
.nx-glbl::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(52,211,153,.28),transparent)}
.nx-group a{position:relative;display:flex;align-items:center;gap:8px;padding:9px 12px 9px 38px;border-radius:10px;
  color:var(--muted);font-size:.88rem;border:1px solid transparent;transition:color .25s,background .25s,transform .25s}
.nx-group a::before{counter-increment:nxg;content:counter(nxg,decimal-leading-zero);position:absolute;inset-inline-start:12px;
  font:600 9px/1 "Space Grotesk",monospace;letter-spacing:.05em;color:rgba(52,211,153,.33);transition:.25s}
.nx-group a::after{content:"";position:absolute;inset-inline-start:0;top:16%;width:2px;height:68%;border-radius:2px;
  background:linear-gradient(180deg,var(--lime),transparent);opacity:0;transform:scaleY(.2);transition:.3s}
[dir="rtl"] .nx-group a{padding:9px 38px 9px 12px}
[dir="rtl"] .nx-group a::after{inset-inline-start:auto;inset-inline-end:0}
.nx-group a:hover{color:var(--text);background:color-mix(in srgb,var(--lime) 6%,transparent);transform:none}
.nx-group a:hover::before{color:var(--lime)}
.nx-group a.active{color:var(--lime);background:color-mix(in srgb,var(--lime) 9%,transparent);
  border-color:color-mix(in srgb,var(--lime) 22%,transparent);
  box-shadow:0 8px 22px -14px color-mix(in srgb,var(--lime) 70%,transparent)}
.nx-group a.active::before{color:var(--lime)}
.nx-group a.active::after{opacity:1;transform:scaleY(1)}
.nx-live{width:6px;height:6px;border-radius:50%;background:var(--ok);margin-inline-start:2px;
  box-shadow:0 0 8px 2px color-mix(in srgb,var(--ok) 60%,transparent);animation:nxLed 1.6s ease-in-out infinite}
.nx-badge{margin-inline-start:auto;font:700 10px/1 "Space Grotesk",monospace;padding:3px 7px;border-radius:99px;
  color:#FFB4CF;background:color-mix(in srgb,var(--rose) 20%,transparent);border:1px solid color-mix(in srgb,var(--rose) 34%,transparent);
  box-shadow:0 0 12px -3px color-mix(in srgb,var(--rose) 55%,transparent)}
.nx-badge:empty{display:none}

/* burger + drawer */
.nx-burger{display:none;position:fixed;inset-block-start:14px;inset-inline-start:14px;z-index:70;width:44px;height:44px;
  border-radius:12px;border:1px solid rgba(52,211,153,.25);background:color-mix(in srgb,var(--panel) 88%,transparent);
  backdrop-filter:blur(10px);cursor:pointer}
.nx-burger i{display:block;width:18px;height:2px;margin:3px auto;background:var(--lime);border-radius:2px;transition:.3s}
.nx-shell.nx-open ~ .nx-burger,.nx-body .nx-burger{display:none}
.nx-shell.nx-open .nx-side{transform:none!important}
.nx-shell.nx-open ~ #nxScrim{opacity:1;visibility:visible}

/* entrance choreography */
@keyframes ccIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.cc-hero,.cc-kpi,.cc-card,.cc-deckwrap{animation:ccIn .6s cubic-bezier(.2,.8,.3,1) both}
.cc-kpi:nth-child(1){animation-delay:.03s}.cc-kpi:nth-child(2){animation-delay:.08s}
.cc-kpi:nth-child(3){animation-delay:.13s}.cc-kpi:nth-child(4){animation-delay:.18s}
.cc-kpi:nth-child(5){animation-delay:.23s}.cc-kpi:nth-child(6){animation-delay:.28s}
.cc-kpi:nth-child(7){animation-delay:.33s}.cc-kpi:nth-child(8){animation-delay:.38s}
.cc-card:nth-child(2){animation-delay:.1s}.cc-card:nth-child(3){animation-delay:.16s}

/* ----------------------------------------------------------- hero */
.cc-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:18px}
.cc-hero h1{font-size:clamp(1.5rem,3.4vw,2.2rem);margin:0 0 4px;letter-spacing:-.01em}
.cc-hero .sub{margin:0}
.cc-hero__meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cc-live{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:99px;
  font:700 11px/1 "Space Grotesk",monospace;letter-spacing:.24em;color:var(--lime);
  background:color-mix(in srgb,var(--lime) 8%,transparent);border:1px solid color-mix(in srgb,var(--lime) 30%,transparent)}
.cc-live i{width:8px;height:8px;border-radius:50%;background:var(--lime);
  box-shadow:0 0 10px 3px color-mix(in srgb,var(--lime) 70%,transparent);animation:nxLed 1.4s ease-in-out infinite}
.cc-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:99px;font:500 11px/1 "Space Grotesk",monospace;
  color:var(--muted);background:rgba(128,152,200,.08);border:1px solid rgba(128,152,200,.22);text-decoration:none;transition:.25s}
a.cc-chip:hover{color:var(--lime);border-color:color-mix(in srgb,var(--lime) 40%,transparent)}

/* ------------------------------------------------------ KPI wall */
.cc-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}
.cc-kpi{position:relative;overflow:hidden;border-radius:var(--r,16px);padding:16px 16px 14px;
  background:color-mix(in srgb,var(--panel) 88%,transparent);border:1px solid rgba(128,152,200,.16);
  display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:start;min-width:0}
.cc-kpi::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;opacity:0;transition:opacity .4s;
  background:conic-gradient(from var(--a,0deg),transparent 0 40%,color-mix(in srgb,var(--lime) 60%,transparent) 50%,transparent 60% 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.cc-kpi:hover::before{opacity:1;animation:ccBeam 2.8s linear infinite}
@keyframes ccBeam{to{--a:360deg}}
.cc-kpi::after{content:"";position:absolute;inset-inline-end:-30px;top:-30px;width:110px;height:110px;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--lime) 10%,transparent),transparent 68%);pointer-events:none}
.cc-ico{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;grid-row:span 2;
  background:color-mix(in srgb,var(--lime) 9%,transparent);border:1px solid color-mix(in srgb,var(--lime) 22%,transparent)}
.cc-ico svg{width:19px;height:19px;fill:var(--lime)}
.cc-ico--gold{background:color-mix(in srgb,#FACC15 10%,transparent);border-color:color-mix(in srgb,#FACC15 26%,transparent)}
.cc-ico--gold svg{fill:#FACC15}
.cc-ico--teal{background:color-mix(in srgb,var(--ok) 10%,transparent);border-color:color-mix(in srgb,var(--ok) 26%,transparent)}
.cc-ico--teal svg{fill:var(--ok)}
.cc-ico--magenta{background:color-mix(in srgb,var(--rose) 10%,transparent);border-color:color-mix(in srgb,var(--rose) 26%,transparent)}
.cc-ico--magenta svg{fill:var(--rose)}
.cc-kpi .label{font-size:.72rem;font-weight:600;color:var(--muted);letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-kpi__v{font:700 1.5rem/1.05 "Space Grotesk",system-ui;color:var(--text);font-variant-numeric:tabular-nums;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-kpi .delta{grid-column:2;font-size:.72rem;color:var(--muted);display:flex;gap:4px;align-items:center;white-space:nowrap;overflow:hidden}
.cc-kpi .delta a{color:var(--lime);text-decoration:none}
@keyframes ccPop{0%{transform:scale(1)}38%{transform:scale(1.07);text-shadow:0 0 18px color-mix(in srgb,var(--lime) 55%,transparent)}100%{transform:scale(1)}}
.cc-kpi .cc-pop{display:inline-block;animation:ccPop .5s ease}

/* --------------------------------------------------- grid + cards */
.cc-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px;margin-bottom:16px}
.cc-card{position:relative;overflow:hidden;grid-column:span 4;border-radius:var(--r,16px);
  background:color-mix(in srgb,var(--panel) 90%,transparent);border:1px solid rgba(128,152,200,.16);
  box-shadow:0 24px 48px -32px rgba(2,6,14,.9);min-width:0}
.cc-card::before{content:"";position:absolute;inset-inline-start:0;right:0;top:0;height:1px;width:100%;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--lime) 55%,transparent),transparent);opacity:.5}
.cc-card:hover{border-color:color-mix(in srgb,var(--lime) 26%,transparent)}
.cc-card__head{display:flex;flex-direction:column;gap:2px;padding:16px 18px 8px}
.cc-card__head h3{margin:0;font-size:1rem;font-weight:700}
.cc-card__head .sub{margin:0;font-size:.76rem;color:var(--muted)}
.cc-legend{display:flex;gap:14px;margin-top:8px;font:500 11px/1 "Space Grotesk",monospace;color:var(--muted)}
.cc-legend span{display:inline-flex;align-items:center;gap:6px}
.cc-legend i{width:9px;height:9px;border-radius:3px;display:inline-block}
.cc-chart-wrap{position:relative;padding:8px 12px 10px}
.cc-chart-wrap svg{display:block;width:100%;height:auto}
.cc-tip{position:absolute;z-index:5;transform:translate(-50%,-120%);padding:6px 10px;border-radius:9px;
  font:600 11px/1.3 "Space Grotesk",monospace;color:var(--lime);white-space:nowrap;pointer-events:none;
  background:color-mix(in srgb,var(--panel) 94%,transparent);border:1px solid color-mix(in srgb,var(--lime) 32%,transparent);
  box-shadow:0 12px 30px -14px color-mix(in srgb,var(--lime) 45%,transparent)}

/* radar */
.cc-radar-wrap{display:grid;place-items:center;padding:10px 14px 4px}
#ccRadar{width:min(300px,100%);height:auto;display:block}
.cc-rlegend{display:grid;grid-template-columns:repeat(3,auto);gap:6px 14px;justify-content:center;padding:6px 14px 14px}
.cc-rl__row{display:flex;align-items:center;gap:6px;font:500 10px/1 "Space Grotesk",monospace;color:var(--muted)}
.cc-rl__row i{width:8px;height:8px;border-radius:50%;display:inline-block}
.cc-rl__row b{color:var(--text)}

/* donut */
.cc-donut-wrap{position:relative;display:grid;place-items:center;padding:10px 0 2px}
#ccDonut{width:min(212px,72%);height:auto}
.cc-donut__center{position:absolute;display:grid;gap:2px;justify-items:center;pointer-events:none}
.cc-donut__center b{font:700 1.7rem/1 "Space Grotesk",system-ui;color:var(--text);font-variant-numeric:tabular-nums}
.cc-donut__center span{font-size:.7rem;color:var(--muted);letter-spacing:.14em;text-transform:uppercase}
.cc-dlegend{display:grid;gap:5px;padding:10px 18px 14px}
.cc-dl__row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.78rem;color:var(--muted);
  border-bottom:1px dashed rgba(128,152,200,.16);padding-bottom:5px}
.cc-dl__row b{font:600 12px/1 "Space Grotesk",monospace;color:var(--text);font-variant-numeric:tabular-nums}
.cc-dl__row.is-zero{opacity:.38}

/* feed */
.cc-feed{list-style:none;margin:0;padding:6px 14px 14px;display:grid;gap:6px;max-height:330px;overflow:auto}
.cc-feed li{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:10px;font-size:.8rem;
  background:rgba(128,152,200,.06);border:1px solid rgba(128,152,200,.1);min-width:0}
.cc-feed li i{width:7px;height:7px;border-radius:50%;flex:none;background:var(--muted)}
.cc-feed li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-feed li b{margin-inline-start:auto;font:600 10px/1 "Space Grotesk",monospace;color:var(--muted);flex:none}
.cc-feed li.k-signup{--k:var(--ok)}
.cc-feed li.k-store{--k:#FACC15}
.cc-feed li.k-gig{--k:var(--rose)}
.cc-feed li.k-pay{--k:#F5A524}
.cc-feed li.k-admin{--k:#7FF3FF}
.cc-feed li[class*=" k-"] i,.cc-feed li[class^="k-"] i{background:var(--k);box-shadow:0 0 8px -1px var(--k)}
.cc-empty{padding:14px 4px;font-size:.8rem;color:var(--muted)}

/* approvals + broadcast */
.cc-qa{display:grid;gap:8px;padding:8px 14px 16px}
.cc-qa__row{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:10px;
  background:rgba(128,152,200,.06);border:1px solid rgba(128,152,200,.12)}
.cc-qa__info{display:grid;gap:2px;min-width:0}
.cc-qa__info b{font-size:.82rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-qa__info span{font-size:.7rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-qa__row form{margin-inline-start:auto;flex:none}
.cc-bc{display:grid;gap:10px;padding:8px 16px 16px}
.cc-bc textarea{background:rgba(2,6,14,.35);border:1px solid rgba(128,152,200,.24);border-radius:10px;color:var(--text);
  padding:10px 12px;font:inherit;font-size:.86rem;resize:vertical;min-height:74px;transition:.25s}
.cc-bc textarea:focus{outline:none;border-color:color-mix(in srgb,var(--lime) 45%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--lime) 12%,transparent)}
.cc-bc__meta{text-align:end;font-size:10px;color:var(--muted)}
.cc-hint{font-size:.72rem;margin:0}

/* control deck */
.cc-deck{margin-top:4px}
.cc-deck__head{margin-bottom:14px}
.cc-deck__head h2{font-size:1.25rem;margin:0 0 2px}
.cc-deck__head .sub{margin:0}
.cc-deckwrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.cc-dgroup{padding:14px;border-radius:var(--r,16px);background:color-mix(in srgb,var(--panel) 86%,transparent);
  border:1px solid rgba(128,152,200,.14)}
.cc-dtiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:9px}
.cc-dtile{position:relative;display:flex;align-items:center;gap:9px;padding:11px 12px;border-radius:11px;min-width:0;
  color:var(--text);text-decoration:none;font-size:.84rem;font-weight:600;overflow:hidden;
  background:color-mix(in srgb,var(--panel) 60%,transparent);border:1px solid rgba(128,152,200,.18);transition:.28s}
.cc-dtile::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;opacity:0;transition:opacity .35s;
  background:conic-gradient(from var(--a,0deg),transparent 0 42%,color-mix(in srgb,var(--rose) 62%,transparent) 50%,transparent 58% 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.cc-dtile:hover::before{opacity:1;animation:ccBeam 2.2s linear infinite}
@keyframes ccBeam{to{--a:360deg}}
.cc-dtile:hover{transform:translateY(-2px);border-color:transparent;
  box-shadow:0 14px 28px -16px color-mix(in srgb,var(--lime) 55%,transparent)}
.cc-di{font:600 10px/1 "Space Grotesk",monospace;color:rgba(52,211,153,.55);flex:none}
.cc-dtile span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-dtile .nx-badge{flex:none}

/* --------------------------------------------------- responsive */
@media (max-width:1180px){
  .cc-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cc-card.span8{grid-column:span 12}
  .cc-card.span4{grid-column:span 6}
  .cc-deckwrap{grid-template-columns:1fr 1fr}
}
@media (max-width:1080px){
  .nx-shell{grid-template-columns:1fr}
  .nx-burger{display:block!important;inset-inline-start:auto;inset-inline-end:14px}
  .nx-side{position:fixed;inset-block:0;inset-inline-start:0;width:min(300px,84vw);z-index:60;
    transform:translateX(-110%);transition:transform .35s cubic-bezier(.2,.8,.3,1);height:100dvh}
  [dir="rtl"] .nx-side{transform:translateX(110%)}
  .nx-shell.nx-open .nx-side{transform:none}
  .nx-main{padding:20px 16px 30px}
}
@media (max-width:760px){
  .cc-card.span4{grid-column:span 12}
  .cc-deckwrap{grid-template-columns:1fr}
  .cc-kpis{grid-template-columns:1fr 1fr}
  .cc-hero__meta{width:100%}
}

/* ------------------------------------------------- reduced motion */
@media (prefers-reduced-motion: reduce){
  #nxAurora,#nxSpot{display:none}
  .cc-hero,.cc-kpi,.cc-card,.cc-deckwrap{animation:none}
  .cc-kpi .cc-pop{animation:none}
  .nx-led,.cc-live i,.nx-live{animation:none}
  .cc-dtile,.cc-kpi{transition:none}
  .cc-dtile:hover{transform:none}
}

/* light theme — ink-safe overrides (LAST so they win ties) */
[data-theme="light"] .nx-side{background:rgba(255,255,255,.82);border-inline-end-color:rgba(23,19,12,.08);
  box-shadow:inset -14px 0 34px -24px rgba(8,145,178,.28)}
[data-theme="light"] .nx-clock{background:rgba(8,145,178,.06);border-color:rgba(8,145,178,.22)}
[data-theme="light"] .nx-clock b{color:#0E7490;text-shadow:none}
[data-theme="light"] .nx-foot{color:#5B6676}
[data-theme="light"] .nx-group a{color:#44505F}
[data-theme="light"] .nx-group a::before{color:rgba(8,145,178,.4)}
[data-theme="light"] .nx-group a.active{color:#0E7490;background:rgba(8,145,178,.08);border-color:rgba(8,145,178,.26)}
[data-theme="light"] .nx-badge{background:rgba(190,24,93,.1);color:#BE185D;border-color:rgba(190,24,93,.32)}
[data-theme="light"] .cc-kpi{background:#fff;border-color:#E2E8F0}
[data-theme="light"] .cc-kpi::after{background:radial-gradient(circle,rgba(8,145,178,.08),transparent 68%)}
[data-theme="light"] .cc-kpi__v{color:#17130C}
[data-theme="light"] .cc-ico{background:rgba(8,145,178,.08);border-color:rgba(8,145,178,.2)}
[data-theme="light"] .cc-ico svg{fill:#0891B2}
[data-theme="light"] .cc-ico--gold{background:rgba(217,119,6,.1);border-color:rgba(217,119,6,.26)}
[data-theme="light"] .cc-ico--gold svg{fill:#B45309}
[data-theme="light"] .cc-ico--teal{background:rgba(4,120,87,.08);border-color:rgba(4,120,87,.24)}
[data-theme="light"] .cc-ico--teal svg{fill:#047857}
[data-theme="light"] .cc-ico--magenta{background:rgba(190,24,93,.08);border-color:rgba(190,24,93,.24)}
[data-theme="light"] .cc-ico--magenta svg{fill:#BE185D}
[data-theme="light"] .cc-card{background:#fff;border-color:#E2E8F0;box-shadow:0 20px 40px -30px rgba(15,23,42,.35)}
[data-theme="light"] .cc-card::before{background:linear-gradient(90deg,transparent,rgba(8,145,178,.5),transparent)}
[data-theme="light"] .cc-card:hover{border-color:rgba(8,145,178,.4)}
[data-theme="light"] .cc-live{color:#0E7490;background:rgba(8,145,178,.07);border-color:rgba(8,145,178,.3)}
[data-theme="light"] .cc-live i{background:#0891B2;box-shadow:0 0 10px 3px rgba(8,145,178,.55)}
[data-theme="light"] .cc-chip{background:rgba(15,23,42,.04);border-color:#E2E8F0;color:#5B6676}
[data-theme="light"] .cc-legend{color:#5B6676}
[data-theme="light"] .cc-tip{background:#fff;color:#0E7490;border-color:rgba(8,145,178,.35);box-shadow:0 12px 30px -14px rgba(8,145,178,.4)}
[data-theme="light"] .cc-donut__center b{color:#17130C}
[data-theme="light"] .cc-dl__row{color:#44505F;border-bottom-color:rgba(23,19,12,.08)}
[data-theme="light"] .cc-dl__row b{color:#17130C}
[data-theme="light"] .cc-feed li{background:rgba(15,23,42,.03);border-color:#E5EAF0}
[data-theme="light"] .cc-feed li b{color:#5B6676}
[data-theme="light"] .cc-qa__row{background:rgba(15,23,42,.03);border-color:#E5EAF0}
[data-theme="light"] .cc-bc textarea{background:#fff;border-color:#E2E8F0;color:#17130C}
[data-theme="light"] .cc-dgroup{background:#fff;border-color:#E2E8F0}
[data-theme="light"] .cc-dtile{background:rgba(15,23,42,.02);border-color:#E5EAF0;color:#17130C}
[data-theme="light"] .cc-di{color:rgba(8,145,178,.65)}
[data-theme="light"] .cc-rlegend .cc-rl__row b{color:#17130C}
[data-theme="light"] #nxSpot{opacity:0!important;display:none}

/* =====================================================================
   PLAN BADGES (pl-badge) — live membership pill next to the name
   ===================================================================== */
.pl-badge{display:inline-flex;align-items:center;gap:5px;flex:none;vertical-align:middle;margin-inline-start:2px;
  font:700 9px/1 "Space Grotesk",system-ui;letter-spacing:.16em;text-transform:uppercase;
  padding:4px 9px 4px 7px;border-radius:99px;white-space:nowrap;position:relative;overflow:hidden;
  color:#7FF3FF;background:color-mix(in srgb,var(--lime) 9%,transparent);
  border:1px solid color-mix(in srgb,var(--lime) 38%,transparent);
  box-shadow:0 0 14px -5px color-mix(in srgb,var(--lime) 70%,transparent)}
.pl-badge i{font-style:normal;font-size:9px;line-height:1;transform:translateY(-.5px)}
.pl-badge b{font-weight:700}
.pl-badge--plus{
  color:#FFE9A8;
  background:linear-gradient(100deg,color-mix(in srgb,#FACC15 18%,transparent),color-mix(in srgb,var(--rose) 16%,transparent));
  border-color:color-mix(in srgb,#FACC15 55%,transparent);
  box-shadow:0 0 16px -4px color-mix(in srgb,#FACC15 55%,transparent),0 0 22px -8px color-mix(in srgb,var(--rose) 50%,transparent)}
.pl-badge--plus::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.34) 47%,transparent 62%);
  transform:translateX(-130%);animation:plSheen 3.4s cubic-bezier(.4,0,.2,1) infinite}
@keyframes plSheen{0%{transform:translateX(-130%)}55%,100%{transform:translateX(130%)}}
.pl-badge--teams{
  color:#B9FFE4;
  background:color-mix(in srgb,var(--ok) 10%,transparent);
  border-color:color-mix(in srgb,var(--ok) 40%,transparent);
  box-shadow:0 0 14px -5px color-mix(in srgb,var(--ok) 60%,transparent)}
.pl-badge--xl{font-size:11px;letter-spacing:.2em;padding:7px 14px 7px 10px;gap:7px}
.pl-badge--xl i{font-size:11px}
.user-chip__name .pl-badge,.user-drop__name .pl-badge{margin-inline-start:.45em}
.prx-nmrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.prx-nmrow h1{margin:0}
@media (prefers-reduced-motion: reduce){
  .pl-badge--plus::after{animation:none;transform:none;display:none}
}
[data-theme="light"] .pl-badge--pro{color:#0E7490;background:rgba(8,145,178,.08);
  border-color:rgba(8,145,178,.32);box-shadow:none}
[data-theme="light"] .pl-badge--plus{color:#9A6A06;
  background:linear-gradient(100deg,rgba(245,158,11,.16),rgba(190,24,93,.12));
  border-color:rgba(180,83,9,.4);box-shadow:none}
[data-theme="light"] .pl-badge--plus::after{
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.65) 47%,transparent 62%)}
[data-theme="light"] .pl-badge--teams{color:#047857;background:rgba(4,120,87,.08);
  border-color:rgba(4,120,87,.32);box-shadow:none}

/* ============================================================
   TRACK OUTLINE / LESSON LISTS — let lesson titles WRAP.
   The app.css base (.lesson-item .t) clipped long titles to one
   line (nowrap + ellipsis), so the outline box looked "too small
   for its text" — especially with Arabic lesson titles.
   Top-align the row parts so wrapped rows line up nicely.
   ============================================================ */
.lesson-item{align-items:flex-start}
.lesson-item .t{white-space:normal;overflow:visible;text-overflow:clip;
  line-height:1.7;overflow-wrap:break-word;padding-block:1px}
.lesson-item .n{padding-top:3px}
.lesson-item .badge,.lesson-item .muted-2{flex:0 0 auto;margin-top:2px}

/* ============================================================
   HEADER ANCHOR LANDINGS — html has scroll-behavior:smooth and the
   sticky header overlays the page top, so clicking "How it works" /
   "FAQ" landed the section heading BEHIND the header (CDP-measured
   howTop=-14px). Reserve header-height scroll padding so anchors
   land cleanly below it (bar was extended to h=89: .nav 88 + border).
   ============================================================ */
html{scroll-padding-top:104px}

/* ============================================================
   HEADER NAV — cyberpunk chamfered link plates.
   Bare rounded pills read as generic SaaS; the header should feel
   like a HUD strip. Links are now chamfered plates (clip-path cut
   corners instead of radius) with a thin neon edge; hover ignites a
   cyan→magenta gradient plate, and the "How it works" anchor keeps
   a permanent full gradient so it scans as the live action item.
   English links get uppercase HUD tracking; Arabic keeps natural
   letter-joining (no transform).
   ============================================================ */
:root{--na-cut:11px}
.nav{height:88px}
.nav-links{gap:5px}
.nav-links a{position:relative;padding:9px 18px;border-radius:0;border:0;
  color:var(--muted);font-weight:600;font-size:.88rem;letter-spacing:.02em;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.015));
  clip-path:polygon(var(--na-cut) 0,100% 0,100% calc(100% - var(--na-cut)),calc(100% - var(--na-cut)) 100%,0 100%,0 var(--na-cut));
  box-shadow:inset 0 0 0 1px rgba(52,211,153,.20);
  transition:.25s var(--ease)}
.nav-links a:hover{color:#DFF9FF;background:linear-gradient(90deg,rgba(52,211,153,.22),rgba(244,114,182,.18));
  box-shadow:inset 0 0 0 1px rgba(52,211,153,.55)}
.nav-links a.nav-how{color:#04121F;background:linear-gradient(90deg,#34D399,#2ED9FF 45%,#F472B6);
  box-shadow:inset 0 0 0 1px rgba(52,211,153,.35)}
.nav-links a.nav-how:hover{color:#04121F;background:linear-gradient(90deg,#33EBFF,#5CE0FF 45%,#FF5DAF)}
html[lang="en"] .nav-links a{letter-spacing:.05em;text-transform:uppercase;font-size:.8rem}
@media (max-width:1100px){
  .nav-links a{padding:8px 10px}
  .nav-links a{--na-cut:8px}
}
[data-theme="light"] .nav-links a{color:#42526E;background:linear-gradient(180deg,rgba(10,20,40,.045),rgba(10,20,40,.02));
  box-shadow:inset 0 0 0 1px rgba(10,20,40,.16)}
[data-theme="light"] .nav-links a:hover{color:#0B3B5C;background:linear-gradient(90deg,rgba(6,182,212,.16),rgba(219,39,119,.12));
  box-shadow:inset 0 0 0 1px rgba(6,182,212,.45)}
[data-theme="light"] .nav-links a.nav-how{color:#fff;background:linear-gradient(90deg,#0891B2,#DB2777)}
[data-theme="light"] .nav-links a.nav-how:hover{color:#fff;background:linear-gradient(90deg,#0AA6CC,#EE3D8C)}

/* ============================================================
   CHECKOUT VAULT BALANCE TILE — the "Account vault balance"
   method tile dims + disables when the stored balance can't
   cover the cart total; a wallet top-up link shows under the
   tiles. The payment page's vault panel reuses .st-funds.
   ============================================================ */
.pm-tile.is-off{opacity:.45}
.pm-tile.is-off:hover{transform:none;border-color:var(--line-2)}
.pm-topup{display:block;text-align:center;margin-top:10px;font-size:.8rem;color:var(--lime)}
.pm-topup:hover{text-decoration:underline}
[data-theme="light"] .pm-topup{color:#0891B2}

/* ============================================================
   ADMIN STAFF & ROLES — /admin/staff page + gold nav tab.
   Gold = admin-only surface, magenta = moderator accents.
   ============================================================ */
.nx-navs a.nx-gold span{color:#FACC15}
.nx-navs a.nx-gold:hover{background:rgba(250,204,21,.08)}
.nx-navs a.nx-gold.active{background:rgba(250,204,21,.1);box-shadow:inset 3px 0 0 #FACC15}
.stf-hero{margin-bottom:22px}
.stf-hero h1{font-size:2rem;margin:0 0 8px}
.stf-hero .sub{margin:0;color:#94A3B8;font-size:.95rem;max-width:72ch}
.stf-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 18px}
.stf-tile{position:relative;display:flex;flex-direction:column;gap:2px;padding:16px 18px;border:1px solid var(--line-2);border-radius:16px;background:rgba(255,255,255,.03)}
.stf-tile b{font-size:1.65rem;font-weight:800;line-height:1}
.stf-tile--a b{color:#FACC15}
.stf-tile--m b{color:#F472B6}
.stf-tile span{font-size:.82rem;color:#94A3B8}
.stf-tile .stf-dot{position:absolute;top:14px;inset-inline-end:14px}
.stf-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#34D399;box-shadow:0 0 10px rgba(52,211,153,.55);flex:none}
.stf-dot--m{background:#F472B6;box-shadow:0 0 10px rgba(244,114,182,.6)}
.stf-dot--a{background:#FACC15;box-shadow:0 0 10px rgba(250,204,21,.6)}
.stf-matrix{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0 0 22px}
.stf-mcard p{margin:6px 0;font-size:.9rem;line-height:1.65;color:var(--text)}
.stf-mcard .stf-no{color:#F472B6}
.stf-mcard h3{display:flex;align-items:center;gap:8px}
.stf-filters{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin:0 0 16px}
.stf-chips{display:flex;flex-wrap:wrap;gap:8px}
.stf-fchip{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--text);font-size:.85rem;text-decoration:none;transition:border-color .15s ease,background .15s ease}
.stf-fchip b{font-size:.72rem;padding:2px 8px;border-radius:999px;background:rgba(255,255,255,.07);color:#94A3B8}
.stf-fchip:hover{border-color:rgba(52,211,153,.45)}
.stf-fchip.is-on{border-color:#FACC15;background:rgba(250,204,21,.08);color:#FACC15}
.stf-fchip.is-on b{background:rgba(250,204,21,.14);color:#FACC15}
.stf-chip{display:inline-flex;align-items:center;padding:3px 10px;border-radius:999px;font-size:.75rem;font-weight:600;border:1px solid var(--line-2);color:var(--text)}
.stf-chip--admin{border-color:rgba(250,204,21,.45);color:#FACC15;background:rgba(250,204,21,.08)}
.stf-chip--moderator{border-color:rgba(244,114,182,.45);color:#F472B6;background:rgba(244,114,182,.08)}
.stf-you{font-size:.7rem;padding:2px 8px;border-radius:999px;border:1px solid var(--line-2);color:#94A3B8}
@media (max-width:980px){.stf-matrix{grid-template-columns:1fr}}
@media (max-width:640px){.stf-tiles{grid-template-columns:1fr}}
[data-theme="light"] .stf-tile{background:rgba(23,19,12,.03)}
[data-theme="light"] .stf-tile--a b{color:#B45309}
[data-theme="light"] .stf-tile--m b{color:#BE185D}
[data-theme="light"] .stf-chip--admin{color:#B45309;border-color:rgba(180,83,9,.4);background:rgba(180,83,9,.07)}
[data-theme="light"] .stf-chip--moderator{color:#BE185D;border-color:rgba(190,24,93,.4);background:rgba(190,24,93,.07)}
[data-theme="light"] .stf-fchip.is-on{color:#B45309;border-color:#B45309;background:rgba(180,83,9,.07)}
[data-theme="light"] .stf-fchip.is-on b{color:#B45309;background:rgba(180,83,9,.1)}
[data-theme="light"] .stf-mcard .stf-no{color:#BE185D}
[data-theme="light"] .nx-navs a.nx-gold span{color:#B45309}

/* ============================================================
   MESSENGER — Facebook-style two-pane chat + presence system.
   Rail = conversations with unread bubbles and live presence dots;
   pane = chat bubbles (mine cyan gradient / theirs dark glass),
   composer, and a status pill in the peer header that the 3s poll
   keeps fresh. Offsets use logical properties so RTL mirrors clean.
   ============================================================ */
.msg-app{display:grid;grid-template-columns:330px 1fr;gap:18px;align-items:stretch;min-height:min(70vh,640px)}
.msg-rail{border:1px solid var(--line-2);border-radius:18px;background:rgba(255,255,255,.02);overflow:hidden;display:flex;flex-direction:column}
.msg-rail__head{padding:16px 16px 10px}
.msg-rail__head h1{margin:0;font-size:1.22rem}
.msg-rail__head .sub{margin:4px 0 0;font-size:.78rem;color:var(--muted)}
.msg-self{display:flex;align-items:center;gap:8px;padding:10px 16px;border-top:1px solid var(--line-2)}
.msg-self__lb{font-size:.72rem;color:var(--muted);white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.msg-self select{flex:1;min-width:0;background:rgba(255,255,255,.04);border:1px solid var(--line-2);border-radius:var(--pill);padding:6px 10px;color:var(--text);font-size:.78rem;font-weight:600;cursor:pointer}
.msg-self select:focus{outline:none;border-color:rgba(52,211,153,.5);box-shadow:0 0 0 3px rgba(52,211,153,.1)}
.msg-list{overflow-y:auto;max-height:62vh;flex:1}
.msg-item{display:flex;gap:12px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line-2);text-decoration:none;transition:background .2s var(--ease)}
.msg-item:hover{background:rgba(52,211,153,.05)}
.msg-item.is-on{background:rgba(52,211,153,.08);box-shadow:inset 3px 0 0 #34D399}
.msg-item__av{position:relative;flex:none}
.msg-item__dot{position:absolute;inset-inline-end:-3px;bottom:-3px;box-shadow:0 0 0 3px rgba(9,14,26,.95)}
.msg-item__nb{position:absolute;top:-7px;inset-inline-end:-7px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#F472B6;color:#fff;font-size:.68rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 0 10px rgba(244,114,182,.5)}
.msg-item__txt{flex:1;min-width:0}
.msg-item__txt .nm{display:block;font-size:.9rem;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg-item__st{display:inline-flex;align-items:center;font-size:.7rem;color:var(--muted);margin:2px 0 3px}
.msg-item__txt .pv{display:block;font-size:.78rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg-item .tm{flex:none;font-size:.68rem;color:var(--muted)}
.msg-rail__empty{padding:30px 18px;text-align:center;color:var(--muted)}
.msg-rail__empty span{display:block;font-size:1.7rem;margin-bottom:8px}
.msg-rail__empty b{color:var(--text)}
.msg-rail__empty p{margin:4px 0 0;font-size:.8rem}
.msg-pane{border:1px solid var(--line-2);border-radius:18px;background:rgba(255,255,255,.02);display:flex;flex-direction:column;overflow:hidden}
.msg-pane__head{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line-2)}
.msg-pane__id{display:flex;flex-direction:column;gap:1px;min-width:0}
.msg-pane__id b{font-size:.95rem;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg-pane__id .mono{font-size:.72rem;color:var(--muted)}
.msg-pane__st{margin-inline-start:auto;display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border:1px solid var(--line-2);border-radius:var(--pill);background:rgba(255,255,255,.03);font-size:.74rem;font-weight:600;color:var(--muted);white-space:nowrap}
.msg-stream{flex:1;display:flex;flex-direction:column;gap:10px;padding:16px;overflow-y:auto;max-height:58vh;min-height:340px}
.msg-stream__hint{margin:auto;text-align:center;color:var(--muted);font-size:.84rem}
.msg-row{display:flex}
.msg-row.mine{justify-content:flex-end}
.msg-row.theirs{justify-content:flex-start}
.msg-b{max-width:78%;padding:10px 14px;border-radius:16px;border:1px solid transparent}
.msg-row.mine .msg-b{background:linear-gradient(180deg,rgba(52,211,153,.18),rgba(52,211,153,.09));border-color:rgba(52,211,153,.4);border-end-end-radius:5px;color:var(--text);box-shadow:0 0 14px rgba(52,211,153,.08)}
.msg-row.theirs .msg-b{background:rgba(255,255,255,.05);border-color:var(--line-2);border-end-start-radius:5px}
.msg-b p{margin:0;font-size:.88rem;line-height:1.55;white-space:pre-wrap;word-break:break-word}
.msg-b time{display:block;margin-top:4px;font-size:.63rem;color:var(--muted);text-align:end}
.msg-b__who{display:block;font-size:.66rem;font-weight:700;color:var(--muted);margin-bottom:3px}
.msg-comp{display:flex;gap:10px;align-items:flex-end;padding:12px 16px;border-top:1px solid var(--line-2)}
.msg-comp textarea{flex:1;min-width:0;resize:none;min-height:42px;max-height:120px;padding:10px 13px;border:1px solid var(--line-2);border-radius:13px;background:rgba(255,255,255,.04);color:var(--text);font-family:inherit;font-size:.88rem;line-height:1.45}
.msg-comp textarea:focus{outline:none;border-color:rgba(52,211,153,.5);box-shadow:0 0 0 3px rgba(52,211,153,.1)}
.msg-comp .btn{flex:none;border-radius:12px}
.msg-empty{margin:auto;text-align:center;padding:44px 20px;color:var(--muted)}
.msg-empty__ico{display:block;font-size:2.4rem;margin-bottom:10px;filter:drop-shadow(0 0 16px rgba(52,211,153,.4))}
.msg-empty h2{margin:0 0 6px;color:var(--text);font-size:1.05rem}
.msg-empty p{margin:0;font-size:.84rem}
/* presence dots — shared by rail, peer pill, admin surfaces, profile */
.msg-dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:rgba(148,163,184,.45);flex:none}
.msg-dot--online{background:#2FEB8F;box-shadow:0 0 8px rgba(47,235,143,.55)}
.msg-dot--away{background:#FFC53D;box-shadow:0 0 8px rgba(255,197,61,.45)}
.msg-dot--busy{background:#F472B6;box-shadow:0 0 8px rgba(244,114,182,.5)}
/* header unread chip — chamfered like the nav plates */
.msg-chip{display:inline-flex;align-items:center;gap:5px;padding:8px 13px;text-decoration:none;font-size:.95rem;color:var(--muted);background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.015));clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);box-shadow:inset 0 0 0 1px rgba(52,211,153,.2);transition:.25s var(--ease)}
.msg-chip:hover{color:#DFF9FF;background:linear-gradient(90deg,rgba(52,211,153,.22),rgba(244,114,182,.16))}
.msg-chip b{min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:#F472B6;color:#fff;font-size:.64rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 0 8px rgba(244,114,182,.45)}
/* profile entry point + public status chip */
.prx-st{display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border-radius:999px;border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--muted);font-size:.8rem;font-weight:600;white-space:nowrap}
@media (max-width:980px){
  .msg-app{grid-template-columns:1fr}
  .msg-pane{min-height:52vh}
  .msg-stream{max-height:44vh;min-height:260px}
}
[data-theme="light"] .msg-rail,[data-theme="light"] .msg-pane{background:rgba(255,255,255,.72)}
[data-theme="light"] .msg-item__dot{box-shadow:0 0 0 3px rgba(255,255,255,.9)}
[data-theme="light"] .msg-item.is-on{background:rgba(6,182,212,.09)}
[data-theme="light"] .msg-row.theirs .msg-b{background:rgba(10,20,40,.045)}
[data-theme="light"] .msg-row.mine .msg-b{background:linear-gradient(180deg,rgba(6,182,212,.13),rgba(6,182,212,.08));border-color:rgba(6,182,212,.45);box-shadow:none}
[data-theme="light"] .msg-comp textarea{background:rgba(10,20,40,.03)}
[data-theme="light"] .msg-self select{background:rgba(10,20,40,.03)}
[data-theme="light"] .msg-pane__st,[data-theme="light"] .prx-st{background:rgba(10,20,40,.03)}
[data-theme="light"] .msg-chip{color:#42526E;background:linear-gradient(180deg,rgba(10,20,40,.04),rgba(10,20,40,.02));box-shadow:inset 0 0 0 1px rgba(10,20,40,.15)}
[data-theme="light"] .msg-chip:hover{color:#0B3B5C}

/* ============ POPUP CHAT HEADS + WINDOWS (Facebook-style) ============ */
.msg-heads{position:fixed;inset-inline-end:84px;bottom:18px;display:flex;flex-direction:column;gap:10px;z-index:90}
.msg-head{position:relative;width:44px;height:44px;padding:0;border:0;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .18s ease}
.msg-head:hover{transform:translateY(-3px)}
.msg-head__av{position:relative;display:block;width:44px;height:44px}
.msg-head__av img{border-radius:50%;box-shadow:0 0 0 1px rgba(52,211,153,.4),0 12px 26px -14px rgba(0,0,0,.85)!important;transition:box-shadow .18s ease}
.msg-head:hover .msg-head__av img{box-shadow:0 0 0 1px rgba(52,211,153,.95),0 6px 22px -8px rgba(52,211,153,.55)!important}
.msg-head__dot{position:absolute;inset-block-end:-1px;inset-inline-start:-2px;box-shadow:0 0 0 3px #0A0E15}
.msg-head__nb{position:absolute;inset-block-start:-6px;inset-inline-end:-6px;min-width:19px;padding:2px 5px;border-radius:999px;background:#F472B6;color:#fff;font-size:10.5px;font-weight:800;line-height:1.25;text-align:center;box-shadow:0 4px 12px -4px rgba(244,114,182,.75)}
.msg-head::after{content:attr(data-name);position:absolute;inset-inline-end:calc(100% + 10px);inset-block-start:50%;transform:translateY(-50%) scale(.97);white-space:nowrap;font-size:11px;font-weight:600;color:#CFEFFF;background:rgba(7,10,16,.94);border:1px solid rgba(52,211,153,.28);padding:4px 9px;opacity:0;pointer-events:none;transition:opacity .15s ease,transform .15s ease;z-index:1}
.msg-head:hover::after{opacity:1;transform:translateY(-50%) scale(1)}

.msg-pop{position:fixed;inset-block-end:78px;inset-inline-end:calc(84px + var(--pop-i,0)*356px);width:min(340px,calc(100vw - 32px));height:clamp(360px,58vh,460px);display:flex;flex-direction:column;z-index:91;
background:linear-gradient(180deg,rgba(14,19,29,.97),rgba(9,12,20,.98));backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
box-shadow:inset 0 0 0 1px rgba(52,211,153,.22),0 34px 70px -34px rgba(52,211,153,.3),0 46px 90px -46px rgba(0,0,0,.9);
clip-path:polygon(14px 0,100% 0,100% calc(100% - var(--na-cut,11px)),calc(100% - var(--na-cut,11px)) 100%,0 100%,0 14px);
animation:msgPopIn .18s cubic-bezier(.2,.9,.3,1.15)}
@keyframes msgPopIn{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
.msg-pop__head{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid rgba(52,211,153,.16);background:linear-gradient(90deg,rgba(52,211,153,.07),rgba(244,114,182,.05) 70%,transparent)}
.msg-pop__peer{display:flex;align-items:center;gap:9px;min-width:0;flex:1}
.msg-pop__ava{display:block;line-height:0}
.msg-pop__meta{display:flex;flex-direction:column;gap:3px;min-width:0}
.msg-pop__name{font-size:13.5px;font-weight:700;color:#EAF6FF;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg-pop__st{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:600;color:rgba(180,214,240,.9);white-space:nowrap}
.msg-pop__x{display:grid;place-items:center;width:26px;height:26px;flex:none;border:0;background:rgba(255,255,255,.06);color:#B7CCE0;font-size:12px;cursor:pointer;transition:background .15s ease,color .15s ease}
.msg-pop__x:hover{background:rgba(244,114,182,.22);color:#fff}
.msg-pop__stream{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px;background:radial-gradient(120% 80% at 50% 0%,rgba(52,211,153,.05),transparent 60%);scrollbar-width:thin}
.msg-pop__comp{display:flex;gap:8px;border-top:1px solid rgba(52,211,153,.14);padding:10px}
.msg-pop__comp textarea{max-height:96px}
.msg-pop .btn{clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px);padding:8px 14px;font-size:12.5px;flex:none}
.msg-pop .msg-b p{font-size:13px}

@media (max-width:640px){
  .msg-heads{inset-inline-end:74px;bottom:12px;gap:8px}
  .msg-pop{inset-inline-end:74px!important;inset-inline-start:12px;width:auto;inset-block-end:70px;height:min(66vh,470px)}
}
[data-theme="light"] .msg-head__av img{box-shadow:0 0 0 2px #fff,0 10px 24px -14px rgba(11,59,92,.45)!important}
[data-theme="light"] .msg-head:hover .msg-head__av img{box-shadow:0 0 0 2px #fff,0 0 0 4px rgba(52,211,153,.35)!important}
[data-theme="light"] .msg-head__dot{box-shadow:0 0 0 3px #fff}
[data-theme="light"] .msg-head::after{color:#0B3B5C;background:#fff;border-color:rgba(11,59,92,.18);box-shadow:0 10px 24px -14px rgba(11,59,92,.45)}
[data-theme="light"] .msg-pop{background:linear-gradient(180deg,#FFFFFF,#F3FAFE);box-shadow:inset 0 0 0 1px rgba(11,59,92,.14),0 30px 70px -36px rgba(11,59,92,.4)}
[data-theme="light"] .msg-pop__head{border-bottom-color:rgba(11,59,92,.12);background:linear-gradient(90deg,rgba(52,211,153,.07),rgba(244,114,182,.04) 70%,transparent)}
[data-theme="light"] .msg-pop__name{color:#0B3B5C}
[data-theme="light"] .msg-pop__st{color:#5B7A96}
[data-theme="light"] .msg-pop__x{background:rgba(11,59,92,.07);color:#33566F}
[data-theme="light"] .msg-pop__comp{border-top-color:rgba(11,59,92,.12)}
[data-theme="light"] .msg-pop__stream{background:radial-gradient(120% 80% at 50% 0%,rgba(52,211,153,.06),transparent 60%)}

/* ============ HEADER + FRONTPAGE POLISH ============ */
.site-header.scrolled{box-shadow:0 1px 0 rgba(52,211,153,.26),0 18px 44px -30px rgba(52,211,153,.45)}
.site-header.scrolled .brand{filter:drop-shadow(0 0 14px rgba(52,211,153,.5))}
.site-header .brand svg{width:160px}
@media (max-width:1280px){
  .site-header .brand svg{width:148px}
}
@media (max-width:1100px){
  .site-header .brand svg{width:136px}
}
@media (max-width:640px){
  .site-header .brand svg{width:116px}
}
.uc-eyebrow{color:#34D399}
.uc-eyebrow::before{background:linear-gradient(90deg,#34D399,rgba(244,114,182,.85))}
html[lang="en"] .uc-eyebrow{letter-spacing:.2em;text-transform:uppercase}
[data-theme="light"] .uc-eyebrow{color:#0077A8}
.uc-hero .btn,.uc-cta-panel .btn{clip-path:polygon(var(--na-cut,11px) 0,100% 0,100% calc(100% - var(--na-cut,11px)),calc(100% - var(--na-cut,11px)) 100%,0 100%,0 var(--na-cut,11px));transition:box-shadow .25s ease}
.uc-hero .btn:hover,.uc-cta-panel .btn:hover{box-shadow:0 16px 44px -14px rgba(52,211,153,.5)}
.nx-card,.nx-prog{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.nx-card:hover,.nx-prog:hover{transform:translateY(-4px);border-color:rgba(52,211,153,.5);box-shadow:0 26px 56px -32px rgba(52,211,153,.42),0 0 0 1px rgba(52,211,153,.2)}
.uc-cta-panel{position:relative;text-align:center;padding:70px 32px;border-radius:0;
  clip-path:polygon(26px 0,100% 0,100% calc(100% - 26px),calc(100% - 26px) 100%,0 100%,0 26px);
  background:radial-gradient(120% 140% at 50% 0%,rgba(52,211,153,.1),transparent 55%),
             linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));
  box-shadow:inset 0 0 0 1px rgba(52,211,153,.22),inset 0 0 90px -60px rgba(52,211,153,.4)}
.uc-cta-panel::before{content:"";position:absolute;inset-block-start:0;inset-inline:14%;height:1px;
  background:linear-gradient(90deg,transparent,#34D399,#F472B6,transparent);pointer-events:none}
[data-theme="light"] .uc-cta-panel{background:radial-gradient(120% 140% at 50% 0%,rgba(52,211,153,.07),transparent 55%),linear-gradient(180deg,#FFFFFF,#F2F9FD);box-shadow:inset 0 0 0 1px rgba(11,59,92,.16)}
[data-theme="light"] .uc-cta-panel::before{background:linear-gradient(90deg,transparent,#00B7D4,#DB2D7F,transparent)}
@media (max-width:640px){
  .uc-cta-panel{padding:44px 18px;clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}
}

/* ============ MESSENGER FAB + launcher panel (bottom corner) ============ */
.flash-warn{background:rgba(255,196,0,.09);border-color:rgba(255,196,0,.34);color:#FFE8A6}
[data-theme="light"] .flash-warn{background:#FFFBEB;color:#854D0E;border-color:#FCD34D}

.msg-fab{position:fixed;inset-inline-end:18px;inset-block-end:18px;z-index:90;width:54px;height:54px;padding:0;border:0;border-radius:50%;cursor:pointer;
display:grid;place-items:center;color:#EAFAFF;line-height:0;-webkit-tap-highlight-color:transparent;
background:linear-gradient(135deg,#00C2FF 4%,#5A5CE6 52%,#F472B6 96%);
box-shadow:inset 0 0 0 1px rgba(255,255,255,.28),0 16px 34px -14px rgba(0,180,255,.55),0 10px 44px -12px rgba(244,114,182,.4);
transition:transform .18s ease,box-shadow .18s ease}
.msg-fab:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 18px 40px -12px rgba(52,211,153,.7),0 14px 52px -12px rgba(244,114,182,.55)}
.msg-fab:active{transform:translateY(-1px) scale(.97)}
.msg-fab.has-unread{animation:fabPulse 2.6s ease-in-out infinite}
@keyframes fabPulse{
  0%,100%{box-shadow:inset 0 0 0 1px rgba(255,255,255,.28),0 16px 34px -14px rgba(0,180,255,.55),0 10px 44px -12px rgba(244,114,182,.4)}
  50%{box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 16px 40px -12px rgba(52,211,153,.85),0 12px 60px -10px rgba(244,114,182,.8)}
}
.msg-fab__ico{filter:drop-shadow(0 2px 6px rgba(0,10,20,.4))}
.msg-fab.is-on .msg-fab__ico{transform:scale(.94)}
.msg-fab__nb{position:absolute;inset-block-start:-3px;inset-inline-end:-3px;min-width:21px;padding:2px 6px;border-radius:999px;background:#F472B6;color:#fff;font-size:10.5px;font-weight:800;line-height:1.25;text-align:center;box-shadow:0 4px 14px -4px rgba(244,114,182,.85),0 0 0 2px #0A0E15}

.msg-fab-panel{position:fixed;inset-inline-end:18px;inset-block-end:80px;z-index:92;width:min(320px,calc(100vw - 32px));max-height:min(60vh,470px);display:flex;flex-direction:column;
background:linear-gradient(180deg,rgba(14,19,29,.97),rgba(9,12,20,.98));backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
box-shadow:inset 0 0 0 1px rgba(52,211,153,.22),0 34px 70px -34px rgba(52,211,153,.3),0 46px 90px -46px rgba(0,0,0,.9);
clip-path:polygon(14px 0,100% 0,100% calc(100% - 11px),calc(100% - 11px) 100%,0 100%,0 14px);
animation:msgPopIn .18s cubic-bezier(.2,.9,.3,1.15)}
.msg-fab-panel[hidden]{display:none}
.msg-fab__head{flex:none;display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid rgba(52,211,153,.16);background:linear-gradient(90deg,rgba(52,211,153,.07),rgba(244,114,182,.05) 70%,transparent);font-size:12.5px;font-weight:700;color:#EAF6FF;letter-spacing:.02em}
.msg-fab__head::before{content:"";width:7px;height:7px;border-radius:50%;background:#34D399;box-shadow:0 0 8px rgba(52,211,153,.9)}
.msg-fab__rows{flex:1;overflow-y:auto;scrollbar-width:thin;overscroll-behavior:contain}
.msg-fab__row{display:flex;align-items:center;gap:10px;width:100%;padding:9px 11px;border:0;border-bottom:1px solid rgba(255,255,255,.045);background:transparent;color:inherit;text-align:start;cursor:pointer;transition:background .15s ease}
.msg-fab__row:hover{background:rgba(52,211,153,.07)}
.msg-fab__row.has-un{background:rgba(244,114,182,.05)}
.msg-fab__row.has-un:hover{background:rgba(244,114,182,.09)}
.msg-fab__row:last-child{border-bottom-color:transparent}
.msg-fab__avwrap{position:relative;flex:none;width:40px;height:40px;line-height:0}
.msg-fab__avwrap img{border-radius:50%}
.msg-fab__dot{position:absolute;inset-block-end:-1px;inset-inline-start:-2px;box-shadow:0 0 0 3px #0A0E15}
.msg-fab__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.msg-fab__top{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.msg-fab__top b{font-size:13px;font-weight:700;color:#EAF6FF;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg-fab__top time{font-size:10px;color:rgba(160,190,220,.65);flex:none}
.msg-fab__snippet{min-width:0;display:flex;align-items:center;font-size:11.5px;color:rgba(180,214,240,.72)}
.msg-fab__snippet span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg-fab__n{flex:none;min-width:18px;padding:1px 5px;border-radius:999px;background:#F472B6;color:#fff;font-size:10px;font-weight:800;text-align:center}
.msg-fab__empty{padding:26px 16px;text-align:center;font-size:12.5px;color:rgba(180,214,240,.6)}
.msg-fab__all{flex:none;display:block;padding:10px 12px;border-top:1px solid rgba(52,211,153,.14);background:rgba(52,211,153,.05);color:#34D399;font-size:12px;font-weight:700;text-align:center;text-decoration:none;letter-spacing:.02em;transition:background .15s ease}
.msg-fab__all:hover{background:rgba(52,211,153,.12);color:#7FF3FF}
[data-theme="light"] .msg-fab{box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 14px 30px -14px rgba(11,59,92,.5)}
[data-theme="light"] .msg-fab__nb{box-shadow:0 4px 14px -4px rgba(244,114,182,.7),0 0 0 2px #fff}
[data-theme="light"] .msg-fab-panel{background:linear-gradient(180deg,#FFFFFF,#F3FAFE);box-shadow:inset 0 0 0 1px rgba(11,59,92,.14),0 30px 70px -36px rgba(11,59,92,.4)}
[data-theme="light"] .msg-fab__head{border-bottom-color:rgba(11,59,92,.12);background:linear-gradient(90deg,rgba(52,211,153,.07),rgba(244,114,182,.04) 70%,transparent);color:#0B3B5C}
[data-theme="light"] .msg-fab__row{border-bottom-color:rgba(11,59,92,.07)}
[data-theme="light"] .msg-fab__row:hover{background:rgba(52,211,153,.08)}
[data-theme="light"] .msg-fab__row.has-un{background:rgba(244,114,182,.05)}
[data-theme="light"] .msg-fab__top b{color:#0B3B5C}
[data-theme="light"] .msg-fab__snippet{color:#5B7A96}
[data-theme="light"] .msg-fab__dot{box-shadow:0 0 0 2px #fff}
[data-theme="light"] .msg-fab__empty{color:#7A93AB}
[data-theme="light"] .msg-fab__all{border-top-color:rgba(11,59,92,.12);background:rgba(52,211,153,.06);color:#0077A8}
@media (max-width:640px){
  .msg-fab{inset-inline-end:12px;inset-block-end:12px;width:50px;height:50px}
  .msg-fab-panel{inset-inline-end:12px;inset-inline-start:12px;width:auto;inset-block-end:70px;max-height:min(64vh,470px)}
}

/* ============ Composer mini buttons (emoji + like) + like-bubble ============ */
.msg-mini{flex:none;display:inline-grid;place-items:center;width:36px;height:36px;padding:0;border-radius:12px;border:1px solid rgba(52,211,153,.35);background:rgba(52,211,153,.05);color:#34D399;font-size:18px;line-height:1;cursor:pointer;transition:background .15s ease,transform .15s ease,border-color .15s ease;-webkit-tap-highlight-color:transparent}
.msg-mini:hover{background:rgba(52,211,153,.12);border-color:rgba(52,211,153,.6);transform:translateY(-1px)}
.msg-mini:active{transform:scale(.94)}
.msg-mini--like{border-radius:50%}
.msg-b--like{background:transparent!important;border:0!important;box-shadow:none!important;padding:2px 4px!important}
.msg-b--like p{font-size:40px!important;line-height:1.05}
[data-theme="light"] .msg-mini{border-color:rgba(11,59,92,.25);background:rgba(52,211,153,.06);color:#0077A8}
[data-theme="light"] .msg-mini:hover{background:rgba(52,211,153,.14);border-color:rgba(52,211,153,.55)}

/* ============ Emoji tray (MsgFX) ============ */
.msg-emo{position:fixed;z-index:99;display:grid;grid-template-columns:repeat(8,1fr);gap:2px;padding:8px;max-width:308px;max-height:212px;overflow-y:auto;scrollbar-width:thin;
background:linear-gradient(180deg,rgba(14,19,29,.98),rgba(9,12,20,.99));backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
box-shadow:inset 0 0 0 1px rgba(52,211,153,.22),0 24px 54px -24px rgba(52,211,153,.3),0 34px 70px -34px rgba(0,0,0,.9);
clip-path:polygon(10px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 10px);
animation:msgPopIn .16s cubic-bezier(.2,.9,.3,1.15)}
.msg-emo__e{display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:8px;background:transparent;font-size:19px;line-height:1;cursor:pointer;transition:transform .12s ease,background .12s ease}
.msg-emo__e:hover{transform:scale(1.25);background:rgba(52,211,153,.14)}
[data-theme="light"] .msg-emo{background:linear-gradient(180deg,#FFFFFF,#F3FAFE);box-shadow:inset 0 0 0 1px rgba(11,59,92,.14),0 24px 54px -24px rgba(11,59,92,.35)}
[data-theme="light"] .msg-emo__e:hover{background:rgba(52,211,153,.16)}

/* ============ Share buttons + share tray (profiles & posts) ============ */
.prx-share{flex:none;display:inline-grid;place-items:center;width:34px;height:34px;padding:0;border-radius:10px;border:1px solid rgba(52,211,153,.3);background:rgba(52,211,153,.05);color:rgba(170,220,245,.9);cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .15s ease,color .15s ease;-webkit-tap-highlight-color:transparent}
.prx-share:hover{background:rgba(52,211,153,.12);border-color:rgba(52,211,153,.55);color:#7FF3FF;transform:translateY(-1px)}
.prx-share:active{transform:scale(.94)}
.prx-share--post{width:30px;height:30px;border-radius:9px;margin-inline-start:-6px}
.sharx{position:fixed;z-index:99;display:flex;flex-direction:column;gap:2px;min-width:198px;padding:8px;
background:linear-gradient(180deg,rgba(14,19,29,.98),rgba(9,12,20,.99));backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
box-shadow:inset 0 0 0 1px rgba(52,211,153,.22),0 24px 54px -24px rgba(52,211,153,.3),0 34px 70px -34px rgba(0,0,0,.9);
clip-path:polygon(10px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 10px);
animation:msgPopIn .16s cubic-bezier(.2,.9,.3,1.15)}
.sharx__b{display:flex;align-items:center;gap:9px;width:100%;padding:9px 11px;border:0;border-radius:9px;background:transparent;color:#EAF6FF;font-size:12.5px;font-weight:600;line-height:1.3;text-align:start;cursor:pointer;transition:background .12s ease,color .12s ease}
.sharx__b:hover{background:rgba(52,211,153,.1);color:#fff}
.sharx__b.is-copied{color:#2BFFC8}
.sharx__b i{flex:none;width:18px;text-align:center;font-style:normal;font-size:14px;line-height:1}
.sharx__sep{flex:none;height:1px;margin:3px 4px;background:rgba(255,255,255,.08)}
[data-theme="light"] .prx-share{border-color:rgba(11,59,92,.22);background:rgba(52,211,153,.06);color:#075A70}
[data-theme="light"] .prx-share:hover{background:rgba(52,211,153,.14);border-color:rgba(52,211,153,.5);color:#003B52}
[data-theme="light"] .sharx{background:linear-gradient(180deg,#FFFFFF,#F3FAFE);box-shadow:inset 0 0 0 1px rgba(11,59,92,.14),0 24px 54px -24px rgba(11,59,92,.35)}
[data-theme="light"] .sharx__b{color:#0B3B5C}
[data-theme="light"] .sharx__b:hover{background:rgba(52,211,153,.1)}
[data-theme="light"] .sharx__b.is-copied{color:#0A8F63}
[data-theme="light"] .sharx__sep{background:rgba(11,59,92,.1)}

/* ============ Chat attachments (composers + bubbles) ============ */
.msg-att{display:block;margin-top:2px;border-radius:12px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(52,211,153,.18);transition:box-shadow .15s ease;-webkit-tap-highlight-color:transparent}
.msg-att:hover{box-shadow:inset 0 0 0 1px rgba(52,211,153,.5)}
.msg-att__img{display:block;width:100%;max-width:238px;max-height:200px;object-fit:cover;background:rgba(52,211,153,.05);pointer-events:none}
.msg-att--file{display:flex;align-items:center;gap:9px;max-width:238px;margin-top:2px;padding:8px 11px;border-radius:12px;background:rgba(52,211,153,.07);box-shadow:inset 0 0 0 1px rgba(52,211,153,.2);color:#DDEFFF;font-size:12.5px;font-weight:600;transition:background .15s ease,box-shadow .15s ease}
.msg-att--file b{flex:none;font-size:16px;line-height:1}
.msg-att--file span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:underline;text-underline-offset:2px}
.msg-att--file:hover{background:rgba(52,211,153,.13);box-shadow:inset 0 0 0 1px rgba(52,211,153,.45)}
.msg-b .msg-att + p{margin-top:4px}
.msg-clip{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border-radius:10px;border:1px solid rgba(52,211,153,.35);background:rgba(52,211,153,.07);color:#CFEEFF;font-size:12px;font-weight:600;line-height:1}
.msg-clip[hidden]{display:none}
.msg-clip span{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msg-clip button{display:grid;place-items:center;width:18px;height:18px;padding:0;border:0;border-radius:6px;background:rgba(255,68,89,.18);color:#FFB4BE;font-size:10px;line-height:1;cursor:pointer}
.msg-clip button:hover{background:rgba(255,68,89,.34);color:#fff}
[data-theme="light"] .msg-att--file{background:rgba(52,211,153,.09);box-shadow:inset 0 0 0 1px rgba(11,59,92,.24);color:#075A70}
[data-theme="light"] .msg-att--file:hover{background:rgba(52,211,153,.16)}
[data-theme="light"] .msg-clip{border-color:rgba(11,59,92,.22);background:rgba(52,211,153,.08);color:#0B3B5C}
[data-theme="light"] .msg-clip button{background:rgba(180,20,40,.12);color:#B41428}

/* ============ First-time welcome guide (bell, view-once) ============ */
.nwell{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:20px}
.nwell__bd{position:absolute;inset:0;background:rgba(4,7,12,.8);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.nwell__card{position:relative;z-index:1;width:min(680px,100%);max-height:min(86vh,760px);overflow-y:auto;
  padding:30px 28px 26px;border-radius:26px;border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg,#0C1424,#070D16);
  box-shadow:0 40px 90px -40px rgba(0,0,0,.9),inset 0 0 0 1px rgba(255,255,255,.03);
  opacity:0;transform:translateY(14px) scale(.95);
  transition:opacity .24s ease,transform .3s cubic-bezier(.22,1.15,.36,1)}
.nwell.is-open .nwell__card{opacity:1;transform:none}
.nwell__x{position:absolute;top:14px;inset-inline-end:14px;width:34px;height:34px;border-radius:50%;
  border:1px solid var(--line-2);background:rgba(255,255,255,.04);color:var(--muted);
  font-size:1.15rem;line-height:1;cursor:pointer;transition:.2s}
.nwell__x:hover{color:#fff;border-color:rgba(250,204,21,.6);transform:rotate(90deg)}
.nwell__badge{width:64px;height:64px;margin:2px auto 10px;display:grid;place-items:center;font-size:2rem;border-radius:22px;
  background:linear-gradient(135deg,rgba(250,204,21,.22),rgba(244,114,182,.16));
  box-shadow:0 0 34px -8px rgba(250,204,21,.55)}
.nwell__mark{font-family:var(--font-mono);text-align:center;letter-spacing:.5em;color:#FACC15;font-size:.9rem;opacity:.9}
.nwell__title{font-family:var(--font-display);text-align:center;font-size:clamp(1.3rem,3.4vw,1.8rem);
  font-weight:800;color:var(--text);margin-top:6px}
.nwell__sub{text-align:center;color:var(--muted);font-size:.86rem;margin-top:6px}
.nwell__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:20px}
.nwell__it{display:flex;gap:11px;align-items:flex-start;padding:12px 14px;border-radius:16px;
  border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035);transition:.25s}
.nwell__it:hover{border-color:rgba(250,204,21,.5);transform:translateY(-2px)}
.nwell__ico{flex:none;width:34px;height:34px;display:grid;place-items:center;border-radius:12px;font-size:1.05rem;
  background:rgba(250,204,21,.13);box-shadow:inset 0 0 0 1px rgba(250,204,21,.25)}
.nwell__it b{display:block;font-size:.85rem;color:var(--text);font-weight:700}
.nwell__it i{display:block;font-style:normal;font-size:.72rem;color:var(--muted);line-height:1.55;margin-top:2px}
.nwell__foot{display:grid;justify-items:center;gap:10px;margin-top:22px}
.nwell__cta{border:0;border-radius:999px;padding:13px 34px;font:inherit;font-weight:800;font-size:.95rem;
  color:#070D16;background:linear-gradient(135deg,#FDE68A,#FACC15);cursor:pointer;transition:.25s;
  box-shadow:0 16px 40px -16px rgba(250,204,21,.75)}
.nwell__cta:hover{transform:translateY(-2px);filter:brightness(1.05);
  box-shadow:0 20px 50px -16px rgba(250,204,21,.9)}
.nwell__cta:active{transform:scale(.97)}
.nwell__once{font-size:.7rem;color:var(--muted-2)}
.nbell__item--welcome{border-inline-start:3px solid #FACC15;
  background:linear-gradient(90deg,rgba(250,204,21,.09),transparent)}
/* [hidden] must beat display:grid — keeps the blur gone after close */
.nwell[hidden]{display:none}
.nwell__money{margin-top:16px;padding:12px 16px;border-radius:14px;text-align:center;
  border:1px solid rgba(250,204,21,.55);background:linear-gradient(135deg,rgba(250,204,21,.18),rgba(250,204,21,.05));
  color:var(--text);font-size:.8rem;line-height:1.75}
.nwell__money b{color:#FACC15}
.nwell__it--gold{border-color:rgba(250,204,21,.6);
  box-shadow:inset 0 0 0 1px rgba(250,204,21,.25),0 12px 30px -16px rgba(250,204,21,.55);
  background:linear-gradient(135deg,rgba(250,204,21,.16),rgba(250,204,21,.03))}
.nwell__it--gold .nwell__ico{background:linear-gradient(135deg,#FDE68A,#FACC15);box-shadow:none}
.nwell__conf{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.nwell__conf i{position:absolute;top:-18px;width:8px;height:13px;border-radius:2px;opacity:0;
  animation:nwellFall 3.4s linear infinite}
.nwell__conf i:nth-child(1){left:6%;background:#FACC15;animation-delay:.1s}
.nwell__conf i:nth-child(2){left:15%;background:#FB7185;animation-delay:1s;animation-duration:2.8s}
.nwell__conf i:nth-child(3){left:24%;background:#67E8F9;animation-delay:.55s}
.nwell__conf i:nth-child(4){left:33%;background:#FDE68A;animation-delay:1.5s;animation-duration:3s}
.nwell__conf i:nth-child(5){left:42%;background:#4ADE80;animation-delay:.8s}
.nwell__conf i:nth-child(6){left:51%;background:#FACC15;animation-delay:1.9s;animation-duration:2.9s}
.nwell__conf i:nth-child(7){left:60%;background:#FB7185;animation-delay:.35s}
.nwell__conf i:nth-child(8){left:69%;background:#67E8F9;animation-delay:1.25s;animation-duration:2.7s}
.nwell__conf i:nth-child(9){left:78%;background:#FDE68A;animation-delay:.7s}
.nwell__conf i:nth-child(10){left:87%;background:#4ADE80;animation-delay:1.7s;animation-duration:3.1s}
.nwell__conf i:nth-child(11){left:94%;background:#FACC15;animation-delay:1.1s}
.nwell__conf i:nth-child(12){left:33%;background:#FB7185;animation-delay:2.2s;animation-duration:2.8s}
@keyframes nwellFall{
  0%{opacity:1;transform:translateY(0) rotate(0)}
  85%{opacity:1}
  100%{opacity:0;transform:translateY(74vh) rotate(540deg)}
}
.nwell.is-open .nwell__badge{animation:nwellPop .65s cubic-bezier(.22,1.4,.36,1) .18s both}
@keyframes nwellPop{0%{transform:scale(0) rotate(-14deg)}62%{transform:scale(1.22) rotate(5deg)}100%{transform:scale(1) rotate(0)}}
@media(max-width:560px){.nwell{padding:12px}.nwell__grid{grid-template-columns:1fr}}
[data-theme="light"] .nwell__card{background:linear-gradient(180deg,#FFFFFF,#F3FAFE);border-color:rgba(11,59,92,.15)}
[data-theme="light"] .nwell__it{background:rgba(11,59,92,.03)}
[data-theme="light"] .nwell__it b,[data-theme="light"] .nwell__title{color:#0B3B5C}
[data-theme="light"] .nwell__sub,[data-theme="light"] .nwell__it i{color:#5B7A96}
[data-theme="light"] .nwell__it--gold{background:linear-gradient(135deg,rgba(202,144,0,.14),rgba(202,144,0,.04));
  border-color:rgba(180,130,0,.45);box-shadow:none}
[data-theme="light"] .nwell__money{background:linear-gradient(135deg,rgba(202,144,0,.14),rgba(202,144,0,.05));
  border-color:rgba(180,130,0,.45);color:#5B4708}
[data-theme="light"] .nwell__money b{color:#8A6D00}
@media (prefers-reduced-motion: reduce){
  .nwell__card{transition:opacity .2s;transform:none}
  .nwell__it,.nwell__x,.nwell__cta{transition:none}
  .nwell__conf i,.nwell.is-open .nwell__badge{animation:none}
}

/* ============================================================ live U0C logo */
/* draws itself in on every page load, O-ring breathes green, spark orbits the O */
.lg .lg-u{animation:lgDraw 1.15s cubic-bezier(.4,0,.2,1) .1s backwards}
.lg .lg-o{animation:lgDraw 1.15s cubic-bezier(.4,0,.2,1) .5s backwards,lgGlow 3.2s ease-in-out 2s infinite}
.lg .lg-c{animation:lgDraw 1.15s cubic-bezier(.4,0,.2,1) .95s backwards}
@keyframes lgDraw{
  from{stroke-dasharray:300;stroke-dashoffset:300}
  to{stroke-dasharray:300;stroke-dashoffset:0}
}
@keyframes lgGlow{
  0%,100%{filter:drop-shadow(0 0 1px rgba(52,211,153,.18))}
  50%{filter:drop-shadow(0 0 7px rgba(52,211,153,.75))}
}
.lg .lg-orb{transform-box:view-box;transform-origin:188px 70px;opacity:0;
  filter:drop-shadow(0 0 4px rgba(52,211,153,.85));
  animation:lgOrbit 6.5s linear 2.2s infinite}
@keyframes lgOrbit{
  0%{transform:rotate(0deg);opacity:0}
  10%{opacity:.95}
  60%{opacity:.6}
  88%{opacity:0}
  100%{transform:rotate(360deg);opacity:0}
}
.brand{transition:filter .3s ease}
.brand:hover{filter:drop-shadow(0 0 12px rgba(52,211,153,.35)) brightness(1.06)}
a.side-brand{transition:filter .3s ease}
a.side-brand:hover{filter:drop-shadow(0 0 12px rgba(52,211,153,.3)) brightness(1.05)}

/* ============================================================ composer extras */
.prx-emoji-btn{appearance:none;border:0;cursor:pointer;width:34px;height:34px;border-radius:11px;flex:0 0 auto;
  background:rgba(250,204,21,.08);box-shadow:inset 0 0 0 1px rgba(250,204,21,.22);
  font-size:1rem;line-height:1;display:inline-flex;align-items:center;justify-content:center;
  transition:transform .2s,background .2s}
.prx-emoji-btn:hover{background:rgba(250,204,21,.16);transform:translateY(-1px) rotate(-6deg)}
.prx-emoji-btn:active{transform:scale(.92)}
.prx-emoji-btn--sm{width:24px;height:24px;border-radius:8px;font-size:.68rem;flex:0 0 auto;
  background:transparent;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.prx-emoji-btn--sm:hover{background:rgba(250,204,21,.15);transform:none}
.prx-composer__count{margin-inline-start:auto;font-family:var(--font-mono,monospace);font-size:.68rem;
  font-weight:700;letter-spacing:.5px;color:var(--muted-2);transition:color .2s;flex:0 0 auto}
.prx-composer__count.is-warn{color:#FACC15}
.prx-composer__count.is-max{color:#FB7185}
.prx-composer__count.is-off{color:var(--muted-2)}
.prx-composer__prev{display:flex;align-items:center;gap:10px;margin-top:10px}
.prx-composer__prev[hidden]{display:none}
.prx-composer__prev img{width:56px;height:56px;object-fit:cover;border-radius:12px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.prx-composer__prev button{appearance:none;border:0;cursor:pointer;width:24px;height:24px;border-radius:50%;
  background:rgba(251,113,133,.14);color:#FB7185;font-size:.9rem;line-height:1}
.prx-composer__prev button:hover{background:rgba(251,113,133,.28)}

/* emoji popover (one floating panel for composer + comments) */
.prx-epop{position:fixed;z-index:120;width:264px;padding:10px;border-radius:16px;
  border:1px solid rgba(250,204,21,.22);
  background:linear-gradient(165deg,rgba(16,19,28,.97),rgba(9,11,17,.95));
  backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);
  box-shadow:0 24px 60px -20px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.06)}
.prx-epop[hidden]{display:none}
.prx-epop__bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.prx-epop__ttl{font-size:.72rem;font-weight:700;color:#FACC15}
.prx-epop__x{appearance:none;border:0;background:rgba(255,255,255,.06);color:rgba(253,246,227,.75);
  width:22px;height:22px;border-radius:50%;cursor:pointer;font-size:.85rem;line-height:1}
.prx-epop__x:hover{background:rgba(250,204,21,.16);color:#FACC15}
.prx-epop__tabs{display:flex;gap:4px;margin-bottom:8px;flex-wrap:wrap}
.prx-epop__tabs button{appearance:none;border:0;cursor:pointer;padding:4px 9px;border-radius:99px;
  font:inherit;font-size:.66rem;font-weight:700;color:var(--muted);background:rgba(255,255,255,.05)}
.prx-epop__tabs button.is-on{color:#070D16;background:linear-gradient(135deg,#FDE68A,#FACC15)}
.prx-epop__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;max-height:172px;overflow-y:auto;
  overscroll-behavior:contain;scrollbar-width:thin}
.prx-epop__e{appearance:none;border:0;background:transparent;cursor:pointer;font-size:1.12rem;
  width:32px;height:32px;line-height:1;border-radius:8px;padding:0;transition:transform .15s,background .15s}
.prx-epop__e:hover{background:rgba(250,204,21,.14);transform:scale(1.18)}

[data-theme="light"] .prx-emoji-btn{background:rgba(217,119,6,.08);box-shadow:inset 0 0 0 1px rgba(217,119,6,.2)}
[data-theme="light"] .prx-emoji-btn--sm{box-shadow:inset 0 0 0 1px rgba(11,59,92,.18)}
[data-theme="light"] .prx-composer__prev button{background:rgba(180,60,90,.12);color:#BE3455}
[data-theme="light"] .prx-epop{background:linear-gradient(165deg,rgba(255,255,255,.98),rgba(243,250,254,.95));
  border-color:rgba(217,119,6,.25);box-shadow:0 24px 60px -22px rgba(11,59,92,.4)}
[data-theme="light"] .prx-epop__ttl{color:#B45309}
[data-theme="light"] .prx-epop__x{color:rgba(30,41,55,.7);background:rgba(11,59,92,.07)}
[data-theme="light"] .prx-epop__tabs button{color:#5B7A96;background:rgba(11,59,92,.06)}
[data-theme="light"] .prx-epop__tabs button.is-on{color:#17130C}

/* =============================================== native choice menus (selects) */
/* dark color-scheme: the OS-rendered option popup follows the theme, not white */
:root{color-scheme:dark}
[data-theme="light"]{color-scheme:light}
select option{background:#0D1522;color:#EAF2FF}
select option:checked{background:linear-gradient(0deg,#14273F,#14273F)}
[data-theme="light"] select option{background:#FFF;color:#17130C}
[data-theme="light"] select option:checked{background:linear-gradient(0deg,#E7F3FC,#E7F3FC)}
select:focus-visible{outline:2px solid var(--lime);outline-offset:2px}

/* =============================================== promo prices: 30% OFF + anchor "was" */
.price-old{
  color:var(--muted-2);font-weight:500;white-space:nowrap;
  text-decoration-line:line-through;text-decoration-thickness:1.5px;
  text-decoration-color:rgba(244,114,182,.85);
}
.save-badge{
  display:inline-flex;align-items:center;gap:4px;white-space:nowrap;
  padding:3px 10px;border-radius:999px;
  font:700 .66rem/1.5 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;
  color:#FFF;text-shadow:0 1px 2px rgba(35,0,45,.35);
  background:linear-gradient(135deg,#F472B6,#FB923C 58%,#FACC15);
  box-shadow:0 8px 22px -10px rgba(244,114,182,.7),inset 0 0 0 1px rgba(255,255,255,.28);
  animation:savePulse 2.4s var(--ease,ease) infinite;
}
.save-badge--xs{padding:2px 8px;font-size:.6rem;animation:none}
@keyframes savePulse{
  0%,100%{transform:scale(1);filter:saturate(1)}
  50%{transform:scale(1.07);filter:saturate(1.25)}
}
@media (prefers-reduced-motion:reduce){.save-badge{animation:none}}

.save-urgency{
  display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;
  max-width:760px;margin-inline:auto;padding:11px 22px;border-radius:999px;
  border:1px solid rgba(52,211,153,.35);
  background:linear-gradient(90deg,rgba(52,211,153,.13),rgba(139,92,246,.13));
  box-shadow:0 18px 50px -30px rgba(52,211,153,.5);
}
.save-urgency i{font-size:1.05rem;line-height:1}
.save-urgency b{font-size:.85rem;color:var(--text);letter-spacing:.02em}
.save-urgency span{color:var(--muted);font-size:.82rem}

.plan__was{display:flex;align-items:center;gap:8px;flex:1 0 100%;margin-top:8px}
.plan__was .price-old{font-size:.95rem}

.st-item__save{display:inline-flex;align-items:center;gap:6px;font-size:.72rem}
.st-save span,.st-save b{color:var(--ok)}
.st-save{opacity:.95}

/* checkout rail kv rows carry a strike + new price */
.kv .price-old{font-size:.78em;margin-inline-end:4px}

[data-theme="light"] .save-badge{
  background:linear-gradient(135deg,#DB2777,#EA580C 58%,#D97706);
  box-shadow:0 8px 22px -10px rgba(219,39,119,.5),inset 0 0 0 1px rgba(255,255,255,.45)}
[data-theme="light"] .save-urgency{
  border-color:rgba(4,120,87,.30);
  background:linear-gradient(90deg,rgba(5,150,105,.08),rgba(139,92,246,.08))}
[data-theme="light"] .save-urgency b{color:#065F46}
[data-theme="light"] .price-old{text-decoration-color:rgba(219,39,119,.75)}
[data-theme="light"] .st-save span,[data-theme="light"] .st-save b{color:#047857}