/* ============================================================
   The Silvea side, dressed exactly like silvea.tech: the welcome
   page, the roadmap, the policies, the client and owner dashboards,
   and the account screens in the builder (sign in, sign up, verify,
   reset). The values are copied from silvea.tech's own stylesheet
   (Silvea-Tech-Site/index.html <style>): its nav, chamfered buttons,
   eyebrows, glitch headings, HUD panels, plan rows and badges.

   Never the editor, the canvas or a client's site: every rule here
   starts with one of the Silvea scopes below (body.wl = welcome and
   roadmap, body.legal-page, body.dash-page, .acct-gate), optionally
   behind html[data-theme] or a :root theme check. tools/smoke.mjs
   fails if a rule is not scoped, so nothing reaches the editor.
   The editor keeps builder.css and skin.css exactly as they are.

   The brand marks (images/brand) are never glitched, filtered,
   tinted or animated here: effects go on text and frames only.
   Eyebrow numbers read "01 / LABEL" (no em dashes in client copy).
   ============================================================ */

/* ---------- silvea.tech's tokens (the builder's own --cyan... names are not used, so nothing collides) ---------- */
:is(body.wl, body.legal-page, body.dash-page, .acct-gate){
  --sv-void:#04070d; --sv-cyan-soft:#7de8f7; --sv-purple-soft:#d8b4fe; --sv-hot-pink:#ff4fd8;
  --sv-fog:#c1d2f2; --sv-fog-dim:#7f8eaf; --sv-white:#eef6ff;
  --sv-border-dim:rgba(0,240,255,.2); --sv-border-bright:rgba(0,240,255,.72);
  --sv-tech:"Rajdhani","Chakra Petch",sans-serif;
  --sv-panel-bg:linear-gradient(135deg,rgba(0,240,255,.07),transparent 45%,rgba(255,46,196,.12)),linear-gradient(180deg,rgba(18,24,37,.96),rgba(11,17,29,.98));
  --sv-panel-raised:linear-gradient(135deg,rgba(0,240,255,.07),transparent 45%,rgba(255,46,196,.12)),linear-gradient(180deg,rgba(18,25,42,.98),rgba(9,14,25,.98));
  --sv-core:linear-gradient(180deg,rgba(14,20,38,.98),rgba(6,10,20,.98));
}

/* ---------- the page: a deep navy field with cyan, purple and magenta haze, faint scanlines over it ---------- */
html[data-theme] :is(body.wl, body.legal-page, body.dash-page){
  background:
    radial-gradient(900px circle at 8% -5%,rgba(0,240,255,.30),transparent 55%),
    radial-gradient(800px circle at 92% 6%,rgba(168,85,247,.28),transparent 52%),
    radial-gradient(700px circle at 102% 42%,rgba(255,46,196,.18),transparent 50%),
    radial-gradient(760px circle at -2% 52%,rgba(0,240,255,.16),transparent 50%),
    radial-gradient(820px circle at 88% 90%,rgba(168,85,247,.22),transparent 52%),
    radial-gradient(680px circle at 6% 102%,rgba(255,46,196,.16),transparent 50%),
    linear-gradient(180deg,var(--sv-void) 0%,#0a1020 40%,#070b16 70%,#05070d 100%);
  background-attachment:fixed;color:var(--sv-white);position:relative;z-index:0}
:is(body.wl, body.legal-page, body.dash-page)::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.8;
  background:repeating-linear-gradient(to bottom,rgba(255,255,255,.015) 0px,rgba(255,255,255,.015) 1px,transparent 1px,transparent 3px)}
:is(body.wl, body.legal-page, body.dash-page)::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:linear-gradient(90deg,rgba(0,240,255,.04),transparent 20%,transparent 80%,rgba(255,46,196,.05))}
:is(body.wl, body.legal-page, body.dash-page) :is(h1,h2,h3,h4){font-family:var(--sv-display);font-weight:600;letter-spacing:.015em}

/* like silvea.tech: the page never scrolls sideways (the phone menu waits off to the right) */
html:has(body.wl){overflow-x:hidden}

/* ---------- eyebrows: "01 / WEBSITES" lines ---------- */
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) :is(.wl-eyebrow,.ln-eyebrow,.lg-toc>p,.db-role,.rm-month){
  display:block;font-family:var(--mono);font-size:.8rem;font-weight:500;color:var(--sv-cyan-soft);text-transform:uppercase;letter-spacing:.12em;text-shadow:0 0 18px rgba(54,243,255,.4)}
body.wl main{counter-reset:svsec}
body.wl :is(.wl-sec>.wl-eyebrow,.wl-for .wl-eyebrow)::before{counter-increment:svsec;content:counter(svsec,decimal-leading-zero) " / "}

/* ---------- glitch headings: the gradient words, split into cyan and magenta on hover ---------- */
:is(body.wl, body.legal-page) .wl-grad,body.legal-page .lg-main>h1{position:relative;display:inline-block;background:linear-gradient(135deg,var(--sv-cyan),var(--sv-purple),var(--sv-magenta));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 18px rgba(54,243,255,.2)}
body.wl .wl-grad[data-text]::before,body.wl .wl-grad[data-text]::after{content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;mix-blend-mode:screen}
body.wl .wl-grad[data-text]:hover::before,body.wl .wl-grad[data-text]:hover::after{opacity:1}
body.wl .wl-grad[data-text]:hover::before{color:var(--sv-cyan);animation:sv-glitch-shift .35s steps(2,end) infinite;clip-path:polygon(0 0,100% 0,100% 45%,0 45%)}
body.wl .wl-grad[data-text]:hover::after{color:var(--sv-magenta);animation:sv-glitch-shift .3s steps(2,end) infinite reverse;clip-path:polygon(0 55%,100% 55%,100% 100%,0 100%)}
@keyframes sv-glitch-shift{0%{transform:translate(0,0)}50%{transform:translate(-2px,1px)}100%{transform:translate(2px,-1px)}}

/* ============================================================
   Buttons: chamfered (hex-ended), a gradient edge around a dark
   core; primary = solid, a cyan outline round the cyan, purple and
   magenta fill, white words. Only on the Silvea pages and the
   account screens: the editor keeps its own .btn.
   ============================================================ */
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn{
  --sv-cut:14px;position:relative;isolation:isolate;align-items:center;justify-content:center;gap:.5rem;
  border:none;border-radius:0;padding:.95rem 1.9rem;min-height:0;
  font-family:var(--mono);font-size:.84rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;line-height:1.2;
  color:var(--sv-white);text-decoration:none;cursor:pointer;
  clip-path:polygon(var(--sv-cut) 0,calc(100% - var(--sv-cut)) 0,100% 50%,calc(100% - var(--sv-cut)) 100%,var(--sv-cut) 100%,0 50%);
  background:linear-gradient(120deg,var(--sv-cyan),#3b82f6 50%,var(--sv-purple));box-shadow:none;filter:none;
  transition:transform .15s ease,background .15s ease,color .15s ease}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn::before{content:"";position:absolute;inset:2px;z-index:-1;clip-path:inherit;background:var(--sv-core);transition:background .2s ease}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:none;color:var(--sv-white);background:linear-gradient(120deg,var(--sv-purple),var(--sv-cyan))}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn:hover:not(:disabled)::before{background:linear-gradient(180deg,rgba(20,36,62,.96),rgba(10,18,36,.96))}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn:focus-visible{outline:2px solid var(--sv-white);outline-offset:-6px}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn:disabled{opacity:.5;cursor:default}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn svg{stroke:currentColor;flex:none;transition:transform .2s ease}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn:hover:not(:disabled) svg:last-child:not(:first-child){transform:translateX(3px)}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn .sv-arrow{width:1.05em;height:1.05em;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;flex:none;transition:transform .2s ease}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn:hover .sv-arrow{transform:translateX(3px)}
