/* HTML&HTML Enterprise System v1 — focused AI visibility funnel, premium result intelligence and news authority. */
:root{--hh-ink:#f8fafc;--hh-muted:#94a3b8;--hh-paper:#14151a;--hh-panel:#1e2028;--hh-line:rgba(255,255,255,0.09);--hh-soft:#181a22;--hh-accent:#0066ff;--hh-radius:24px;--hh-shadow:0 18px 50px rgba(0,0,0,.5)}
html[data-theme="light"] {
--hh-ink: #0f172a !important;
--hh-muted: #64748b !important;
--hh-paper: #ffffff !important;
--hh-panel: #f8fafc !important;
--hh-line: #e2e8f0 !important;
--hh-soft: #f1f5f9 !important;
--hh-card: #ffffff !important;
--hh-accent: #0066ff !important;
--hh-shadow: 0 4px 20px rgba(0,0,0,0.06) !important;
}
html[data-theme="dark"] {
--hh-ink: #f8fafc;
--hh-muted: #94a3b8;
--hh-paper: #14151a;
--hh-panel: #1e2028;
--hh-line: rgba(255,255,255,0.09);
--hh-soft: #181a22;
--hh-card: #181a22;
--hh-accent: #0066ff;
--hh-shadow: 0 18px 50px rgba(0,0,0,.5);
}
.primary-nav{display:flex;align-items:center;gap:22px;min-width:0}.primary-nav a{font-size:14px;font-weight:700;text-decoration:none;white-space:nowrap;color:inherit}.nav-scan-cta{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 16px;border:1px solid var(--hh-line);border-radius:999px;background:#0066ff;color:var(--theme-text-strong, #ffffff)!important;font-size: 15px;font-weight:800;text-decoration:none;white-space:nowrap}
.px-scope-hero,.px-pricing-hero{max-width:900px!important;margin-inline:auto!important;text-align:center}.px-scope-detail .px-lenses a{text-decoration:none;color:inherit}.px-pricing-stage{padding-top:24px!important}
.px-pricing-hero .hero-actions,.px-scope-hero .hero-actions{display:flex!important;align-items:center!important;justify-content:center!important;gap:14px!important;margin-top:24px!important;flex-wrap:wrap!important}
.px-pricing-hero .hero-actions a,.px-scope-hero .hero-actions a{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:46px!important;padding:0 24px!important;border-radius:9999px!important;font-size:14.5px!important;font-weight:700!important;text-decoration:none!important;transition:all .2s cubic-bezier(0.16,1,0.3,1)!important}
.px-pricing-hero .hero-actions a.primary,.px-scope-hero .hero-actions a.primary{background:#2563eb!important;color:var(--theme-text-strong, #ffffff)!important;border:1px solid #2563eb!important;box-shadow:0 4px 16px rgba(37,99,235,.4)!important}
.px-pricing-hero .hero-actions a.primary:hover,.px-scope-hero .hero-actions a.primary:hover{background:#1d4ed8!important;transform:translateY(-2px)!important;box-shadow:0 8px 24px rgba(37,99,235,.5)!important}
.px-pricing-hero .hero-actions a:not(.primary),.px-scope-hero .hero-actions a:not(.primary){background:rgba(255,255,255,0.06)!important;border:1px solid var(--theme-border, rgba(255,255,255,0.14))!important;color:var(--theme-text-primary, #f8fafc)!important}
.px-pricing-hero .hero-actions a:not(.primary):hover,.px-scope-hero .hero-actions a:not(.primary):hover{background:rgba(255,255,255,0.12)!important;border-color:rgba(255,255,255,0.28)!important;transform:translateY(-2px)!important}
html[data-theme="light"] .px-pricing-hero .hero-actions a:not(.primary),html[data-theme="light"] .px-scope-hero .hero-actions a:not(.primary){background:#ffffff!important;border:1px solid #cbd5e1!important;color:#0f172a!important;box-shadow:0 2px 6px rgba(0,0,0,0.05)!important}
html[data-theme="light"] .px-pricing-hero .hero-actions a:not(.primary):hover,html[data-theme="light"] .px-scope-hero .hero-actions a:not(.primary):hover{background:#f8fafc!important;border-color:#94a3b8!important;color:#000000!important}
.px-report-boundary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:24px!important;align-items:stretch;max-width:980px!important;margin:0 auto!important}
.px-report-free,.px-report-paid{position:relative;border-radius:24px;padding:34px 28px;background:linear-gradient(175deg, rgba(30, 33, 42, 0.95) 0%, rgba(22, 24, 32, 0.98) 100%)!important;border:1.5px solid var(--theme-border, rgba(255,255,255,0.1));overflow:hidden;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease;color:var(--theme-text-primary, #f8fafc)!important}
.px-report-free:hover,.px-report-paid:hover{transform:translateY(-3px)}
.px-report-free{border-top:3.5px solid #0066ff!important;box-shadow:0 0 24px -4px rgba(0,102,255,0.28), 0 12px 36px rgba(0,0,0,0.6)!important}
.px-report-paid{border:1.5px solid rgba(139,92,246,0.45)!important;border-top:3.5px solid #8b5cf6!important;box-shadow:0 0 28px -4px rgba(139,92,246,0.3), 0 16px 40px rgba(0,0,0,0.7)!important}
.px-report-boundary h2{font-size:clamp(22px,2.2vw,28px);line-height:1.15;letter-spacing:-.03em;margin:12px 0 14px;font-weight:800;color:var(--theme-text-strong, #ffffff)!important}
.px-report-boundary p{font-size:15px;line-height:1.6;color:var(--theme-text-secondary, #94a3b8)!important;margin:0 0 20px}
.px-report-boundary ul{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:11px}
.px-report-boundary li{position:relative;padding-left:24px;font-size:14px;line-height:1.45;color:var(--theme-text-secondary, #cbd5e1)!important}
.px-report-boundary li:before{content:'✓';position:absolute;left:0;font-weight:900;color:#10b981}
.px-report-boundary .eyebrow{display:inline-block;font-size: 15px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#38bdf8!important;background:rgba(0,102,255,0.15)!important;border:1px solid rgba(56,189,248,0.3)!important;padding:4px 12px;border-radius:999px;align-self:flex-start;margin-bottom:8px}
.px-report-paid .eyebrow{color:#c084fc!important;background:rgba(139,92,246,0.18)!important;border:1px solid rgba(192,132,252,0.35)!important}
.px-report-free a.px-outline{margin-top:auto!important;display:inline-flex;min-height:50px;padding:0 22px;border-radius:12px;align-items:center;justify-content:center;text-decoration:none;font-weight:800;border:1px solid rgba(255,255,255,0.16);background:rgba(255,255,255,0.05);color:var(--theme-text-primary, #f8fafc);transition:all .15s ease}
.px-report-free a.px-outline:hover{background:rgba(255,255,255,0.1);border-color:#38bdf8;color:#38bdf8}
.px-report-paid .primary{margin-top:auto!important;display:inline-flex;min-height:50px;padding:0 22px;border-radius:12px;align-items:center;justify-content:center;text-decoration:none;font-weight:800;background:linear-gradient(135deg,#0066ff,#2563eb)!important;color:var(--theme-text-strong, #ffffff)!important;box-shadow:0 4px 16px rgba(37,99,235,.4);border:none;transition:all .15s ease}
.px-report-paid .primary:hover{background:#1d4ed8!important;transform:translateY(-1px)}
html[data-theme="light"] .px-report-boundary .eyebrow{color:#0284c7!important;background:rgba(2,132,199,0.12)!important;border-color:rgba(2,132,199,0.3)!important}
html[data-theme="light"] .px-report-paid .eyebrow{color:#7c3aed!important;background:rgba(124,58,237,0.12)!important;border-color:rgba(124,58,237,0.3)!important}
html[data-theme="light"] .px-report-free{background:#ffffff!important;border:1.5px solid #e2e8f0!important;border-top:3.5px solid #0066ff!important;box-shadow:0 4px 20px rgba(0,102,255,0.08), 0 1px 3px rgba(0,0,0,0.05)!important;color:#0f172a!important}
html[data-theme="light"] .px-report-paid{background:#ffffff!important;border:1.5px solid #cbd5e1!important;border-top:3.5px solid #8b5cf6!important;box-shadow:0 4px 20px rgba(139,92,246,0.08), 0 1px 3px rgba(0,0,0,0.05)!important;color:#0f172a!important}
html[data-theme="light"] .px-report-boundary h2{color:#0f172a!important}
html[data-theme="light"] .px-report-boundary p{color:#475569!important}
html[data-theme="light"] .px-report-boundary li{color:#334155!important}
html[data-theme="light"] .px-report-free a.px-outline{border:1px solid #cbd5e1!important;background:#f8fafc!important;color:#0f172a!important}
html[data-theme="light"] .px-report-free a.px-outline:hover{background:#f1f5f9!important;border-color:#0284c7!important;color:#0284c7!important}
.px-delivery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.px-delivery-grid article{min-height:176px;border:1px solid var(--theme-border, rgba(255,255,255,0.1));border-radius:22px;padding:24px;background:var(--theme-bg-surface, #1e2028);color:var(--theme-text-primary, #f8fafc)}.px-delivery-grid article b{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--theme-bg-surface, #181a22);color:#38bdf8;font-size: 14px}.px-delivery-grid h3{font-size:18px;margin:22px 0 9px;color:var(--theme-text-strong, #ffffff)}.px-delivery-grid p{margin:0;color:var(--hh-muted);line-height:1.55}.px-value-strip{display:grid!important;grid-template-columns:repeat(4,1fr);gap:1px!important;padding:1px!important;background:rgba(255,255,255,0.12)!important;border-radius:22px;overflow:hidden}.px-value-strip>div{background:var(--theme-bg-surface, #1e2028);color:var(--theme-text-primary, #f8fafc);padding:22px}.px-value-strip span{display:block;color:var(--hh-muted);font-size: 14px;text-transform:uppercase;letter-spacing:.09em;margin-bottom:5px}.px-value-strip b{font-size:15px;color:var(--theme-text-strong, #ffffff)}
html[data-theme="light"] .px-delivery-grid article{background:#ffffff!important;border:1px solid #e2e8f0!important;color:#0f172a!important;box-shadow:0 2px 10px rgba(0,0,0,0.03)!important}
html[data-theme="light"] .px-delivery-grid article b{background:#f1f5f9!important;color:#0284c7!important}
html[data-theme="light"] .px-delivery-grid h3{color:#0f172a!important}
html[data-theme="light"] .px-delivery-grid p{color:#475569!important}
html[data-theme="light"] .px-value-strip{background:#e2e8f0!important}
html[data-theme="light"] .px-value-strip>div{background:#ffffff!important;color:#0f172a!important}
html[data-theme="light"] .px-value-strip span{color:#64748b!important}
html[data-theme="light"] .px-value-strip b{color:#0f172a!important}
.ai-decision-lock{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:20px;padding:18px 20px;border-radius:18px;background:var(--hh-ink);color:var(--theme-text-strong, #fff);box-sizing:border-box;width:100%;max-width:100%;overflow:hidden;pointer-events:auto!important;user-select:auto!important}.ai-decision-lock p{margin:0;line-height:1.5;max-width:100%;overflow-wrap:break-word;word-break:break-word}.ai-decision-lock a{white-space:normal;text-align:center;display:inline-flex;min-height:42px;padding:10px 17px;align-items:center;justify-content:center;border-radius:999px;background:#38bdf8!important;color:#121316!important;text-decoration:none;font-weight:800;flex-shrink:0;max-width:100%;box-sizing:border-box;line-height:1.3;overflow-wrap:break-word;word-break:break-word;pointer-events:auto!important;cursor:pointer!important}
html[data-theme="light"] .ai-decision-map{background:#ffffff!important;border:1px solid #e2e8f0!important;box-shadow:0 4px 20px rgba(0,0,0,0.04)!important;color:#0f172a!important}
html[data-theme="light"] .ai-decision-map-head h3{color:#0f172a!important}
html[data-theme="light"] .ai-decision-map-head p,html[data-theme="light"] .ai-decision-map-head small{color:#64748b!important}
html[data-theme="light"] .ai-lens{background:#f8fafc!important;border:1px solid #e2e8f0!important;color:#0f172a!important}
html[data-theme="light"] .ai-lens span{color:#64748b!important}
html[data-theme="light"] .ai-lens strong{color:#0f172a!important}
html[data-theme="light"] .ai-intelligence-row{background:#f8fafc!important;border:1px solid #e2e8f0!important;color:#0f172a!important}
html[data-theme="light"] .ai-intelligence-row b{color:#0f172a!important}
html[data-theme="light"] .ai-intelligence-row span{color:#64748b!important}
html[data-theme="light"] .ai-decision-lock{background:#f1f5f9!important;color:#0f172a!important;border:1px solid #cbd5e1!important}
html[data-theme="light"] .ai-decision-lock p{color:#334155!important}
html[data-theme="light"] .ai-decision-lock a{background:#0066ff!important;color:#ffffff!important}
/* Original LLMS.TXT News authority surface (Next-Gen Compact 3-col Grid, Sleek Vector Visuals). */
.news-hub-hero{max-width:900px!important;margin-inline:auto!important;text-align:center}.news-hub-hero .hero-actions{justify-content:center}
.news-grid{width:min(1320px,calc(100% - 48px));margin:28px auto 90px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.news-card{position:relative;display:flex;flex-direction:column;border-radius:20px;overflow:hidden;background:linear-gradient(175deg, rgba(30, 33, 42, 0.95) 0%, rgba(22, 24, 32, 0.98) 100%)!important;border:1px solid var(--theme-border, rgba(255, 255, 255, 0.1))!important;box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.12), 0 12px 36px -8px rgba(0,0,0,0.5)!important;transition:transform 0.28s cubic-bezier(0.16,1,0.3,1),box-shadow 0.28s cubic-bezier(0.16,1,0.3,1),border-color 0.28s ease;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.news-card:hover{transform:translateY(-5px);box-shadow:0 20px 48px -10px rgba(0,0,0,0.7), 0 0 24px -2px rgba(56,189,248,0.25)!important;border-color:rgba(56,189,248,0.5)!important}
.news-card:nth-child(4n + 1){border-top:3.5px solid #0066ff!important}
.news-card:nth-child(4n + 2){border-top:3.5px solid #8b5cf6!important}
.news-card:nth-child(4n + 3){border-top:3.5px solid #10b981!important}
.news-card:nth-child(4n + 4){border-top:3.5px solid #f59e0b!important}
.news-card-image{position:relative;display:block;aspect-ratio:16/9;background:#16171e;overflow:hidden;border-bottom:1px solid var(--theme-border, rgba(255,255,255,0.08))}
.news-card-image::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 65%,rgba(10,14,23,0.35) 100%);pointer-events:none}
.news-card-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 0.45s cubic-bezier(0.16,1,0.3,1),filter 0.45s ease}
.news-card:hover .news-card-image img{transform:scale(1.035)}
.news-card-body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.news-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}
.news-topic-pill{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size: 15px;font-weight:800;letter-spacing:0.05em;text-transform:uppercase;background:rgba(56,189,248,0.12);color:#38bdf8;border:1px solid rgba(56,189,248,0.28);box-shadow:0 0 12px -2px rgba(56,189,248,0.25)}
.news-topic-pill::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}
.news-meta time{font-size: 15px;font-weight:600;color:var(--theme-text-secondary, #94a3b8);letter-spacing:0.02em}
.news-read-time{margin-left:auto;font-size: 15px;font-weight:600;color:var(--theme-text-secondary, #94a3b8);display:inline-flex;align-items:center;gap:4px}
.news-card h2{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Roboto,sans-serif;font-size:16.5px;font-weight:700;line-height:1.38;letter-spacing:-0.02em;margin:0 0 10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--theme-text-primary, #f8fafc)!important}
.news-card h2 a{color:inherit;text-decoration:none;transition:color 0.15s ease}
.news-card h2 a:hover{color:#38bdf8!important}
.news-card p{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,sans-serif;color:var(--theme-text-secondary, #cbd5e1)!important;font-size: 15px;line-height:1.6;margin:0 0 18px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.news-card-footer{margin-top:auto;padding-top:14px;border-top:1px solid var(--theme-border, rgba(255,255,255,0.08));display:flex;align-items:center;justify-content:space-between}
.news-read{display:inline-flex;align-items:center;gap:6px;font-size: 14.5px;font-weight:800;letter-spacing:0.03em;color:#38bdf8;text-decoration:none;transition:all 0.2s ease}
.news-read .arrow{display:inline-block;transition:transform 0.2s ease}
.news-card:hover .news-read .arrow{transform:translateX(4px)}
html[data-theme="light"] .news-card{background:#ffffff!important;border:1px solid #e2e8f0!important;box-shadow:0 4px 20px rgba(0,0,0,0.05)!important}
html[data-theme="light"] .news-card h2{color:#0f172a!important}
html[data-theme="light"] .news-card p{color:#475569!important}
html[data-theme="light"] .news-card-image{background:#f1f5f9!important;border-bottom-color:#e2e8f0!important}
html[data-theme="light"] .news-meta time,html[data-theme="light"] .news-read-time{color:#64748b!important}
html[data-theme="light"] .news-card-footer{border-top-color:#e2e8f0!important}
.news-policy-strip{margin-bottom:72px!important}
.news-article{width:min(860px,calc(100% - 48px));margin:0 auto 80px}
.news-article .breadcrumbs{width:auto;margin:24px 0 16px;padding:0}
.news-hero{max-width:860px;padding:32px 0 24px}
.news-hero h1{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Roboto,sans-serif;font-size:clamp(30px,3.6vw,44px);font-weight:800;line-height:1.18;letter-spacing:-0.03em;margin:16px 0 16px;color:var(--theme-text-strong, #ffffff)}
.news-hero>p{max-width:820px;font-size:18px;line-height:1.65;color:var(--theme-text-secondary, #94a3b8);margin:0 0 20px}
.news-cover{width:100%;max-width:860px;height:auto;aspect-ratio:16/9;border-radius:16px;border:1px solid var(--theme-border, rgba(255,255,255,0.1));display:block;margin:24px auto 36px;box-shadow:0 12px 36px rgba(0,0,0,0.5)}
.news-body{width:100%;margin:36px auto}
.news-body section{margin:0 0 38px}
.news-body h2{font-size:clamp(22px,2.5vw,26px);font-weight:800;letter-spacing:-0.025em;line-height:1.3;margin:0 0 14px;color:var(--theme-text-strong, #ffffff);padding-bottom:10px;border-bottom:1px solid var(--theme-border, rgba(255,255,255,0.08))}
.news-body p{font-size:17.5px;line-height:1.8;color:var(--theme-text-secondary, #cbd5e1);margin:0 0 20px}
.news-body li{font-size:17px;line-height:1.75;color:var(--theme-text-secondary, #cbd5e1);margin-bottom:10px}
.news-actions ol{padding-left:24px;margin:16px 0 28px}
.news-boundary{border-left:3px solid #38bdf8;background:rgba(56,189,248,0.04);border-radius:0 12px 12px 0;padding:16px 20px;margin:36px 0}
.news-boundary b{font-size: 15px;letter-spacing:.1em;color:#38bdf8;display:block;margin-bottom:6px}
.news-boundary p{margin:0;font-size:14.5px;line-height:1.65;color:var(--theme-text-secondary, #94a3b8)}
.news-tags{display:flex;gap:8px;flex-wrap:wrap;margin:32px 0}
.news-tags span{border:1px solid var(--theme-border, rgba(255,255,255,0.12));background:rgba(255,255,255,0.04);color:var(--theme-text-secondary, #94a3b8);border-radius:999px;padding:6px 12px;font-size: 15px;font-weight:600}
.news-source{border-top:1px solid var(--theme-border, rgba(255,255,255,0.08));padding-top:24px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
.news-source p{font-size: 15px;color:var(--theme-text-secondary, #94a3b8);margin:0}
.news-source a{font-weight:700;color:#38bdf8;text-decoration:underline;text-underline-offset:3px}
.news-cta{margin:54px auto 0;max-width:860px;border-radius:20px;background:linear-gradient(135deg,rgba(30,35,48,0.9) 0%,rgba(20,24,34,0.95) 100%);color:var(--theme-text-strong, #fff);padding:36px;border:1px solid var(--theme-border, rgba(255,255,255,0.12));box-shadow:0 16px 40px rgba(0,0,0,0.4)}
.news-cta h2{font-size:clamp(24px,3vw,32px);line-height:1.2;letter-spacing:-.03em;margin:0 0 12px;color:var(--theme-text-strong, #ffffff);border:none;padding:0}
.news-cta p{color:var(--theme-text-secondary, #cbd5e1);line-height:1.65;font-size:16px;max-width:680px;margin:0 0 18px}
.news-cta .primary{display:inline-flex;min-height:46px;align-items:center;background:#2563eb!important;color:var(--theme-text-strong, #ffffff)!important;border-radius:999px;padding:0 22px;text-decoration:none;font-weight:700;font-size:14.5px;transition:background 0.15s ease}
.news-cta .primary:hover{background:#1d4ed8!important}
.ai-lens-grid{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:14px!important;margin:20px 0!important}
@media(max-width:1400px){.ai-lens-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@media(max-width:1100px){.ai-lens-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:1200px){.news-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}}
@media(max-width:1080px){.primary-nav{gap:14px}.primary-nav a{font-size: 15px}.nav-scan-cta{display:none}.px-value-strip{grid-template-columns:repeat(2,1fr)}}
@media(max-width:960px){.primary-nav{display:none!important}.px-report-boundary{grid-template-columns:1fr!important;max-width:560px!important;margin:0 auto!important}.px-delivery-grid{grid-template-columns:repeat(2,1fr)}.ai-decision-map-head{display:block}.ai-decision-map-head p{margin-top:12px}.ai-intelligence-row{grid-template-columns:1fr 1fr}.ai-intelligence-row b{grid-column:1/-1}.ai-decision-lock{align-items:stretch;flex-direction:column;gap:14px}.news-hero{padding-top:48px}}
@media(max-width:768px){.ai-lens-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}.ai-lens{padding:14px!important}}
@media(max-width:680px){.news-grid{grid-template-columns:1fr!important;gap:16px;width:min(100% - 32px,1280px)}}
@media(max-width:640px){.px-report-free,.px-report-paid{padding:24px 20px;border-radius:22px}.px-delivery-grid{grid-template-columns:1fr}.px-value-strip{grid-template-columns:1fr}.ai-decision-map{padding:18px 14px;border-radius:20px}.ai-lens strong{font-size:20px}.ai-intelligence-row{display:flex;flex-wrap:wrap}.ai-intelligence-row b{width:100%}.ai-decision-lock a{width:100%}.news-article{width:min(100% - 28px,1120px)}.news-card-body{padding:16px}.news-hero h1{font-size:clamp(37px,12vw,54px)}.news-hero>p{font-size:17px}.news-body{margin-top:36px}.news-body h2{font-size:26px}.news-body p,.news-body li{font-size:16px}.news-cta{padding:27px 22px;border-radius:22px}.news-cover{border-radius:20px}}
@media(max-width:480px){.ai-lens-grid{grid-template-columns:1fr!important;gap:8px!important}.ai-lens{padding:12px!important;border-radius:10px!important}.px-report-boundary h2{font-size:28px}}
/* LLMS.TXT News Executive Architecture & Pillar Infographics */
.news-filters-bar{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:24px auto 10px;max-width:860px}
.news-filter-pill{display:inline-flex;align-items:center;padding:6px 14px;border-radius:999px;border:1px solid var(--theme-border, rgba(255,255,255,0.12));background:rgba(255,255,255,0.04);color:var(--theme-text-secondary, #cbd5e1);font-size: 14px;font-weight:700;text-decoration:none;transition:all .15s ease}
.news-filter-pill:hover{border-color:rgba(56,189,248,0.35);background:rgba(56,189,248,0.15);color:#38bdf8}
html[data-theme="dark"] .news-filter-pill{background:rgba(255,255,255,0.04);border-color:var(--theme-border, rgba(255,255,255,0.12));color:var(--theme-text-secondary, #cbd5e1)}
html[data-theme="dark"] .news-filter-pill:hover{background:rgba(56,189,248,0.15);border-color:rgba(56,189,248,0.35);color:#38bdf8}
.news-topic-pill{background:rgba(37,99,235,0.08);color:#2563eb;padding:2px 8px;border-radius:6px;font-weight:700}
html[data-theme="dark"] .news-topic-pill{background:rgba(56,189,248,0.15);color:#38bdf8}
.news-read-time{display:inline-flex;align-items:center;gap:4px;color:var(--hh-muted)}
.nine-pillars-grid {
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
gap: 16px !important;
margin: 22px 0 34px !important;
}
@media (max-width: 640px) {
.nine-pillars-grid {
grid-template-columns: 1fr !important;
}
}
.pillar-card {
padding: 22px 24px;
border-radius: 18px;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.1)) !important;
background: linear-gradient(175deg, rgba(20, 24, 35, 0.92) 0%, rgba(11, 14, 21, 0.98) 100%) !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.12), 0 10px 28px -6px rgba(0, 0, 0, 0.5) !important;
transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease;
display: flex;
flex-direction: column;
}
.pillar-card:hover {
transform: translateY(-4px) !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.25), 0 18px 40px -10px rgba(0, 102, 255, 0.25), 0 0 20px -4px rgba(56, 189, 248, 0.2) !important;
}
.pillar-card strong {
display: block;
font-size: 15px;
font-weight: 800;
margin-bottom: 8px;
color: var(--theme-text-strong, #ffffff) !important;
letter-spacing: .02em;
}
.pillar-card p {
margin: 0;
font-size: 15px;
line-height: 1.6;
color: var(--theme-text-secondary, #cbd5e1) !important;
}
/* 9 Pillars & Model Comparison 4-Color + Secondary Border System */
.nine-pillars-grid .pillar-card:nth-child(9n + 1) { border: 1.5px solid rgba(0, 102, 255, 0.4) !important; border-top: 3.5px solid #0066ff !important; box-shadow: 0 0 20px -4px rgba(0, 102, 255, 0.28) !important; }
.nine-pillars-grid .pillar-card:nth-child(9n + 2) { border: 1.5px solid rgba(139, 92, 246, 0.4) !important; border-top: 3.5px solid #8b5cf6 !important; box-shadow: 0 0 20px -4px rgba(139, 92, 246, 0.28) !important; }
.nine-pillars-grid .pillar-card:nth-child(9n + 3) { border: 1.5px solid rgba(16, 185, 129, 0.4) !important; border-top: 3.5px solid #10b981 !important; box-shadow: 0 0 20px -4px rgba(16, 185, 129, 0.28) !important; }
.nine-pillars-grid .pillar-card:nth-child(9n + 4) { border: 1.5px solid rgba(245, 158, 11, 0.4) !important; border-top: 3.5px solid #f59e0b !important; box-shadow: 0 0 20px -4px rgba(245, 158, 11, 0.28) !important; }
.nine-pillars-grid .pillar-card:nth-child(9n + 5) { border: 1.5px solid rgba(6, 182, 212, 0.4) !important; border-top: 3.5px solid #06b6d4 !important; box-shadow: 0 0 20px -4px rgba(6, 182, 212, 0.28) !important; }
.nine-pillars-grid .pillar-card:nth-child(9n + 6) { border: 1.5px solid rgba(236, 72, 153, 0.4) !important; border-top: 3.5px solid #ec4899 !important; box-shadow: 0 0 20px -4px rgba(236, 72, 153, 0.28) !important; }
.nine-pillars-grid .pillar-card:nth-child(9n + 7) { border: 1.5px solid rgba(20, 184, 166, 0.4) !important; border-top: 3.5px solid #14b8a6 !important; box-shadow: 0 0 20px -4px rgba(20, 184, 166, 0.28) !important; }
.nine-pillars-grid .pillar-card:nth-child(9n + 8) { border: 1.5px solid rgba(249, 115, 22, 0.4) !important; border-top: 3.5px solid #f97316 !important; box-shadow: 0 0 20px -4px rgba(249, 115, 22, 0.28) !important; }
.nine-pillars-grid .pillar-card:nth-child(9n + 9) { border: 1.5px solid rgba(99, 102, 241, 0.4) !important; border-top: 3.5px solid #6366f1 !important; box-shadow: 0 0 20px -4px rgba(99, 102, 241, 0.28) !important; }
html[data-theme="light"] .pillar-card {
background: #ffffff !important;
border-color: #e2e8f0 !important;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04) !important;
}
html[data-theme="light"] .pillar-card strong {
color: #0f172a !important;
}
html[data-theme="light"] .pillar-card p {
color: #475569 !important;
}
html[data-theme="light"] .nine-pillars-grid .pillar-card:nth-child(9n + 1) { border: 1.5px solid #bfdbfe !important; border-top: 3.5px solid #0066ff !important; box-shadow: 0 2px 10px rgba(0, 102, 255, 0.08) !important; }
html[data-theme="light"] .nine-pillars-grid .pillar-card:nth-child(9n + 2) { border: 1.5px solid #ddd6fe !important; border-top: 3.5px solid #8b5cf6 !important; box-shadow: 0 2px 10px rgba(139, 92, 246, 0.08) !important; }
html[data-theme="light"] .nine-pillars-grid .pillar-card:nth-child(9n + 3) { border: 1.5px solid #a7f3d0 !important; border-top: 3.5px solid #10b981 !important; box-shadow: 0 2px 10px rgba(16, 185, 129, 0.08) !important; }
html[data-theme="light"] .nine-pillars-grid .pillar-card:nth-child(9n + 4) { border: 1.5px solid #fde68a !important; border-top: 3.5px solid #f59e0b !important; box-shadow: 0 2px 10px rgba(245, 158, 11, 0.08) !important; }
html[data-theme="light"] .nine-pillars-grid .pillar-card:nth-child(9n + 5) { border: 1.5px solid #a5f3fc !important; border-top: 3.5px solid #06b6d4 !important; box-shadow: 0 2px 10px rgba(6, 182, 212, 0.08) !important; }
html[data-theme="light"] .nine-pillars-grid .pillar-card:nth-child(9n + 6) { border: 1.5px solid #fbcfe8 !important; border-top: 3.5px solid #ec4899 !important; box-shadow: 0 2px 10px rgba(236, 72, 153, 0.08) !important; }
html[data-theme="light"] .nine-pillars-grid .pillar-card:nth-child(9n + 7) { border: 1.5px solid #99f6e4 !important; border-top: 3.5px solid #14b8a6 !important; box-shadow: 0 2px 10px rgba(20, 184, 166, 0.08) !important; }
html[data-theme="light"] .nine-pillars-grid .pillar-card:nth-child(9n + 8) { border: 1.5px solid #fed7aa !important; border-top: 3.5px solid #f97316 !important; box-shadow: 0 2px 10px rgba(249, 115, 22, 0.08) !important; }
html[data-theme="light"] .nine-pillars-grid .pillar-card:nth-child(9n + 9) { border: 1.5px solid #c7d2fe !important; border-top: 3.5px solid #6366f1 !important; box-shadow: 0 2px 10px rgba(99, 102, 241, 0.08) !important; }
html[data-theme="light"] .nine-pillars-grid .pillar-card h3 { color: #0f172a !important; }
html[data-theme="light"] .nine-pillars-grid .pillar-card p { color: #475569 !important; }
.pillar-target {
font-family: monospace;
font-size: 14px;
color: #38bdf8;
background: #14151c;
padding: 10px 14px;
border-radius: 8px;
}
html[data-theme="light"] .pillar-target {
background: #f1f5f9 !important;
color: #0284c7 !important;
border: 1px solid #e2e8f0 !important;
}
/* 5 Commercial & Operational Pillars */
.five-pillars-grid {
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 16px;
margin-top: 24px;
}
@media (max-width: 992px) {
.five-pillars-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 600px) {
.five-pillars-grid {
grid-template-columns: 1fr;
}
}
.five-pillar-card {
position: relative;
background: linear-gradient(175deg, rgba(30, 33, 42, 0.95) 0%, rgba(22, 24, 32, 0.98) 100%) !important;
border: 1.5px solid var(--theme-border, rgba(255, 255, 255, 0.1)) !important;
border-radius: 18px;
padding: 22px 18px;
display: flex;
flex-direction: column;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.five-pillar-card:hover {
transform: translateY(-3px);
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5);
}
.five-pillar-card:nth-child(1) { border-top: 3.5px solid #0066ff !important; }
.five-pillar-card:nth-child(2) { border-top: 3.5px solid #10b981 !important; }
.five-pillar-card:nth-child(3) { border-top: 3.5px solid #8b5cf6 !important; }
.five-pillar-card:nth-child(4) { border-top: 3.5px solid #f59e0b !important; }
.five-pillar-card:nth-child(5) { border-top: 3.5px solid #06b6d4 !important; }
.five-pillar-card .pillar-badge {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 11.5px;
font-weight: 800;
text-transform: uppercase;
letter-spacing: 0.08em;
padding: 3px 8px;
border-radius: 999px;
background: rgba(255, 255, 255, 0.06);
color: var(--theme-text-secondary, #94a3b8);
margin-bottom: 12px;
align-self: flex-start;
}
.five-pillar-card h3 {
font-size: 17px;
font-weight: 800;
margin: 0 0 8px;
color: var(--theme-text-strong, #ffffff) !important;
}
.five-pillar-card p {
font-size: 13.5px;
line-height: 1.55;
color: var(--theme-text-secondary, #cbd5e1) !important;
margin: 0;
}
html[data-theme="light"] .five-pillar-card {
background: #ffffff !important;
border: 1.5px solid #e2e8f0 !important;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04) !important;
}
html[data-theme="light"] .five-pillar-card h3 {
color: #0f172a !important;
}
html[data-theme="light"] .five-pillar-card p {
color: #475569 !important;
}
.nine-pillars-cta {
margin-top: 48px;
background: #1e2028;
border: 1px solid rgba(56, 189, 248, 0.35);
border-radius: 16px;
padding: 32px;
text-align: center;
}
.nine-pillars-cta h2 { color: #ffffff; font-size: 24px; margin-bottom: 12px; }
.nine-pillars-cta p { color: #cbd5e1; font-size: 16px; max-width: 680px; margin: 0 auto 24px; }
html[data-theme="light"] .nine-pillars-cta {
background: #ffffff !important;
border: 1.5px solid #e2e8f0 !important;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05) !important;
}
html[data-theme="light"] .nine-pillars-cta h2 {
color: #0f172a !important;
}
html[data-theme="light"] .nine-pillars-cta p {
color: #475569 !important;
}
html[data-theme="dark"] .news-card{background:radial-gradient(130% 100% at 50% 0%,rgba(22,28,42,0.95) 0%,rgba(10,13,19,0.98) 100%)!important;border:1px solid var(--theme-border, rgba(255,255,255,0.08))!important;box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.12),0 12px 36px -8px rgba(0,0,0,0.7)!important}
html[data-theme="dark"] .news-card:hover{transform:translateY(-5px)!important;border-color:rgba(56,189,248,0.45)!important;box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.22),0 20px 48px -12px rgba(56,189,248,0.2),0 0 20px -2px rgba(56,189,248,0.15)!important}
html[data-theme="dark"] .news-card-image{border-bottom:1px solid var(--theme-border, rgba(255,255,255,0.06))!important}
html[data-theme="dark"] .news-card h2{color:var(--theme-text-primary, #f8fafc)!important}
html[data-theme="dark"] .news-card h2 a{color:var(--theme-text-primary, #f8fafc)!important}
html[data-theme="dark"] .news-card h2 a:hover{color:#38bdf8!important}
html[data-theme="dark"] .news-card p{color:var(--theme-text-secondary, #cbd5e1)!important}
html[data-theme="dark"] .news-meta time{color:var(--theme-text-secondary, #94a3b8)!important}
html[data-theme="dark"] .news-read-time{color:var(--theme-text-secondary, #64748b)!important}
html[data-theme="dark"] .news-topic-pill{background:rgba(56,189,248,0.12)!important;color:#38bdf8!important;border-color:rgba(56,189,248,0.28)!important;box-shadow:0 0 12px -2px rgba(56,189,248,0.25)!important}
html[data-theme="dark"] .news-card-footer{border-top-color:rgba(255,255,255,0.07)!important}
html[data-theme="dark"] .news-read{color:#38bdf8!important}
.news-code-block pre{background:#07080a;color:#38bdf8;padding:20px;border-radius:14px;font-family:ui-monospace,Menlo,monospace;font-size: 15px;overflow-x:auto;border:1px solid var(--theme-border, rgba(255,255,255,0.1));line-height:1.5;margin:16px 0}
html[data-theme="light"] .news-code-block pre {
background: #f8fafc !important;
color: #0284c7 !important;
border-color: #e2e8f0 !important;
}
.news-action-list{padding-left:22px;margin:16px 0}
.news-action-list li{margin-bottom:10px;line-height:1.65;font-size:16px}
/* Dark Theme Overrides for Enterprise Funnel & Subpage Components */
html[data-theme="dark"] {
--hh-ink: #f8fafc;
--hh-muted: #94a3b8;
--hh-paper: #14151a;
--hh-panel: #1e2028;
--hh-line: #262933;
--hh-soft: #181a22;
--hh-accent: #38bdf8;
--hh-shadow: 0 20px 50px rgba(0, 0, 0, .5);
}
html[data-theme="dark"] .px-report-free {
background: var(--theme-bg-surface, #1e2028) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.08)) !important;
color: var(--theme-text-primary, #ededed) !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.08), 0 10px 30px rgba(0, 0, 0, 0.5) !important;
}
html[data-theme="dark"] .px-report-free h2 {
color: var(--theme-text-strong, #ffffff) !important;
}
html[data-theme="dark"] .px-report-free p {
color: var(--theme-text-secondary, #94a3b8) !important;
}
html[data-theme="dark"] .px-report-free li {
color: var(--theme-text-secondary, #cbd5e1) !important;
}
html[data-theme="dark"] .px-report-free .eyebrow {
color: var(--theme-text-secondary, #94a3b8) !important;
}
html[data-theme="dark"] .px-report-free a.px-outline {
border-color: rgba(255, 255, 255, 0.16) !important;
color: var(--theme-text-primary, #f8fafc) !important;
background: rgba(255, 255, 255, 0.04) !important;
}
html[data-theme="dark"] .px-report-free a.px-outline:hover {
background: rgba(255, 255, 255, 0.08) !important;
border-color: #38bdf8 !important;
color: #38bdf8 !important;
}
html[data-theme="dark"] .px-report-paid {
background: linear-gradient(180deg, rgba(37, 99, 235, 0.08) 0%, #1e2028 100%) !important;
border: 1.5px solid rgba(59, 130, 246, 0.45) !important;
color: var(--theme-text-strong, #ffffff) !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.12), 0 16px 48px rgba(0, 0, 0, 0.5) !important;
}
html[data-theme="dark"] .px-report-paid h2 {
color: var(--theme-text-strong, #ffffff) !important;
}
html[data-theme="dark"] .px-report-paid p {
color: var(--theme-text-secondary, #cbd5e1) !important;
}
html[data-theme="dark"] .px-report-paid li {
color: #f1f5f9 !important;
}
html[data-theme="dark"] .px-report-paid .eyebrow {
color: #93c5fd !important;
background: rgba(37, 99, 235, 0.25) !important;
}
html[data-theme="dark"] .px-report-paid .primary {
background: #2563eb !important;
color: var(--theme-text-strong, #ffffff) !important;
box-shadow: 0 4px 16px rgba(37, 99, 235, 0.4) !important;
}
html[data-theme="dark"] .px-report-paid .primary:hover {
background: #1d4ed8 !important;
}
html[data-theme="dark"] .px-report-enterprise {
background: linear-gradient(180deg, rgba(245, 158, 11, 0.08) 0%, #1e2028 100%) !important;
border: 1.5px solid rgba(245, 158, 11, 0.4) !important;
color: var(--theme-text-primary, #ededed) !important;
box-shadow: inset 0 1px 0 0 rgba(245, 158, 11, 0.15), 0 16px 48px rgba(0, 0, 0, 0.5) !important;
}
html[data-theme="dark"] .px-report-enterprise h2 {
color: var(--theme-text-strong, #ffffff) !important;
}
html[data-theme="dark"] .px-report-enterprise p {
color: var(--theme-text-secondary, #cbd5e1) !important;
}
html[data-theme="dark"] .px-report-enterprise li {
color: #f1f5f9 !important;
}
html[data-theme="dark"] .px-report-enterprise .eyebrow.vip-tag {
color: #fbbf24 !important;
background: rgba(245, 158, 11, 0.2) !important;
border-color: rgba(245, 158, 11, 0.4) !important;
}
html[data-theme="dark"] .px-report-enterprise .primary.enterprise-cta {
background: linear-gradient(135deg, #f59e0b, #d97706) !important;
color: #121316 !important;
box-shadow: 0 4px 16px rgba(245, 158, 11, 0.35) !important;
}
html[data-theme="dark"] .px-report-enterprise .primary.enterprise-cta:hover {
background: linear-gradient(135deg, #fbbf24, #f59e0b) !important;
}
html[data-theme="dark"] .px-delivery-grid article {
background: var(--theme-bg-surface, #1e2028);
border-color: #262933;
color: #f1f5f9;
}
html[data-theme="dark"] .px-delivery-grid article b {
background: #1e2330;
color: #38bdf8;
}
html[data-theme="dark"] .px-value-strip > div {
background: #12151b;
color: #f1f5f9;
}
html[data-theme="dark"] .px-value-strip span {
color: var(--theme-text-secondary, #94a3b8);
}
html[data-theme="dark"] .ai-decision-map {
background: linear-gradient(175deg, rgba(20, 24, 35, 0.88) 0%, rgba(11, 14, 21, 0.96) 100%) !important;
backdrop-filter: blur(24px) saturate(140%) !important;
-webkit-backdrop-filter: blur(24px) saturate(140%) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.09)) !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.12), 0 16px 40px -10px rgba(0, 0, 0, 0.6) !important;
}
html[data-theme="dark"] .ai-lens {
background: linear-gradient(175deg, rgba(20, 24, 35, 0.8) 0%, rgba(12, 15, 22, 0.95) 100%) !important;
backdrop-filter: blur(16px) saturate(140%) !important;
-webkit-backdrop-filter: blur(16px) saturate(140%) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.08)) !important;
border-radius: 14px !important;
color: #f1f5f9 !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 6px 20px -4px rgba(0, 0, 0, 0.4) !important;
transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease, box-shadow 0.3s ease !important;
}
html[data-theme="dark"] .ai-lens:hover {
transform: translateY(-3px) !important;
border-color: rgba(56, 189, 248, 0.45) !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.22), 0 14px 28px -6px rgba(0, 102, 255, 0.25) !important;
}
.ai-lens {
display: flex !important;
flex-direction: column !important;
justify-content: space-between !important;
position: relative !important;
min-height: 105px !important;
padding: 12px 14px !important;
border-radius: 14px !important;
box-sizing: border-box !important;
transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
.ai-lens-head {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
margin-bottom: 6px !important;
}
.ai-lens-head span {
font-size: 15px !important;
font-weight: 800 !important;
letter-spacing: 0.05em !important;
}
.lens-status-tag {
font-size: 9.5px !important;
font-weight: 800 !important;
padding: 2px 7px !important;
border-radius: 999px !important;
text-transform: uppercase !important;
letter-spacing: 0.04em !important;
}
.ai-lens strong {
display: block !important;
font-size: 26px !important;
font-weight: 900 !important;
line-height: 1.1 !important;
margin: 4px 0 8px !important;
}
.ai-lens-meter {
height: 4px !important;
background: rgba(255, 255, 255, 0.1) !important;
border-radius: 999px !important;
overflow: hidden !important;
}
.ai-lens-meter i {
display: block !important;
height: 100% !important;
border-radius: 999px !important;
transition: width 0.4s ease !important;
}
/* Green Tier (İyi / 80+) */
html[data-theme="dark"] .ai-lens.ai-lens-tier-green, html:not([data-theme="light"]) .ai-lens.ai-lens-tier-green {
border: 1px solid rgba(16, 185, 129, 0.4) !important;
border-top: 3.5px solid #10b981 !important;
box-shadow: 0 0 20px -4px rgba(16, 185, 129, 0.35), inset 0 1px 0 rgba(16, 185, 129, 0.2) !important;
}
html[data-theme="dark"] .ai-lens.ai-lens-tier-green strong, html:not([data-theme="light"]) .ai-lens.ai-lens-tier-green strong, strong.score-green {
color: #10b981 !important;
text-shadow: 0 0 16px rgba(16, 185, 129, 0.4) !important;
}
html[data-theme="light"] .ai-lens.ai-lens-tier-green {
background: #ffffff !important;
border: 1px solid #e2e8f0 !important;
border-top: 3.5px solid #10b981 !important;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.03) !important;
color: #0f172a !important;
}
html[data-theme="light"] .ai-lens.ai-lens-tier-green strong {
color: #059669 !important;
text-shadow: none !important;
}
.lens-status-tag.tag-green, .lens-tier.tier-green {
color: #34d399 !important;
background: rgba(16, 185, 129, 0.18) !important;
border: 1px solid rgba(16, 185, 129, 0.35) !important;
}
html[data-theme="light"] .lens-status-tag.tag-green, html[data-theme="light"] .lens-tier.tier-green {
color: #065f46 !important;
background: #ecfdf5 !important;
border: 1px solid #a7f3d0 !important;
}
.ai-lens-meter i.bar-green, .lens-meter i.bar-green {
background: linear-gradient(90deg, #059669, #10b981) !important;
box-shadow: 0 0 10px rgba(16, 185, 129, 0.5) !important;
}
html[data-theme="light"] .ai-lens-meter i.bar-green, html[data-theme="light"] .lens-meter i.bar-green {
box-shadow: none !important;
}
/* Yellow Tier (Orta / 65-79) */
html[data-theme="dark"] .ai-lens.ai-lens-tier-yellow, html:not([data-theme="light"]) .ai-lens.ai-lens-tier-yellow {
border: 1px solid rgba(234, 179, 8, 0.4) !important;
border-top: 3.5px solid #eab308 !important;
box-shadow: 0 0 20px -4px rgba(234, 179, 8, 0.35), inset 0 1px 0 rgba(234, 179, 8, 0.2) !important;
}
html[data-theme="dark"] .ai-lens.ai-lens-tier-yellow strong, html:not([data-theme="light"]) .ai-lens.ai-lens-tier-yellow strong, strong.score-yellow {
color: #eab308 !important;
text-shadow: 0 0 16px rgba(234, 179, 8, 0.4) !important;
}
html[data-theme="light"] .ai-lens.ai-lens-tier-yellow {
background: #ffffff !important;
border: 1px solid #e2e8f0 !important;
border-top: 3.5px solid #eab308 !important;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.03) !important;
color: #0f172a !important;
}
html[data-theme="light"] .ai-lens.ai-lens-tier-yellow strong {
color: #ca8a04 !important;
text-shadow: none !important;
}
.lens-status-tag.tag-yellow, .lens-tier.tier-yellow {
color: #fde047 !important;
background: rgba(234, 179, 8, 0.18) !important;
border: 1px solid rgba(234, 179, 8, 0.35) !important;
}
html[data-theme="light"] .lens-status-tag.tag-yellow, html[data-theme="light"] .lens-tier.tier-yellow {
color: #854d0e !important;
background: #fefce8 !important;
border: 1px solid #fef08a !important;
}
.ai-lens-meter i.bar-yellow, .lens-meter i.bar-yellow {
background: linear-gradient(90deg, #ca8a04, #eab308) !important;
box-shadow: 0 0 10px rgba(234, 179, 8, 0.5) !important;
}
html[data-theme="light"] .ai-lens-meter i.bar-yellow, html[data-theme="light"] .lens-meter i.bar-yellow {
box-shadow: none !important;
}
/* Orange Tier (Düşük / 45-64) */
html[data-theme="dark"] .ai-lens.ai-lens-tier-orange, html:not([data-theme="light"]) .ai-lens.ai-lens-tier-orange {
border: 1px solid rgba(249, 115, 22, 0.4) !important;
border-top: 3.5px solid #f97316 !important;
box-shadow: 0 0 20px -4px rgba(249, 115, 22, 0.35), inset 0 1px 0 rgba(249, 115, 22, 0.2) !important;
}
html[data-theme="dark"] .ai-lens.ai-lens-tier-orange strong, html:not([data-theme="light"]) .ai-lens.ai-lens-tier-orange strong, strong.score-orange {
color: #f97316 !important;
text-shadow: 0 0 16px rgba(249, 115, 22, 0.4) !important;
}
html[data-theme="light"] .ai-lens.ai-lens-tier-orange {
background: #ffffff !important;
border: 1px solid #e2e8f0 !important;
border-top: 3.5px solid #f97316 !important;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.03) !important;
color: #0f172a !important;
}
html[data-theme="light"] .ai-lens.ai-lens-tier-orange strong {
color: #ea580c !important;
text-shadow: none !important;
}
.lens-status-tag.tag-orange, .lens-tier.tier-orange {
color: #fdba74 !important;
background: rgba(249, 115, 22, 0.18) !important;
border: 1px solid rgba(249, 115, 22, 0.35) !important;
}
html[data-theme="light"] .lens-status-tag.tag-orange, html[data-theme="light"] .lens-tier.tier-orange {
color: #9a3412 !important;
background: #fff7ed !important;
border: 1px solid #fed7aa !important;
}
.ai-lens-meter i.bar-orange, .lens-meter i.bar-orange {
background: linear-gradient(90deg, #ea580c, #f97316) !important;
box-shadow: 0 0 10px rgba(249, 115, 22, 0.5) !important;
}
html[data-theme="light"] .ai-lens-meter i.bar-orange, html[data-theme="light"] .lens-meter i.bar-orange {
box-shadow: none !important;
}
/* Red Tier (Kritik / <45) */
html[data-theme="dark"] .ai-lens.ai-lens-tier-red, html:not([data-theme="light"]) .ai-lens.ai-lens-tier-red {
border: 1px solid rgba(239, 68, 68, 0.4) !important;
border-top: 3.5px solid #ef4444 !important;
box-shadow: 0 0 20px -4px rgba(239, 68, 68, 0.35), inset 0 1px 0 rgba(239, 68, 68, 0.2) !important;
}
html[data-theme="dark"] .ai-lens.ai-lens-tier-red strong, html:not([data-theme="light"]) .ai-lens.ai-lens-tier-red strong, strong.score-red {
color: #ef4444 !important;
text-shadow: 0 0 16px rgba(239, 68, 68, 0.4) !important;
}
html[data-theme="light"] .ai-lens.ai-lens-tier-red {
background: #ffffff !important;
border: 1px solid #e2e8f0 !important;
border-top: 3.5px solid #ef4444 !important;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.03) !important;
color: #0f172a !important;
}
html[data-theme="light"] .ai-lens.ai-lens-tier-red strong {
color: #dc2626 !important;
text-shadow: none !important;
}
.lens-status-tag.tag-red, .lens-tier.tier-red {
color: #fca5a5 !important;
background: rgba(239, 68, 68, 0.18) !important;
border: 1px solid rgba(239, 68, 68, 0.35) !important;
}
html[data-theme="light"] .lens-status-tag.tag-red, html[data-theme="light"] .lens-tier.tier-red {
color: #991b1b !important;
background: #fef2f2 !important;
border: 1px solid #fecaca !important;
}
.ai-lens-meter i.bar-red, .lens-meter i.bar-red {
background: linear-gradient(90deg, #dc2626, #ef4444) !important;
box-shadow: 0 0 10px rgba(239, 68, 68, 0.5) !important;
}
html[data-theme="light"] .ai-lens-meter i.bar-red, html[data-theme="light"] .lens-meter i.bar-red {
box-shadow: none !important;
}
/* Status Pills in Priority Rows */
.status-pill {
font-size: 15px !important;
font-weight: 800 !important;
padding: 3px 10px !important;
border-radius: 999px !important;
display: inline-flex !important;
align-items: center !important;
gap: 4px !important;
}
.status-pill.status-green {
color: #34d399 !important;
background: rgba(16, 185, 129, 0.15) !important;
border: 1px solid rgba(16, 185, 129, 0.35) !important;
}
.status-pill.status-yellow {
color: #fde047 !important;
background: rgba(234, 179, 8, 0.15) !important;
border: 1px solid rgba(234, 179, 8, 0.35) !important;
}
.status-pill.status-red {
color: #fca5a5 !important;
background: rgba(239, 68, 68, 0.15) !important;
border: 1px solid rgba(239, 68, 68, 0.35) !important;
}
.status-pill.status-blue {
color: #38bdf8 !important;
background: rgba(56, 189, 248, 0.15) !important;
border: 1px solid rgba(56, 189, 248, 0.35) !important;
}
html[data-theme="dark"] .ai-intelligence-row {
background: rgba(18, 22, 32, 0.75) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.08)) !important;
border-radius: 12px !important;
color: #f1f5f9 !important;
}
html[data-theme="dark"] .ai-intelligence-row b {
color: var(--theme-text-strong, #ffffff) !important;
}
html[data-theme="dark"] .ai-decision-lock {
background: linear-gradient(175deg, rgba(26, 32, 46, 0.85) 0%, rgba(16, 20, 30, 0.95) 100%) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.1)) !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.12), 0 10px 24px -6px rgba(0, 0, 0, 0.5) !important;
}
html[data-theme="dark"] .authority-card {
background: linear-gradient(175deg, rgba(20, 24, 35, 0.88) 0%, rgba(11, 14, 21, 0.96) 100%) !important;
backdrop-filter: blur(24px) saturate(140%) !important;
-webkit-backdrop-filter: blur(24px) saturate(140%) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.09)) !important;
border-radius: 20px !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.14), 0 12px 32px -8px rgba(0, 0, 0, 0.6) !important;
transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease !important;
}
html[data-theme="dark"] .authority-card:hover {
transform: translateY(-5px) !important;
border-color: rgba(56, 189, 248, 0.45) !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.28), 0 20px 48px -12px rgba(0, 102, 255, 0.28), 0 0 25px -4px rgba(56, 189, 248, 0.22) !important;
}
/* High-Contrast Interactive Links across Cards in Dark Mode */
html[data-theme="dark"] .px-knowledge-step a,
html[data-theme="dark"] .px-three-step a,
html[data-theme="dark"] .px-flow-card a,
html[data-theme="dark"] .authority-card a,
html[data-theme="dark"] .news-read {
color: #38bdf8 !important;
font-weight: 700;
}
html[data-theme="dark"] .px-knowledge-step a:hover,
html[data-theme="dark"] .px-three-step a:hover,
html[data-theme="dark"] .px-flow-card a:hover,
html[data-theme="dark"] .authority-card a:hover,
html[data-theme="dark"] .news-read:hover {
color: #7dd3fc !important;
text-decoration: underline;
}
/* ==========================================================================
NEXT-GENERATION ENTERPRISE CARD & FLOW PIPELINE ARCHITECTURE (V2 PRO)
Ultra-premium frosted obsidian, cybernetic node halos, laser data-bus conduit
========================================================================== */
/* 1. Optical Data-Bus / Pipeline Conduit (Desktop) */
@media (min-width: 901px) {
.px-tool-flow:before,
.px-three-flow:before {
content: "" !important;
display: block !important;
position: absolute !important;
top: 40px !important;
left: 7% !important;
right: 7% !important;
height: 2px !important;
background: linear-gradient(90deg,
rgba(56, 189, 248, 0.05) 0%,
rgba(56, 189, 248, 0.5) 20%,
rgba(56, 189, 248, 0.9) 50%,
rgba(56, 189, 248, 0.5) 80%,
rgba(56, 189, 248, 0.05) 100%
) !important;
box-shadow: 0 0 12px rgba(56, 189, 248, 0.5), 0 0 3px rgba(56, 189, 248, 0.9) !important;
z-index: 0 !important;
pointer-events: none !important;
}
html[data-theme="light"] .px-tool-flow:before,
html[data-theme="light"] .px-three-flow:before {
background: linear-gradient(90deg,
rgba(37, 99, 235, 0.05) 0%,
rgba(37, 99, 235, 0.4) 20%,
rgba(37, 99, 235, 0.8) 50%,
rgba(37, 99, 235, 0.4) 80%,
rgba(37, 99, 235, 0.05) 100%
) !important;
box-shadow: 0 0 8px rgba(37, 99, 235, 0.25) !important;
}
}
@media (max-width: 900px) {
.px-tool-flow:before,
.px-three-flow:before {
display: none !important;
}
}
/* 2. Frosted Obsidian Glass Depth (Dark Mode) */
html[data-theme="dark"] .px-flow-card,
html[data-theme="dark"] .px-three-step,
html[data-theme="dark"] .px-engine-phase,
html[data-theme="dark"] .px-knowledge-step,
html[data-theme="dark"] .px-file-card,
html[data-theme="dark"] .px-buy-flow article {
position: relative !important;
z-index: 1 !important;
background: linear-gradient(175deg, rgba(20, 24, 35, 0.88) 0%, rgba(11, 14, 21, 0.96) 100%) !important;
backdrop-filter: blur(24px) saturate(140%) !important;
-webkit-backdrop-filter: blur(24px) saturate(140%) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.09)) !important;
border-radius: 20px !important;
box-shadow:
inset 0 1px 0 0 rgba(255, 255, 255, 0.14),
inset 0 0 20px -8px rgba(56, 189, 248, 0.05),
0 12px 32px -8px rgba(0, 0, 0, 0.6) !important;
transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1),
border-color 0.25s ease !important;
overflow: hidden !important;
}
/* Hover Physics (Dark Mode) */
html[data-theme="dark"] .px-flow-card:hover,
html[data-theme="dark"] .px-three-step:hover,
html[data-theme="dark"] .px-engine-phase:hover,
html[data-theme="dark"] .px-knowledge-step:hover,
html[data-theme="dark"] .px-file-card:hover,
html[data-theme="dark"] .px-buy-flow article:hover {
transform: translateY(-5px) !important;
border-color: rgba(56, 189, 248, 0.45) !important;
box-shadow:
inset 0 1px 0 0 rgba(255, 255, 255, 0.28),
0 20px 48px -12px rgba(0, 102, 255, 0.28),
0 0 25px -4px rgba(56, 189, 248, 0.22) !important;
}
/* 3. Light Theme Parity Surface (Clean White Executive Cards) */
html[data-theme="light"] .px-flow-card,
html[data-theme="light"] .px-three-step,
html[data-theme="light"] .px-engine-phase,
html[data-theme="light"] .px-knowledge-step,
html[data-theme="light"] .px-file-card,
html[data-theme="light"] .px-buy-flow article {
position: relative;
z-index: 1;
background: #ffffff !important;
border: 1px solid #e2e8f0 !important;
border-radius: 14px !important;
color: #0f172a !important;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
overflow: hidden;
}
html[data-theme="light"] .px-flow-card:hover,
html[data-theme="light"] .px-three-step:hover,
html[data-theme="light"] .px-engine-phase:hover,
html[data-theme="light"] .px-knowledge-step:hover,
html[data-theme="light"] .px-file-card:hover,
html[data-theme="light"] .px-buy-flow article:hover {
transform: translateY(-3px) !important;
border-color: #0284c7 !important;
box-shadow: 0 8px 20px rgba(2, 132, 199, 0.08) !important;
}
html[data-theme="light"] .px-file-card b {
color: #0f172a !important;
}
html[data-theme="light"] .px-file-card p {
color: #475569 !important;
}
html[data-theme="light"] .px-file-card .format-pill {
background: #f1f5f9 !important;
border: 1px solid #cbd5e1 !important;
color: #0369a1 !important;
}
html[data-theme="light"] .guest-delivery-contract {
background: #f8fafc !important;
border: 1px solid #e2e8f0 !important;
color: #334155 !important;
}
html[data-theme="light"] .guest-delivery-contract strong {
color: #0f172a !important;
}
/* 4. Cybernetic Concentric Instrument Node */
html[data-theme="dark"] .px-flow-card .node,
html[data-theme="dark"] .px-three-step .num {
width: 44px !important;
height: 44px !important;
border-radius: 50% !important;
display: grid !important;
place-items: center !important;
margin-bottom: 20px !important;
background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%) !important;
border: 1.5px solid rgba(56, 189, 248, 0.4) !important;
box-shadow:
0 0 0 4px #0d111a,
0 0 16px -2px rgba(56, 189, 248, 0.35),
inset 0 1px 1px 0 rgba(255, 255, 255, 0.2) !important;
color: #38bdf8 !important;
font-family: -apple-system, BlinkMacSystemFont, "SF Mono", "Fira Code", monospace !important;
font-size: 14px !important;
font-weight: 800 !important;
letter-spacing: 0.04em !important;
transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}
html[data-theme="dark"] .px-flow-card:hover .node,
html[data-theme="dark"] .px-three-step:hover .num {
transform: scale(1.08) !important;
border-color: #38bdf8 !important;
box-shadow:
0 0 0 4px #0d111a,
0 0 24px rgba(56, 189, 248, 0.65),
inset 0 0 8px rgba(56, 189, 248, 0.3) !important;
}
html[data-theme="light"] .px-flow-card .node,
html[data-theme="light"] .px-three-step .num,
:root:not([data-theme="dark"]) .px-flow-card .node,
:root:not([data-theme="dark"]) .px-three-step .num {
width: 44px !important;
height: 44px !important;
border-radius: 50% !important;
display: grid !important;
place-items: center !important;
margin-bottom: 20px !important;
background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%) !important;
border: 1.5px solid rgba(37, 99, 235, 0.35) !important;
box-shadow:
0 0 0 4px #ffffff,
0 2px 10px rgba(37, 99, 235, 0.12),
inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
color: #1d4ed8 !important;
font-family: -apple-system, BlinkMacSystemFont, "SF Mono", "Fira Code", monospace !important;
font-size: 14px !important;
font-weight: 800 !important;
letter-spacing: 0.04em !important;
transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}
html[data-theme="light"] .px-flow-card:hover .node,
html[data-theme="light"] .px-three-step:hover .num,
:root:not([data-theme="dark"]) .px-flow-card:hover .node,
:root:not([data-theme="dark"]) .px-three-step:hover .num {
transform: scale(1.06) !important;
border-color: #2563eb !important;
box-shadow:
0 0 0 4px #ffffff,
0 4px 16px rgba(37, 99, 235, 0.25) !important;
}
/* 5. Live Telemetry Status Pulse on Cards */
html[data-theme="dark"] .px-flow-card::after {
content: "" !important;
position: absolute !important;
top: 20px !important;
right: 20px !important;
width: 6px !important;
height: 6px !important;
border-radius: 50% !important;
background: #38bdf8 !important;
box-shadow: 0 0 8px #38bdf8, 0 0 2px #ffffff !important;
opacity: 0.8 !important;
pointer-events: none !important;
}
html[data-theme="light"] .px-flow-card::after,
:root:not([data-theme="dark"]) .px-flow-card::after {
content: "" !important;
position: absolute !important;
top: 20px !important;
right: 20px !important;
width: 6px !important;
height: 6px !important;
border-radius: 50% !important;
background: #2563eb !important;
box-shadow: 0 0 6px rgba(37, 99, 235, 0.4) !important;
opacity: 0.7 !important;
pointer-events: none !important;
}
/* 6. Typography & Text Hierarchy */
html[data-theme="dark"] .px-flow-card h3,
html[data-theme="dark"] .px-three-step h3,
html[data-theme="dark"] .px-engine-phase h3,
html[data-theme="dark"] .px-knowledge-step h3 {
font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", -apple-system-headline, sans-serif !important;
font-size: 17.5px !important;
font-weight: 750 !important;
letter-spacing: -0.025em !important;
line-height: 1.25 !important;
color: var(--theme-text-strong, #ffffff) !important;
margin: 0 0 10px 0 !important;
}
html[data-theme="light"] .px-flow-card h3,
html[data-theme="light"] .px-three-step h3,
html[data-theme="light"] .px-engine-phase h3,
html[data-theme="light"] .px-knowledge-step h3,
:root:not([data-theme="dark"]) .px-flow-card h3,
:root:not([data-theme="dark"]) .px-three-step h3,
:root:not([data-theme="dark"]) .px-engine-phase h3,
:root:not([data-theme="dark"]) .px-knowledge-step h3 {
font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", -apple-system-headline, sans-serif !important;
font-size: 17.5px !important;
font-weight: 750 !important;
letter-spacing: -0.025em !important;
line-height: 1.25 !important;
color: #0f172a !important;
margin: 0 0 10px 0 !important;
}
html[data-theme="dark"] .px-flow-card p,
html[data-theme="dark"] .px-three-step p,
html[data-theme="dark"] .px-engine-phase p,
html[data-theme="dark"] .px-knowledge-step p {
font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", -apple-system-body, sans-serif !important;
font-size: 15px !important;
line-height: 1.62 !important;
color: var(--theme-text-secondary, #94a3b8) !important;
letter-spacing: -0.01em !important;
margin: 0 !important;
}
html[data-theme="light"] .px-flow-card p,
html[data-theme="light"] .px-three-step p,
html[data-theme="light"] .px-engine-phase p,
html[data-theme="light"] .px-knowledge-step p,
:root:not([data-theme="dark"]) .px-flow-card p,
:root:not([data-theme="dark"]) .px-three-step p,
:root:not([data-theme="dark"]) .px-engine-phase p,
:root:not([data-theme="dark"]) .px-knowledge-step p {
font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", -apple-system-body, sans-serif !important;
font-size: 15px !important;
line-height: 1.62 !important;
color: var(--theme-text-secondary, #475569) !important;
letter-spacing: -0.01em !important;
margin: 0 !important;
}
/* 7. Special Engine Rail Phases */
.px-engine-phase > span {
display: inline-block !important;
font-family: -apple-system, BlinkMacSystemFont, "SF Mono", monospace !important;
font-size: 15px !important;
font-weight: 800 !important;
letter-spacing: 0.1em !important;
color: #38bdf8 !important;
background: rgba(56, 189, 248, 0.12) !important;
padding: 3px 8px !important;
border-radius: 6px !important;
margin-bottom: 12px !important;
}
html[data-theme="light"] .px-engine-phase > span,
:root:not([data-theme="dark"]) .px-engine-phase > span {
color: #1d4ed8 !important;
background: rgba(37, 99, 235, 0.1) !important;
}
.px-engine-phase li {
font-size: 15px !important;
line-height: 1.5 !important;
color: var(--theme-text-secondary, #94a3b8) !important;
}
.px-engine-phase li b {
color: #38bdf8 !important;
font-family: monospace !important;
font-size: 15px !important;
background: rgba(56, 189, 248, 0.1) !important;
padding: 1px 5px !important;
border-radius: 4px !important;
}
html[data-theme="light"] .px-engine-phase li {
color: var(--theme-text-secondary, #475569) !important;
}
html[data-theme="light"] .px-engine-phase li b {
color: #1d4ed8 !important;
background: rgba(37, 99, 235, 0.08) !important;
}
.px-engine-outcome {
margin-top: 18px !important;
padding: 10px 14px !important;
border-radius: 10px !important;
border: 1px solid rgba(56, 189, 248, 0.25) !important;
background: rgba(56, 189, 248, 0.06) !important;
color: #38bdf8 !important;
font-size: 15px !important;
font-weight: 750 !important;
letter-spacing: 0.02em !important;
line-height: 1.45 !important;
}
html[data-theme="light"] .px-engine-outcome,
:root:not([data-theme="dark"]) .px-engine-outcome {
border-color: rgba(37, 99, 235, 0.25) !important;
background: rgba(37, 99, 235, 0.06) !important;
color: #1d4ed8 !important;
}
/* 8. Paid 3-Step Highlight */
html[data-theme="dark"] .px-three-step.paid {
background: linear-gradient(175deg, rgba(30, 58, 138, 0.4) 0%, rgba(15, 23, 42, 0.98) 100%) !important;
border: 1.5px solid #3b82f6 !important;
box-shadow:
inset 0 1px 0 0 rgba(255, 255, 255, 0.25),
0 16px 40px -10px rgba(37, 99, 235, 0.35) !important;
}
html[data-theme="dark"] .px-three-step.paid .num {
background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
color: var(--theme-text-strong, #ffffff) !important;
border-color: #60a5fa !important;
box-shadow: 0 0 20px rgba(59, 130, 246, 0.6) !important;
}
html[data-theme="dark"] .px-three-step.paid a {
color: #60a5fa !important;
}
/* 9. Specialist Lenses Glassmorphism */
.px-lens {
position: relative !important;
border-radius: 16px !important;
padding: 18px !important;
transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease !important;
}
html[data-theme="light"] .px-lens {
background: #ffffff !important;
border: 1px solid #e2e8f0 !important;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04) !important;
color: #0f172a !important;
}
html[data-theme="light"] .px-lens:hover {
transform: translateY(-3px) !important;
border-color: #0066ff !important;
box-shadow: 0 8px 24px rgba(0, 102, 255, 0.08) !important;
background: #f8fafc !important;
}
html[data-theme="light"] .px-lens b {
color: #0284c7 !important;
font-family: -apple-system, BlinkMacSystemFont, "SF Mono", monospace !important;
font-size: 15px !important;
letter-spacing: 0.08em !important;
}
html[data-theme="light"] .px-lens span {
color: #475569 !important;
font-size: 15px !important;
}
html[data-theme="dark"] .px-lens {
background: linear-gradient(175deg, rgba(20, 24, 35, 0.7) 0%, rgba(12, 15, 22, 0.9) 100%) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.08)) !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 8px 24px -6px rgba(0, 0, 0, 0.4) !important;
}
html[data-theme="dark"] .px-lens:hover {
transform: translateY(-3px) !important;
border-color: rgba(56, 189, 248, 0.4) !important;
box-shadow: 0 14px 30px -8px rgba(0, 102, 255, 0.25) !important;
}
html[data-theme="dark"] .px-lens b {
color: #38bdf8 !important;
font-family: -apple-system, BlinkMacSystemFont, "SF Mono", monospace !important;
font-size: 15px !important;
letter-spacing: 0.08em !important;
}
html[data-theme="dark"] .px-lens span {
color: var(--theme-text-secondary, #94a3b8) !important;
font-size: 15px !important;
}
/* 10. 30+ File Versioned ZIP Manifest Cards & Delivery Files (Next-Gen Obsidian) */
.px-file-card,
.px-file {
position: relative !important;
border-radius: 16px !important;
padding: 16px 18px !important;
display: flex !important;
flex-direction: column !important;
transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.2s ease, box-shadow 0.25s ease !important;
}
.px-file-card-head {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 10px !important;
margin-bottom: 8px !important;
}
.px-file-card b {
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace !important;
font-size: 14.5px !important;
font-weight: 750 !important;
color: var(--theme-text-primary, #f8fafc) !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
min-width: 0 !important;
flex: 1 1 auto !important;
letter-spacing: -0.01em !important;
}
.px-file-card .format-pill {
display: inline-flex !important;
align-items: center !important;
gap: 5px !important;
padding: 2px 8px !important;
border-radius: 9999px !important;
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace !important;
font-size: 15px !important;
font-weight: 800 !important;
letter-spacing: 0.05em !important;
text-transform: uppercase !important;
flex: 0 0 auto !important;
white-space: nowrap !important;
background: rgba(56, 189, 248, 0.08) !important;
color: #38bdf8 !important;
border: 1px solid rgba(56, 189, 248, 0.22) !important;
}
.px-file-card .format-pill::before {
content: "" !important;
display: inline-block !important;
width: 4px !important;
height: 4px !important;
border-radius: 50% !important;
background: #38bdf8 !important;
box-shadow: 0 0 5px #38bdf8 !important;
}
.px-file-card.vip .format-pill {
background: rgba(245, 158, 11, 0.08) !important;
color: #fbbf24 !important;
border: 1px solid rgba(245, 158, 11, 0.28) !important;
}
.px-file-card.vip .format-pill::before {
background: #fbbf24 !important;
box-shadow: 0 0 5px #fbbf24 !important;
}
html[data-theme="dark"] .px-file-card,
html[data-theme="dark"] .px-file {
background: #080a0f !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.07)) !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.08), 0 4px 16px -2px rgba(0, 0, 0, 0.6) !important;
}
html[data-theme="dark"] .px-file-card:hover,
html[data-theme="dark"] .px-file:hover {
transform: translateY(-2px) !important;
border-color: rgba(56, 189, 248, 0.4) !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.15), 0 10px 24px -4px rgba(0, 0, 0, 0.7), 0 0 10px -2px rgba(56, 189, 248, 0.15) !important;
}
html[data-theme="dark"] .px-file-card.vip {
border: 1px solid rgba(245, 158, 11, 0.2) !important;
box-shadow: inset 0 1px 0 0 rgba(251, 191, 36, 0.1), 0 4px 16px -2px rgba(0, 0, 0, 0.6) !important;
}
html[data-theme="dark"] .px-file-card.vip:hover {
border-color: rgba(245, 158, 11, 0.45) !important;
box-shadow: inset 0 1px 0 0 rgba(251, 191, 36, 0.22), 0 10px 24px -4px rgba(0, 0, 0, 0.7), 0 0 12px -2px rgba(245, 158, 11, 0.18) !important;
}
html[data-theme="dark"] .px-delivery-category-title {
color: var(--theme-text-strong, #ffffff) !important;
border-bottom: 1px solid var(--theme-border, rgba(255, 255, 255, 0.08)) !important;
font-size: 16px !important;
font-weight: 800 !important;
letter-spacing: -0.01em !important;
}
html[data-theme="dark"] .px-delivery-category-title .badge {
display: inline-flex !important;
align-items: center !important;
gap: 6px !important;
padding: 4px 12px !important;
border-radius: 9999px !important;
font-size: 15px !important;
font-weight: 700 !important;
background: rgba(255, 255, 255, 0.05) !important;
color: var(--theme-text-secondary, #cbd5e1) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.12)) !important;
}
html[data-theme="dark"] .px-delivery-category-title.vip .badge {
background: rgba(245, 158, 11, 0.08) !important;
color: #fbbf24 !important;
border: 1px solid rgba(245, 158, 11, 0.28) !important;
}
/* 11. Trust Strip Interactive Polish */
.px-value-strip > div {
transition: transform 0.25s ease, background 0.25s ease !important;
}
html[data-theme="dark"] .px-value-strip > div {
background: linear-gradient(175deg, rgba(20, 24, 35, 0.8) 0%, rgba(12, 15, 22, 0.95) 100%) !important;
}
html[data-theme="dark"] .px-value-strip > div:hover {
background: linear-gradient(175deg, rgba(28, 34, 48, 0.9) 0%, rgba(16, 20, 30, 0.98) 100%) !important;
}
/* Clean Media Query Fallback for Systems with Dark Preference */
@media (prefers-color-scheme: dark) {
html:not([data-theme="light"]) .px-flow-card,
html:not([data-theme="light"]) .px-three-step,
html:not([data-theme="light"]) .px-engine-phase,
html:not([data-theme="light"]) .px-knowledge-step,
html:not([data-theme="light"]) .px-file-card,
html:not([data-theme="light"]) .px-buy-flow article {
position: relative !important;
z-index: 1 !important;
background: linear-gradient(175deg, rgba(20, 24, 35, 0.88) 0%, rgba(11, 14, 21, 0.96) 100%) !important;
backdrop-filter: blur(24px) saturate(140%) !important;
-webkit-backdrop-filter: blur(24px) saturate(140%) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.09)) !important;
border-radius: 20px !important;
box-shadow:
inset 0 1px 0 0 rgba(255, 255, 255, 0.14),
inset 0 0 20px -8px rgba(56, 189, 248, 0.05),
0 12px 32px -8px rgba(0, 0, 0, 0.6) !important;
transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1),
border-color 0.25s ease !important;
overflow: hidden !important;
}
html:not([data-theme="light"]) .px-flow-card:hover,
html:not([data-theme="light"]) .px-three-step:hover,
html:not([data-theme="light"]) .px-engine-phase:hover,
html:not([data-theme="light"]) .px-knowledge-step:hover,
html:not([data-theme="light"]) .px-file-card:hover,
html:not([data-theme="light"]) .px-buy-flow article:hover {
transform: translateY(-5px) !important;
border-color: rgba(56, 189, 248, 0.45) !important;
box-shadow:
inset 0 1px 0 0 rgba(255, 255, 255, 0.28),
0 20px 48px -12px rgba(0, 102, 255, 0.28),
0 0 25px -4px rgba(56, 189, 248, 0.22) !important;
}
html:not([data-theme="light"]) .px-flow-card .node,
html:not([data-theme="light"]) .px-three-step .num {
width: 44px !important;
height: 44px !important;
border-radius: 50% !important;
display: grid !important;
place-items: center !important;
margin-bottom: 20px !important;
background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%) !important;
border: 1.5px solid rgba(56, 189, 248, 0.4) !important;
box-shadow:
0 0 0 4px #0d111a,
0 0 16px -2px rgba(56, 189, 248, 0.35),
inset 0 1px 1px 0 rgba(255, 255, 255, 0.2) !important;
color: #38bdf8 !important;
font-family: -apple-system, BlinkMacSystemFont, "SF Mono", "Fira Code", monospace !important;
font-size: 14px !important;
font-weight: 800 !important;
letter-spacing: 0.04em !important;
transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}
html:not([data-theme="light"]) .px-flow-card:hover .node,
html:not([data-theme="light"]) .px-three-step:hover .num {
transform: scale(1.08) !important;
border-color: #38bdf8 !important;
box-shadow:
0 0 0 4px #0d111a,
0 0 24px rgba(56, 189, 248, 0.65),
inset 0 0 8px rgba(56, 189, 248, 0.3) !important;
}
html:not([data-theme="light"]) .px-flow-card::after {
content: "" !important;
position: absolute !important;
top: 20px !important;
right: 20px !important;
width: 6px !important;
height: 6px !important;
border-radius: 50% !important;
background: #38bdf8 !important;
box-shadow: 0 0 8px #38bdf8, 0 0 2px #ffffff !important;
opacity: 0.8 !important;
pointer-events: none !important;
}
html:not([data-theme="light"]) .px-flow-card h3,
html:not([data-theme="light"]) .px-three-step h3,
html:not([data-theme="light"]) .px-engine-phase h3,
html:not([data-theme="light"]) .px-knowledge-step h3 {
font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", -apple-system-headline, sans-serif !important;
font-size: 17.5px !important;
font-weight: 750 !important;
letter-spacing: -0.025em !important;
line-height: 1.25 !important;
color: var(--theme-text-strong, #ffffff) !important;
margin: 0 0 10px 0 !important;
}
html:not([data-theme="light"]) .px-flow-card p,
html:not([data-theme="light"]) .px-three-step p,
html:not([data-theme="light"]) .px-engine-phase p,
html:not([data-theme="light"]) .px-knowledge-step p {
font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", -apple-system-body, sans-serif !important;
font-size: 15px !important;
line-height: 1.62 !important;
color: var(--theme-text-secondary, #94a3b8) !important;
letter-spacing: -0.01em !important;
margin: 0 !important;
}
html:not([data-theme="light"]) .px-three-step.paid {
background: linear-gradient(175deg, rgba(30, 58, 138, 0.4) 0%, rgba(15, 23, 42, 0.98) 100%) !important;
border: 1.5px solid #3b82f6 !important;
box-shadow:
inset 0 1px 0 0 rgba(255, 255, 255, 0.25),
0 16px 40px -10px rgba(37, 99, 235, 0.35) !important;
}
html:not([data-theme="light"]) .px-three-step.paid .num {
background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
color: var(--theme-text-strong, #ffffff) !important;
border-color: #60a5fa !important;
box-shadow: 0 0 20px rgba(59, 130, 246, 0.6) !important;
}
html:not([data-theme="light"]) .px-three-step.paid a {
color: #60a5fa !important;
}
html:not([data-theme="light"]) .px-lens {
background: linear-gradient(175deg, rgba(20, 24, 35, 0.7) 0%, rgba(12, 15, 22, 0.9) 100%) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.08)) !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 8px 24px -6px rgba(0, 0, 0, 0.4) !important;
}
html:not([data-theme="light"]) .px-lens:hover {
transform: translateY(-3px) !important;
border-color: rgba(56, 189, 248, 0.4) !important;
box-shadow: 0 14px 30px -8px rgba(0, 102, 255, 0.25) !important;
}
html:not([data-theme="light"]) .px-lens b {
color: #38bdf8 !important;
font-family: -apple-system, BlinkMacSystemFont, "SF Mono", monospace !important;
font-size: 15px !important;
letter-spacing: 0.08em !important;
}
html:not([data-theme="light"]) .px-lens span {
color: var(--theme-text-secondary, #94a3b8) !important;
font-size: 15px !important;
}
html:not([data-theme="light"]) .px-file-card,
html:not([data-theme="light"]) .px-file {
background: linear-gradient(175deg, rgba(20, 24, 35, 0.75) 0%, rgba(12, 15, 22, 0.95) 100%) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.08)) !important;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.08), 0 6px 20px -4px rgba(0, 0, 0, 0.4) !important;
}
html:not([data-theme="light"]) .px-file-card:hover,
html:not([data-theme="light"]) .px-file:hover {
transform: translateY(-2px) !important;
border-color: rgba(56, 189, 248, 0.35) !important;
}
html:not([data-theme="light"]) .px-file-card.vip {
border-color: rgba(245, 158, 11, 0.25) !important;
}
html:not([data-theme="light"]) .px-file-card.vip:hover {
border-color: rgba(245, 158, 11, 0.5) !important;
box-shadow: 0 10px 25px -6px rgba(245, 158, 11, 0.2) !important;
}
html:not([data-theme="light"]) .px-value-strip > div {
background: linear-gradient(175deg, rgba(20, 24, 35, 0.8) 0%, rgba(12, 15, 22, 0.95) 100%) !important;
}
html:not([data-theme="light"]) .px-value-strip > div:hover {
background: linear-gradient(175deg, rgba(28, 34, 48, 0.9) 0%, rgba(16, 20, 30, 0.98) 100%) !important;
}
}
/* 9 Pillars & Conversion Teaser styles */
.pillar-num {
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
font-size: 15px;
font-weight: 800;
letter-spacing: 0.1em;
color: #38bdf8;
margin-bottom: 6px;
display: inline-block;
}
.pillar-footer-banner {
margin-top: 24px;
padding: 22px 26px;
border-radius: 20px;
background: linear-gradient(135deg, rgba(37,99,235,0.12) 0%, rgba(139,92,246,0.12) 100%);
border: 1px solid rgba(56,189,248,0.25);
box-shadow: 0 8px 30px rgba(0,0,0,0.5);
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
flex-wrap: wrap;
}
.pillar-footer-banner .banner-text {
display: flex;
flex-direction: column;
gap: 4px;
max-width: 800px;
}
.pillar-footer-banner .banner-text strong {
font-size: 16px;
color: var(--theme-text-strong, #ffffff);
}
.pillar-footer-banner .banner-text span {
font-size: 14px;
color: var(--theme-text-secondary, #94a3b8);
line-height: 1.5;
}
.pillar-footer-banner .banner-cta {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 44px;
padding: 0 22px;
border-radius: 999px;
background: linear-gradient(135deg, #0066ff, #2563eb);
color: var(--theme-text-strong, #ffffff) !important;
font-size: 14px;
font-weight: 800;
text-decoration: none;
white-space: nowrap;
box-shadow: 0 4px 16px rgba(37,99,235,0.4);
transition: all 0.2s ease;
}
.pillar-footer-banner .banner-cta:hover {
background: #1d4ed8;
transform: translateY(-1px);
}
.finding-conversion-teaser {
margin-top: 14px;
padding: 12px 14px;
border-radius: 12px;
background: rgba(15, 23, 42, 0.65);
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.08));
display: grid;
gap: 8px;
font-size: 15px;
line-height: 1.45;
max-width: 100%;
box-sizing: border-box;
overflow-wrap: break-word;
word-break: break-word;
}
.teaser-blueprint {
color: #93c5fd;
max-width: 100%;
box-sizing: border-box;
overflow-wrap: break-word;
word-break: break-word;
}
.teaser-blueprint strong {
color: #38bdf8;
font-weight: 700;
}
.teaser-enterprise {
color: #fcd34d;
max-width: 100%;
box-sizing: border-box;
overflow-wrap: break-word;
word-break: break-word;
}
.teaser-enterprise strong {
color: #fbbf24;
font-weight: 700;
}
.teaser-blueprint a,
.teaser-enterprise a {
display: inline-block;
max-width: 100%;
overflow-wrap: break-word;
word-break: break-word;
}
.teaser-icon {
margin-right: 6px;
display: inline-block;
}
html[data-theme="light"] .finding-conversion-teaser {
background: #f8fafc !important;
border-color: #cbd5e1 !important;
color: #1e293b !important;
}
html[data-theme="light"] .teaser-blueprint {
color: #0369a1 !important;
}
html[data-theme="light"] .teaser-blueprint strong {
color: #0284c7 !important;
}
html[data-theme="light"] .teaser-enterprise {
color: #b45309 !important;
}
html[data-theme="light"] .teaser-enterprise strong {
color: #d97706 !important;
}
html[data-theme="light"] .teaser-blueprint a,
html[data-theme="light"] .teaser-enterprise a {
color: #0284c7 !important;
}
/* ==========================================================================
THEME SWITCH COMPONENT - STRICTLY SYMBOLS ONLY (NO TEXT)
========================================================================== */
.theme-switch {
display: inline-flex !important;
align-items: center !important;
gap: 2px !important;
background: rgba(14, 18, 29, 0.9) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.12)) !important;
border-radius: 999px !important;
padding: 3px !important;
height: 32px !important;
box-sizing: border-box !important;
backdrop-filter: blur(12px) !important;
-webkit-backdrop-filter: blur(12px) !important;
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5) !important;
}
.theme-switch button {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 26px !important;
height: 24px !important;
padding: 0 !important;
border: 1px solid transparent !important;
background: transparent !important;
color: var(--theme-text-secondary, #64748b) !important;
border-radius: 999px !important;
cursor: pointer !important;
font-size: 0 !important; /* Zero out any text nodes */
line-height: 0 !important;
transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.theme-switch button:hover {
color: #f1f5f9 !important;
background: rgba(255, 255, 255, 0.08) !important;
transform: translateY(-1px) !important;
}
.theme-switch button[data-theme-choice="light"][aria-pressed="true"] {
background: rgba(245, 158, 11, 0.2) !important;
color: #fbbf24 !important;
border-color: rgba(245, 158, 11, 0.4) !important;
box-shadow: 0 0 12px rgba(245, 158, 11, 0.3) !important;
}
.theme-switch button[data-theme-choice="dark"][aria-pressed="true"] {
background: rgba(99, 102, 241, 0.24) !important;
color: #818cf8 !important;
border-color: rgba(99, 102, 241, 0.4) !important;
box-shadow: 0 0 12px rgba(99, 102, 241, 0.3) !important;
}
.theme-switch button[data-theme-choice="system"][aria-pressed="true"] {
background: rgba(56, 189, 248, 0.2) !important;
color: #38bdf8 !important;
border-color: rgba(56, 189, 248, 0.4) !important;
box-shadow: 0 0 12px rgba(56, 189, 248, 0.3) !important;
}
html[data-theme="light"] .theme-switch {
background: rgba(241, 245, 249, 0.95) !important;
border: 1px solid #cbd5e1 !important;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.06) !important;
}
html[data-theme="light"] .theme-switch button {
color: #64748b !important;
}
html[data-theme="light"] .theme-switch button:hover {
color: #0f172a !important;
background: rgba(0, 0, 0, 0.05) !important;
}
html[data-theme="light"] .theme-switch button[data-theme-choice="light"][aria-pressed="true"],
html[data-theme="light"] .theme-switch button[data-theme-choice="light"].active {
background: #ffffff !important;
color: #d97706 !important;
border-color: #fde68a !important;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}
html[data-theme="light"] .theme-switch button[data-theme-choice="dark"][aria-pressed="true"],
html[data-theme="light"] .theme-switch button[data-theme-choice="dark"].active {
background: #ffffff !important;
color: #4f46e5 !important;
border-color: #c7d2fe !important;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}
html[data-theme="light"] .theme-switch button[data-theme-choice="system"][aria-pressed="true"],
html[data-theme="light"] .theme-switch button[data-theme-choice="system"].active {
background: #ffffff !important;
color: #0284c7 !important;
border-color: #bae6fd !important;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}
.theme-switch .theme-icon {
display: block !important;
pointer-events: none !important;
transition: transform 0.2s ease !important;
}
.theme-switch button:hover .theme-icon {
transform: scale(1.15) !important;
}
/* STATUS BAR: HIDE ON IDLE, SHOW BORDERLESS COUNTER ON ACTIVE SCAN */
#scanStatus[hidden],
.status[hidden],
#scanStatus:empty,
.status:empty,
#toolStatus[hidden],
.tool-status[hidden],
#toolStatus:empty,
.tool-status:empty,
#mentionStatus[hidden],
.mention-status[hidden],
#mentionStatus:empty,
.mention-status:empty {
display: none !important;
margin: 0 !important;
padding: 0 !important;
border: none !important;
height: 0 !important;
min-height: 0 !important;
box-shadow: none !important;
background: transparent !important;
}
#scanStatus, .status {
margin-top: 18px !important;
border: none !important;
border-radius: 0 !important;
padding: 0 !important;
background: transparent !important;
box-shadow: none !important;
color: var(--theme-text-strong, #ffffff) !important;
font-size: 15px !important;
font-weight: 600 !important;
letter-spacing: -0.01em !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 12px !important;
text-align: center !important;
width: 100% !important;
}
#toolStatus, .tool-status, #mentionStatus {
margin-top: 16px !important;
border: 1px solid rgba(56, 189, 248, 0.3) !important;
border-radius: 14px !important;
padding: 14px 22px !important;
background: var(--theme-bg-surface, #181a22) !important;
color: var(--theme-text-strong, #ffffff) !important;
font-size: 15px !important;
font-weight: 600 !important;
letter-spacing: -0.01em !important;
box-shadow: 0 4px 24px -4px rgba(0, 102, 255, 0.25) !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 12px !important;
text-align: center !important;
}
#scanStatus.error, .status.error, #toolStatus.error, .tool-status.error, #mentionStatus.error {
border: 1px solid rgba(239, 68, 68, 0.5) !important;
border-radius: 12px !important;
padding: 12px 20px !important;
background: rgba(239, 68, 68, 0.15) !important;
color: #fca5a5 !important;
box-shadow: 0 4px 20px -4px rgba(239, 68, 68, 0.3) !important;
}
.status-spinner {
display: inline-block !important;
width: 16px !important;
height: 16px !important;
border: 2.5px solid rgba(56, 189, 248, 0.25) !important;
border-top-color: #38bdf8 !important;
border-radius: 50% !important;
animation: statusSpin 0.75s linear infinite !important;
flex-shrink: 0 !important;
}
@keyframes statusSpin {
to { transform: rotate(360deg); }
}
/* ==========================================================================
SCAN PROGRESS ENGINE & TELEMETRY COUNTER WIDGET
========================================================================== */
.scan-progress-widget {
display: flex !important;
flex-direction: column !important;
gap: 10px !important;
width: 100% !important;
text-align: left !important;
padding: 2px 0 !important;
}
.scan-progress-head {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 12px !important;
}
.scan-progress-title {
display: inline-flex !important;
align-items: center !important;
gap: 10px !important;
font-size: 14px !important;
font-weight: 700 !important;
color: var(--theme-text-strong, #ffffff) !important;
letter-spacing: -0.01em !important;
}
.scan-counter-badge {
display: inline-flex !important;
align-items: center !important;
gap: 2px !important;
padding: 3px 10px !important;
border-radius: 999px !important;
background: rgba(56, 189, 248, 0.16) !important;
border: 1px solid rgba(56, 189, 248, 0.45) !important;
color: #38bdf8 !important;
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
font-size: 14.5px !important;
font-weight: 800 !important;
box-shadow: 0 0 14px rgba(56, 189, 248, 0.3) !important;
}
.scan-counter-badge b {
font-size: 15px !important;
color: var(--theme-text-strong, #ffffff) !important;
}
.scan-progress-track {
width: 100% !important;
height: 8px !important;
background: rgba(255, 255, 255, 0.08) !important;
border-radius: 999px !important;
overflow: hidden !important;
position: relative !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.12)) !important;
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.7) !important;
}
.scan-progress-fill {
height: 100% !important;
width: 8% !important;
border-radius: 999px !important;
background: linear-gradient(90deg, #0066ff 0%, #38bdf8 35%, #8b5cf6 70%, #10b981 100%) !important;
background-size: 200% 100% !important;
box-shadow: 0 0 16px rgba(56, 189, 248, 0.75), 0 0 4px rgba(255, 255, 255, 0.9) !important;
transition: width 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
animation: progressGlow 1.6s ease-in-out infinite alternate, progressShimmer 2.2s linear infinite !important;
}
@keyframes progressShimmer {
0% { background-position: 100% 0; }
100% { background-position: -100% 0; }
}
@keyframes progressGlow {
0% { filter: brightness(1) drop-shadow(0 0 6px rgba(56, 189, 248, 0.4)); }
100% { filter: brightness(1.25) drop-shadow(0 0 14px rgba(56, 189, 248, 0.85)); }
}
.scan-telemetry-row {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 10px !important;
font-size: 15px !important;
color: var(--theme-text-secondary, #94a3b8) !important;
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
}
.scan-live-probe {
display: inline-flex !important;
align-items: center !important;
gap: 7px !important;
color: var(--theme-text-secondary, #cbd5e1) !important;
font-weight: 600 !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
}
.scan-probe-pulse {
display: inline-block !important;
width: 6.5px !important;
height: 6.5px !important;
border-radius: 50% !important;
background: #10b981 !important;
box-shadow: 0 0 8px #10b981, 0 0 2px #ffffff !important;
animation: probeBlink 0.9s ease-in-out infinite alternate !important;
flex-shrink: 0 !important;
}
@keyframes probeBlink {
0% { opacity: 0.35; transform: scale(0.85); }
100% { opacity: 1; transform: scale(1.15); box-shadow: 0 0 12px #10b981; }
}
.scan-engine-stat {
font-weight: 700 !important;
color: #38bdf8 !important;
white-space: nowrap !important;
flex-shrink: 0 !important;
}
/* ==========================================================================
ENTERPRISE DARK POOL VECTORS (COMPACT OBSIDIAN CYBER-TECH DOSSIER)
========================================================================== */
.classified-section {
position: relative !important;
margin-top: 36px !important;
margin-bottom: 36px !important;
border: 1px solid rgba(245, 158, 11, 0.35) !important;
border-radius: 22px !important;
background: radial-gradient(circle at 50% -10%, rgba(245, 158, 11, 0.12) 0%, transparent 60%),
linear-gradient(180deg, #090d18 0%, #05070e 100%) !important;
padding: 30px 26px !important;
box-shadow: 0 20px 50px -10px rgba(0, 0, 0, 0.8),
0 0 30px -10px rgba(245, 158, 11, 0.15),
inset 0 1px 0 rgba(245, 158, 11, 0.3) !important;
overflow: hidden !important;
}
.classified-header {
text-align: center !important;
margin-bottom: 24px !important;
max-width: 780px !important;
margin-left: auto !important;
margin-right: auto !important;
}
.classified-badge {
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
padding: 4px 14px !important;
border-radius: 999px !important;
background: rgba(245, 158, 11, 0.12) !important;
border: 1px solid rgba(245, 158, 11, 0.4) !important;
box-shadow: 0 0 16px -2px rgba(245, 158, 11, 0.25) !important;
color: #fbbf24 !important;
font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important;
font-size: 15px !important;
font-weight: 800 !important;
letter-spacing: 0.08em !important;
text-transform: uppercase !important;
margin-bottom: 12px !important;
}
.classified-badge .badge-dot {
color: #f59e0b !important;
font-size: 9px !important;
animation: radarPulse 1.8s infinite ease-in-out !important;
}
.classified-header h2 {
font-size: 26px !important;
font-weight: 850 !important;
letter-spacing: -0.025em !important;
line-height: 1.25 !important;
color: var(--theme-text-strong, #ffffff) !important;
background: linear-gradient(180deg, #ffffff 40%, #cbd5e1 100%) !important;
-webkit-background-clip: text !important;
-webkit-text-fill-color: transparent !important;
margin: 0 0 10px !important;
}
.classified-header p {
font-size: 14.5px !important;
line-height: 1.6 !important;
color: var(--theme-text-secondary, #94a3b8) !important;
margin: 0 !important;
}
.classified-grid {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 16px !important;
margin-bottom: 24px !important;
}
@media (max-width: 1060px) {
.classified-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
}
@media (max-width: 680px) {
.classified-section {
padding: 24px 16px !important;
}
.classified-grid {
grid-template-columns: 1fr !important;
gap: 12px !important;
}
.classified-card {
padding: 15px 16px !important;
}
.classified-file-meta {
padding: 6px 10px !important;
}
.classified-file-meta .file-badge {
font-size: 15px !important;
}
.classified-file-meta .lock-pill {
font-size: 9.5px !important;
padding: 2px 6px !important;
}
.vector-metric-pill {
font-size: 9.5px !important;
padding: 2px 6px !important;
}
}
.classified-card {
position: relative !important;
border-radius: 16px !important;
padding: 18px 20px !important;
background: linear-gradient(175deg, rgba(17, 23, 38, 0.95) 0%, rgba(10, 14, 24, 0.98) 100%) !important;
display: flex !important;
flex-direction: column !important;
justify-content: space-between !important;
gap: 12px !important;
transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.2s ease !important;
color: var(--theme-text-primary, #f8fafc) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.1)) !important;
min-width: 0 !important;
max-width: 100% !important;
box-sizing: border-box !important;
}
.classified-card:hover {
transform: translateY(-3px) !important;
}
.classified-card.vector-blue {
border-color: rgba(56, 189, 248, 0.3) !important;
border-top: 3px solid #38bdf8 !important;
box-shadow: 0 8px 24px -6px rgba(0, 102, 255, 0.2) !important;
}
.classified-card.vector-purple {
border-color: rgba(168, 85, 247, 0.3) !important;
border-top: 3px solid #a855f7 !important;
box-shadow: 0 8px 24px -6px rgba(168, 85, 247, 0.2) !important;
}
.classified-card.vector-green {
border-color: rgba(52, 211, 153, 0.3) !important;
border-top: 3px solid #10b981 !important;
box-shadow: 0 8px 24px -6px rgba(16, 185, 129, 0.2) !important;
}
.classified-card.vector-amber {
border-color: rgba(251, 191, 36, 0.3) !important;
border-top: 3px solid #f59e0b !important;
box-shadow: 0 8px 24px -6px rgba(245, 158, 11, 0.2) !important;
}
.classified-card.vector-cyan {
border-color: rgba(34, 211, 238, 0.3) !important;
border-top: 3px solid #06b6d4 !important;
box-shadow: 0 8px 24px -6px rgba(6, 182, 212, 0.2) !important;
}
.classified-card.vector-rose {
border-color: rgba(251, 113, 133, 0.3) !important;
border-top: 3px solid #f43f5e !important;
box-shadow: 0 8px 24px -6px rgba(244, 63, 94, 0.2) !important;
}
.classified-card-head {
display: flex !important;
flex-direction: column !important;
gap: 8px !important;
min-width: 0 !important;
}
.vector-meta-bar {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 8px !important;
flex-wrap: wrap !important;
min-width: 0 !important;
}
.vector-tag {
font-size: 15px !important;
font-weight: 850 !important;
letter-spacing: 0.08em !important;
padding: 2.5px 7px !important;
border-radius: 5px !important;
font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important;
background: rgba(255, 255, 255, 0.07) !important;
color: var(--theme-text-secondary, #cbd5e1) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.12)) !important;
flex-shrink: 0 !important;
}
.vector-metric-pill {
font-size: 15px !important;
font-weight: 800 !important;
padding: 2.5px 9px !important;
border-radius: 999px !important;
letter-spacing: 0.02em !important;
white-space: nowrap !important;
}
.vector-blue .vector-metric-pill { background: rgba(56, 189, 248, 0.12) !important; color: #38bdf8 !important; border: 1px solid rgba(56, 189, 248, 0.3) !important; }
.vector-purple .vector-metric-pill { background: rgba(168, 85, 247, 0.12) !important; color: #c084fc !important; border: 1px solid rgba(168, 85, 247, 0.3) !important; }
.vector-green .vector-metric-pill { background: rgba(16, 185, 129, 0.12) !important; color: #34d399 !important; border: 1px solid rgba(16, 185, 129, 0.3) !important; }
.vector-amber .vector-metric-pill { background: rgba(245, 158, 11, 0.12) !important; color: #fbbf24 !important; border: 1px solid rgba(245, 158, 11, 0.3) !important; }
.vector-cyan .vector-metric-pill { background: rgba(6, 182, 212, 0.12) !important; color: #22d3ee !important; border: 1px solid rgba(6, 182, 212, 0.3) !important; }
.vector-rose .vector-metric-pill { background: rgba(244, 63, 94, 0.12) !important; color: #fb7185 !important; border: 1px solid rgba(244, 63, 94, 0.3) !important; }
.classified-card h4 {
font-size: 15.5px !important;
font-weight: 750 !important;
color: var(--theme-text-strong, #ffffff) !important;
margin: 0 !important;
line-height: 1.35 !important;
letter-spacing: -0.015em !important;
word-break: break-word !important;
}
.vector-desc {
font-size: 15px !important;
line-height: 1.55 !important;
color: var(--theme-text-secondary, #94a3b8) !important;
margin: 0 !important;
flex-grow: 1 !important;
}
/* Compact Cyber Spec Pill (replaces giant code terminal & lock overlay) */
.classified-file-meta {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 8px !important;
padding: 8px 12px !important;
border-radius: 10px !important;
background: rgba(0, 0, 0, 0.45) !important;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.08)) !important;
margin-top: auto !important;
min-width: 0 !important;
box-sizing: border-box !important;
}
.classified-file-meta .file-badge {
display: inline-flex !important;
align-items: center !important;
gap: 6px !important;
font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important;
font-size: 15px !important;
color: var(--theme-text-secondary, #cbd5e1) !important;
min-width: 0 !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
flex: 1 1 auto !important;
}
.classified-file-meta .file-badge code {
font-family: inherit !important;
color: var(--theme-text-secondary, #cbd5e1) !important;
background: none !important;
border: none !important;
padding: 0 !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
display: block !important;
}
.classified-file-meta .lock-pill {
display: inline-flex !important;
align-items: center !important;
gap: 4px !important;
font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important;
font-size: 15px !important;
font-weight: 750 !important;
letter-spacing: 0.04em !important;
color: #fbbf24 !important;
background: rgba(245, 158, 11, 0.12) !important;
border: 1px solid rgba(245, 158, 11, 0.3) !important;
padding: 3px 8px !important;
border-radius: 6px !important;
white-space: nowrap !important;
flex-shrink: 0 !important;
}
.classified-footer {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 20px !important;
padding: 18px 24px !important;
border-radius: 14px !important;
background: rgba(245, 158, 11, 0.06) !important;
border: 1px solid rgba(245, 158, 11, 0.25) !important;
flex-wrap: wrap !important;
}
.classified-footer-info {
display: flex !important;
flex-direction: column !important;
gap: 3px !important;
max-width: 650px !important;
}
.classified-footer-info strong {
font-size: 14px !important;
font-weight: 800 !important;
color: var(--theme-text-primary, #f8fafc) !important;
}
.classified-footer-info span {
font-size: 14.5px !important;
color: var(--theme-text-secondary, #94a3b8) !important;
line-height: 1.45 !important;
}
.classified-cta {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 8px !important;
padding: 10px 22px !important;
border-radius: 10px !important;
font-size: 15px !important;
font-weight: 800 !important;
letter-spacing: -0.01em !important;
color: #000000 !important;
background: linear-gradient(135deg, #f59e0b 0%, #fbbf24 100%) !important;
border: 1px solid #f59e0b !important;
box-shadow: 0 4px 18px -2px rgba(245, 158, 11, 0.5) !important;
text-decoration: none !important;
transition: transform 0.2s ease, box-shadow 0.2s ease !important;
white-space: nowrap !important;
flex-shrink: 0 !important;
}
.classified-cta:hover {
transform: translateY(-2px) !important;
box-shadow: 0 8px 24px -2px rgba(245, 158, 11, 0.65) !important;
color: #000000 !important;
}
/* ==========================================================================
DEFINITIVE OVERRIDE: EXECUTIVE WHITEPAPER PRINT ENGINE (@media print)
RULE: Plain white page with pure black text for findings and report export.
========================================================================== */
@media print {
@page {
margin: 1.2cm 1cm !important;
size: A4 portrait !important;
}
*,
*::before,
*::after {
text-shadow: none !important;
box-shadow: none !important;
filter: none !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
-webkit-print-color-adjust: exact !important;
print-color-adjust: exact !important;
}
html,
html[data-theme],
html[data-theme="dark"],
html[data-theme="light"],
body,
html[data-theme] body,
html[data-theme="dark"] body,
html[data-theme="light"] body {
background: #ffffff !important;
background-color: #ffffff !important;
background-image: none !important;
color: #0f172a !important;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
font-size: 9.5pt !important;
line-height: 1.45 !important;
margin: 0 !important;
padding: 0 !important;
}
/* 1. Hide All Non-Report Chrome & Interactive UI */
header,
.topbar,
footer,
.hero,
.kicker,
.scanbox,
.signals,
.px-section,
.faq,
.btn-pdf-export,
.theme-switch,
.langs,
.nav-scan-cta,
.nav-actions,
.primary-nav,
.skip,
.mandate-card,
.status,
.scan-chips,
.breadcrumbs,
.finding-conversion-teaser,
.findings-filter-bar,
#findingsFilterBar,
.health-roadmap-deck,
#homepageIntelligence,
.tool-intelligence,
.pillars-deep-link,
.intel-bridge-banner,
.intel-filter-bar,
.ai-decision-map,
.ai-decision-lock,
.ai-opportunity {
display: none !important;
visibility: hidden !important;
}
/* 2. Full-Width Clean Report Shell */
#result.results,
.results,
html[data-theme] #result.results,
html[data-theme="dark"] #result.results,
html[data-theme="light"] #result.results {
display: block !important;
visibility: visible !important;
background: #ffffff !important;
background-color: #ffffff !important;
background-image: none !important;
border: none !important;
box-shadow: none !important;
padding: 0 !important;
margin: 0 !important;
width: 100% !important;
max-width: 100% !important;
}
/* 3. Report Header */
.result-head,
html[data-theme] .result-head,
html[data-theme="dark"] .result-head {
display: flex !important;
justify-content: space-between !important;
align-items: flex-end !important;
border-bottom: 2pt solid #0f172a !important;
padding-bottom: 8pt !important;
margin-bottom: 12pt !important;
background: #ffffff !important;
background-color: #ffffff !important;
page-break-inside: avoid !important;
break-inside: avoid !important;
}
.result-head .eyebrow {
font-size: 8pt !important;
font-weight: 800 !important;
letter-spacing: 0.08em !important;
text-transform: uppercase !important;
color: #0284c7 !important;
display: block !important;
margin-bottom: 2pt !important;
}
#resultDomain {
font-size: 18pt !important;
font-weight: 900 !important;
color: #0f172a !important;
margin: 0 0 3pt 0 !important;
line-height: 1.1 !important;
}
#resultMeta {
font-size: 8.5pt !important;
color: #475569 !important;
margin: 0 !important;
}
.total-score,
html[data-theme] .total-score,
html[data-theme="dark"] .total-score {
width: auto !important;
height: auto !important;
border: 1.5pt solid #0f172a !important;
border-radius: 4pt !important;
padding: 4pt 10pt !important;
display: flex !important;
align-items: baseline !important;
background: #ffffff !important;
background-color: #ffffff !important;
box-shadow: none !important;
}
.total-score strong,
#overallScore {
font-size: 20pt !important;
font-weight: 900 !important;
color: #0f172a !important;
line-height: 1 !important;
}
.total-score span {
font-size: 9pt !important;
color: #475569 !important;
font-weight: 700 !important;
}
/* 4. Executive Health Summary Deck */
.health-executive-summary,
#healthExecutiveDeck,
html[data-theme] .health-executive-summary,
html[data-theme="dark"] .health-executive-summary,
html[data-theme="light"] .health-executive-summary {
display: block !important;
background: #ffffff !important;
background-color: #ffffff !important;
background-image: none !important;
border: 1.5pt solid #cbd5e1 !important;
border-radius: 4pt !important;
padding: 8pt 12pt !important;
margin-bottom: 10pt !important;
box-shadow: none !important;
page-break-inside: avoid !important;
break-inside: avoid !important;
}
.health-executive-badge {
display: inline-block !important;
padding: 2.5pt 7pt !important;
border-radius: 3pt !important;
font-size: 7.5pt !important;
font-weight: 800 !important;
letter-spacing: 0.05em !important;
margin-bottom: 4pt !important;
border: 1pt solid #cbd5e1 !important;
background: #f8fafc !important;
color: #0f172a !important;
}
.health-badge-critical {
border-color: #f87171 !important;
background: #fef2f2 !important;
color: #b91c1c !important;
}
.health-badge-warning {
border-color: #fcd34d !important;
background: #fffbeb !important;
color: #b45309 !important;
}
.health-badge-healthy {
border-color: #6ee7b7 !important;
background: #ecfdf5 !important;
color: #047857 !important;
}
.health-headline {
font-size: 11pt !important;
font-weight: 800 !important;
color: #0f172a !important;
margin: 0 0 3pt 0 !important;
line-height: 1.25 !important;
}
.health-subtext {
font-size: 8pt !important;
color: #475569 !important;
line-height: 1.35 !important;
margin: 0 0 6pt 0 !important;
}
.health-counts-grid {
display: grid !important;
grid-template-columns: repeat(4, 1fr) !important;
gap: 5pt !important;
margin: 0 !important;
}
.health-count-card {
background: #f8fafc !important;
background-color: #f8fafc !important;
background-image: none !important;
border: 1pt solid #cbd5e1 !important;
border-radius: 3pt !important;
padding: 3pt 5pt !important;
text-align: center !important;
}
.health-count-card strong {
font-size: 12pt !important;
font-weight: 900 !important;
line-height: 1 !important;
margin-bottom: 1pt !important;
display: block !important;
}
.health-count-critical strong { color: #dc2626 !important; }
.health-count-high strong { color: #d97706 !important; }
.health-count-medium strong { color: #0284c7 !important; }
.health-count-low strong { color: #16a34a !important; }
.health-count-card span {
font-size: 6.5pt !important;
font-weight: 750 !important;
text-transform: uppercase !important;
color: #475569 !important;
}
/* 5. 4-Pillars Summary Grid */
.result-pillars-grid,
html[data-theme] .result-pillars-grid,
html[data-theme="dark"] .result-pillars-grid {
display: grid !important;
grid-template-columns: repeat(4, 1fr) !important;
gap: 4pt !important;
margin-bottom: 10pt !important;
background: transparent !important;
page-break-inside: avoid !important;
break-inside: avoid !important;
}
.result-pillars-grid .pillar-card,
html[data-theme] .result-pillars-grid .pillar-card,
html[data-theme="dark"] .result-pillars-grid .pillar-card {
background: #ffffff !important;
background-color: #ffffff !important;
background-image: none !important;
border: 1pt solid #cbd5e1 !important;
border-radius: 3pt !important;
padding: 4pt 5pt !important;
box-shadow: none !important;
page-break-inside: avoid !important;
break-inside: avoid !important;
overflow: hidden !important;
}
.result-pillars-grid .pillar-head {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
gap: 2pt !important;
margin-bottom: 3pt !important;
width: 100% !important;
}
.result-pillars-grid .pillar-tag {
font-size: 5.5pt !important;
color: #0f172a !important;
font-weight: 800 !important;
letter-spacing: -0.01em !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
flex: 1 1 auto !important;
min-width: 0 !important;
}
.result-pillars-grid .pillar-score,
.result-pillars-grid strong {
font-size: 9pt !important;
color: #0f172a !important;
font-weight: 900 !important;
white-space: nowrap !important;
flex-shrink: 0 !important;
letter-spacing: -0.02em !important;
line-height: 1 !important;
}
.result-pillars-grid .pillar-score span {
font-size: 6.5pt !important;
font-weight: 700 !important;
color: #64748b !important;
white-space: nowrap !important;
display: inline !important;
}
.result-pillars-grid h4 {
font-size: 7pt !important;
color: #0f172a !important;
font-weight: 800 !important;
margin: 1pt 0 !important;
line-height: 1.15 !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
}
.result-pillars-grid p {
font-size: 5.8pt !important;
color: #334155 !important;
line-height: 1.2 !important;
margin: 0 !important;
}
.pillar-meter {
display: none !important;
}
/* 6. Score Grid (12-18 Engines) */
.score-grid,
html[data-theme] .score-grid,
html[data-theme="dark"] .score-grid {
display: grid !important;
grid-template-columns: repeat(6, 1fr) !important;
gap: 3pt !important;
border: 1pt solid #cbd5e1 !important;
background: #ffffff !important;
margin-bottom: 10pt !important;
page-break-inside: avoid !important;
break-inside: avoid !important;
letter-spacing: -0.02em !important;
}
.score-item,
html[data-theme] .score-item,
html[data-theme="dark"] .score-item {
padding: 3pt 4pt !important;
border: 0.5pt solid #e2e8f0 !important;
background: #ffffff !important;
page-break-inside: avoid !important;
break-inside: avoid !important;
overflow: hidden !important;
}
.score-item-top {
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
gap: 1pt !important;
margin-bottom: 2pt !important;
width: 100% !important;
}
.score-item-top span.engine-num {
font-size: 5.5pt !important;
font-weight: 800 !important;
color: #0284c7 !important;
white-space: nowrap !important;
letter-spacing: 0 !important;
line-height: 1 !important;
}
.score-item-top span:not(.engine-num),
.score-item span {
font-size: 5.8pt !important;
color: #334155 !important;
font-weight: 800 !important;
white-space: nowrap !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
hyphens: none !important;
-webkit-hyphens: none !important;
letter-spacing: -0.025em !important;
text-transform: uppercase !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
display: block !important;
max-width: 100% !important;
line-height: 1.15 !important;
}
.score-item strong,
html[data-theme] .score-item strong,
html[data-theme="dark"] .score-item strong,
html[data-theme="light"] .score-item strong {
font-size: 11pt !important;
color: #0f172a !important;
font-weight: 900 !important;
line-height: 1 !important;
display: block !important;
}
.meter {
display: none !important;
}
.scan-disclosure {
font-size: 7pt !important;
color: #64748b !important;
border-top: 1pt solid #e2e8f0 !important;
padding-top: 3pt !important;
margin-bottom: 10pt !important;
background: transparent !important;
}
/* 7. Priority Summary */
.priority-summary,
html[data-theme] .priority-summary,
html[data-theme="dark"] .priority-summary {
display: block !important;
border: 1.5pt solid #0f172a !important;
border-left: 4pt solid #0284c7 !important;
background: #ffffff !important;
background-color: #ffffff !important;
background-image: none !important;
padding: 6pt 10pt !important;
margin-bottom: 10pt !important;
border-radius: 3pt !important;
page-break-inside: avoid !important;
break-inside: avoid !important;
box-shadow: none !important;
}
.priority-summary h3 {
font-size: 8.5pt !important;
color: #0f172a !important;
font-weight: 900 !important;
margin: 0 0 3pt 0 !important;
}
.priority-item {
font-size: 7.5pt !important;
color: #0f172a !important;
padding: 2pt 0 !important;
border-bottom: 1pt solid #f1f5f9 !important;
display: flex !important;
align-items: center !important;
gap: 5pt !important;
background: transparent !important;
}
.priority-item span,
.priority-item span b {
color: #0f172a !important;
}
/* 8. Findings List (Full Width, Never Split Card Across Pages) */
.result-columns,
html[data-theme] .result-columns,
html[data-theme="dark"] .result-columns {
display: block !important;
width: 100% !important;
}
.result-columns > div {
width: 100% !important;
max-width: 100% !important;
}
.result-title {
display: flex !important;
justify-content: space-between !important;
align-items: baseline !important;
border-bottom: 1.5pt solid #0f172a !important;
padding-bottom: 3pt !important;
margin-bottom: 8pt !important;
}
.result-title h3 {
font-size: 11pt !important;
font-weight: 900 !important;
color: #0f172a !important;
margin: 0 !important;
}
#findingCount {
font-size: 8.5pt !important;
color: #475569 !important;
font-weight: 700 !important;
}
.findings,
#findingsList,
.result-columns,
.results,
#result {
display: block !important;
background: transparent !important;
max-height: none !important;
height: auto !important;
overflow: visible !important;
overflow-x: visible !important;
overflow-y: visible !important;
padding-right: 0 !important;
}
.findings::-webkit-scrollbar,
::-webkit-scrollbar {
display: none !important;
width: 0 !important;
height: 0 !important;
}
.finding,
article.finding,
html[data-theme] .finding,
html[data-theme="dark"] .finding {
display: block !important;
position: static !important;
background: #ffffff !important;
background-color: #ffffff !important;
background-image: none !important;
border: 1pt solid #cbd5e1 !important;
border-left: 3.5pt solid #0284c7 !important;
border-radius: 4pt !important;
padding: 8pt 10pt !important;
margin-bottom: 8pt !important;
page-break-inside: avoid !important;
break-inside: avoid !important;
box-shadow: none !important;
}
.finding.finding-tier-critical,
article.finding[data-severity="critical"] {
border-left-color: #dc2626 !important;
}
.finding.finding-tier-high,
article.finding[data-severity="high"] {
border-left-color: #ea580c !important;
}
.finding.finding-tier-medium,
article.finding[data-severity="medium"] {
border-left-color: #0284c7 !important;
}
.finding.finding-tier-low,
article.finding[data-severity="low"],
article.finding[data-severity="info"] {
border-left-color: #16a34a !important;
}
.finding h4,
.finding-content h4 {
font-size: 9.5pt !important;
font-weight: 800 !important;
color: #0f172a !important;
margin: 0 0 3pt 0 !important;
line-height: 1.25 !important;
}
.finding p,
.finding-content p {
font-size: 8pt !important;
color: #1e293b !important;
margin: 0 0 3pt 0 !important;
line-height: 1.35 !important;
}
.finding-url {
font-size: 7.5pt !important;
color: #0284c7 !important;
word-break: break-all !important;
font-family: monospace !important;
display: block !important;
margin: 2pt 0 3pt !important;
text-decoration: underline !important;
}
.finding code {
background: #f8fafc !important;
background-color: #f8fafc !important;
border: 1pt solid #cbd5e1 !important;
color: #0f172a !important;
font-family: monospace !important;
font-size: 7.5pt !important;
padding: 3pt 5pt !important;
display: block !important;
white-space: pre-wrap !important;
word-break: break-all !important;
margin-top: 3pt !important;
border-radius: 3pt !important;
}
.finding-tags {
display: flex !important;
flex-wrap: wrap !important;
gap: 3pt !important;
margin-bottom: 4pt !important;
}
.finding-tags span {
background: #f1f5f9 !important;
border: 1pt solid #cbd5e1 !important;
color: #0f172a !important;
padding: 1.5pt 4pt !important;
font-size: 7pt !important;
border-radius: 2pt !important;
font-weight: 700 !important;
}
.finding-tags .severity {
border: 1.5pt solid #0f172a !important;
font-weight: 900 !important;
color: #0f172a !important;
}
.health-dossier-box {
background: #f8fafc !important;
background-color: #f8fafc !important;
background-image: none !important;
border: 1pt solid #e2e8f0 !important;
padding: 4pt 6pt !important;
border-radius: 3pt !important;
}
.health-dossier-label {
font-size: 7pt !important;
font-weight: 800 !important;
color: #0284c7 !important;
display: block !important;
margin-bottom: 1pt !important;
}
.health-dossier-text {
font-size: 7.5pt !important;
color: #334155 !important;
line-height: 1.3 !important;
margin: 0 !important;
}
.health-dossier-meta {
font-size: 7pt !important;
color: #475569 !important;
border-top: 0.5pt solid #cbd5e1 !important;
margin-top: 4pt !important;
padding-top: 3pt !important;
display: flex !important;
gap: 8pt !important;
}
.health-dossier-meta strong {
color: #0f172a !important;
}
/* 9. Sample Report Pages in Print */
.sample-report-deck,
.sample-report-deck * {
background: #ffffff !important;
color: #0f172a !important;
border-color: #cbd5e1 !important;
}
.sample-report-deck {
border: 1.5pt solid #cbd5e1 !important;
padding: 12pt !important;
page-break-inside: avoid !important;
break-inside: avoid !important;
}
.sample-code-block {
background: #f8fafc !important;
border: 1pt solid #cbd5e1 !important;
color: #0f172a !important;
}
/* 10. Locked Paywall Fix in Print: Clean Executive Box */
.locked-fix {
display: block !important;
visibility: visible !important;
background: #f8fafc !important;
background-color: #f8fafc !important;
border: 1pt dashed #cbd5e1 !important;
border-radius: 4pt !important;
padding: 6pt 10pt !important;
margin-top: 6pt !important;
page-break-inside: avoid !important;
break-inside: avoid !important;
}
.locked-fix-blurred {
display: none !important;
}
.locked-fix-overlay {
position: static !important;
background: transparent !important;
padding: 0 !important;
display: flex !important;
flex-direction: row !important;
justify-content: space-between !important;
align-items: center !important;
gap: 8pt !important;
}
.locked-fix-overlay span {
font-size: 7.5pt !important;
font-weight: 700 !important;
color: #475569 !important;
}
.locked-fix-btn {
display: inline-block !important;
font-size: 7pt !important;
font-weight: 800 !important;
padding: 2.5pt 7pt !important;
background: #0284c7 !important;
color: #ffffff !important;
border-radius: 3pt !important;
text-decoration: none !important;
}
/* 11. Decks & Labs in Print: Clean Executive Whitepaper Standards */
.vector-attention-deck,
.remediation-console-deck,
.executive-simulation-deck,
.competitive-benchmark-deck,
.n8n-dag-container {
background: #ffffff !important;
background-color: #ffffff !important;
background-image: none !important;
border: 1pt solid #cbd5e1 !important;
color: #0f172a !important;
box-shadow: none !important;
page-break-inside: avoid !important;
break-inside: avoid !important;
margin-bottom: 12pt !important;
}
.vector-title,
.executive-deck-title,
.benchmark-row-header {
color: #0f172a !important;
font-weight: 800 !important;
}
.vector-desc,
.executive-deck-desc {
color: #475569 !important;
}
.colbert-matrix-wrapper,
.cross-encoder-grid,
.rag-waterfall-container {
background: #ffffff !important;
border: 1pt solid #cbd5e1 !important;
page-break-inside: avoid !important;
break-inside: avoid !important;
}
.colbert-matrix-table th {
background: #f1f5f9 !important;
color: #0f172a !important;
border-color: #cbd5e1 !important;
}
.colbert-matrix-table td {
border-color: #cbd5e1 !important;
color: #334155 !important;
}
.colbert-q-token {
background: #eff6ff !important;
color: #0284c7 !important;
}
.colbert-cell.colbert-max {
background: #ecfdf5 !important;
color: #047857 !important;
border: 1.5pt solid #10b981 !important;
}
.ce-row,
.wf-step-row {
background: #ffffff !important;
border: 1pt solid #cbd5e1 !important;
page-break-inside: avoid !important;
break-inside: avoid !important;
}
.ce-label,
.wf-step-title {
color: #0f172a !important;
}
.ce-bar-track,
.wf-track {
background: #e2e8f0 !important;
}
.ce-val {
color: #0f172a !important;
}
.wf-step-time {
color: #0284c7 !important;
}
.wf-cutoff-banner {
background: #fef2f2 !important;
border: 1pt solid #fecaca !important;
color: #991b1b !important;
page-break-inside: avoid !important;
break-inside: avoid !important;
}
.vector-tabs-nav,
.multicloud-selector,
.console-tabs-nav,
.n8n-dag-actions {
display: none !important;
}
}
/* Executive Header Layout */
.executive-header {
position: sticky;
top: 0;
z-index: 1000;
width: 100%;
background: var(--theme-bg-surface, #181a22);
border-bottom: 1px solid var(--theme-border, rgba(255, 255, 255, 0.08));
backdrop-filter: blur(12px);
}
.exec-header-inner {
max-width: 1240px;
margin: 0 auto;
padding: 0 24px;
height: 64px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
}
.exec-brand-group {
display: flex;
align-items: center;
gap: 10px;
white-space: nowrap;
}
.exec-brand-link {
display: inline-flex;
align-items: center;
gap: 8px;
text-decoration: none;
color: var(--theme-text-strong, #ffffff);
font-weight: 700;
font-size: 16px;
}
.exec-brand-icon {
display: inline-flex;
align-items: center;
justify-content: center;
color: #0066ff;
}
.exec-brand-title {
font-size: 17px;
font-weight: 800;
letter-spacing: -0.02em;
color: var(--theme-text-strong, #ffffff);
}
.exec-brand-divider {
color: rgba(255, 255, 255, 0.25);
font-size: 14px;
}
.exec-brand-sub {
font-size: 15px;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--theme-text-secondary, #94a3b8);
}
.exec-nav-cluster {
display: flex;
align-items: center;
gap: 24px;
}
.exec-nav-links {
display: flex;
align-items: center;
gap: 18px;
}
.exec-nav-links a {
color: var(--theme-text-secondary, #cbd5e1);
text-decoration: none;
font-size: 14px;
font-weight: 500;
transition: color 0.15s ease;
}
.exec-nav-links a:hover,
.exec-nav-links a.active {
color: var(--theme-text-strong, #ffffff);
font-weight: 600;
}
.exec-nav-actions {
display: flex;
align-items: center;
gap: 12px;
}
.exec-lang-pill {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 4px 10px;
border-radius: 6px;
border: 1px solid var(--theme-border, rgba(255, 255, 255, 0.15));
background: transparent;
color: var(--theme-text-strong, #ffffff);
font-size: 14px;
font-weight: 600;
text-decoration: none;
}
.exec-cta-btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 8px 16px;
border-radius: 8px;
background: #0066ff;
color: var(--theme-text-strong, #ffffff);
font-size: 15px;
font-weight: 600;
text-decoration: none;
white-space: nowrap;
transition: background 0.15s ease;
}
.exec-cta-btn:hover {
background: #0052cc;
}
@media (max-width: 900px) {
.exec-header-inner {
height: auto;
padding: 12px 16px;
flex-wrap: wrap;
}
.exec-brand-sub {
display: none;
}
.exec-nav-cluster {
width: 100%;
justify-content: space-between;
}
.exec-nav-links {
gap: 12px;
overflow-x: auto;
}
.exec-nav-links a {
font-size: 15px;
white-space: nowrap;
}
}
/* ==========================================================================
ENTERPRISE VECTOR ATTENTION & LATE-INTERACTION LAB (+70% ADVANCED)
========================================================================== */
.vector-attention-deck {
margin: 32px 0;
border-radius: 20px;
background: linear-gradient(175deg, rgba(26, 29, 38, 0.95) 0%, rgba(18, 20, 26, 0.98) 100%);
border: 1px solid rgba(56, 189, 248, 0.28);
box-shadow: 0 16px 48px -8px rgba(0, 0, 0, 0.6), 0 0 24px -4px rgba(56, 189, 248, 0.15);
padding: 28px;
color: var(--hh-ink);
overflow: hidden;
}
html[data-theme="light"] .vector-attention-deck {
background: #ffffff;
border-color: #cbd5e1;
box-shadow: 0 8px 30px rgba(0, 102, 255, 0.08);
color: #0f172a;
}
.vector-deck-head {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 18px;
margin-bottom: 22px;
flex-wrap: wrap;
}
.vector-badge {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 4px 12px;
border-radius: 999px;
background: rgba(56, 189, 248, 0.12);
border: 1px solid rgba(56, 189, 248, 0.35);
color: #38bdf8;
font-size: 15px;
font-weight: 800;
letter-spacing: 0.06em;
text-transform: uppercase;
}
html[data-theme="light"] .vector-badge {
background: rgba(2, 132, 199, 0.1);
border-color: rgba(2, 132, 199, 0.3);
color: #0284c7;
}
.vector-title {
font-size: 20px;
font-weight: 800;
letter-spacing: -0.02em;
margin: 8px 0 6px;
color: var(--hh-ink);
}
html[data-theme="light"] .vector-title {
color: #0f172a;
}
.vector-desc {
font-size: 15px;
line-height: 1.55;
color: var(--hh-muted);
max-width: 820px;
margin: 0;
}
html[data-theme="light"] .vector-desc {
color: #64748b;
}
.vector-tabs-nav {
display: flex;
gap: 8px;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
padding-bottom: 12px;
margin-bottom: 20px;
overflow-x: auto;
scrollbar-width: none;
}
html[data-theme="light"] .vector-tabs-nav {
border-bottom-color: #e2e8f0;
}
.vector-tab-btn {
padding: 8px 16px;
border-radius: 999px;
border: 1px solid rgba(255, 255, 255, 0.12);
background: rgba(255, 255, 255, 0.04);
color: var(--hh-muted);
font-size: 14.5px;
font-weight: 700;
cursor: pointer;
white-space: nowrap;
transition: all 0.15s ease;
}
html[data-theme="light"] .vector-tab-btn {
border-color: #e2e8f0;
background: #f8fafc;
color: #64748b;
}
.vector-tab-btn:hover {
background: rgba(255, 255, 255, 0.08);
color: var(--hh-ink);
}
html[data-theme="light"] .vector-tab-btn:hover {
background: #f1f5f9;
color: #0f172a;
}
.vector-tab-btn.active {
background: #0066ff;
border-color: #0066ff;
color: #ffffff;
box-shadow: 0 0 16px rgba(0, 102, 255, 0.4);
}
.vector-pane {
display: none;
}
.vector-pane.active {
display: block;
}
/* ColBERT MaxSim Table */
.colbert-matrix-wrapper {
overflow-x: auto;
border-radius: 14px;
border: 1px solid rgba(255, 255, 255, 0.08);
background: rgba(15, 17, 23, 0.7);
}
html[data-theme="light"] .colbert-matrix-wrapper {
background: #f8fafc;
border-color: #e2e8f0;
}
.colbert-matrix-table {
width: 100%;
border-collapse: collapse;
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
font-size: 15px;
text-align: center;
}
.colbert-matrix-table th, .colbert-matrix-table td {
padding: 8px 10px;
border: 1px solid rgba(255, 255, 255, 0.06);
}
html[data-theme="light"] .colbert-matrix-table th, html[data-theme="light"] .colbert-matrix-table td {
border-color: #e2e8f0;
}
.colbert-matrix-table th {
background: rgba(255, 255, 255, 0.03);
color: #94a3b8;
font-weight: 700;
}
html[data-theme="light"] .colbert-matrix-table th {
background: #f1f5f9;
color: #475569;
}
.colbert-q-token {
text-align: left;
font-weight: 800;
color: #38bdf8 !important;
background: rgba(56, 189, 248, 0.05);
}
html[data-theme="light"] .colbert-q-token {
color: #0284c7 !important;
background: rgba(2, 132, 199, 0.06);
}
.colbert-cell {
color: #cbd5e1;
}
html[data-theme="light"] .colbert-cell {
color: #334155;
}
.colbert-cell.colbert-max {
background: rgba(16, 185, 129, 0.22);
color: #34d399 !important;
font-weight: 900;
border: 1.5px solid rgba(16, 185, 129, 0.6) !important;
box-shadow: inset 0 0 10px rgba(16, 185, 129, 0.2);
}
html[data-theme="light"] .colbert-cell.colbert-max {
background: rgba(16, 185, 129, 0.15);
color: #059669 !important;
border-color: #10b981 !important;
}
.colbert-formula-summary {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 14px;
padding: 12px 18px;
border-radius: 10px;
background: rgba(0, 102, 255, 0.1);
border: 1px solid rgba(0, 102, 255, 0.25);
font-size: 15px;
flex-wrap: wrap;
gap: 10px;
}
html[data-theme="light"] .colbert-formula-summary {
background: #eff6ff;
border-color: #bfdbfe;
color: #1e3a8a;
}
.colbert-formula-code {
font-family: ui-monospace, SFMono-Regular, monospace;
font-weight: 700;
color: #38bdf8;
}
html[data-theme="light"] .colbert-formula-code {
color: #0284c7;
}
/* Cross-Encoder Attention Heatmap */
.cross-encoder-grid {
display: grid;
gap: 10px;
}
.ce-row {
display: grid;
grid-template-columns: 240px 1fr 70px;
align-items: center;
gap: 16px;
padding: 10px 14px;
border-radius: 10px;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.06);
}
html[data-theme="light"] .ce-row {
background: #f8fafc;
border-color: #e2e8f0;
}
.ce-label {
font-size: 14.5px;
font-weight: 700;
color: var(--hh-ink);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
html[data-theme="light"] .ce-label {
color: #0f172a;
}
.ce-bar-track {
height: 8px;
border-radius: 999px;
background: rgba(255, 255, 255, 0.08);
overflow: hidden;
position: relative;
}
html[data-theme="light"] .ce-bar-track {
background: #e2e8f0;
}
.ce-bar-fill {
height: 100%;
border-radius: 999px;
}
.ce-bar-green { background: linear-gradient(90deg, #10b981, #34d399); }
.ce-bar-blue { background: linear-gradient(90deg, #0066ff, #38bdf8); }
.ce-bar-amber { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
.ce-bar-red { background: linear-gradient(90deg, #ef4444, #f87171); }
.ce-val {
text-align: right;
font-family: ui-monospace, monospace;
font-size: 14px;
font-weight: 800;
color: var(--hh-ink);
}
html[data-theme="light"] .ce-val {
color: #0f172a;
}
/* RAG Token Budget Waterfall */
.rag-waterfall-container {
display: grid;
gap: 12px;
position: relative;
}
.wf-step-row {
display: grid;
grid-template-columns: 220px 1fr 90px;
align-items: center;
gap: 14px;
padding: 10px 14px;
border-radius: 10px;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.06);
}
html[data-theme="light"] .wf-step-row {
background: #f8fafc;
border-color: #e2e8f0;
}
.wf-step-title {
font-size: 14.5px;
font-weight: 700;
display: flex;
align-items: center;
gap: 8px;
}
.wf-track {
height: 14px;
border-radius: 6px;
background: rgba(255, 255, 255, 0.06);
position: relative;
overflow: hidden;
}
html[data-theme="light"] .wf-track {
background: #e2e8f0;
}
.wf-bar {
height: 100%;
border-radius: 6px;
background: linear-gradient(90deg, #0066ff, #38bdf8);
}
.wf-step-time {
text-align: right;
font-family: ui-monospace, monospace;
font-size: 14px;
font-weight: 800;
color: #38bdf8;
}
html[data-theme="light"] .wf-step-time {
color: #0284c7;
}
.wf-cutoff-banner {
margin-top: 14px;
padding: 12px 18px;
border-radius: 10px;
background: rgba(239, 68, 68, 0.1);
border: 1px solid rgba(239, 68, 68, 0.3);
color: #f87171;
font-size: 15px;
display: flex;
align-items: center;
gap: 10px;
}
html[data-theme="light"] .wf-cutoff-banner {
background: #fef2f2;
border-color: #fecaca;
color: #b91c1c;
}
/* Multi-Cloud Edge Sub-Tabs */
.multicloud-selector {
display: flex;
gap: 6px;
margin-bottom: 12px;
background: rgba(0, 0, 0, 0.25);
padding: 4px;
border-radius: 10px;
width: fit-content;
}
html[data-theme="light"] .multicloud-selector {
background: #f1f5f9;
}
.multicloud-btn {
padding: 6px 14px;
border-radius: 8px;
border: none;
background: transparent;
color: var(--hh-muted);
font-size: 14px;
font-weight: 700;
cursor: pointer;
transition: all 0.15s ease;
}
html[data-theme="light"] .multicloud-btn {
color: #64748b;
}
.multicloud-btn.active {
background: #0066ff;
color: #ffffff;
}
/* ============================================================================
ENTERPRISE ANALYZER LIGHT-MODE HARD STOP
Keep report surfaces readable when the persisted theme is light. The report
contains legacy inline diagnostic blocks and shared analyzer selectors whose
dark-mode values must never leak into the light surface. These rules are
intentionally scoped to .ea-container and use !important only where the
inline style attribute would otherwise win the cascade.
============================================================================ */
html[data-theme="light"] .ea-container .ea-url-chip,
html[data-theme="light"] .ea-container .ea-target-action {
background: var(--ea-bg-card, #ffffff) !important;
color: var(--ea-text-secondary, #334155) !important;
}
html[data-theme="light"] .ea-container .ea-file-item:hover {
background: var(--ea-bg-hover, #f1f5f9) !important;
color: var(--ea-text-primary, #0f172a) !important;
}
html[data-theme="light"] .ea-container .ea-file-badge {
background: var(--ea-bg-card, #ffffff) !important;
color: var(--ea-text-muted, #64748b) !important;
}
html[data-theme="light"] .ea-container [style*="background:rgba(0,0,0"],
html[data-theme="light"] .ea-container [style*="background: rgba(0,0,0"],
html[data-theme="light"] .ea-container [style*="background:rgba(0, 0, 0"],
html[data-theme="light"] .ea-container [style*="background: rgba(0, 0, 0"],
html[data-theme="light"] .ea-container [style*="background: rgba(0,0,0"] {
background: var(--ea-bg-card, #ffffff) !important;
color: var(--ea-text-primary, #0f172a) !important;
}
html[data-theme="light"] .ea-container .modal-overlay {
background: rgba(15, 23, 42, 0.18) !important;
}
html[data-theme="light"] .ea-container .modal-content {
background: var(--ea-modal-bg, linear-gradient(135deg, #ffffff, #f8fafc)) !important;
color: var(--ea-text-primary, #0f172a) !important;
box-shadow: 0 25px 50px rgba(15, 23, 42, 0.12) !important;
}
/* ==========================================================================
AI INTELLIGENCE INTERACTIVE ACCORDION & ENGINE INSPECTOR
========================================================================== */
.ai-intelligence-row {
cursor: pointer !important;
transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease !important;
user-select: none;
margin-bottom: 8px !important;
border-radius: 10px !important;
}
.ai-intelligence-row:hover {
background: #f1f5f9 !important;
border-color: #cbd5e1 !important;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04) !important;
}
.ai-intelligence-row-header {
display: flex !important;
align-items: center !important;
gap: 12px !important;
flex-wrap: wrap !important;
width: 100% !important;
}
.ai-row-toggle-btn {
margin-left: auto !important;
font-size: 15px !important;
font-weight: 750 !important;
color: #0284c7 !important;
padding: 3px 8px !important;
background: rgba(2, 132, 199, 0.08) !important;
border-radius: 4px !important;
border: 1px solid rgba(2, 132, 199, 0.2) !important;
}
.ai-row-drawer {
display: none;
width: 100% !important;
margin-top: 12px !important;
padding: 14px !important;
background: #ffffff !important;
border: 1px solid #e2e8f0 !important;
border-radius: 8px !important;
cursor: default !important;
user-select: text !important;
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.02) !important;
}
.ai-intelligence-row.expanded .ai-row-drawer {
display: block !important;
}
.ai-row-drawer-section {
margin-bottom: 12px !important;
}
.ai-row-drawer-section:last-child {
margin-bottom: 0 !important;
}
.ai-row-drawer-label {
font-size: 15px !important;
font-weight: 750 !important;
text-transform: uppercase !important;
letter-spacing: 0.04em !important;
color: #475569 !important;
margin-bottom: 4px !important;
display: flex !important;
align-items: center !important;
gap: 6px !important;
}
.ai-row-drawer-text {
font-size: 14.5px !important;
line-height: 1.55 !important;
color: #1e293b !important;
margin: 0 !important;
}
.ai-row-code {
background: #0f172a !important;
color: #f8fafc !important;
padding: 8px 12px !important;
border-radius: 6px !important;
font-size: 15px !important;
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
overflow-x: auto !important;
white-space: pre !important;
margin: 4px 0 0 0 !important;
border: 1px solid #1e293b !important;
}
.ai-row-cmd {
background: #1e293b !important;
color: #38bdf8 !important;
padding: 6px 10px !important;
border-radius: 6px !important;
font-size: 15px !important;
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
overflow-x: auto !important;
white-space: pre !important;
margin: 4px 0 0 0 !important;
border: 1px solid #334155 !important;
}
.ai-row-btn-copy {
background: #ffffff !important;
border: 1px solid #cbd5e1 !important;
color: #0f172a !important;
font-size: 15px !important;
font-weight: 700 !important;
padding: 2px 8px !important;
border-radius: 4px !important;
cursor: pointer !important;
margin-left: auto !important;
transition: all 0.15s ease !important;
}
.ai-row-btn-copy:hover {
background: #f1f5f9 !important;
border-color: #94a3b8 !important;
}
.ai-engine-inspector {
margin-top: 14px !important;
padding: 14px 18px !important;
background: #f8fafc !important;
border: 1px solid #cbd5e1 !important;
border-left: 4px solid #0284c7 !important;
border-radius: 8px !important;
font-size: 14.5px !important;
line-height: 1.55 !important;
color: #0f172a !important;
}
.ai-lens.lens-selected {
outline: 2px solid #0284c7 !important;
outline-offset: 2px !important;
}
/* Dark theme overrides */
html[data-theme="dark"] .ai-intelligence-row:hover {
background: rgba(30, 41, 59, 0.8) !important;
border-color: #475569 !important;
}
html[data-theme="dark"] .ai-row-drawer {
background: #0f172a !important;
border-color: #334155 !important;
}
html[data-theme="dark"] .ai-row-drawer-text {
color: #e2e8f0 !important;
}
html[data-theme="dark"] .ai-row-drawer-label {
color: #94a3b8 !important;
}
html[data-theme="dark"] .ai-row-btn-copy {
background: #1e293b !important;
color: #f8fafc !important;
border-color: #475569 !important;
}
html[data-theme="dark"] .ai-row-btn-copy:hover {
background: #334155 !important;
}
html[data-theme="dark"] .ai-engine-inspector {
background: #0f172a !important;
border-color: #334155 !important;
color: #f8fafc !important;
}
/* Print overrides */
@media print {
.ai-row-drawer {
display: block !important;
border: 1pt solid #cbd5e1 !important;
background: #ffffff !important;
page-break-inside: avoid !important;
}
.ai-row-toggle-btn, .ai-row-btn-copy {
display: none !important;
}
}