/* tokens live on the wrapper too, so a theme that declares its own --black or
   --white on :root can never repaint the app */
:root,
#onqol-gs{
  --black:#0A0A0A; --red:#C40505; --red-hi:#D60C0C; --gold:#FFB900; --white:#FFFFFF;
  --soft:#CFCFCF; --grey:#8A8A8A;
  --line:rgba(255,255,255,.12); --line-hi:rgba(255,255,255,.3);
  --display:'Bebas Neue',Impact,sans-serif; --body:'DM Sans',Arial,sans-serif; --mono:'Courier New',monospace;
  --ease:cubic-bezier(.16,1,.3,1); --fly:cubic-bezier(.5,.02,.28,1);
  /* RACK card tokens: direction A, signed off. Contrast measured, not estimated. */
  --opt-bg:#1A1A1A; --opt-bd:#6C6C6C; --opt-ix:#232323; --opt-tx:#E6E6E6;
  --opt-bg-h:#262626; --opt-bd-h:#B4B4B4;
  --opt-bg-on:#45350C;
  --opt-bg-off:#141414; --opt-bd-off:#4A4A4A; --opt-tx-off:#848484; --opt-ix-off:#191919;
}
/* ============================================================
   THEME SHIELD
   Everything is scoped to the #onqol-gs wrapper, so each rule here
   outranks the theme and the Elementor kit (".elementor-kit-5 h2",
   "button:hover", ".card"...) without a single !important.
   The first rule sends every HTML element in the app back to the
   browser defaults, which is exactly what the prototype was
   designed against: headings inherit white again, buttons stop
   picking up the theme's colours, borders, radius and nowrap.
   SVG is left alone, its fill and stroke attributes must survive.
   ============================================================ */
#onqol-gs :not(svg,svg *),
#onqol-gs :not(svg,svg *)::before,
#onqol-gs :not(svg,svg *)::after{all:revert;box-sizing:border-box}
#onqol-gs{color:var(--white);font-family:var(--body);font-size:16px;line-height:normal;text-align:left;direction:ltr;
  letter-spacing:normal;text-transform:none;-webkit-font-smoothing:antialiased}
html{scroll-behavior:auto!important}
html,
body.onqol-gs-page{margin:0;background:var(--black);color:var(--white);font-family:var(--body);-webkit-font-smoothing:antialiased}
/* clip, not hidden: hidden turns body into a scroll container on some themes,
   which breaks the sticky deck on mobile */