/* solid: the cyan outer layer is the border, the fill sits inside it */
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn.primary{background:var(--sv-cyan);border:none;color:var(--sv-white);font-weight:700;text-shadow:0 1px 3px rgba(4,7,13,.65);overflow:hidden}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn.primary::before{background:linear-gradient(120deg,var(--sv-cyan),var(--sv-purple) 60%,var(--sv-magenta))}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn.primary::after{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(115deg,transparent,rgba(255,255,255,.6),transparent);transform:skewX(-20deg);transition:left .55s ease;pointer-events:none}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn.primary:hover:not(:disabled){background:#7df9ff;color:var(--sv-white)}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn.primary:hover:not(:disabled)::before{background:linear-gradient(120deg,#5ff7ff,#b978ff 60%,#ff5fd4)}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn.primary:hover:not(:disabled)::after{left:140%}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn.primary svg{stroke:currentColor}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn.primary:focus-visible{outline:none;box-shadow:inset 0 0 0 3px var(--sv-white)}
/* danger: the same shape with a magenta-to-red edge */
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn.danger{color:#ffb3c4;background:linear-gradient(120deg,var(--sv-magenta),#ff6b8a)}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn.danger:hover:not(:disabled){color:#fff;background:linear-gradient(120deg,#ff6b8a,var(--sv-magenta))}
/* sizes */
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn.small{--sv-cut:10px;padding:.5rem 1.1rem;font-size:.72rem;letter-spacing:.05em}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn:is(.big,.wl-big){padding:1.05rem 2.1rem;font-size:.88rem}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn.block{width:100%}
:is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn:active:not(:disabled){transform:translateY(0)}

/* ---------- the top bar (welcome, roadmap, policies): scanlines, a neon rail with a travelling highlight ---------- */
:is(body.wl .wl-top, body.legal-page .lg-top){position:sticky;top:0;z-index:100;
  background:linear-gradient(180deg,rgba(4,7,16,.94),rgba(7,11,24,.84));backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);
  box-shadow:0 10px 30px rgba(2,5,10,.45);border-bottom:0;padding-top:1rem;padding-bottom:1rem}
:is(body.wl .wl-top, body.legal-page .lg-top)::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,240,255,.035) 0 1px,transparent 1px 3px)}
:is(body.wl .wl-top, body.legal-page .lg-top)::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.95),transparent) no-repeat,linear-gradient(90deg,transparent,var(--sv-cyan) 15%,var(--sv-purple) 50%,var(--sv-magenta) 85%,transparent);
  background-size:16% 100%,100% 100%;background-position:-30% 0,0 0;box-shadow:0 0 12px rgba(0,240,255,.5),0 0 24px rgba(168,85,247,.3);animation:sv-nav-scan 7s ease-in-out infinite}
@keyframes sv-nav-scan{0%{background-position:-30% 0,0 0}60%,100%{background-position:130% 0,0 0}}
:is(body.wl .wl-top, body.legal-page .lg-top)>*{position:relative}
body.wl .wl-top{gap:.6rem;--sv-gut:max(clamp(16px,4vw,40px),calc((100% - 1200px) / 2 + clamp(16px,4vw,40px)));padding-left:var(--sv-gut);padding-right:var(--sv-gut)}
body.wl .wl-top .brand{margin-right:auto}
body.wl .wl-top-acts{display:flex;align-items:center;gap:.6rem;margin-left:0}

/* nav buttons: a smaller cut, the tech face, a status light */
:is(body.wl .wl-top-acts, body.legal-page .lg-top) .btn,body.wl .wl-nav .wl-menu-cta{
  --sv-cut:10px;--c1:var(--sv-cyan);--c2:#3b82f6;
  padding:.55rem 1.05rem .55rem 1.55rem;font-family:var(--sv-tech);font-weight:700;font-size:.86rem;letter-spacing:.12em;line-height:1.2;
  clip-path:polygon(var(--sv-cut) 0,100% 0,100% calc(100% - var(--sv-cut)),calc(100% - var(--sv-cut)) 100%,0 100%,0 var(--sv-cut));
  background:linear-gradient(120deg,var(--c1),var(--c2));color:var(--sv-white);text-shadow:none;overflow:visible}
:is(body.wl .wl-top-acts, body.legal-page .lg-top) .btn::before,body.wl .wl-nav .wl-menu-cta::before{inset:1.5px;background:linear-gradient(180deg,rgba(12,19,36,.97),rgba(5,9,19,.97))}
:is(body.wl .wl-top-acts, body.legal-page .lg-top) .btn::after,body.wl .wl-nav .wl-menu-cta::after{content:"";position:absolute;left:.75rem;top:50%;width:5px;height:5px;margin-top:-2.5px;transform:rotate(45deg);
  background:var(--c1);box-shadow:0 0 6px var(--c1),0 0 12px var(--c1);transition:none}
