:root{ --page-w:1480px; /* The top strip's height, in one place: the bar itself, the in-flow spacer that reserves it, and overlays that must start clear of it. */ --topbar-h:44px; color-scheme:dark; --bg:#0b0b0d;--bg2:#111114;--bg3:#16161a;--bg4:#1c1c21; --acc:#ffd400;--acc2:#e6bf00; /* The accent as FOREGROUND text. #ffd400 on a light surface is 1.4:1 -- invisible -- so every `color:var(--acc-text)` was unreadable the moment somebody switched the theme. Backgrounds and borders keep the bright brand yellow; only text uses this. */ --acc-text:#ffd400; --red:#ff4d4f;--red2:#d9363e; --green:#3ddc84;--green2:#25b866; --yellow:#ffd400; --blue:#4aa8ff;--purple:#b98bff;--orange:#ff8c1a; --sev-critical:var(--red);--sev-high:var(--orange);--sev-medium:var(--yellow); --sev-low:var(--green);--sev-info:var(--blue);--sev-unknown:#8a93c2; --muted:#c7c7cf;--text:#f6f6f8;--white:#ffffff; --border:#26262c;--border2:#33333b; /* Panel/surface aliases. The monitored-target panel and several cards were written against --card/--cell/--edge/--edge2, which were never defined, so background:var(--card) resolved to nothing and the panel rendered see-through over the page behind it. */ --card:#141419;--cell:#1a1a20;--edge:#2c2c34;--edge2:#3a3a44; /* Inter is the UI face for the whole product: very high legibility at small sizes, even colour, and the density this many tables need. `--fm` is the workhorse token (861 call sites), so pointing it at Inter converts the interface in one place instead of editing every rule. Monospace is no longer what --fm means: everything that genuinely needs it -- code, CVE and IOC identifiers, credential blobs -- was repointed to --ft, which stays a real mono stack. */ --fm:'Fira Sans',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif; --fo:'Fira Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif; --fb:'Fira Sans',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif; --fu:'Fira Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif; --glow-acc:0 0 18px rgba(255,212,0,.28); --glow-red:0 0 18px rgba(255,77,79,.25); --glow-green:0 0 14px rgba(61,220,132,.2); --card-grad:linear-gradient(155deg,rgba(28,28,33,.95),rgba(17,17,20,.97)); --shadow-3d:0 10px 30px rgba(0,0,0,.5),0 2px 6px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.04); --scanline:transparent; } :root[data-theme="light"]{ /* NOTE: this block is declared without !important, and a second light block further down (search "White Smoke") repeats every token WITH it, because a forced-dark `:root{...!important}` block sits between them. That second block is what the browser actually uses. Both are kept identical on purpose; edit one and you must edit the other. The light layer, as the code workspace already draws it. The surfaces there are a warm neutral and the lines are the same family, which is why that page reads as one material; the platform's own light set put a warm-white ground under cool blue-grey borders and muted text, and two grey families in one view is what made it look assembled rather than designed. These are the workspace's values, so the two match. The accent follows it down to a gold that can carry ink at 8:1 and still sit beside body copy without shouting. Yellow is still never used as text on the light ground - copy that must read as yellow uses --acc-text, which is darker again. */ --acc-text:#7a5a00; /* dark gold, 5.6:1 on white */ color-scheme:light; --bg:#f7f7f5;--bg2:#ffffff;--bg3:#f2f2ee;--bg4:#e9e9e4; --acc:#c9a400;--acc2:#b89400; /* gold fills, 8:1 under ink */ --acc-ink:#18160a; /* ink ON the gold fill */ --wash-rgb:201,164,0; /* every tint follows the accent */ --red:#c42b2b;--red2:#a32222; --green:#147135;--green2:#105c2b; --yellow:#8c6000; /* dark gold for yellow *text* */ /* The workspace carries its status hues on tinted chips; here the same tokens are also plain text, and on the deeper surfaces (--bg3, --bg4) its values land between 3.9 and 4.5:1. These are the same hues taken down far enough to clear 4.5:1 on every surface in the set, checked rather than eyeballed. */ --blue:#1f5fbf;--purple:#5b4b9e;--orange:#a44f00; --dove:#6e6e6e;--sage:#7c9166; --muted:#55555e;--text:#18181b;--white:#18181b; --border:#e3e3dd;--border2:#d3d3cb; --card:#ffffff;--cell:#f2f2ee;--edge:#e3e3dd;--edge2:#d3d3cb; --glow-acc:0 0 0 3px rgba(201,164,0,.32); --glow-red:0 0 0 3px rgba(196,43,43,.16); --glow-green:0 0 0 3px rgba(20,113,53,.16); --card-grad:#ffffff; --shadow-3d:0 4px 14px rgba(24,24,27,.07),0 1px 3px rgba(24,24,27,.05); --scanline:transparent; --sev-critical:var(--red);--sev-high:var(--orange);--sev-medium:var(--yellow); --sev-low:var(--green);--sev-info:var(--blue);--sev-unknown:#55555e; } /* The surfaces the browser draws, which belong to the theme as much as the ones we draw. Selected text was white on a pale yellow wash here - the one combination on the page that could not be read at all - and the scrollbar thumb was the accent, which made every scrollable panel in the product wear a gold stripe. Both follow the workspace now. */ :root[data-theme="light"] ::selection{ background:rgba(201,164,0,.34);color:var(--text)} :root[data-theme="light"] *{scrollbar-color:var(--border2) transparent} :root[data-theme="light"] ::-webkit-scrollbar-track{background:transparent} :root[data-theme="light"] ::-webkit-scrollbar-thumb{ background:var(--border2);border:2px solid var(--bg);background-clip:content-box} /* Everything black on light - except inside a terminal window (.tm), which stays dark on both themes and colours its own text. :where() adds no specificity, so this rule weighs exactly what it did before everywhere else. */ :root[data-theme="light"] body, :root[data-theme="light"] body *:where(:not(.tm, .tm *)){ color:var(--text)} :root[data-theme="light"] body{ background:var(--bg);color:var(--text);font-weight:500} :root[data-theme="light"] *{text-shadow:none !important} :root[data-theme="light"] [style*="color:#fff"], :root[data-theme="light"] [style*="color:#ffffff"], :root[data-theme="light"] [style*="color:#f4f4ff"], :root[data-theme="light"] [style*="color:#e0e0f8"], :root[data-theme="light"] [style*="color:#d0d0ee"], :root[data-theme="light"] [style*="color:#c0c0e0"], :root[data-theme="light"] [style*="color:#e0e0"], :root[data-theme="light"] [style*="color:#eee"], :root[data-theme="light"] [style*="color:var(--muted)"]{color:var(--text) !important} /* …but not inside a terminal window, which keeps its dark palette. */ :root[data-theme="light"] .tm [style*="color:var(--muted)"]{color:#a9b2c0 !important} :root[data-theme="light"] [style*="color:#f0c000"], :root[data-theme="light"] [style*="color:#ffd700"], :root[data-theme="light"] [style*="color:#fbbc04"], :root[data-theme="light"] [style*="color:#ffb"], :root[data-theme="light"] [style*="color:#ffa"], :root[data-theme="light"] [style*="color:#ff8c00"], :root[data-theme="light"] [style*="color:#ffe"], :root[data-theme="light"] [style*="color:gold"], :root[data-theme="light"] [style*="color:yellow"]{color:#243e63 !important} :root[data-theme="light"] [style*="background:#f0c000"], :root[data-theme="light"] [style*="rgba(240,192,0"], :root[data-theme="light"] [style*="rgba(255,215,0"]{background:rgba(36,62,99,.10) !important} :root[data-theme="light"] [style*="background:rgba(0,0,0"], :root[data-theme="light"] [style*="background:#0a0d18"], :root[data-theme="light"] [style*="background:#0a0a"], :root[data-theme="light"] [style*="background:#08081"]{background:var(--bg3) !important} :root[data-theme="light"] .d3card-l{color:var(--text);} :root[data-theme="light"] .d3card-s{color:#1a1a1a;} :root[data-theme="light"] .d3card-v{color:var(--text);} :root[data-theme="light"] .d3card-mini{color:var(--text);} :root[data-theme="light"] td:where(:not(.tm *)),:root[data-theme="light"] th:where(:not(.tm *)){color:var(--text)} :root[data-theme="light"] .stat-num{color:var(--text)} :root[data-theme="light"] .stat-label{color:#1a1a1a;} :root[data-theme="light"] .panel-title{color:var(--text);} :root[data-theme="light"] .target-name{color:var(--text);} :root[data-theme="light"] h1{color:var(--text)} :root[data-theme="light"] h2{color:var(--text)} :root[data-theme="light"] h3{color:var(--text)} :root[data-theme="light"] h4{color:var(--text)} :root[data-theme="light"] p:where(:not(.tm *)),:root[data-theme="light"] span:where(:not(.tm *)), :root[data-theme="light"] div:where(:not(.tm *)),:root[data-theme="light"] li:where(:not(.tm *)), :root[data-theme="light"] label:where(:not(.tm *)),:root[data-theme="light"] a:where(:not(.tm *)){color:var(--text)}/* tiny mono labels bumped to readable size, black */ :root[data-theme="light"] [style*="font-size:12px"], :root[data-theme="light"] [style*="font-size:13px"]{color:var(--text) !important} :root[data-theme="light"] .d3card, :root[data-theme="light"] .panel, :root[data-theme="light"] .target-card, :root[data-theme="light"] .fcard, :root[data-theme="light"] .vi-card, :root[data-theme="light"] .modal-box{ background:var(--bg2) !important;border:1.5px solid var(--border2) !important;border-radius:12px; box-shadow:0 2px 10px rgba(15,23,42,.07) !important; transform:none !important} :root[data-theme="light"] .d3card::before{display:none} :root[data-theme="light"] .d3card:hover{ transform:translateY(-3px) !important;border-color:#243e63 !important; box-shadow:0 10px 24px rgba(36,62,99,.16) !important} :root[data-theme="light"] nav{ background:var(--bg2);border-bottom:2px solid var(--border2);box-shadow:0 1px 8px rgba(15,23,42,.06)} :root[data-theme="light"] .sb{ /* Only the shadow changes: the tint and the blur come from --sb-glass / --sb-blur, which the light :root block already sets. Re-declaring an opaque gradient here would undo the glass. */ box-shadow:2px 0 22px -12px rgba(15,23,42,.18)} :root[data-theme="light"] .sb-top{ background:linear-gradient(180deg,rgba(var(--wash-rgb, 255,212,0), .10),transparent)} /* Legacy raster wordmarks still need the invert trick. Brand SVGs ship dark/light variants and must not be inverted. */ :root[data-theme="light"] .lp-brand-img:not(.dark):not(.light), :root[data-theme="light"] .poc-brand-img, :root[data-theme="light"] .auth-brand-img:not(.dark):not(.light), :root[data-theme="light"] .login-logo-img{ filter:invert(1) hue-rotate(180deg) drop-shadow(0 0 8px rgba(184,134,11,.22))} :root[data-theme="light"] .sb-foot{ background:linear-gradient(0deg,rgba(var(--wash-rgb, 255,212,0), .08),transparent)} :root[data-theme="light"] .sb-tmenu{box-shadow:0 14px 34px -12px rgba(15,23,42,.25)} :root[data-theme="light"] .mt-del{color:#6b7280} :root[data-theme="light"] .mt-del:hover{color:#a4123a;background:rgba(200,30,60,.12); border-color:rgba(200,30,60,.38)} :root[data-theme="light"] .mt-btn-danger{background:rgba(200,30,60,.10); color:#a4123a;border-color:rgba(200,30,60,.38)} :root[data-theme="light"] .mt-btn-danger:hover{background:rgba(200,30,60,.18);color:#8d0f31} :root[data-theme="light"] .sb-item:hover{background:rgba(var(--wash-rgb, 255,212,0), .14)} :root[data-theme="light"] .sb-item.on{background:rgba(var(--wash-rgb, 255,212,0), .22);color:#141414} :root[data-theme="light"] .sb-item.on .sb-ic{color:#7a5a00} /* ── nav additions: trail state, badges, tooltip, menus, crumbs ────────── */ :root[data-theme="light"] .sb-item.trail{color:#6b5300;opacity:1} :root[data-theme="light"] .sb-item.trail::before{background:#b8860b} :root[data-theme="light"] .sb-sub a.on{color:#6b5300;background:rgba(var(--wash-rgb, 255,212,0), .16)} :root[data-theme="light"] .sb-badge.b-crit{background:rgba(200,30,60,.12); color:#a4123a;border-color:rgba(200,30,60,.38)} :root[data-theme="light"] .sb-badge.b-over{background:rgba(180,110,0,.14); color:#8a5300;border-color:rgba(180,110,0,.40)} :root[data-theme="light"] .sb-badge.b-fail{background:rgba(200,30,60,.10); color:#a4123a;border-color:rgba(200,30,60,.32)} :root[data-theme="light"] .sb-tip{background:var(--bg3);border-color:#b8860b;color:var(--text); box-shadow:0 8px 24px -8px rgba(15,23,42,.30)} :root[data-theme="light"] .sb-menu,:root[data-theme="light"] .sb-pop{ background:var(--bg2);box-shadow:0 -14px 38px -12px rgba(15,23,42,.28)} :root[data-theme="light"] .sb-menu a,:root[data-theme="light"] .sb-menu button{color:#1f2937} :root[data-theme="light"] .sb-menu a:hover,:root[data-theme="light"] .sb-menu button:hover{ background:rgba(var(--wash-rgb, 255,212,0), .18);color:#141414} :root[data-theme="light"] .sb-menu .danger:hover{background:rgba(200,30,60,.10);color:#a4123a} :root[data-theme="light"] .sb-acct-btn:hover{background:rgba(var(--wash-rgb, 255,212,0), .14)} :root[data-theme="light"] .sb-status-btn{color:#4b5563} :root[data-theme="light"] .sb-status-btn:hover{color:#6b5300;border-color:#b8860b; background:rgba(var(--wash-rgb, 255,212,0), .12)} :root[data-theme="light"] .sb-rail-btn:hover{color:#6b5300;border-color:#b8860b; background:rgba(var(--wash-rgb, 255,212,0), .12)} :root[data-theme="light"] .sb-caret:hover{color:#6b5300;background:rgba(var(--wash-rgb, 255,212,0), .16)} :root[data-theme="light"] .logo{color:#1b2a41;font-weight:800} :root[data-theme="light"] .logo span{color:#243e63} :root[data-theme="light"] nav a{color:#334155;font-weight:700;} :root[data-theme="light"] nav a:hover,:root[data-theme="light"] nav a.active{color:#243e63} :root[data-theme="light"] .nav-user{color:#475569;font-weight:700} :root[data-theme="light"] input:where(:not(.tm *)),:root[data-theme="light"] select:where(:not(.tm *)),:root[data-theme="light"] textarea:where(:not(.tm *)){background:var(--bg3) !important;color:var(--text) !important;border:1.5px solid var(--border2) !important; font-weight:600} :root[data-theme="light"] input::placeholder{color:#94a3b8 !important} :root[data-theme="light"] input:focus,:root[data-theme="light"] select:focus{ border-color:#243e63 !important;outline:none} :root[data-theme="light"] table:where(:not(.tm *)){color:#1b2a41} :root[data-theme="light"] th:where(:not(.tm *)){background:var(--bg3) !important;color:#243e63 !important; border-bottom:2px solid var(--border2) !important;letter-spacing:.04em} :root[data-theme="light"] td:where(:not(.tm *)){border-color:#e7eaf2 !important;color:#1e293b !important} :root[data-theme="light"] tr:hover td{background:var(--bg3) !important} :root[data-theme="light"] pre:where(:not(.tm *)),:root[data-theme="light"] code:where(:not(.tm *)){background:var(--bg3);color:#1b2a41} :root[data-theme="light"] .vi-bg{background:var(--bg3) !important} :root[data-theme="light"] #vi-stats{color:var(--text) !important;font-weight:700} :root[data-theme="light"] .vi-filters input, :root[data-theme="light"] .vi-filters select{background:var(--bg3) !important;color:var(--text) !important;border:1.5px solid var(--border2) !important; font-weight:600} :root[data-theme="light"] .vi-filters input::placeholder{color:#94a3b8 !important} :root[data-theme="light"] .vi-row{ border-bottom:1.5px solid var(--border) !important;background:var(--bg2)} :root[data-theme="light"] .vi-row:hover{background:var(--bg) !important} :root[data-theme="light"] .vi-cve-id{color:#1d4ed8 !important;font-weight:800} :root[data-theme="light"] .vi-cve-id:hover{color:#243e63 !important} :root[data-theme="light"] .vi-desc{color:#1b2a41 !important;font-weight:600;line-height:1.6} :root[data-theme="light"] .vi-date{color:#334155 !important;font-weight:700} :root[data-theme="light"] .vi-prod{color:#7c3aed !important;font-weight:700} :root[data-theme="light"] .vi-empty{color:#1a1a1a !important;font-weight:700} :root[data-theme="light"] .vi-sev, :root[data-theme="light"] .vi-cvss{font-weight:800 !important;padding:4px 11px !important} :root[data-theme="light"] .vi-sev.CRITICAL,:root[data-theme="light"] .vi-cvss.crit{ background:#dc2626 !important;color:#ffffff !important;border:none !important} :root[data-theme="light"] .vi-sev.HIGH,:root[data-theme="light"] .vi-cvss.high{ background:#ea580c !important;color:#ffffff !important;border:none !important} :root[data-theme="light"] .vi-sev.MEDIUM,:root[data-theme="light"] .vi-cvss.med{ background:#b45309 !important;color:#ffffff !important;border:none !important} :root[data-theme="light"] .vi-sev.LOW,:root[data-theme="light"] .vi-cvss.low{ background:#64748b !important;color:#ffffff !important;border:none !important} :root[data-theme="light"] .vi-kev{background:#b91c1c !important;color:#ffffff !important;font-weight:800} :root[data-theme="light"] .vi-source-tag{font-weight:800 !important;padding:3px 9px !important;border:none !important} :root[data-theme="light"] .vi-source-tag.kev{background:#dc2626 !important;color:#fff !important} :root[data-theme="light"] .vi-source-tag.nvd{background:#1d4ed8 !important;color:#fff !important} :root[data-theme="light"] .vi-source-tag.ghsa{background:#7c3aed !important;color:#fff !important} :root[data-theme="light"] .vi-source-tag.circl{background:#15803d !important;color:#fff !important} :root[data-theme="light"] .vi-source-tag.cveorg{background:#c2410c !important;color:#fff !important} :root[data-theme="light"] .vi-source-tag.splunk{background:#b45309 !important;color:#fff !important} :root[data-theme="light"] .vi-modal-body{background:var(--bg2) !important;color:var(--text) !important} :root[data-theme="light"] .vi-modal-body *{color:#1b2a41} :root[data-theme="light"] .dash-poc-box, :root[data-theme="light"] .vi-poc-box, :root[data-theme="light"] [class*="poc-box"]{background:var(--bg3) !important;border-left:3px solid #7c3aed !important; color:#1b2a41 !important} :root[data-theme="light"] .dash-poc-box *, :root[data-theme="light"] .vi-poc-box *{color:#1b2a41 !important} :root[data-theme="light"] .dash-poc-box a, :root[data-theme="light"] .vi-poc-box a{color:#1d4ed8 !important;font-weight:700} :root[data-theme="light"] .cve-row{ background:var(--bg2) !important;border-left:3px solid #dc2626 !important; border:1px solid var(--border);border-left:3px solid #dc2626 !important; box-shadow:0 1px 4px rgba(15,23,42,.06)} :root[data-theme="light"] .cve-id{color:#dc2626 !important;font-weight:800} :root[data-theme="light"] .cve-meta{color:#1a1a1a !important;font-weight:600} :root[data-theme="light"] .cve-sum{color:#1b2a41 !important} :root[data-theme="light"] .cve-row *{color:#1b2a41} :root[data-theme="light"] .vi-chart-card{ background:var(--bg2) !important;border:1.5px solid var(--border2) !important;border-radius:12px; box-shadow:0 2px 10px rgba(15,23,42,.07) !important} :root[data-theme="light"] .vi-chart-title{color:#1b2a41 !important;font-weight:800} :root[data-theme="light"] .vi-bignum{ background:var(--bg3) !important;border-left:4px solid #243e63 !important;border-radius:10px; box-shadow:0 2px 8px rgba(15,23,42,.06) !important;transform:none !important} :root[data-theme="light"] .vi-bignum:hover{ transform:translateY(-2px) !important;box-shadow:0 8px 18px rgba(36,62,99,.14) !important} :root[data-theme="light"] .vi-bignum-l{color:#1a1a1a !important;font-weight:800} :root[data-theme="light"] .sev-bar-label{color:var(--text) !important;font-weight:800;width:100px} :root[data-theme="light"] .sev-bar-track{ background:#e7eaf2 !important;border:1px solid var(--border2) !important;height:16px} :root[data-theme="light"] .sev-bar-val{color:var(--text) !important;font-weight:800} :root[data-theme="light"] .vi-bignum-v[style*="#00e5ff"], :root[data-theme="light"] .vi-bignum-v[style*="#00ffc8"]{color:#0a6ed1 !important} :root[data-theme="light"] .vi-bignum-v[style*="#ff3b3b"]{color:#dc2626 !important} :root[data-theme="light"] .vi-bignum-v[style*="#ff8c00"]{color:#c2410c !important} :root[data-theme="light"] .vi-bignum-v[style*="#ffd700"], :root[data-theme="light"] .vi-bignum-v[style*="#aa00ff"]{color:#7c3aed !important} :root[data-theme="light"] .auth-wrap{background:transparent !important} :root[data-theme="light"] .auth-box{ background:rgba(255,255,255,.97) !important;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1.5px solid var(--border2) !important;border-radius:16px; box-shadow:0 12px 40px rgba(20,23,26,.10) !important;padding:46px 42px} :root[data-theme="light"] .auth-logo{color:var(--text) !important;font-weight:800} :root[data-theme="light"] .auth-sub{color:var(--muted) !important;font-weight:500;letter-spacing:normal} :root[data-theme="light"] .auth-line{background:var(--acc) !important} :root[data-theme="light"] .field label{color:var(--text) !important;font-weight:800} :root[data-theme="light"] .auth-box input[type=text], :root[data-theme="light"] .auth-box input[type=password], :root[data-theme="light"] .auth-box input[type=email], :root[data-theme="light"] .field input{background:var(--bg3) !important;border:1.5px solid var(--border2) !important;color:var(--text) !important; font-weight:600;border-radius:8px;padding:12px 14px} :root[data-theme="light"] .field input:focus{border-color:var(--acc) !important} :root[data-theme="light"] .btn-red, :root[data-theme="light"] .btn-full{background:#243e63 !important;color:#ffffff !important;border:none !important; font-weight:800 !important;border-radius:8px; box-shadow:0 4px 14px rgba(36,62,99,.3) !important} :root[data-theme="light"] .btn-red:hover, :root[data-theme="light"] .btn-full:hover{background:#3730a3 !important} :root[data-theme="light"] .auth-box a{color:var(--acc-text) !important;font-weight:800} :root[data-theme="light"] .auth-footer a{color:var(--acc-text) !important;font-weight:600} :root[data-theme="light"] .auth-footer a.auth-home{color:var(--muted) !important;font-weight:500} :root[data-theme="light"] .alert-err{ background:#fee2e2 !important;color:#b91c1c !important;border:1.5px solid #fca5a5 !important; font-weight:700} :root[data-theme="light"] .target-card{ background:var(--bg2) !important;border:1.5px solid var(--border2) !important;border-radius:10px; box-shadow:0 2px 8px rgba(15,23,42,.06)} :root[data-theme="light"] .target-card:hover{border-color:#243e63 !important} :root[data-theme="light"] .target-header{background:var(--bg) !important;border-radius:10px 10px 0 0} :root[data-theme="light"] .target-domain{color:var(--text) !important;font-weight:800} :root[data-theme="light"] .target-header:hover .target-domain{color:#243e63 !important} :root[data-theme="light"] .target-scanned{color:#1a1a1a !important;font-weight:700} :root[data-theme="light"] .target-chevron{color:#243e63 !important} :root[data-theme="light"] .target-body{border-top:1.5px solid var(--border) !important} :root[data-theme="light"] .panel{ background:var(--bg2) !important;border:1.5px solid var(--border2) !important;border-radius:10px; box-shadow:0 2px 8px rgba(15,23,42,.05)} :root[data-theme="light"] .panel-head{ background:var(--bg3) !important;border-bottom:1.5px solid var(--border2) !important} :root[data-theme="light"] .panel-label{font-weight:800 !important;color:#1b2a41} :root[data-theme="light"] .panel-body{color:var(--text)} :root[data-theme="light"] .stat-pill{ background:var(--bg) !important;border:1.5px solid var(--border2) !important} :root[data-theme="light"] .stat-pill .sv{color:var(--text);font-weight:800} :root[data-theme="light"] .stat-pill .sl{color:#1a1a1a !important;font-weight:700} :root[data-theme="light"] .tgt-row{background:var(--bg2) !important;border-bottom:1px solid var(--border) !important} :root[data-theme="light"] .tgt-row:hover{background:var(--bg) !important} :root[data-theme="light"] .tgt-domain{color:var(--text) !important;font-weight:700} :root[data-theme="light"] .target-body [style*="background:rgba(0,0,0"], :root[data-theme="light"] .target-body [style*="background:#0"], :root[data-theme="light"] .panel-body [style*="background:rgba(0,0,0"], :root[data-theme="light"] .panel-body [style*="background:#0"]{ background:var(--bg3) !important;border-color:var(--border2) !important} :root[data-theme="light"] .panel-label[style*="color:var(--acc-text)"], :root[data-theme="light"] .panel-label[style*="color:#00e5ff"]{color:#0a6ed1 !important} :root[data-theme="light"] .panel-label[style*="color:var(--green)"], :root[data-theme="light"] .panel-label[style*="color:#00ff88"]{color:#15803d !important} :root[data-theme="light"] [style*="color:#00e5ff"]{color:#0a6ed1 !important} :root[data-theme="light"] [style*="color:#00ff88"]{color:#15803d !important} :root[data-theme="light"] [style*="color:#00b8cc"]{color:#0a6ed1 !important} :root[data-theme="light"] [style*="color:#cc66ff"], :root[data-theme="light"] [style*="color:#a855f7"]{color:#7c3aed !important} :root[data-theme="light"] [style*="color:#5dffff"]{color:#0a6ed1 !important} :root[data-theme="light"] [style*="color:#38bdf8"]{color:#1d4ed8 !important} :root[data-theme="light"] .sub-card{ background:var(--bg2) !important;border:1.5px solid var(--border2) !important; border-left:4px solid #243e63 !important;border-radius:10px; box-shadow:0 2px 8px rgba(15,23,42,.06) !important; transform:none !important} :root[data-theme="light"] .sub-card:hover{ transform:translateY(-2px) !important;border-left-color:#243e63 !important; box-shadow:0 8px 20px rgba(36,62,99,.14) !important} :root[data-theme="light"] .sub-host{color:var(--text) !important;font-weight:800} :root[data-theme="light"] .hdr-row{border-bottom:1px solid var(--border) !important} :root[data-theme="light"] .hdr-name{color:var(--text) !important;font-weight:700} :root[data-theme="light"] .hdr-val{color:#1a1a1a !important} :root[data-theme="light"] .hdr-ok{color:#15803d !important} :root[data-theme="light"] .hdr-bad{color:#dc2626 !important} :root[data-theme="light"] .hdr-warn{color:#b45309 !important} :root[data-theme="light"] .sub-host span[style*="background"]{ color:#ffffff !important} :root[data-theme="light"] .sub-host span[style*="rgba(0,255"], :root[data-theme="light"] .sub-host span[style*="#00ff88"]{background:#15803d !important;border-color:#15803d !important} :root[data-theme="light"] .sub-host span[style*="rgba(0,229"], :root[data-theme="light"] .sub-host span[style*="#00e5ff"]{background:#0a6ed1 !important;border-color:#0a6ed1 !important} :root[data-theme="light"] [style*="linear-gradient(135deg,rgba(10,10,26"], :root[data-theme="light"] [style*="linear-gradient(135deg,rgba(10,10,2"], :root[data-theme="light"] [style*="linear-gradient(150deg,rgba(20,20,40"], :root[data-theme="light"] [style*="linear-gradient(150deg,rgba(18,18,34"], :root[data-theme="light"] [style*="linear-gradient(145deg,rgba(20,20,40"], :root[data-theme="light"] [style*="rgba(10,10,26"], :root[data-theme="light"] [style*="rgba(20,20,40"], :root[data-theme="light"] [style*="rgba(26,10,42"], :root[data-theme="light"] [style*="rgba(10,13,24"], :root[data-theme="light"] [style*="background:#0a0a1a"], :root[data-theme="light"] [style*="background:#0a0a1e"], :root[data-theme="light"] [style*="background:#070712"], :root[data-theme="light"] [style*="background:#04040e"], :root[data-theme="light"] [style*="background:#010108"]{ background:var(--bg2) !important;border-color:var(--border2) !important} :root[data-theme="light"] .fc3d, :root[data-theme="light"] .fpanel, :root[data-theme="light"] .stat-card, :root[data-theme="light"] .card, :root[data-theme="light"] .metric-card, :root[data-theme="light"] .info-card, :root[data-theme="light"] .report-card, :root[data-theme="light"] .vi-bignum, :root[data-theme="light"] .vi-chart-card, :root[data-theme="light"] .sub-card, :root[data-theme="light"] .d3card, :root[data-theme="light"] .panel{ background:var(--bg2) !important; border:1.5px solid var(--border2) !important;border-radius:12px; box-shadow:0 2px 10px rgba(15,23,42,.07) !important; transform:none !important} :root[data-theme="light"] .fpanel{background:var(--bg2) !important} :root[data-theme="light"] .fc3d:hover, :root[data-theme="light"] .d3card:hover, :root[data-theme="light"] .sub-card:hover, :root[data-theme="light"] .vi-bignum:hover{ transform:translateY(-3px) !important;border-color:#243e63 !important; box-shadow:0 10px 24px rgba(36,62,99,.15) !important} :root[data-theme="light"] .fc3d .v{color:#1b2a41 !important} :root[data-theme="light"] .fc3d .l{color:#1a1a1a !important;font-weight:700} :root[data-theme="light"] .fpage{background:var(--bg3)} :root[data-theme="light"] .fhead{color:#1b2a41 !important;font-weight:800} :root[data-theme="light"] .fsub{color:#1a1a1a !important} :root[data-theme="light"] .integ-group{background:transparent} :root[data-theme="light"] .integ-card{ background:var(--bg2) !important;border:1.5px solid var(--border2) !important;border-radius:10px; box-shadow:0 2px 8px rgba(15,23,42,.06)} :root[data-theme="light"] .integ-card .ic-name{color:#1b2a41 !important;font-weight:800} :root[data-theme="light"] .fform-row label{color:#1a1a1a !important;font-weight:700} :root[data-theme="light"] .fform-row input, :root[data-theme="light"] .fform-row select{background:var(--bg3) !important;border:1.5px solid var(--border2) !important;color:var(--text) !important; font-weight:600} :root[data-theme="light"] .fform-row input:focus{border-color:#243e63 !important} :root[data-theme="light"] .fbtn{ border:1.5px solid var(--acc) !important;color:#141410 !important;background:var(--bg2) !important;font-weight:800} :root[data-theme="light"] .fbtn:hover{background:var(--acc) !important;color:var(--on-acc,#141410) !important} :root[data-theme="light"] .fbtn.green{border-color:#15803d !important;color:#15803d !important} :root[data-theme="light"] .fbtn.red{border-color:#dc2626 !important;color:#dc2626 !important} :root[data-theme="light"] .fpanel h3{color:#243e63 !important;font-weight:800} :root[data-theme="light"] [style*="color:#00e5ff"], :root[data-theme="light"] [style*="color:#00b8cc"], :root[data-theme="light"] [style*="color:#5dffff"], :root[data-theme="light"] [style*="color:#8af"], :root[data-theme="light"] [style*="color:#00ffc8"]{color:#0a6ed1 !important} :root[data-theme="light"] [style*="color:#00ff88"], :root[data-theme="light"] [style*="color:#00cc66"]{color:#15803d !important} :root[data-theme="light"] [style*="color:#cc66ff"], :root[data-theme="light"] [style*="color:#a855f7"], :root[data-theme="light"] [style*="color:#9b6bff"], :root[data-theme="light"] [style*="color:#aa00ff"]{color:#7c3aed !important} :root[data-theme="light"] [style*="color:#ff3b3b"], :root[data-theme="light"] [style*="color:#ff2244"]{color:#dc2626 !important} :root[data-theme="light"] [style*="color:#ff8c00"], :root[data-theme="light"] [style*="color:#ff6b00"]{color:#c2410c !important} :root[data-theme="light"] [style*="color:#38bdf8"]{color:#1d4ed8 !important} :root[data-theme="light"] tbody tr{background:var(--bg2)} :root[data-theme="light"] tbody tr:nth-child(even){background:var(--bg3)} :root[data-theme="light"] [style*="color:#243e63"], :root[data-theme="light"] [style*="color:#3730a3"], :root[data-theme="light"] [style*="color:#4f46e5"], :root[data-theme="light"] [style*="color:#6366f1"]{color:#141414 !important} :root[data-theme="light"] [style*="background:#243e63"], :root[data-theme="light"] [style*="background:#3730a3"], :root[data-theme="light"] [style*="rgba(67,56,202"]{background:rgba(var(--wash-rgb, 255,212,0), .16) !important} :root[data-theme="light"] nav{ background:var(--bg2);border-bottom:2px solid var(--border);box-shadow:0 1px 8px rgba(20,20,20,.05)} :root[data-theme="light"] .logo{color:#141414 !important;font-weight:800;text-shadow:none !important} :root[data-theme="light"] .logo span{color:#141414 !important} :root[data-theme="light"] nav a{color:#3a3a3a !important;font-weight:700} :root[data-theme="light"] nav a:hover{color:#141414 !important;background:rgba(var(--wash-rgb, 255,212,0), .14) !important;border-color:rgba(255,212,0,.5) !important} :root[data-theme="light"] .navlinks a.active{color:#141414 !important; background:rgba(var(--wash-rgb, 255,212,0), .22) !important; box-shadow:inset 0 -2px 0 var(--acc) !important;border-color:rgba(255,212,0,.55) !important;text-shadow:none !important} :root[data-theme="light"] .nav-user{color:#4b5563 !important} :root[data-theme="light"] .nav-user::before, :root[data-theme="light"] .nav-user::after{color:#b8860b !important} :root[data-theme="light"] input:focus, :root[data-theme="light"] select:focus, :root[data-theme="light"] textarea:focus{border-color:var(--acc) !important;box-shadow:0 0 0 3px rgba(255,212,0,.30) !important;outline:none} :root[data-theme="light"] th{background:var(--bg3) !important;color:#141414 !important; border-bottom:2px solid var(--border) !important} :root[data-theme="light"] tr:hover td{background:var(--bg3) !important} :root[data-theme="light"] .btn-red, :root[data-theme="light"] .btn-full, :root[data-theme="light"] .fbtn.green, :root[data-theme="light"] .pf-btn, :root[data-theme="light"] .qcta, :root[data-theme="light"] .lock-btn, :root[data-theme="light"] .ex-upg, :root[data-theme="light"] .um-btn:not(.danger){ background:var(--acc) !important;color:var(--on-acc,#141410) !important;border:none !important; font-weight:800 !important;box-shadow:0 4px 14px rgba(255,212,0,.35) !important;text-shadow:none !important} :root[data-theme="light"] .btn-red:hover, :root[data-theme="light"] .btn-full:hover, :root[data-theme="light"] .fbtn.green:hover, :root[data-theme="light"] .pf-btn:hover{background:var(--acc2) !important;filter:none !important} :root[data-theme="light"] .fpanel h3, :root[data-theme="light"] .ex-card h3, :root[data-theme="light"] .card-title, :root[data-theme="light"] .panel-title{border-left-color:var(--acc) !important} :root[data-theme="light"] a[style*="color:var(--acc-text)"]{color:#141414 !important} :root[data-theme="light"] .auth-logo{color:#141414 !important} :root[data-theme="light"] .auth-line{background:var(--acc) !important} *{box-sizing:border-box;margin:0;padding:0} html{scroll-behavior:smooth} body{background:transparent;color:var(--text);font-family:var(--fu);font-size:18px;font-weight:500;min-height:100vh;overflow-x:hidden} html{background:var(--bg)} body,button,input,select,textarea,.card,.panel,.navlinks a,.btn,th,td,label{ font-family:var(--fu); -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility} body{font-weight:500;line-height:1.6;letter-spacing:.005em} p{line-height:1.65} h1,.page-title{font-family:var(--fu);font-weight:800;letter-spacing:-.01em;line-height:1.22} h2{font-family:var(--fu);font-weight:700;letter-spacing:-.004em;line-height:1.3} h3,h4,.card-title,.panel-head{font-family:var(--fu);font-weight:600;letter-spacing:0} .logo{font-family:var(--fu);font-weight:800;letter-spacing:.08em} .logo span{font-weight:600} .navlinks a{font-family:var(--fu)!important;font-weight:600;font-size:15px;letter-spacing:.015em} .btn,button{font-weight:700;letter-spacing:.01em} th,.tbl th,table.sf th,table.fnd th,table.um th,.ftable th{ font-family:var(--fu)!important;font-weight:700;letter-spacing:.02em} td{font-weight:500} label,.badge,.plan-badge,.stat-label,.b-pill,.pill{font-weight:600;letter-spacing:.015em} strong,b{font-weight:700} .muted,.dim,small{font-weight:500} code,.mono,.cve-id,.vi-cve-id,.ip,.ipaddr,.nav-user,#sb-time,.statusbar-item{font-family:var(--ft)} .easm-3d{font-family:var(--fb)!important} nav,.wrap,main,.content,.fpage,.auth-wrap{position:relative;z-index:1} html::after{content:none} nav{display:flex;justify-content:space-between;align-items:center;padding:0 28px; height:52px;background:rgba(11,11,13,.97); border-bottom:1px solid rgba(255,212,0,.22); position:sticky;top:0;z-index:200; -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);} .logo{font-family:var(--fo);font-size:15px;color:var(--acc-text);letter-spacing:.2em; text-shadow:var(--glow-acc)} .logo span{color:var(--white);font-size:15px} .nav-user{font-family:var(--fm);font-size:13px;color:var(--text); display:flex;align-items:center;gap:4px} .nav-user::before{content:'[';color:var(--acc-text)}.nav-user::after{content:']';color:var(--acc-text)} .navlinks{display:flex;gap:6px;align-items:center} .navlinks a{font-family:var(--fm);font-size:13px;color:var(--text);text-decoration:none; letter-spacing:.12em;padding:5px 12px;border:1px solid transparent; border-radius:2px;transition:all .2s} .navlinks a:hover{color:var(--acc-text);border-color:rgba(255,212,0,.28);background:rgba(var(--wash-rgb, 255,212,0), .06)} .navlinks a.active{color:var(--acc-text);border-color:rgba(255,212,0,.4); background:rgba(var(--wash-rgb, 255,212,0), .08);text-shadow:var(--glow-acc)} .nav-dot{width:6px;height:6px;border-radius:50%;background:var(--green); box-shadow:var(--glow-green);animation:pulse 2s infinite;margin-right:8px} .wrap{max-width:var(--page-w,1480px);margin:0 auto;padding:24px;box-sizing:border-box} .auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center; background:transparent} .auth-box{background:rgba(6,8,20,.82);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(0,229,255,.35);border-radius:14px; padding:44px 40px;width:100%;max-width:420px; box-shadow:0 0 60px rgba(0,229,255,.06),inset 0 0 60px rgba(0,0,0,.5)} .auth-logo{font-family:var(--fo);font-size:32px;color:var(--acc-text);text-align:center; letter-spacing:.2em;margin-bottom:4px;text-shadow:var(--glow-acc)} .auth-sub{font-family:var(--fm);font-size:13px;color:var(--text);text-align:center; letter-spacing:.22em;margin-bottom:32px;text-transform:uppercase} .auth-line{width:40px;height:1px;background:var(--acc);margin:0 auto 28px; box-shadow:var(--glow-acc)} .field{margin-bottom:16px} .field label{display:block;font-family:var(--fm);font-size:13px;color:var(--text); margin-bottom:6px;text-transform:uppercase;letter-spacing:.12em} input[type=text],input[type=password],input[type=email]{ width:100%;padding:10px 14px;background:rgba(0,0,0,.4); border:1px solid var(--border2);color:var(--white); font-family:var(--fm);font-size:15px;border-radius:2px;outline:none; transition:border .15s,box-shadow .15s} input:focus{border-color:rgba(0,229,255,.45);box-shadow:0 0 10px rgba(0,229,255,.1)} .auth-box input[type=text],.auth-box input[type=password],.auth-box input[type=email], .field input{ background:#ffffff !important;color:#0d1426 !important;border:1.5px solid #c3cad9 !important} .auth-box input::placeholder,.field input::placeholder{color:#94a3b8 !important} .auth-box input:focus,.field input:focus{border-color:#00b8cc !important; box-shadow:0 0 0 3px rgba(0,229,255,.15) !important} input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active{ -webkit-text-fill-color:var(--white) !important; -webkit-box-shadow:0 0 0 1000px rgba(0,0,0,.4) inset !important; transition:background-color 9999s ease-in-out 0s !important; caret-color:var(--white)} :root[data-theme="light"] input:-webkit-autofill, :root[data-theme="light"] input:-webkit-autofill:hover, :root[data-theme="light"] input:-webkit-autofill:focus{ -webkit-text-fill-color:var(--text) !important; -webkit-box-shadow:0 0 0 1000px var(--bg3) inset !important; caret-color:var(--text)} .auth-box input:-webkit-autofill,.field input:-webkit-autofill, .auth-box input:-webkit-autofill:hover,.field input:-webkit-autofill:hover, .auth-box input:-webkit-autofill:focus,.field input:-webkit-autofill:focus{ -webkit-text-fill-color:#0d1426 !important; -webkit-box-shadow:0 0 0 1000px #ffffff inset !important; caret-color:#0d1426 !important} .btn{display:inline-flex;align-items:center;gap:6px;padding:10px 22px; font-family:var(--fu);font-weight:700;font-size:15px;border:none;border-radius:2px; cursor:pointer;letter-spacing:.04em;transition:all .18s;text-decoration:none;white-space:nowrap} .btn-red{background:var(--red);color:#fff;box-shadow:0 0 14px rgba(255,34,68,.25)} .btn-red:hover{background:#ff4466;box-shadow:0 0 22px rgba(255,34,68,.4)} .btn-green{background:rgba(0,255,136,.1);color:var(--green);border:1px solid rgba(0,255,136,.4)} .btn-green:hover{background:rgba(0,255,136,.2);box-shadow:var(--glow-green)} .btn-yellow{background:rgba(255,215,0,.08);color:var(--yellow);border:1px solid rgba(255,215,0,.3)} .btn-yellow:hover{background:rgba(255,215,0,.15)} .btn-blue{background:rgba(56,189,248,.08);color:var(--blue);border:1px solid rgba(56,189,248,.3)} .btn-blue:hover{background:rgba(56,189,248,.15)} .btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border2)} .btn-ghost:hover{border-color:rgba(255,34,68,.4);color:var(--red)} .btn-danger{background:rgba(255,34,68,.1);color:var(--red);border:1px solid rgba(255,34,68,.3)} .btn-danger:hover{background:rgba(255,34,68,.25)} .btn-full{width:100%;justify-content:center} .btn-sm{padding:7px 15px;font-size:15px} .btn-xs{padding:5px 12px;font-size:15px;letter-spacing:.02em} .btn:disabled{opacity:.35;cursor:not-allowed} .alert{padding:12px 18px;margin-bottom:16px;font-family:var(--fm);font-size:15px;border-radius:2px} .alert-err{background:rgba(255,34,68,.07);border:1px solid rgba(255,34,68,.4);color:var(--red)} .alert-ok{background:rgba(0,255,136,.06);border:1px solid rgba(0,255,136,.3);color:var(--green)} .alert-warn{background:rgba(255,215,0,.06);border:1px solid rgba(255,215,0,.3);color:var(--yellow)} .ph{display:flex;justify-content:space-between;align-items:flex-start; margin-bottom:20px;padding-bottom:10px; border-bottom:none;flex-wrap:wrap;gap:10px} .ph-title{font-family:var(--fo);font-size:26px;font-weight:800;color:var(--acc-text);letter-spacing:.1em; text-shadow:var(--glow-acc)} .ph-sub{font-family:var(--fm);font-size:15px;color:var(--text);margin-top:6px; letter-spacing:.08em;text-transform:uppercase} .metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:22px} .metric{background:var(--bg2);border:1px solid var(--border);border-radius:3px;padding:14px 16px; position:relative;overflow:hidden;transition:border-color .2s} .metric::before{content:'';position:absolute;top:0;left:0;right:0;height:2px} .metric:hover{border-color:var(--border2)} .metric.c-red::before{background:var(--red);box-shadow:0 0 10px var(--red)} .metric.c-green::before{background:var(--green);box-shadow:0 0 10px var(--green)} .metric.c-yellow::before{background:var(--yellow)} .metric.c-blue::before{background:var(--blue)} .metric.c-purple::before{background:var(--purple)} .metric.c-orange::before{background:var(--orange)} .mv{font-family:var(--fo);font-size:26px;font-weight:700;color:var(--white);line-height:1; margin-top:4px} .ml{font-family:var(--fm);font-size:13px;color:var(--text);text-transform:uppercase; letter-spacing:.14em;margin-top:6px} .card{background:var(--bg2);border:1px solid var(--border);border-radius:3px; padding:18px 20px;margin-bottom:14px} .card-title{font-family:var(--fm);font-size:15px;color:var(--acc-text);letter-spacing:.1em; margin-bottom:14px;display:flex;align-items:center;gap:8px;text-transform:uppercase} .card-title::before{content:"";width:2px;height:12px;background:var(--acc); border-radius:1px;display:inline-block;flex-shrink:0;box-shadow:0 0 8px var(--red)} .target-card{background:var(--bg2);border:1px solid var(--border2);border-radius:3px; margin-bottom:8px;overflow:hidden;transition:border-color .2s} .target-card:hover{border-color:rgba(255,34,68,.3)} .target-header{display:flex;align-items:center;gap:12px;padding:14px 18px; cursor:pointer;-webkit-user-select:none;user-select:none} .target-header:hover .target-domain{color:var(--red)} .target-domain{font-family:var(--fo);font-size:18px;font-weight:800;color:var(--white); letter-spacing:.04em;flex:1;transition:color .15s} .target-scanned{font-family:var(--fm);font-size:15px;color:var(--white)} .target-chevron{font-family:var(--fm);font-size:15px;color:var(--text); transition:transform .2s;flex-shrink:0} .target-chevron.open{transform:rotate(90deg);color:var(--red)} .target-body{display:none;padding:0 18px 14px;border-top:1px solid var(--border)} .target-body.open{display:block} .tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:14px} .tbl th{text-align:left;font-family:var(--fm);font-size:11px;color:var(--muted); text-transform:uppercase;letter-spacing:.08em;padding:10px 12px;font-weight:800; border-bottom:1px solid color-mix(in srgb,var(--text) 10%,transparent); background:color-mix(in srgb,var(--text) 2.5%,transparent);position:sticky;top:0;z-index:2} .tbl td{padding:11px 12px;border-bottom:1px solid color-mix(in srgb,var(--text) 6%,transparent); font-family:var(--fm);font-size:13px;color:var(--text);vertical-align:middle; line-height:1.35} .tbl tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--text) 1.6%,transparent)} .tbl tr:hover td{background:color-mix(in srgb,var(--acc) 7%,transparent)} .tbl td .meta,.tbl .cell-meta{display:block;margin-top:3px;font-size:11px;color:var(--muted); font-weight:500;letter-spacing:.01em} .g{display:inline-block;width:28px;text-align:center;font-family:var(--fm); font-size:13px;font-weight:700;padding:2px 0;border-radius:2px} .g-A{background:rgba(0,255,136,.08);color:var(--green);border:1px solid rgba(0,255,136,.4)} .g-Ap{background:rgba(0,255,170,.1);color:#00ffaa;border:1px solid rgba(0,255,170,.4)} .g-B{background:rgba(212,160,0,.08);color:#d4a000;border:1px solid rgba(212,160,0,.4)} .g-C{background:rgba(255,215,0,.07);color:var(--yellow);border:1px solid rgba(255,215,0,.35)} .g-D{background:rgba(255,119,51,.08);color:#ff7733;border:1px solid rgba(255,119,51,.4)} .g-F{background:rgba(255,34,68,.08);color:var(--red);border:1px solid rgba(255,34,68,.4)} .g-NA{background:rgba(60,60,85,.2);color:var(--text);border:1px solid var(--border)} .sev{display:inline-block;font-family:var(--fm);font-size:13px;font-weight:700; padding:1px 6px;border-radius:2px;letter-spacing:.05em} .sev-HIGH{background:rgba(255,34,68,.1);color:var(--red);border:1px solid rgba(255,34,68,.3)} .sev-MEDIUM{background:rgba(255,215,0,.07);color:var(--yellow);border:1px solid rgba(255,215,0,.25)} .sev-LOW{background:rgba(56,189,248,.07);color:var(--blue);border:1px solid rgba(56,189,248,.25)} .sev-INFO{background:rgba(167,139,250,.07);color:var(--purple);border:1px solid rgba(167,139,250,.25)} .dot{display:inline-block;width:7px;height:7px;border-radius:50%;flex-shrink:0} .d-green{background:var(--green);box-shadow:0 0 8px var(--green)} .d-red{background:var(--red);box-shadow:0 0 8px var(--red)} .d-yellow{background:var(--yellow);box-shadow:0 0 6px var(--yellow)} .d-grey{background:var(--muted)} .svc{display:flex;align-items:center;gap:12px;padding:8px 0; border-bottom:1px solid var(--border);font-family:var(--fm);font-size:13px} .svc:last-child{border-bottom:none} .svc-name{color:var(--white);font-size:13px;width:180px;flex-shrink:0} .svc-status{color:var(--white);flex:1;font-size:15px} .tabs{display:flex;gap:2px;border-bottom:1px solid var(--border);margin-bottom:18px; overflow-x:auto} .tab{padding:8px 16px;font-family:var(--fm);font-size:15px;color:var(--text); cursor:pointer;background:none;border:none;border-bottom:2px solid transparent; margin-bottom:-1px;letter-spacing:.08em;transition:all .15s;white-space:nowrap} .tab:hover{color:var(--white)} .tab.on{color:var(--acc-text);border-bottom-color:var(--acc)} .tc{display:none}.tc.on{display:block} .stop-row{display:flex;gap:11px;align-items:center;flex-wrap:wrap;margin-top:12px; padding-top:12px;border-top:1px solid var(--border)} .stop-row[hidden]{display:none !important} .btn-stop{height:34px;background:transparent;color:var(--red); border:1px solid var(--red);border-radius:7px;padding:0 15px;cursor:pointer; font-family:var(--fm);font-size:12px;font-weight:700;letter-spacing:.07em; transition:background .14s,color .14s} .btn-stop:hover{background:var(--red);color:#fff} .stop-note{font-family:var(--fm);font-size:12px;color:var(--muted)} .stop-note b{color:var(--text)} .stop-lbl{font-family:var(--fm);font-size:12px;color:var(--muted); letter-spacing:.06em;text-transform:uppercase} .stop-sel{height:34px;min-width:200px;max-width:100%;padding:0 10px;border-radius:7px; border:1px solid var(--border2);background:var(--bg4);color:var(--text); font-family:var(--fm);font-size:12px;cursor:pointer} .stop-sel:hover,.stop-sel:focus{border-color:var(--red);outline:none} .stop-sel[data-single]{pointer-events:none;opacity:.85;border-style:dashed} .scan-box{background:rgba(0,229,255,.02);border:1px solid rgba(0,229,255,.2);border-radius:3px; padding:20px;margin-bottom:18px;box-shadow:0 0 30px rgba(0,229,255,.04)} .cve-row{background:rgba(13,13,26,.8);border-left:3px solid var(--red); padding:9px 14px;margin:5px 0;border-radius:4px} .cve-id{color:var(--red);font-family:var(--ft);font-size:15px;font-weight:800} .cve-meta{color:var(--text);font-family:var(--ft);font-size:15px;margin-top:3px} .cve-sum{color:var(--white);font-family:var(--ft);font-size:15px;margin-top:4px;line-height:1.55} .port{display:inline-block;background:rgba(10,20,35,.8);color:var(--blue); border:1px solid rgba(56,189,248,.25);font-family:var(--fm);font-size:13px; padding:1px 7px;border-radius:2px;margin:1px} .sub-card{background:linear-gradient(150deg,rgba(18,18,34,.7),rgba(10,10,20,.85)); border:1px solid var(--border);border-left:3px solid rgba(0,229,255,.4);border-radius:8px; padding:13px 16px;margin-bottom:10px; box-shadow:0 5px 0 -2px rgba(0,0,0,.4),0 10px 26px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.04); transform:perspective(900px) rotateX(2deg);transform-style:preserve-3d; transition:transform .25s cubic-bezier(.2,.8,.3,1.15),box-shadow .25s,border-color .25s} .sub-card:hover{transform:perspective(900px) rotateX(0deg) translateY(-5px) scale(1.008); border-left-color:#00e5ff; box-shadow:0 9px 0 -2px rgba(0,0,0,.4),0 22px 44px rgba(0,229,255,.18), inset 0 1px 0 rgba(255,255,255,.07)} .sub-host{font-family:var(--fm);font-size:13px;color:var(--white);margin-bottom:8px; display:flex;align-items:center;gap:8px;flex-wrap:wrap} .sub-host-name{font-family:var(--fm);font-size:13px;color:var(--blue);text-decoration:none; overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:150px;vertical-align:bottom} .sub-host-name:hover{color:#fff;text-decoration:underline} .sub-host-drill{font-family:var(--fm);font-size:11px;color:var(--muted);text-decoration:none; margin-left:auto;padding:2px 7px;border-radius:3px;border:1px solid var(--edge)} .sub-host-drill:hover{color:var(--acc-text);border-color:var(--acc)} .sub-shot-btn{font-family:var(--fm);font-size:11px;font-weight:700;letter-spacing:.04em; color:#00e5ff;cursor:pointer;padding:2px 8px;border-radius:3px; background:rgba(0,229,255,.08);border:1px solid rgba(0,229,255,.3)} .sub-shot-btn:hover{background:rgba(0,229,255,.18)} .hdr-row{display:flex;align-items:flex-start;gap:8px;padding:5px 0; border-bottom:1px solid rgba(22,22,42,.6);font-family:var(--fm);font-size:13px} .hdr-row:last-child{border-bottom:none} .hdr-name{width:220px;flex-shrink:0;color:var(--white);font-size:15px} .hdr-val{flex:1;color:var(--text);word-break:break-all;font-size:13px} .hdr-ok{color:var(--green)}.hdr-bad{color:var(--red)}.hdr-warn{color:var(--yellow)} .issue{font-family:var(--fm);font-size:15px;padding:2px 0; display:flex;gap:7px;align-items:flex-start;line-height:1.5} ::-webkit-scrollbar{width:4px;height:4px} ::-webkit-scrollbar-track{background:var(--bg)} ::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px} .g2{display:grid;grid-template-columns:1fr 1fr;gap:14px} .g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px} @media(max-width:760px){.g2,.g3{grid-template-columns:1fr}} @keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}} @keyframes dashPopIn{from{opacity:0;transform:translateX(40px) scale(.9)}to{opacity:1;transform:none}} @keyframes blink{0%,100%{opacity:1}49%{opacity:1}50%{opacity:0}} @keyframes scanin{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}} .pulsing{animation:pulse 1.8s ease-in-out infinite} .blink{animation:blink 1s step-end infinite} .fade-in{animation:scanin .3s ease} body{font-size:13px !important;line-height:1.55 !important} :root[data-theme="light"] body{font-size:13px !important} h1{font-size:22px !important;font-weight:700 !important} h2{font-size:18px !important;font-weight:600 !important} h3{font-size:15px !important;font-weight:600 !important} h4{font-size:14px !important;font-weight:600 !important} .logo{font-size:15px !important;letter-spacing:.12em} .navlinks a{font-size:12px !important;padding:8px 12px !important;letter-spacing:.06em} .fhead,:root[data-theme="light"] .fhead{font-size:var(--font-h1,22px) !important;font-weight:700 !important} .fsub,:root[data-theme="light"] .fsub{font-size:var(--font-small,11px) !important} .stat-num,:root[data-theme="light"] .stat-num{font-size:24px !important;font-weight:700 !important} .stat-label,:root[data-theme="light"] .stat-label{font-size:11px !important;text-transform:uppercase;letter-spacing:.06em} .panel-title,.target-name{font-size:15px !important;font-weight:600 !important} .card-title{font-size:14px !important;font-weight:600 !important} .d3card-v,:root[data-theme="light"] .d3card-v{font-size:24px !important;font-weight:700 !important} .d3card-l,:root[data-theme="light"] .d3card-l{font-size:11px !important;text-transform:uppercase;letter-spacing:.06em} .d3card-s,:root[data-theme="light"] .d3card-s{font-size:12px !important} .fc3d .v,:root[data-theme="light"] .fc3d .v{font-size:24px !important;font-weight:700 !important} .fc3d .l,:root[data-theme="light"] .fc3d .l{font-size:11px !important;text-transform:uppercase;letter-spacing:.06em} .sf-grade{font-size:26px !important;font-weight:800 !important} .fnd-metric .v{font-size:24px !important;font-weight:700 !important} .fnd-metric .l{font-size:11px !important;text-transform:uppercase;letter-spacing:.05em} th,td,:root[data-theme="light"] th,:root[data-theme="light"] td{font-size:12px !important} table th,th{font-size:11px !important;text-transform:uppercase;letter-spacing:.05em;font-weight:700 !important} .btn,.fbtn,:root[data-theme="light"] .btn{font-size:12px !important;letter-spacing:.04em} input,select,textarea{font-size:13px !important} .ex-kpi .v{font-size:24px !important;font-weight:700 !important} .ex-kpi .l{font-size:11px !important;text-transform:uppercase;letter-spacing:.05em} .ex-kpi .sub{font-size:11px !important} .ex-card h3{font-size:15px !important;font-weight:600 !important} .ex-card .cap{font-size:13px !important} .ex-bar .nm{font-size:13px !important} .pf-card h3{font-size:15px !important;font-weight:600 !important} .pf-card p.sub{font-size:13px !important} .tag,.vi-sev,.rw-sev,.fnd-sev{font-size:10px !important;text-transform:uppercase;letter-spacing:.05em;font-weight:700 !important} .role-badge{font-size:10px !important;text-transform:uppercase;letter-spacing:.05em;font-weight:700 !important} .hud-title{font-size:clamp(24px,3.4vw,34px) !important} .hud-sub{font-size:14px !important} .hud-boot{font-size:12px !important} .hud-btn,.hud-ghost{font-size:13px !important;padding:12px 26px !important} .hud-panel{font-size:12px !important} .hud-item{font-size:12px !important} /* Technical values → monospace (IPs, CVEs, hashes, payloads, ports) */ .mono,.ip,.cve,.hash,.payload,code,kbd,samp,.vi-cve-id,.rw-h,.sub-host, td.tech,.tech-val,.ioc,.token-val{font-family:var(--ft) !important} /* Tables / logs / code density — readable rows with clearer hierarchy */ .ftable,.ftable td,.rw-tbl td,.um td,.vi-desc,.feed-item,.cnt-row, .hist-tbl td,table.sf td,.log-row,.logline{font-size:13px !important;line-height:1.4 !important} .ftable th,.rw-tbl th,.um th,.hist-tbl th,table.sf th{ font-size:11px !important;text-transform:uppercase;letter-spacing:.06em;font-weight:800 !important; padding-top:11px !important;padding-bottom:11px !important;color:var(--muted) !important} .ftable td,.rw-tbl td,.um td,.hist-tbl td,table.sf td{ padding-top:10px !important;padding-bottom:10px !important; border-bottom:1px solid color-mix(in srgb,var(--text) 6%,transparent) !important} .ftable tbody tr:hover td,.rw-tbl tbody tr:hover td,.um tbody tr:hover td, .hist-tbl tbody tr:hover td,table.sf tbody tr:hover td{ background:color-mix(in srgb,var(--acc) 7%,transparent) !important} .ftable tbody tr:nth-child(even) td,.rw-tbl tbody tr:nth-child(even) td, .um tbody tr:nth-child(even) td,.hist-tbl tbody tr:nth-child(even) td, table.sf tbody tr:nth-child(even) td{ background:color-mix(in srgb,var(--text) 1.5%,transparent)} nav{ border:1px solid color-mix(in srgb,var(--acc) 34%,transparent) !important; box-shadow:0 14px 40px -18px rgba(255,212,0,.55), inset 0 1px 0 color-mix(in srgb,var(--acc) 38%,transparent) !important; } .logo{color:var(--acc-text) !important; text-shadow:0 0 22px color-mix(in srgb,var(--acc) 55%,transparent)} .navlinks a.active{ background:linear-gradient(180deg, rgba(var(--wash-rgb, 255,212,0), 0.26), rgba(var(--wash-rgb, 255,212,0), 0.12)) !important; box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--acc) 60%,transparent), 0 0 26px -6px var(--acc) !important; } .card,.fpanel,.panel,.d3card,.fc3d,.ex-card,.ex-kpi,.ex-hero,.quote,.sub-card,.pf-card{ border-color:color-mix(in srgb,var(--text) 9%,transparent) !important; border-radius:14px !important; box-shadow:0 14px 36px -22px rgba(0,0,0,.55), inset 0 1px 0 color-mix(in srgb,#fff 5%,transparent) !important; } .card:hover,.fpanel:hover,.ex-kpi:hover,.d3card:hover,.fc3d:hover{ border-color:color-mix(in srgb,var(--acc) 32%,transparent) !important; box-shadow:0 18px 44px -20px rgba(0,0,0,.62), 0 0 0 1px color-mix(in srgb,var(--acc) 18%,transparent), inset 0 1px 0 color-mix(in srgb,var(--acc) 22%,transparent) !important; transform:translateY(-1px); transition:border-color .18s ease,box-shadow .2s ease,transform .18s ease; } .fpanel h3,.ex-card h3,.card-title,.panel-title{ border-left:3px solid var(--acc);padding-left:11px} .btn-red,.fbtn.green,.pf-btn,.qcta,.lock-btn,.ex-upg,.um-btn:not(.danger){ background:linear-gradient(180deg,var(--acc),var(--acc2)) !important; border:none !important;color:var(--on-acc,#141410) !important;font-weight:800 !important; box-shadow:0 10px 30px -10px rgba(255,212,0,.6), inset 0 1px 0 rgba(255,255,255,.30) !important; } .btn-red:hover,.fbtn.green:hover,.pf-btn:hover,.qcta:hover,.lock-btn:hover{ filter:brightness(1.05); box-shadow:0 16px 42px -10px rgba(255,212,0,.8), inset 0 1px 0 rgba(255,255,255,.42) !important; } .btn,.fbtn,.ctrl-btn{border-color:rgba(255,212,0,0.4);border-color:color-mix(in srgb,var(--acc) 40%,transparent) !important} .btn:hover,.fbtn:hover,.ctrl-btn:hover, .btn:active,.fbtn:active,.ctrl-btn:active, .btn:focus,.fbtn:focus,.ctrl-btn:focus{ border-color:var(--acc) !important; background:var(--acc) !important;color:var(--on-acc,#141410) !important; box-shadow:0 0 22px -8px var(--acc) !important} /* Buttons that already carry a solid fill keep dark ink in every state */ .btn-red,.fbtn.green,.pf-btn,.qcta,.lock-btn,.ex-upg,.um-btn:not(.danger){ color:#141410 !important} .btn-red:hover,.btn-red:active,.btn-red:focus, .fbtn.green:hover,.fbtn.green:active,.fbtn.green:focus, .pf-btn:hover,.pf-btn:active,.pf-btn:focus, .qcta:hover,.qcta:active,.qcta:focus, .lock-btn:hover,.lock-btn:active,.lock-btn:focus, .ex-upg:hover,.ex-upg:active,.ex-upg:focus{color:#141410 !important} table th{ background:linear-gradient(180deg, rgba(var(--wash-rgb, 255,212,0), 0.18), rgba(var(--wash-rgb, 255,212,0), 0.07)) !important; color:var(--text) !important; border-bottom:2px solid color-mix(in srgb,var(--acc) 45%,transparent) !important} tbody tr:hover{background:rgba(var(--wash-rgb, 255,212,0), 0.12);background:rgba(var(--wash-rgb, 255,212,0), 0.12) !important} input,select,textarea{border-color:rgba(255,212,0,0.32);border-color:color-mix(in srgb,var(--acc) 32%,transparent) !important} input:focus,select:focus,textarea:focus{ border-color:var(--acc) !important; box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 26%,transparent), 0 0 30px -8px var(--acc) !important} .stat-num,.d3card-v,.ex-kpi .v,.fnd-metric .v{ text-shadow:0 0 30px color-mix(in srgb,currentColor 55%,transparent) !important} .fhead{ /* One ink. This used to be a gradient clipped to the text, which split every heading across two colours at an arbitrary word boundary - "Patch" in white, "Management" in yellow - and did it differently at every heading length. */ background:none !important; -webkit-background-clip:border-box !important;background-clip:border-box !important; -webkit-text-fill-color:var(--text) !important;color:var(--text) !important} .fsub{color:var(--acc-text) !important;opacity:.9} hr{border-color:rgba(255,212,0,0.3);border-color:color-mix(in srgb,var(--acc) 30%,transparent) !important} ::selection{background:rgba(var(--wash-rgb, 255,212,0), 0.42);background:rgba(var(--wash-rgb, 255,212,0), 0.42);color:#fff} /* A field is not page copy. The rule above paints selected text white on amber, which reads on a dark background and disappears the moment the field itself is light - selecting a model name made it invisible. Anything typed into gets its own: white behind, black in front, on every field in the app whatever its theme. */ input::selection, textarea::selection, select::selection, input::-moz-selection, textarea::-moz-selection{ background:#ffffff !important; color:#000000 !important; text-shadow:none !important} .fpanel h3,.ex-card h3,.um-card b,.pf-card h3{font-size:15px !important;font-weight:600 !important} .ftable,.ftable td,.rw-tbl td,.um td,.vi-desc,.feed-item,.cnt-row{font-size:12px !important} .ftable th,.rw-tbl th,.um th{font-size:11px !important;text-transform:uppercase;letter-spacing:.05em;font-weight:700 !important} .rw-stat .n,.stat-pill .sv,.vi-bignum-v{font-size:24px !important;font-weight:700 !important} .rw-stat .l,.stat-pill .sl,.vi-bignum-l,.panel-label,.tgt-domain{font-size:11px !important;text-transform:uppercase;letter-spacing:.05em} .rw-h,.sub-host,.target-domain,.vi-cve-id{font-size:13px !important;font-family:var(--fm) !important} .rw-sev,.vi-sev,.sev-bar-label,.sev-bar-val{font-size:10px !important;text-transform:uppercase;letter-spacing:.05em;font-weight:700 !important} .um-card,.um-card *,.pf-card,.pf-card *{font-size:inherit} .um-add label,.pf-field label,.sf-field label{font-size:12px !important;text-transform:uppercase;letter-spacing:.04em} .um-add input,.um-add select,.pf-input,.sf-input, table.um input,table.um select{font-size:13px !important} .um-btn,.pf-btn,.pf-tab{font-size:13px !important} .pf-msg,.qnote{font-size:13px !important} .pf-pill,.tier-pill{font-size:10px !important;text-transform:uppercase;letter-spacing:.05em;font-weight:700 !important} .pf-tabs{gap:8px !important;border-bottom:2px solid var(--border2) !important} .pf-tab{ font-size:14px !important; font-weight:600 !important; letter-spacing:.02em !important; text-transform:none !important; color:var(--text) !important; opacity:.72; padding:12px 20px !important; border-radius:12px 12px 0 0 !important; border:1px solid transparent !important; border-bottom:none !important; transition:opacity .15s, background .15s, color .15s; } .pf-tab:hover{opacity:1; color:var(--acc-text) !important; background:rgba(var(--wash-rgb, 255,212,0), 0.1);background:rgba(var(--wash-rgb, 255,212,0), 0.1)} .pf-tab.active{ opacity:1; color:var(--acc-text) !important; font-weight:800 !important; background:rgba(var(--wash-rgb, 255,212,0), 0.15);background:rgba(var(--wash-rgb, 255,212,0), 0.15); border-color:var(--border2) !important; box-shadow:inset 0 -3px 0 var(--acc); } .pf-card h3{font-weight:800 !important;color:var(--text) !important; letter-spacing:-.01em} .pf-card p.sub{color:var(--muted) !important;font-weight:500 !important} .pf-field label,.sf-field label{ font-weight:700 !important;color:var(--text) !important; text-transform:uppercase;letter-spacing:.08em} .fhead,.um-card>b,.fpanel h3{font-weight:800 !important} .um th{font-weight:800 !important;color:var(--text) !important;opacity:.85} *{scrollbar-width:thin;scrollbar-color:var(--acc2,#00b8cc) transparent} ::-webkit-scrollbar{width:10px;height:10px} ::-webkit-scrollbar-track{background:rgba(255,255,255,.05);border-radius:8px} ::-webkit-scrollbar-thumb{background:var(--acc2,#00b8cc);border-radius:8px;border:2px solid transparent;background-clip:content-box} ::-webkit-scrollbar-thumb:hover{background:var(--acc,#00e5ff);background-clip:content-box} :root[data-theme="light"] ::-webkit-scrollbar-track{background:rgba(0,0,0,.05)} .scrollbox{max-height:60vh;overflow:auto;border:1px solid var(--border2,#12122a);border-radius:10px} :root[data-theme="light"] .scrollbox{border-color:var(--border2)} .theme-toggle{width:40px;height:40px;border-radius:11px;cursor:pointer;border:1px solid rgba(255,212,0,.55); background:rgba(var(--wash-rgb, 255,212,0), .14);color:#ffe566 !important;display:inline-flex;align-items:center;justify-content:center; vertical-align:middle;margin-left:4px;transition:all .2s;padding:0} .theme-toggle:hover{border-color:#ffd400;background:rgba(var(--wash-rgb, 255,212,0), .28);color:#fff !important} .theme-toggle:active{transform:scale(.94)} .theme-toggle .ico,.theme-toggle .mi{display:inline-flex;align-items:center;justify-content:center;line-height:0;width:18px;height:18px;color:inherit} .theme-toggle .theme-svg{display:block;width:18px;height:18px;color:inherit;fill:currentColor} html,body{background:#060a1e} :root[data-theme="light"] html,:root[data-theme="light"] body{background:var(--bg3)} .app-bg{display:none} :root{ --bg:#0d0e0c !important; --bg2:#141613 !important; --bg3:#1b1e19 !important; --bg4:#17190f !important; --text:#fbfbf7 !important; --white:#ffffff !important; --muted:#d7d8ce !important; --p100:#ffe680 !important; --p200:#ffd400 !important; --p400:#e6bf00 !important; --p500:#caa700 !important; --p600:#a88b00 !important; --acc:#ffd400 !important; --acc2:#e6bf00 !important; --green:#6fe08c !important; --green2:#3bb45f !important; --yellow:#ffd400 !important; --orange:#ffb457 !important; --red:#ff8080 !important; --red2:#f04747 !important; --blue:#8ad2ff !important; --purple:#d4bcff !important; --border:#42463a !important; --border2:#33362d !important; --card-grad:#17190f !important; --shadow-3d:0 3px 14px rgba(0,0,0,.7) !important; --glow-acc:0 0 0 3px rgba(255,212,0,.28) !important; --glow-red:0 0 0 3px rgba(240,71,71,.28) !important; --glow-green:0 0 0 3px rgba(90,208,122,.28) !important; --scanline:transparent !important; --acc-text:#ffd400 !important;} :root[data-theme="light"]{ /* ── White Smoke palette ──────────────────────────────────────────────── Clean light palette: warm off-white ground, white cards, brand yellow used as a fill. Every value used as text was measured against both the ground and the card surface and clears AA (lowest 5.6:1). */ /* THIS is the block that decides the light theme at runtime. The one at the top of the file declares the same tokens without !important, and the forced-dark `:root{...!important}` block just above forces its own, so only values marked here actually win. Change one of the two and you get no visible change at all - which is exactly what happened. They are kept identical; if you edit one, edit both. Values: the code workspace's light set. Its surfaces are a warm neutral and its lines are the same family, which is why that page reads as one material; this used to pair a warm-white ground with cool blue-grey borders and muted text, and two grey families in one view is what made it look assembled. The status hues are taken a step darker than the workspace's, because there they sit on tinted chips and here they are also plain text: every value below clears 4.5:1 on all four surfaces. */ --bg:#f7f7f5 !important; --bg2:#ffffff !important; --bg3:#f2f2ee !important; --bg4:#e9e9e4 !important; --text:#18181b !important; --white:#18181b !important; /* 17.7:1 on white */ --muted:#55555e !important; /* 7.4:1 */ --p100:#fff6cc !important; --p200:#ffd400 !important; --p400:#c9a400 !important; --p500:#b89400 !important; --p600:#8a6d00 !important; --acc:#c9a400 !important; --acc2:#b89400 !important; /* gold fills */ --on-acc:#141410 !important; /* 7.7:1 on the fill */ --acc-ink:#18160a !important; --wash-rgb:201,164,0 !important; /* every tint follows the accent */ --green:#147135 !important; --green2:#105c2b !important; --yellow:#8c6000 !important; --orange:#a44f00 !important; --red:#c42b2b !important; --red2:#a32222 !important; --blue:#1f5fbf !important; --purple:#5b4b9e !important; --dove:#6e6e6e !important; --sage:#7c9166 !important; --border:#e3e3dd !important; --border2:#d3d3cb !important; --card:#ffffff !important; --cell:#f2f2ee !important; --edge:#e3e3dd !important; --edge2:#d3d3cb !important; --card-grad:#ffffff !important; --shadow-3d:0 4px 14px rgba(24,24,27,.07),0 1px 3px rgba(24,24,27,.05) !important; --glow-acc:0 0 0 3px rgba(201,164,0,.32) !important; /* Paired with the forced-dark block above: a token forced there and not here stays dark when the theme is light. */ --acc-text:#7a5a00 !important; /* 6.4:1 on white */ --glow-green:0 0 0 3px rgba(20,113,53,.16) !important; --glow-red:0 0 0 3px rgba(196,43,43,.16) !important; --scanline:transparent !important;} .card,.fpanel,.panel,.d3card,.fc3d,.quote{-webkit-backdrop-filter:none !important;backdrop-filter:none !important} .stat-num,.d3card-v,.fc3d .v,.fhead,h1,h2,h3,.sf-grade{text-shadow:none !important} /* ACCESSIBILITY - brighten faint hardcoded greys so all text is legible on the charcoal surface (same theme, clearer text). */ :root:not([data-theme="light"]) [style*="color:#888"], :root:not([data-theme="light"]) [style*="color:#999"], :root:not([data-theme="light"]) [style*="color:#666"], :root:not([data-theme="light"]) [style*="color:#777"], :root:not([data-theme="light"]) [style*="color:#aaa"], :root:not([data-theme="light"]) [style*="color: #888"], :root:not([data-theme="light"]) [style*="color:#8a93c2"], :root:not([data-theme="light"]) [style*="color:#c0c0e0"], :root:not([data-theme="light"]) [style*="color:#b8b8d8"], :root:not([data-theme="light"]) [style*="color:#d0d0ee"]{color:#d7d8ce !important} :root:not([data-theme="light"]) .sf-muted, :root:not([data-theme="light"]) .cap, :root:not([data-theme="light"]) .fsub, :root:not([data-theme="light"]) .hist-meta, :root:not([data-theme="light"]) .cmp-map, :root:not([data-theme="light"]) .cmp-ev{color:#d7d8ce !important} :root:not([data-theme="light"]) code{color:#ffe680 !important} .tag,.vi-sev,.rw-sev,.fnd-sev{display:inline-flex;align-items:center;gap:5px; padding:2px 9px;border-radius:6px;font-family:var(--fm);font-size:13px;font-weight:700; border:1px solid currentColor;background:transparent;letter-spacing:.02em} .tag-kev::before {content:"\26A0";} /* ⚠ warning triangle */ .tag-cve::before {content:"\1F6E1";} /* shield */ .tag-breach::before {content:"\1F4A7";} /* drop */ .tag-leak::before {content:"\1F511";} /* key */ .tag-takeover::before{content:"\21AA";} /* ↪ hijack arrow */ .tag-port::before {content:"\25A3";} /* ▣ port square */ .tag-sub::before {content:"\25C6";} /* ◆ node */ .tag-kev {color:var(--red); border-style:solid; border-width:2px} .tag-cve {color:var(--orange);border-style:solid} .tag-breach {color:var(--purple);border-style:dashed} .tag-leak {color:var(--yellow);border-style:dashed} .tag-takeover{color:var(--acc-text); border-style:dotted} .tag-port {color:var(--muted); border-style:dotted} .tag-sub {color:var(--acc2); border-style:solid} a:focus-visible,button:focus-visible,input:focus-visible, select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{ outline:3px solid var(--acc) !important; outline-offset:2px !important; border-radius:4px} :root{ --fd:'Fira Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif; --fb:'Fira Sans',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif; --ft:'JetBrains Mono','Share Tech Mono',monospace; --r-xl:26px; --r-lg:20px; --r-md:14px; --r-sm:11px; --glass:rgba(28,28,33,0.78);--glass:color-mix(in srgb,var(--bg4) 78%,transparent); --lit:rgba(255,212,0,0.38);--lit:color-mix(in srgb,var(--acc) 38%,transparent); --lit-soft:rgba(255,212,0,0.15);--lit-soft:color-mix(in srgb,var(--acc) 15%,transparent); --aura:rgba(255,212,0,0.45);--aura:color-mix(in srgb,var(--p200) 45%,transparent); } body::before{ content:""; position:fixed; inset:0; pointer-events:none; z-index:0; background:var(--bg); } body::after{ content:none !important; display:none !important; } :root[data-theme="light"] body::before{ background:var(--bg); } :root[data-theme="light"] body::after{ content:none !important; display:none !important; } .fhead,h1,.logo{font-family:var(--fd) !important; letter-spacing:-.03em; font-weight:700 !important} .fhead{ font-size:var(--font-h1,24px) !important; line-height:1.18 !important; letter-spacing:-.02em !important; background:none; -webkit-background-clip:border-box; background-clip:border-box; -webkit-text-fill-color:var(--text); color:var(--text); padding-bottom:.1em; padding-left:0; padding-right:0; display:block; width:fit-content; max-width:100%; overflow:visible; } .fsub{padding-left:0; margin-top:4px; max-width:68ch; line-height:1.45 !important; color:var(--muted) !important; opacity:1 !important} :root{ --font-base:13px; --font-small:11px; --font-h3:15px; --font-h2:18px; --font-h1:24px; --font-mono:"JetBrains Mono","SFMono-Regular",Consolas,"Liberation Mono",monospace; } body,table,input,button,select,textarea,p,span,td,th,li,label,a{ font-size:var(--font-base); line-height:1.45; } h1,.fhead{font-size:var(--font-h1) !important;line-height:1.25} h2{font-size:var(--font-h2)} h3{font-size:var(--font-h3)} .fpage h1{font-size:var(--font-h1)} .fpage h2{font-size:var(--font-h2)} .fpage h3{font-size:var(--font-h3)} .fsub,.chc-s,.spark-l span,.vi-meta,.gtb-stats,.vf-count{font-size:var(--font-small)} .card-title,.chc-t,.sb-sect{font-size:var(--font-small);letter-spacing:.12em} .sb-item{font-size:var(--font-base)} .sb-sub a{font-size:var(--font-small)} .stat-num,.chc-v{font-size:26px} .ip-address,.hash,.cve-id,.vi-id,.mono,code,pre,kbd,samp, .um-tbl td:first-child,.sf-ip,.f-cve{ font-family:var(--font-mono); font-size:12px; font-variant-numeric:tabular-nums; } a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible, textarea:focus-visible,[tabindex]:focus-visible,.legend-item:focus-visible, .vf-kind:focus-visible,.pf-tab:focus-visible,.sb-item:focus-visible{ outline:2px solid var(--acc); outline-offset:2px; border-radius:4px; } a:focus:not(:focus-visible),button:focus:not(:focus-visible){outline:none} .skip-link{position:absolute;left:-9999px;top:0;z-index:10000; background:var(--acc);color:var(--on-acc,#141410) !important;padding:10px 16px;border-radius:0 0 8px 0; font-weight:700;text-decoration:none} .skip-link:focus{left:0} @media (prefers-reduced-motion: reduce){ *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; } } .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px; overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0} @media (forced-colors: active){ .btn,.fbtn,.ctrl-btn,button{border:1px solid ButtonText} .legend-item,.vf-kind{border:1px solid ButtonText} } label{cursor:pointer} [disabled],[aria-disabled="true"]{cursor:not-allowed;opacity:.6} .target-input-field, select[name="t"], .sf-input, .fnd-target{ max-width:360px; height:36px; font-size:var(--font-base); padding:6px 11px; box-sizing:border-box; border-radius:8px; } @supports not (background-clip:text){ .fhead{color:var(--text) !important} } .fsub{font-family:var(--ft) !important; font-size:13px !important; letter-spacing:.04em; text-transform:uppercase; color:var(--muted) !important; margin-top:6px !important} h2,h3,h4,.panel-title,.card-title,.ex-card h3,.fpanel h3{ font-family:var(--fd) !important; letter-spacing:-.015em; font-weight:600 !important} body,p,td,th,label,li,input,select,textarea{font-family:var(--fb) !important} .stat-num,.d3card-v,.fc3d .v,.ex-kpi .v,.fnd-metric .v,.sf-grade,code,pre{ font-family:var(--ft) !important; font-variant-numeric:tabular-nums; letter-spacing:-.03em} .stat-num,.d3card-v,.fc3d .v,.ex-kpi .v,.sf-grade{ text-shadow:0 0 26px color-mix(in srgb,currentColor 45%,transparent) !important} :root[data-theme="light"] .stat-num,:root[data-theme="light"] .d3card-v, :root[data-theme="light"] .fc3d .v,:root[data-theme="light"] .ex-kpi .v, :root[data-theme="light"] .sf-grade{text-shadow:none !important} .card,.fpanel,.panel,.d3card,.fc3d,.ex-card,.ex-kpi,.ex-hero,.quote,.sub-card,.pf-card{ position:relative; overflow:hidden; border-radius:var(--r-lg) !important; border:1px solid var(--lit-soft) !important; background: radial-gradient(120% 90% at 50% -30%, rgba(var(--wash-rgb, 255,212,0), 0.12), transparent 60%), var(--glass) !important; -webkit-backdrop-filter:blur(18px) saturate(1.25);backdrop-filter:blur(18px) saturate(1.25); box-shadow:0 20px 60px -22px rgba(0,0,0,.85), inset 0 1px 0 color-mix(in srgb,var(--acc) 30%,transparent) !important; transition:border-color .25s, transform .25s, box-shadow .25s; } :root[data-theme="light"] .card,:root[data-theme="light"] .fpanel, :root[data-theme="light"] .ex-card,:root[data-theme="light"] .ex-kpi, :root[data-theme="light"] .d3card,:root[data-theme="light"] .fc3d{ background:var(--bg2) !important; -webkit-backdrop-filter:none;backdrop-filter:none; border-color:var(--border2) !important; box-shadow:0 10px 30px -18px rgba(10,10,40,.28), inset 0 1px 0 rgba(255,255,255,.9) !important; } .card:hover,.fpanel:hover,.ex-kpi:hover,.d3card:hover,.fc3d:hover{ transform:translateY(-3px); border-color:var(--lit) !important; box-shadow:0 28px 70px -22px rgba(0,0,0,.9), 0 0 0 1px var(--lit-soft), inset 0 1px 0 color-mix(in srgb,var(--acc) 45%,transparent) !important; } nav{ margin:12px auto 0 !important; max-width:1560px; border-radius:999px !important; background:rgba(28,28,33,0.72);background:color-mix(in srgb,var(--bg4) 72%,transparent) !important; border:1px solid var(--lit-soft) !important; -webkit-backdrop-filter:blur(22px) saturate(1.4) !important;backdrop-filter:blur(22px) saturate(1.4) !important; box-shadow:0 16px 44px -20px rgba(0,0,0,.9), inset 0 1px 0 color-mix(in srgb,var(--acc) 26%,transparent) !important; } .navlinks a{ font-family:var(--ft) !important; letter-spacing:.09em; border-radius:999px !important; transition:color .2s, background .2s, box-shadow .2s; } .navlinks a:hover{background:rgba(var(--wash-rgb, 255,212,0), 0.12);background:rgba(var(--wash-rgb, 255,212,0), 0.12)} .navlinks a.active{ color:var(--acc-text) !important; background:rgba(var(--wash-rgb, 255,212,0), 0.16);background:rgba(var(--wash-rgb, 255,212,0), 0.16); box-shadow:inset 0 0 0 1px var(--lit), 0 0 22px -6px var(--acc); } .btn,.fbtn,.pf-btn,.qcta,.lock-btn,.ex-upg,.preset{ font-family:var(--ft) !important; letter-spacing:.05em; border-radius:999px !important; transition:transform .18s, box-shadow .18s, filter .18s; } .btn:hover,.fbtn:hover,.pf-btn:hover,.lock-btn:hover,.ex-upg:hover{ transform:translateY(-2px); box-shadow:0 12px 30px -10px color-mix(in srgb,var(--acc) 65%,transparent); filter:brightness(1.08); } .btn:active,.fbtn:active{transform:translateY(0)} input,select,textarea{ border-radius:var(--r-md) !important; background:rgba(22,22,26,0.7);background:color-mix(in srgb,var(--bg3) 70%,transparent) !important; } input:focus,select:focus,textarea:focus{ box-shadow:0 0 0 3px var(--lit-soft), 0 0 26px -8px var(--acc) !important; border-color:var(--acc) !important; } table th{ font-family:var(--ft) !important; font-size:12px !important; letter-spacing:.14em; text-transform:uppercase; color:var(--muted) !important; font-weight:600 !important; border-bottom:1px solid var(--lit-soft) !important; } table td{font-variant-numeric:tabular-nums} tbody tr{transition:background .15s} tbody tr:hover{background:rgba(var(--wash-rgb, 255,212,0), 0.08);background:rgba(var(--wash-rgb, 255,212,0), 0.08) !important} .tag,.vi-sev,.rw-sev,.fnd-sev{border-radius:999px !important; font-family:var(--ft) !important} @keyframes riseIn{from{opacity:0; transform:translateY(14px)} to{opacity:1; transform:none}} @keyframes drift{0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(-16px)}} .fpage>*{animation:riseIn .55s cubic-bezier(.22,1,.36,1) backwards} .fpage>*:nth-child(2){animation-delay:.07s} .fpage>*:nth-child(3){animation-delay:.14s} .fpage>*:nth-child(n+4){animation-delay:.2s} @media (prefers-reduced-motion: reduce){ .fpage>*{animation:none !important} } @media(max-width:820px){ :root{--r-lg:16px; --r-xl:20px} nav{border-radius:var(--r-lg) !important; margin:8px 8px 0 !important} .navlinks a{font-size:13px !important; padding:6px 9px !important} .fhead{font-size:var(--font-h1,22px) !important} } .lockwrap{position:relative;margin:8px 0} .locked-blur{filter:blur(6px);pointer-events:none;-webkit-user-select:none;user-select:none;opacity:.7} .lock-over{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center; justify-content:center;gap:8px;text-align:center;padding:16px;z-index:5; background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--bg) 55%,transparent));border-radius:12px} .lock-over .lt{font-size:15px;font-weight:700;color:var(--text)} .lock-over .ld{font-size:15px;color:var(--muted);max-width:340px;line-height:1.5} .lock-btn{display:inline-block;margin-top:4px;background:var(--acc);color:#fff;text-decoration:none; padding:9px 18px;border-radius:9px;font-size:15px;font-weight:700;border:none;cursor:pointer} .lock-btn:hover{filter:brightness(1.1)} .tier-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:20px; font-family:var(--fm);font-size:13px;border:1px solid var(--acc);color:var(--acc-text); background:rgba(var(--wash-rgb, 255,212,0), 0.1);background:rgba(var(--wash-rgb, 255,212,0), 0.1)} .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden; clip:rect(0,0,0,0);white-space:nowrap;border:0} @media (prefers-reduced-motion: reduce){ *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important} } body{font-size:13px !important;line-height:1.55 !important;color:#E2E8F0} :root[data-theme="light"] body{color:#141410} p,li,td,label,span,div,a,input,select,textarea,button{font-size:inherit} .fhead,:root[data-theme="light"] .fhead{ font-size:var(--font-h1,22px) !important;line-height:1.18 !important;font-weight:700 !important} .fsub,:root[data-theme="light"] .fsub{font-size:var(--font-small,11px) !important} h1{font-size:22px !important;font-weight:700 !important} h2{font-size:18px !important;font-weight:600 !important} h3,.panel-title,.card-title,.fpanel h3,.ex-card h3,.pf-card h3{font-size:15px !important;font-weight:600 !important} h4{font-size:14px !important;font-weight:600 !important} .stat-num,.d3card-v,.fc3d .v,.ex-kpi .v,.fnd-metric .v,.rw-stat .n, .stat-pill .sv,.vi-bignum-v,.ex-gauge .g,.sf-grade, :root[data-theme="light"] .fc3d .v,:root[data-theme="light"] .ex-kpi .v{ font-size:24px !important;line-height:1.05 !important;font-weight:700 !important} .ex-gauge .g{font-size:24px !important} .sf-grade{font-size:26px !important} .d3card-l,.fc3d .l,.ex-kpi .l,.fnd-metric .l,.rw-stat .l,.stat-pill .sl, .vi-bignum-l,.panel-label,.stat-label,.ex-kpi .sub,.cap,.ex-card .cap{ font-size:11px !important;text-transform:uppercase;letter-spacing:.05em} th,table th{font-size:11px !important;text-transform:uppercase;letter-spacing:.05em;font-weight:700 !important} td,.ftable,.ftable td,.rw-tbl td,.um td,.hist-tbl td,table.sf td{font-size:12px !important} .btn,.fbtn,.ctrl-btn,.pf-btn,.um-btn,.hud-btn,.reco-mini,.cal-nav{font-size:12px !important;letter-spacing:.04em} .navlinks a{font-size:12px !important;letter-spacing:.06em} .logo{font-size:15px !important} input,select,textarea{font-size:13px !important} .tag,.tier-pill,.role-badge,.vi-sev,.rw-sev,.fnd-sev,.fpill,.pf-pill,.reco-badge{ font-size:10px !important;text-transform:uppercase;letter-spacing:.05em;font-weight:700 !important} .ex-hero-txt h2{font-size:18px !important} .ex-hero-txt p{font-size:13px !important} .hud-title{font-size:clamp(24px,3.4vw,34px) !important} .hud-sub{font-size:14px !important} .hud-btn,.hud-ghost{font-size:13px !important} /* Technical values → monospace */ code,kbd,samp,.mono,.ip,.cve,.hash,.payload,.ioc,.vi-cve-id,.rw-h,.sub-host, .target-domain,.tgt-domain,.token-val,.tech-val{font-family:var(--ft) !important} @media(max-width:820px){ .fhead,:root[data-theme="light"] .fhead{font-size:var(--font-h1,22px) !important} .stat-num,.d3card-v,.fc3d .v,.ex-kpi .v,.ex-gauge .g{font-size:22px !important} } /* Phone hardening that must apply even on pages without the app shell (login, embeds): 16px inputs stop iOS Safari auto-zoom, and nothing is allowed to force the viewport sideways. */ @media (max-width: 620px){ input, select, textarea { font-size: 16px !important; max-width: 100%; } } html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }