/* ============================================================
   Before You Pop — CHECK A MATCH FLOW styles (checkflow.css)
   Full Part 1 experience: choose them → birthdays → how long →
   adaptive test → guess → unlock → contact → reveal → decision →
   high-rank contact → save → PDF → history. Admin Edit Mode.
   ============================================================ */

.checkflow{width:100%;max-width:680px;box-sizing:border-box;margin:0 auto;padding:22px 18px 90px;min-height:100vh;position:relative;overflow-x:clip;touch-action:pan-y;overscroll-behavior-y:auto;-webkit-overflow-scrolling:touch}
.checkflow .flow-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.checkflow .flow-head .backhat{background:none;color:var(--gpx);font-weight:700;font-size:13px}
.checkflow .flow-head .crumb{color:var(--dim2);font-size:11px;letter-spacing:.14em;text-transform:uppercase;flex:1;text-align:center}
.checkflow .flow-head-right{display:flex;align-items:center;gap:8px}
.checkflow .flow-help{width:26px;height:26px;border-radius:50%;background:var(--pink);color:#000;font-weight:900;display:grid;place-items:center;font-size:14px;animation:softPulse 1.6s infinite}
.checkflow .me-chip{transition:transform .12s,border-color .12s,box-shadow .12s}
.checkflow .me-chip:active,.checkflow .me-chip:hover{transform:scale(1.04);border-color:var(--gpx);box-shadow:0 0 14px rgba(0,229,255,.30)}

/* Result Completion page — action buttons: true-black default, own color on
   hover/pressed (desktop). Contrast kept high. Mobile uses :active feedback. */
.checkflow .cbtn-col{display:grid;gap:10px;margin-top:16px}

/* ---------- Branded BYP result reveal card (on-screen + share image) ---------- */
.checkflow .bc-reveal-stage{width:100%;max-width:440px;margin:4px auto;position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:24px;box-shadow:0 20px 60px rgba(0,0,0,.55)}
.checkflow .bc-reveal-stage .bc-card{position:absolute;top:0;left:0;transform-origin:top left;will-change:transform}
.checkflow .bc-card{position:relative;overflow:hidden;width:1080px;height:1350px;background:linear-gradient(165deg,rgba(255,255,255,.05),rgba(255,255,255,0));display:flex}
.checkflow .bc-inner{position:relative;z-index:3;box-sizing:border-box;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;text-align:center;padding:64px 54px 44px}
.checkflow .bc-header{width:100%;display:flex;justify-content:center;margin-bottom:10px}
.checkflow .bc-logo-img{max-height:210px;max-width:640px;width:auto;height:auto;object-fit:contain}
.checkflow .bc-mark{font-family:'Archivo';font-size:80px;font-weight:900;line-height:1;color:#fff}
.checkflow .bc-brand-sub{font-size:18px;letter-spacing:.4em;color:rgba(255,255,255,.6)}
.checkflow .bc-info{text-align:center}
.checkflow .bc-marker{font-size:13px;letter-spacing:.4em;color:#ff2ec4;text-transform:uppercase;text-shadow:0 0 12px rgba(255,46,196,.6)}
.checkflow .bc-date{font-size:17px;letter-spacing:.22em;color:rgba(255,255,255,.55);margin-top:4px}
.checkflow .bc-title{font-size:38px;font-weight:800;color:#fff;letter-spacing:.01em}
.checkflow .bc-label{font-size:15px;letter-spacing:.5em;color:rgba(255,255,255,.5);margin-top:30px}
.checkflow .bc-score{font-family:'Consolas',monospace;font-size:92px;font-weight:900;line-height:1.05;color:#ff2ec4;text-shadow:0 0 40px rgba(255,46,196,.95),0 0 14px rgba(255,46,196,.7);letter-spacing:.03em;margin:10px 0 4px;animation:bcPulse 2.4s ease-in-out infinite}
@keyframes bcPulse{0%,100%{text-shadow:0 0 24px rgba(255,46,196,.5),0 0 10px rgba(255,46,196,.4)}50%{text-shadow:0 0 46px rgba(255,46,196,.98),0 0 18px rgba(255,46,196,.8)}}
.checkflow .bc-result{font-family:'Archivo';font-size:42px;font-weight:900;color:#fff;margin-bottom:36px}
.checkflow .bc-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;width:100%}
.checkflow .bc-cell{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);border-radius:26px;padding:24px 12px;text-align:center}
.checkflow .bc-cell-e{font-size:44px;margin-bottom:6px}
.checkflow .bc-cell-n{font-size:12px;letter-spacing:.2em;color:rgba(255,255,255,.6);margin-bottom:8px}
.checkflow .bc-cell-v{font-size:42px;font-weight:800;color:#fff}
.checkflow .bc-cell-of{font-size:22px;color:rgba(255,255,255,.4)}
.checkflow .bc-section{width:100%;margin-top:26px;border:1px solid;border-radius:26px;padding:18px 20px;box-sizing:border-box}
.checkflow .bc-sec-label{font-size:13px;letter-spacing:.34em;color:rgba(255,255,255,.6);margin-bottom:8px}
.checkflow .bc-guess{margin-top:26px;border:1px solid rgba(255,255,255,.14);border-radius:26px;padding:16px 18px;background:rgba(255,255,255,.03)}
.checkflow .bc-guess .bc-sec-label{color:rgba(255,255,255,.55)}
.checkflow .bc-guess-rows{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;font-size:24px;font-weight:700}
.checkflow .bc-gr i{font-style:normal;color:rgba(255,255,255,.55)}
.checkflow .bc-gr b{color:#fff}
.checkflow .bc-dec-val{font-size:38px;font-weight:900;letter-spacing:.02em}
.checkflow .bc-foot{margin-top:auto;padding-top:22px;font-size:16px;letter-spacing:.14em;color:rgba(255,255,255,.5);text-align:center;width:100%}
.checkflow .bc-aura{position:absolute;border-radius:50%;filter:blur(110px);opacity:.55;pointer-events:none}
.checkflow .bc-aura-p{background:#ff2ec4;width:520px;height:520px;top:-140px;left:-120px}
.checkflow .bc-aura-b{background:#00e5ff;width:560px;height:560px;bottom:-180px;right:-140px}
.checkflow .bc-spark{position:absolute;width:8px;height:8px;border-radius:50%;background:#fff;opacity:.7;filter:blur(1px)}
.checkflow .bc-spark-1{top:210px;left:120px;box-shadow:0 0 12px #ff2ec4;background:#ff2ec4}
.checkflow .bc-spark-2{top:820px;right:90px;box-shadow:0 0 12px #00e5ff;background:#00e5ff}
.checkflow .bc-spark-3{bottom:150px;left:150px;box-shadow:0 0 12px #00e5ff;background:#00e5ff}
.checkflow .wow .bc-score{animation:bcPulse 2.4s ease-in-out infinite}
.checkflow .cbtn.action{background:#000;color:#fff;border:1px solid rgba(255,255,255,.28);border-radius:14px;padding:14px 18px;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;transition:background .15s,border-color .15s,transform .08s,color .15s;width:100%}
.checkflow .cbtn.action:not(:disabled):hover{background:linear-gradient(135deg,var(--blue),var(--softblue));color:#fff;border-color:var(--blue);transform:translateY(-1px);text-shadow:0 1px 2px rgba(0,0,0,.45)}
.checkflow .cbtn.action:not(:disabled):active{transform:scale(.99)}
.checkflow .cbtn.action.share:not(:disabled):hover{background:linear-gradient(135deg,var(--pink),var(--bridge));border-color:var(--pink)}
.checkflow .cbtn.action.image:not(:disabled):hover{background:var(--lime);color:#fff;border-color:var(--lime);text-shadow:0 1px 2px rgba(0,0,0,.45)}
.checkflow .cbtn.action.hist:not(:disabled):hover{background:linear-gradient(135deg,var(--violet),var(--pink));color:#fff;border-color:var(--violet)}
.checkflow .cbtn.action.other:not(:disabled):hover{background:linear-gradient(135deg,var(--softblue),var(--blue));color:#fff;border-color:var(--lime);text-shadow:0 1px 2px rgba(0,0,0,.45)}
.checkflow .cbtn.action:focus-visible{outline:2px solid var(--gpx);outline-offset:2px}
.checkflow h1{font-family:'Archivo';font-weight:900;font-size:clamp(22px,6vw,34px);line-height:1.05;margin:14px 0 6px}
.checkflow .sub{color:var(--dim);font-size:14px;line-height:1.45;margin-bottom:16px}
.checkflow .sub b{color:#fff}
.checkflow .flow-card{background:var(--surf-1);border:1px solid var(--line);border-radius:16px;padding:16px;margin-bottom:12px}
.checkflow .flow-card label{display:block;font-size:10px;letter-spacing:.22em;color:var(--dim2);text-transform:uppercase;margin-bottom:6px}
.checkflow input[type=text],.checkflow input[type=date],.checkflow input[type=email],.checkflow input[type=tel],.checkflow input[type=password],.checkflow input[type=number],.checkflow select{
  box-sizing:border-box;width:100%;max-width:100%;min-width:0;background:var(--surf-1);border:1px solid var(--line);border-radius:10px;color:#fff;padding:12px 12px;font-size:15px;font-family:inherit}
.checkflow input:focus,.checkflow select:focus{outline:none;border-color:var(--gpx)}
/* password SHOW/HIDE eye (pure CSS — no font emoji, renders everywhere) */
.checkflow .byp-pw-wrap{position:relative;display:block}
.checkflow .byp-pw-wrap input[type=password],.checkflow .byp-pw-wrap input[type=text]{
  width:100%;background:var(--surf-1);border:1px solid var(--line);border-radius:10px;color:#fff;padding:12px 46px 12px 12px;font-size:15px;font-family:inherit}
.checkflow .byp-pw-wrap input:focus{outline:none;border-color:var(--gpx)}
.checkflow .byp-pw-eye{
  position:absolute;top:50%;right:6px;transform:translateY(-50%);width:32px;height:32px;margin:0;padding:0;
  background:none;border:none;cursor:pointer;border-radius:8px;display:grid;place-items:center}
.checkflow .byp-pw-eye:hover{background:rgba(255,255,255,.06)}
.checkflow .byp-pw-eye:active{background:rgba(255,255,255,.12)}
.checkflow .byp-pw-eye .eye-bowl{
  width:18px;height:12px;border:2px solid var(--gpx);border-radius:50%;
  position:relative;transition:border-color .12s}
.checkflow .byp-pw-eye .eye-bowl::before{
  content:"";position:absolute;top:50%;left:50%;width:5px;height:5px;background:var(--gpx);
  border-radius:50%;transform:translate(-50%,-50%);transition:background .12s}
.checkflow .byp-pw-eye .eye-slash{
  position:absolute;left:4px;top:11px;width:24px;height:2px;background:var(--pink);transform:rotate(45deg);
  border-radius:2px;opacity:0;transition:opacity .12s}
.checkflow .byp-pw-eye.off .eye-slash{opacity:1}
.checkflow .byp-pw-eye.off .eye-bowl{border-color:#8f8fa3}
.checkflow .byp-pw-eye.off .eye-bowl::before{border-color:#8f8fa3}
.checkflow .btn-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.checkflow .cbtn{font-size:13px;font-weight:800;letter-spacing:.08em;border-radius:12px;padding:13px 18px;color:#000;text-transform:uppercase}
.checkflow .cbtn.primary{background:linear-gradient(135deg,var(--pink),var(--bridge))}
.checkflow .cbtn.primary.green{background:var(--gpx);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.45)}
.checkflow .cbtn.ghost{background:transparent;color:var(--dim);border:1px solid var(--line)}
.checkflow .cbtn:disabled{opacity:.4;cursor:not-allowed}
.checkflow .muted{color:var(--dim2);font-size:12.5px;line-height:1.4}

/* step counter */
.checkflow .step-indicator{display:flex;gap:6px;align-items:center;margin:6px 0 14px}
.checkflow .step-indicator .step-seg{height:4px;flex:1;background:rgba(255,255,255,.10);border-radius:2px}
.checkflow .step-indicator .step-seg.done{background:var(--gpx)}
.checkflow .step-indicator .step-seg.now{background:var(--gpx);box-shadow:0 0 8px var(--gpx)}

/* person chooser */
.pick-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.person-pick{border:1px solid rgba(124,233,255,.20);border-radius:16px;padding:14px;background:var(--surf-1);cursor:pointer;text-align:center;transition:transform .15s,border-color .2s}
.person-pick:hover{border-color:var(--pink);transform:translateY(-2px)}
.person-pick .avatar{font-size:34px}
.person-pick .ptitle{font-family:'Archivo';font-weight:900;font-size:15px;margin-top:6px}
@media(max-width:460px){.pick-row{grid-template-columns:1fr}}

/* slider / guess */
.likert{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:4px}
.likert button{background:#111;border:1px solid var(--line);border-radius:12px;padding:14px 0;font-size:20px;font-weight:900;color:#fff}
.likert button.sel{background:linear-gradient(135deg,var(--pink),var(--bridge));color:#fff;border-color:var(--pink);text-shadow:0 1px 2px rgba(0,0,0,.45)}
.likert button:disabled{opacity:.35}
.guess-cat{display:flex;align-items:center;gap:12px;background:var(--surf-1);border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:10px}
.guess-cat .gc-emoji{font-size:26px}
.guess-cat .gc-info{flex:1}
.guess-cat .gc-info .gc-name{font-weight:800;font-size:13px;letter-spacing:.1em}
.guess-cat .gc-info .gc-val{color:var(--dim2);font-size:11px;margin-top:2px}
.harmony-choice{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.harmony-choice button{background:#111;border:1px solid var(--line);border-radius:12px;padding:12px 0;font-weight:800;color:#fff}
.harmony-choice button.sel{background:linear-gradient(135deg,var(--violet),var(--pink));color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.45)}

/* question */
.question-test .q-big{font-family:'Archivo';font-weight:800;font-size:clamp(17px,4.4vw,22px);line-height:1.25;margin:10px 0 14px}
.answer-btns{display:flex;flex-direction:column;gap:8px}
.answer-btns button{background:#111;border:1px solid var(--line);border-radius:12px;padding:14px 14px;font-size:13.5px;font-weight:700;color:#fff;text-align:left}
.answer-btns button.sel{background:var(--gpx);color:#000;border-color:var(--gpx)}

/* reveal */
.reveal-stage{text-align:center;min-height:140px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.reveal-stage .r-emoji{font-size:56px;animation:softPulse 1.4s infinite}
.reveal-stage .r-name{font-size:11px;letter-spacing:.3em;color:var(--dim2);text-transform:uppercase}
.reveal-stage .r-val{font-family:'Archivo';font-weight:900;font-size:54px;color:var(--gpx);text-shadow:0 0 26px rgba(0,229,255,.5);animation:popIn .5s cubic-bezier(.2,.9,.3,1.4)}
.reveal-stage .r-val.harmony{color:var(--violet);text-shadow:0 0 26px rgba(168,85,255,.5)}
.reveal-stage .r-val.score{font-size:30px;color:var(--pink);text-shadow:0 0 22px rgba(255,46,196,.5);font-family:Consolas,monospace}

/* guess vs byp */
.vs-row{display:flex;gap:10px;align-items:center;background:var(--surf-1);border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:8px}
.vs-row .vs-emoji{font-size:22px}
.vs-row .vs-which{font-size:9px;letter-spacing:.18em;color:var(--dim2);text-transform:uppercase;flex:1}
.vs-row .vs-g{font-weight:900;color:var(--dim)}
.vs-row .vs-b{font-weight:900;color:var(--gpx);font-size:20px}
.vs-row .vs-arrow{color:var(--dim2)}

/* decision balloon */
.decision-scene{text-align:center;min-height:200px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.balloon-big{width:96px;height:120px;position:relative;background:radial-gradient(circle at 32% 26%, #fff3 0 0, transparent 40%), var(--col,#ff2ec4);border-radius:50% 50% 50% 50%/46% 46% 54% 54%;box-shadow:inset -8px -10px 20px rgba(0,0,0,.25), 0 6px 26px rgba(0,0,0,.4);display:inline-block}
.balloon-big::before{content:"";position:absolute;left:50%;top:100%;transform:translateX(-50%);width:2px;height:18px;background:rgba(255,255,255,.5)}
.balloon-big.tense{animation:tenseBalloon .9s ease infinite}
.balloon-big.pop{animation:none}
.balloon-big.floating{animation:floatBalloon 3s ease-in-out infinite}
@keyframes tenseBalloon{0%,100%{transform:scale(1)}50%{transform:scale(1.18,1.05)}}
@keyframes floatBalloon{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-16px) scale(1.04)}}
/* floating celebratory balloons (pure CSS, no font emoji) */
.balloon{position:fixed;bottom:-140px;z-index:800;pointer-events:none;width:42px;height:54px;border-radius:52% 52% 52% 52%/50% 50% 50% 50%;background:radial-gradient(circle at 34% 26%, #ffffff99 0 0, transparent 42%), var(--col,#ff2ec4);box-shadow:inset -4px -6px 12px rgba(0,0,0,.25);animation:balloonRise var(--dur,5s) linear forwards}
.balloon::after{content:"";position:absolute;left:50%;top:100%;width:1.5px;height:16px;background:rgba(255,255,255,.5);transform:translateX(-50%)}
@keyframes balloonRise{to{opacity:0;transform:translateY(-120vh)}}
.decision-label{font-family:'Archivo';font-weight:900;font-size:clamp(24px,7vw,40px);margin-top:10px;color:#fff}
.decision-label.go{color:var(--pink);text-shadow:0 0 30px rgba(255,46,196,.7)}
.decision-label.pop{color:var(--lime)}
@keyframes glowCycle{0%,100%{text-shadow:0 0 16px rgba(255,46,196,.4)}50%{text-shadow:0 0 34px rgba(255,46,196,.9)}}
.glow-text{animation:glowCycle 2.4s ease-in-out infinite}

/* particles for pop */
.frag{position:fixed;z-index:800;width:8px;height:8px;border-radius:2px;pointer-events:none;animation:flyFrag 1.1s ease-out forwards}
@keyframes flyFrag{to{transform:translate(var(--fx),var(--fy)) rotate(540deg);opacity:0}}
.heart-p{position:fixed;z-index:800;pointer-events:none;filter:drop-shadow(0 0 6px var(--hcol,#ff2ec4));animation:heartFly 2.6s ease-in forwards}
.heart-p svg{display:block}
@keyframes heartFly{0%{opacity:1;transform:translateY(0) scale(.6)}100%{opacity:0;transform:translateY(-120px) scale(1.4)}}

/* contact / history / admin */
.hist-row{background:var(--surf-1);border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:10px}
.hist-row .h-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.hist-row .h-name{font-weight:800}
.hist-row .h-date{color:var(--dim2);font-size:11px}
.hist-row .h-score{font-family:Consolas,monospace;color:var(--gpx);font-size:14px}
.hist-row .h-res{color:#fff;font-size:12px}
.hist-row .h-meta{color:var(--dim2);font-size:11px;margin-top:4px}
.admin-widget{position:fixed;right:14px;bottom:14px;z-index:900;display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end;max-width:calc(100vw - 28px)}
.admin-widget .aw-btn{background:#111;border:1px solid var(--gold);color:var(--gold);border-radius:999px;padding:8px 12px;font-size:11px;font-weight:800;letter-spacing:.08em;min-height:44px;display:inline-flex;align-items:center;cursor:pointer}
.admin-widget .aw-btn.on{background:var(--gold);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.45)}
.admin-widget .aw-btn:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
/* MOBILE: the admin entry point must stay reachable and tappable — it is never
   hidden, moved offscreen, or covered. It lifts clear of the bottom nav/chips
   and every control keeps a 44px touch target. */
@media (max-width:640px){
  .admin-widget{right:10px;bottom:74px;gap:6px}
  .admin-widget .aw-btn{padding:10px 14px;font-size:11px;min-height:44px}
}
/* Compact glowing text link for secondary admin/account actions (never stretches). */
.glow-link{display:inline-flex;align-items:center;background:transparent;border:none;color:var(--gold);font-weight:800;letter-spacing:.08em;font-size:12px;cursor:pointer;text-shadow:0 0 10px rgba(255,46,196,.35);white-space:nowrap;padding:8px 10px;margin-top:4px}
.glow-link:hover{color:#fff;text-shadow:0 0 12px rgba(255,46,196,.6)}
.edit-chip{outline:2px dashed var(--gold);outline-offset:-1px;cursor:pointer;transition:outline-color .2s}
.edit-chip:hover{outline-color:var(--pink)}
.pdf-window{position:fixed;left:-9999px;top:0;width:800px;background:#fff;color:#000}
@media print{ body *{visibility:hidden} #printArea,#printArea *{visibility:visible} #printArea{position:absolute;left:0;top:0;width:100%} }
.contact-release-tag{display:inline-block;font-size:10px;letter-spacing:.1em;padding:3px 8px;border-radius:999px;border:1px solid var(--gpx);color:var(--gpx);text-transform:uppercase}
.tag.none{color:var(--dim2);border-color:#333}
.toast{position:fixed;bottom:70px;left:50%;transform:translateX(-50%);z-index:910;background:#111;border:1px solid var(--gpx);color:#fff;padding:10px 18px;border-radius:12px;font-size:13px;box-shadow:0 8px 30px rgba(0,0,0,.5);animation:fadeUp .25s ease}
.checkflow .money{font-family:'Archivo';font-weight:900;font-size:22px;color:var(--lime);margin:6px 0}


/* ---------- Admin section collapsible cards (organization only) ----------
   Keeps every admin tool/content; just makes each titled section a collapsible
   card so the panel is easier to scan. Defaults to collapsed (clean view). */
.checkflow .byp-admin-sections{display:grid;gap:10px}
.checkflow .admin-sec{background:var(--surf-1);border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:border-color .2s}
.checkflow .admin-sec.open{border-color:rgba(255,46,196,.25)}
.checkflow .admin-sec-head{display:flex;align-items:center;gap:10px;width:100%;padding:13px 14px;background:#111;border:none;color:var(--gold);font-weight:800;font-size:13px;letter-spacing:.06em;cursor:pointer;text-align:left;user-select:none;border-bottom:1px solid transparent}
.checkflow .admin-sec.open .admin-sec-head{border-bottom-color:#222;color:var(--pink);text-shadow:0 0 14px rgba(255,46,196,.4)}

/* ============================================================
   ADMIN SECTION IDENTITY COLOURS
   ------------------------------------------------------------
   Every MAJOR Admin area carries ONE main identity colour from the FINAL
   approved palette (BLACK · WHITE · BLUE · ELECTRIC BLUE · PINK · ELECTRIC
   PINK · PURPLE). NAVY IS FORBIDDEN.

   The identity is applied CONSISTENTLY to the section title, the icon/dot, the
   underline/accent line, the border accent and the selected/open state — never
   as a half-pink/half-blue title, which is what made the panel look random and
   slowed navigation down.

     MATCHES / MATCH HISTORY                     -> ELECTRIC PINK  #ff2ec4
     EDIT MODE / CONTENT / CUSTOMER-FACING COPY  -> ELECTRIC BLUE  #00e5ff
     GLOBAL BRANDING & LOGO                      -> BLUE           #7ce9ff
     BRAND / GLOBAL LOGO IMAGE                   -> ELECTRIC BLUE  #00e5ff
     GLOBAL MINI ICON / FAVICON                  -> PURPLE         #a855ff
     SCREENSAVER                                 -> ELECTRIC BLUE  #00e5ff
     MEMBER MANAGEMENT / DIRECTORY               -> BLUE           #7ce9ff
     EMAIL & RECOVERY                            -> WHITE          #ffffff
     SHARING & CONTACT                           -> PINK           #ff8fd8
     RESULT COMPLETION                           -> ELECTRIC PINK  #ff2ec4
     MAIN PAGE HERO                              -> PURPLE         #a855ff
     PAYMENTS & KEYS                             -> BLUE           #7ce9ff
     STAFF / PERMISSIONS / ACTIVITY / MYSTERY    -> WHITE          #ffffff (+ purple accent)
     EVENTS                                      -> ELECTRIC BLUE  #00e5ff
     PRICING / PROMO                             -> PURPLE         #a855ff

   BLACK stays the base and WHITE stays the readable text, so the panel never
   becomes a rainbow. Identical on desktop and mobile (no media query overrides).
   ============================================================ */
.checkflow .admin-sec{--asec:var(--pink);--asec-soft:rgba(255,46,196,.28)}
.checkflow .admin-sec[data-asec="branding"]{--asec:#7ce9ff;--asec-soft:rgba(124,233,255,.32)}   /* GLOBAL BRANDING & LOGO -> BLUE */
.checkflow .admin-sec[data-asec="logoimage"]{--asec:#ff8fd8;--asec-soft:rgba(255,143,216,.34)}  /* BRAND / GLOBAL LOGO IMAGE -> PINK */
.checkflow .admin-sec[data-asec="miniicon"]{--asec:#a855ff;--asec-soft:rgba(168,85,255,.34)}    /* MINI ICON / FAVICON -> PURPLE */
.checkflow .admin-sec[data-asec="screensaver"]{--asec:#00e5ff;--asec-soft:rgba(0,229,255,.34)}  /* SCREENSAVER -> ELECTRIC BLUE */
.checkflow .admin-sec[data-asec="members"]{--asec:#7ce9ff;--asec-soft:rgba(124,233,255,.32)}    /* MEMBER MANAGEMENT -> BLUE */
.checkflow .admin-sec[data-asec="email"]{--asec:#ffffff;--asec-soft:rgba(255,255,255,.30)}      /* EMAIL & RECOVERY -> WHITE */
.checkflow .admin-sec[data-asec="sharing"]{--asec:#ff8fd8;--asec-soft:rgba(255,143,216,.34)}    /* SHARING & CONTACT -> PINK */
.checkflow .admin-sec[data-asec="result"]{--asec:#a855ff;--asec-soft:rgba(168,85,255,.34)}      /* RESULT COMPLETION -> PURPLE */
.checkflow .admin-sec[data-asec="hero"]{--asec:#ff2ec4;--asec-soft:rgba(255,46,196,.34)}        /* MAIN PAGE HERO -> ELECTRIC PINK */
.checkflow .admin-sec[data-asec="payments"]{--asec:#7ce9ff;--asec-soft:rgba(124,233,255,.34)}   /* PAYMENTS & KEYS -> BLUE */
.checkflow .admin-sec[data-asec="staff"]{--asec:#ffffff;--asec-soft:rgba(168,85,255,.36)}       /* STAFF / MYSTERY -> WHITE + PURPLE accent */
.checkflow .admin-sec[data-asec="events"]{--asec:#00e5ff;--asec-soft:rgba(0,229,255,.34)}       /* EVENTS -> ELECTRIC BLUE */
.checkflow .admin-sec[data-asec="pricing"]{--asec:#a855ff;--asec-soft:rgba(168,85,255,.34)}     /* PRICING / PROMO -> PURPLE */
.checkflow .admin-sec[data-asec="content"]{--asec:#7ce9ff;--asec-soft:rgba(124,233,255,.32)}      /* CUSTOMER-FACING PAGE COPY -> BLUE */
.checkflow .admin-sec[data-asec="matches"]{--asec:#ff2ec4;--asec-soft:rgba(255,46,196,.32)}     /* MATCHES / MATCH HISTORY -> ELECTRIC PINK */
.checkflow .admin-sec[data-asec="system"]{--asec:#ffffff;--asec-soft:rgba(255,255,255,.28)}
/* ============================================================
   THE ADMIN COLOUR MAP — one deliberate identity per section so the list ROTATES
   through the whole approved palette instead of collapsing to Electric Blue.
   BLACK stays the background, WHITE stays the main text. NO NAVY anywhere.
   ============================================================ */
.checkflow .admin-sec[data-asec="editmode"]{--asec:#a855ff;--asec-soft:rgba(168,85,255,.34)}          /* EDIT MODE -> PURPLE */
.checkflow .admin-sec[data-asec="gppresets"]{--asec:#ff8fd8;--asec-soft:rgba(255,143,216,.34)}        /* GP CONVERSATION PRESETS -> PINK */
.checkflow .admin-sec[data-asec="unlock"]{--asec:#a855ff;--asec-soft:rgba(168,85,255,.34)}            /* PAYMENT / UNLOCK -> PURPLE */
.checkflow .admin-sec[data-asec="questions"]{--asec:#7ce9ff;--asec-soft:rgba(124,233,255,.32)}        /* QUESTION LIBRARY -> BLUE */
.checkflow .admin-sec[data-asec="rellabels"]{--asec:#ff2ec4;--asec-soft:rgba(255,46,196,.34)}         /* RELATIONSHIP RESULT LABELS -> ELECTRIC PINK */
.checkflow .admin-sec[data-asec="adminmembers"]{--asec:#00e5ff;--asec-soft:rgba(0,229,255,.34)}       /* ADMIN MEMBER MANAGEMENT -> ELECTRIC BLUE */
/* HOMEPAGE / MARKETING / ABOUT BYP / LAWFUL NOTICES (homepage + funnel task) */
.checkflow .admin-sec[data-asec="homepage"]{--asec:#ff2ec4;--asec-soft:rgba(255,46,196,.34)}          /* ELECTRIC PINK */
.checkflow .admin-sec[data-asec="marketingimages"]{--asec:#00e5ff;--asec-soft:rgba(0,229,255,.34)}    /* ELECTRIC BLUE */
.checkflow .admin-sec[data-asec="testimonials"]{--asec:#ff8fd8;--asec-soft:rgba(255,143,216,.34)}     /* PINK */
.checkflow .admin-sec[data-asec="aboutbyp"]{--asec:#a855ff;--asec-soft:rgba(168,85,255,.34)}          /* PURPLE */
.checkflow .admin-sec[data-asec="notices"]{--asec:#7ce9ff;--asec-soft:rgba(124,233,255,.32)}          /* BLUE */
/* Heading + icon take the section identity; the body text stays white. */
.checkflow .admin-sec-head{color:var(--asec)}
.checkflow .admin-sec.open{border-color:var(--asec-soft)}
.checkflow .admin-sec.open .admin-sec-head{color:var(--asec);text-shadow:0 0 14px var(--asec-soft)}
.checkflow .admin-sec-head .asec-chev{color:var(--asec)}
/* A short accent rule under the heading makes each area scannable at a glance. */
.checkflow .admin-sec-head::after{content:'';position:absolute;left:14px;right:14px;bottom:0;height:2px;background:linear-gradient(90deg,var(--asec),transparent);opacity:.55}
.checkflow .admin-sec-head{position:relative}
.checkflow .admin-sec[data-asec="pricing"] .admin-sec-head::after{background:linear-gradient(90deg,var(--asec),rgba(0,229,255,.35) 70%,transparent)}
/* The identity dot/icon in front of the label. */
.checkflow .admin-sec-head .asec-id{flex:0 0 auto;width:9px;height:9px;border-radius:3px;background:var(--asec);box-shadow:0 0 10px var(--asec-soft)}
/* Selected/highlighted nav chip inside a section uses the SAME identity. */
.checkflow .admin-sec .cbtn.primary{background:var(--asec);border-color:var(--asec)}
.checkflow .admin-sec-head .asec-chev{font-size:12px;color:var(--gpx);transition:transform .2s;flex:0 0 auto}
.checkflow .admin-sec.open .asec-chev{transform:rotate(90deg)}
.checkflow .admin-sec-head .asec-title{flex:1}
.checkflow .admin-sec-body{padding:14px}
.checkflow .admin-sec.closed .admin-sec-body{display:none}

/* ---------- MORE DETAILS (results) ---------- */
/* ---------- SAVE THIS MOMENT (below the Result Card) ---------- */
.save-moment{text-align:center;margin:14px auto 4px;max-width:420px;padding:12px 16px;border:1px dashed rgba(124,233,255,.28);border-radius:14px;background:linear-gradient(180deg,rgba(0,229,255,.05),rgba(0,0,0,0))}
.save-moment .sm-title{font-family:'Archivo',sans-serif;font-weight:900;font-size:12px;letter-spacing:.22em;color:var(--pink);text-transform:uppercase}
.save-moment .sm-sub{color:var(--dim);font-size:12.5px;margin-top:4px}

/* ---------- RESULT EXPORT MENU ••• — REMOVED ----------
   The Result Card and More Details panel no longer carry a ••• export menu, and
   no generated PNG/PDF copy of the card is produced. The LIVE card on screen IS
   the result; the member saves it with their own device screenshot tools (see
   SAVE THIS MOMENT below the card). The .result-overflow / .ro-* rules were
   removed with the markup. */
.md-toggle{display:inline-flex;align-items:center;gap:6px;margin:14px 0 4px;background:none;border:1px solid var(--line);color:#fff;border-radius:999px;padding:6px 14px;font-size:11.5px;font-weight:700;letter-spacing:.08em;cursor:pointer;text-transform:uppercase}
.md-toggle:hover{border-color:var(--pink);color:var(--pink)}
.md-panel{background:var(--surf-1);border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin-top:6px;display:block}
.checkflow .md-panel{display:block}
.md-row{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid #000000;align-items:flex-start}
.md-row:last-child{border-bottom:none}
.md-emoji{font-size:18px;line-height:1.2;flex:none}
.md-body{flex:1;min-width:0}
.md-name{font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#fff;margin-bottom:2px}
.md-txt{font-size:12.5px;color:#cfcfd8;line-height:1.5}
/* Harmony signed & uncapped scale */
.harm-scale{display:flex;align-items:center;gap:6px;margin-top:8px}
.hs-neg{font-size:12px;width:8px;color:#999}
.hs-pos{font-size:11px;color:#00e5ff;margin-left:auto;font-weight:800}
.hs-track{position:relative;flex:1;height:10px;border-radius:999px;background:linear-gradient(90deg,#ff2ec4,#fff,#00e5ff 75%,#00e5ff);overflow:hidden}
.hs-track::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;background:#111}
.hs-fill{display:block;height:100%;background:transparent;position:relative}
.harm-labels{display:flex;justify-content:space-between;font-size:9px;color:#777;letter-spacing:.03em;margin-top:2px}
/* compact result action tiles */
.result-tiles{margin-top:16px}
.result-tiles .rtile{background:#111;border:1px solid rgba(255,46,196,.35);color:#fff;border-radius:12px;padding:18px 10px;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:border-color .15s,transform .15s,box-shadow .15s}
.result-tiles .rtile:hover{border-color:var(--pink);box-shadow:0 0 16px rgba(255,46,196,.32);transform:translateY(-1px)}
/* FOLLOW BYP social*/
.follow-byp{text-align:center;margin-top:24px;border-top:1px solid rgba(124,233,255,.14);padding-top:14px}
.follow-label{font-size:10px;letter-spacing:.22em;color:#9ca0ab;text-transform:uppercase;margin-bottom:8px}
.follow-icons{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.fbtn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#111;border:1px solid var(--line);color:#fff;font-size:10px;font-weight:800;letter-spacing:.04em;text-decoration:none}
.fbtn:hover{border-color:var(--pink);color:var(--pink)}

/* ---- richer Results breakdown (2026) ---- */
.md-band{font-size:10px;letter-spacing:.12em;border:1px solid currentColor;border-radius:999px;padding:1px 8px;margin-left:6px;vertical-align:middle}
.md-sub{font-size:11px;letter-spacing:.08em;text-transform:uppercase;margin-top:6px}
.md-factor{display:flex;gap:8px;align-items:flex-start;padding:4px 0;font-size:12.5px;line-height:1.45}
.md-factor-amt{flex:none;min-width:44px;font-family:Consolas,monospace;font-weight:800}
.md-factor.pos .md-factor-amt{color:var(--gpx,#00e5ff)}
.md-factor.neg .md-factor-amt{color:#ff2ec4}
.md-factor-txt{color:#cfcfd8}
.harm-calc{margin-top:10px;border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:8px 10px}
.harm-calc-row{display:flex;justify-content:space-between;align-items:center;padding:2px 0;font-size:12.5px}
.harm-calc-final{border-top:1px solid rgba(255,255,255,.12);margin-top:4px;padding-top:6px;font-weight:900}
/* simplified Results actions */
.result-primary{padding:16px 20px;font-weight:900;letter-spacing:.06em}
.result-secondary .rtile{background:#111;border:1px solid rgba(255,46,196,.35);color:#fff;border-radius:12px;padding:14px 10px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.result-secondary .rtile:hover{border-color:var(--pink);box-shadow:0 0 16px rgba(255,46,196,.32)}
.share-panel .rtile{background:#111;border:1px solid rgba(0,229,255,.3);color:#fff;border-radius:12px;padding:14px 10px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.share-panel .rtile:hover{border-color:var(--cyan,#00e5ff);box-shadow:0 0 16px rgba(0,229,255,.30)}
.share-panel [data-share-do]{border-color:var(--gpx,#00e5ff);color:#00e5ff}

/* ---------- BYP in-app Stripe payment / unlock experience ---------- */
.checkflow .byp-pay-offers{display:grid;gap:8px;margin-top:8px}
.checkflow .byp-pay-offer{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--surf-1);border:1px solid rgba(124,233,255,.19);border-radius:12px;padding:12px 14px;cursor:pointer;text-align:left;color:#fff;width:100%}
.checkflow .byp-pay-offer:hover{border-color:var(--pink)}
.checkflow .byp-pay-offer.sel{border-color:var(--pink);box-shadow:0 0 0 1px var(--pink) inset}
.checkflow .byp-pay-offer .po-main{display:flex;flex-direction:column;gap:2px;min-width:0}
.checkflow .byp-pay-offer .lbl{display:block;font-weight:900;letter-spacing:.04em;font-size:14.5px}
.checkflow .byp-pay-offer .sub{display:block;font-size:11.5px;color:var(--dim);font-weight:400;letter-spacing:normal}
.checkflow .byp-pay-offer .price{font-family:'Archivo';font-weight:900;font-size:18px;color:var(--gpx,#00e5ff);white-space:nowrap;display:flex;flex-direction:column;align-items:flex-end}
.checkflow .byp-pay-offer .price .per{font-family:inherit;font-size:10.5px;font-weight:600;color:var(--dim);letter-spacing:.06em}
.checkflow .byp-pay-methods{margin-top:10px}
.checkflow .byp-pay-state{text-align:center;font-weight:800;letter-spacing:.06em;padding:14px 10px;border-radius:12px;margin:8px 0}
.checkflow .byp-pay-state.ok{color:#000;background:var(--gpx,#00e5ff)}
.checkflow .byp-pay-state.err{color:#fff;background:var(--surf-1);border:1px solid var(--red,#ff2ec4)}
/* SELECTED badge is a NEUTRAL/pink selection indicator — NOT a success state. */
.checkflow .byp-sel-badge{display:inline-block;font-weight:900;letter-spacing:.06em;padding:6px 12px;border-radius:20px;background:rgba(255,46,196,.12);border:1px solid var(--pink);color:var(--pink);font-size:12px}
/* Green reserved for genuine SUCCESS (payment complete, promo accepted). */
.checkflow .byp-paid-badge{display:inline-block;font-weight:900;letter-spacing:.06em;padding:6px 12px;border-radius:20px;background:var(--gpx,#00e5ff);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.45);font-size:12px}
.checkflow .byp-spin{display:inline-block;width:16px;height:16px;border:2px solid rgba(255,255,255,.25);border-top-color:var(--gpx,#00e5ff);border-radius:50%;animation:bypSpin .8s linear infinite;vertical-align:-3px;margin-right:6px}
@keyframes bypSpin{to{transform:rotate(360deg)}}

/* ============================================================
   RESULTS — DESKTOP RESPONSIVENESS
   ------------------------------------------------------------
   The result design is intentionally UNCHANGED: this only gives the existing
   card, its action row and the share panel more room on a desktop viewport, so
   the page stops looking like a phone layout floating in the middle of a
   monitor. Mobile behaviour is untouched (all rules are desktop-only).
   ============================================================ */
@media (min-width:900px){
  /* The flow column widens for the RESULTS surfaces only — the earlier steps
     (choose / birthdays / test) stay at their comfortable reading width. */
  .checkflow.byp-results-wide{max-width:920px}
  .checkflow .result-completion{max-width:920px;margin:0 auto}
  /* Give the reveal card a larger stage; the card itself is scaled to fit it. */
  .checkflow.byp-results-wide .bc-reveal-stage{max-width:600px}
  .checkflow .result-secondary{grid-template-columns:1fr 1fr}
  .checkflow .result-primary{font-size:15px}
  /* The share panel becomes a proper desktop panel, not a phone sheet. */
  .checkflow .share-panel{padding:18px 20px;border-radius:16px}
  .checkflow .share-panel .share-panel-title{font-size:13px}
  .checkflow .share-panel-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
  .checkflow .share-panel .rtile{padding:18px 12px;font-size:12px}
}
@media (min-width:1200px){
  .checkflow.byp-results-wide{max-width:950px}
  .checkflow.byp-results-wide .bc-reveal-stage{max-width:640px}
}

/* ---- DESKTOP SHARE MODAL ----------------------------------------------
   A centered desktop panel with explicit actions. Deliberately NOT the mobile
   share sheet: on desktop there is no native file share, so the member gets a
   clear choice of SHARE / SAVE IMAGE / DOWNLOAD PDF / CANCEL. */
.byp-desktop-share-overlay{position:fixed;inset:0;background:rgba(0,0,0,.82);z-index:970;display:flex;align-items:center;justify-content:center;padding:24px}
.byp-desktop-share{width:min(94vw,560px);background:var(--surf-1);border:1px solid rgba(0,229,255,.32);border-radius:18px;padding:22px 22px 18px;box-shadow:0 24px 70px rgba(0,0,0,.7);text-align:center}
.byp-desktop-share h2{margin:0 0 4px;font-size:16px;font-weight:900;letter-spacing:.1em;color:#fff;text-transform:uppercase}
.byp-desktop-share .sub{font-size:12px;color:var(--dim2,#9ca0ab);margin-bottom:16px}
.byp-desktop-share .share-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.byp-desktop-share .share-grid button{background:#111;border:1px solid rgba(255,255,255,.18);color:#fff;border-radius:12px;padding:16px 12px;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.byp-desktop-share .share-grid button:hover{border-color:var(--cyan,#00e5ff);box-shadow:0 0 16px rgba(0,229,255,.30)}
.byp-desktop-share .share-grid [data-dshare-image]{border-color:rgba(255,46,196,.4)}
.byp-desktop-share .share-grid [data-dshare-pdf]{border-color:rgba(0,229,255,.4)}
.byp-desktop-share .share-grid [data-dshare-cancel]{border-color:rgba(255,255,255,.14);color:var(--dim2,#9ca0ab)}
.byp-desktop-share .share-preview{margin-bottom:14px}
.byp-desktop-share .share-preview img{width:100%;max-width:260px;border-radius:12px;display:block;margin:0 auto;box-shadow:0 10px 34px rgba(0,0,0,.6)}
.byp-desktop-share .note{margin-top:12px;font-size:11px;color:var(--dim2,#9ca0ab)}
.byp-desktop-share .ds-badge{display:inline-block;font-size:9.5px;font-weight:900;letter-spacing:.18em;color:#00e5ff;border:1px solid rgba(0,229,255,.45);border-radius:999px;padding:3px 10px;margin-bottom:10px}

/* ============================================================
   ENTITLED-MEMBER RESULT TRANSITION
   A short, intentional BYP reveal shown ONLY to members who already
   hold access (available Key OR active Unlimited). Black background,
   white text, neon pink/magenta progress accent, cyan secondary.
   GREEN is reserved for completed success checks. Mobile-first.
   ============================================================ */
.checkflow .bup-t-wrap{max-width:420px;margin:24px auto;padding:0 16px;text-align:center}
.checkflow .bup-t-title{font-weight:900;letter-spacing:.14em;font-size:15px;color:#fff;margin-bottom:14px}
.checkflow .bup-t-line{font-weight:800;letter-spacing:.06em;font-size:14px;color:#fff;margin:4px 0}
.checkflow .bup-t-line b{color:var(--pink,#ff2ec4)}
.checkflow .bup-t-sub{font-weight:700;letter-spacing:.05em;font-size:12px;color:var(--cyan,#00e5ff);margin-bottom:14px}
/* Progress track + fill: neon pink/magenta accent, never green. */
.checkflow .bup-t-bar{position:relative;height:8px;border-radius:99px;background:rgba(255,255,255,.08);border:1px solid rgba(255,46,196,.45);overflow:hidden;margin:16px 0 18px}
.checkflow .bup-t-bar i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--pink,#ff2ec4),var(--cyan,#00e5ff));box-shadow:0 0 12px rgba(255,46,196,.55);transition:width .28s ease}
.checkflow .bup-t-steps{text-align:left;display:inline-block;min-width:240px}
.checkflow .bup-t-step{font-weight:700;letter-spacing:.05em;font-size:13px;color:rgba(255,255,255,.32);margin:7px 0;opacity:.5;transition:color .25s ease,opacity .25s ease}
.checkflow .bup-t-step.on{color:var(--gpx,#00e5ff);opacity:1}
.checkflow .bup-t-final{margin-top:16px}
.checkflow .bup-t-ok{font-weight:900;letter-spacing:.06em;font-size:14px;color:var(--gpx,#00e5ff);margin:4px 0}
.checkflow .bup-t-ready{margin-top:12px;font-weight:900;letter-spacing:.14em;font-size:14px;color:var(--pink,#ff2ec4)}
@media (max-width:420px){.checkflow .bup-t-steps{min-width:0;width:100%}}

/* ============================================================
   UNLOCKING RESULTS — DESKTOP / LARGE SCREEN SCALE
   ------------------------------------------------------------
   On a desktop the reveal panel sat in a 420px column with phone-sized type, so
   it read as a small, timid block on a large screen. These breakpoints widen
   and scale it UP deliberately — wider column, larger heading, larger key
   balance, taller progress bar, larger status lines and more intentional
   vertical rhythm — while staying restrained rather than oversized.

   MOBILE IS UNCHANGED: the base rules above still apply below 768px, and these
   only override at min-width, so nothing here can affect a phone.
   ============================================================ */
@media (min-width:768px){
  .checkflow .bup-t-wrap{max-width:600px;margin:44px auto;padding:0 28px}
  .checkflow .bup-t-title{font-size:20px;letter-spacing:.16em;margin-bottom:22px}
  .checkflow .bup-t-line{font-size:17px;margin:8px 0}
  .checkflow .bup-t-ok{font-size:17px;margin:8px 0}
  .checkflow .bup-t-sub{font-size:13.5px;margin-bottom:22px}
  .checkflow .bup-t-bar{height:11px;margin:26px 0 28px}
  .checkflow .bup-t-bar i{box-shadow:0 0 18px rgba(255,46,196,.6)}
  .checkflow .bup-t-steps{min-width:360px}
  .checkflow .bup-t-step{font-size:15.5px;margin:12px 0}
  .checkflow .bup-t-final{margin-top:26px}
  .checkflow .bup-t-ready{font-size:17px;margin-top:20px}
}
@media (min-width:1180px){
  .checkflow .bup-t-wrap{max-width:720px;margin:60px auto}
  .checkflow .bup-t-title{font-size:23px;margin-bottom:26px}
  .checkflow .bup-t-line{font-size:19px;margin:10px 0}
  .checkflow .bup-t-ok{font-size:19px;margin:10px 0}
  .checkflow .bup-t-sub{font-size:15px;margin-bottom:26px}
  .checkflow .bup-t-bar{height:13px;margin:30px 0 34px}
  .checkflow .bup-t-steps{min-width:440px}
  .checkflow .bup-t-step{font-size:17px;margin:15px 0}
  .checkflow .bup-t-ready{font-size:19px}
}

/* TRUE DESKTOP — 1440px and wider.
   The 720px column still read as a narrow strip on a full desktop display, so the
   reveal claims the space it is given: a ~880px column, a much larger heading,
   bigger key-balance line, a thicker progress bar and a taller status list, with
   the vertical rhythm opened up so the panel fills the viewport by design rather
   than floating as a small block in the middle of it.
   MOBILE AND TABLET ARE UNTOUCHED — every rule is inside min-width:1440px. */
@media (min-width:1440px){
  .checkflow .bup-t-wrap{max-width:880px;margin:76px auto 84px;padding:0 40px}
  .checkflow .bup-t-title{font-size:31px;letter-spacing:.18em;margin-bottom:34px}
  .checkflow .bup-t-line{font-size:23px;letter-spacing:.05em;margin:14px 0}
  .checkflow .bup-t-ok{font-size:23px;margin:14px 0}
  .checkflow .bup-t-sub{font-size:17px;margin-bottom:32px}
  .checkflow .bup-t-bar{height:16px;margin:40px 0 44px;border-width:2px}
  .checkflow .bup-t-bar i{box-shadow:0 0 26px rgba(255,46,196,.7)}
  .checkflow .bup-t-steps{min-width:560px}
  .checkflow .bup-t-step{font-size:20px;margin:19px 0;letter-spacing:.06em}
  .checkflow .bup-t-final{margin-top:38px}
  .checkflow .bup-t-ready{font-size:23px;margin-top:28px}
}




/* MATCH PICKER COLOR-CODED PATHS */
.checkflow .pick-method{
  position:relative;
  overflow:hidden;
  border-width:1px;
  border-style:solid;
  box-shadow:0 18px 40px rgba(0,0,0,.18);
}
.checkflow .pick-method::before{
  content:'';
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:var(--pick-accent);
  box-shadow:0 0 18px var(--pick-accent);
}
.checkflow .pick-method>label{
  color:var(--pick-accent);
  font-weight:900;
  letter-spacing:.12em;
}
.checkflow .pick-me{
  --pick-accent:#23e7b7;
  border-color:rgba(35,231,183,.34);
  background:linear-gradient(145deg,rgba(35,231,183,.07),rgba(4,7,11,.82));
}
.checkflow .pick-code{
  --pick-accent:#00e5ff;
  border-color:rgba(0,229,255,.36);
  background:linear-gradient(145deg,rgba(0,229,255,.08),rgba(4,7,11,.84));
}
.checkflow .pick-member{
  --pick-accent:#ff2ec4;
  border-color:rgba(255,46,196,.38);
  background:linear-gradient(145deg,rgba(255,46,196,.09),rgba(4,7,11,.84));
}
.checkflow .pick-bday{
  --pick-accent:#a855ff;
  border-color:rgba(168,85,255,.38);
  background:linear-gradient(145deg,rgba(168,85,255,.09),rgba(4,7,11,.84));
}
.checkflow .pick-method:focus-within{
  box-shadow:0 0 0 1px var(--pick-accent),0 0 28px color-mix(in srgb,var(--pick-accent) 24%,transparent);
}
.checkflow .member-viewall{
  font-size:11px;
  padding:10px 14px;
  border-color:#ff2ec4!important;
  color:#fff!important;
  background:linear-gradient(90deg,rgba(255,46,196,.22),rgba(168,85,255,.14))!important;
  box-shadow:0 0 18px rgba(255,46,196,.15);
}
.checkflow .member-viewall:hover,
.checkflow .member-viewall:focus-visible{
  background:linear-gradient(90deg,#ff2ec4,#a855ff)!important;
  color:#06070a!important;
}
.checkflow .member-sort-row{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:10px;
}
.checkflow .va-sort{
  min-height:38px;
  padding:8px 13px!important;
  font-size:10px!important;
  font-weight:900;
  letter-spacing:.06em;
  background:#080910!important;
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease,color .15s ease;
}
.checkflow .va-sort.sort-name{
  border-color:#00e5ff!important;
  color:#8ef4ff!important;
}
.checkflow .va-sort.sort-newest{
  border-color:#a855ff!important;
  color:#d6b5ff!important;
}
.checkflow .va-sort.sort-recent{
  border-color:#ff2ec4!important;
  color:#ff9be7!important;
}
.checkflow .va-sort.is-active.sort-name{
  background:#00e5ff!important;
  color:#031015!important;
  box-shadow:0 0 22px rgba(0,229,255,.36);
}
.checkflow .va-sort.is-active.sort-newest{
  background:#a855ff!important;
  color:#09040f!important;
  box-shadow:0 0 22px rgba(168,85,255,.38);
}
.checkflow .va-sort.is-active.sort-recent{
  background:#ff2ec4!important;
  color:#12030e!important;
  box-shadow:0 0 22px rgba(255,46,196,.38);
}
.checkflow .va-sort:active{
  transform:scale(.97);
}

@media(max-width:560px){
  .checkflow .pick-method{
    border-radius:22px;
  }
  .checkflow .member-sort-row{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
  }
  .checkflow .va-sort{
    width:100%;
    min-width:0;
    padding:9px 6px!important;
    font-size:9px!important;
  }
  .checkflow .member-viewall{
    min-height:48px;
    padding:10px 16px;
  }
}


/* BIRTHDAY AGE-YEAR HELPER */
.checkflow .bday-age-toggle{
  margin-top:9px;
  padding:0;
  border:0;
  background:none;
  color:#d6b5ff;
  font:800 10px/1.4 Archivo,sans-serif;
  letter-spacing:.08em;
  text-decoration:underline;
  text-underline-offset:3px;
  cursor:pointer;
}
.checkflow .bday-age-toggle:hover,
.checkflow .bday-age-toggle:focus-visible{
  color:#fff;
  text-shadow:0 0 12px rgba(168,85,255,.55);
  outline:none;
}
.checkflow .bday-age-box{
  margin-top:10px;
  padding:12px;
  border:1px solid rgba(168,85,255,.34);
  border-radius:13px;
  background:linear-gradient(145deg,rgba(168,85,255,.08),rgba(0,0,0,.34));
}
.checkflow .bday-age-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.checkflow .bday-age-grid label{
  color:#d6b5ff;
}
.checkflow .bday-calc-btn{
  margin-top:10px;
  border-color:#a855ff!important;
  color:#fff!important;
}
@media(max-width:460px){
  .checkflow .bday-age-grid{
    grid-template-columns:1fr;
  }
}


/* MOBILE OVERFLOW + TOUCH STABILITY
   Prevent newly-added form controls from widening the page and remove
   touch-device sticky hover states that can make buttons look/feel stuck. */
.checkflow .flow-card,
.checkflow .bday-age-box,
.checkflow .bday-age-grid,
.checkflow .bday-age-grid > div,
.checkflow .btn-row{
  box-sizing:border-box;
  max-width:100%;
  min-width:0;
}
.checkflow .btn-row .cbtn{
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
  touch-action:manipulation;
}
.checkflow .bday-age-toggle,
.checkflow .bday-calc-btn,
.checkflow .person-pick,
.checkflow .me-chip{
  touch-action:manipulation;
}

@media (hover:none) and (pointer:coarse){
  .checkflow .me-chip:hover{
    transform:none;
    box-shadow:none;
  }
  .checkflow .person-pick:hover{
    transform:none;
    border-color:rgba(124,233,255,.20);
  }
  .checkflow .bday-age-toggle:hover{
    color:#d6b5ff;
    text-shadow:none;
  }
  .checkflow .member-viewall:hover{
    background:linear-gradient(90deg,rgba(255,46,196,.22),rgba(168,85,255,.14))!important;
    color:#fff!important;
  }
  .checkflow .cbtn.action:not(:disabled):hover{
    transform:none;
  }
}

@media(max-width:560px){
  .checkflow{
    padding-left:14px;
    padding-right:14px;
  }
  .checkflow .flow-card{
    width:100%;
    overflow-x:hidden;
  }
  .checkflow .bday-age-grid{
    grid-template-columns:1fr;
  }
}


/* PRIVATE CONTACT DISCLOSURE */
.checkflow .contact-private-toggle{
  width:100%;
  min-height:44px;
  margin-top:10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border:1px solid rgba(168,85,255,.38);
  border-radius:11px;
  background:#080910;
  color:#fff;
  font:800 11px/1.2 Archivo,sans-serif;
  letter-spacing:.08em;
  cursor:pointer;
  touch-action:manipulation;
}
.checkflow .contact-private-toggle span{color:#d6b5ff}
.checkflow .contact-private-values{
  margin-top:8px;
  padding:10px 12px;
  border-radius:10px;
  background:rgba(168,85,255,.07);
  border:1px solid rgba(168,85,255,.18);
  overflow-wrap:anywhere;
}
.checkflow .email-result-controls{
  text-align:center;
}
.checkflow .email-detail-choice{
  display:inline-flex!important;
  align-items:center;
  gap:8px;
  color:#d6b5ff!important;
  font-size:11px!important;
  font-weight:800;
  letter-spacing:.08em!important;
  cursor:pointer;
}
.checkflow .email-detail-choice input{
  width:18px!important;
  height:18px;
  accent-color:#a855ff;
}


/* ============================================================
   RESULT POLISH — context, portraits, email + collapsed sharing
   ============================================================ */
.checkflow .result-context-switch{
  width:min(100%,440px);
  margin:4px auto 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}
.checkflow .result-context-switch label{
  margin:0;
  color:var(--dim2);
  font:800 10px/1 Archivo,sans-serif;
  letter-spacing:.16em;
}
.checkflow .result-context-switch select{
  width:auto;
  min-width:180px;
  padding:9px 30px 9px 11px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.06em;
  background:#080910;
  border-color:rgba(0,229,255,.28);
}

.checkflow .bc-people{
  width:100%;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:24px;
  margin:14px 0 6px;
}
.checkflow .bc-person{display:flex;flex-direction:column;align-items:center;min-width:0}
.checkflow .bc-person .byp-photo{
  object-fit:cover;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.28);
  box-shadow:0 0 0 1px rgba(255,46,196,.18),0 0 14px rgba(255,46,196,.14),0 8px 24px rgba(0,0,0,.34)!important;
  filter:none!important;
}
.checkflow .bc-person-name{margin-top:10px;font-size:25px;font-weight:900;color:#fff;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.checkflow .bc-person-code{margin-top:3px;font-family:Consolas,monospace;font-size:15px;color:rgba(255,255,255,.55);letter-spacing:.06em}
.checkflow .bc-people-and{font-family:Archivo,sans-serif;font-size:28px;font-weight:900;color:var(--pink);opacity:.8}
/* Keep the decorative background aura subtle: the result/portrait should be
   crisp, not surrounded by a large hazy cloud. */
.checkflow .bc-aura{filter:blur(90px);opacity:.20}
.checkflow .bc-aura-p{width:330px;height:330px;top:-70px;left:-80px}
.checkflow .bc-aura-b{width:350px;height:350px;bottom:-100px;right:-70px}

.checkflow .save-moment{
  margin:12px auto 3px;
  padding:8px 12px;
  border:0;
  background:transparent;
  opacity:.82;
}
.checkflow .save-moment .sm-title{font-size:10px;letter-spacing:.18em;color:var(--dim)}
.checkflow .save-moment .sm-sub{font-size:11.5px;margin-top:2px}

.checkflow .result-completion>.md-toggle{
  display:flex;
  width:max-content;
  margin:14px auto 4px;
}
.checkflow .email-result-controls{
  width:min(100%,430px);
  margin:12px auto 2px;
  display:grid;
  justify-items:center;
  gap:8px;
}
.checkflow .email-result-controls[hidden]{display:none!important}
.checkflow .email-result-button{min-width:min(100%,300px)}
.checkflow .email-detail-choice{margin:0!important}

.checkflow .result-share-shell{
  width:min(100%,480px);
  margin:12px auto 0;
}
.checkflow .result-share-toggle{
  width:100%;
  min-height:46px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 14px;
  border:1px solid rgba(0,229,255,.22);
  border-radius:13px;
  background:#07090d;
  color:#fff;
  font:900 11px/1 Archivo,sans-serif;
  letter-spacing:.12em;
  cursor:pointer;
}
.checkflow .result-share-toggle .share-chev{font-size:22px;color:var(--gpx);line-height:1}
.checkflow .result-share-panel{
  margin-top:8px;
  padding:12px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:13px;
  background:rgba(255,255,255,.025);
}
.checkflow .result-share-panel[hidden],
.checkflow .result-share-custom[hidden]{display:none!important}
.checkflow .result-share-socials{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
.checkflow .result-share-socials button,
.checkflow .result-share-customize{
  min-height:42px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:10px;
  background:#090a0f;
  color:#fff;
  font:800 10px/1.25 Archivo,sans-serif;
  letter-spacing:.06em;
  cursor:pointer;
}
.checkflow .result-share-socials [data-share-download]{grid-column:span 2}
.checkflow .result-share-customize{
  width:100%;
  margin-top:9px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 12px;
  color:#d6b5ff;
  border-color:rgba(168,85,255,.28);
}
.checkflow .result-share-custom{
  margin-top:8px;
  display:grid;
  gap:7px;
  padding:10px;
  border-radius:10px;
  background:rgba(168,85,255,.05);
}
.checkflow .result-share-custom label{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0;
  color:#d9d9e2;
  font-size:10px;
  letter-spacing:.06em;
}
.checkflow .result-share-custom input{width:17px!important;height:17px;accent-color:#a855ff}

.checkflow .hist-person{display:flex;align-items:center;gap:11px;margin-bottom:7px}
.checkflow .hist-person .byp-photo{
  flex:none;
  object-fit:cover;
  border-radius:50%;
  border:1px solid rgba(0,229,255,.22);
  box-shadow:0 0 10px rgba(0,229,255,.10)!important;
}
.checkflow .hist-person-copy{flex:1;min-width:0}

@media(max-width:560px){
  .checkflow .result-share-socials{grid-template-columns:1fr 1fr}
  .checkflow .result-share-socials [data-share-download]{grid-column:1/-1}
  .checkflow .bc-people{gap:10px}
  .checkflow .bc-person-name{font-size:22px}
}


/* ============================================================
   PRE-REVEAL VIEW CONTEXT — polished choice cards
   ============================================================ */
.checkflow .view-context-wrap{
  width:100%;
  max-width:620px;
  margin:18px auto 0;
}
.checkflow .view-context-kicker{
  color:var(--gpx);
  font:800 11px/1.2 Archivo,sans-serif;
  letter-spacing:.16em;
  text-transform:uppercase;
  margin-bottom:10px;
}
.checkflow .view-context-wrap h1{
  max-width:600px;
  margin:0 0 8px;
}
.checkflow .view-context-wrap>.sub{
  max-width:590px;
  margin-bottom:20px;
}
.checkflow .view-context-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  width:100%;
}
.checkflow .view-context-choice{
  --vc-accent:#ff2ec4;
  position:relative;
  width:100%;
  min-height:82px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:7px;
  padding:15px 52px 15px 17px;
  border:1px solid color-mix(in srgb,var(--vc-accent) 42%,transparent);
  border-radius:16px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--vc-accent) 9%,#07090d),#07090d 62%);
  color:#fff;
  text-align:left;
  cursor:pointer;
  box-shadow:0 10px 28px rgba(0,0,0,.22);
  transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease,background .14s ease;
  touch-action:manipulation;
}
.checkflow .view-context-choice::after{
  content:'›';
  position:absolute;
  right:18px;
  top:50%;
  transform:translateY(-50%);
  color:var(--vc-accent);
  font:500 30px/1 Arial,sans-serif;
}
.checkflow .view-context-choice.romance{--vc-accent:#ff2ec4}
.checkflow .view-context-choice.family{--vc-accent:#a855ff}
.checkflow .view-context-choice.professional{--vc-accent:#00e5ff}
.checkflow .view-context-choice .vc-title{
  display:block;
  color:#fff;
  font:900 14px/1.1 Archivo,sans-serif;
  letter-spacing:.09em;
}
.checkflow .view-context-choice .vc-sub{
  display:block;
  color:rgba(255,255,255,.66);
  font-size:12px;
  line-height:1.35;
  letter-spacing:.01em;
}
.checkflow .view-context-choice:hover,
.checkflow .view-context-choice:focus-visible{
  transform:translateY(-1px);
  border-color:var(--vc-accent);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--vc-accent) 20%,transparent),0 10px 30px rgba(0,0,0,.30);
  outline:none;
}
.checkflow .view-context-choice:active{transform:scale(.992)}
@media(max-width:560px){
  .checkflow .view-context-wrap{margin-top:14px}
  .checkflow .view-context-choice{min-height:78px;padding:14px 44px 14px 15px;border-radius:14px}
  .checkflow .view-context-choice .vc-title{font-size:13px}
  .checkflow .view-context-choice .vc-sub{font-size:11.5px}
}
@media(hover:none) and (pointer:coarse){
  .checkflow .view-context-choice:hover{
    transform:none;
    border-color:color-mix(in srgb,var(--vc-accent) 42%,transparent);
    box-shadow:0 10px 28px rgba(0,0,0,.22);
  }
}


/* ============================================================
   CUSTOM RESULT ICONS + DECISION MOMENT
   ============================================================ */
.checkflow .r-icon-img{
  width:58px;
  height:58px;
  object-fit:contain;
  margin:2px auto 0;
  filter:drop-shadow(0 0 9px rgba(255,255,255,.10));
  animation:bypIconFloat 1.8s ease-in-out infinite;
}
.checkflow .r-score-star{
  width:58px;
  height:58px;
  margin:2px auto 0;
  display:grid;
  place-items:center;
  font-size:36px;
  color:var(--pink);
  text-shadow:0 0 18px rgba(255,46,196,.55);
  animation:bypIconFloat 1.8s ease-in-out infinite;
}
@keyframes bypIconFloat{
  0%,100%{transform:translateY(0) scale(1)}
  50%{transform:translateY(-3px) scale(1.03)}
}

.checkflow .bc-cell-icon{
  width:50px;
  height:50px;
  display:block;
  object-fit:contain;
  margin:0 auto 7px;
  filter:drop-shadow(0 0 7px rgba(255,255,255,.08));
}
.checkflow .bc-cell-e{display:none}

.checkflow .bc-decision{
  position:relative;
  overflow:hidden;
}
.checkflow .bc-dec-val{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
}
.checkflow .bc-decision-icon{
  width:48px;
  height:48px;
  object-fit:contain;
  flex:none;
  transform-origin:center;
  filter:drop-shadow(0 0 8px rgba(255,255,255,.12));
}
.checkflow .bc-decision-burst{
  position:absolute;
  left:50%;
  top:50%;
  width:16px;
  height:16px;
  border-radius:50%;
  pointer-events:none;
  opacity:0;
  transform:translate(-50%,-50%) scale(.25);
}
.checkflow .decision-pop .bc-decision-icon{
  animation:bypPopDecision 2.4s cubic-bezier(.2,.9,.3,1) infinite;
}
.checkflow .decision-pop .bc-decision-burst{
  animation:bypPopBurst 2.4s ease-out infinite;
  box-shadow:
    0 -52px 0 -5px #ff2ec4,
    40px -34px 0 -5px #00e5ff,
    52px 4px 0 -5px #a855ff,
    35px 40px 0 -5px #ff2ec4,
    0 52px 0 -5px #00e5ff,
    -38px 37px 0 -5px #a855ff,
    -52px 0 0 -5px #ff2ec4,
    -37px -36px 0 -5px #00e5ff;
}
.checkflow .decision-go .bc-decision-icon{
  animation:bypGoDecision 2s ease-in-out infinite;
}
.checkflow .decision-wait .bc-decision-icon{
  animation:bypWaitDecision 2.8s ease-in-out infinite;
}
@keyframes bypPopDecision{
  0%,64%,100%{transform:scale(1) rotate(0deg)}
  70%{transform:scale(1.12) rotate(-5deg)}
  76%{transform:scale(.90) rotate(5deg)}
  82%{transform:scale(1.18) rotate(0deg)}
}
@keyframes bypPopBurst{
  0%,68%,100%{opacity:0;transform:translate(-50%,-50%) scale(.2)}
  76%{opacity:.95;transform:translate(-50%,-50%) scale(1)}
  88%{opacity:0;transform:translate(-50%,-50%) scale(1.35)}
}
@keyframes bypGoDecision{
  0%,100%{transform:translateX(0) scale(1)}
  50%{transform:translateX(5px) scale(1.05)}
}
@keyframes bypWaitDecision{
  0%,100%{transform:scale(1);opacity:.86}
  50%{transform:scale(1.06);opacity:1}
}

@media(prefers-reduced-motion:reduce){
  .checkflow .r-icon-img,
  .checkflow .r-score-star,
  .checkflow .bc-decision-icon,
  .checkflow .bc-decision-burst{animation:none!important}
}


/* ============================================================
   2026-09-18 — FULL BYP RESULTS-FLOW VISUAL SYSTEM
   Neon cosmic / glass reskin scoped ONLY to the reveal journey.
   Existing scoring, auth, payment and save behavior are untouched.
   ============================================================ */
.checkflow.byp-resultflow{
  position:relative;
  isolation:isolate;
  color:#fff;
}
.checkflow.byp-resultflow::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 12%,rgba(255,46,196,.17),transparent 28%),
    radial-gradient(circle at 82% 18%,rgba(0,229,255,.13),transparent 26%),
    radial-gradient(circle at 48% 66%,rgba(168,85,255,.16),transparent 34%),
    linear-gradient(180deg,#05040b 0%,#080512 38%,#02050a 100%);
}
.checkflow.byp-resultflow::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.55;
  background-image:
    radial-gradient(circle,#fff 0 1px,transparent 1.4px),
    radial-gradient(circle,rgba(0,229,255,.9) 0 1px,transparent 1.5px),
    radial-gradient(circle,rgba(255,46,196,.75) 0 1px,transparent 1.5px);
  background-size:78px 78px,124px 124px,166px 166px;
  background-position:8px 14px,34px 46px,72px 9px;
}
.checkflow.byp-resultflow .flow-head{
  border-bottom:1px solid rgba(255,255,255,.08);
  padding-bottom:10px;
  backdrop-filter:blur(8px);
}
.checkflow.byp-resultflow .crumb{
  color:rgba(255,255,255,.72);
  letter-spacing:.13em;
  font-size:10px;
}
.checkflow.byp-resultflow .backhat{
  border-color:rgba(0,229,255,.22);
  background:rgba(4,6,13,.68);
  color:#fff;
  box-shadow:0 0 18px rgba(0,229,255,.05);
}
.checkflow.byp-resultflow .me-chip{
  background:rgba(10,7,18,.75)!important;
  border-color:rgba(255,46,196,.45)!important;
  box-shadow:0 0 16px rgba(255,46,196,.10);
}
.checkflow.byp-resultflow .flow-help{
  border-color:rgba(168,85,255,.35);
  background:rgba(9,8,18,.78);
}
.checkflow.byp-resultflow .step-indicator{
  margin:14px 0 20px;
  gap:4px;
}
.checkflow.byp-resultflow .step-indicator .step-seg{
  height:5px;
  background:rgba(255,255,255,.09);
  overflow:hidden;
}
.checkflow.byp-resultflow .step-indicator .step-seg.done{
  background:linear-gradient(90deg,#ff2ec4,#a855ff);
  box-shadow:0 0 10px rgba(255,46,196,.40);
}
.checkflow.byp-resultflow .step-indicator .step-seg.now{
  background:linear-gradient(90deg,#a855ff,#00e5ff);
  box-shadow:0 0 12px rgba(0,229,255,.42);
}
.checkflow.byp-resultflow h1{
  text-align:center;
  font-size:clamp(24px,5vw,38px);
  line-height:1.06;
  letter-spacing:.02em;
  text-shadow:0 0 24px rgba(255,255,255,.05);
  margin:14px auto 8px;
}
.checkflow.byp-resultflow .sub{
  text-align:center;
  color:rgba(255,255,255,.68);
  line-height:1.55;
}
.checkflow.byp-resultflow .flow-card{
  border:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018)),
    rgba(4,5,11,.72);
  box-shadow:0 14px 36px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter:blur(12px);
}
.checkflow.byp-resultflow .flow-card label{
  color:#d9d8e6;
}
.checkflow.byp-resultflow input,
.checkflow.byp-resultflow select{
  background:rgba(3,5,10,.86);
  border-color:rgba(255,255,255,.13);
}
.checkflow.byp-resultflow input:focus,
.checkflow.byp-resultflow select:focus{
  border-color:#00e5ff;
  box-shadow:0 0 0 1px rgba(0,229,255,.25),0 0 20px rgba(0,229,255,.08);
}
.checkflow.byp-resultflow .cbtn.primary{
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(90deg,#ff2ec4 0%,#d632f2 48%,#a855ff 100%);
  color:#fff;
  box-shadow:0 10px 30px rgba(255,46,196,.22),0 0 24px rgba(168,85,255,.13);
}
.checkflow.byp-resultflow .cbtn.primary:not(:disabled):hover,
.checkflow.byp-resultflow .cbtn.primary:not(:disabled):focus-visible{
  transform:translateY(-1px);
  box-shadow:0 13px 34px rgba(255,46,196,.30),0 0 30px rgba(168,85,255,.18);
}
.checkflow.byp-resultflow .cbtn.ghost{
  background:rgba(255,255,255,.025);
  border-color:rgba(255,255,255,.12);
  color:#dddde6;
}

/* GUESS -------------------------------------------------------- */
.checkflow.rf-guess .guess-cat{
  display:grid;
  grid-template-columns:58px minmax(100px,.85fr) minmax(230px,1.6fr);
  gap:14px;
  align-items:center;
  padding:13px 15px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  background:linear-gradient(105deg,rgba(255,46,196,.055),rgba(0,229,255,.025) 55%,rgba(3,4,10,.78));
  box-shadow:0 12px 30px rgba(0,0,0,.18);
}
.checkflow.rf-guess .guess-cat:nth-of-type(3){
  background:linear-gradient(105deg,rgba(0,229,255,.055),rgba(168,85,255,.035),rgba(3,4,10,.78));
}
.checkflow.rf-guess .gc-icon{
  width:48px;
  height:48px;
  object-fit:contain;
  filter:drop-shadow(0 0 10px rgba(255,255,255,.10));
}
.checkflow.rf-guess .gc-info .gc-name{
  font-size:13px;
  letter-spacing:.11em;
}
.checkflow.rf-guess .gc-info .gc-val{
  font-size:12px;
  color:rgba(255,255,255,.44);
}
.checkflow.rf-guess .likert{
  gap:8px;
}
.checkflow.rf-guess .likert button,
.checkflow.rf-guess .harmony-choice button{
  min-height:44px;
  border-radius:999px;
  border-color:rgba(255,255,255,.12);
  background:rgba(255,255,255,.028);
  transition:transform .12s ease,border-color .12s ease,box-shadow .12s ease,background .12s ease;
}
.checkflow.rf-guess .likert button:hover,
.checkflow.rf-guess .harmony-choice button:hover{
  border-color:rgba(255,46,196,.58);
  transform:translateY(-1px);
}
.checkflow.rf-guess .likert button.sel,
.checkflow.rf-guess .harmony-choice button.sel{
  background:linear-gradient(145deg,#ff2ec4,#a855ff);
  border-color:#ff70dd;
  box-shadow:0 0 18px rgba(255,46,196,.28);
}
.checkflow.rf-guess .flow-card{
  margin-top:14px;
}
.checkflow.rf-guess [data-lock]{
  width:min(100%,520px);
  min-height:52px;
  margin-inline:auto;
}

/* READY / TRUTH ------------------------------------------------ */
.checkflow.rf-ready{
  text-align:center;
}
.checkflow.rf-ready .rf-ready-icons{
  width:min(100%,620px);
  margin:26px auto 22px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}
.checkflow.rf-ready .rf-ready-icon{
  padding:16px 8px 13px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:18px;
  background:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.012));
  box-shadow:0 12px 28px rgba(0,0,0,.20);
}
.checkflow.rf-ready .rf-ready-icon img{
  width:62px;
  height:62px;
  object-fit:contain;
  display:block;
  margin:0 auto 8px;
  animation:rfOrbFloat 2.6s ease-in-out infinite;
}
.checkflow.rf-ready .rf-ready-icon:nth-child(2) img{animation-delay:.18s}
.checkflow.rf-ready .rf-ready-icon:nth-child(3) img{animation-delay:.36s}
.checkflow.rf-ready .rf-ready-icon:nth-child(4) img{animation-delay:.54s}
.checkflow.rf-ready .rf-ready-icon span{
  font-size:9px;
  color:rgba(255,255,255,.60);
  letter-spacing:.11em;
  font-weight:800;
}
@keyframes rfOrbFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-5px)}
}
.checkflow.rf-ready [data-see]{
  width:min(100%,440px);
  min-height:56px;
  border-radius:14px;
}

/* UNLOCK / PAY ------------------------------------------------- */
.checkflow.rf-unlock .rf-unlock-icons{
  width:min(100%,560px);
  margin:18px auto 18px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
}
.checkflow.rf-unlock .rf-unlock-icons>div{
  text-align:center;
  padding:10px 6px;
}
.checkflow.rf-unlock .rf-unlock-icons img{
  width:48px;
  height:48px;
  object-fit:contain;
  display:block;
  margin:0 auto 5px;
}
.checkflow.rf-unlock .rf-unlock-icons span{
  font-size:8.5px;
  letter-spacing:.08em;
  color:rgba(255,255,255,.55);
  font-weight:800;
}
.checkflow.rf-unlock .rf-price-card{
  border-color:rgba(255,46,196,.28);
  background:
    radial-gradient(circle at 50% 0,rgba(255,46,196,.10),transparent 48%),
    rgba(5,5,12,.76);
}
.checkflow.rf-unlock .rf-price-card .money{
  font-size:clamp(31px,8vw,52px);
  color:#fff;
  text-shadow:0 0 24px rgba(255,46,196,.24);
}
.checkflow.rf-unlock .rf-pay-card{
  border-color:rgba(0,229,255,.20);
}
.checkflow.rf-unlock .rf-promo-card{
  border-style:dashed;
  border-color:rgba(168,85,255,.32);
}
.checkflow.rf-unlock .byp-pay-offers{
  gap:9px;
}
.checkflow.rf-unlock .byp-pay-offer{
  min-height:64px;
  border-radius:16px;
  border-color:rgba(255,255,255,.11);
  background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.012));
  transition:transform .13s ease,border-color .13s ease,box-shadow .13s ease;
}
.checkflow.rf-unlock .byp-pay-offer:hover{
  transform:translateY(-1px);
  border-color:rgba(255,46,196,.58);
}
.checkflow.rf-unlock .byp-pay-offer.sel{
  border-color:#ff2ec4;
  background:linear-gradient(145deg,rgba(255,46,196,.11),rgba(168,85,255,.05));
  box-shadow:0 0 0 1px rgba(255,46,196,.38) inset,0 0 26px rgba(255,46,196,.10);
}
.checkflow.rf-unlock-transition .bup-t-wrap{
  border:1px solid rgba(255,255,255,.10);
  border-radius:24px;
  background:rgba(5,5,13,.70);
  box-shadow:0 22px 60px rgba(0,0,0,.30);
}
.checkflow.rf-unlock-transition .bup-t-bar{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.08);
}
.checkflow.rf-unlock-transition .bup-t-bar i{
  background:linear-gradient(90deg,#ff2ec4,#a855ff,#00e5ff);
}

/* CONTACT ------------------------------------------------------ */
.checkflow.rf-contact .contact-private-card{
  border-color:rgba(0,229,255,.18);
}
.checkflow.rf-contact .contact-private-toggle{
  background:rgba(0,0,0,.30);
  border-color:rgba(168,85,255,.28);
}

/* VIEW CONTEXT ------------------------------------------------- */
.checkflow.rf-context .view-context-wrap{
  max-width:680px;
}
.checkflow.rf-context .view-context-kicker{
  text-align:center;
  color:#ff2ec4;
  text-shadow:0 0 14px rgba(255,46,196,.32);
}
.checkflow.rf-context .view-context-grid{
  gap:12px;
}
.checkflow.rf-context .view-context-choice{
  min-height:100px;
  display:grid;
  grid-template-columns:74px 1fr 24px;
  align-items:center;
  gap:14px;
  padding:13px 18px;
  border-radius:20px;
  text-align:left;
}
.checkflow.rf-context .view-context-choice::after{
  right:18px;
}
.checkflow.rf-context .view-context-choice .vc-icon{
  width:64px;
  height:64px;
  object-fit:contain;
  filter:drop-shadow(0 0 10px color-mix(in srgb,var(--vc-accent) 26%,transparent));
}
.checkflow.rf-context .view-context-choice .vc-copy{
  display:flex;
  flex-direction:column;
  gap:5px;
  min-width:0;
}
.checkflow.rf-context .view-context-choice .vc-title{
  font-size:14px;
}
.checkflow.rf-context .view-context-choice .vc-sub{
  font-size:11.5px;
  color:rgba(255,255,255,.58);
}

/* REVEAL ------------------------------------------------------- */
.checkflow.rf-reveal .reveal-stage{
  min-height:340px;
  width:min(100%,520px);
  margin:36px auto 0;
  border:1px solid rgba(255,255,255,.09);
  border-radius:28px;
  background:
    radial-gradient(circle at 50% 30%,rgba(255,46,196,.09),transparent 45%),
    linear-gradient(160deg,rgba(255,255,255,.035),rgba(255,255,255,.008));
  box-shadow:0 24px 70px rgba(0,0,0,.32);
}
.checkflow.rf-reveal .r-icon-img{
  width:94px;
  height:94px;
}
.checkflow.rf-reveal .r-score-star{
  width:94px;
  height:94px;
  font-size:54px;
}
.checkflow.rf-reveal .r-name{
  color:rgba(255,255,255,.54);
  letter-spacing:.28em;
}
.checkflow.rf-reveal .r-val{
  font-size:clamp(54px,13vw,82px);
}
.checkflow.rf-reveal .r-val.score{
  font-size:clamp(27px,7vw,38px);
}

/* GUESS VS BYP ------------------------------------------------- */
.checkflow.rf-guessvs .vs-row{
  display:grid;
  grid-template-columns:54px minmax(110px,1fr) minmax(62px,.5fr) 30px minmax(62px,.5fr);
  gap:10px;
  align-items:center;
  min-height:74px;
  border-radius:18px;
  padding:10px 14px;
  border-color:rgba(255,255,255,.09);
  background:linear-gradient(110deg,rgba(255,46,196,.045),rgba(0,229,255,.025),rgba(4,5,11,.76));
}
.checkflow.rf-guessvs .vs-icon{
  width:46px;
  height:46px;
  object-fit:contain;
}
.checkflow.rf-guessvs .vs-which{
  font-size:9.5px;
  letter-spacing:.14em;
}
.checkflow.rf-guessvs .vs-g{
  text-align:center;
  min-width:54px;
  padding:8px 9px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:10px;
  background:rgba(255,255,255,.025);
  color:rgba(255,255,255,.68);
}
.checkflow.rf-guessvs .vs-arrow{
  color:#ff2ec4;
  text-align:center;
  font-size:18px;
}
.checkflow.rf-guessvs .vs-b{
  text-align:center;
  min-width:54px;
  padding:8px 9px;
  border:1px solid rgba(255,46,196,.32);
  border-radius:10px;
  background:rgba(255,46,196,.08);
  color:#ff70dd;
  text-shadow:0 0 14px rgba(255,46,196,.20);
}
.checkflow.rf-guessvs [data-dec]{
  width:min(100%,460px);
  min-height:54px;
}

/* DECISION ----------------------------------------------------- */
.checkflow.rf-decide .decision-hero{
  position:relative;
  width:220px;
  height:220px;
  margin:18px auto 12px;
  display:grid;
  place-items:center;
}
.checkflow.rf-decide .decision-hero::before{
  content:"";
  position:absolute;
  width:138px;
  height:138px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,46,196,.26),rgba(168,85,255,.08) 48%,transparent 72%);
  filter:blur(4px);
}
.checkflow.rf-decide .decision-hero-img{
  width:136px;
  height:136px;
  object-fit:contain;
  z-index:2;
  animation:rfDecisionFloat 2.7s ease-in-out infinite;
}
.checkflow.rf-decide .decision-orbit{
  position:absolute;
  border:1px solid rgba(255,255,255,.08);
  border-radius:50%;
}
.checkflow.rf-decide .orbit-a{width:180px;height:180px;animation:rfOrbit 9s linear infinite}
.checkflow.rf-decide .orbit-b{width:216px;height:216px;border-color:rgba(0,229,255,.08);animation:rfOrbit 13s linear reverse infinite}
@keyframes rfDecisionFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-7px) scale(1.03)}}
@keyframes rfOrbit{to{transform:rotate(360deg)}}
.checkflow.rf-decide .decision-choice-grid{
  display:grid;
  gap:10px;
  width:min(100%,620px);
  margin:0 auto 14px;
}
.checkflow.rf-decide .decision-choice{
  --dc:#ff2ec4;
  width:100%;
  display:grid;
  grid-template-columns:58px 1fr;
  gap:14px;
  align-items:center;
  padding:12px 15px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(110deg,rgba(255,255,255,.045),rgba(255,255,255,.012));
  color:#fff;
  text-align:left;
  cursor:pointer;
  transition:transform .13s ease,border-color .13s ease,box-shadow .13s ease,background .13s ease;
}
.checkflow.rf-decide .decision-choice-go{--dc:#ff2ec4}
.checkflow.rf-decide .decision-choice-wait{--dc:#00e5ff}
.checkflow.rf-decide .decision-choice img{
  width:52px;
  height:52px;
  object-fit:contain;
}
.checkflow.rf-decide .decision-choice-title{
  display:block;
  font-size:15px;
  font-weight:900;
  letter-spacing:.06em;
}
.checkflow.rf-decide .decision-choice-sub{
  display:block;
  margin-top:3px;
  font-size:11.5px;
  color:rgba(255,255,255,.54);
}
.checkflow.rf-decide .decision-choice:hover,
.checkflow.rf-decide .decision-choice.selected{
  transform:translateY(-1px);
  border-color:var(--dc);
  background:linear-gradient(110deg,color-mix(in srgb,var(--dc) 10%,#080811),rgba(255,255,255,.012));
  box-shadow:0 0 0 1px color-mix(in srgb,var(--dc) 22%,transparent) inset,0 0 28px color-mix(in srgb,var(--dc) 12%,transparent);
}
.checkflow.rf-decide [data-lock]{
  width:min(100%,500px);
  min-height:54px;
}

/* DECISION ANIMATION ------------------------------------------- */
.checkflow.rf-decision-anim{
  text-align:center;
}
.checkflow.rf-decision-anim .decision-scene{
  position:relative;
  min-height:330px;
  width:min(100%,520px);
  margin:24px auto 0;
  overflow:visible;
}
.checkflow.rf-decision-anim .decision-aura{
  position:absolute;
  left:50%;
  top:50%;
  width:260px;
  height:260px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,46,196,.24),rgba(168,85,255,.08) 44%,transparent 70%);
  filter:blur(10px);
  animation:rfAura 2.1s ease-in-out infinite;
}
.checkflow.rf-decision-anim .decision-scene-wait .decision-aura{
  background:radial-gradient(circle,rgba(0,229,255,.20),rgba(168,85,255,.06) 45%,transparent 70%);
}
@keyframes rfAura{0%,100%{opacity:.65;transform:translate(-50%,-50%) scale(.92)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.06)}}
.checkflow.rf-decision-anim .decision-anim-icon{
  position:relative;
  z-index:2;
  width:170px;
  height:170px;
  object-fit:contain;
  filter:drop-shadow(0 0 18px rgba(255,46,196,.22));
}
.checkflow.rf-decision-anim .decision-anim-icon.tense{
  animation:rfTense 1s ease-in-out infinite;
}
.checkflow.rf-decision-anim .decision-anim-icon.pop{
  animation:rfPopHit .65s cubic-bezier(.2,.9,.25,1);
}
.checkflow.rf-decision-anim .decision-anim-icon.burst-out{
  opacity:.18;
  transform:scale(.80);
  transition:opacity .35s ease,transform .35s ease;
}
.checkflow.rf-decision-anim .decision-anim-icon.floating{
  animation:rfDecisionFloat 2.5s ease-in-out infinite;
}
.checkflow.rf-decision-anim .decision-pop-ring{
  position:absolute;
  width:150px;
  height:150px;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%) scale(.4);
  border:2px solid rgba(255,46,196,.55);
  border-radius:50%;
  opacity:0;
  animation:rfPopRing 2.5s ease-out infinite;
}
@keyframes rfTense{0%,100%{transform:scale(1)}50%{transform:scale(1.08) rotate(-2deg)}}
@keyframes rfPopHit{0%{transform:scale(1)}45%{transform:scale(1.24)}100%{transform:scale(.82)}}
@keyframes rfPopRing{0%,42%{opacity:0;transform:translate(-50%,-50%) scale(.4)}55%{opacity:.9}75%,100%{opacity:0;transform:translate(-50%,-50%) scale(1.65)}}
.checkflow.rf-decision-anim .decision-label{
  margin-top:-6px;
  font-size:clamp(34px,8vw,58px);
  color:#ff2ec4;
  text-shadow:0 0 30px rgba(255,46,196,.32);
}

/* FINAL RESULT ------------------------------------------------- */
.checkflow.rf-saved .result-completion{
  position:relative;
}
.checkflow.rf-saved .bc-reveal-stage{
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 28px 80px rgba(0,0,0,.50),0 0 40px rgba(168,85,255,.06);
}
.checkflow.rf-saved .bc-card{
  background:
    radial-gradient(circle at 50% -8%,rgba(255,46,196,.18),transparent 30%),
    radial-gradient(circle at 95% 36%,rgba(0,229,255,.12),transparent 28%),
    radial-gradient(circle at 10% 78%,rgba(168,85,255,.14),transparent 32%),
    linear-gradient(160deg,#08030e,#05060c 48%,#031016);
}
.checkflow.rf-saved .bc-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  opacity:.45;
  background-image:radial-gradient(circle,#fff 0 1.3px,transparent 1.6px);
  background-size:86px 86px;
}
.checkflow.rf-saved .bc-inner{
  z-index:3;
}
.checkflow.rf-saved .bc-marker{
  font-size:15px;
  letter-spacing:.30em;
}
.checkflow.rf-saved .bc-people{
  margin-top:20px;
}
.checkflow.rf-saved .bc-person .byp-photo{
  border:2px solid rgba(255,255,255,.30);
  box-shadow:0 0 0 1px rgba(255,46,196,.22),0 0 16px rgba(255,46,196,.16),0 12px 30px rgba(0,0,0,.38)!important;
}
.checkflow.rf-saved .bc-score{
  letter-spacing:.015em;
}
.checkflow.rf-saved .bc-cell{
  background:linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.025));
  border-color:rgba(255,255,255,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
.checkflow.rf-saved .bc-cell-icon{
  width:54px;
  height:54px;
}
.checkflow.rf-saved .bc-decision{
  background:linear-gradient(100deg,rgba(255,46,196,.09),rgba(168,85,255,.05))!important;
  box-shadow:0 0 30px rgba(255,46,196,.06);
}
.checkflow.rf-saved .result-context-switch{
  padding:5px 8px;
  border-radius:999px;
  background:rgba(5,6,12,.56);
  border:1px solid rgba(255,255,255,.07);
}
.checkflow.rf-saved .result-share-toggle{
  background:linear-gradient(90deg,rgba(255,46,196,.04),rgba(0,229,255,.035));
}
.checkflow.rf-saved .md-toggle{
  background:rgba(255,255,255,.025);
}

/* MOBILE ------------------------------------------------------- */
@media(max-width:680px){
  .checkflow.rf-guess .guess-cat{
    grid-template-columns:46px 1fr;
  }
  .checkflow.rf-guess .gc-icon{width:42px;height:42px}
  .checkflow.rf-guess .likert,
  .checkflow.rf-guess .harmony-choice{
    grid-column:1/-1;
  }
  .checkflow.rf-ready .rf-ready-icons,
  .checkflow.rf-unlock .rf-unlock-icons{
    grid-template-columns:repeat(2,1fr);
  }
  .checkflow.rf-context .view-context-choice{
    grid-template-columns:58px 1fr 20px;
    min-height:88px;
    padding:11px 14px;
  }
  .checkflow.rf-context .view-context-choice .vc-icon{width:52px;height:52px}
  .checkflow.rf-guessvs .vs-row{
    grid-template-columns:44px 1fr 54px 22px 54px;
    padding:9px 10px;
  }
  .checkflow.rf-guessvs .vs-icon{width:38px;height:38px}
  .checkflow.rf-decide .decision-hero{width:190px;height:190px}
  .checkflow.rf-decide .decision-hero-img{width:120px;height:120px}
}
@media(max-width:460px){
  .checkflow.rf-ready .rf-ready-icons{
    gap:7px;
  }
  .checkflow.rf-ready .rf-ready-icon img{width:52px;height:52px}
  .checkflow.rf-guessvs .vs-row{
    grid-template-columns:38px 1fr 46px 16px 48px;
    gap:6px;
  }
  .checkflow.rf-guessvs .vs-which{
    font-size:8px;
    letter-spacing:.08em;
  }
  .checkflow.rf-guessvs .vs-g,
  .checkflow.rf-guessvs .vs-b{
    min-width:0;
    padding:7px 5px;
  }
}
@media(prefers-reduced-motion:reduce){
  .checkflow.byp-resultflow *,
  .checkflow.byp-resultflow *::before,
  .checkflow.byp-resultflow *::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
  }
}


/* 2026-09-18 — iPhone result-card stability.
   The saved result is a scaled 1080x1350 composition. iOS Safari can drop or
   stall composited layers when that surface also has several animated filters,
   blurred auras and a will-change transform. Keep the same look, but make the
   mobile saved card paint as a simpler static composition. */
@media(max-width:680px){
  .checkflow.rf-saved .bc-reveal-stage .bc-card{
    will-change:auto!important;
  }
  .checkflow.rf-saved .bc-card::before{
    opacity:.20;
  }
  .checkflow.rf-saved .bc-aura{
    display:none!important;
  }
  .checkflow.rf-saved .bc-spark{
    opacity:.45;
    filter:none!important;
  }
  .checkflow.rf-saved .bc-score,
  .checkflow.rf-saved .bc-decision-icon,
  .checkflow.rf-saved .bc-decision-burst{
    animation:none!important;
  }
  .checkflow.rf-saved .bc-cell-icon,
  .checkflow.rf-saved .bc-person .byp-photo{
    filter:none!important;
  }
  .checkflow.rf-saved .bc-card,
  .checkflow.rf-saved .bc-inner{
    backface-visibility:hidden;
  }
}


/* ============================================================
   PUBLIC FOUNDER BADGES — lookup/search visibility
   ============================================================ */
.byp-public-founder{
  display:inline-flex;align-items:center;gap:10px;
  margin-top:8px;padding:7px 10px;
  border:1px solid rgba(255,46,196,.42);
  border-radius:14px;
  background:linear-gradient(135deg,rgba(255,46,196,.12),rgba(168,85,255,.08),rgba(0,229,255,.07));
  box-shadow:0 0 18px rgba(255,46,196,.08);
  max-width:100%;box-sizing:border-box;
}
.byp-public-founder-art{
  flex:0 0 58px;width:58px;height:58px;
  display:grid;place-items:center;border-radius:14px;
  background:rgba(255,255,255,.035);overflow:hidden;
}
.byp-public-founder-art img{
  width:100%;height:100%;object-fit:contain;display:block;
  filter:drop-shadow(0 0 12px rgba(255,46,196,.28));
}
.byp-public-founder-art.fallback{
  background:linear-gradient(135deg,rgba(255,46,196,.35),rgba(112,71,255,.25),rgba(0,229,255,.2));
}
.byp-public-founder-art.fallback b{font:900 11px/1 Archivo,sans-serif;color:#fff}
.byp-public-founder-copy{
  min-width:0;display:flex;flex-direction:column;gap:3px;text-align:left;
}
.byp-public-founder-copy small{
  color:var(--pink,#ff2ec4);font:900 8px/1 Archivo,sans-serif;letter-spacing:.14em;
}
.byp-public-founder-copy strong{
  color:#fff;font:900 13px/1.15 Archivo,sans-serif;letter-spacing:.035em;
}
.byp-public-founder.compact{
  gap:6px;margin-top:5px;padding:4px 6px;border-radius:10px;
}
.byp-public-founder.compact .byp-public-founder-art{
  flex-basis:34px;width:34px;height:34px;border-radius:8px;
}
.byp-public-founder.compact .byp-public-founder-art.fallback b{font-size:8px}
.byp-public-founder.compact .byp-public-founder-copy small{font-size:6.5px}
.byp-public-founder.compact .byp-public-founder-copy strong{
  font-size:9px;line-height:1.1;white-space:normal;
}
.find-member-row{
  align-items:center!important;
  min-height:60px;
}
[data-code-founder]:not(:empty){margin:8px 0 10px}
[data-code-founder] .byp-public-founder{width:100%}


/* ============================================================
   OWNER CONTROL CENTER — unified Admin organizer
   Keeps the existing Admin cards/endpoints intact and places them beside a
   contextual control assistant. No duplicate permission or feature systems.
   ============================================================ */
.checkflow .byp-occ-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(310px,380px);gap:16px;align-items:start;margin:10px 0 18px}
.checkflow .byp-occ-main{min-width:0}
.checkflow .byp-occ-header{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;padding:16px 17px;border:1px solid rgba(124,233,255,.24);border-radius:16px;background:linear-gradient(135deg,rgba(255,46,196,.08),rgba(0,229,255,.06),#090909);margin-bottom:10px}
.checkflow .byp-occ-header h1{font-size:22px;line-height:1.05;margin:3px 0 5px;letter-spacing:.05em}
.checkflow .byp-occ-header p{margin:0;color:var(--dim);font-size:12px;line-height:1.45}
.checkflow .byp-occ-kicker{font-size:10px;font-weight:900;letter-spacing:.16em;color:var(--softblue,#7ce9ff);text-transform:uppercase}
.checkflow .byp-occ-role{flex:0 0 auto;border:1px solid rgba(255,46,196,.5);border-radius:999px;padding:6px 10px;font-size:10px;font-weight:900;letter-spacing:.12em;color:var(--pink,#ff2ec4);text-transform:uppercase;box-shadow:0 0 16px rgba(255,46,196,.12)}
.checkflow .byp-occ-tabs{display:flex;gap:7px;overflow-x:auto;padding:3px 1px 10px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.checkflow .byp-occ-tabs button{flex:0 0 auto;background:#090909;border:1px solid rgba(255,255,255,.14);border-radius:10px;color:var(--dim);padding:9px 11px;font:inherit;font-size:10px;font-weight:900;letter-spacing:.08em;cursor:pointer;white-space:nowrap}
.checkflow .byp-occ-tabs button:hover,.checkflow .byp-occ-tabs button:focus-visible{border-color:var(--blue,#00e5ff);color:#fff;outline:none}
.checkflow .byp-occ-tabs button.on{border-color:var(--pink,#ff2ec4);color:#fff;background:linear-gradient(135deg,rgba(255,46,196,.16),rgba(0,229,255,.07));box-shadow:0 0 18px rgba(255,46,196,.10)}
.checkflow .byp-occ-page[hidden]{display:none!important}
.checkflow .byp-occ-overview{border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:16px;background:#080809}
.checkflow .byp-occ-overview h2,.checkflow .byp-occ-cap-page h2{margin:4px 0 6px;font-size:19px}
.checkflow .byp-occ-overview>p{margin:0 0 14px;color:var(--dim);font-size:12px;line-height:1.5}
.checkflow .byp-occ-widget-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.checkflow .byp-occ-widget{min-height:128px;text-align:left;display:flex;flex-direction:column;align-items:flex-start;gap:7px;padding:13px;border-radius:14px;border:1px solid rgba(255,255,255,.13);background:linear-gradient(145deg,#0e0e10,#080809);color:#fff;font:inherit;cursor:pointer}
.checkflow .byp-occ-widget:hover,.checkflow .byp-occ-widget:focus-visible{border-color:rgba(0,229,255,.52);outline:none;box-shadow:0 0 20px rgba(0,229,255,.08)}
.checkflow .byp-occ-widget-title{font-size:12px;font-weight:900;letter-spacing:.09em;color:#fff;text-transform:uppercase}
.checkflow .byp-occ-widget-copy{font-size:11px;line-height:1.45;color:var(--dim);flex:1}
.checkflow .byp-occ-widget-state{font-size:9px;font-weight:900;letter-spacing:.1em;color:var(--softblue,#7ce9ff);text-transform:uppercase}
.checkflow .byp-occ-cap-hub,.checkflow .byp-occ-cap-page{border:1px solid rgba(0,229,255,.20);border-radius:14px;padding:13px;background:#09090a;margin-bottom:10px}
.checkflow .byp-occ-cap-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap}
.checkflow .byp-occ-cap-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px}
.checkflow .byp-occ-cap{position:relative;border:1px solid rgba(255,255,255,.13);border-radius:12px;padding:10px 32px 10px 11px;background:#0d0d0f;min-width:0}
.checkflow .byp-occ-cap b{display:block;font-size:11px;letter-spacing:.06em;color:#fff;text-transform:uppercase;word-break:break-word}
.checkflow .byp-occ-cap span{display:block;margin-top:4px;font-size:9px;font-weight:900;letter-spacing:.08em;color:var(--dim2);text-transform:uppercase}
.checkflow .byp-occ-cap.active span{color:var(--blue,#00e5ff)}
.checkflow .byp-occ-cap.custom{border-color:rgba(168,85,255,.38)}
.checkflow .byp-occ-cap.custom span{color:var(--bridge,#a855ff)}
.checkflow .byp-occ-cap small{display:block;margin-top:5px;color:var(--dim);font-size:10px;line-height:1.35}
.checkflow .byp-occ-cap-remove{position:absolute;right:7px;top:7px;border:0;background:none;color:var(--dim2);font-size:18px;cursor:pointer}
.checkflow .byp-occ-cap-remove:hover{color:var(--pink,#ff2ec4)}
.checkflow .byp-occ-honest-note{margin-top:9px;color:var(--dim2);font-size:10px;line-height:1.45}
.checkflow .byp-occ-cap-form{display:grid;gap:8px;margin-top:12px;border-top:1px solid rgba(255,255,255,.10);padding-top:12px}
.checkflow .byp-occ-cap-form[hidden]{display:none!important}
.checkflow .byp-occ-cap-form input,.checkflow .byp-occ-cap-form select{width:100%;box-sizing:border-box;background:#0f0f0f;border:1px solid rgba(255,255,255,.16);border-radius:10px;color:#fff;padding:10px}

/* Owner dashboard live metrics + connection manager */
.checkflow .byp-occ-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0 15px}
.checkflow .byp-occ-metric{border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:10px;background:#0c0c0e;min-width:0}
.checkflow .byp-occ-metric span{display:block;font-size:9px;font-weight:900;letter-spacing:.09em;color:var(--dim2);text-transform:uppercase}
.checkflow .byp-occ-metric b{display:block;margin-top:5px;font-size:20px;line-height:1;color:#fff;word-break:break-word}
.checkflow .byp-occ-metric small{display:block;margin-top:6px;font-size:9px;line-height:1.35;color:var(--softblue,#7ce9ff)}
.checkflow .byp-occ-loading,.checkflow .byp-occ-error{grid-column:1/-1;border:1px dashed rgba(255,255,255,.16);border-radius:10px;padding:12px;color:var(--dim2);font-size:10px;letter-spacing:.06em}
.checkflow .byp-occ-error{border-color:rgba(255,46,196,.34);color:#fff}
.checkflow .byp-occ-analytics-panel{border:1px solid rgba(0,229,255,.22);border-radius:14px;padding:13px;background:#09090a;margin-bottom:10px}
.checkflow .byp-occ-analytics-panel h2{margin:4px 0 0;font-size:18px}
.checkflow .byp-occ-top-pages{margin-top:12px;border-top:1px solid rgba(255,255,255,.10);padding-top:10px}
.checkflow .byp-occ-top-pages>b{display:block;font-size:9px;letter-spacing:.1em;color:var(--dim2);margin-bottom:6px}
.checkflow .byp-occ-top-pages>div{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.07);font-size:10px}
.checkflow .byp-occ-top-pages>div span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#fff}
.checkflow .byp-occ-top-pages>div strong{color:var(--blue,#00e5ff)}
.checkflow .byp-occ-top-pages>div small{color:var(--dim2)}
.checkflow .byp-occ-top-pages p{color:var(--dim2);font-size:10px;line-height:1.4}
.checkflow .byp-occ-connection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px}
.checkflow .byp-occ-connection{border:1px solid rgba(255,255,255,.13);border-radius:12px;padding:11px;background:#0d0d0f;min-width:0}
.checkflow .byp-occ-connection>div:first-child{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.checkflow .byp-occ-connection b{font-size:11px;letter-spacing:.06em;color:#fff;text-transform:uppercase}
.checkflow .byp-occ-connection>div:first-child span{font-size:8px;font-weight:900;letter-spacing:.08em;color:var(--dim2);text-transform:uppercase;text-align:right}
.checkflow .byp-occ-connection.connected{border-color:rgba(0,229,255,.44)}
.checkflow .byp-occ-connection.connected>div:first-child span{color:var(--blue,#00e5ff)}
.checkflow .byp-occ-connection.ready{border-color:rgba(168,85,255,.40)}
.checkflow .byp-occ-connection.ready>div:first-child span{color:var(--bridge,#a855ff)}
.checkflow .byp-occ-connection p{margin:7px 0 0;color:var(--dim);font-size:10px;line-height:1.4}
.checkflow .byp-occ-connection>small{display:block;margin-top:6px;color:var(--dim2);font-size:9px;line-height:1.35;word-break:break-word}
.checkflow .byp-occ-connection-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.checkflow .byp-occ-connection-actions button,.checkflow .byp-occ-connection-actions a{appearance:none;border:1px solid rgba(255,255,255,.17);border-radius:8px;background:#09090a;color:#fff;padding:7px 8px;font:inherit;font-size:8px;font-weight:900;letter-spacing:.06em;text-decoration:none;cursor:pointer}
.checkflow .byp-occ-connection-actions button:hover,.checkflow .byp-occ-connection-actions a:hover{border-color:var(--blue,#00e5ff)}
.checkflow .byp-occ-presets{display:flex;gap:6px;flex-wrap:wrap;padding:9px 10px;border-top:1px solid rgba(255,255,255,.07)}
.checkflow .byp-occ-presets button{border:1px solid rgba(124,233,255,.22);border-radius:999px;background:#0b0b0d;color:#fff;padding:6px 8px;font:inherit;font-size:8px;font-weight:900;letter-spacing:.05em;cursor:pointer}
.checkflow .byp-occ-presets button:hover,.checkflow .byp-occ-presets button:focus-visible{border-color:var(--pink,#ff2ec4);outline:none;background:rgba(255,46,196,.08)}

/* Right-side contextual assistant */
.checkflow .byp-occ-assistant{position:sticky;top:12px;min-width:280px;max-width:460px;height:min(72vh,720px);resize:horizontal;overflow:hidden;border:1px solid rgba(168,85,255,.38);border-radius:16px;background:#070708;box-shadow:0 18px 50px rgba(0,0,0,.34);display:flex;flex-direction:column}
.checkflow .byp-occ-assistant-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 13px;border-bottom:1px solid rgba(255,255,255,.09);background:linear-gradient(90deg,rgba(168,85,255,.12),rgba(0,229,255,.05))}
.checkflow .byp-occ-assistant-head>div>span{display:block;font-size:11px;font-weight:900;letter-spacing:.12em;color:#fff}
.checkflow .byp-occ-assistant-head small{display:block;margin-top:3px;color:var(--dim2);font-size:9px;letter-spacing:.08em;text-transform:uppercase}
.checkflow .byp-occ-assistant-head small b{color:var(--blue,#00e5ff)}
.checkflow .byp-occ-assistant-head button{width:30px;height:30px;border-radius:9px;border:1px solid rgba(255,255,255,.14);background:#0c0c0e;color:#fff;font-size:18px;cursor:pointer}
.checkflow .byp-occ-assistant-body{display:flex;flex-direction:column;min-height:0;flex:1}
.checkflow .byp-occ-chat{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px}
.checkflow .byp-occ-msg{max-width:88%;padding:9px 10px;border-radius:12px;font-size:11px;line-height:1.45;border:1px solid rgba(255,255,255,.11)}
.checkflow .byp-occ-msg.bot{align-self:flex-start;background:rgba(0,229,255,.06);border-color:rgba(0,229,255,.20);color:#eee}
.checkflow .byp-occ-msg.user{align-self:flex-end;background:rgba(255,46,196,.09);border-color:rgba(255,46,196,.24);color:#fff}
.checkflow .byp-occ-chat-form{display:flex;gap:7px;padding:10px;border-top:1px solid rgba(255,255,255,.09)}
.checkflow .byp-occ-chat-form input{flex:1;min-width:0;background:#0f0f0f;border:1px solid rgba(255,255,255,.16);border-radius:10px;color:#fff;padding:10px;font-size:12px}
.checkflow .byp-occ-chat-form button{flex:0 0 auto;border:1px solid var(--pink,#ff2ec4);border-radius:10px;background:rgba(255,46,196,.12);color:#fff;font-size:10px;font-weight:900;letter-spacing:.08em;padding:0 10px;cursor:pointer}
.checkflow .byp-occ-assistant-foot{padding:8px 10px;color:var(--dim2);font-size:9px;line-height:1.35;border-top:1px solid rgba(255,255,255,.07)}
.checkflow .byp-occ-shell.assistant-collapsed{grid-template-columns:minmax(0,1fr) 52px}
.checkflow .byp-occ-shell.assistant-collapsed .byp-occ-assistant{min-width:52px;width:52px;height:auto;resize:none}
.checkflow .byp-occ-shell.assistant-collapsed .byp-occ-assistant-head{padding:8px;justify-content:center}
.checkflow .byp-occ-shell.assistant-collapsed .byp-occ-assistant-head>div,.checkflow .byp-occ-shell.assistant-collapsed .byp-occ-assistant-body{display:none}
.checkflow .byp-occ-shell.assistant-collapsed [data-occ-assist-toggle]{transform:rotate(180deg)}

/* Existing Access Team surface, restyled — same backend/endpoints. */
.checkflow .byp-access-list{display:grid;gap:7px}
.checkflow .byp-access-person{border:1px solid rgba(255,255,255,.13);border-radius:11px;padding:9px;background:#0d0d0e}
.checkflow .byp-access-person-top{display:flex;justify-content:space-between;gap:8px;align-items:center;flex-wrap:wrap}
.checkflow .byp-access-actions{display:flex;gap:5px;flex-wrap:wrap}
.checkflow .byp-access-role{display:inline-flex;align-items:center;border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:3px 7px;font-size:9px;font-weight:900;letter-spacing:.08em;color:#fff;vertical-align:middle}
.checkflow .byp-access-role.owner{border-color:rgba(255,255,255,.55);box-shadow:0 0 12px rgba(255,255,255,.10)}
.checkflow .byp-access-role.coowner{border-color:rgba(255,46,196,.55);color:var(--pink,#ff2ec4);box-shadow:0 0 12px rgba(255,46,196,.12)}
.checkflow .byp-access-role.admin{border-color:rgba(0,229,255,.48);color:var(--blue,#00e5ff)}
.checkflow .byp-access-level-editor{display:grid;gap:5px;margin:10px 0}
.checkflow .byp-access-level-editor select{width:100%;background:#0f0f0f;border:1px solid rgba(255,255,255,.16);border-radius:10px;color:#fff;padding:9px}

@media (max-width:980px){
  .checkflow .byp-occ-shell{grid-template-columns:1fr}
  .checkflow .byp-occ-assistant{position:relative;top:auto;width:100%;max-width:none;min-width:0;height:360px;resize:none}
  .checkflow .byp-occ-shell.assistant-collapsed{grid-template-columns:1fr}
  .checkflow .byp-occ-shell.assistant-collapsed .byp-occ-assistant{width:100%;min-width:0}
  .checkflow .byp-occ-shell.assistant-collapsed .byp-occ-assistant-head{justify-content:space-between}
  .checkflow .byp-occ-shell.assistant-collapsed .byp-occ-assistant-head>div{display:block}
}
@media (max-width:620px){
  .checkflow .byp-occ-header{padding:13px}
  .checkflow .byp-occ-header h1{font-size:18px}
  .checkflow .byp-occ-widget-grid,.checkflow .byp-occ-cap-grid,.checkflow .byp-occ-connection-grid{grid-template-columns:1fr}
  .checkflow .byp-occ-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .checkflow .byp-occ-top-pages>div{grid-template-columns:minmax(0,1fr) auto}
  .checkflow .byp-occ-widget{min-height:106px}
  .checkflow .byp-occ-assistant{height:330px}
}


/* BYP Life networking preview on selected Match people. Informational only. */
.match-life-offer-preview{margin-top:9px;width:100%;border:1px solid rgba(168,85,255,.34);border-radius:11px;padding:8px 9px;background:linear-gradient(145deg,rgba(168,85,255,.09),rgba(0,229,255,.04));display:grid;gap:3px;text-align:left}
.match-life-offer-preview>span{font:900 8px/1 Archivo,sans-serif;letter-spacing:.14em;color:#00e5ff}.match-life-offer-preview>b{font:800 10px/1.2 Archivo,sans-serif;color:#fff}.match-life-offer-preview>small{font-size:9px;color:rgba(255,255,255,.52)}.match-life-offer-preview>button{justify-self:start;margin-top:3px;border:0;background:none;padding:0;color:#ff8fd8;font:900 8px/1 Archivo,sans-serif;letter-spacing:.11em;cursor:pointer}