:is(body.wl .wl-top-acts, body.legal-page .lg-top) .btn:hover,body.wl .wl-nav .wl-menu-cta:hover,
:is(body.wl .wl-top-acts, body.legal-page .lg-top) .btn:focus-visible,body.wl .wl-nav .wl-menu-cta:focus-visible{outline:none;transform:translateY(-1px);color:var(--sv-white);text-shadow:none;background:linear-gradient(120deg,var(--c1),var(--c2));animation:sv-nav-glitch .35s steps(3) 1}
:is(body.wl .wl-top-acts, body.legal-page .lg-top) .btn:hover::before,body.wl .wl-nav .wl-menu-cta:hover::before,
:is(body.wl .wl-top-acts, body.legal-page .lg-top) .btn:focus-visible::before,body.wl .wl-nav .wl-menu-cta:focus-visible::before{background:radial-gradient(120% 140% at 0% 50%,rgba(0,240,255,.22),transparent 60%),linear-gradient(180deg,rgba(18,30,54,.97),rgba(8,14,28,.97))}
:is(body.wl .wl-top-acts, body.legal-page .lg-top) .btn:focus-visible::before,body.wl .wl-nav .wl-menu-cta:focus-visible::before{inset:3px}
/* the bright one (Start free): solid, a blinking white light */
:is(body.wl .wl-top-acts) .btn.primary,body.wl .wl-nav .wl-menu-cta.primary{--c1:var(--sv-cyan);--c2:var(--sv-magenta);background:var(--sv-cyan);text-shadow:0 1px 3px rgba(4,7,13,.65)}
:is(body.wl .wl-top-acts) .btn.primary::before,body.wl .wl-nav .wl-menu-cta.primary::before{background:linear-gradient(120deg,var(--sv-cyan),var(--sv-purple) 60%,var(--sv-magenta))}
:is(body.wl .wl-top-acts) .btn.primary::after,body.wl .wl-nav .wl-menu-cta.primary::after{left:.75rem;width:5px;height:5px;transform:rotate(45deg);background:var(--sv-white);box-shadow:0 0 6px var(--sv-white);animation:sv-nav-blink 1.6s steps(2,start) infinite}
:is(body.wl .wl-top-acts) .btn.primary:hover,body.wl .wl-nav .wl-menu-cta.primary:hover,
:is(body.wl .wl-top-acts) .btn.primary:focus-visible,body.wl .wl-nav .wl-menu-cta.primary:focus-visible{background:#7df9ff;color:var(--sv-white);box-shadow:none}
:is(body.wl .wl-top-acts) .btn.primary:hover::before,body.wl .wl-nav .wl-menu-cta.primary:hover::before,
:is(body.wl .wl-top-acts) .btn.primary:focus-visible::before,body.wl .wl-nav .wl-menu-cta.primary:focus-visible::before{background:linear-gradient(120deg,#5ff7ff,#b978ff 60%,#ff5fd4)}
:is(body.wl .wl-top-acts) .btn.primary:focus-visible,body.wl .wl-nav .wl-menu-cta.primary:focus-visible{background:var(--sv-white)}
:is(body.wl .wl-top-acts) .btn.primary:hover:not(:disabled)::after,body.wl .wl-nav .wl-menu-cta.primary:hover:not(:disabled)::after{left:.75rem}
@keyframes sv-nav-glitch{0%{text-shadow:-2px 0 var(--sv-magenta),2px 0 var(--sv-cyan)}50%{text-shadow:2px 0 var(--sv-magenta),-2px 0 var(--sv-cyan)}100%{text-shadow:none}}
@keyframes sv-nav-blink{to{opacity:.2}}

/* the menu button: chamfered, a neon edge, three lines */
:is(body.wl, body.dash-page) .sv-toggle{--cut:10px;position:relative;isolation:isolate;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:2.75rem;height:2.75rem;padding:0;flex-shrink:0;border:none;cursor:pointer;
  clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut));background:linear-gradient(135deg,var(--sv-cyan),var(--sv-purple));transition:background .2s ease}
:is(body.wl, body.dash-page) .sv-toggle::before{content:"";position:absolute;inset:1.5px;z-index:-1;clip-path:inherit;background:linear-gradient(180deg,rgba(12,19,36,.97),rgba(5,9,19,.97));transition:background .2s ease}
:is(body.wl, body.dash-page) .sv-toggle span{display:block;width:20px;height:2px;background:var(--sv-cyan-soft);box-shadow:0 0 6px rgba(0,240,255,.7);transition:transform .25s ease,opacity .2s ease,width .2s ease,margin .2s ease}
:is(body.wl, body.dash-page) .sv-toggle span:nth-child(2){width:13px;margin-left:7px;background:var(--sv-purple-soft);box-shadow:0 0 6px rgba(168,85,247,.8)}
:is(body.wl, body.dash-page) .sv-toggle:hover span:nth-child(2){width:20px;margin-left:0}
:is(body.wl, body.dash-page) .sv-toggle:hover::before,:is(body.wl, body.dash-page) .sv-toggle[aria-expanded="true"]::before{background:radial-gradient(circle at 50% 50%,rgba(0,240,255,.2),transparent 70%),linear-gradient(180deg,rgba(18,30,54,.97),rgba(8,14,28,.97))}
:is(body.wl, body.dash-page) .sv-toggle:focus-visible{outline:none}
:is(body.wl, body.dash-page) .sv-toggle:focus-visible::before{inset:3px}
:is(body.wl, body.dash-page) .sv-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
:is(body.wl, body.dash-page) .sv-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
:is(body.wl, body.dash-page) .sv-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* the menu: a chamfered HUD panel with numbered entries */
body.wl .wl-top .wl-nav{--cut:18px;position:absolute;top:calc(100% + .6rem);right:var(--sv-gut);width:320px;margin:0;
  display:flex;flex-direction:column;gap:.15rem;counter-reset:navi;padding:1rem;isolation:isolate;
  clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut));
  background:linear-gradient(150deg,var(--sv-cyan),var(--sv-purple) 55%,var(--sv-magenta));
  opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity .2s ease,transform .2s ease,visibility .2s}
body.wl .wl-top .wl-nav::before{content:"";position:absolute;inset:1.5px;z-index:-1;clip-path:inherit;
  background:repeating-linear-gradient(0deg,rgba(0,240,255,.03) 0 1px,transparent 1px 3px),radial-gradient(120% 60% at 100% 0%,rgba(168,85,247,.14),transparent 60%),linear-gradient(180deg,rgba(9,15,30,.99),rgba(5,8,18,.99))}
body.wl .wl-top .wl-nav.open{opacity:1;visibility:visible;transform:translateY(0)}
body.wl .wl-top .wl-nav a:not(.wl-menu-cta){--cut:8px;display:flex;align-items:center;gap:.85rem;padding:.72rem 1rem;border-radius:0;background:none;
  font-family:var(--sv-tech);font-weight:600;font-size:1.08rem;letter-spacing:.1em;text-transform:uppercase;color:var(--sv-white);
  clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut));transition:background .15s ease,color .15s ease,box-shadow .15s ease}
body.wl .wl-top .wl-nav a:not(.wl-menu-cta)::before{counter-increment:navi;content:counter(navi,decimal-leading-zero);font-family:var(--mono);font-size:.72rem;letter-spacing:0;color:var(--sv-cyan);opacity:.6}
body.wl .wl-top .wl-nav a:not(.wl-menu-cta)::after{content:"\2192";margin-left:auto;color:var(--sv-cyan);opacity:0;transform:translateX(-6px);transition:opacity .15s ease,transform .15s ease}
body.wl .wl-top .wl-nav a:not(.wl-menu-cta):is(:hover,:focus-visible){outline:none;color:var(--sv-cyan-soft);text-shadow:0 0 12px rgba(0,240,255,.45);background:linear-gradient(90deg,rgba(0,240,255,.16),rgba(168,85,247,.07) 70%,transparent);box-shadow:inset 2px 0 0 var(--sv-cyan)}
body.wl .wl-top .wl-nav a:not(.wl-menu-cta):is(:hover,:focus-visible)::before{opacity:1}
body.wl .wl-top .wl-nav a:not(.wl-menu-cta):is(:hover,:focus-visible)::after{opacity:1;transform:translateX(0)}
body.wl .wl-top .wl-nav .wl-menu-cta{display:none}

/* ---------- panels: the gradient field, a dim cyan edge; raised ones carry HUD corner brackets ---------- */
:is(body.wl :is(.wl-way,.wl-feat,.wl-plan,.wl-phone-row,.wl-faq details,.rm-card,.rm-suggest), body.dash-page :is(.db-card,.db-tile,.db-auth-box), body.legal-page .lg-toc){
  background:var(--sv-panel-bg);border:1px solid rgba(54,243,255,.16);border-radius:15px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.02),0 0 24px rgba(2,4,8,.45)}
