/* FRAG WATCH "C" page language for tool pages (2026-11): kicker, giant 2-line headline, right-side visual, stats band. */
.cx-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:24px;align-items:center;min-height:500px;padding-top:28px;padding-bottom:36px}
.cx-hero::before{content:'';position:absolute;right:-220px;top:-160px;width:860px;height:860px;background:radial-gradient(circle,rgba(255,106,31,.26),transparent 60%);pointer-events:none}
.cx-copy{position:relative;min-width:0}
.cx-k{display:inline-flex;align-items:center;gap:8px;font:800 11px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#FF9A57}
.cx-k svg{flex:none}
.fw-h1.cx-h1{position:relative;margin:18px 0 0;font-size:clamp(44px,6vw,80px);font-weight:900;letter-spacing:-.06em;line-height:.93}
.fw-h1.cx-h1 span{display:block;margin-top:6px;font-size:.7em;letter-spacing:-.05em;color:var(--accent)}
.cx-lede{position:relative;margin:22px 0 0;max-width:520px;font-size:18px;line-height:1.5;color:var(--muted)}
.cx-copy .fw-search,.cx-copy .cp-form{margin-top:28px;max-width:580px}
.cx-copy .fw-search{padding:8px 8px 8px 18px;border-radius:16px;background:#101116;border:1.5px solid rgba(255,106,31,.55);box-shadow:0 0 0 6px rgba(255,106,31,.07)}
.cx-copy .fw-search input{font-size:17px}
.cx-copy .cp-form{padding:10px;border-radius:18px;background:#101116;border:1.5px solid rgba(255,106,31,.55);box-shadow:0 0 0 6px rgba(255,106,31,.07)}
.cx-acts{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:26px}

/* visual */
.cx-vis{position:relative;height:440px;min-width:0}
.cx-ret{position:absolute;right:4%;top:6px;width:400px;height:400px;color:rgba(255,106,31,.5);pointer-events:none}
.cx-ret svg{width:100%;height:100%}
.cx-card{position:absolute;left:6%;top:96px;width:340px;padding:18px;border-radius:20px;background:linear-gradient(180deg,#17181e,#111216);border:1px solid rgba(255,255,255,.1);box-shadow:0 40px 90px rgba(0,0,0,.6),0 0 70px rgba(255,106,31,.1);transform:rotate(-3deg)}
.cx-card__h{display:flex;justify-content:space-between;align-items:center;gap:10px;font:800 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.cx-card__h b{color:#FF9A57}
.cx-row{display:grid;grid-template-columns:92px 1fr;align-items:center;gap:12px;margin-top:13px;font-size:13px;font-weight:700;color:var(--ink-2)}
.cx-bar{position:relative;height:8px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden}
.cx-bar i{position:absolute;left:0;top:0;bottom:0;border-radius:inherit;background:linear-gradient(90deg,#FF5A0A,#FF9A57)}
.cx-bar--two i:last-child{background:#7CD992;height:3px;top:auto}
.cx-float{position:absolute;z-index:4;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;background:rgba(14,15,19,.92);border:1px solid rgba(255,106,31,.5);box-shadow:0 20px 50px rgba(0,0,0,.6);font-weight:800;font-size:14px;white-space:nowrap;backdrop-filter:blur(8px)}
.cx-float b{color:#FF9A57}.cx-float span{color:var(--muted);font-weight:700}
.cx-float svg{flex:none;color:#FF9A57}
.cx-ic{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:rgba(255,106,31,.14);color:#FF9A57}
.cx-f1{right:0;top:14px}.cx-f2{left:0;top:372px}.cx-f3{right:4%;top:330px}

/* band */
.cx-band{display:flex;justify-content:center;flex-wrap:wrap;gap:12px 44px;padding:22px 16px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font:800 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.cx-band>span{display:inline-flex;align-items:baseline;gap:7px}
.cx-band b{color:#fff;font:900 16px Inter,system-ui,sans-serif;letter-spacing:0}
.cx-band+main,.cx-band+.cx-after{padding-top:34px}

/* search results present: compact hero */
html.cx-searched .cx-hero{min-height:0;grid-template-columns:1fr;padding-bottom:20px}
html.cx-searched .cx-vis,html.cx-searched .cx-band,html.cx-searched .cx-lede{display:none}
html.cx-searched .fw-h1.cx-h1{font-size:clamp(34px,4.4vw,52px)}

/* compact header-only variant (admin) */
.cx-hero--slim{display:block;min-height:0;padding-bottom:18px}
.cx-hero--slim::before{width:600px;height:600px;top:-260px}

@media (max-width:1000px){
  .cx-hero{grid-template-columns:1fr;min-height:0}
  .cx-vis{height:400px;max-width:520px;width:100%;margin:0 auto}
  .cx-ret{width:340px;height:340px;right:0}
}
@media (max-width:560px){
  .cx-hero{padding-top:12px}
  .cx-lede{font-size:16px}
  .cx-vis{display:none}
  .cx-card{left:0;width:min(300px,86%);top:62px;padding:15px}
  .cx-ret{width:260px;height:260px;top:0}
  .cx-row{grid-template-columns:80px 1fr;font-size:12px;margin-top:10px}
  .cx-f1{top:0;right:0}.cx-f2{top:282px;left:auto;right:0}.cx-f3{display:none}
  .cx-float{font-size:13px;padding:10px 12px}
  .cx-band{gap:12px 22px;font-size:10px}
  .cx-band b{font-size:14px}
}

/* daily rounds visual */
.cx-rounds{width:320px}
.cx-round{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:12px;margin-top:12px;padding:12px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid var(--line-2,rgba(255,255,255,.08));color:var(--muted);font-weight:700;font-size:14px}
.cx-round b{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:rgba(255,255,255,.05);color:#fff;font:900 17px Inter,system-ui,sans-serif}
.cx-round.is-on{border-color:rgba(255,106,31,.5);background:rgba(255,106,31,.08);color:#fff}
.cx-round.is-on b{background:linear-gradient(180deg,#FF7A33,#FF5A0A);color:#120A05}
.cx-round.is-on svg{color:#FF9A57}
.cx-copy .dc-chips{position:relative;margin-top:26px}

/* pro lobbies */
.cx-acts.pl-refresh{justify-content:flex-start}
.pl-cxband .fw-live-dot{margin-right:6px}
.pl-cxband #pl-stamp{color:#fff;font:800 12px var(--mono);letter-spacing:.08em}

/* admin */
.fw-h1.cx-h1--slim{font-size:clamp(40px,5vw,64px)}
.cx-hero--slim .fw-topline{position:relative;align-items:flex-end}
#ad-refresh svg{margin-right:6px;vertical-align:-2px}

/* account sign up / sign in */
#ac-hero-top{display:none!important}
.ac-auth:not([hidden]){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,520px);gap:48px;align-items:center;padding-top:30px;position:relative}
.ac-auth .ac-card{max-width:none}
.ac-cx{position:relative;min-width:0}
.ac-auth:not([hidden]){overflow-x:clip}
.ac-cx::before{content:'';position:absolute;left:-200px;top:-220px;width:760px;height:760px;background:radial-gradient(circle,rgba(255,106,31,.2),transparent 60%);pointer-events:none;z-index:-1}
.ac-cx-list{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
.ac-cx-list li{display:flex;align-items:center;gap:12px;font-size:15.5px;font-weight:600;color:var(--ink-2)}
@media (max-width:900px){.ac-auth:not([hidden]){grid-template-columns:1fr;gap:28px;padding-top:8px}}
.ac-auth .ac-side{display:none!important}
.ac-cx-note{margin:22px 0 0;max-width:420px;font-size:12.5px;color:var(--muted)}

/* ---- per-page visuals (v2) ---- */
.cx-vis{height:480px}
.cx-ph{position:absolute;border-radius:22px;overflow:hidden;border:1px solid rgba(255,255,255,.1);box-shadow:0 30px 70px rgba(0,0,0,.6);background:#15161b}
.cx-ph img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
.cx-ph__lab{position:absolute;left:0;right:0;bottom:0;padding:34px 14px 12px;background:linear-gradient(transparent,rgba(0,0,0,.88));display:flex;justify-content:space-between;align-items:flex-end;gap:8px}
.cx-ph__lab b{font-size:17px;font-weight:900;color:#fff}.cx-ph__lab small{font:800 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#FF9A57}
/* lobbies */
.cx-vis--photos .cx-ph{width:220px;height:290px}
.cx-vis--photos .cx-ph--1{left:4%;top:40px;transform:rotate(-6deg)}
.cx-vis--photos .cx-ph--2{left:30%;top:0;transform:rotate(1deg);z-index:2;width:240px;height:320px}
.cx-vis--photos .cx-ph--3{left:57%;top:60px;transform:rotate(6deg)}
.cx-vis--photos .cx-f1{right:auto;left:16%;top:360px}.cx-vis--photos .cx-f2{left:auto;right:4%;top:400px}
.cx-live .fw-live-dot{margin:0}
/* twin */
.cx-deck{position:absolute;left:50%;top:10px;width:270px;height:360px;transform:translateX(-50%)}
.cx-deck .cx-ph{inset:0}
.cx-deck__b{transform:rotate(-12deg) translate(-40px,14px);filter:brightness(.45) blur(1px)}
.cx-deck__c{transform:rotate(10deg) translate(40px,14px);filter:brightness(.45) blur(1px)}
.cx-deck__a{z-index:2;border-color:rgba(255,106,31,.6);box-shadow:0 40px 90px rgba(0,0,0,.7),0 0 60px rgba(255,106,31,.25)}
.cx-deck__a img{filter:blur(14px) brightness(.55) saturate(.6);transform:scale(1.15)}
.cx-qm{position:absolute;inset:0;display:grid;place-items:center;font:900 150px Inter,system-ui,sans-serif;color:#FF7A33;text-shadow:0 0 40px rgba(255,106,31,.6);letter-spacing:-.05em}
.cx-vis--twin .cx-f1{top:300px;right:0}.cx-vis--twin .cx-f2{top:400px;left:2%}
/* dna */
.cx-hex{position:absolute;left:50%;top:10px;width:460px;max-width:100%;transform:translateX(-50%);overflow:visible}
.cx-hex__grid{fill:none;stroke:rgba(255,255,255,.1);stroke-width:1}
.cx-hex__grid polygon:first-child{stroke:rgba(255,106,31,.45)}
.cx-hex__shape{fill:url(#cxg);stroke:#FF7A33;stroke-width:2.5;filter:drop-shadow(0 0 18px rgba(255,106,31,.45))}
.cx-hex__dots{fill:#fff;stroke:#FF5A0A;stroke-width:2}
.cx-hex__lab{fill:#d8d3cc;font:700 13px Inter,system-ui,sans-serif}
.cx-vis--dna .cx-f1{top:0;right:0}.cx-vis--dna .cx-f2{top:420px;left:6%}
/* compare */
.cx-vs{position:absolute;right:0;top:-30px;font:900 220px/1 Inter,system-ui,sans-serif;letter-spacing:-.08em;color:transparent;-webkit-text-stroke:2px rgba(255,106,31,.45);pointer-events:none}
.cx-tug{position:absolute;left:4%;right:4%;top:110px;padding:20px 22px;border-radius:20px;background:linear-gradient(180deg,#17181e,#111216);border:1px solid rgba(255,255,255,.1);box-shadow:0 40px 90px rgba(0,0,0,.6)}
.cx-tug__h{display:flex;justify-content:space-between;align-items:center;font:800 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.cx-tug__h b{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;font:900 14px Inter,system-ui,sans-serif;color:#120A05;background:#FF7A33}
.cx-tug__h b:last-child{background:#7CD992}
.cx-tug__r{position:relative;display:flex;align-items:center;height:30px;margin-top:10px;border-radius:9px;background:rgba(255,255,255,.04);overflow:hidden}
.cx-tug__l{height:100%;background:linear-gradient(90deg,rgba(255,90,10,.15),rgba(255,122,51,.75))}
.cx-tug__rr{height:100%;background:linear-gradient(90deg,rgba(124,217,146,.6),rgba(124,217,146,.12))}
.cx-tug__r em{position:absolute;left:50%;transform:translateX(-50%);font:800 12px Inter,system-ui,sans-serif;font-style:normal;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.8)}
.cx-vis--cmp .cx-f2{top:430px;left:auto;right:6%}
/* squad podium */
.cx-podium{position:absolute;left:50%;bottom:40px;display:flex;align-items:flex-end;gap:12px;transform:translateX(-50%)}
.cx-pod{display:flex;flex-direction:column;align-items:center;gap:12px;width:130px}
.cx-pod__av{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:#1a1b21;border:2px solid rgba(255,255,255,.14);color:var(--muted)}
.cx-pod--1 .cx-pod__av{width:84px;height:84px;border-color:#FF7A33;color:#FF9A57;box-shadow:0 0 40px rgba(255,106,31,.4)}
.cx-pod__b{width:100%;display:grid;place-items:start center;padding-top:14px;border-radius:16px 16px 4px 4px;background:linear-gradient(180deg,#1d1e25,#121318);border:1px solid rgba(255,255,255,.1);border-bottom:0}
.cx-pod__b b{font:900 44px Inter,system-ui,sans-serif;letter-spacing:-.04em;color:rgba(255,255,255,.75)}
.cx-pod--1 .cx-pod__b{height:220px;background:linear-gradient(180deg,rgba(255,106,31,.35),#15161b 80%);border-color:rgba(255,106,31,.55)}
.cx-pod--1 .cx-pod__b b{color:#fff;font-size:60px}
.cx-pod--2 .cx-pod__b{height:150px}.cx-pod--3 .cx-pod__b{height:105px}
.cx-crown{position:absolute;left:50%;top:-58px;transform:translateX(-50%);color:#FF9A57}
.cx-vis--pod .cx-f1{top:20px;right:0}.cx-vis--pod .cx-f2{top:40px;left:0}
/* daily quiz */
.cx-quiz{position:absolute;left:8%;right:4%;top:60px;padding:22px;border-radius:22px;background:linear-gradient(180deg,#17181e,#111216);border:1px solid rgba(255,106,31,.35);box-shadow:0 40px 90px rgba(0,0,0,.6),0 0 70px rgba(255,106,31,.12);transform:rotate(-2deg)}
.cx-quiz__h{display:flex;justify-content:space-between;font:800 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}.cx-quiz__h b{color:#FF9A57}
.cx-quiz__bar{height:4px;margin-top:12px;border-radius:9px;background:rgba(255,255,255,.08)}.cx-quiz__bar i{display:block;width:33%;height:100%;border-radius:inherit;background:#FF7A33}
.cx-quiz__q{margin:18px 0 6px;font-size:26px;font-weight:900;letter-spacing:-.03em}
.cx-quiz__o{display:flex;align-items:center;gap:12px;margin-top:10px;padding:10px;border-radius:12px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.08)}
.cx-quiz__o b{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:rgba(255,255,255,.07);font-size:13px}
.cx-quiz__o i{flex:1;height:9px;max-width:60%;border-radius:9px;background:rgba(255,255,255,.1)}
.cx-quiz__o.is-on{border-color:rgba(255,106,31,.6);background:rgba(255,106,31,.1)}.cx-quiz__o.is-on b{background:#FF7A33;color:#120A05}
.cx-vis--quiz .cx-f1{top:10px;right:0}.cx-vis--quiz .cx-f2{top:430px;left:0}
@media (max-width:1000px){.cx-vis{height:470px}}
