:root{--of-bg:#07111f;--of-panel:#0d1b2d;--of-panel-2:#12243a;--of-line:#213b59;--of-text:#f7fbff;--of-muted:#9cb0c9;--of-accent:#5d8dff;--of-accent-2:#6fe7b3;--of-warn:#ffd166;--of-danger:#ff7a96;--of-shadow:0 18px 55px rgba(0,0,0,.18)}
html[data-theme="light"]{--of-bg:#edf4fb;--of-panel:#fff;--of-panel-2:#f5f9fd;--of-line:#c9d7e6;--of-text:#102033;--of-muted:#617287;--of-shadow:0 18px 55px rgba(31,56,88,.10)}
body{background:radial-gradient(circle at 86% -10%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 32%),var(--bg);overflow-x:hidden}
.side{background:linear-gradient(180deg,color-mix(in srgb,var(--side) 93%,#122844),var(--side));box-shadow:12px 0 45px rgba(0,0,0,.08)}
.brand{display:flex;align-items:center;gap:11px;font-size:18px;letter-spacing:-.02em}.brand::before{content:"OF";display:grid;place-items:center;width:38px;height:38px;border-radius:13px;background:linear-gradient(145deg,var(--accent),#7ea4ff 60%,var(--green));color:white;font-size:12px;box-shadow:0 10px 26px color-mix(in srgb,var(--accent) 38%,transparent)}.brand small{font-size:11px;margin-top:2px}
.nav{display:flex;align-items:center;gap:10px;min-height:43px;transition:.16s ease;overflow-wrap:anywhere}.nav .of-icon{width:18px;height:18px;opacity:.92;flex:0 0 auto}.nav.active{box-shadow:inset 3px 0 0 var(--accent)}
.top{backdrop-filter:blur(18px);background:color-mix(in srgb,var(--side) 84%,transparent)}.search{min-height:44px;background:color-mix(in srgb,var(--panel2) 92%,transparent);min-width:0}.content{padding-top:26px;min-width:0}.hero{padding:8px 2px 4px}.hero small,.eyebrow{display:inline-flex;gap:6px;align-items:center;color:var(--accent);font-weight:850;letter-spacing:.08em;font-size:11px}.hero h1{letter-spacing:-.045em;line-height:1.04;margin-top:9px}.hero p{font-size:16px;color:var(--muted);max-width:780px}
.metric,.card,.prospect,.cap{box-shadow:var(--of-shadow);background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 97%,white 3%),var(--panel));transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease;min-width:0}.card:hover,.prospect:hover,.cap:hover{border-color:color-mix(in srgb,var(--accent) 58%,var(--line));box-shadow:0 22px 60px rgba(0,0,0,.20)}.prospect:hover{transform:translateY(-2px)}
.metric{position:relative;overflow:hidden;min-height:112px}.metric::after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:-35px;top:-35px;background:color-mix(in srgb,var(--accent) 10%,transparent)}.metric b{font-size:29px;letter-spacing:-.04em}.metric span{font-size:12px;font-weight:700}
.btn,.flowstep{transition:.16s ease}.btn.primary{background:linear-gradient(135deg,var(--accent),#719dff);color:white;border-color:transparent;box-shadow:0 9px 24px color-mix(in srgb,var(--accent) 28%,transparent)}.btn.ghost{background:transparent}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.btn .of-icon,.flowstep .of-icon{width:16px;height:16px;vertical-align:-3px;margin-right:6px}.flow{grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}.flowstep{min-height:62px;display:flex;flex-direction:column;gap:6px;align-items:center;justify-content:center}.flowstep .of-icon{width:19px;height:19px;margin:0;color:var(--accent)}
.badge{font-weight:850;letter-spacing:.025em}.badge.good{background:color-mix(in srgb,var(--green) 10%,transparent)}.badge.warn{background:color-mix(in srgb,var(--amber) 9%,transparent)}.badge.block{background:color-mix(in srgb,var(--red) 9%,transparent)}
.card> b:first-child,.cardhead b{font-size:13px;letter-spacing:.01em}.row{min-height:48px}.row-button{width:100%;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer}.row-button:hover{background:color-mix(in srgb,var(--accent) 6%,transparent)}.empty{border:1px dashed color-mix(in srgb,var(--line) 80%,transparent);border-radius:12px;margin-top:10px;background:color-mix(in srgb,var(--panel2) 54%,transparent)}
.of-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}.of-section-head p{margin:5px 0 0;color:var(--muted);max-width:760px}.of-section-title{display:flex;align-items:center;gap:12px}.of-section-icon{width:44px;height:44px;border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));border-radius:14px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 10%,var(--panel));color:var(--accent)}.of-section-icon svg{width:22px;height:22px}.of-section-title h1{margin:0;letter-spacing:-.035em}
.of-provider-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0}.of-provider-card{border:1px solid var(--line);border-radius:14px;padding:13px;background:var(--panel);box-shadow:var(--of-shadow);min-width:0}.of-provider-card strong{display:block;margin:8px 0 2px}.of-provider-card small{color:var(--muted)}.of-provider-card .of-icon{width:22px;height:22px;color:var(--accent)}
.of-friendly-summary{padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--panel2);margin:10px 0 12px}.of-friendly-summary h3{margin:0 0 6px;font-size:15px}.of-friendly-summary p{margin:4px 0;color:var(--muted)}.of-advanced-toggle{margin-top:9px}.drawer pre.of-technical-hidden{display:none}.drawer pre{font-size:12px;line-height:1.55}.drawer h2{letter-spacing:-.03em}.drawer{box-shadow:-20px 0 60px rgba(0,0,0,.28)}
.of-status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;background:currentColor}.status{font-weight:800;white-space:nowrap}.of-help{display:flex;align-items:flex-start;gap:10px;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));background:color-mix(in srgb,var(--accent) 7%,var(--panel));border-radius:13px;padding:12px 14px;margin:10px 0 16px;color:var(--muted)}.of-help .of-icon{width:18px;height:18px;color:var(--accent);flex:0 0 auto;margin-top:2px}.of-help b{color:var(--text)}
.winner-actions{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.winner-path-head{margin-top:24px}.winner-path{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:14px 0}.path-step{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"num stage" "num title" "num meta";gap:2px 10px;text-align:left;border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:13px;padding:13px;cursor:pointer;min-width:0}.path-step>span{grid-area:num;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:color-mix(in srgb,var(--accent) 16%,var(--panel));font-weight:900}.path-step>b{grid-area:stage;font-size:10px;color:var(--accent);letter-spacing:.08em}.path-step>strong{grid-area:title;overflow-wrap:anywhere}.path-step>small{grid-area:meta;color:var(--muted)}.path-step.ready{border-color:color-mix(in srgb,var(--amber) 65%,var(--line))}.path-step.complete{border-color:color-mix(in srgb,var(--green) 65%,var(--line))}.path-step.blocked{opacity:.72}.of-warning{padding:11px 13px;border:1px solid color-mix(in srgb,var(--amber) 55%,var(--line));background:color-mix(in srgb,var(--amber) 8%,var(--panel));border-radius:12px;margin:8px 0;color:var(--muted)}
.analytics-metric{--analytics-tone:var(--accent);border-color:color-mix(in srgb,var(--analytics-tone) 55%,var(--line));background:linear-gradient(145deg,color-mix(in srgb,var(--analytics-tone) 12%,var(--panel)),var(--panel))}.analytics-metric::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--analytics-tone)}.analytics-metric::after{background:color-mix(in srgb,var(--analytics-tone) 14%,transparent)}.analytics-tone-1{--analytics-tone:#5d8dff}.analytics-tone-2{--analytics-tone:#38d9c5}.analytics-tone-3{--analytics-tone:#b779ff}.analytics-tone-4{--analytics-tone:#ffb84d}
.analytics-funnel{position:relative;align-items:stretch}.analytics-stage{--stage-tone:#5d8dff;position:relative;display:grid;place-items:center;min-height:74px!important;border-color:color-mix(in srgb,var(--stage-tone) 54%,var(--line))!important;background:linear-gradient(160deg,color-mix(in srgb,var(--stage-tone) 14%,var(--panel)),var(--panel))!important;font-weight:850;text-align:center;overflow:hidden}.analytics-stage::after{content:"";position:absolute;left:10%;right:10%;bottom:8px;height:3px;border-radius:999px;background:linear-gradient(90deg,transparent,var(--stage-tone),transparent);opacity:.8}.analytics-stage[data-analytics-stage="queued"]{--stage-tone:#7b8cff}.analytics-stage[data-analytics-stage="attempted"]{--stage-tone:#5d8dff}.analytics-stage[data-analytics-stage="delivered"]{--stage-tone:#38c7ff}.analytics-stage[data-analytics-stage="engaged"]{--stage-tone:#38d9c5}.analytics-stage[data-analytics-stage="qualified"]{--stage-tone:#b779ff}.analytics-stage[data-analytics-stage="paid"]{--stage-tone:#56e39f}
.radar-path{display:flex;align-items:stretch;gap:8px;overflow-x:auto;padding:14px 2px 8px;scrollbar-width:thin}.rr-stage{--rr-tone:#64748b;min-width:150px;display:grid;gap:8px;align-content:start;padding:14px;border:1px solid color-mix(in srgb,var(--rr-tone) 60%,var(--line));border-radius:14px;background:linear-gradient(160deg,color-mix(in srgb,var(--rr-tone) 12%,var(--panel)),var(--panel));box-shadow:0 12px 30px color-mix(in srgb,var(--rr-tone) 12%,transparent);position:relative}.rr-stage::before{content:"";position:absolute;left:12px;right:12px;top:0;height:3px;border-radius:999px;background:var(--rr-tone)}.rr-stage strong{font-size:12px;letter-spacing:.025em}.rr-stage small{color:var(--muted)}.rr-stage[data-truth="ATTRIBUTED"]{box-shadow:0 0 0 1px color-mix(in srgb,var(--rr-tone) 35%,transparent),0 14px 36px color-mix(in srgb,var(--rr-tone) 18%,transparent)}.rr-stage[data-truth="UNKNOWN"]{opacity:.65;filter:saturate(.55)}.rr-website{--rr-tone:#5d8dff}.rr-traffic{--rr-tone:#38c7ff}.rr-lead{--rr-tone:#38d9c5}.rr-conversation{--rr-tone:#2ed47a}.rr-booking{--rr-tone:#ffd166}.rr-sale{--rr-tone:#ff9f43}.rr-gross-profit{--rr-tone:#b779ff}.rr-repeat-purchase{--rr-tone:#ff6fb5}.rr-link{display:grid;place-items:center;color:var(--muted);font-size:20px;min-width:20px}.radar-path .rr-stage[data-truth="ATTRIBUTED"]::after{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:var(--rr-tone);right:-13px;top:50%;transform:translateY(-50%);box-shadow:0 0 16px var(--rr-tone);animation:rrPulse 1.8s ease-in-out infinite}@keyframes rrPulse{0%,100%{opacity:.35;transform:translateY(-50%) scale(.75)}50%{opacity:1;transform:translateY(-50%) scale(1.15)}}
#radarBusiness{margin:12px 0}#radarBusiness .field{max-width:520px}#radarBusiness select{width:100%;margin-top:7px}
@media(max-width:1050px){.of-provider-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.winner-path{grid-template-columns:repeat(2,minmax(0,1fr))}.top{grid-template-columns:auto minmax(0,1fr) auto}.top .status{display:none}}
@media(max-width:900px){.of-section-head{display:block}.of-section-title{margin-bottom:8px}.flow{grid-template-columns:repeat(2,minmax(0,1fr))}.of-provider-strip,.winner-path{grid-template-columns:1fr}.hero h1{font-size:34px}.metric{min-height:96px}.drawer{width:100vw}.top{padding:10px 12px}.content{padding-left:12px;padding-right:12px}.analytics-funnel{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.metrics,.grid,.two,.prospectGrid,.capgrid{grid-template-columns:1fr!important}.actions{align-items:stretch}.actions .btn{flex:1 1 100%}.search{width:100%}.analytics-funnel{grid-template-columns:1fr}.rr-stage{min-width:132px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}