:is(body.wl :is(.wl-way-hi,.wl-plan-hi,.rm-suggest,.wl-for), body.dash-page .db-auth-box){background:var(--sv-panel-raised)}
:is(body.wl :is(.wl-way,.wl-plan,.wl-phone-row,.wl-for,.rm-suggest), body.dash-page :is(.db-card,.db-auth-box)){position:relative;overflow:visible}
:is(body.wl :is(.wl-way,.wl-plan,.wl-phone-row,.wl-for,.rm-suggest), body.dash-page :is(.db-card,.db-auth-box))::before,
:is(body.wl :is(.wl-way,.wl-plan,.wl-phone-row,.wl-for,.rm-suggest), body.dash-page :is(.db-card,.db-auth-box))::after{content:"";position:absolute;width:20px;height:20px;z-index:2;pointer-events:none;border:1.5px solid var(--sv-cyan);opacity:.75;filter:drop-shadow(0 0 6px rgba(0,240,255,.5))}
:is(body.wl :is(.wl-way,.wl-plan,.wl-phone-row,.wl-for,.rm-suggest), body.dash-page :is(.db-card,.db-auth-box))::before{top:-8px;left:-8px;border-right:none;border-bottom:none}
:is(body.wl :is(.wl-way,.wl-plan,.wl-phone-row,.wl-for,.rm-suggest), body.dash-page :is(.db-card,.db-auth-box))::after{bottom:-8px;right:-8px;border-left:none;border-top:none}
/* the recommended one stands out: a brighter edge and a glow */
body.wl :is(.wl-way-hi,.wl-plan-hi){border-color:var(--sv-border-bright);box-shadow:0 0 28px rgba(0,240,255,.18),0 0 40px -8px rgba(168,85,247,.45)}
body.wl .wl-for{border:1px solid rgba(54,243,255,.16);border-radius:15px}
/* a lift on hover, like silvea.tech's service panels */
:is(body.wl :is(.wl-way,.wl-feat,.wl-plan,.rm-card)){transition:transform .2s ease,box-shadow .2s ease}
:is(body.wl :is(.wl-way,.wl-feat,.wl-plan,.rm-card)):hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(54,243,255,.12)}
:is(body.wl :is(.wl-way-hi,.wl-plan-hi)):hover{box-shadow:0 12px 30px rgba(54,243,255,.12),0 0 28px rgba(0,240,255,.18),0 0 40px -8px rgba(168,85,247,.45)}

/* ---------- badges: a dark pill with a diamond marker (Recommended, Most hands-off) ---------- */
body.wl .wl-tag{display:inline-flex;align-items:center;gap:.45rem;padding:.45rem .7rem;line-height:1;background:rgba(11,17,30,.92);border:1px solid rgba(54,243,255,.25);border-radius:999px;
  color:var(--sv-cyan-soft);font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 0 18px rgba(54,243,255,.08);top:-14px}
body.wl .wl-tag::before{content:"";width:.5rem;height:.5rem;border-radius:1px;transform:rotate(45deg);background:linear-gradient(135deg,var(--sv-cyan),var(--sv-purple));box-shadow:0 0 10px rgba(0,240,255,.7)}