body.onqol-gs-page{overflow-x:hidden;overflow-x:clip}
#onqol-gs button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
#onqol-gs :focus-visible{outline:2px solid var(--gold);outline-offset:3px}
/* logged-in admins: keep the top bar below the WordPress toolbar */
@media (min-width:783px){body.admin-bar #onqol-gs .topbar{top:32px}}

#onqol-gs .bg-grid{position:fixed;inset:-30% -30% -10%;z-index:0;pointer-events:none;transform-origin:center bottom;
  transform:perspective(900px) rotateX(64deg) translateY(44%);
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:64px 64px;-webkit-mask-image:linear-gradient(to top,#000,transparent 68%);mask-image:linear-gradient(to top,#000,transparent 68%)}

#onqol-gs .topbar{position:fixed;z-index:50;top:0;left:0;right:0;height:60px;display:flex;align-items:center;justify-content:space-between;
  padding:0 clamp(16px,3vw,44px);background:linear-gradient(#0A0A0A 45%,rgba(10,10,10,0));pointer-events:none}
#onqol-gs .topbar>*{pointer-events:auto}
#onqol-gs .logo{font-family:Arial,Helvetica,sans-serif;font-weight:900;font-size:17px;letter-spacing:-.07em}
#onqol-gs .hud{display:flex;align-items:center;gap:9px;font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.45)}
#onqol-gs .hud i{width:6px;height:6px;border-radius:50%;background:var(--red-hi);box-shadow:0 0 10px var(--red);transition:background .6s,box-shadow .6s}
#onqol-gs .hud.live i{background:var(--gold);box-shadow:0 0 10px var(--gold)}
#onqol-gs .hud b{color:#fff;font-weight:500}
#onqol-gs .kicker{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--red-hi);margin:0 0 10px}
#onqol-gs .kicker.gold{color:var(--gold)}
#onqol-gs .lede{color:rgba(255,255,255,.68);font-size:16px;line-height:1.65;max-width:46ch;margin:18px 0 0}
#onqol-gs .meta{font-size:13px;color:var(--grey)}
#onqol-gs .btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;background:var(--gold);color:var(--black);
  font-family:var(--display);font-size:22px;letter-spacing:.04em;transition:background .2s,transform .1s}
#onqol-gs .btn:hover{background:#ffc733}#onqol-gs .btn:active{transform:scale(.985)}
#onqol-gs .btn-ghost{background:transparent;color:#fff;border:1px solid var(--line-hi)}

/* ============================================================
   HERO CORONA AND LASER
   Both live only before ignition and are disposed on press.
   ============================================================ */
#onqol-gs .core-stage{position:relative;isolation:isolate;pointer-events:none}
#onqol-gs .core-stage .core-effects{position:absolute;inset:0;pointer-events:none}
#onqol-gs .core-stage .gl-stars,
#onqol-gs .core-stage .gl-laser{position:absolute;pointer-events:none;transition:opacity 400ms linear}
#onqol-gs .core-stage .gl-stars{left:50%;top:50%;width:var(--galaxy-size,110%);height:var(--galaxy-size,110%);transform:translate(-50%,-50%);z-index:0}
#onqol-gs .core-stage .gl-stars canvas{width:100%;height:100%;display:block;
  -webkit-mask-image:radial-gradient(circle closest-side,#000 var(--star-mid,65%),transparent 100%);
  mask-image:radial-gradient(circle closest-side,#000 var(--star-mid,65%),transparent 100%)}
#onqol-gs .core-stage .gl-laser{inset:-35%;z-index:1;mix-blend-mode:screen;
  -webkit-mask-image:radial-gradient(ellipse closest-side,#000 35%,transparent 58%);
  mask-image:radial-gradient(ellipse closest-side,#000 35%,transparent 58%)}
#onqol-gs .core-stage .gl-laser canvas{width:100%;height:100%;display:block}
#onqol-gs .core-stage .gone{opacity:0}
#onqol-gs .gl-space{position:absolute;inset:0;z-index:0;pointer-events:none}
/* deep space is a page-level layer, not a hero decoration: it is painted once, stays
   fixed behind every section, and only dims once the quiz starts, so the background
   never cuts to flat black at the end of the first screen */
#onqol-gs .space-bg{position:fixed;inset:0;z-index:0;pointer-events:none}
#onqol-gs .space-bg canvas{width:100%;height:100%;display:block}
#onqol-gs .gl-space canvas{width:100%;height:100%;display:block}

/* ============================================================
   ENGINE : one object. Placed by script, never by CSS.
   ============================================================ */
#onqol-gs .engine{position:absolute;z-index:4;top:0;left:0;pointer-events:none;will-change:transform}
#onqol-gs .engine svg{position:relative;z-index:1;width:100%;height:100%;display:block;overflow:visible}
  /* the SVG is positioned so it paints above the star canvas. Without this the stars
     cover the core and the inside stops being black, which is the whole point of it. */
#onqol-gs .engine .hit{pointer-events:auto;cursor:pointer}
#onqol-gs .spin{transform-box:view-box;transform-origin:300px 300px}
#onqol-gs .r-out{animation:spin 64s linear infinite}
#onqol-gs .r-mid{animation:spin 42s linear infinite reverse}
#onqol-gs .r-in{animation:spin 26s linear infinite}
#onqol-gs .disc{animation:spin 20s linear infinite}
#onqol-gs .fade{transition:opacity .9s var(--ease)}
/* the horizon holds its size. It used to run the `beat` keyframes, which scale the whole
   group: that read as the ring swelling and shrinking, and it drifted against the laser
   ring, which keeps a fixed radius. The life now comes from the light travelling round it. */
#onqol-gs .horizon{transform-box:view-box;transform-origin:300px 300px;animation:horizonBreath 5.5s ease-in-out infinite}
@keyframes horizonBreath{50%{opacity:.88}}
#onqol-gs .core-dot{transform-box:fill-box;transform-origin:center;animation:beat 2.6s ease-in-out infinite}
#onqol-gs .sector{fill:none;stroke-width:15}
#onqol-gs .sector-fill{fill:none;stroke:var(--gold);stroke-width:15;transition:stroke-dasharray .9s var(--ease)}
#onqol-gs .sector-fill.hollow{stroke:rgba(255,185,0,.2)}
#onqol-gs .tick{cursor:pointer;pointer-events:auto}
#onqol-gs .tick circle+circle{transition:r .2s,fill .2s}
#onqol-gs .tick:hover circle+circle{r:7;fill:#fff}
#onqol-gs .intake{opacity:0;transform-box:view-box;transform-origin:300px 300px}
#onqol-gs .intake.go{animation:intake .7s var(--ease)}
#onqol-gs .shock{opacity:0;transform-box:view-box;transform-origin:300px 300px}
body.is-paused #onqol-gs *{animation-play-state:paused!important}
#onqol-gs .engine.rush .r-out{animation-duration:4s}
#onqol-gs .engine.rush .r-mid{animation-duration:2.6s}
#onqol-gs .engine.rush .r-in{animation-duration:1.6s}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes beat{50%{transform:scale(.93);opacity:.82}}
@keyframes intake{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(2.8)}}

/* ---------- assembly: four stages, built in front of the visitor ---------- */
#onqol-gs .asm-group{transform-box:view-box;transform-origin:300px 300px}
#onqol-gs .asm .asm-shock{animation:shock calc(var(--t-flare) + var(--t-rings)) var(--ease) both}
#onqol-gs .asm .asm-rings{animation:asmRings var(--t-rings) var(--ease) both;animation-delay:var(--d-rings)}
#onqol-gs .asm .asm-sectors{animation:asmSectors var(--t-sectors) var(--ease) both;animation-delay:var(--d-sectors)}
#onqol-gs .asm .asm-core{animation:asmCore var(--t-core) var(--ease) both;animation-delay:var(--d-core)}
#onqol-gs .asm .asm-horizon{animation:asmFlare var(--t-flare) var(--ease) both}
/* skipped or reduced motion: everything is simply present */
#onqol-gs .asm-done .asm-rings,
#onqol-gs .asm-done .asm-sectors,
#onqol-gs .asm-done .asm-core{animation:none!important;opacity:1;transform:none}
#onqol-gs .asm-done .asm-shock{animation:none!important;opacity:0}
@keyframes shock{0%{opacity:.95;transform:scale(.42)}100%{opacity:0;transform:scale(2.4)}}
@keyframes asmFlare{0%{opacity:.2}30%{opacity:1}100%{opacity:1}}
@keyframes asmRings{0%{opacity:0;transform:scale(.34)}100%{opacity:1;transform:scale(1)}}
@keyframes asmSectors{0%{opacity:0;transform:rotate(-16deg) scale(.9)}100%{opacity:1;transform:none}}
@keyframes asmCore{0%{opacity:0;transform:scale(.5) rotate(-24deg)}100%{opacity:1;transform:none}}

/* ---------- the six pillars orbiting the engine on the result ---------- */
#onqol-gs .orbit{position:absolute;inset:0;z-index:5;pointer-events:none}
#onqol-gs .orbit-item{position:absolute;left:50%;top:50%;width:0;height:0;pointer-events:none}
#onqol-gs .orbit-label{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;pointer-events:auto;cursor:default;
  font-family:var(--display);letter-spacing:.03em;line-height:1;padding:6px 12px;border:1px solid rgba(255,255,255,.18);
  background:rgba(10,10,10,.86);color:#fff;transition:border-color .2s,color .2s,background .2s}
#onqol-gs .orbit-label:hover,
#onqol-gs .orbit-label:focus-visible{border-color:var(--gold)}
#onqol-gs .orbit-label small{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.16em;color:var(--gold);margin-top:3px}
#onqol-gs .orbit-label.unpowered{background:transparent;border-style:dashed;border-color:rgba(255,255,255,.4);color:rgba(255,255,255,.72)}

/* ---------- travelling answer ---------- */
#onqol-gs .flyer{position:fixed;z-index:40;pointer-events:none;padding:10px 14px;border:1px solid var(--gold);background:rgba(26,21,4,.97);
  color:#fff;font-size:14px;line-height:1.35}

/* ---------- grain, final section only ---------- */
#onqol-gs .noise-host{position:relative;overflow:hidden}
#onqol-gs .noise-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:1}

#onqol-gs .sheet{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;animation:fadeIn .2s}
#onqol-gs .sheet-in{width:92%;max-width:440px;background:#121212;border:1px solid #2a2a2a;padding:26px;animation:riseIn .3s var(--ease) both}
#onqol-gs .sheet-in .btn{width:100%;margin-top:10px}
@keyframes fadeIn{from{opacity:0}}
@keyframes riseIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion:reduce){
  #onqol-gs *,
#onqol-gs *::before,
#onqol-gs *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* ============================================================
   0.4.0: market card, details card, server messages
   ============================================================ */
#onqol-gs select.input,
#onqol-gs select.m-input{-webkit-appearance:menulist;appearance:auto;cursor:pointer}
#onqol-gs select option{background:#141414;color:#fff}
#onqol-gs .oq-chips{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px}
#onqol-gs .oq-chips .chip,
#onqol-gs .oq-chips .m-chip{padding:8px 10px;text-align:left;line-height:1.3;cursor:pointer}
#onqol-gs .chip.bad-input,
#onqol-gs .m-chip.bad-input{border-color:#C40505}
#onqol-gs .oq-err{display:block;margin-top:6px;color:#FF6B6B;font-size:13px;line-height:1.4}
#onqol-gs .oq-alert{display:block;margin:0 0 14px;padding:12px 14px;border:1px solid #C40505;background:rgba(196,5,5,.12);color:#fff;font-size:14px;line-height:1.5}
#onqol-gs .oq-hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
#onqol-gs .btn[disabled]{opacity:.5;cursor:not-allowed}

/* ============================================================
   0.6.0: audit request (both builds) and the report link page
   One panel. .is-sheet rises from the bottom on the phone,
   .is-dialog sits in the centre on desktop. RACK language:
   mono rail, sharp corners, index-bay segments.
   ============================================================ */
#onqol-gs .oq-req-back{position:fixed;inset:0;z-index:70;background:rgba(0,0,0,.74);display:flex;animation:fadeIn .22s both}
#onqol-gs .oq-req-back.is-sheet{align-items:flex-end}
#onqol-gs .oq-req-back.is-dialog{align-items:center;justify-content:center;padding:24px}
#onqol-gs .oq-req{width:100%;background:#0F0F0F;border:1px solid #2E2E2E;border-top:2px solid #C40505;color:#fff;max-height:100%;overflow-y:auto;overscroll-behavior:contain}
#onqol-gs .is-sheet .oq-req{padding-bottom:env(safe-area-inset-bottom);animation:reqUp .34s var(--ease) both}
#onqol-gs .is-dialog .oq-req{max-width:480px;animation:riseIn .3s var(--ease) both}
#onqol-gs .oq-req-back.shut{animation:reqFade .26s both}
#onqol-gs .is-sheet.shut .oq-req{animation:reqDown .26s ease-in both}
@keyframes reqUp{from{transform:translateY(100%)}to{transform:none}}
@keyframes reqDown{to{transform:translateY(100%)}}
@keyframes reqFade{to{opacity:0}}
#onqol-gs .oq-req-rail{display:flex;justify-content:space-between;align-items:center;height:36px;padding:0 16px;border-bottom:1px solid #222;
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#8A8A8A}
#onqol-gs .oq-req-rail span{display:flex;align-items:center;gap:8px}
#onqol-gs .oq-req-rail i{width:6px;height:6px;border-radius:50%;background:#FFB900;box-shadow:0 0 8px #FFB900}
#onqol-gs .oq-req-x{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#CFCFCF;padding:8px 0 8px 12px}
#onqol-gs .oq-req-body,
#onqol-gs .oq-req-done{padding:18px 16px 20px}
#onqol-gs .oq-req h3{font-family:var(--display);font-weight:400;font-size:30px;line-height:1;margin:0;color:#fff}
#onqol-gs .oq-req .kicker{margin:0 0 6px}
#onqol-gs .oq-req-purpose{margin:8px 0 0;color:#CFCFCF;font-size:14px;line-height:1.5}
#onqol-gs .oq-req-f{display:block;margin-top:14px}
#onqol-gs .oq-req-l{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#8A8A8A;margin-bottom:6px}
#onqol-gs .oq-req-ro{height:44px;display:flex;align-items:center;padding:0 12px;border:1px dashed #4A4A4A;background:#141414;color:#E6E6E6;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#onqol-gs .oq-req-in{width:100%;height:48px;padding:0 12px;border:1px solid #6C6C6C;background:#1A1A1A;color:#fff;font:inherit;font-size:16px;border-radius:0}
#onqol-gs .oq-req-in:focus{outline:none;border-color:#FFB900}
#onqol-gs .oq-req-in.bad-input{border-color:#C40505}
#onqol-gs .oq-req-seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
#onqol-gs .oq-req-seg button{height:44px;border:1px solid #6C6C6C;background:#1A1A1A;color:#E6E6E6;font-size:14px}
#onqol-gs .oq-req-seg button.on{border-color:#FFB900;box-shadow:inset 0 0 0 1px #FFB900;background:#45350C;color:#fff}
#onqol-gs .oq-req-go{width:100%;margin-top:18px}
#onqol-gs .oq-req .oq-alert{margin:14px 0 0}
#onqol-gs .oq-req .oq-alert a{color:#FFB900;text-decoration:underline}
#onqol-gs .oq-req-note{margin:10px 0 0;color:#8A8A8A;font-size:12px;line-height:1.4}
#onqol-gs .oq-req-done{text-align:center;padding-top:28px}
#onqol-gs .oq-req-done p{color:#CFCFCF;font-size:15px;line-height:1.5;margin:8px 0 18px}
#onqol-gs .oq-req-done .btn{width:100%}
#onqol-gs .oq-req-tick{display:block;width:44px;height:44px;margin:0 auto 14px;border:2px solid #FFB900;border-radius:50%;position:relative;animation:reqTick .5s var(--ease) both}
#onqol-gs .oq-req-tick::after{content:"";position:absolute;left:14px;top:9px;width:10px;height:18px;border:solid #FFB900;border-width:0 2px 2px 0;transform:rotate(45deg)}
@keyframes reqTick{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}

#onqol-gs .oq-link{position:relative;z-index:2;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:84px 16px 32px}
#onqol-gs .oq-link-card{width:100%;max-width:520px;border:1px solid #2E2E2E;border-top:2px solid #C40505;background:rgba(15,15,15,.94);padding:22px 18px}
#onqol-gs .oq-link-card h2{font-family:var(--display);font-weight:400;font-size:34px;line-height:.95;margin:6px 0 0;color:#fff}
#onqol-gs .oq-link-score{display:flex;align-items:baseline;gap:10px}
#onqol-gs .oq-link-score b{font-family:var(--display);font-weight:400;font-size:84px;line-height:.9;color:#fff}
#onqol-gs .oq-link-score span{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#8A8A8A}
#onqol-gs .oq-link-line{color:#FFB900;font-size:15px;line-height:1.5;margin:10px 0 0}
#onqol-gs .oq-link-bn{margin:14px 0 18px;padding:10px 12px;border-left:2px solid #C40505;background:rgba(196,5,5,.08);color:#fff;font-size:15px}
#onqol-gs .oq-link-bn span{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#8A8A8A;margin-bottom:4px}
#onqol-gs .oq-link-card .btn{width:100%}
#onqol-gs .oq-link-new{display:block;margin:14px auto 0;color:#8A8A8A;font-size:13px;text-decoration:underline}
#onqol-gs .oq-link-wait{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#8A8A8A}