/* /instiv2/risk-profile/ page styles: the assessment (one question per glass card, a live riskometer beside it),
   the report in three states (ghosted sample, provisional reading, final) with a flipping result card, the scoring
   panel extras, the red flag wall and the closing band. Shared parts come from styles.css and kit.css. */

:root { --rp-g: #0B8F5F; }
html[data-theme="dark"] { --rp-g: #3DDC97; }
.peel-one .rail, .peel-one .peel-progress { display: none; }

/* ---------- the assessment ---------- */
.rq { min-height: 100svh; background: var(--frame-glow); color: var(--page-text); }
.rq .kicker { color: var(--page-muted); }
.rq .kicker .num { color: var(--page-text); border-color: var(--page-line); }
.rq-in { display: grid; grid-template-columns: minmax(260px, .62fr) 1.6fr; gap: clamp(24px, 4vw, 72px); align-items: center; max-width: 1480px; min-height: 100svh; margin: 0 auto; padding: calc(var(--hdr) + 3vh) var(--pad) 4vh; }
.rq-side, .rq-main { min-width: 0; }
.rq-h { margin: 0; font-size: clamp(30px, 3.2vw, 50px); font-weight: 700; line-height: 1.02; letter-spacing: -0.04em; }
.rq-sub { margin: 14px 0 0; max-width: 21.45em; color: var(--page-muted); font-size: 15px; min-height: 3em; }
.rq-secs { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 1px; }
.rq-secs li { display: grid; grid-template-columns: 28px 1fr 14px; align-items: center; gap: 8px; padding: 5px 12px; border-radius: 12px; font-size: 13.5px; color: var(--page-faint); transition: background .4s var(--ease), color .4s; }
.rq-secs li b { font: 500 12px/1 "JetBrains Mono", "JBM Fallback", monospace; }
.rq-secs li::after { content: ""; width: 8px; height: 8px; border-radius: 50%; border: 1px solid var(--page-line); justify-self: end; }
.rq-secs li.is-done { color: var(--page-muted); }
.rq-secs li.is-done::after { background: var(--gain); border-color: var(--gain); }
.rq-secs li.is-on { color: var(--page-text); background: var(--page-glass); box-shadow: 0 0 0 1px var(--page-line); font-weight: 600; }
.rq-prog { margin-top: 16px; }
.rq-prog-top { display: flex; justify-content: space-between; font: 500 12px/1 "JetBrains Mono", "JBM Fallback", monospace; letter-spacing: .06em; color: var(--page-muted); }
.rq-prog .pnl-bar i { transition: transform .6s var(--ease); }
.rq-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* the live riskometer: a small dial whose needle swings after each scored answer */
.rq-live { display: grid; grid-template-columns: 132px 1fr; align-items: center; gap: 14px; margin-top: 18px; padding: 12px 14px; border-radius: 18px; color: #EAF0FA;
  background: radial-gradient(90% 90% at 0% 0%, rgba(127,178,255,.14), rgba(127,178,255,0) 60%), #070C18; box-shadow: 0 0 0 1px rgba(214,226,255,.12), 0 30px 60px -36px rgba(5,8,15,.7); }
.rq-mini { display: block; width: 100%; height: auto; overflow: visible; }
.rq-mini .rq-arc, .rs-row svg .rq-arc { opacity: .3; transition: opacity .5s var(--ease); }
.rq-mini .rq-arc.is-on { opacity: 1; }
.rq-mneedle { transform-origin: 100px 100px; transform: rotate(-90deg); transition: transform 1.1s cubic-bezier(.3,1.35,.4,1); }
.rq-mneedle path, .rs-needle path { stroke: #F2F5FB; stroke-width: 4; stroke-linecap: round; }
.rq-mneedle circle, .rs-needle circle { fill: #F2F5FB; }
.rq-live:not(.is-on) .rq-mneedle { opacity: .35; }
.rq-live-t span { display: block; font: 500 11px/1.2 "JetBrains Mono", "JBM Fallback", monospace; letter-spacing: .12em; text-transform: uppercase; color: rgba(226,233,246,.55); }
.rq-live-t b { display: block; margin-top: 4px; font-size: 18px; line-height: 1.15; letter-spacing: -0.01em; }
.rq-live:not(.is-on) .rq-live-t b { font-size: 15px; color: rgba(234,240,250,.75); font-weight: 600; }
.rq-live-t small { display: block; margin-top: 3px; font-size: 12px; color: rgba(226,233,246,.6); }
.rq-live.is-stop { box-shadow: 0 0 0 1px rgba(229,72,77,.6), 0 30px 60px -36px rgba(5,8,15,.7); }
.rq-live.is-stop .rq-live-t b { color: #FF8C8F; }

.rq-screen { position: relative; width: 100%; aspect-ratio: 16 / 10.4; max-height: calc(100svh - var(--hdr) - 12vh); min-height: 520px; border-radius: 30px; padding: 1px; perspective: 1600px; perspective-origin: 50% 0%;
  background: conic-gradient(from 210deg at 50% 50%, rgba(127,178,255,.55), rgba(61,220,151,.35), rgba(255,255,255,.12), rgba(127,178,255,.55));
  box-shadow: 0 60px 140px -50px rgba(5,8,15,.75), 0 0 0 1px rgba(5,8,15,.4); }
.rq-glass { position: absolute; inset: 1px; border-radius: 29px; overflow: hidden; perspective: 1600px; perspective-origin: 50% 0%;
  background: radial-gradient(80% 60% at 20% 0%, rgba(127,178,255,.16), rgba(127,178,255,0) 60%), radial-gradient(60% 50% at 100% 100%, rgba(61,220,151,.10), rgba(61,220,151,0) 60%), #060A14; }
.rq-glass::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(214,226,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(214,226,255,.045) 1px, transparent 1px); background-size: 44px 44px; mask-image: radial-gradient(90% 80% at 50% 40%, #000, transparent); -webkit-mask-image: radial-gradient(90% 80% at 50% 40%, #000, transparent); }
.rq-ghost, .rq-card { position: absolute; inset: 7% 2.6% 2.6%; border-radius: 22px; transform-origin: 50% 0%; }
.rq-ghost { background: #070C18; box-shadow: 0 0 0 1px rgba(214,226,255,.08); }
.rq-ghost.g1 { transform: translate3d(0, -4.2%, -60px) scale(.95); filter: brightness(.7); }
.rq-ghost.g2 { transform: translate3d(0, -8.4%, -120px) scale(.9); filter: brightness(.45); }
.rq-card { z-index: 2; display: flex; flex-direction: column; padding: clamp(18px, 3%, 38px); color: #EAF0FA; overflow-y: auto; scrollbar-width: thin;
  background: radial-gradient(90% 70% at 15% 0%, rgba(127,178,255,.12), rgba(127,178,255,0) 60%), #070C18; box-shadow: 0 0 0 1px rgba(214,226,255,.12), 0 -10px 40px rgba(0,0,0,.45);
  transition: transform .65s var(--ease), opacity .55s var(--ease), filter .55s var(--ease); }
.rq-card.is-out { transform: translate3d(0, -16%, 90px) rotateX(16deg); opacity: 0; filter: blur(10px); pointer-events: none; }
.rq-card.is-depth { transform: translate3d(0, -4.2%, -60px) scale(.95); filter: brightness(.7); opacity: 1; pointer-events: none; }
.rq-card .pl-top { gap: 12px; }
.rq-q { margin: 18px 0 0; font-size: clamp(21px, 2vw, 32px); font-weight: 650; letter-spacing: -0.03em; line-height: 1.14; max-width: 21.57em; }
.rq-q-intro { font-size: clamp(30px, 3.2vw, 52px); line-height: 1.02; }
.rq-hint { margin: 8px 0 0; font-size: 14px; color: rgba(226,233,246,.6); }
.rq-opts { display: grid; gap: 8px; margin-top: auto; padding-top: 22px; }
.rq-two { grid-template-columns: 1fr 1fr; }
.rq-many { grid-template-columns: repeat(3, 1fr); }
.rq-opt { position: relative; display: grid; grid-template-columns: 30px 1fr; align-items: center; gap: 12px; min-height: 52px; padding: 10px 16px 10px 12px; text-align: left; font-size: 15.5px; font-weight: 500; line-height: 1.3;
  color: #EAF0FA; background: rgba(214,226,255,.045); border: 1px solid rgba(214,226,255,.12); border-radius: 14px; cursor: pointer; transition: background .25s, border-color .25s, transform .3s var(--ease); }
.rq-opt:hover { background: rgba(214,226,255,.08); border-color: rgba(214,226,255,.24); }
.rq-opt:focus-visible, .rq-go:focus-visible, .rq-back:focus-visible, .rq-ghostbtn:focus-visible { outline: 2px solid #3DDC97; outline-offset: 2px; }
.rq-opt i { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; font: 500 12px/1 "JetBrains Mono", "JBM Fallback", monospace; font-style: normal; color: rgba(226,233,246,.6); border: 1px solid rgba(214,226,255,.16); transition: all .25s; }
.rq-opt[aria-checked="true"] { background: rgba(61,220,151,.10); border-color: rgba(61,220,151,.6); box-shadow: 0 0 0 1px rgba(61,220,151,.25), 0 10px 30px -12px rgba(61,220,151,.45); }
.rq-opt[aria-checked="true"] i { background: #3DDC97; border-color: #3DDC97; color: #05080F; }
.rq-chk[aria-checked="true"] i, .rq-ack[aria-checked="true"] i { font-size: 0; }
.rq-chk[aria-checked="true"] i::before, .rq-ack[aria-checked="true"] i::before { content: ""; width: 10px; height: 6px; border-left: 2px solid #05080F; border-bottom: 2px solid #05080F; transform: translateY(-2px) rotate(-45deg); }
.rq-opt.is-pick { transform: scale(.985); }
.rq-ack { align-items: start; font-size: 14.5px; font-weight: 400; color: rgba(234,240,250,.86); padding-top: 14px; padding-bottom: 14px; }
.rq-foot { display: flex; align-items: center; gap: 12px; margin-top: 18px; }
.rq-tip { margin-left: auto; font: 500 11px/1 "JetBrains Mono", "JBM Fallback", monospace; letter-spacing: .08em; text-transform: uppercase; color: rgba(226,233,246,.45); }
.rq-back, .rq-ghostbtn { min-height: 44px; padding: 0 18px; border-radius: 999px; border: 1px solid rgba(214,226,255,.16); background: rgba(214,226,255,.04); color: rgba(234,240,250,.85); font-weight: 600; font-size: 14.5px; cursor: pointer; }
.rq-go { min-height: 44px; padding: 0 22px; border-radius: 999px; border: 0; background: #F2F5FB; color: #05080F; font-weight: 650; font-size: 15px; cursor: pointer; transition: opacity .25s, transform .3s var(--ease); }
.rq-go:hover { background: #fff; }
.rq-go:disabled { opacity: .3; cursor: not-allowed; }
.rq-foot-intro { margin-top: auto; padding-top: 22px; }
.rq-foot-intro .rq-go { min-height: 54px; padding: 0 30px; font-size: 16px; }
.rq-intro { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 22px; }
.rq-intro div { padding: 14px 16px; border-radius: 14px; background: rgba(214,226,255,.04); border: 1px solid rgba(214,226,255,.10); font-size: 13.5px; line-height: 1.5; color: rgba(226,233,246,.7); }
.rq-intro b { display: block; margin-bottom: 6px; font-size: 14px; color: #EAF0FA; }
.rq-warn { display: grid; gap: 8px; margin-top: 14px; }
.rq-w { padding: 12px 16px; border-radius: 14px; font-size: 13.5px; line-height: 1.5; color: var(--page-muted); background: var(--page-glass); border: 1px solid rgba(244,174,85,.5); }
.rq-w strong { display: block; margin-bottom: 2px; color: var(--page-text); }
.rq-w.stop { border-color: rgba(229,72,77,.55); }
.rq-nojs { padding: 0 var(--pad) 40px; }

/* ---------- the report ---------- */
.rq-rep { background: var(--page); color: var(--page-text); }
.rq-rep .kicker { color: var(--page-muted); }
.rq-rep .kicker .num { color: var(--page-text); border-color: var(--page-line); }

/* state 1: a ghosted sample report behind the start card */
.rq-empty[hidden], .rq-rep-in[hidden] { display: none !important; }
.rq-empty { position: relative; display: grid; place-items: center; min-height: 92svh; padding: calc(var(--hdr) + 4vh) var(--pad) 6vh; overflow: hidden; overflow: clip; }
.rq-sample { position: absolute; inset: calc(var(--hdr) + 2vh) var(--pad) 3vh; display: grid; place-items: center; pointer-events: none; }
.rs-card { width: min(980px, 100%); padding: clamp(18px, 3vw, 40px); border-radius: 28px; color: #EAF0FA; filter: blur(5px) saturate(.9); opacity: .62; transform: scale(.98);
  background: radial-gradient(80% 70% at 15% 0%, rgba(127,178,255,.16), rgba(127,178,255,0) 60%), #060A14; box-shadow: 0 0 0 1px rgba(214,226,255,.12), 0 60px 120px -60px rgba(5,8,15,.8); }
.rs-top { display: flex; justify-content: space-between; font: 500 12px/1 "JetBrains Mono", "JBM Fallback", monospace; letter-spacing: .14em; text-transform: uppercase; color: rgba(226,233,246,.5); }
.rs-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: center; margin-top: 20px; }
.rs-row > svg { width: 100%; height: auto; overflow: visible; }
.rs-row svg .rq-arc[data-k="2"] { opacity: 1; }
.rs-needle { transform-origin: 100px 100px; transform: rotate(-15deg); }
.rs-tier small { display: block; font: 500 12px "JetBrains Mono", "JBM Fallback", monospace; letter-spacing: .12em; text-transform: uppercase; color: rgba(226,233,246,.5); }
.rs-tier b { display: block; margin: 6px 0; font-size: clamp(36px, 4.6vw, 64px); line-height: 1; letter-spacing: -0.04em; }
.rs-tier span { font: 500 13px "JetBrains Mono", "JBM Fallback", monospace; color: rgba(226,233,246,.6); }
.rs-scores { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 22px; }
.rs-scores div { padding: 14px; border-radius: 16px; text-align: center; background: rgba(214,226,255,.05); border: 1px solid rgba(214,226,255,.1); }
.rs-scores div.f { border-color: rgba(61,220,151,.5); }
.rs-scores b { display: block; font: 600 32px/1 "JetBrains Mono", "JBM Fallback", monospace; }
.rs-scores span { font-size: 13px; color: rgba(226,233,246,.6); }
.rs-list { display: grid; gap: 8px; margin-top: 18px; }
.rs-list i { display: block; height: 52px; border-radius: 14px; background: linear-gradient(90deg, rgba(214,226,255,.09), rgba(214,226,255,.03)); }
.rq-start { position: relative; z-index: 1; width: min(560px, 100%); padding: clamp(24px, 3vw, 40px); border-radius: 28px; text-align: left;
  background: var(--page-glass); backdrop-filter: blur(22px) saturate(140%); -webkit-backdrop-filter: blur(22px) saturate(140%); box-shadow: 0 0 0 1px var(--page-line), 0 50px 100px -40px rgba(5,8,15,.45); }
html[data-theme="light"] .rq-start { background: rgba(255,255,255,.93); }
html[data-theme="light"] .rs-card { opacity: .38; filter: blur(6px) saturate(.8); }
.rq-start-h { margin: 0; font-size: clamp(30px, 3.2vw, 46px); font-weight: 700; letter-spacing: -0.035em; line-height: 1.04; }
.rq-gets { list-style: none; margin: 20px 0 0; padding: 0; display: grid; gap: 8px; }
.rq-gets li { display: grid; grid-template-columns: 112px 1fr; gap: 10px; padding: 10px 0; border-top: 1px solid var(--page-line); font-size: 14.5px; color: var(--page-muted); }
.rq-gets b { color: var(--page-text); font-weight: 650; }
.rq-meta { display: flex; flex-wrap: wrap; gap: 6px; margin: 18px 0 20px; }
.rq-meta span { padding: 7px 11px; border-radius: 999px; font: 500 12px/1 "JetBrains Mono", "JBM Fallback", monospace; letter-spacing: .02em; border: 1px solid var(--page-line); color: var(--page-muted); }
.rq-fine { margin: 14px 0 0; font-size: 12.5px; color: var(--page-faint); }

/* state 2 and 3: the reading */
.rq-rep-in { max-width: 1400px; margin: 0 auto; padding: calc(var(--hdr) + 6vh) var(--pad) clamp(60px, 10vh, 110px); }
.rq-rep-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.rq-rep-sub { margin: 14px 0 0; font: 500 14px/1.3 "JetBrains Mono", "JBM Fallback", monospace; letter-spacing: .04em; color: var(--page-muted); }
.rq-id { padding: 9px 14px; border-radius: 99px; font: 500 12px/1 "JetBrains Mono", "JBM Fallback", monospace; border: 1px solid var(--page-line); color: var(--page-muted); background: var(--page-glass); }
.rq-rep:not(.is-final) .rq-id { border-style: dashed; }

/* the flip card */
.rq-flip { position: relative; margin-top: 30px; perspective: 2200px; }
.rq-face { border-radius: 28px; color: #EAF0FA; backface-visibility: hidden; -webkit-backface-visibility: hidden; transform-style: preserve-3d;
  background: radial-gradient(80% 70% at 15% 0%, rgba(127,178,255,.16), rgba(127,178,255,0) 60%), radial-gradient(60% 60% at 100% 100%, rgba(61,220,151,.10), rgba(61,220,151,0) 60%), #060A14;
  box-shadow: 0 0 0 1px rgba(214,226,255,.12), 0 60px 120px -60px rgba(5,8,15,.8);
  transition: transform .8s cubic-bezier(.3,.7,.2,1), opacity .4s; }
.rq-front { position: relative; transform: rotateY(0); }
.rq-rev { position: absolute; inset: 0 0 auto 0; min-height: 100%; transform: rotateY(-180deg); padding: clamp(20px, 3vw, 40px); }
.rq-flip.is-flipped .rq-front { position: absolute; inset: 0 0 auto 0; transform: rotateY(180deg); }
.rq-flip.is-flipped .rq-rev { position: relative; transform: rotateY(0); }
.rq-face:not(.is-act) { pointer-events: none; }
.rq-dash { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(20px, 3vw, 44px); align-items: center; padding: clamp(20px, 3vw, 44px); }
.rq-meter > svg { display: block; width: 100%; max-width: 520px; margin: 0 auto; overflow: visible; }
.rq-arc { opacity: .32; transition: opacity .6s var(--ease); }
.rq-arc.is-on { opacity: 1; filter: drop-shadow(0 0 10px currentColor); }
.rq-needle { transform-origin: 200px 200px; transform: rotate(-90deg); transition: transform 1.4s cubic-bezier(.3,1.4,.4,1) .2s, opacity .4s; }
.rq-needle path { stroke: #F2F5FB; stroke-width: 4; stroke-linecap: round; }
.rq-needle circle { fill: #F2F5FB; }
.rq-meter-cap { fill: rgba(226,233,246,.6); font: 500 12px "JetBrains Mono", "JBM Fallback", monospace; letter-spacing: .12em; }
.rq-gauges { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.rq-g { position: relative; display: grid; justify-items: center; text-align: center; padding: 14px 8px; border-radius: 18px; background: rgba(214,226,255,.04); border: 1px solid rgba(214,226,255,.10); }
.rq-g .rq-gw > svg { display: block; width: 100%; transform: rotate(-90deg); }
.rq-g circle { fill: none; stroke: rgba(214,226,255,.10); stroke-width: 6; }
.rq-g circle.on { stroke: #7FB2FF; stroke-linecap: round; stroke-dasharray: 213.6; stroke-dashoffset: 213.6; transition: stroke-dashoffset 1.1s cubic-bezier(.2,.7,.1,1); }
.rq-g.fin circle.on { stroke: #3DDC97; }
.rq-g.fin { border-color: rgba(61,220,151,.4); background: rgba(61,220,151,.06); }
.rq-g.is-est { opacity: .45; }
.rq-gw { position: relative; width: 100%; max-width: 104px; }
.rq-g b { position: absolute; inset: 0; display: grid; place-items: center; font: 600 clamp(22px, 2.2vw, 30px)/1 "JetBrains Mono", "JBM Fallback", monospace; letter-spacing: -0.03em; }
.rq-g span { margin-top: 8px; font-weight: 650; font-size: 15px; }
.rq-g small { font-size: 12px; color: rgba(226,233,246,.6); }
.rq-expl { margin: 18px 0 0; font-size: 15.5px; line-height: 1.6; color: rgba(226,233,246,.78); }
.rq-flipbtn { display: inline-flex; align-items: center; gap: 12px; min-height: 52px; margin-top: 20px; padding: 0 8px 0 22px; border-radius: 999px; border: 0; background: #F2F5FB; color: #05080F; font-weight: 650; font-size: 15.5px; cursor: pointer; transition: transform .3s var(--ease), opacity .3s; }
.rq-flipbtn b { display: grid; place-items: center; min-width: 38px; height: 38px; padding: 0 8px; border-radius: 999px; font: 600 15px/1 "JetBrains Mono", "JBM Fallback", monospace; background: #3DDC97; color: #05080F; }
.rq-flipbtn i { font-style: normal; padding-right: 8px; }
.rq-flipbtn:hover { transform: translateY(-1px); }
.rq-flipbtn:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.rq-flipbtn:focus-visible { outline: 2px solid #3DDC97; outline-offset: 3px; }
.rq-flipbtn.ghost { margin: 0; padding: 0 18px; min-height: 44px; background: rgba(214,226,255,.06); color: #EAF0FA; border: 1px solid rgba(214,226,255,.18); font-size: 14.5px; }
.rq-flipbtn.ghost i { padding: 0; }
.rq-back-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
.rq-back-k { margin: 0; font-size: clamp(22px, 2.2vw, 32px); font-weight: 700; letter-spacing: -0.03em; }
.rq-back-n { margin: 6px 0 0; font-size: 14px; color: rgba(226,233,246,.65); }
.rq-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.rq-strat { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; align-items: center; gap: 6px 14px; padding: 14px 16px; border-radius: 16px; background: rgba(214,226,255,.04); border: 1px solid rgba(214,226,255,.12); color: #EAF0FA; transition: transform .4s var(--ease), border-color .3s, background .3s; }
a.rq-strat:hover, a.rq-strat:focus-visible { transform: translateY(-2px); border-color: rgba(61,220,151,.6); background: rgba(61,220,151,.06); outline: none; }
.rq-strat b { font-size: 15.5px; }
.rq-strat span { display: block; margin-top: 3px; font: 500 12px/1.4 "JetBrains Mono", "JBM Fallback", monospace; color: rgba(226,233,246,.6); }
.rq-cagr { text-align: right; }
.rq-cagr b { font: 600 16px/1 "JetBrains Mono", "JBM Fallback", monospace; color: #3DDC97; }
.rq-cagr span { font-size: 12px; }
.rq-strat > i { grid-column: 1 / -1; font: 600 13px/1 Inter, "Inter Fallback", sans-serif; font-style: normal; color: #3DDC97; }
.rq-strat > i span { display: inline; margin: 0 0 0 4px; font: inherit; color: inherit; transition: margin .3s var(--ease); }
a.rq-strat:hover > i span { margin-left: 8px; }
.rq-model { margin: 14px 0 0; font: 500 12px/1.5 "JetBrains Mono", "JBM Fallback", monospace; color: rgba(226,233,246,.55); }

.rq-cols { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 70px); margin-top: 40px; }
.rq-col h3 { margin: 0 0 10px; font-size: 20px; letter-spacing: -0.02em; }
.rq-h3b { margin-top: 26px !important; }
.rq-note { margin: 0 0 14px; font-size: 14px; color: var(--page-muted); }
.rq-offs { display: flex; flex-wrap: wrap; gap: 6px; }
.rq-offs span { padding: 8px 12px; border-radius: 999px; font-size: 13.5px; color: var(--page-muted); border: 1px dashed var(--page-line); }
.rq-allin { margin: 0; padding: 14px 16px; border-radius: 16px; font-size: 14px; color: var(--page-muted); border: 1px solid rgba(61,220,151,.5); background: var(--page-glass); }
.rq-col .rq-w { margin-top: 8px; }
.rq-disc ul { margin: 0; padding-left: 18px; font-size: 13.5px; line-height: 1.7; color: var(--page-muted); }
.rq-acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.rq-btn { border-color: var(--page-line); background: var(--page-glass); color: var(--page-text); }
.rq-btn:disabled { opacity: .4; cursor: not-allowed; }
.rq-btn-solid { background: var(--page-text); color: var(--page); }
.rq-btn-solid:hover { opacity: .9; }

/* ---------- scoring panel extras ---------- */
.rp-bars { gap: 10px; }
.rp-ladder { display: grid; gap: 8px; align-content: center; }
.rp-rung { display: grid; grid-template-columns: 90px minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.4fr); gap: 14px; align-items: center; padding: 12px 16px; border-radius: 14px; font-size: 14px;
  background: rgba(214,226,255,.04); border: 1px solid rgba(214,226,255,.10); border-left: 4px solid var(--c); opacity: 0; transform: translateX(-14px); transition: opacity .5s, transform .7s var(--ease); transition-delay: calc(var(--k) * 90ms); }
.rp-rung:nth-child(1) { --c: #3DDC97; } .rp-rung:nth-child(2) { --c: #9BDB7A; } .rp-rung:nth-child(3) { --c: #E9D35B; } .rp-rung:nth-child(4) { --c: #F4AE55; } .rp-rung:nth-child(5) { --c: #F27A5C; }
.pl.is-on .rp-rung { opacity: 1; transform: none; }
.rp-rung b { font: 600 13px "JetBrains Mono", "JBM Fallback", monospace; }
.rp-rung span { font-weight: 650; }
.rp-rung em { font: 500 12px "JetBrains Mono", "JBM Fallback", monospace; font-style: normal; color: rgba(226,233,246,.65); text-transform: uppercase; letter-spacing: .06em; }
.rp-rung i { font-style: normal; color: rgba(226,233,246,.72); font-size: 13px; }

/* ---------- red flags: a tile wall ---------- */
.rp-fl { padding: clamp(70px, 12vh, 130px) var(--pad); background: var(--page); color: var(--page-text); }
.rp-fl-in { max-width: 1400px; margin: 0 auto; }
.rp-fl-head .kicker { color: var(--page-muted); }
.rp-fl-head .kicker .num { color: var(--page-text); border-color: var(--page-line); }
.rp-fl-h { margin: 0; font-size: clamp(30px, 3.6vw, 56px); font-weight: 700; letter-spacing: -0.035em; line-height: 1.02; }
.rp-flags { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: clamp(26px, 5vh, 48px); }
.rp-flag { position: relative; display: grid; gap: 6px; align-content: start; padding: 20px 20px 22px; border-radius: 20px; background: var(--page-2); border: 1px solid var(--page-line); overflow: hidden; }
.rp-flag::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: #F4AE55; }
.rp-flag.stop::before { background: #E5484D; }
.rp-flag em { font: 600 12px/1 "JetBrains Mono", "JBM Fallback", monospace; font-style: normal; letter-spacing: .1em; text-transform: uppercase; color: #9A5B0E; } /* Q3: was #B9741A, 3.8:1 on white */
html[data-theme="dark"] .rp-flag em { color: #F4AE55; }
.rp-flag.stop em { color: #C8343A; }
html[data-theme="dark"] .rp-flag.stop em { color: #FF8C8F; }
.rp-flag b { font-size: 18px; letter-spacing: -0.01em; }
.rp-flag span { font-size: 14.5px; line-height: 1.5; color: var(--page-muted); }

/* ---------- closing band: the marketplace filters playing behind ---------- */
.rp-close { min-height: 86vh; }
.rp-close > video { filter: brightness(.38) saturate(.9); }
.rp-status { max-width: 44.16em; margin: 34px auto 0; font-size: 13.5px; line-height: 1.6; color: rgba(226,233,246,.7); }
.rp-next { max-width: 36em; margin: 30px auto 0; font-size: 16px; line-height: 1.6; color: rgba(242,245,251,.9); }
.rp-next a { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }

@media (max-width: 1100px) { .rq-intro { grid-template-columns: 1fr; } .rq-many { grid-template-columns: 1fr 1fr; } .rq-list { grid-template-columns: 1fr; } }
@media (max-width: 860px) {
  .rq-in { grid-template-columns: 1fr; align-content: start; gap: 12px; padding-top: calc(var(--hdr) + 12px); padding-bottom: calc(24px + env(safe-area-inset-bottom)); }
  .rq-secs, .rq-side .kicker, .rq-sub { display: none; }
  .rq-h { font-size: 24px; }
  .rq-live { grid-template-columns: 92px 1fr; gap: 12px; margin-top: 10px; padding: 8px 12px; border-radius: 16px; }
  .rq-live-t b { font-size: 16px; margin-top: 2px; }
  .rq-live:not(.is-on) .rq-live-t b { font-size: 14px; }
  .rq-prog { margin-top: 10px; }
  .rq-screen { aspect-ratio: auto; height: calc(100svh - var(--hdr) - 196px); min-height: 480px; max-height: none; border-radius: 24px; }
  .rq-glass { border-radius: 23px; }
  .rq-card, .rq-ghost { inset: 5% 3% 3%; border-radius: 18px; }
  .rq-card { padding: 18px 16px; }
  .rq-q { font-size: 20px; margin-top: 12px; }
  .rq-q-intro { font-size: 30px; }
  .rq-two, .rq-many { grid-template-columns: 1fr; }
  .rq-many { grid-template-columns: 1fr 1fr; }
  .rq-many .rq-opt { font-size: 13.5px; grid-template-columns: 1fr; padding: 10px 12px; min-height: 46px; }
  .rq-many .rq-opt i { display: none; }
  .rq-opt { min-height: 48px; font-size: 15px; }
  .rq-tip { display: none; }
  .rq-foot .rq-go { margin-left: auto; }
  .rq-intro { gap: 8px; margin-top: 16px; }
  .rq-intro div { padding: 10px 12px; font-size: 13px; }
  .rq-intro div:nth-child(2) { display: none; }

  .rq-empty { min-height: 0; padding: calc(var(--hdr) + 24px) 16px 40px; }
  .rq-sample { inset: calc(var(--hdr) + 8px) 0 0; place-items: start center; }
  .rs-card { width: 100%; border-radius: 22px; }
  .rs-row { grid-template-columns: 1fr; gap: 6px; }
  .rq-start { padding: 22px 20px; border-radius: 22px; }
  .rq-gets li { grid-template-columns: 1fr; gap: 2px; padding: 8px 0; font-size: 14px; }
  .rq-start .btn-lg { width: 100%; }

  .rq-rep-in { padding-top: calc(var(--hdr) + 28px); padding-left: 14px; padding-right: 14px; }
  .rq-rep-head { padding: 0 4px; gap: 12px; }
  .rq-rep-head .h-l { font-size: 40px; }
  .rq-flip { margin-top: 20px; }
  .rq-face { border-radius: 22px; }
  .rq-dash { grid-template-columns: 1fr; padding: 18px 16px 20px; gap: 6px; }
  .rq-meter > svg { max-width: 300px; }
  .rq-gauges { gap: 8px; }
  .rq-g { padding: 10px 4px; }
  .rq-gw { max-width: 76px; }
  .rq-g b { font-size: 21px; }
  .rq-g span { font-size: 13.5px; }
  .rq-expl { font-size: 14.5px; }
  .rq-flipbtn { width: 100%; justify-content: space-between; font-size: 15px; }
  .rq-rev { padding: 18px 14px; }
  .rq-back-top .rq-flipbtn.ghost { width: auto; }
  .rq-cols { grid-template-columns: 1fr; margin-top: 30px; padding: 0 4px; }
  .rq-strat { grid-template-columns: 1fr; gap: 6px; }
  .rq-cagr { display: flex; align-items: baseline; gap: 8px; text-align: left; }
  .rq-cagr span { margin: 0; }
  .rq-acts { padding: 0 4px; }

  .rp-rung { grid-template-columns: 70px 1fr; gap: 4px 10px; padding: 10px 12px; }
  .rp-rung em, .rp-rung i { grid-column: 2; }
  .rp-rung i { display: none; }
  .rp-fl { padding-top: 60px; padding-bottom: 60px; }
  .rp-flags { grid-template-columns: 1fr 1fr; gap: 8px; }
  .rp-flag { padding: 14px 14px 16px 16px; border-radius: 16px; }
  .rp-flag b { font-size: 15px; }
  .rp-flag span { font-size: 13px; }
  .rp-close { min-height: 0; }
  .rp-status { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .rq-card, .rq-face, .rq-mneedle, .rq-needle { transition: none; }
  .rp-rung { opacity: 1; transform: none; }
}

/* ---------- print: the report only, plain ---------- */
@media print {
  .hdr, .menu-sheet, .peel, .rq, .pnl, .ftr, .rp-fl, .pg-close, .rq-acts, .rail, .peel-progress, .cta-dock, .rq-empty, .rq-flipbtn { display: none !important; }
  html, body, .rq-rep { background: #fff !important; color: #0B1220 !important; }
  .lay { position: static !important; transform: none !important; filter: none !important; box-shadow: none !important; }
  .rq-rep-in { padding: 0; }
  .rq-face { -webkit-print-color-adjust: exact; print-color-adjust: exact; transform: none !important; position: relative !important; margin-bottom: 16px; }
  .rq-dash { break-inside: avoid; }
}

/* the card footer stays in reach when a card scrolls (long lists, phones) */
.rq-foot { position: sticky; bottom: calc(clamp(18px, 3%, 38px) * -1); z-index: 2; margin-left: calc(clamp(18px, 3%, 38px) * -1); margin-right: calc(clamp(18px, 3%, 38px) * -1); margin-bottom: calc(clamp(18px, 3%, 38px) * -1); padding: 14px clamp(18px, 3%, 38px) clamp(18px, 3%, 38px); background: linear-gradient(to bottom, rgba(7,12,24,0), #070C18 26%); }
@media (max-width: 860px) {
  .rq-foot { bottom: -18px; margin: 10px -16px -18px; padding: 14px 16px 16px; }
  .rq-card .pl-top span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
  .rq-card .pl-top span:last-child { flex: none; }
}

/* no text under 12px on phones, inside the quiz cards and the scoring screen too */
@media (max-width: 860px) {
  .rq-card .pl-top, #scoring .pl-top { font-size: 12px; letter-spacing: .1em; }
  #scoring .pl-note { font-size: 12px; }
  .rq-live-t span { font-size: 12px; }
}
@media (max-width: 860px) {
  #scoring .rp-bars { gap: 7px; align-content: start; }
  #scoring .ig-bar { gap: 4px 10px; font-size: 13px; }
  #scoring .ig-bar .trk { height: 8px; }
  #scoring .ig-bar .val { font-size: 13px; }
  #scoring .rp-ladder { align-content: start; gap: 5px; margin-top: 12px; }
  #scoring .rp-rung { padding: 7px 10px; font-size: 13px; }
  /* P1: the clip behind the closing words is a screen full of figures; soften it so it never reads as text under text */
  .rp-close > video { filter: brightness(.22) saturate(.8) blur(2px); }
}
@media (max-width: 860px) { #scoring .pl:nth-child(-n+2) .pl-note { display: none; } #scoring .pl-top span:last-child { display: none; } }

/* Final score layer: HTML bars (were SVG text that rendered at 4 to 6 px on a phone) */
.rp-final { gap: clamp(18px, 3vh, 30px); }
.rp-final .ig-bar { font-size: 15px; }
.rp-final .ig-bar .trk { height: 18px; }
.rp-final .ig-bar .val { font-size: 18px; min-width: 3ch; }
.rp-final .ig-bar.us .lbl, .rp-final .ig-bar.us .val { color: #3DDC97; font-weight: 600; }

/* P1: the hero sky is pale grey, so the shade behind the copy reaches higher than on the darker plates */
#rp-hero .scrim-bottom { background: linear-gradient(to top, rgba(5,8,15,.94) 0%, rgba(5,8,15,.7) 40%, rgba(5,8,15,.48) 72%, rgba(5,8,15,.5) 100%); }