/* ---------- icon rings ---------- */
body.wl .wl-ic{--sv-size:52px;position:relative;flex:none;width:var(--sv-size);height:var(--sv-size);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:var(--sv-cyan-soft);
  border:2px solid transparent;background:radial-gradient(circle at 50% 35%,rgba(22,32,58,.98),rgba(6,9,18,.98)) padding-box,linear-gradient(145deg,var(--sv-purple),var(--sv-cyan) 55%,#3b82f6) border-box;
  box-shadow:0 0 18px rgba(0,240,255,.22),0 0 34px -6px rgba(168,85,247,.45),inset 0 0 18px rgba(0,240,255,.12);transition:transform .35s cubic-bezier(.2,.8,.25,1),box-shadow .35s ease}
body.wl .wl-ic svg{filter:drop-shadow(0 0 6px rgba(0,240,255,.55))}
body.wl :is(.wl-way,.wl-feat):hover .wl-ic{transform:translateY(-6px) scale(1.04);box-shadow:0 0 26px rgba(0,240,255,.45),0 0 48px -4px rgba(168,85,247,.7),inset 0 0 22px rgba(0,240,255,.2)}
body.wl .wl-for-list li{grid-template-columns:52px minmax(0,1fr)}

/* ---------- the welcome page ---------- */
body.wl .wl-hero h1{font-size:clamp(2.5rem,5vw,4.2rem);line-height:1.1}
body.wl :is(.wl-sec>h2,.wl-end h2,.wl-for h2,.rm-sec>h2){font-size:clamp(1.9rem,3.4vw,2.8rem);line-height:1.1}
/* section headings take the gradient lettering, like silvea.tech's service headings */
body.wl :is(.wl-sec>h2,.wl-for h2,.rm-sec>h2){width:fit-content;max-width:100%;background:linear-gradient(135deg,var(--sv-cyan),var(--sv-purple),var(--sv-magenta));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 18px rgba(54,243,255,.2)}
body.wl :is(.wl-lead,.wl-way p,.wl-for p,.wl-phone-row p,.wl-plan>p,.rm-card p,.rm-updates p){color:var(--sv-fog)}
body.wl :is(.wl-note,.wl-sub,.wl-small,.wl-feat p,.wl-way ul,.wl-for-list span:last-child,.rm-muted,.wl-faq details p){color:var(--sv-fog-dim)}
body.wl :is(p a,li a,summary~p a,.wl-note a){color:var(--sv-cyan)}
body.wl .wl-shot>img:first-child{border-radius:15px;border:1px solid rgba(0,240,255,.28);box-shadow:inset 0 0 28px rgba(0,240,255,.1),0 0 30px rgba(0,240,255,.1),0 30px 80px -20px rgba(0,0,0,.7)}
/* the band of four: silvea.tech's trust row, gradient dividers between */
body.wl .wl-band{gap:0;border:0;border-radius:0;background:none;overflow:visible;margin:40px 0 8px}
body.wl .wl-band p{position:relative;align-content:start;justify-items:center;text-align:center;background:none;padding:.6rem 1rem}
body.wl .wl-band p+p::before{content:"";position:absolute;left:0;top:12%;bottom:12%;width:2px;background:linear-gradient(180deg,transparent,var(--sv-cyan),var(--sv-purple),transparent);box-shadow:0 0 8px rgba(0,240,255,.5)}
body.wl .wl-band b{font-family:var(--sv-tech);font-weight:700;font-size:1.05rem;letter-spacing:.09em;text-transform:uppercase;color:var(--sv-white)}
body.wl .wl-band span{color:var(--sv-fog-dim);font-size:.88rem}
/* lists inside the cards: diamond markers */
body.wl .wl-way ul{list-style:none;padding:0;gap:6px}
body.wl .wl-way ul li{position:relative;padding-left:18px}
body.wl .wl-way ul li::before{content:"";position:absolute;left:2px;top:.6em;width:7px;height:7px;transform:rotate(45deg);background:linear-gradient(135deg,var(--sv-cyan),var(--sv-purple));box-shadow:0 0 8px rgba(0,240,255,.6)}
/* plan cards: the price glows, the features are plan rows */
body.wl .wl-price b{font-family:var(--sv-display);color:var(--sv-cyan);text-shadow:0 0 10px rgba(54,243,255,.45)}
body.wl .wl-price span,body.wl .wl-plan>small{color:var(--sv-fog-dim);font-family:var(--mono);font-size:.82rem}
body.wl .wl-plan ul{gap:.5rem}
body.wl .wl-plan li{gap:.5rem 1rem;padding:.6rem .8rem;background:rgba(18,24,36,.9);border-left:2px solid var(--sv-cyan);font-family:var(--mono);font-size:.8rem;color:var(--sv-white);box-shadow:inset 0 0 0 1px rgba(54,243,255,.04);transition:background .15s ease,border-color .15s ease,transform .15s ease}
body.wl .wl-plan li:hover{background:rgba(54,243,255,.07);border-left-color:var(--sv-purple);transform:translateX(2px)}
body.wl .wl-plan li svg{color:var(--sv-cyan);margin-top:2px}
/* the three steps: numbered rings */
body.wl .wl-steps li{grid-template-columns:44px minmax(0,1fr);color:var(--sv-fog)}
body.wl .wl-steps li::before{width:44px;height:44px;font:600 1.1rem/1 var(--sv-display);color:var(--sv-cyan);border:2px solid transparent;
  background:radial-gradient(circle at 50% 35%,rgba(22,32,58,.98),rgba(6,9,18,.98)) padding-box,linear-gradient(145deg,var(--sv-purple),var(--sv-cyan) 55%,#3b82f6) border-box;
  box-shadow:0 0 18px rgba(0,240,255,.22),inset 0 0 12px rgba(0,240,255,.12);text-shadow:0 0 16px rgba(0,240,255,.4);content:counter(s,decimal-leading-zero)}
body.wl .wl-steps b{color:var(--sv-white)}
/* questions */
body.wl .wl-faq summary{font-family:var(--sv-display);font-weight:600;letter-spacing:.01em}
body.wl .wl-faq summary::after{color:var(--sv-cyan);text-shadow:0 0 10px rgba(0,240,255,.6)}
body.wl .wl-faq summary:focus-visible{outline:2px solid var(--sv-cyan);outline-offset:2px;border-radius:6px}
/* the closing call: silvea.tech's chamfered promo frame */
body.wl .wl-end{position:relative;isolation:isolate;margin:clamp(40px,6vw,64px) 0 clamp(48px,7vw,80px);padding:2.4rem 2.6rem;--sv-c:26px;
  clip-path:polygon(var(--sv-c) 0,calc(100% - 38%) 0,calc(100% - 38% + 14px) 10px,calc(100% - var(--sv-c)) 10px,100% calc(var(--sv-c) + 10px),100% calc(100% - var(--sv-c)),calc(100% - var(--sv-c)) 100%,38% 100%,calc(38% - 14px) calc(100% - 10px),var(--sv-c) calc(100% - 10px),0 calc(100% - var(--sv-c) - 10px),0 var(--sv-c));
  background:linear-gradient(120deg,var(--sv-purple),var(--sv-cyan) 45%,#3b82f6 70%,var(--sv-purple))}
body.wl .wl-end::before{content:"";position:absolute;inset:2px;z-index:-1;clip-path:inherit;
  background:radial-gradient(120% 90% at 0% 0%,rgba(0,240,255,.12),transparent 55%),radial-gradient(90% 80% at 100% 100%,rgba(168,85,247,.16),transparent 60%),linear-gradient(180deg,rgba(12,18,34,.98),rgba(5,8,17,.99))}
body.wl .wl-end h2{text-transform:uppercase;letter-spacing:.03em}
body.wl .wl-end p{color:var(--sv-fog)}
/* the emblem divider (the logo itself is shown as it is: no glow, no filter) */
body.wl .sv-divider{display:flex;align-items:center;justify-content:center;gap:1rem;padding:clamp(40px,6vw,72px) 0 0;max-width:1160px;margin:0 auto}
body.wl .sv-divider-line{flex:1;height:2px;max-width:420px;position:relative;background:linear-gradient(90deg,transparent,var(--sv-purple) 40%,var(--sv-cyan));box-shadow:0 0 10px rgba(0,240,255,.5)}
body.wl .sv-divider-line:last-child{background:linear-gradient(90deg,var(--sv-cyan),var(--sv-purple) 60%,transparent)}
body.wl .sv-divider-line::after{content:"";position:absolute;top:50%;right:12%;width:34%;height:6px;transform:translateY(-50%);border-top:1px solid rgba(0,240,255,.55);border-bottom:1px solid rgba(168,85,247,.45);clip-path:polygon(6% 0,100% 0,94% 100%,0 100%)}
body.wl .sv-divider-line:last-child::after{right:auto;left:12%}
body.wl .sv-divider img{width:54px;height:54px}
body.wl .sv-divider+.wl-sec{padding-top:clamp(28px,4vw,44px)}
/* the footer */
:is(body.wl .wl-foot){border-top:1px solid rgba(54,243,255,.18);color:var(--sv-fog-dim);font-family:var(--mono);font-size:.85rem;background:linear-gradient(180deg,rgba(7,11,16,.2),rgba(4,7,13,.6))}
body.wl .wl-foot nav a{color:var(--sv-fog)}
body.wl .wl-foot nav a:hover{color:var(--sv-cyan)}
body.wl .wl-foot p{font-family:var(--sv-body);font-size:.8rem}

/* ---------- back to top: a ring with a slowly turning dashed orbit ---------- */
:is(body.wl, body.legal-page) .sv-top{position:fixed;right:1.25rem;bottom:1.25rem;z-index:90;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;border:2px solid transparent;color:var(--sv-cyan-soft);
  background:radial-gradient(circle at 50% 35%,rgba(22,32,58,.98),rgba(6,9,18,.98)) padding-box,linear-gradient(145deg,var(--sv-purple),var(--sv-cyan) 55%,#3b82f6) border-box;
  box-shadow:0 0 18px rgba(0,240,255,.25),0 0 30px -6px rgba(168,85,247,.6),inset 0 0 14px rgba(0,240,255,.12);
  opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .3s ease,transform .3s ease,box-shadow .2s ease}
:is(body.wl, body.legal-page) .sv-top::before{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px dashed rgba(0,240,255,.45);pointer-events:none;animation:sv-orbit 14s linear infinite}
:is(body.wl, body.legal-page) .sv-top.show{opacity:1;transform:none;pointer-events:auto}
:is(body.wl, body.legal-page) .sv-top svg{width:1.5rem;height:1.5rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 6px rgba(0,240,255,.55));transition:transform .2s ease}
:is(body.wl, body.legal-page) .sv-top:hover{box-shadow:0 0 26px rgba(0,240,255,.5),0 0 40px -4px rgba(168,85,247,.8),inset 0 0 18px rgba(0,240,255,.2)}
:is(body.wl, body.legal-page) .sv-top:hover svg{transform:translateY(-3px)}
:is(body.wl, body.legal-page) .sv-top:focus-visible{outline:2px solid var(--sv-white);outline-offset:4px}
@keyframes sv-orbit{to{transform:rotate(360deg)}}

/* ---------- the roadmap ---------- */
body.wl.rm .rm-hero h1{font-size:clamp(2.5rem,5vw,4.2rem);line-height:1.1}
body.wl.rm .rm-month{margin:18px 0 10px!important}
body.wl.rm .rm-card h3,body.wl.rm .rm-updates h3{color:var(--sv-white)}
body.wl.rm .rm-sec{border-top-color:rgba(54,243,255,.16)}
body.wl.rm .rm-updates li{border-bottom-color:rgba(54,243,255,.12)}
body.wl.rm .rm-updates time{color:var(--sv-cyan-soft);font-family:var(--mono)}
body.wl.rm :is(.rm-vote,.rm-votes){font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
body.wl.rm .rm-vote{background:rgba(11,17,30,.75);border-color:rgba(54,243,255,.25);color:var(--sv-cyan-soft);min-height:36px}
body.wl.rm .rm-vote[aria-pressed="true"]{border-color:var(--sv-cyan);color:var(--sv-white);box-shadow:0 0 18px rgba(54,243,255,.25)}
body.wl.rm .rm-form textarea{background:rgba(12,18,30,.96);border:1px solid var(--sv-border-dim);border-radius:15px;color:var(--sv-white)}
body.wl.rm .rm-form textarea:focus{outline:none;border-color:var(--sv-cyan);box-shadow:0 0 0 3px rgba(54,243,255,.14)}

/* ---------- the policies ---------- */
body.legal-page .lg-top .btn{--c1:var(--sv-cyan);--c2:var(--sv-magenta)}
body.legal-page .lg-wrap{position:relative}
body.legal-page .lg-toc{padding:1rem;gap:.15rem;counter-reset:navi}
body.legal-page .lg-toc>p{margin:0 0 .5rem}
body.legal-page .lg-toc a{--cut:8px;display:flex;align-items:center;gap:.85rem;border-radius:0;padding:.6rem .8rem;font-family:var(--sv-tech);font-weight:600;font-size:1rem;letter-spacing:.1em;text-transform:uppercase;color:var(--sv-white);
  clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut));transition:background .15s ease,color .15s ease,box-shadow .15s ease}
body.legal-page .lg-toc a::before{counter-increment:navi;content:counter(navi,decimal-leading-zero);font-family:var(--mono);font-size:.72rem;letter-spacing:0;color:var(--sv-cyan);opacity:.6}
body.legal-page .lg-toc a:is(:hover,:focus-visible){outline:none;color:var(--sv-cyan-soft);text-shadow:0 0 12px rgba(0,240,255,.45);background:linear-gradient(90deg,rgba(0,240,255,.16),rgba(168,85,247,.07) 70%,transparent);box-shadow:inset 2px 0 0 var(--sv-cyan)}
body.legal-page .lg-toc a:is(:hover,:focus-visible)::before{opacity:1}
body.legal-page .lg-main>h1{font-size:clamp(2.2rem,4.4vw,3.4rem);line-height:1.1;letter-spacing:.015em}
body.legal-page .lg-main section{border-top:1px solid rgba(54,243,255,.16)}
body.legal-page .lg-main h2{font-size:clamp(1.5rem,2.6vw,2rem);color:var(--sv-white)}
body.legal-page .lg-main h3{color:var(--sv-cyan-soft)}
body.legal-page .lg-main :is(p,li){color:var(--sv-fog)}
body.legal-page :is(.lg-lead,.lg-ver,.lg-small){color:var(--sv-fog-dim)}
body.legal-page .lg-ver{font-family:var(--mono);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase}
body.legal-page .lg-main a{color:var(--sv-cyan)}
body.legal-page .lg-main a:focus-visible{outline:2px solid var(--sv-cyan);outline-offset:2px}
body.legal-page .lg-main code{background:rgba(12,18,30,.96);border:1px solid var(--sv-border-dim);color:var(--sv-cyan-soft)}

/* ============================================================
   The dashboards
   ============================================================ */
/* the side (a top bar on tablets and phones): scanlines and the neon rail with its travelling highlight */
body.dash-page .db-side{background:linear-gradient(180deg,rgba(4,7,16,.94),rgba(7,11,24,.84));backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);border-right:0;box-shadow:10px 0 30px rgba(2,5,10,.45);z-index:20}
body.dash-page .db-side::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,240,255,.035) 0 1px,transparent 1px 3px)}
body.dash-page .db-side::after{content:"";position:absolute;top:0;bottom:0;right:0;width:2px;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.95),transparent) no-repeat,linear-gradient(180deg,transparent,var(--sv-cyan) 15%,var(--sv-purple) 50%,var(--sv-magenta) 85%,transparent);
  background-size:100% 16%,100% 100%;background-position:0 -30%,0 0;box-shadow:0 0 12px rgba(0,240,255,.5),0 0 24px rgba(168,85,247,.3);animation:sv-rail-scan 7s ease-in-out infinite}
@keyframes sv-rail-scan{0%{background-position:0 -30%,0 0}60%,100%{background-position:0 130%,0 0}}
body.dash-page .db-side>*{position:relative}
body.dash-page .db-side>.db-menu{display:none} /* the menu button: tablets, phones and narrow windows only */
body.dash-page .db-nav-h{color:var(--sv-fog-dim);font-family:var(--mono);letter-spacing:.12em}
/* menu entries: chamfered, the tech face; the page you are on glows */
body.dash-page .db-nav-a{--cut:8px;border-radius:0;font-family:var(--sv-tech);font-weight:600;font-size:1rem;letter-spacing:.08em;text-transform:uppercase;color:var(--sv-fog);
  clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut));transition:background .15s ease,color .15s ease,box-shadow .15s ease}
body.dash-page .db-nav-a svg{color:var(--sv-cyan);opacity:.7}
body.dash-page .db-nav-a:is(:hover,:focus-visible){outline:none;color:var(--sv-cyan-soft);text-shadow:0 0 12px rgba(0,240,255,.45);background:linear-gradient(90deg,rgba(0,240,255,.12),rgba(168,85,247,.05) 70%,transparent);box-shadow:inset 2px 0 0 color-mix(in srgb,var(--sv-cyan) 60%,transparent)}
body.dash-page .db-nav-a[aria-current]{color:var(--sv-cyan-soft);text-shadow:0 0 12px rgba(0,240,255,.45);background:linear-gradient(90deg,rgba(0,240,255,.16),rgba(168,85,247,.07) 70%,transparent);box-shadow:inset 2px 0 0 var(--sv-cyan),0 0 18px -6px rgba(0,240,255,.45)}
body.dash-page .db-nav-a[aria-current] svg,body.dash-page .db-nav-a:hover svg{opacity:1;filter:drop-shadow(0 0 6px rgba(0,240,255,.6))}
body.dash-page .db-nav-a em{font-family:var(--mono);font-size:.68rem;background:rgba(255,46,196,.16);color:#ffd0f1;border:1px solid rgba(255,46,196,.35)}
body.dash-page .db-pol a{color:var(--sv-fog)}
/* page titles: the gradient words; card titles read as eyebrows */
body.dash-page .db-head h1{font-size:clamp(1.7rem,3vw,2.4rem);letter-spacing:.015em;background:linear-gradient(135deg,var(--sv-cyan),var(--sv-purple),var(--sv-magenta));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 18px rgba(54,243,255,.2);width:fit-content;max-width:100%}
body.dash-page .db-head p{color:var(--sv-fog)}
body.dash-page .db-card-h h2{font-family:var(--mono);font-size:.8rem;font-weight:600;color:var(--sv-cyan-soft);text-transform:uppercase;letter-spacing:.12em;text-shadow:0 0 18px rgba(54,243,255,.4)}
body.dash-page .db-tile small{color:var(--sv-fog-dim)}
body.dash-page .db-tile:not(.warn):not(.ok) b{color:var(--sv-cyan);background:none;-webkit-text-fill-color:currentColor;text-shadow:0 0 16px rgba(0,240,255,.4)}
body.dash-page .db-tile:hover{box-shadow:0 12px 30px rgba(54,243,255,.12)}
/* tabs (Profit | Costs | Books | Prices...): a chamfered group, the open one glows */
body.dash-page .db-tabs{border-radius:0;border:1px solid rgba(54,243,255,.16);background:rgba(11,17,30,.75);--cut:10px;clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut))}
body.dash-page .db-tabs a{--cut:7px;border-radius:0;font-family:var(--sv-tech);font-weight:700;font-size:.92rem;letter-spacing:.1em;text-transform:uppercase;color:var(--sv-fog);clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut))}
body.dash-page .db-tabs a:hover{background:rgba(0,240,255,.08);color:var(--sv-cyan-soft)}
body.dash-page .db-tabs a[aria-current]{color:var(--sv-cyan-soft);background:linear-gradient(90deg,rgba(0,240,255,.16),rgba(168,85,247,.07) 70%,transparent);box-shadow:inset 2px 0 0 var(--sv-cyan);text-shadow:0 0 12px rgba(0,240,255,.45)}
body.dash-page .db-tabs a:focus-visible{outline:2px solid var(--sv-cyan);outline-offset:-3px}
/* filter chips: silvea.tech's badges */
body.dash-page .db-chips button{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;background:rgba(11,17,30,.75);border:1px solid rgba(54,243,255,.25);color:var(--sv-cyan-soft)}
body.dash-page .db-chips button[aria-pressed="true"]{background:linear-gradient(120deg,rgba(0,240,255,.2),rgba(168,85,247,.2));border-color:var(--sv-cyan);color:var(--sv-white);box-shadow:0 0 18px rgba(54,243,255,.25)}
/* fields */
body.dash-page :is(.fld,.db-tools) :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea,.dd){background:rgba(12,18,30,.96);border:1px solid var(--sv-border-dim);border-radius:10px;color:var(--sv-white)}
body.dash-page :is(.fld,.db-tools) :is(input,select,textarea):focus,body.dash-page :is(.fld,.db-tools) .dd:is(:focus-visible,[aria-expanded="true"]){outline:none;border-color:var(--sv-cyan);box-shadow:0 0 0 3px rgba(54,243,255,.14)}
body.dash-page .fld>span{font-family:var(--mono);font-size:.72rem;color:var(--sv-fog);text-transform:uppercase;letter-spacing:.06em}
/* pop-ups on the dashboard: a raised panel with HUD corners (the editor's own pop-ups are not touched) */
body.dash-page .modal .sheet{background:var(--sv-panel-raised);border:1px solid rgba(54,243,255,.22);border-radius:15px;overflow:visible}
body.dash-page .modal .sheet::before,body.dash-page .modal .sheet::after{content:"";position:absolute;width:20px;height:20px;z-index:2;pointer-events:none;border:1.5px solid var(--sv-cyan);opacity:.75;filter:drop-shadow(0 0 6px rgba(0,240,255,.5));background:none;border-radius:0;left:auto;right:auto;height:20px}
body.dash-page .modal .sheet::before{top:-8px;left:-8px;border-right:none;border-bottom:none}
body.dash-page .modal .sheet::after{bottom:-8px;right:-8px;border-left:none;border-top:none}
body.dash-page .modal .sheet-head h2{font-family:var(--sv-display);letter-spacing:.015em}
/* the dashboard's sign-in */
body.dash-page .db-auth-box h1{font-size:clamp(1.6rem,3vw,2rem)}
body.dash-page .db-auth-box .acct-go{width:100%}
body.dash-page .db-auth .ln-link{font-family:var(--mono);font-size:.78rem;letter-spacing:.04em;color:var(--sv-cyan)}

/* ============================================================
   The account screens in the builder (sign in, sign up, verify,
   reset, the terms gate): Silvea's front door. They follow the
   builder's light or dark theme, so the glow and gradient words
   are dark theme only; the plan cards of the trial-ended screen
   are not restyled here.
   ============================================================ */
.acct-gate .ln-top{position:relative;border-bottom:0}
.acct-gate .ln-top::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.95),transparent) no-repeat,linear-gradient(90deg,transparent,var(--sv-cyan) 15%,var(--sv-purple) 50%,var(--sv-magenta) 85%,transparent);
  background-size:16% 100%,100% 100%;background-position:-30% 0,0 0;box-shadow:0 0 12px rgba(0,240,255,.5),0 0 24px rgba(168,85,247,.3);animation:sv-nav-scan 7s ease-in-out infinite}
.acct-gate .ln-eyebrow{color:color-mix(in srgb,var(--ice) 55%,var(--text));text-shadow:none}
.acct-gate .acct-box h1{font-family:var(--sv-display);font-weight:600;letter-spacing:.015em}
.acct-gate .acct-box .acct-go{width:100%;margin-top:6px}
.acct-gate .ln-link{font-family:var(--mono);font-size:.78rem;letter-spacing:.04em}
.acct-gate .acct-box:not(.wide) .fld>span{font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em}
/* dark theme: the full silvea.tech treatment */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .acct-gate .ln-eyebrow{color:var(--sv-cyan-soft);text-shadow:0 0 18px rgba(54,243,255,.4)}
  :root:not([data-theme="light"]) .acct-gate .acct-box:not(.wide) h1{background:linear-gradient(135deg,var(--sv-cyan),var(--sv-purple),var(--sv-magenta));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 18px rgba(54,243,255,.2);width:fit-content;max-width:100%}
  :root:not([data-theme="light"]) .acct-gate .acct-box:not(.wide) .fld input{background:rgba(12,18,30,.96);border:1px solid var(--sv-border-dim);border-radius:15px;color:var(--sv-white)}
  :root:not([data-theme="light"]) .acct-gate .acct-box:not(.wide) .fld input:focus{border-color:var(--sv-cyan);box-shadow:0 0 0 3px rgba(54,243,255,.14)}
}
:root[data-theme="dark"] .acct-gate .ln-eyebrow{color:var(--sv-cyan-soft);text-shadow:0 0 18px rgba(54,243,255,.4)}
:root[data-theme="dark"] .acct-gate .acct-box:not(.wide) h1{background:linear-gradient(135deg,var(--sv-cyan),var(--sv-purple),var(--sv-magenta));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 18px rgba(54,243,255,.2);width:fit-content;max-width:100%}
:root[data-theme="dark"] .acct-gate .acct-box:not(.wide) .fld input{background:rgba(12,18,30,.96);border:1px solid var(--sv-border-dim);border-radius:15px;color:var(--sv-white)}
:root[data-theme="dark"] .acct-gate .acct-box:not(.wide) .fld input:focus{border-color:var(--sv-cyan);box-shadow:0 0 0 3px rgba(54,243,255,.14)}

/* ============================================================
   Smaller screens
   ============================================================ */
@media (max-width:900px){
  body.wl .wl-top-acts .btn{display:none}
  body.wl .wl-top .wl-nav{position:fixed;inset:76px 1rem auto 1rem;width:auto;padding:1.1rem;max-height:calc(100vh - 92px);overflow-y:auto;
    opacity:1;visibility:hidden;transform:translateX(110%);transition:transform .25s ease,visibility .25s}
  body.wl .wl-top .wl-nav.open{visibility:visible;transform:translateX(0)}
  body.wl .wl-top .wl-nav .wl-menu-cta{display:flex;width:100%;padding:.8rem 1rem .8rem 1.6rem;font-size:.95rem}
  body.wl .wl-top .wl-nav a:not(.wl-menu-cta)+.wl-menu-cta{margin-top:.6rem}
  body.wl .wl-top .wl-nav .wl-menu-cta+.wl-menu-cta{margin-top:.45rem}
  body.dash-page .db-side{box-shadow:0 10px 30px rgba(2,5,10,.45)}
  body.dash-page .db-side::after{top:auto;bottom:0;left:0;right:0;width:auto;height:2px;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.95),transparent) no-repeat,linear-gradient(90deg,transparent,var(--sv-cyan) 15%,var(--sv-purple) 50%,var(--sv-magenta) 85%,transparent);
    background-size:16% 100%,100% 100%;background-position:-30% 0,0 0;animation:sv-nav-scan 7s ease-in-out infinite}
  body.dash-page .db-nav-a{font-size:.92rem}
  body.dash-page .db-side>.db-nav>.db-nav-in{padding:1rem}
  /* the dashboard's menu: silvea.tech's chamfered HUD panel under the menu button */
  body.dash-page .db-side>.db-menu{display:inline-flex;width:2.75rem;height:2.75rem;gap:5px;border:none;border-radius:0}
  body.dash-page .db-side>.db-nav{--cut:18px;position:absolute;isolation:isolate;padding:0;border:0;border-radius:0;box-shadow:none;
    clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut));
    background:linear-gradient(150deg,var(--sv-cyan),var(--sv-purple) 55%,var(--sv-magenta));filter:drop-shadow(0 18px 30px rgba(2,5,10,.55))}
  body.dash-page .db-side>.db-nav::before{content:"";position:absolute;inset:1.5px;z-index:-1;clip-path:inherit;
    background:repeating-linear-gradient(0deg,rgba(0,240,255,.03) 0 1px,transparent 1px 3px),radial-gradient(120% 60% at 100% 0%,rgba(168,85,247,.14),transparent 60%),linear-gradient(180deg,rgba(9,15,30,.99),rgba(5,8,18,.99))}
}
@media (max-width:820px){
  body.wl .wl-end{padding:2rem 1.5rem;--sv-c:18px}
  body.legal-page .lg-toc{display:grid}
  body.legal-page .lg-toc a{border:0}
}
@media (max-width:640px){
  body.wl .wl-band{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:1.5rem}
  body.wl .wl-band p:nth-child(3)::before{display:none}
}
@media (max-width:600px){
  :is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn{min-height:44px}
  :is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn.small{min-height:44px;padding:.5rem 1rem}
  body.wl .wl-ctas .btn{flex:1 1 100%}
  /* long button words wrap inside the button (builder.css keeps .btn on one line), clear of the angled ends */
  body.wl .wl-ctas .btn{white-space:normal;text-align:center;line-height:1.35;padding-inline:2.2rem}
  :is(body.wl, body.legal-page) .sv-top{width:48px;height:48px;right:.9rem;bottom:.9rem}
  :is(body.wl, body.legal-page) .sv-top svg{width:1.3rem;height:1.3rem}
  body.wl .wl-ic{--sv-size:46px}
  body.wl .wl-for-list li{grid-template-columns:46px minmax(0,1fr)}
  body.wl .wl-tag{top:-12px}
  body.dash-page .db-tabs a{font-size:.85rem;padding:8px 10px}
  body.dash-page .db-side>.db-role{display:none}
  body.dash-page .db-side{padding:8px 12px;gap:6px 8px;flex-wrap:nowrap}
  body.dash-page .db-side>.db-brand{flex:0 1 auto;min-width:0}
  /* HUD corners sit a little closer on narrow screens, inside the page's gutter */
  body.dash-page :is(.db-card,.db-auth-box)::before{top:-6px;left:-6px}
  body.dash-page :is(.db-card,.db-auth-box)::after{bottom:-6px;right:-6px}
  body.legal-page .lg-toc a{font-size:.92rem;min-height:44px}
}

/* ---------- less motion: no scan, blink, glitch, shimmer or orbit ---------- */
@media (prefers-reduced-motion:reduce){
  :is(body.wl .wl-top, body.legal-page .lg-top, body.dash-page .db-side)::after,.acct-gate .ln-top::after{animation:none}
  :is(body.wl, body.legal-page, body.dash-page, .acct-gate) :is(.btn,.btn::before,.btn::after,.sv-toggle span,.wl-ic){transition:none!important;animation:none!important}
  :is(body.wl, body.legal-page, body.dash-page, .acct-gate) .btn:hover:not(:disabled){transform:none}
  body.wl .wl-grad[data-text]::before,body.wl .wl-grad[data-text]::after{display:none}
  :is(body.wl, body.legal-page) .sv-top::before{animation:none}
  :is(body.wl :is(.wl-way,.wl-feat,.wl-plan,.rm-card)):hover{transform:none}
}

/* ---------- owners: the phone tab bar, Quick add and fields typed in place ---------- */
body.dash-page .db-tabbar{background:linear-gradient(180deg,rgba(7,11,24,.9),rgba(4,7,16,.97));backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);border-top:1px solid rgba(54,243,255,.18);box-shadow:0 -10px 30px rgba(2,5,10,.45)}
body.dash-page .db-tabbar a{font-family:var(--sv-tech);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--sv-fog)}
body.dash-page .db-tabbar a[aria-current]{color:var(--sv-cyan-soft);text-shadow:0 0 12px rgba(0,240,255,.45);background:linear-gradient(180deg,rgba(0,240,255,.12),transparent)}
body.dash-page .db-tabbar a[aria-current] svg{filter:drop-shadow(0 0 6px rgba(0,240,255,.6))}
body.dash-page .db-tabbar i{background:var(--sv-magenta);font-family:var(--mono);box-shadow:0 0 10px rgba(255,46,196,.6)}
body.dash-page .db-fab-btn{background:linear-gradient(135deg,var(--sv-cyan),var(--sv-purple) 55%,var(--sv-magenta));color:#fff;box-shadow:0 0 22px rgba(0,240,255,.35),0 12px 28px -10px rgba(0,0,0,.7)}
body.dash-page .db-fab-menu{background:var(--sv-panel-raised),#0a0f1c;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(54,243,255,.22);border-radius:15px}
body.dash-page .db-fab-menu button{font-family:var(--sv-tech);letter-spacing:.06em;text-transform:uppercase;font-size:.88rem;color:var(--sv-white)}
body.dash-page .db-fab-menu button:is(:hover,:focus-visible){background:linear-gradient(90deg,rgba(0,240,255,.14),transparent);color:var(--sv-cyan-soft)}
body.dash-page .db-inl :is(input,textarea){background:rgba(12,18,30,.96);border-color:var(--sv-border-dim);color:var(--sv-white)}
body.dash-page .db-inl :is(input,textarea):focus{border-color:var(--sv-cyan);box-shadow:0 0 0 3px rgba(54,243,255,.14)}
body.dash-page .db-inl>span{font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--sv-fog)}
body.dash-page .db-price-edit{color:var(--sv-cyan-soft);font-family:var(--mono);font-size:.72rem}
@media (prefers-reduced-motion:reduce){body.dash-page .db-tabbar a{transition:none}}
