/* ── Variables ── */ :root { --green: #7BB290; --green2: #4ab78f; --green-d: rgba(123,178,144,.14); --green-b: rgba(123,178,144,.38); --red: #e96a6a; --amber: #f0a054; --bg: #0a0f0b; /* page background — intentionally dark, unchanged */ --hdr-bg: #343a40; /* Foreground surfaces ~20% brighter so content separates from the dark bg. */ --glass: rgba(255,255,255,.06); --glass-b: rgba(255,255,255,.14); --text: #eef4f0; /* Readability bump (operator: hard to read on a dim phone). Muted/dim text opacities raised so secondary copy stays legible at low screen brightness. */ --muted: rgba(233,241,236,.86); --dim: rgba(233,241,236,.66); /* shared foreground tokens (also used by the map + new controls) */ --fvc-panel-bg: rgba(255,255,255,.06); --fvc-panel-bg-strong: rgba(255,255,255,.09); --fvc-border: rgba(255,255,255,.14); --fvc-border-strong: rgba(123,178,144,.45); --fvc-map-fill: rgba(123,178,144,.16); --fvc-map-stroke: rgba(123,178,144,.50); --fvc-accent: #7BB290; --r: 16px; --r-sm: 10px; --r-pill: 100px; --shadow: 0 8px 32px rgba(0,0,0,.36); } *,*::before,*::after { box-sizing:border-box; margin:0; padding:0; } html { scroll-behavior:smooth; overflow-x:clip; } /* clip (NOT hidden): hidden makes a scroll container, which breaks position:sticky on Chrome mobile (header slips up). clip prevents H-scroll without that side-effect. */ /* Mobile tap reliability: register taps IMMEDIATELY on interactive controls. * Without this, iOS Safari briefly holds the first tap to see if a double-tap- * zoom follows (the viewport is zoomable), so a single tap on a button sometimes * does nothing and the user has to tap a second time (Details/Share/etc. on the * cards). `manipulation` keeps scroll/pan but disables double-tap-zoom on these * elements → first tap always clicks. Scrolling/zooming the page is unaffected. */ button, a, label, summary, [role="button"], [onclick], .card-btn, .stock-card, .login-btn, .btn-green, .fvc-chip, .control-pill, .hdr-btn, .sm-action-btn, .fvc-rec-btn, .card-sector, .card-conf-pill { touch-action: manipulation; } /* Chrome Android reliability: mark EVERY interactive control as a tap target so the browser doesn't hold the first tap(s) for double-tap-zoom / scroll-vs-tap disambiguation. This matters most inside the detail bottom-sheet, which is a scroll container with a NON-passive touchmove listener (drag-to-close) — without this, Chrome waited and the year/tab/close buttons needed several taps. It does NOT disable scrolling or pinch-zoom. Firefox was already fine. */ button, summary, [onclick], .fvc-term, .histfv-range, .modal-tab, .modal-close, .modal-meta-chip, .fvc-afilter, .fvc-clear-all, .control-filters, .fvc-control-filters { touch-action: manipulation; } body { font-family:'Space Grotesk',system-ui,sans-serif; background:var(--bg); color:var(--text); min-height:100vh; line-height:1.6; overflow-x:clip; /* clip (not hidden) → prevents H-scroll WITHOUT creating a scroll container that breaks position:sticky */ } a { color:inherit; text-decoration:none; } strong { font-weight:600; } /* ── Subtle grid background ── */ body::before { content:''; position:fixed;inset:0;z-index:0; background-image: linear-gradient(rgba(123,178,144,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(123,178,144,.025) 1px, transparent 1px); background-size:56px 56px; pointer-events:none; } /* ── Header — premium SaaS ── */ .hdr { /* near-solid (was 88% + blur(22px)): a heavy backdrop-filter on a sticky header over the fixed page background repaints every scroll frame and flickers the header + background on Chrome. Solid bg = identical look, no flicker. */ background:rgba(11,16,12,.97); padding:11px 28px; display:flex;align-items:center;justify-content:space-between;gap:16px; position:sticky;top:0;z-index:200; border-bottom:1px solid rgba(123,178,144,.14); box-shadow:0 1px 40px rgba(0,0,0,.55), 0 0 0 0.5px rgba(123,178,144,.07), inset 0 1px 0 rgba(123,178,144,.06); } .hdr-brand { display:flex;align-items:center;gap:10px; text-decoration:none;flex-shrink:0; transition:opacity .18s; } .hdr-brand:hover { opacity:.85; } .hdr-logo-img { height:32px;display:block;flex-shrink:0; } .hdr-radar-sub { padding:2px 9px;border-radius:var(--r-pill); background:rgba(123,178,144,.09);border:1px solid rgba(123,178,144,.22); font-size:.57rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase; color:var(--green);white-space:nowrap;align-self:center; } .hdr-pill { display:inline-flex;align-items:center;gap:5px; padding:3px 10px;border-radius:var(--r-pill); background:rgba(123,178,144,.07);border:1px solid rgba(123,178,144,.18); font-size:.6rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase; color:rgba(123,178,144,.75);white-space:nowrap; } .hdr-pill::before { content:'';width:5px;height:5px;border-radius:50%; background:var(--green);flex-shrink:0; animation:blink 2.4s ease-in-out infinite; } .hdr-nav { display:flex;gap:8px;align-items:center; } .hdr-btn { display:inline-flex;align-items:center;gap:6px; padding:7px 18px;border-radius:var(--r-pill); font-family:inherit;font-size:.78rem;font-weight:600; cursor:pointer;transition:transform .18s,box-shadow .18s; text-decoration:none;border:none; } .hdr-btn.primary { background:var(--green);color:#0a1a10; box-shadow:0 4px 16px rgba(123,178,144,.28); } .hdr-btn.primary:hover { transform:translateY(-1px);box-shadow:0 6px 20px rgba(123,178,144,.45); } .hdr-btn.ghost { background:rgba(255,255,255,.06);color:var(--text); border:1px solid rgba(255,255,255,.12); } .hdr-btn.ghost:hover { background:rgba(255,255,255,.10); } @media (max-width:640px) { .hdr { padding:10px 14px; } .hdr-pill { display:none; } .hdr-logo-img { height:26px; } /* Compact mobile header: icon-only Sign in, "Pro" (no price), compact Watchlist */ .hdr-nav { gap:6px; } .hdr-label { display:none; } /* hide "Watchlist" + "Sign in" words */ .hdr-pro-price, .hdr-pro-full { display:none; } /* just "Pro" on mobile (no "Go", no price) */ .hdr-account-btn, .hdr-wl-btn { padding:0; width:38px; height:38px; justify-content:center; /* square icon buttons */ } .hdr-wl-btn .wl-count-badge { position:absolute; top:-5px; right:-5px; } .hdr-pro-btn { padding:0 14px; height:38px; } } /* ── Main layout ── */ .main { position:relative;z-index:1; } /* ── Hero ── */ .hero { padding:72px 24px 64px; text-align:center; background:radial-gradient(ellipse 70% 50% at 50% 0%, rgba(74,183,143,.07) 0%, transparent 70%); } .hero-eyebrow { font-size:.7rem;letter-spacing:.28em;text-transform:uppercase; color:var(--green);margin-bottom:16px; } .hero h1 { font-size:clamp(2rem,5vw,3rem);font-weight:700;letter-spacing:-.03em; line-height:1.1;margin-bottom:14px; background:linear-gradient(135deg,var(--text) 0%,var(--green) 100%); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; } .hero-sub { font-size:1.05rem;color:var(--muted);max-width:480px;margin:0 auto 10px;line-height:1.7; } .hero-disclaimer { font-size:.72rem;color:var(--dim);margin-bottom:36px; } .hero-actions { display:flex;gap:12px;justify-content:center;flex-wrap:wrap; } .btn { display:inline-flex;align-items:center;gap:8px; border-radius:var(--r-pill);padding:12px 24px; font-family:inherit;font-size:.88rem;font-weight:600; cursor:pointer;transition:transform .18s,box-shadow .18s; text-decoration:none;border:none; } .btn-green { background:var(--green);color:#0a1a10; box-shadow:0 6px 20px rgba(123,178,144,.28); } .btn-green:hover { transform:translateY(-2px);box-shadow:0 10px 28px rgba(123,178,144,.42); } .btn-ghost { background:var(--glass);color:var(--text); border:1px solid var(--glass-b); } .btn-ghost:hover { background:rgba(255,255,255,.07); } /* ── Section ── */ .section { padding:64px 24px;max-width:900px;margin:0 auto; } .section-hdr { display:flex;align-items:baseline;justify-content:space-between; flex-wrap:wrap;gap:12px;margin-bottom:8px; } .section-title { font-size:1.25rem;font-weight:600; } .section-meta { font-size:.75rem;color:var(--dim); } .section-sub { font-size:.83rem;color:var(--muted);margin-bottom:32px; } /* ── Status bar ── */ .status-bar { background:var(--glass);border:1px solid var(--glass-b);border-radius:var(--r); padding:14px 20px;margin-bottom:28px; display:flex;align-items:center;gap:12px;flex-wrap:wrap; font-size:.78rem;color:var(--muted); } .status-dot { width:7px;height:7px;border-radius:50%;background:var(--green);flex-shrink:0;animation:blink 2.4s ease-in-out infinite; } @keyframes blink { 0%,100%{opacity:1} 50%{opacity:.25} } /* ── Stock cards ── */ .cards { display:flex;flex-direction:column;gap:16px; } .stock-card { /* solid-ish tint, NO backdrop-filter: 50 blurred cards over the fixed background grid forced a per-frame GPU re-blur on scroll → whole-page flicker/jank (worse the more cards/the weaker the GPU). The blur was barely visible over the dark page anyway. */ background:rgba(255,255,255,.05);border:1px solid var(--glass-b);border-radius:var(--r); padding:24px 26px; transition:border-color .2s,box-shadow .2s; } .stock-card:hover { border-color:var(--green-b); box-shadow:0 4px 24px rgba(123,178,144,.08); } .card-top { display:flex;align-items:flex-start;justify-content:space-between;gap:16px; margin-bottom:6px; } .card-identity { flex:1;min-width:0; } .card-ticker { font-size:1.2rem;font-weight:700;letter-spacing:.04em;color:var(--text); } .card-name { font-size:.8rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; max-width:260px;margin-top:2px; } .card-score-wrap { text-align:right;flex-shrink:0; } .card-score { font-size:2rem;font-weight:700;line-height:1; background:linear-gradient(135deg,var(--green) 0%,var(--green2) 100%); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; } .card-score-lbl { font-size:.62rem;color:var(--dim);letter-spacing:.08em;text-transform:uppercase;margin-top:1px; } .verdict-pill { display:inline-flex;align-items:center;gap:6px; padding:4px 12px;border-radius:var(--r-pill); font-size:.68rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase; margin-bottom:10px; } .verdict-strong { background:rgba(74,183,143,.15);color:var(--green2);border:1px solid rgba(74,183,143,.3); } .verdict-watch { background:rgba(123,178,144,.10);color:var(--green);border:1px solid var(--green-b); } .verdict-mixed { background:rgba(240,160,84,.10);color:var(--amber);border:1px solid rgba(240,160,84,.28); } .verdict-weak { background:rgba(224,95,95,.08);color:var(--red);border:1px solid rgba(224,95,95,.22); } .card-thesis { font-size:.81rem;color:var(--muted);line-height:1.65;margin-bottom:18px; font-style:italic; } /* ── Factor bars ── */ .factor-bars { display:flex;flex-direction:column;gap:7px;margin-bottom:20px; } .fb-row { display:grid;grid-template-columns:110px 1fr 36px;align-items:center;gap:10px; } .fb-label { font-size:.7rem;color:var(--muted);letter-spacing:.04em; } .fb-track { height:5px;border-radius:3px; background:rgba(255,255,255,.06);overflow:hidden; } .fb-fill { height:100%;border-radius:3px; background:linear-gradient(90deg,var(--green) 0%,var(--green2) 100%); transition:width .6s cubic-bezier(.4,0,.2,1); } .fb-fill.medium { background:linear-gradient(90deg,var(--amber) 0%,#f5c875 100%); } .fb-fill.low { background:linear-gradient(90deg,var(--red) 0%,#e88080 100%); } .fb-val { font-size:.7rem;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums; } /* ── Key metrics ── */ .key-metrics { display:flex;flex-wrap:wrap;gap:8px 20px; margin-bottom:18px; padding:12px 0; border-top:1px solid var(--glass-b); border-bottom:1px solid var(--glass-b); } .km-item { font-size:.74rem; } .km-label { color:var(--dim);margin-right:4px; } .km-val { color:var(--text);font-weight:500; } .km-val.up { color:var(--green); } .km-val.down { color:var(--red); } /* ── Card footer ── */ .card-footer { display:flex;align-items:center;justify-content:space-between; flex-wrap:wrap;gap:10px; } .card-source { font-size:.66rem;color:var(--dim); } /* ── Investment interpretation (signal label + one analytical sentence) ──── */ .fvc-interp { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:18px 0; padding:11px 13px; border-radius:11px; background:rgba(255,255,255,.035); border:1px solid var(--glass-b, rgba(255,255,255,.1)); border-left:3px solid #8a9aa0; /* accent re-set per tone below */ } .fvc-interp-badge { flex:0 0 auto; font-size:.67rem; font-weight:800; letter-spacing:.015em; padding:4px 11px; border-radius:999px; line-height:1.15; white-space:nowrap; background:rgba(255,255,255,.06); border:1px solid var(--glass-b, rgba(255,255,255,.12)); color:var(--text,#e8f0eb); } .fvc-interp-text { flex:1 1 220px; min-width:0; font-size:.78rem; line-height:1.4; color:var(--muted, rgba(233,241,236,.72)); } /* Tone palette — green (positive) · grey (neutral/weak) · amber (caution) · red (negative) */ .fvc-interp.tone-positive, .fvc-interp.tone-neutral-positive, .fvc-interp.tone-positive-caution { border-left-color:#7BB290; } .fvc-interp.tone-positive .fvc-interp-badge, .fvc-interp.tone-neutral-positive .fvc-interp-badge, .fvc-interp.tone-positive-caution .fvc-interp-badge { background:rgba(123,178,144,.16); border-color:rgba(123,178,144,.42); color:#7BB290; } .fvc-interp.tone-neutral, .fvc-interp.tone-weak { border-left-color:#9aa0a6; } .fvc-interp.tone-neutral .fvc-interp-badge, .fvc-interp.tone-weak .fvc-interp-badge { background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.16); color:#aab0b6; } .fvc-interp.tone-caution, .fvc-interp.tone-neutral-caution { border-left-color:#f0a054; } .fvc-interp.tone-caution .fvc-interp-badge, .fvc-interp.tone-neutral-caution .fvc-interp-badge { background:rgba(240,160,84,.14); border-color:rgba(240,160,84,.4); color:#f0a054; } .fvc-interp.tone-negative { border-left-color:#e96a6a; } .fvc-interp.tone-negative .fvc-interp-badge { background:rgba(233,106,106,.14); border-color:rgba(233,106,106,.42); color:#e96a6a; } @media (max-width:560px){ .fvc-interp { padding:8px 10px; gap:8px; } .fvc-interp-badge { font-size:.62rem; padding:3px 9px; } .fvc-interp-text { font-size:.73rem; flex-basis:100%; } /* sentence wraps under the badge */ } .card-actions { display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;flex:1 1 100%; } /* full-width so flex-end actually pushes the buttons right (footer is space-between) → easier thumb reach */ .card-btn { display:inline-flex;align-items:center;justify-content:center;gap:6px; padding:10px 18px;border-radius:var(--r-pill); font-family:inherit;font-size:.82rem;font-weight:600; cursor:pointer;transition:background .18s,transform .18s; text-decoration:none;border:none; } .card-btn.details { background:var(--glass);color:var(--text); border:1px solid var(--glass-b); } .card-btn.details:hover { background:rgba(255,255,255,.09); } .card-btn.fvc { background:var(--green-d);color:var(--green); border:1px solid var(--green-b); } .card-btn.fvc:hover { background:rgba(123,178,144,.18); } .card-btn.coffee { background:rgba(240,160,84,.10);color:var(--amber); border:1px solid rgba(240,160,84,.25); } .card-btn.coffee:hover { background:rgba(240,160,84,.18); } /* ── Confidence badge ── */ .conf-badge { display:inline-flex;align-items:center;gap:4px; font-size:.64rem;padding:2px 9px;border-radius:var(--r-pill); letter-spacing:.06em;text-transform:uppercase; } .conf-high { background:rgba(123,178,144,.12);color:var(--green);border:1px solid var(--green-b); } .conf-medium { background:rgba(240,160,84,.10);color:var(--amber);border:1px solid rgba(240,160,84,.25); } .conf-low { background:rgba(224,95,95,.08);color:var(--red);border:1px solid rgba(224,95,95,.2); } /* ── Loading & empty states ── */ .state-box { text-align:center;padding:64px 24px; background:var(--glass);border:1px solid var(--glass-b);border-radius:var(--r); } .state-box p { color:var(--muted);font-size:.88rem;margin-top:12px;line-height:1.7; } .spinner { width:36px;height:36px;border-radius:50%; border:3px solid var(--glass-b);border-top-color:var(--green); animation:spin .8s linear infinite;margin:0 auto 16px; } @keyframes spin { to { transform:rotate(360deg); } } /* ── Modal ── */ .modal-overlay { position:fixed;inset:0;z-index:500; background:rgba(0,0,0,.7);backdrop-filter:blur(6px); display:flex;align-items:center;justify-content:center; padding:20px;opacity:0;pointer-events:none;transition:opacity .25s; } .modal-overlay.open { opacity:1;pointer-events:all; } .modal { background:#111a14;border:1px solid var(--glass-b);border-radius:var(--r); width:100%;max-width:640px;max-height:86vh;overflow-y:auto; padding:28px;position:relative; box-shadow:0 24px 80px rgba(0,0,0,.6); transform:translateY(12px);transition:transform .25s; } .modal-overlay.open .modal { transform:translateY(0); } .modal-close { position:absolute;top:16px;right:16px; width:28px;height:28px;border-radius:50%; background:var(--glass);border:1px solid var(--glass-b); color:var(--muted);font-size:1rem;cursor:pointer; display:flex;align-items:center;justify-content:center; } .modal-close:hover { background:rgba(255,255,255,.10); } .modal h2 { font-size:1.1rem;font-weight:700;margin-bottom:4px; } .modal .modal-sub { font-size:.78rem;color:var(--muted);margin-bottom:20px; } .modal-section { margin-bottom:26px; } .modal-section-title { font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase; color:var(--green);margin-bottom:10px;padding-bottom:6px; border-bottom:1px solid var(--glass-b); } .modal-row { display:flex;justify-content:space-between;align-items:center; padding:5px 0;font-size:.8rem;color:var(--muted); border-bottom:1px solid rgba(255,255,255,.03); } .modal-row:last-child { border-bottom:none; } .modal-row .mr-label { flex:1; } .modal-row .mr-val { font-weight:500;color:var(--text);font-variant-numeric:tabular-nums;text-align:right; } .modal-row .mr-score { width:28px;height:28px;border-radius:50%; display:flex;align-items:center;justify-content:center; font-size:.68rem;font-weight:700;margin-left:10px;flex-shrink:0; } .modal-warn { background:rgba(240,160,84,.08);border:1px solid rgba(240,160,84,.2); border-radius:var(--r-sm);padding:10px 14px; font-size:.78rem;color:var(--amber);margin-top:10px;line-height:1.55; } .modal-penalty { background:rgba(224,95,95,.07);border:1px solid rgba(224,95,95,.2); border-radius:var(--r-sm);padding:8px 12px;margin:4px 0; font-size:.78rem;color:var(--red); } /* ── Footer ── */ /* slim final strip — compact, premium, unobtrusive */ .footer { border-top:1px solid var(--glass-b); padding:12px 24px; margin-top:40px; background:rgba(10,15,11,.5); } .footer-inner { max-width:1180px; margin:0 auto; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:4px 18px; } .footer-copy { font-size:.74rem; font-weight:600; color:var(--muted); letter-spacing:.01em; } .footer-note { font-size:.7rem; color:var(--dim); } .footer-nav { display:flex; flex-wrap:wrap; gap:6px 22px; justify-content:center; max-width:1180px; margin:0 auto 14px; padding-bottom:14px; border-bottom:1px solid var(--fvc-border); } .footer-nav a { font-size:.8rem; font-weight:600; color:var(--muted); text-decoration:none; transition:color .15s; } .footer-nav a:hover { color:var(--green); } .footer-legal { display:flex; flex-wrap:wrap; gap:6px 18px; justify-content:center; max-width:1180px; margin:0 auto 12px; } .footer-legal a { font-size:.76rem; color:var(--muted); text-decoration:none; transition:color .15s; } .footer-legal a:hover { color:var(--green); text-decoration:underline; } /* ── Community leaderboard (footer) ───────────────────────────────────────── */ .fvc-lb { max-width:520px; margin:0 auto 22px; padding:16px 18px 14px; border:1px solid var(--glass-b); border-radius:14px; background:linear-gradient(180deg, rgba(123,178,144,.06), rgba(10,15,11,.2)); } .fvc-lb-h { font-size:.92rem; font-weight:800; color:var(--text); margin-bottom:12px; display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; } .fvc-lb-sub { font-size:.66rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--dim); } .fvc-lb-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; } .fvc-lb-row { padding:8px 10px; border-radius:9px; font-size:.86rem; } .fvc-lb-main { display:flex; align-items:center; gap:10px; } .fvc-lb-click > .fvc-lb-main { cursor:pointer; } .fvc-lb-click > .fvc-lb-main::after { content:'▾'; flex:0 0 auto; color:var(--dim); font-size:.7rem; transition:transform .15s; } .fvc-lb-row.open > .fvc-lb-main::after { transform:rotate(180deg); } .fvc-lb-top3 { display:flex; flex-wrap:wrap; gap:5px 14px; padding:9px 0 3px 38px; } .fvc-lb-h3 { font-size:.74rem; color:var(--muted); font-variant-numeric:tabular-nums; background:none; border:1px solid var(--fvc-border,rgba(255,255,255,.10)); border-radius:7px; padding:3px 8px; cursor:pointer; font-family:inherit; } .fvc-lb-h3:hover { border-color:var(--fvc-green,#7BB290); background:rgba(123,178,144,.08); } .fvc-lb-h3 b { color:var(--text); font-weight:700; } .fvc-lb-h3 .pos { color:var(--green,#7BB290); } .fvc-lb-h3 .neg { color:#e08a8a; } .fvc-lb-row:nth-child(odd) { background:rgba(255,255,255,.025); } .fvc-lb-top { background:rgba(123,178,144,.10) !important; } .fvc-lb-rank { flex:0 0 28px; text-align:center; font-weight:800; font-size:1rem; color:var(--muted); } .fvc-lb-nick { flex:1 1 auto; min-width:0; font-weight:700; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .fvc-lb-hold { flex:0 0 auto; font-size:.72rem; color:var(--dim); white-space:nowrap; } .fvc-lb-ret { flex:0 0 auto; font-weight:800; font-variant-numeric:tabular-nums; min-width:62px; text-align:right; } .fvc-lb-ret.pos { color:var(--green,#7BB290); } .fvc-lb-ret.neg { color:#e08a8a; } .fvc-lb-foot { margin-top:11px; font-size:.7rem; color:var(--dim); text-align:center; } @media (max-width:520px){ .fvc-lb-hold { display:none; } } /* ── Hero stats panel ── */ .hero-stats { display:flex;flex-wrap:wrap;gap:10px;justify-content:center; margin-top:36px; } .hero-stat { background:var(--glass);border:1px solid var(--glass-b);border-radius:var(--r); padding:14px 22px;min-width:130px;text-align:center; } .hero-stat-val { font-size:1.4rem;font-weight:700;line-height:1;margin-bottom:4px; background:linear-gradient(135deg,var(--text) 0%,var(--green) 100%); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; } .hero-stat-label { font-size:.64rem;color:var(--dim);letter-spacing:.1em;text-transform:uppercase; } /* ── How it works section ── */ .hiw-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px;margin-top:28px; } .hiw-card { background:var(--glass);border:1px solid var(--glass-b);border-radius:var(--r); padding:20px 22px; transition:border-color .2s; } .hiw-card:hover { border-color:var(--green-b); } .hiw-icon { font-size:1.5rem;margin-bottom:10px;line-height:1; } .hiw-title { font-size:.85rem;font-weight:700;color:var(--green);margin-bottom:6px; } .hiw-weight { display:inline-block;font-size:.6rem;font-weight:600; background:var(--green-d);color:var(--green);border:1px solid var(--green-b); border-radius:var(--r-pill);padding:2px 8px;margin-bottom:8px; letter-spacing:.08em;text-transform:uppercase; } .hiw-desc { font-size:.77rem;color:var(--muted);line-height:1.6; } .hiw-note { margin-top:20px;text-align:center;font-size:.73rem;color:var(--dim); } /* ── Transparency panel ── */ .tp-panel { background:var(--glass);border:1px solid var(--glass-b);border-radius:var(--r); padding:24px 28px; } .tp-title { font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase; color:var(--green);margin-bottom:14px;padding-bottom:8px; border-bottom:1px solid var(--glass-b); } .tp-row { display:flex;gap:14px;align-items:flex-start; padding:7px 0;border-bottom:1px solid rgba(255,255,255,.03); font-size:.8rem; } .tp-row:last-child { border-bottom:none; } .tp-dot { width:6px;height:6px;border-radius:50%;background:var(--green); flex-shrink:0;margin-top:6px; } .tp-text { color:var(--muted);line-height:1.6; } .tp-text strong { color:var(--text);font-weight:600; } /* ── Modal raw financials ── */ .fin-grid { display:grid;grid-template-columns:1fr 1fr;gap:4px 20px;margin-top:2px; } .fin-item { display:flex;justify-content:space-between;align-items:center; font-size:.77rem;padding:3px 0;border-bottom:1px solid rgba(255,255,255,.03); } .fin-label { color:var(--dim); } .fin-val { color:var(--text);font-weight:500;font-variant-numeric:tabular-nums; } /* ── Modal warning / missing ── */ .modal-missing { background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08); border-radius:var(--r-sm);padding:10px 14px;margin:4px 0; font-size:.78rem;color:var(--dim); } /* ── Filter bar ── */ .filter-bar { background:var(--glass);border:1px solid var(--glass-b);border-radius:var(--r); padding:16px 20px;margin-bottom:20px; } .filter-row { display:flex;flex-wrap:wrap;gap:10px;align-items:center; } .filter-select, .filter-input { background:rgba(255,255,255,.06);border:1px solid var(--glass-b); border-radius:var(--r-sm);color:var(--text); font-family:inherit;font-size:.78rem;padding:7px 12px; cursor:pointer;min-width:130px; appearance:none;-webkit-appearance:none; } .filter-select:focus, .filter-input:focus { outline:none;border-color:var(--green-b); } .filter-input { min-width:160px; } .filter-input::placeholder { color:var(--dim); } .filter-btn { display:inline-flex;align-items:center;gap:5px; padding:7px 16px;border-radius:var(--r-pill); font-family:inherit;font-size:.78rem;font-weight:600; cursor:pointer;border:none;transition:background .18s; } .filter-btn.apply { background:var(--green);color:#0a1a10; } .filter-btn.apply:hover { background:var(--green2); } .filter-btn.universe { background:var(--glass);color:var(--muted); border:1px solid var(--glass-b); } .filter-btn.universe:hover { background:rgba(255,255,255,.09); } .filter-label { font-size:.68rem;color:var(--dim); display:block;margin-bottom:2px;letter-spacing:.06em;text-transform:uppercase; } .filter-group { display:flex;flex-direction:column;gap:2px; } .filter-row-sources { margin-top:10px;padding-top:10px; border-top:1px solid var(--glass-b); } .filter-hint { font-size:.66rem;color:var(--dim);margin-top:8px; font-style:italic; } /* ── Universe modal ── */ .univ-modal { background:#111a14;border:1px solid var(--glass-b);border-radius:var(--r); width:100%;max-width:680px;max-height:88vh;overflow-y:auto; padding:28px;position:relative; box-shadow:0 24px 80px rgba(0,0,0,.6); transform:translateY(12px);transition:transform .25s; } .modal-overlay.open .univ-modal { transform:translateY(0); } .univ-stat-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px;margin:16px 0; } .univ-stat-card { background:var(--glass);border:1px solid var(--glass-b);border-radius:var(--r-sm); padding:14px 16px; } .univ-stat-val { font-size:1.3rem;font-weight:700; background:linear-gradient(135deg,var(--text) 0%,var(--green) 100%); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; margin-bottom:4px; } .univ-stat-label { font-size:.65rem;color:var(--dim);letter-spacing:.08em;text-transform:uppercase; } .univ-progress-wrap { margin:16px 0; } .univ-progress-label { display:flex;justify-content:space-between; font-size:.75rem;color:var(--muted);margin-bottom:6px; } .univ-progress-bar { height:8px;background:rgba(255,255,255,.06);border-radius:4px;overflow:hidden; } .univ-progress-fill { height:100%;border-radius:4px; background:linear-gradient(90deg,var(--green) 0%,var(--green2) 100%); transition:width .6s ease; } .univ-breakdown-grid { display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:12px 0; } .univ-breakdown-row { display:flex;justify-content:space-between; font-size:.78rem;padding:5px 10px; background:var(--glass);border-radius:6px; } .univ-breakdown-label { color:var(--muted); } .univ-breakdown-val { font-weight:600;color:var(--text); } /* ── Badges ── */ .badge { display:inline-flex;align-items:center;gap:3px; padding:2px 8px;border-radius:var(--r-pill); font-size:.62rem;font-weight:600;letter-spacing:.04em; text-transform:uppercase; } .badge-green { background:rgba(123,178,144,.18);color:var(--green); border:1px solid var(--green-b); } .badge-amber { background:rgba(240,160,84,.12); color:var(--amber); border:1px solid rgba(240,160,84,.25); } .badge-red { background:rgba(224,95,95,.12); color:var(--red); border:1px solid rgba(224,95,95,.25); } .badge-blue { background:rgba(100,160,240,.10);color:#90b8f0; border:1px solid rgba(100,160,240,.2); } .badge-dim { background:var(--glass);color:var(--dim); border:1px solid var(--glass-b); } .card-badges { display:flex;flex-wrap:wrap;gap:4px;margin-top:6px; } /* ── Factor family row ── */ .fam-grid { display:flex;flex-direction:column;gap:6px;margin-top:10px; } /* Unified quality list: family group headers + per-factor research basis */ .qf-fam { font-size:.74rem;font-weight:700;color:var(--text);margin:18px 0 0;letter-spacing:.01em; } .qf-item { display:flex;flex-direction:column;gap:1px; } .qf-study { font-size:.62rem;color:var(--dim);line-height:1.35;padding-left:2px; } .fam-row { display:grid;grid-template-columns:160px 1fr 42px;align-items:center;gap:8px; font-size:.73rem; } .fam-bar-wrap { background:rgba(255,255,255,.06);border-radius:100px;height:5px;overflow:hidden; } .fam-bar-fill { height:100%;border-radius:100px;background:var(--green);transition:width .3s;min-width:7px; } .fam-score { text-align:right;font-weight:600;font-size:.73rem; } .fam-missing { color:var(--dim);font-style:italic; } /* ── Source confidence bar ── */ .src-conf-bar { display:flex;align-items:center;gap:8px;font-size:.72rem;margin-top:4px; } .src-conf-fill { flex:1;background:rgba(255,255,255,.06);border-radius:100px;height:4px;overflow:hidden; } .src-conf-inner { height:100%;border-radius:100px;transition:width .3s; } /* ── Alpha factor audit table ── */ .factor-audit { width:100%;border-collapse:collapse;font-size:.72rem;margin-top:8px; } .factor-audit th { text-align:left;padding:4px 8px;color:var(--dim); font-weight:500;font-size:.65rem;text-transform:uppercase;letter-spacing:.05em; border-bottom:1px solid var(--glass-b); } .factor-audit td { padding:5px 8px;border-bottom:1px solid rgba(255,255,255,.04);vertical-align:top; } .factor-audit tr.factor-missing td { color:var(--dim);font-style:italic; } .factor-audit tr.factor-ok td:first-child { color:var(--text); } .factor-audit .fa-score { font-weight:700; } .factor-audit .fa-basis { color:var(--dim);font-size:.65rem; } /* ── Reconciliation event row ── */ .recon-events { display:flex;flex-direction:column;gap:4px;margin-top:6px; } .recon-event { padding:6px 10px;border-radius:8px;font-size:.72rem; border-left:3px solid; } .recon-event.error { background:rgba(224,95,95,.08); border-color:var(--red); color:var(--text); } .recon-event.warning { background:rgba(240,160,84,.08);border-color:var(--amber); color:var(--text); } .recon-event.info { background:var(--glass); border-color:var(--green-b);color:var(--muted); } /* ── Data mode badge on card ── */ .card-mode-evidence { color:var(--green); font-size:.64rem;font-weight:600; } .card-mode-momentum { color:var(--amber); font-size:.64rem;font-weight:600; } /* ── Stats panel – new layout ── */ .stats-panel { display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:12px;margin-top:24px; } .stat-card { background:var(--glass);border:1px solid var(--glass-b);border-radius:var(--r-sm); padding:14px 16px;text-align:center; } .stat-card-val { font-size:1.5rem;font-weight:700;color:var(--green);line-height:1.1; } .stat-card-label { font-size:.67rem;color:var(--dim);margin-top:3px;text-transform:uppercase;letter-spacing:.05em; } .stat-card-note { font-size:.62rem;color:var(--dim);margin-top:2px;font-style:italic; } /* ── Responsive ── */ @media (max-width:640px) { .hero { padding:48px 16px 40px; } .section { padding:40px 16px; } .stock-card { padding:18px; } .card-top { flex-direction:column;gap:4px; } .card-score-wrap { display:flex;align-items:center;gap:10px; } .card-score { font-size:1.5rem; } .fb-row { grid-template-columns:90px 1fr 30px; } .footer-inner { flex-direction:column; align-items:flex-start; gap:3px; } } /* ── Fair Value Model Stack ── */ .fv-consensus { background:rgba(123,178,144,.08);border:1px solid rgba(123,178,144,.2); border-radius:8px;padding:12px 14px;margin:8px 0 12px; } .fv-range-row { display:flex;justify-content:space-between;font-size:.8rem;margin-bottom:4px; } .fv-bear { color:var(--red); } .fv-bull { color:var(--green); } .fv-base { font-size:.9rem; } .fv-meta { font-size:.72rem;color:var(--dim);margin-top:4px; } .fv-note { font-size:.65rem;color:var(--dim);margin:6px 0 0;line-height:1.5; } .fv-table { margin:8px 0; } .fv-table-header,.fv-model-row { display:grid;grid-template-columns:1fr 160px 36px;align-items:center; gap:4px;padding:3px 0;border-bottom:1px solid rgba(255,255,255,.04); } .fv-family-group { margin-bottom:8px; } .fv-family-label { font-size:.65rem;text-transform:uppercase;letter-spacing:.07em;color:var(--dim);padding:6px 0 2px;border-bottom:1px solid rgba(255,255,255,.08); } .fv-model-name { font-size:.74rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; } .fv-model-vals { display:flex;gap:6px;justify-content:flex-end;font-size:.72rem;font-family:monospace; } .fv-bear-val { color:var(--red);min-width:50px;text-align:right; } .fv-base-val { min-width:54px;text-align:right; } .fv-bull-val { color:var(--green);min-width:50px;text-align:right; } .fv-conf { font-size:.66rem;text-align:center;border-radius:4px;padding:1px 4px; } .fv-conf-hi { background:rgba(123,178,144,.18);color:var(--green); } .fv-conf-med { background:rgba(240,160,84,.15);color:var(--amber); } .fv-conf-lo { background:rgba(255,255,255,.07);color:var(--dim); } .fv-skipped { margin-top:8px;border-radius:6px;background:rgba(255,255,255,.04);padding:6px 8px; } /* ══════════════════════════════════════════════════════════════════════════════ DATA COMMAND CENTER ══════════════════════════════════════════════════════════════════════════════ */ /* ── Command Center shell ── */ .cc-section { background:rgba(255,255,255,.025); border:1px solid rgba(123,178,144,.15); border-radius:var(--r); padding:28px 28px 24px; margin:0 0 32px; } .cc-terminal-header { display:flex;align-items:center;gap:10px; font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase; color:var(--green);margin-bottom:22px; } .cc-terminal-header::before { content:'';display:inline-block;width:8px;height:8px;border-radius:50%; background:var(--green);box-shadow:0 0 6px var(--green); animation:ccBlink 2.4s ease-in-out infinite; } @keyframes ccBlink { 0%,100%{opacity:1} 50%{opacity:.3} } /* ── 6-col metric grid ── */ .cc-metrics { display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:20px; } .cc-metric { background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08); border-radius:var(--r-sm);padding:14px 16px; } .cc-metric-val { font-size:1.4rem;font-weight:700;color:var(--green);line-height:1.1; } .cc-metric-label { font-size:.62rem;color:var(--dim);margin-top:3px;text-transform:uppercase;letter-spacing:.06em; } .cc-metric-note { font-size:.6rem;color:var(--dim);margin-top:2px;font-style:italic;opacity:.75; } /* ── Two-panel row (pipeline + activity) ── */ .cc-panels { display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:4px; } .cc-panel { background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08); border-radius:var(--r-sm);padding:14px 16px; } .cc-panel-title { font-size:.67rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em; color:var(--muted);margin-bottom:10px; } .cc-row { display:flex;justify-content:space-between;align-items:baseline;padding:3px 0;font-size:.78rem; } .cc-row + .cc-row { border-top:1px solid rgba(255,255,255,.04); } .cc-row-key { color:var(--muted);flex-shrink:0; } .cc-row-val { color:var(--text);text-align:right;margin-left:8px;word-break:break-all; } /* ── Progress bar ── */ .cc-progress-wrap { margin:10px 0 12px; } .cc-progress-track { background:rgba(255,255,255,.07);border-radius:4px;height:6px; overflow:hidden;position:relative; } .cc-progress-fill { height:100%;border-radius:4px;background:var(--green); transition:width .6s ease; } /* ── Status chips ── */ .cc-chip { display:inline-block;font-size:.62rem;font-weight:600; padding:1px 6px;border-radius:4px;vertical-align:middle; } .cc-chip-green { background:rgba(123,178,144,.18);color:var(--green); } .cc-chip-amber { background:rgba(240,160,84,.15);color:var(--amber); } .cc-chip-red { background:rgba(224,95,95,.12);color:var(--red); } .cc-chip-blue { background:rgba(100,160,220,.12);color:#7ab0e0; } .cc-chip-dim { background:rgba(255,255,255,.06);color:var(--dim); } /* ── Inline status dot ── */ .cc-dot { display:inline-block;width:6px;height:6px;border-radius:50%; vertical-align:middle;margin-right:4px; } .cc-dot-green { background:var(--green); } .cc-dot-amber { background:var(--amber); } .cc-dot-red { background:var(--red); } .cc-dot-dim { background:var(--dim); } /* ══════════════════════════════════════════════════════════════════════════════ SOURCE STATUS MATRIX ══════════════════════════════════════════════════════════════════════════════ */ .src-matrix-section { margin:0 0 32px; } .src-matrix-section .section-hdr { margin-bottom:4px; } .src-group { margin-bottom:20px; } .src-group-header { display:flex;align-items:center;gap:10px;padding:8px 0; cursor:pointer;user-select:none;border-bottom:1px solid rgba(255,255,255,.07); margin-bottom:10px; } .src-group-header:hover .src-group-title { color:var(--text); } .src-group-title { font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em; color:var(--muted);transition:color .15s; } .src-group-count { font-size:.65rem;color:var(--dim); background:rgba(255,255,255,.06);border-radius:10px;padding:1px 7px; } .src-group-toggle { font-size:.75rem;color:var(--dim);margin-left:auto; } .src-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px; } .src-card { background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07); border-left:3px solid transparent;border-radius:var(--r-sm); padding:10px 12px;position:relative; } .src-card-active { border-left-color:var(--green); } .src-card-discovery_ready{ border-left-color:var(--amber); } .src-card-not_configured { border-left-color:rgba(255,255,255,.2); } .src-card-cooldown { border-left-color:var(--red); } .src-card-planned { border-left-color:rgba(255,255,255,.1); opacity:.6; } .src-card-name { font-size:.75rem;font-weight:600;color:var(--text);line-height:1.3; } .src-card-key { font-size:.6rem;color:var(--dim);font-family:monospace;margin-top:1px; } .src-card-status { display:inline-block;font-size:.58rem;font-weight:700;text-transform:uppercase; letter-spacing:.06em;padding:1px 5px;border-radius:3px;margin-top:5px; } .src-status-active { background:rgba(123,178,144,.15);color:var(--green); } .src-status-discovery_ready { background:rgba(240,160,84,.13);color:var(--amber); } .src-status-not_configured { background:rgba(255,255,255,.07);color:var(--dim); } .src-status-cooldown { background:rgba(224,95,95,.12);color:var(--red); } .src-status-planned { background:rgba(255,255,255,.05);color:var(--dim); } .src-role-pill { display:inline-block;font-size:.58rem;text-transform:uppercase;letter-spacing:.05em; padding:0px 5px;border-radius:3px;margin-left:4px;vertical-align:middle; border:1px solid rgba(255,255,255,.1);color:var(--dim); } .src-role-filing { border-color:rgba(123,178,144,.3);color:rgba(123,178,144,.8); } .src-role-prices { border-color:rgba(100,180,240,.3);color:rgba(100,180,240,.8); } .src-role-identity { border-color:rgba(200,160,80,.3);color:rgba(200,160,80,.8); } .src-role-universe { border-color:rgba(160,120,220,.3);color:rgba(160,120,220,.8); } .src-role-macro { border-color:rgba(200,100,100,.3);color:rgba(200,100,100,.8); } .src-role-validator { border-color:rgba(180,180,180,.3);color:rgba(180,180,180,.8); } /* ── Source group body collapse ── */ .src-group-body.collapsed { display:none; } /* ══════════════════════════════════════════════════════════════════════════════ CROSS-VALIDATION PANEL ══════════════════════════════════════════════════════════════════════════════ */ .val-section { margin:0 0 32px; } .val-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px; } .val-card { background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08); border-radius:var(--r-sm);padding:12px 14px; } .val-num { font-size:1.3rem;font-weight:700;color:var(--green); } .val-label { font-size:.63rem;color:var(--dim);margin-top:2px;text-transform:uppercase;letter-spacing:.06em; } .val-bar-wrap { margin-top:7px;height:4px;background:rgba(255,255,255,.07);border-radius:2px;overflow:hidden; } .val-bar-fill { height:100%;background:var(--green);border-radius:2px; } /* ── Automatic updates + history panels ── */ .au-panel { display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:32px; } .au-card { background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08); border-radius:var(--r-sm);padding:16px 18px; } .au-card-title { font-size:.67rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em; color:var(--muted);margin-bottom:10px; } /* ── Responsive overrides ── */ @media (max-width:900px) { .cc-metrics { grid-template-columns:repeat(3,1fr); } .cc-panels { grid-template-columns:1fr; } .au-panel { grid-template-columns:1fr; } } @media (max-width:540px) { .cc-section { padding:18px 16px; } .cc-metrics { grid-template-columns:repeat(2,1fr); } .src-grid { grid-template-columns:1fr 1fr; } .val-grid { grid-template-columns:repeat(2,1fr); } } /* ══════════════════════════════════════════════════════════════════════════════ API KEY CENTER ══════════════════════════════════════════════════════════════════════════════ */ .akc-table { width:100%;border-collapse:collapse;font-size:.78rem; } .akc-table th { text-align:left;font-size:.63rem;font-weight:700;text-transform:uppercase; letter-spacing:.08em;color:var(--dim);padding:6px 10px; border-bottom:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.03); } .akc-table td { padding:9px 10px;border-bottom:1px solid rgba(255,255,255,.05); vertical-align:top; } .akc-table tr:hover td { background:rgba(255,255,255,.025); } /* Key status badges */ .akc-badge { display:inline-flex;align-items:center;gap:4px; font-size:.62rem;font-weight:700;padding:2px 7px;border-radius:4px; white-space:nowrap; } .akc-badge-ok { background:rgba(123,178,144,.18);color:var(--green); } .akc-badge-missing { background:rgba(240,160,84,.15);color:var(--amber); } .akc-badge-nokey { background:rgba(123,178,144,.1);color:rgba(123,178,144,.7); } .akc-badge-upgrade { background:rgba(100,160,220,.12);color:#7ab0e0; } .akc-badge-notrecom{ background:rgba(255,255,255,.06);color:var(--dim); } .akc-badge-free { background:rgba(123,178,144,.1);color:rgba(123,178,144,.6);font-size:.58rem; } .akc-badge-nofree { background:rgba(224,95,95,.1);color:rgba(224,95,95,.7);font-size:.58rem; } /* Priority indicator */ .akc-pri { display:inline-block;font-size:.6rem;font-weight:700;text-transform:uppercase; letter-spacing:.06em;padding:1px 5px;border-radius:3px; } .akc-pri-critical { background:rgba(224,95,95,.18);color:var(--red); } .akc-pri-high { background:rgba(123,178,144,.18);color:var(--green); } .akc-pri-medium { background:rgba(240,160,84,.15);color:var(--amber); } .akc-pri-low { background:rgba(255,255,255,.08);color:var(--muted); } .akc-pri-optional { background:rgba(255,255,255,.05);color:var(--dim); } .akc-pri-notrecom { background:rgba(255,255,255,.04);color:var(--dim); } .akc-action-link { color:var(--green);text-decoration:none;font-size:.72rem; } .akc-action-link:hover { text-decoration:underline; } .akc-source-name { font-weight:600;color:var(--text); } .akc-source-value { font-size:.7rem;color:var(--muted);margin-top:2px; } .akc-limit-note { font-size:.67rem;color:var(--dim); } .akc-action-text { font-size:.7rem;color:var(--muted);margin-top:3px; } /* Group header inside AKC */ .akc-group-hdr td { padding:10px 10px 4px;font-size:.63rem;font-weight:700;text-transform:uppercase; letter-spacing:.09em;color:var(--muted);border-bottom:none; background:rgba(255,255,255,.02); } /* ══════════════════════════════════════════════════════════════════════════════ IMPROVED SOURCE STATUS MATRIX (status-grouped) ══════════════════════════════════════════════════════════════════════════════ */ .srm-summary { display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px; } .srm-summary-chip { display:flex;align-items:center;gap:6px;padding:6px 12px; background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08); border-radius:var(--r-sm);font-size:.72rem;cursor:pointer; transition:border-color .15s; } .srm-summary-chip:hover { border-color:rgba(255,255,255,.2); } .srm-summary-chip-n { font-size:1.1rem;font-weight:700; } .srm-summary-chip-label { color:var(--muted);font-size:.65rem; } .srm-chip-active .srm-summary-chip-n { color:var(--green); } .srm-chip-discovery .srm-summary-chip-n { color:var(--amber); } .srm-chip-needs_key .srm-summary-chip-n { color:#7ab0e0; } .srm-chip-planned .srm-summary-chip-n { color:var(--dim); } .srm-status-group { margin-bottom:18px; } .srm-status-hdr { display:flex;align-items:center;gap:8px; padding:8px 0;border-bottom:1px solid rgba(255,255,255,.07); margin-bottom:10px;cursor:pointer;user-select:none; } .srm-status-title { font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em; } .srm-status-count { font-size:.65rem;background:rgba(255,255,255,.07); border-radius:10px;padding:1px 7px;color:var(--dim); } .srm-status-toggle { margin-left:auto;font-size:.75rem;color:var(--dim); } .srm-cards { display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px; } .srm-card { background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07); border-left:3px solid transparent;border-radius:var(--r-sm); padding:10px 12px; } .srm-card-active { border-left-color:var(--green); } .srm-card-discovery_ready{ border-left-color:var(--amber); } .srm-card-not_configured { border-left-color:#7ab0e0; } .srm-card-planned { border-left-color:rgba(255,255,255,.1);opacity:.65; } .srm-card-cooldown { border-left-color:var(--red); } .srm-card-name { font-size:.75rem;font-weight:600;color:var(--text);line-height:1.3; } .srm-card-meta { font-size:.62rem;color:var(--dim);margin-top:3px;line-height:1.5; } .srm-card-key { font-size:.6rem;color:var(--dim);font-family:monospace; } .srm-body.collapsed { display:none; } /* Role pill in SRM */ .srm-role { display:inline-block;font-size:.57rem;text-transform:uppercase;letter-spacing:.05em; padding:0px 4px;border-radius:3px;border:1px solid rgba(255,255,255,.1); color:var(--dim);vertical-align:middle;margin-top:2px; } .srm-role-filing { border-color:rgba(123,178,144,.3);color:rgba(123,178,144,.75); } .srm-role-prices { border-color:rgba(100,180,240,.3);color:rgba(100,180,240,.75); } .srm-role-identity { border-color:rgba(200,160,80,.3);color:rgba(200,160,80,.75); } .srm-role-universe { border-color:rgba(160,120,220,.3);color:rgba(160,120,220,.75); } .srm-role-macro { border-color:rgba(200,100,100,.3);color:rgba(200,100,100,.75); } .srm-role-optional { border-color:rgba(180,180,180,.2);color:rgba(180,180,180,.5); } @media (max-width:640px) { .akc-table th:nth-child(4), .akc-table td:nth-child(4) { display:none; } .srm-cards { grid-template-columns:1fr 1fr; } } /* ── Source Ingestion Matrix (sim-*) ─────────────────────────────────────── */ .sim-exec-bar { display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px;padding:10px 0; border-bottom:1px solid rgba(255,255,255,.06); } .sim-exec-metric { text-align:center;padding:6px 14px; } .sim-exec-n { display:block;font-size:1.2rem;font-weight:700;line-height:1.2; } .sim-exec-lbl { display:block;font-size:.6rem;color:var(--dim);text-transform:uppercase;letter-spacing:.06em;margin-top:2px; } .sim-status-group { margin-bottom:6px;border-radius:8px;border:1px solid rgba(255,255,255,.05);overflow:hidden; } .sim-status-hdr { display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer; background:rgba(255,255,255,.03);user-select:none; } .sim-status-hdr:hover { background:rgba(255,255,255,.06); } .sim-status-dot { width:7px;height:7px;border-radius:50%;flex-shrink:0; } .sim-status-title { font-size:.72rem;font-weight:600;flex:1; } .sim-status-count { font-size:.65rem;color:var(--dim);background:rgba(255,255,255,.07);border-radius:99px;padding:1px 7px; } .sim-status-toggle{ font-size:.65rem;color:var(--dim); } .sim-body { padding:10px; } .sim-body.collapsed { display:none; } .sim-cards { display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:6px; } .sim-card { background:rgba(255,255,255,.04);border-radius:7px; border-left:3px solid rgba(255,255,255,.08);padding:8px 10px; } .sim-card-used_in_scoring { border-left-color:var(--green); } .sim-card-ingested { border-left-color:#4caf8a; } .sim-card-discovered { border-left-color:var(--amber); } .sim-card-discovery_ready { border-left-color:#e0b040; } .sim-card-needs_api_key { border-left-color:#7ab0e0; } .sim-card-cooldown { border-left-color:var(--red); } .sim-card-discovery_failed,.sim-card-ingestion_failed { border-left-color:#c06060;opacity:.8; } .sim-card-planned { border-left-color:rgba(255,255,255,.1);opacity:.6; } .sim-card-name { font-size:.72rem;font-weight:600;color:var(--text);line-height:1.3;margin-bottom:3px; } .sim-card-info { font-size:.6rem;color:var(--dim);margin-bottom:3px; } .sim-cat { display:inline-block;font-size:.55rem;padding:0px 4px;border-radius:3px;border:1px solid rgba(255,255,255,.08);margin-left:4px; } .sim-cat-filing_fundamental { border-color:rgba(123,178,144,.25);color:rgba(123,178,144,.7); } .sim-cat-exchange_universe { border-color:rgba(160,120,220,.25);color:rgba(160,120,220,.7); } .sim-cat-identity { border-color:rgba(200,160,80,.25);color:rgba(200,160,80,.7); } .sim-cat-price { border-color:rgba(100,180,240,.25);color:rgba(100,180,240,.7); } .sim-cat-macro { border-color:rgba(200,100,100,.25);color:rgba(200,100,100,.7); } .sim-cat-validator{ border-color:rgba(180,180,180,.15);color:rgba(180,180,180,.5); } .sim-region { margin-right:4px; } .sim-card-metrics { font-size:.62rem;color:var(--muted);margin-top:4px;line-height:1.6; } .sim-card-error { font-size:.6rem;color:#c06060;margin-top:4px;line-height:1.4; } /* ── Database Coverage (dc-*) ────────────────────────────────────────────── */ .dc-exec-row { display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px; padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.06); } .dc-exec-card { flex:1 1 120px;padding:10px 14px;background:rgba(255,255,255,.04); border-radius:8px;text-align:center; } .dc-exec-val { font-size:1.15rem;font-weight:700;line-height:1.2; } .dc-exec-lbl { font-size:.6rem;color:var(--dim);text-transform:uppercase;letter-spacing:.05em;margin-top:3px; } .dc-progress { margin-bottom:12px; } .dc-progress-label { display:flex;justify-content:space-between;font-size:.68rem;margin-bottom:6px;color:var(--muted); } .dc-bar-wrap { height:6px;background:rgba(255,255,255,.07);border-radius:3px;overflow:hidden;position:relative; } .dc-bar { height:100%;border-radius:3px;transition:width .6s ease; } .dc-bar-pending { position:absolute;top:0;right:0;height:100%;background:rgba(255,255,255,.04); } .dc-multi-row { display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px; } .dc-multi-item { text-align:center;padding:6px 12px; } .dc-multi-n { font-size:1rem;font-weight:700;line-height:1.2; } .dc-multi-lbl { font-size:.6rem;color:var(--dim);margin-top:2px; } .dc-raw-section { margin-top:12px; } .dc-raw-table { width:100%;border-collapse:collapse;font-size:.68rem;margin-top:6px; } .dc-raw-table th { padding:5px 8px;text-align:left;font-size:.6rem;text-transform:uppercase;letter-spacing:.05em; color:var(--dim);border-bottom:1px solid rgba(255,255,255,.06); } .dc-raw-table td { padding:4px 8px;border-bottom:1px solid rgba(255,255,255,.04); } .dc-raw-table tr:hover td { background:rgba(255,255,255,.03); } .dc-run-summary { display:flex;flex-wrap:wrap;gap:12px;margin-bottom:12px;padding:8px 10px; background:rgba(255,255,255,.04);border-radius:6px;font-size:.68rem;color:var(--muted); border-left:3px solid var(--green); } .dc-run-label { color:var(--dim);font-size:.6rem;text-transform:uppercase;letter-spacing:.05em; } .dc-empty { padding:16px;font-size:.8rem;color:var(--dim); } @media (max-width:640px) { .sim-cards { grid-template-columns:1fr 1fr; } .dc-exec-row { gap:6px; } .dc-multi-row { gap:6px; } } /* ══════════════════════════════════════════════════════════════════════════════ DATA COMMAND CENTER — new layout ══════════════════════════════════════════════════════════════════════════════ */ /* ── DCC grid + stat cards ── */ .dcc-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; margin:12px 0; } .dcc-card { background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08); border-radius:var(--r-sm);padding:12px 14px; } .dcc-val { font-size:1.45rem;font-weight:700;color:var(--green);line-height:1.1; } .dcc-label { font-size:.62rem;color:var(--dim);margin-top:3px;text-transform:uppercase;letter-spacing:.06em; } .dcc-note { font-size:.6rem;color:var(--dim);margin-top:2px;font-style:italic;opacity:.8; } /* ── DCC progress bar ── */ .dcc-progress-wrap { margin:10px 0; } .dcc-progress-labels { display:flex;justify-content:space-between; font-size:.68rem;color:var(--muted);margin-bottom:4px; } .dcc-progress-track { height:6px;background:rgba(255,255,255,.07);border-radius:4px;overflow:hidden; } .dcc-progress-fill { height:100%;border-radius:4px; background:linear-gradient(90deg,var(--green) 0%,var(--green2) 100%); transition:width .6s ease; } /* ── DCC status line ── */ .dcc-status-line { display:flex;align-items:center;gap:6px; font-size:.75rem;margin-bottom:12px; } /* ── DCC warning banner ── */ .dcc-warning { font-size:.73rem;color:var(--amber);background:rgba(240,160,84,.07); border:1px solid rgba(240,160,84,.2);border-radius:var(--r-sm); padding:7px 12px;margin:6px 0; } .dcc-warning code { font-family:monospace;font-size:.7rem;opacity:.85; } /* ── DCC next action panel ── */ .dcc-next-action { background:rgba(123,178,144,.06);border:1px solid rgba(123,178,144,.15); border-radius:var(--r-sm);padding:10px 14px;margin-top:10px; } .dcc-next-title { font-size:.62rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--green);margin-bottom:5px; } .dcc-next-primary { font-size:.8rem;color:var(--text);font-weight:500; } .dcc-next-secondary{ font-size:.72rem;color:var(--dim);margin-top:3px; } /* ══════════════════════════════════════════════════════════════════════════════ SOURCE BUCKETS ══════════════════════════════════════════════════════════════════════════════ */ /* ── Summary chip row ── */ .src-bkts-summary { display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px; } .src-bkt-chip { display:flex;align-items:center;gap:5px; background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1); border-radius:var(--r-pill);padding:4px 12px; font-size:.72rem;cursor:pointer;transition:background .15s; } .src-bkt-chip:hover { background:rgba(255,255,255,.09); } .src-bkt-chip-n { font-weight:700;font-size:.85rem; } .src-bkt-chip-lbl { color:var(--muted); } /* ── Bucket group ── */ .src-bkt-group { margin-bottom:8px;border:1px solid rgba(255,255,255,.06);border-radius:var(--r-sm);overflow:hidden; } .src-bkt-hdr { display:flex;align-items:center;gap:8px; padding:10px 14px;cursor:pointer;background:rgba(255,255,255,.03); transition:background .15s; } .src-bkt-hdr:hover { background:rgba(255,255,255,.06); } .src-bkt-dot { width:7px;height:7px;border-radius:50%;flex-shrink:0; } .src-bkt-title { font-size:.82rem;font-weight:600;flex:1; } .src-bkt-count { font-size:.72rem;font-weight:600;color:var(--muted); } .src-bkt-note { font-size:.68rem;color:var(--dim);margin-left:4px; } .src-bkt-toggle { color:var(--dim);font-size:.75rem;margin-left:auto;flex-shrink:0; } .src-bkt-body { overflow:hidden;transition:max-height .25s ease; } .src-bkt-body.collapsed{ display:none; } .src-bkt-cards { display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:8px;padding:10px 12px; } /* ── Individual source card ── */ .src-card { background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07); border-radius:8px;padding:10px 12px;font-size:.78rem; } .src-card-name { font-weight:600;color:var(--text);margin-bottom:2px; } .src-card-role { font-size:.68rem;color:var(--muted);margin-bottom:5px;line-height:1.4; } .src-card-meta { display:flex;flex-wrap:wrap;gap:4px;margin-bottom:3px; } .src-card-stats { font-size:.65rem;color:var(--dim);margin-top:3px; } .src-card-error { font-size:.62rem;color:var(--red);margin-top:4px; background:rgba(224,95,95,.07);border-radius:4px;padding:3px 6px; overflow:hidden;text-overflow:ellipsis;white-space:nowrap; } /* ── Source region + flags ── */ .src-region { font-size:.62rem;color:var(--dim); background:rgba(255,255,255,.05);border-radius:4px;padding:1px 5px; } .src-flag { font-size:.58rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase; border-radius:4px;padding:1px 5px; } .src-flag-alpha { background:rgba(123,178,144,.15);color:var(--green);border:1px solid var(--green-b); } .src-flag-fv { background:rgba(100,160,240,.10);color:#90b8f0;border:1px solid rgba(100,160,240,.2); } /* ══════════════════════════════════════════════════════════════════════════════ METHOD DETAILS + DEV SECTION ══════════════════════════════════════════════════════════════════════════════ */ .method-details { margin-top:16px; border:1px solid rgba(255,255,255,.07);border-radius:var(--r-sm); overflow:hidden; } .method-details > summary { padding:10px 16px;cursor:pointer;font-size:.78rem;color:var(--muted); background:rgba(255,255,255,.03); list-style:none; display:flex;align-items:center;gap:6px; } .method-details > summary::before { content:'▸';color:var(--dim);font-size:.7rem; } .method-details[open] > summary::before { content:'▾'; } .method-details > summary:hover { background:rgba(255,255,255,.06); } .method-details > *:not(summary) { padding:0 16px 16px; } .dev-section { display:none; } .dev-only { display:none; } /* ══════════════════════════════════════════════════════════════════════════════ SEARCH BAR — v3 ══════════════════════════════════════════════════════════════════════════════ */ .search-wrap { margin-bottom:20px; } .search-box-row { display:flex;align-items:center;gap:0; background:rgba(255,255,255,.06);border:1px solid var(--glass-b); border-radius:var(--r);padding:0 14px; transition:border-color .18s; } .search-box-row:focus-within { border-color:rgba(123,178,144,.5); } .search-icon { flex-shrink:0;color:var(--dim);pointer-events:none;margin-right:10px; } .search-input { flex:1;background:transparent;border:none;outline:none; color:var(--text);font-family:inherit;font-size:.88rem; padding:13px 4px; } .search-input::placeholder { color:var(--dim); } .search-clear { background:none;border:none;cursor:pointer; color:var(--dim);font-size:.9rem;padding:4px 6px; display:none;transition:color .15s; } .search-clear:hover { color:var(--muted); } .search-hint { font-size:.72rem;color:var(--dim);margin-top:7px; display:flex;align-items:center;gap:8px;flex-wrap:wrap; } .adv-toggle { background:none;border:none;cursor:pointer; color:var(--green);font-size:.72rem;font-family:inherit; padding:0;text-decoration:underline;text-underline-offset:2px; } .adv-toggle:hover { color:var(--green2); } .adv-filters { background:var(--glass);border:1px solid var(--glass-b); border-radius:var(--r);padding:16px 20px;margin-top:10px; } .adv-filters-inner { display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end; } /* ══════════════════════════════════════════════════════════════════════════════ ACTIVE SOURCES PANEL — v3 ══════════════════════════════════════════════════════════════════════════════ */ .sources-panel { background:var(--glass);border:1px solid var(--glass-b); border-radius:var(--r);padding:18px 22px; } .sources-two-col { display:grid;grid-template-columns:1fr 1fr;gap:16px; margin-bottom:16px; } .sources-col-title { font-size:.64rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase; color:var(--muted);margin-bottom:8px; } .sources-badges { display:flex;flex-wrap:wrap;gap:5px; } /* Source badges */ .src-badge { display:inline-flex;align-items:center;gap:4px; padding:3px 10px;border-radius:var(--r-pill); font-size:.66rem;font-weight:600;letter-spacing:.03em; } .src-badge-green { background:rgba(123,178,144,.14);color:var(--green);border:1px solid rgba(123,178,144,.3); } .src-badge-green::before { content:'●';font-size:.55rem; } .src-badge-blue { background:rgba(100,160,240,.10);color:#90b8f0;border:1px solid rgba(100,160,240,.25); } .src-badge-amber { background:rgba(240,160,84,.12);color:var(--amber);border:1px solid rgba(240,160,84,.28); } .src-badge-red { background:rgba(224,95,95,.10);color:var(--red);border:1px solid rgba(224,95,95,.25); } .src-badge-dim { background:rgba(255,255,255,.05);color:var(--dim);border:1px solid rgba(255,255,255,.09); } /* Stats row */ .sources-stats-row { display:flex;flex-wrap:wrap;gap:0; border-top:1px solid var(--glass-b);border-bottom:1px solid var(--glass-b); margin-bottom:14px; } .sources-stat { flex:1 1 100px;padding:10px 14px;text-align:center; border-right:1px solid var(--glass-b); } .sources-stat:last-child { border-right:none; } .sources-stat-val { display:block;font-size:1.2rem;font-weight:700;color:var(--green);line-height:1.1; } .sources-stat-lbl { display:block;font-size:.6rem;color:var(--dim);margin-top:3px; text-transform:uppercase;letter-spacing:.06em; } /* Progress bars */ .sources-progress-row { display:grid;grid-template-columns:1fr 1fr;gap:14px; margin-bottom:12px; } .sources-progress-item {} .sources-progress-label { display:flex;justify-content:space-between; font-size:.68rem;color:var(--muted);margin-bottom:5px; } .sources-prog-track { height:5px;background:rgba(255,255,255,.07); border-radius:3px;overflow:hidden; } .sources-prog-fill { height:100%;background:linear-gradient(90deg,var(--green) 0%,var(--green2) 100%); border-radius:3px;transition:width .6s ease; } /* Footer */ .sources-footer { display:flex;flex-wrap:wrap;gap:6px;padding-top:10px; border-top:1px solid var(--glass-b); } @media (max-width:640px) { .sources-two-col { grid-template-columns:1fr; } .sources-stats-row { gap:0; } .sources-stat { flex:1 1 80px; padding:8px 8px; } .sources-stat-val { font-size:1rem; } .sources-progress-row { grid-template-columns:1fr; } } /* ══════════════════════════════════════════════════════════════════════════════ STOCK CARD — REDESIGNED v3 ══════════════════════════════════════════════════════════════════════════════ */ /* Card header: ticker/name on left, confidence badge on right */ .card-header { display:flex;align-items:flex-start;justify-content:space-between; gap:12px;margin-bottom:6px; } /* Override old card-identity width constraint */ .card-header .card-identity { flex:1;min-width:0; } .card-header .card-ticker { font-size:1.15rem;font-weight:700;letter-spacing:.03em; display:flex;align-items:baseline;gap:6px; } .card-exchange { font-size:.65rem;color:var(--dim);font-weight:500; letter-spacing:.04em; } .card-conf-badge { flex-shrink:0; display:inline-flex;align-items:center;gap:4px; padding:3px 10px;border-radius:var(--r-pill); font-size:.64rem;font-weight:700;letter-spacing:.06em; border:1px solid;text-transform:uppercase;white-space:nowrap; } /* FV row: price → arrow → FV → upside */ .card-fv-row { display:flex;align-items:center;justify-content:space-around; gap:8px;margin-bottom:12px; padding:10px 14px; background:rgba(255,255,255,.03);border-radius:var(--r-sm); } .card-fv-col { text-align:center; } .card-fv-main { padding:0 4px; } .card-fv-arrow { font-size:1.1rem;flex-shrink:0;opacity:.8; } .card-metric-lbl { font-size:.6rem;color:var(--dim);text-transform:uppercase; letter-spacing:.07em;margin-bottom:3px; } .card-metric-val { font-size:.95rem;font-weight:700;color:var(--text); font-variant-numeric:tabular-nums; } .card-fv-val { font-size:1.1rem; } /* FV Gauge */ .fv-gauge-wrap { margin-bottom:8px; } .fv-gauge-track { position:relative;height:6px; background:rgba(255,255,255,.07);border-radius:3px; overflow:visible; } .fv-gauge-band { position:absolute;top:0;height:100%; background:rgba(123,178,144,.18);border-radius:3px; } .fv-gauge-fv-marker { position:absolute;top:-3px; width:3px;height:12px;border-radius:2px; transform:translateX(-50%); box-shadow:0 0 6px currentColor; } .fv-gauge-price-marker { position:absolute;top:-4px; width:14px;height:14px;border-radius:50%; background:var(--amber); transform:translateX(-50%); border:2px solid var(--bg); box-shadow:0 0 6px rgba(240,160,84,.5); } .fv-gauge-labels { display:flex;justify-content:space-between;align-items:center; font-size:.63rem;margin-top:5px; padding:0 2px; } /* Position label + verdict */ .card-pos-label { text-align:center; font-size:.7rem;font-weight:600; margin-top:4px;min-height:14px; } .card-verdict { text-align:center; margin:8px 0 4px; } /* Meta chips row */ .card-meta-row { display:flex;flex-wrap:wrap;gap:5px; margin:8px 0 12px; } .card-meta-chip { background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09); border-radius:var(--r-pill);padding:2px 9px; font-size:.63rem;color:var(--dim); } /* Share button */ .card-btn.share { background:rgba(100,160,240,.08);color:#90b8f0; border:1px solid rgba(100,160,240,.2); } .card-btn.share:hover { background:rgba(100,160,240,.15); } /* ══════════════════════════════════════════════════════════════════════════════ MODAL FAIR VALUE SECTION — v3 ══════════════════════════════════════════════════════════════════════════════ */ .fv-public-block { background:rgba(123,178,144,.05);border:1px solid rgba(123,178,144,.15); border-radius:var(--r-sm);padding:14px 16px; } .fv-pub-row { display:flex;align-items:center;flex-wrap:wrap;gap:4px; margin-bottom:8px; } .fv-pub-sep { font-size:1rem;color:var(--dim);padding:0 4px;flex-shrink:0; } .fv-pub-item { text-align:center;flex:1;min-width:70px; } .fv-pub-main { flex:1.4; } .fv-pub-lbl { font-size:.62rem;color:var(--dim);text-transform:uppercase; letter-spacing:.07em;margin-bottom:3px; } .fv-pub-val { font-size:.95rem;font-weight:700;color:var(--text); font-variant-numeric:tabular-nums; } .fv-pub-val.up { color:var(--green); } .fv-pub-val.down { color:var(--red); } .fv-pub-formula { display:flex;align-items:baseline;gap:6px; padding:6px 0;border-top:1px solid rgba(255,255,255,.06); margin-bottom:6px; } .fv-formula-note { font-size:.68rem;color:var(--dim);line-height:1.6;margin-top:2px; } /* ══════════════════════════════════════════════════════════════════════════════ DEEP DIVE SUMMARY — styled for modal collapsible sections ══════════════════════════════════════════════════════════════════════════════ */ .deep-dive-summary { display:flex;align-items:center;gap:6px; padding:8px 2px;cursor:pointer;list-style:none; font-size:.78rem;font-weight:600;color:var(--muted); transition:color .15s;user-select:none; } .deep-dive-summary::before { content:'▸';color:var(--dim);font-size:.7rem;flex-shrink:0; } details[open] > .deep-dive-summary::before { content:'▾'; } .deep-dive-summary:hover { color:var(--text); } /* ══════════════════════════════════════════════════════════════════════════════ SHARE CARD PREVIEW ══════════════════════════════════════════════════════════════════════════════ */ .share-preview-card { background:#0d1117;border:1px solid rgba(123,178,144,.3); border-radius:var(--r);padding:22px 24px; max-width:380px;margin:0 auto; font-family:'Space Grotesk',system-ui,sans-serif; } .spc-brand { font-size:.62rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase; color:var(--green);margin-bottom:8px; display:flex;align-items:center;gap:6px; } .spc-brand::before { content:'';display:inline-block;width:7px;height:7px;border-radius:50%; background:var(--green);box-shadow:0 0 6px var(--green); } .spc-ticker { font-size:2.2rem;font-weight:700;color:var(--green); letter-spacing:.04em;line-height:1;margin-bottom:4px; } .spc-name { font-size:.8rem;color:var(--muted);margin-bottom:14px; white-space:nowrap;overflow:hidden;text-overflow:ellipsis; } .spc-row { display:flex;justify-content:space-around; padding:12px 0;margin-bottom:12px; border-top:1px solid rgba(255,255,255,.07); border-bottom:1px solid rgba(255,255,255,.07); } .spc-metric { text-align:center; } .spc-lbl { font-size:.58rem;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px; } .spc-val { font-size:1rem;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums; } .spc-fv { color:var(--green); } .spc-chips { display:flex;flex-wrap:wrap;gap:5px;margin-bottom:10px; } .spc-chip { background:rgba(255,255,255,.07);border-radius:var(--r-pill); padding:2px 9px;font-size:.63rem;color:var(--muted); } .spc-verdict { font-size:.72rem;color:var(--muted); margin-bottom:8px;line-height:1.5; } .spc-disclaimer { font-size:.6rem;color:var(--dim); border-top:1px solid rgba(255,255,255,.06); padding-top:8px;margin-top:4px;line-height:1.6; } /* ── Valuation meter statement ── */ .val-meter-stmt { font-size:.72rem;color:var(--muted);text-align:center; margin-top:6px;line-height:1.5; } /* ── Card ticker row (ticker + exchange on one line) ── */ .card-ticker-row { display:flex;align-items:baseline;gap:6px; } /* ── Card footer: buttons left / meta chips right ── */ .card-footer { display:flex;align-items:center;justify-content:space-between; flex-wrap:wrap;gap:10px;margin-top:14px; } .card-meta-chips { display:flex;flex-wrap:wrap;gap:5px;align-items:center;justify-content:flex-end; } /* ── Results bar separator ── */ .results-bar-sep { color:var(--dim);margin:0 4px; } /* ── Modal note (non-warn paragraph) ── */ .modal-note { font-size:.72rem;color:var(--dim);line-height:1.6; padding:6px 0; } /* ══════════════════════════════════════════════════════════════════════════════ STATUS TOP BAR — v4 ══════════════════════════════════════════════════════════════════════════════ */ .status-top-inner { display:flex;align-items:flex-start;justify-content:space-between; gap:20px;flex-wrap:wrap; background:var(--glass);border:1px solid var(--glass-b); border-radius:var(--r);padding:18px 22px; } .status-top-left { display:flex;align-items:flex-start;gap:14px; flex:1;min-width:220px; } .status-live-dot { width:10px;height:10px;border-radius:50%; background:var(--green);box-shadow:0 0 10px rgba(123,178,144,.7); flex-shrink:0;margin-top:4px; animation:blink 2.4s ease-in-out infinite; } .status-top-headline { font-size:.95rem;font-weight:700;color:var(--text);line-height:1.3; } .status-top-sub { font-size:.72rem;color:var(--muted);margin-top:3px;line-height:1.5; max-width:340px; } .status-top-right { flex:1;min-width:220px; } .status-badges { display:flex;flex-wrap:wrap;gap:5px;margin-bottom:10px; } .status-badge { display:inline-flex;align-items:center;gap:4px; padding:3px 10px;border-radius:var(--r-pill); font-size:.64rem;font-weight:600;letter-spacing:.04em; } .status-badge-green { background:rgba(123,178,144,.13);color:var(--green);border:1px solid rgba(123,178,144,.3); } .status-badge-green::before { content:'●';font-size:.5rem; } .status-badge-blue { background:rgba(100,160,240,.10);color:#90b8f0;border:1px solid rgba(100,160,240,.25); } .status-meta-row { display:flex;align-items:center;flex-wrap:wrap;gap:6px; font-size:.73rem;color:var(--muted); } .status-meta-item { display:inline-flex;align-items:center;gap:4px; } .status-meta-sep { color:var(--dim);font-size:.7rem; } .status-prog-track { display:inline-block;width:52px;height:5px; background:rgba(255,255,255,.07);border-radius:3px;overflow:hidden; vertical-align:middle; } .status-prog-fill { height:100%;background:linear-gradient(90deg,var(--green) 0%,var(--green2) 100%); border-radius:3px; } .status-cron-ok { color:var(--green);font-weight:600; } .status-cron-off { color:var(--dim); } .status-dim { color:var(--dim); } /* ══════════════════════════════════════════════════════════════════════════════ RESULTS BAR — v4 ══════════════════════════════════════════════════════════════════════════════ */ .results-bar { display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap; gap:8px;margin-bottom:20px; font-size:.78rem;color:var(--muted); min-height:26px; } .results-bar-sort { color:var(--dim);font-size:.73rem; } /* Result-summary line + evidence/sort toggle controls */ .fvc-ctx-left { display:flex;align-items:baseline;flex-wrap:wrap;gap:5px;min-width:0; } .fvc-ctx-region { color:var(--text);font-weight:600; } .fvc-ctx-ev, .fvc-ctx-sort { color:var(--dim); } .fvc-ctx-count { color:var(--muted); } .fvc-ctrl-row { display:flex;align-items:center;gap:8px;flex-shrink:0; } .fvc-sort-toggle { display:inline-flex;align-items:center;gap:6px; background:rgba(123,178,144,.07); border:1px solid rgba(123,178,144,.28); color:var(--text); font-size:.75rem;font-weight:600; padding:7px 13px;border-radius:var(--r-pill,999px); cursor:pointer;white-space:nowrap;line-height:1; transition:background .14s,border-color .14s,opacity .14s,transform .05s; } .fvc-sort-toggle:hover { background:rgba(123,178,144,.15);border-color:rgba(123,178,144,.5); } .fvc-sort-toggle:active { transform:translateY(1px); } .fvc-ev-toggle.is-high { background:rgba(123,178,144,.16);border-color:var(--green,#7BB290);color:var(--green,#7BB290); } .fvc-sort-caret { font-size:.6rem;opacity:.7;transform:translateY(1px); } .fvc-lbl-short { display:none; } /* Busy: dim the controls (no layout shift) while a fetch is in flight */ .results-bar.fvc-bar-busy .fvc-ctrl-row { opacity:.55;pointer-events:none; } /* Elegant loading state on the list area while switching sort/filter/page */ #cards.fvc-list-loading { position:relative;opacity:.5;pointer-events:none;transition:opacity .12s; } #cards.fvc-list-loading::after { content:"";position:absolute;left:0;right:0;top:0;height:2px;border-radius:2px; background:linear-gradient(90deg,transparent,var(--green,#7BB290),transparent); background-size:40% 100%;background-repeat:no-repeat; animation:fvcListBar 1.1s ease-in-out infinite; } @keyframes fvcListBar { 0%{background-position:-40% 0;} 100%{background-position:140% 0;} } @media (max-width:640px) { /* Controls drop to their own full-width row below the summary; short labels. */ .results-bar { flex-direction:column;align-items:stretch; } .fvc-ctrl-row { width:100%;justify-content:flex-end; } .fvc-sort-toggle { flex:0 0 auto; } .fvc-lbl-full { display:none; } .fvc-lbl-short { display:inline; } } /* ══════════════════════════════════════════════════════════════════════════════ SEARCH SUGGESTIONS — v4 ══════════════════════════════════════════════════════════════════════════════ */ .search-suggestions { background:#111a14;border:1px solid rgba(123,178,144,.25); border-radius:var(--r-sm); margin-top:4px;overflow:hidden; box-shadow:0 8px 28px rgba(0,0,0,.45); position:relative;z-index:100; } .sugg-item { display:flex;align-items:center;justify-content:space-between; padding:10px 14px;cursor:pointer; border-bottom:1px solid rgba(255,255,255,.04); transition:background .12s; } .sugg-item:last-child { border-bottom:none; } .sugg-item:hover { background:rgba(255,255,255,.05); } .sugg-left { display:flex;align-items:baseline;gap:8px; } .sugg-right { display:flex;align-items:center;gap:6px;flex-shrink:0; } .sugg-ticker { font-weight:700;font-size:.88rem;color:var(--text); } .sugg-name { font-size:.73rem;color:var(--dim);max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; } .sugg-upside { font-size:.73rem;font-weight:600; } .sugg-conf { font-size:.62rem;font-weight:600;padding:1px 7px;border-radius:var(--r-pill); letter-spacing:.04em;text-transform:uppercase; } .sugg-empty { padding:12px 14px;font-size:.78rem;color:var(--dim);text-align:center; } /* Subtle autocomplete loading row (only shown when a lookup exceeds ~150ms) */ .fvc-sug-loading { display:flex;align-items:center;gap:9px; padding:11px 14px;font-size:.78rem;color:var(--dim); } .fvc-sug-spin { width:12px;height:12px;border-radius:50%;flex-shrink:0; border:2px solid rgba(123,178,144,.3);border-top-color:var(--green,#7BB290); animation:fvcSugSpin .6s linear infinite; } @keyframes fvcSugSpin { to { transform:rotate(360deg); } } /* ══════════════════════════════════════════════════════════════════════════════ STOCK CARD — v4 redesigned numbers layout ══════════════════════════════════════════════════════════════════════════════ */ /* Ticker row + company name open the detail view on click */ .card-open { cursor:pointer; } .card-open:hover .card-ticker, .card-open:hover { color:var(--green,#7BB290); } .card-company { font-size:.96rem;font-weight:600;color:rgba(233,241,236,.92);margin:2px 0 10px; letter-spacing:.005em; white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%; } /* sector / ethics / penny / shared chips — own full-width row under the name */ .card-subbadges { display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 12px; } .card-subbadges:empty { display:none; } .card-exch { font-size:.63rem;color:var(--dim);font-weight:500;letter-spacing:.04em; } /* Sector chip under the company name — clickable → filter by sector */ .card-sector { display:inline-block;margin-top:6px;cursor:pointer; font-size:.62rem;font-weight:600;letter-spacing:.03em; padding:2px 8px;border-radius:999px; background:rgba(123,178,144,.10);border:1px solid rgba(123,178,144,.24); color:var(--green);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px; transition:background .15s,border-color .15s; } .card-sector:hover { background:rgba(123,178,144,.18);border-color:rgba(123,178,144,.4); } /* Subtle social-proof badge — only rendered when a stock has shares (>0). */ .card-shared-badge { display:inline-block;margin:6px 0 0 6px; font-size:.58rem;font-weight:600;letter-spacing:.03em; padding:2px 8px;border-radius:999px; background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12); color:var(--muted,rgba(233,241,236,.7));white-space:nowrap; } /* Penny-stock badge — warns that the Fair Value / upside is noise at a sub-10¢ share price. Flag only (never hidden); muted red so it reads as a caveat. */ .card-penny-badge { display:inline-block;margin:6px 0 0 6px;cursor:default; font-size:.58rem;font-weight:700;letter-spacing:.03em; padding:2px 8px;border-radius:999px; background:rgba(224,138,138,.12);border:1px solid rgba(224,138,138,.34); color:#e08a8a;white-space:nowrap; } /* Values exposure badge on cards — neutral amber, never alarming. Only shown when an exposure is clearly inferred from the industry (max 2 per card). */ .card-ethics-badge { display:inline-block;margin:6px 0 0 6px;cursor:default; font-size:.58rem;font-weight:600;letter-spacing:.03em; padding:2px 8px;border-radius:999px; background:rgba(240,160,84,.12);border:1px solid rgba(240,160,84,.3); color:var(--amber,#f0a054);white-space:nowrap; } /* "N hidden by your values" note above the card grid. */ .fvc-values-note { grid-column:1/-1;font-size:.8rem;color:var(--muted); background:rgba(123,178,144,.07);border:1px solid rgba(123,178,144,.18); border-radius:12px;padding:10px 14px;margin-bottom:4px;line-height:1.5; } .fvc-values-note .dim { color:var(--dim);font-size:.74rem; } .fvc-values-clear { background:none;border:none;cursor:pointer;color:var(--green); font:inherit;font-weight:700;text-decoration:underline;padding:0; } /* Values & ESG detail section */ .ve-sub { font-size:.78rem;color:var(--muted);font-weight:600;margin:0 0 8px; } .ve-flags { display:flex;flex-wrap:wrap;gap:7px; } .ve-flag { font-size:.7rem;font-weight:600;padding:3px 10px;border-radius:999px; background:rgba(240,160,84,.12);border:1px solid rgba(240,160,84,.3);color:var(--amber,#f0a054); } .ve-clean { font-size:.78rem;color:var(--dim); } .ve-empty { font-size:.8rem;color:var(--dim);line-height:1.5; } .ve-esg-grid { display:flex;flex-wrap:wrap;gap:14px;margin:2px 0 4px; } .ve-metric { display:flex;flex-direction:column;gap:1px;min-width:74px; } .ve-m-lbl { font-size:.66rem;color:var(--dim);text-transform:uppercase;letter-spacing:.04em; } .ve-m-val { font-size:1.05rem;font-weight:800;color:var(--text,#eef4f0); } .ve-meta { font-size:.7rem;color:var(--dim);margin-top:10px; } /* Sector / industry row in the detail modal overview */ .modal-meta-row { display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px; } .modal-meta-chip { cursor:pointer;font-size:.68rem;font-weight:600;letter-spacing:.03em; padding:3px 10px;border-radius:999px; background:rgba(123,178,144,.12);border:1px solid rgba(123,178,144,.3);color:var(--green); transition:background .15s,border-color .15s; } .modal-meta-chip:hover { background:rgba(123,178,144,.2);border-color:rgba(123,178,144,.45); } .modal-meta-sub { font-size:.74rem;color:var(--muted); } @media (max-width:560px){ .card-sector { font-size:.58rem;padding:2px 7px;max-width:160px; } } /* Confidence pill (clickable, replaces old conf-badge on card) */ .card-conf-pill { flex-shrink:0;display:inline-flex;align-items:center; padding:4px 12px;border-radius:var(--r-pill); font-size:.66rem;font-weight:700;letter-spacing:.05em; border:1px solid;cursor:pointer;white-space:nowrap; transition:opacity .15s; } .card-conf-pill:hover { opacity:.8; } /* badge group at the top-right of the card: [Alpha Quality 82] [evidence] */ .card-badges { flex-shrink:0; display:flex; align-items:center; gap:6px; flex-wrap:wrap; justify-content:flex-end; } .card-aq-pill { display:inline-flex; align-items:center; padding:4px 11px; border-radius:var(--r-pill); font-size:.66rem; font-weight:700; letter-spacing:.04em; white-space:nowrap; border:1px solid; } .card-aq-pill.aq-strong { background:rgba(123,178,144,.16); border-color:rgba(123,178,144,.45); color:var(--green); } .card-aq-pill.aq-mid { background:rgba(240,160,84,.12); border-color:rgba(240,160,84,.32); color:var(--amber); } .card-aq-pill.aq-weak { background:rgba(255,255,255,.05); border-color:var(--glass-b); color:var(--muted); } @media (max-width:560px){ .card-aq-pill, .card-conf-pill { font-size:.6rem; padding:3px 9px; } } /* Numbers row: price / fv / upside — 3-column with dividers */ .card-numbers { display:flex;align-items:stretch; gap:0;margin-bottom:14px; padding:0; background:rgba(255,255,255,.03);border-radius:var(--r-sm); overflow:hidden; } .card-num-col { flex:1;text-align:center;padding:13px 10px; } .card-num-divider { width:1px;background:rgba(255,255,255,.08); flex-shrink:0;margin:10px 0; } .card-num-arrow { display:none; } .card-num-fv, .card-num-upside { } .card-num-lbl { font-size:.59rem;color:var(--dim);text-transform:uppercase; letter-spacing:.07em;margin-bottom:5px; } .card-num-val { font-size:1.05rem;font-weight:700;color:var(--text); font-variant-numeric:tabular-nums; } .card-val-pill { display:none; } /* Valuation label beneath gauge */ .card-val-label { display:flex;align-items:center;gap:5px; font-size:.7rem;font-weight:600;margin:4px 0 8px; justify-content:center; } .card-val-dot { width:7px;height:7px;border-radius:50%;flex-shrink:0; } /* Chip row (models / factors / SEC) */ .card-chips { display:flex;flex-wrap:wrap;gap:5px;margin:8px 0 14px; } .card-chip { background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09); border-radius:var(--r-pill);padding:2px 9px; font-size:.62rem;color:var(--dim); } /* Card buttons v4 */ .card-btn.primary-btn { background:var(--green);color:#0a1a10; border:none; } .card-btn.primary-btn:hover { background:var(--green2); } .card-btn.share-btn { background:rgba(100,160,240,.08);color:#90b8f0; border:1px solid rgba(100,160,240,.2); } .card-btn.share-btn:hover { background:rgba(100,160,240,.15); } .card-btn.calc-btn { background:var(--green-d);color:var(--green); border:1px solid var(--green-b); } .card-btn.calc-btn:hover { background:rgba(123,178,144,.18); } /* ══════════════════════════════════════════════════════════════════════════════ VALUATION METER — v5 (smiley marker, anti-overlap labels) ══════════════════════════════════════════════════════════════════════════════ */ .val-meter { margin:0 0 8px;user-select:none; animation:fadeIn .35s ease; } @keyframes fadeIn { from{opacity:0;transform:translateY(3px)} to{opacity:1;transform:translateY(0)} } /* Track: margin provides space for above/below labels */ .val-meter-track { position:relative;height:7px; background:rgba(255,255,255,.07);border-radius:4px; overflow:visible; margin:42px 0 48px; } /* Bear/bull band */ .val-meter-bear-bull-band { position:absolute;top:0;height:100%; background:rgba(255,255,255,.055);border-radius:3px; pointer-events:none; } /* Fair zone band */ .val-meter-fair-band { position:absolute;top:0;height:100%; background:rgba(123,178,144,.28);border-radius:3px; border:1px solid rgba(123,178,144,.32); } /* FV marker — green bar with pulse glow */ .val-meter-fv-marker { position:absolute;top:-4px;transform:translateX(-50%); width:3px;height:15px;border-radius:2px; background:var(--green); z-index:1; animation:fvPulse 2.6s ease-in-out infinite; } @keyframes fvPulse { 0%,100%{box-shadow:0 0 5px rgba(123,178,144,.55)} 50% {box-shadow:0 0 14px rgba(123,178,144,1),0 0 22px rgba(123,178,144,.4)} } /* FV label — always ABOVE the track */ .vml-fv-label { position:absolute;bottom:calc(100% + 17px); transform:translateX(-50%); color:var(--green);white-space:nowrap; font-size:.6rem;font-weight:600;line-height:1; pointer-events:none; text-shadow:0 0 8px rgba(123,178,144,.5); } /* ── Emoji price marker ── */ .val-meter-smiley { position:absolute;top:-23px; width:52px;height:52px;border-radius:50%; transform:translateX(-50%); display:flex;align-items:center;justify-content:center; border:2px solid; cursor:pointer;z-index:3; transition:transform .22s cubic-bezier(.4,0,.2,1); animation:smileIn .45s cubic-bezier(.34,1.56,.64,1); } .val-meter-smiley:hover { transform:translateX(-50%) scale(1.15); } .vml-emoji { font-size:30px;line-height:1;display:block; } @keyframes smileIn { from{opacity:0;transform:translateX(-50%) scale(0.45)} to {opacity:1;transform:translateX(-50%) scale(1)} } /* Smiley colour variants */ .val-meter-smiley.happy { background:rgba(18,36,22,.95); border-color:rgba(123,178,144,.72); box-shadow:0 0 14px rgba(123,178,144,.44),0 0 30px rgba(123,178,144,.14); } .val-meter-smiley.neutral { background:rgba(18,20,18,.95); border-color:rgba(232,240,235,.25); box-shadow:none; } .val-meter-smiley.sad { background:rgba(38,16,16,.95); border-color:rgba(224,95,95,.62); box-shadow:0 0 12px rgba(224,95,95,.34),0 0 24px rgba(224,95,95,.12); } /* Tooltip on hover */ .val-meter-smiley .vml-tooltip { display:none; position:absolute;bottom:calc(100% + 7px);left:50%; transform:translateX(-50%); background:rgba(12,20,14,.96); border:1px solid rgba(123,178,144,.2); border-radius:6px;padding:4px 10px; white-space:nowrap;font-size:.6rem; color:var(--text);z-index:10; pointer-events:none; box-shadow:0 4px 14px rgba(0,0,0,.45); } .val-meter-smiley:hover .vml-tooltip { display:block; } /* Price label — BELOW the track, clear of smiley bottom edge */ .vml-price-label { position:absolute;top:calc(100% + 32px); transform:translateX(-50%); color:var(--muted);white-space:nowrap; font-size:.6rem;line-height:1; pointer-events:none; } .vml-price-label.hidden { display:none; } /* Valuation status pill inside card numbers row */ .card-val-pill { font-size:.6rem;font-weight:700;letter-spacing:.06em; text-transform:uppercase;align-self:flex-end; margin-left:auto;padding-bottom:2px; white-space:nowrap; } /* ══════════════════════════════════════════════════════════════════════════════ MODAL v4 — topbar, summary bar, tabs ══════════════════════════════════════════════════════════════════════════════ */ .modal-topbar { display:flex;align-items:flex-start;justify-content:space-between; gap:12px;margin-bottom:14px; } .modal-ticker { font-size:1.3rem;font-weight:700;letter-spacing:.04em;color:var(--text);line-height:1.2; } .modal-company { font-size:.78rem;color:var(--muted);margin-top:2px; max-width:340px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; } .modal-summary-bar { display:flex;align-items:center;flex-wrap:wrap;gap:0; background:rgba(255,255,255,.03);border:1px solid var(--glass-b); border-radius:var(--r-sm);padding:10px 16px;margin-bottom:16px; } .msb-item { flex:1;text-align:center;padding:0 10px; } .msb-lbl { font-size:.62rem;color:var(--dim);text-transform:uppercase;letter-spacing:.07em;margin-bottom:4px; } .msb-val { font-size:1.18rem;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums; } .msb-arrow { font-size:1.1rem;padding:0 4px;flex-shrink:0; } .msb-divider { width:1px;height:32px;background:var(--glass-b); flex-shrink:0;margin:0 4px; } /* Tab navigation */ .modal-tabs { display:flex;gap:2px;overflow-x:auto;justify-content:space-between; margin-bottom:16px; border-bottom:1px solid var(--glass-b); -webkit-overflow-scrolling:touch; scrollbar-width:none; } .modal-tabs::-webkit-scrollbar { display:none; } .modal-tab { background:none;border:none;border-bottom:2px solid transparent; padding:8px 14px;margin-bottom:-1px; font-family:inherit;font-size:.75rem;font-weight:600; color:var(--dim);cursor:pointer;white-space:nowrap; transition:color .15s,border-color .15s; } .modal-tab:hover { color:var(--muted); } .modal-tab.active { color:var(--green);border-bottom-color:var(--green); } .tab-panel { display:none; } .tab-panel.active { display:block; } /* ── Mobile stock-detail bottom sheet (≤768px) ────────────────────────────── Simple, robust single-scroller: the sheet (.modal) is itself the scroll container. Slides up from the bottom; content scrolls; the tab bar is sticky; drag the handle/title down to dismiss. All rules are gated to ≤768px, so desktop Details is unchanged. */ .sheet-handle { display:none; } /* never shown on desktop */ /* Background scroll lock WITHOUT position:fixed — so the page never jumps and stays exactly where it was on close. Locking overflow:hidden on BOTH html and body freezes the document scroll regardless of which element owns it. */ html.fvc-scroll-locked, body.fvc-scroll-locked { overflow:hidden !important; } @media (max-width:768px) { .modal-overlay.modal-sheet { align-items:flex-end; padding:0; } .modal-overlay.modal-sheet .modal { max-width:none; width:100%; max-height:90vh; padding:0 0 26px; border-radius:18px 18px 0 0; border-bottom:none; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; transform:translateY(100%); transition:transform .30s cubic-bezier(.22,.61,.36,1); } .modal-overlay.modal-sheet.sheet-in .modal { transform:translateY(0); } /* Drag handle — sits at the very top (drag zone; touch-action set in JS). */ .modal-sheet .sheet-handle { display:block; width:40px; height:5px; border-radius:3px; background:rgba(255,255,255,.22); margin:9px auto 6px; cursor:grab; } .modal-sheet .modal-topbar { padding:0 18px; margin-bottom:10px; } .modal-sheet .modal-summary-bar { margin:0 18px 12px; } /* Sticky tab bar — stays visible at the top of the sheet while scrolling. 4 tabs spread evenly across the screen width (no horizontal scroll). */ .modal-sheet .modal-tabs { position:sticky; top:0; z-index:5; display:flex; overflow-x:hidden; background:#111a14; margin:0; padding:5px 12px 0; box-shadow:0 1px 0 var(--glass-b); } .modal-sheet .modal-tab { flex:1 1 0; text-align:center; padding:12px 4px; min-height:44px; font-size:.72rem; white-space:nowrap; } .modal-sheet .tab-panel { display:block !important; padding:14px 18px 0; } } @media (prefers-reduced-motion: reduce) { .modal-overlay.modal-sheet .modal { transition:none; } } /* ══════════════════════════════════════════════════════════════════════════════ FV EXPLAIN BOX — v4 ══════════════════════════════════════════════════════════════════════════════ */ .fv-explain-box { background:rgba(123,178,144,.05);border:1px solid rgba(123,178,144,.15); border-radius:var(--r-sm);padding:14px 16px; } .fv-explain-row { display:flex;align-items:center;flex-wrap:wrap; gap:4px;margin-bottom:10px; } .fv-explain-item { text-align:center;flex:1;min-width:68px; } .fv-explain-main { flex:1.3; } .fv-explain-sep { font-size:1.1rem;color:var(--dim);padding:0 4px;flex-shrink:0; } .fv-explain-lbl { font-size:.6rem;color:var(--dim);text-transform:uppercase; letter-spacing:.07em;margin-bottom:3px; } .fv-explain-val { font-size:.95rem;font-weight:700;color:var(--text); font-variant-numeric:tabular-nums; } .fv-explain-upside { display:flex;align-items:baseline;flex-wrap:wrap;gap:6px; padding:8px 0;border-top:1px solid rgba(255,255,255,.06); margin-bottom:8px; } .fv-explain-note { font-size:.68rem;color:var(--dim);line-height:1.6; } /* Collapsible "How is this calculated?" explanation */ .fv-explain-details { border-top:1px solid rgba(255,255,255,.06); } .fv-explain-details > summary { list-style:none;cursor:pointer;padding:8px 0 4px; font-size:.72rem;font-weight:700;color:var(--green,#7BB290); display:flex;align-items:center;gap:6px;user-select:none; } .fv-explain-details > summary::-webkit-details-marker { display:none; } .fv-explain-details > summary::after { content:"▾";font-size:.6rem;color:var(--dim);transition:transform .18s ease; } .fv-explain-details[open] > summary::after { transform:rotate(180deg); } .fv-explain-details > summary:hover { filter:brightness(1.1); } .fv-explain-details .fv-explain-note { padding-bottom:4px; } .pos-val { color:var(--green); } .neg-val { color:var(--red); } /* Factor family name */ .fam-name { color:var(--muted); } /* ══════════════════════════════════════════════════════════════════════════════ EVIDENCE TAB — v4 ══════════════════════════════════════════════════════════════════════════════ */ .evidence-row { padding:10px 0;border-bottom:1px solid rgba(255,255,255,.04); } .evidence-row:last-child { border-bottom:none; } /* ── Peer Group comparison (detail page) ───────────────────────────────────── */ .peer-section .peer-sec { font-size:.72rem; font-weight:600; color:var(--dim,#9aa6a0); } .peer-intro { font-size:.74rem; color:var(--dim,#9aa6a0); line-height:1.45; margin:2px 0 14px; } .peer-row { margin-bottom:14px; } .peer-row-top { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:6px; } .peer-lbl { font-size:.82rem; font-weight:600; color:var(--text,#e9f1ec); } .peer-verdict { font-size:.78rem; font-weight:700; } .peer-bar { position:relative; height:8px; border-radius:5px; background:rgba(255,255,255,.07); } .peer-band { position:absolute; top:0; bottom:0; background:rgba(123,178,144,.16); border-radius:5px; } .peer-median { position:absolute; top:-3px; bottom:-3px; width:2px; background:rgba(233,241,236,.55); border-radius:2px; transform:translateX(-1px); } .peer-marker { position:absolute; top:50%; width:14px; height:14px; border-radius:50%; border:2px solid #0e1512; box-shadow:0 1px 4px rgba(0,0,0,.5); transform:translate(-50%, -50%); z-index:2; } .peer-evidence { margin-top:6px; font-size:.78rem; color:var(--dim,#9aa6a0); } .peer-evidence .peer-lbl { font-size:.78rem; margin-right:4px; } .evidence-header { display:flex;align-items:center;justify-content:space-between; margin-bottom:4px; } .evidence-fam { font-weight:600;font-size:.8rem;color:var(--text); } .evidence-score { font-weight:700;font-size:.8rem;font-variant-numeric:tabular-nums; } .evidence-citation { font-size:.71rem;color:var(--dim);line-height:1.55; } /* ══════════════════════════════════════════════════════════════════════════════ CONFIDENCE EXPLAIN — v4 ══════════════════════════════════════════════════════════════════════════════ */ .conf-row { display:flex;align-items:baseline;gap:8px; padding:7px 0;border-bottom:1px solid rgba(255,255,255,.04); font-size:.78rem; } .conf-row:last-child { border-bottom:none; } .conf-pass .conf-icon { color:var(--green);font-size:.75rem; } .conf-miss .conf-icon { color:var(--dim);font-size:.75rem; } .conf-pass .conf-label { color:var(--text); } .conf-miss .conf-label { color:var(--muted); } .conf-detail { color:var(--dim);font-size:.7rem;margin-left:auto;text-align:right; } /* ══════════════════════════════════════════════════════════════════════════════ SHARE MODAL — v4 ══════════════════════════════════════════════════════════════════════════════ */ .spc-val-label { text-align:center;font-size:.8rem;font-weight:700; margin-bottom:8px;padding:4px 0; } .share-btn-row { display:flex;flex-wrap:wrap;gap:8px;margin-top:8px; } /* ══════════════════════════════════════════════════════════════════════════════ MODAL UTILITY — v4 ══════════════════════════════════════════════════════════════════════════════ */ .modal-text { font-size:.78rem;color:var(--muted);line-height:1.65;margin-bottom:8px; } .modal-disclaimer { font-size:.66rem;color:var(--dim);line-height:1.6;margin-top:16px; padding-top:12px;border-top:1px solid var(--glass-b); font-style:italic; } /* ══════════════════════════════════════════════════════════════════════════════ RESPONSIVE — v4 additions ══════════════════════════════════════════════════════════════════════════════ */ @media (max-width:640px) { .status-top-inner { flex-direction:column;gap:14px; } .card-numbers { padding:0; } .card-num-col { padding:10px 8px; } .card-num-val { font-size:.88rem; } .modal-summary-bar { padding:8px 6px; } .msb-item { padding:0 4px; } .msb-val { font-size:.98rem; } .modal-tabs { gap:0; } .modal-tab { padding:8px 10px;font-size:.7rem; } .val-meter-labels { font-size:.6rem; } .share-btn-row { flex-direction:column; } } /* ══════════════════════════════════════════════════════════════════════════════ SHARE MODAL — v5 (platform workflow, caption, native + fallback) ══════════════════════════════════════════════════════════════════════════════ */ .sm-header { margin-bottom:14px;padding-bottom:12px; border-bottom:1px solid var(--glass-b); } .sm-ticker { font-size:1.4rem;font-weight:700;color:var(--text);line-height:1.1; } .sm-company { font-size:.77rem;color:var(--muted);margin-top:3px; } .sm-preview-wrap { position:relative; background:#0a0f0b; border:1px solid rgba(123,178,144,.18); border-radius:var(--r-sm);overflow:hidden; margin-bottom:14px;text-align:center;min-height:60px; } .sm-preview-canvas { width:100%;height:auto;display:block; } .sm-platform-row { display:grid;grid-template-columns:1fr 1fr;gap:8px; margin-bottom:10px; } .sm-platform-btn { display:flex;align-items:center;justify-content:center;gap:8px; padding:10px 12px;border-radius:var(--r-sm); font-family:inherit;font-size:.8rem;font-weight:600; cursor:pointer;border:1px solid; transition:background .18s,transform .12s,box-shadow .18s; white-space:nowrap; } .sm-platform-btn:hover { transform:translateY(-1px); } .sm-instagram { background:linear-gradient(135deg,rgba(131,58,180,.13) 0%,rgba(193,53,132,.13) 50%,rgba(253,88,53,.13) 100%); border-color:rgba(193,53,132,.28);color:rgba(226,120,172,.9); } .sm-instagram:hover { background:linear-gradient(135deg,rgba(131,58,180,.2) 0%,rgba(193,53,132,.2) 50%,rgba(253,88,53,.2) 100%); box-shadow:0 4px 14px rgba(193,53,132,.15); } .sm-tiktok { background:rgba(0,0,0,.25);border-color:rgba(255,255,255,.14); color:rgba(232,240,235,.8); } .sm-tiktok:hover { background:rgba(255,255,255,.07); } .sm-secondary-row { display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px; } .sm-action-btn { display:inline-flex;align-items:center;gap:5px; padding:5px 11px;border-radius:var(--r-pill); font-family:inherit;font-size:.73rem;font-weight:600; cursor:pointer; background:var(--glass);color:var(--muted); border:1px solid var(--glass-b); transition:background .18s; } .sm-action-btn:hover { background:rgba(255,255,255,.09); } .sm-status { padding:7px 12px;border-radius:var(--r-sm); font-size:.76rem;line-height:1.55;margin-top:6px; } .sm-status.success{background:rgba(123,178,144,.09);border:1px solid rgba(123,178,144,.25);color:var(--green);} .sm-status.info {background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.09);color:var(--muted);} .sm-status.error {background:rgba(224,95,95,.07);border:1px solid rgba(224,95,95,.2);color:var(--red);} .sm-caption-preview { background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07); border-radius:var(--r-sm);padding:9px 12px; font-size:.7rem;color:var(--dim);line-height:1.7; white-space:pre-wrap;max-height:90px;overflow-y:auto; margin-bottom:8px; } /* Format toggle (Instagram Post / Story·TikTok) */ .sm-format-toggle { display:flex;gap:6px;background:rgba(255,255,255,.04);border:1px solid var(--glass-b);border-radius:var(--r-pill);padding:4px;margin-bottom:14px; } .sm-fmt-btn { flex:1;padding:8px 10px;border:none;border-radius:var(--r-pill);background:transparent;color:var(--muted);font-family:inherit;font-size:.78rem;font-weight:700;cursor:pointer;transition:background .15s,color .15s; } .sm-fmt-btn.active { background:var(--green);color:#0e1512; } /* Story (9:16) preview constrained by height so the modal stays compact */ .sm-preview-wrap.is-story { display:flex;justify-content:center; } .sm-preview-wrap.is-story .sm-preview-canvas { width:auto;height:64vh;max-height:560px;max-width:100%; } /* Primary share row */ .sm-primary-row { display:flex;gap:8px;margin-bottom:8px; } .sm-share-btn { flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px; padding:11px 14px;border-radius:var(--r-sm);border:1px solid var(--green); background:var(--green);color:#0e1512;font-family:inherit;font-size:.84rem;font-weight:800; cursor:pointer;transition:transform .12s,box-shadow .18s; } .sm-share-btn:hover { transform:translateY(-1px);box-shadow:0 6px 18px rgba(123,178,144,.3); } .sm-primary-row .sm-action-btn { padding:11px 16px;font-size:.8rem; } .sm-wa { color:#54c878;border-color:rgba(84,200,120,.3); } /* ── Coming-soon Pro upsell card (watchlist panel) ── */ .fvc-pro-card { margin-top:14px;padding:18px;border-radius:16px; background:linear-gradient(180deg, rgba(123,178,144,.07), rgba(255,255,255,.02)); border:1px solid rgba(123,178,144,.28); } .fvc-pro-soon { display:inline-block;font-size:.6rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase; color:var(--green);background:rgba(123,178,144,.14);border:1px solid rgba(123,178,144,.32); padding:3px 9px;border-radius:999px; } .fvc-pro-title { font-size:1.15rem;font-weight:800;color:var(--text);margin-top:9px; } .fvc-pro-sub { font-size:.8rem;color:var(--muted);margin-top:3px;line-height:1.45; } .fvc-pro-feats { list-style:none;margin:14px 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 16px; } .fvc-pro-feats li { position:relative;padding-left:24px;font-size:.8rem;color:var(--text);line-height:1.35; } .fvc-pro-feats li::before { content:'✓';position:absolute;left:0;top:0;color:var(--green);font-weight:800; } .fvc-pro-btn { display:flex;align-items:center;justify-content:center;width:100%;box-sizing:border-box; text-align:center;text-decoration:none;padding:13px 16px;border-radius:var(--r-pill); background:var(--green);color:#0e1512;font-weight:800;font-size:.9rem;transition:transform .12s,box-shadow .18s; } .fvc-pro-btn:hover { transform:translateY(-1px);box-shadow:0 6px 18px rgba(123,178,144,.32); } .fvc-pro-note { text-align:center;font-size:.72rem;color:var(--dim);margin-top:8px; } /* ── Header Go Pro button ── */ .hdr-pro-btn { display:inline-flex;align-items:center;gap:6px; background:rgba(123,178,144,.14);border:1px solid rgba(123,178,144,.42); color:var(--green);font-weight:800; } .hdr-pro-btn:hover { background:rgba(123,178,144,.24);border-color:var(--green); } .hdr-pro-btn.is-pro { background:var(--green);border-color:var(--green);color:#0e1512; } .hdr-account-btn { font-weight:600; } /* ── Sign-in (magic-link) / Pro modal ── (tightened, balanced, premium) */ .login-modal { padding:10px 6px 4px;text-align:center; } .login-title { font-size:1.2rem;font-weight:800;color:var(--text);letter-spacing:-.01em; } .login-sub { font-size:.85rem;color:var(--muted);line-height:1.55;margin:8px auto 18px;max-width:340px; } .login-modal form { margin:0; } #login-email { width:100%;box-sizing:border-box;background:rgba(12,19,15,.72);text-align:center; border:1px solid rgba(123,178,144,.35);border-radius:10px; padding:12px 14px;color:var(--text,#eef4f0);font-size:16px;outline:none;margin-bottom:12px; } #login-email:focus { border-color:var(--green);box-shadow:0 0 0 3px rgba(123,178,144,.18); } #cf-ts-box { display:flex;justify-content:center; } /* Contact form (founder Mail badge) — reuses the sign-in input look */ .fvc-contact input[type="text"], .fvc-contact input[type="email"], .fvc-contact textarea { width:100%;box-sizing:border-box;background:rgba(12,19,15,.72); border:1px solid rgba(123,178,144,.35);border-radius:10px; padding:12px 14px;color:var(--text,#eef4f0);font-size:16px;font-family:inherit;outline:none;margin-bottom:10px; } .fvc-contact textarea { text-align:left;resize:vertical;min-height:92px;line-height:1.5; } .fvc-contact input:focus, .fvc-contact textarea:focus { border-color:var(--green);box-shadow:0 0 0 3px rgba(123,178,144,.18); } #ct-hp { position:absolute;left:-9999px;width:1px;height:1px;opacity:0; } /* honeypot */ .login-btn { display:flex;align-items:center;justify-content:center; width:100%;box-sizing:border-box;padding:13px 16px;border:none;border-radius:999px;cursor:pointer; background:var(--green);color:#0e1512;font-family:inherit;font-size:.92rem;font-weight:800; transition:transform .12s,box-shadow .18s; } .login-btn:hover { transform:translateY(-1px);box-shadow:0 6px 18px rgba(123,178,144,.32); } .login-status { margin-top:12px;padding:9px 12px;border-radius:10px;font-size:.8rem;line-height:1.5; } .login-status.ok { background:rgba(123,178,144,.1);border:1px solid rgba(123,178,144,.3);color:var(--green); } .login-status.err { background:rgba(224,95,95,.08);border:1px solid rgba(224,95,95,.25);color:#e96a6a; } .login-fine { margin-top:16px;font-size:.7rem;color:var(--dim);line-height:1.5; } .login-price { font-size:1.05rem;font-weight:800;color:var(--green,#7BB290);margin:2px 0 16px;letter-spacing:-.01em; } .login-mail-ico { width:46px;height:46px;margin:4px auto 14px;border-radius:50%; display:flex;align-items:center;justify-content:center;font-size:1.3rem; background:rgba(123,178,144,.14);border:1px solid rgba(123,178,144,.35);color:var(--green,#7BB290); } /* Pro modal "Coming soon"-style tag centered */ .login-modal .fvc-pro-soon { display:inline-block; } /* ── Pro account recovery (recovery-code modal, account hub, lost-access) ───── */ .fvc-rec, .fvc-acct { padding:10px 6px 4px; text-align:center; } .fvc-rec-ic { width:48px;height:48px;margin:2px auto 12px;border-radius:50%; display:flex;align-items:center;justify-content:center;font-size:1.4rem; background:rgba(123,178,144,.14);border:1px solid rgba(123,178,144,.35); } .fvc-rec .login-mail-ic { width:46px;height:46px;margin:4px auto 14px;border-radius:50%; display:flex;align-items:center;justify-content:center;font-size:1.3rem; background:rgba(123,178,144,.14);border:1px solid rgba(123,178,144,.35);color:var(--green); } .fvc-rec-code { font-family:'Courier New',ui-monospace,monospace;font-size:1.18rem;font-weight:700; letter-spacing:.1em;color:var(--text);background:rgba(12,19,15,.72); border:1px dashed rgba(123,178,144,.5);border-radius:12px; padding:14px 10px;margin:6px 0 14px;user-select:all;word-break:break-all; } .fvc-rec-actions { display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:12px; } .fvc-rec-btn { flex:1 1 auto;min-width:140px;padding:11px 14px;border-radius:999px;cursor:pointer; background:rgba(255,255,255,.06);color:var(--text);border:1px solid rgba(123,178,144,.4); font-family:inherit;font-size:.84rem;font-weight:700;transition:background .15s,border-color .15s; } .fvc-rec-btn:hover { background:rgba(123,178,144,.16);border-color:var(--green); } .fvc-rec-btn.fvc-rec-danger { border-color:rgba(224,95,95,.45);color:#e96a6a; } .fvc-rec-btn.fvc-rec-danger:hover { background:rgba(224,95,95,.12);border-color:#e96a6a; } .fvc-rec-link { background:none;border:none;color:var(--muted);font:inherit;font-size:.8rem;cursor:pointer;text-decoration:underline;margin:2px auto 10px;display:inline-block; } .fvc-rec-link:hover { color:var(--green); } .fvc-rec-qrwrap { margin:6px auto 14px;display:flex;flex-direction:column;align-items:center;gap:8px; } .fvc-rec-qr { width:200px;height:200px;max-width:62vw;background:#fff;border-radius:12px;padding:10px;box-sizing:content-box; } .fvc-rec-qrcap { font-size:.74rem;color:var(--muted);line-height:1.5;max-width:300px;margin:0; } .fvc-rec-warn { font-size:.76rem;line-height:1.55;color:#e0a16a;text-align:left; background:rgba(224,161,106,.1);border:1px solid rgba(224,161,106,.28);border-radius:10px; padding:10px 12px;margin:6px 0 14px; } .fvc-rec input[type="email"], .fvc-rec input[type="text"] { width:100%;box-sizing:border-box;background:rgba(12,19,15,.72);text-align:center; border:1px solid rgba(123,178,144,.35);border-radius:10px; padding:12px 14px;color:var(--text);font-size:16px;font-family:inherit;outline:none;margin-bottom:12px; } .fvc-rec input:focus { border-color:var(--green);box-shadow:0 0 0 3px rgba(123,178,144,.18); } /* account hub */ .fvc-acct { text-align:left; } .fvc-acct .login-title { text-align:center;display:block; } .fvc-acct-row { display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--glass-b); } .fvc-acct-k { font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em; } .fvc-acct-v { font-size:.92rem;color:var(--text);font-weight:600;word-break:break-all; } .fvc-acct-plan { font-size:.72rem;font-weight:700;color:var(--green);background:var(--green-d);border:1px solid var(--green-b);border-radius:999px;padding:4px 10px;white-space:nowrap; } .fvc-acct .login-btn { margin-top:14px; } .fvc-acct-sep { height:1px;background:var(--glass-b);margin:18px 0 14px; } .fvc-acct-h { font-size:.95rem;font-weight:800;color:var(--text); } .fvc-rec-status.fvc-rec-active { color:var(--green); } .fvc-rec-status.fvc-rec-used { color:var(--muted); } .fvc-rec-status.fvc-rec-revoked { color:#e0a16a; } .fvc-rec-status.fvc-rec-none { color:#e96a6a; } /* ── Sign-out confirmation dialog ── */ .logout-confirm-ic { width:46px;height:46px;margin:4px auto 14px;border-radius:50%; display:flex;align-items:center;justify-content:center; background:rgba(123,178,144,.14);border:1px solid rgba(123,178,144,.35);color:var(--green,#7BB290); } .logout-confirm-ic svg { width:22px;height:22px; } .logout-confirm-actions { display:flex;gap:10px;margin-top:4px; } .logout-confirm-actions .login-btn { flex:1 1 0;width:auto;margin:0; } .logout-confirm-no { flex:1 1 0;box-sizing:border-box;padding:13px 16px;border-radius:999px;cursor:pointer; background:transparent;border:1px solid var(--glass-b,rgba(123,178,144,.3));color:var(--text); font-family:inherit;font-size:.92rem;font-weight:700;transition:background .15s,border-color .15s; } .logout-confirm-no:hover { background:rgba(255,255,255,.05);border-color:rgba(123,178,144,.5); } /* ── Fair-Value backtest popup (hero Evidence) ── */ .bt-modal { max-width:520px; } .bt-chart { margin:14px 0 6px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(10,16,13,.5);padding:8px 6px; } .bt-legend { display:flex;gap:18px;justify-content:center;flex-wrap:wrap;font-size:.74rem;color:var(--muted,#9aa39e); } .bt-legend i { display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:6px;vertical-align:-1px; } .bt-legend b { color:var(--text,#eef4f0);font-weight:800; } .bt-headline { margin-top:12px;font-size:.92rem;font-weight:800;color:var(--text,#eef4f0); } .bt-headline b { color:#7BB290; } .bt-result { margin:10px 0 0;font-size:.82rem;line-height:1.55;color:var(--muted,#9aa39e);text-align:left; } .bt-result b { color:var(--text,#eef4f0); } .bt-research { margin-top:14px;border-top:1px solid rgba(255,255,255,.08);padding-top:12px;text-align:left; } .bt-research-h { font-size:.6rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:rgba(123,178,144,.85);margin-bottom:8px; } .bt-facts { margin:0;padding-left:18px;display:flex;flex-direction:column;gap:7px; } .bt-facts li { font-size:.8rem;line-height:1.5;color:var(--muted,#9aa39e); } .bt-facts li b { color:var(--text,#eef4f0);font-weight:700; } .bt-take { margin-top:11px;font-size:.8rem;line-height:1.55;color:rgba(233,241,236,.78);background:rgba(123,178,144,.08);border:1px solid rgba(123,178,144,.22);border-radius:10px;padding:9px 11px; } /* ── Extended Evidence & Historical Tests (appended below the backtest summary) ── */ .ev-ext { margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.10);text-align:left; } .ev-ext-kick { display:block;font-size:.62rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#7BB290; } .ev-ext-intro { margin:7px 0 0;font-size:.78rem;line-height:1.55;color:rgba(233,241,236,.66); } .ev-ext-intro b { color:rgba(233,241,236,.9); } /* eBook download panel inside the Evidence popup (read online / PDF / EPUB) */ .ev-ebook { display:flex;align-items:flex-start;gap:12px;margin:14px 0 2px;padding:13px 14px;border-radius:13px; border:1px solid rgba(123,178,144,.4);background:linear-gradient(160deg,rgba(123,178,144,.16),rgba(123,178,144,.06)); } .ev-ebook-ic { flex:0 0 auto;width:38px;height:38px;margin-top:2px;display:flex;align-items:center;justify-content:center;border-radius:10px; background:rgba(123,178,144,.2);border:1px solid rgba(123,178,144,.4);color:#8FE3B0; } .ev-ebook-ic svg { width:20px;height:20px; } .ev-ebook-tx { flex:1;min-width:0;display:flex;flex-direction:column;gap:4px;line-height:1.35; } .ev-ebook-tx b { font-size:.86rem;color:var(--text,#eef4f0);font-weight:800; } .ev-ebook-tx > span { font-size:.7rem;color:rgba(233,241,236,.6); } .ev-ebook-fmts { display:flex;flex-wrap:wrap;gap:7px;margin-top:5px; } .ev-ebook-fmts a { font-size:.7rem;font-weight:800;text-decoration:none;color:#8FE3B0;white-space:nowrap; border:1px solid rgba(123,178,144,.4);background:rgba(123,178,144,.12);border-radius:999px;padding:4px 11px; } .ev-ebook-fmts a:hover { background:rgba(123,178,144,.24);border-color:rgba(123,178,144,.6); } /* Stat cards — always-visible key findings */ .ev-stats { display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:14px 0 4px; } .ev-stat { background:linear-gradient(160deg,rgba(123,178,144,.12),rgba(123,178,144,.04)); border:1px solid rgba(123,178,144,.24);border-radius:12px;padding:11px 12px; } .ev-stat b { display:block;font-size:1.3rem;font-weight:800;color:#8FE3B0;line-height:1.05;letter-spacing:-.01em; } .ev-stat b small { font-size:.62rem;font-weight:700;color:rgba(143,227,176,.7); } .ev-stat span { display:block;margin-top:4px;font-size:.68rem;line-height:1.4;color:rgba(233,241,236,.62); } .ev-stat span b { display:inline;font-size:inherit;color:rgba(233,241,236,.9); } /* Accordions (native
) */ .ev-acc { border:1px solid rgba(255,255,255,.10);border-radius:12px;background:rgba(10,16,13,.4);margin-top:10px;overflow:hidden; } .ev-acc > summary { list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between; gap:10px;padding:12px 14px;font-size:.84rem;font-weight:700;color:var(--text,#eef4f0);user-select:none; } .ev-acc > summary::-webkit-details-marker { display:none; } .ev-acc > summary:hover { background:rgba(123,178,144,.06); } .ev-acc[open] > summary { border-bottom:1px solid rgba(255,255,255,.08);background:rgba(123,178,144,.05); } .ev-acc .ev-chev { width:16px;height:16px;flex:0 0 auto;fill:none;stroke:#7BB290;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s; } .ev-acc[open] .ev-chev { transform:rotate(180deg); } .ev-acc-risk { border-color:rgba(224,150,90,.3); } .ev-acc-body { padding:12px 14px 15px; } .ev-acc-body p { margin:0 0 9px;font-size:.78rem;line-height:1.58;color:rgba(233,241,236,.74); } .ev-acc-body p:last-child { margin-bottom:0; } .ev-acc-body b { color:var(--text,#eef4f0);font-weight:700; } .ev-note { font-size:.7rem !important;font-style:italic;color:rgba(233,241,236,.66) !important; } .ev-tcap { font-size:.72rem !important;font-weight:700;color:rgba(123,178,144,.85) !important;margin-top:4px !important; } /* Figures / charts — responsive, never overflow */ .ev-fig { margin:12px 0;text-align:center; } .ev-fig img { display:block;width:100%;max-width:100%;height:auto;border-radius:10px; border:1px solid rgba(255,255,255,.1);background:#0c120f; } .ev-fig figcaption { margin-top:6px;font-size:.66rem;line-height:1.4;color:rgba(233,241,236,.70);font-style:italic; } .ev-grid2 { display:grid;grid-template-columns:1fr 1fr;gap:10px; } .ev-grid2 .ev-fig { margin:0; } /* Native SVG charts (replace the old raster charts) */ .ev-svg { display:block;width:100%;height:auto;border:1px solid rgba(255,255,255,.1);border-radius:10px; background:linear-gradient(160deg,rgba(18,26,21,.55),rgba(10,16,13,.65)); } .ev-legend2 { display:flex;gap:16px;margin:2px 0 8px;font-size:.66rem;color:rgba(233,241,236,.6); } .ev-legend2 span { display:inline-flex;align-items:center;gap:6px; } .ev-legend2 i { width:16px;height:0;display:inline-block;vertical-align:middle; } .ev-li-solid { border-top:2.4px solid #7BB290; } .ev-li-dash { border-top:1.8px dashed rgba(143,227,176,.7); } /* Tables — premium dark, horizontally scrollable on small screens */ .ev-table-wrap { margin:8px 0 4px;overflow-x:auto;-webkit-overflow-scrolling:touch; border:1px solid rgba(255,255,255,.1);border-radius:10px; } .ev-table-wrap:focus-visible { outline:2px solid rgba(123,178,144,.5);outline-offset:1px; } .ev-table { width:100%;border-collapse:collapse;font-size:.76rem;min-width:300px; } .ev-table th, .ev-table td { padding:8px 12px;text-align:left;border-bottom:1px solid rgba(255,255,255,.07);white-space:nowrap; } .ev-table thead th { position:sticky;top:0;background:#13201a;color:rgba(123,178,144,.9); font-size:.62rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;z-index:1; } .ev-table tbody tr:last-child td { border-bottom:none; } .ev-table tbody tr:nth-child(even) td { background:rgba(255,255,255,.018); } .ev-table td b { color:#8FE3B0; } .ev-table td:first-child { color:rgba(233,241,236,.78); } /* References — academic hanging-indent list */ .ev-refs-h { margin:12px 0 7px;font-size:.66rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:rgba(123,178,144,.85); } /* APA-style hanging-indent bibliography (author–year in-text → alphabetical list) */ .ev-refs { margin:0;padding:0;list-style:none; } .ev-refs li { padding:0 0 8px 1.6em;text-indent:-1.6em;font-size:.7rem;line-height:1.5;color:rgba(233,241,236,.62); } .ev-refs li i { color:rgba(233,241,236,.78);font-style:italic; } /* Limits & risks */ .ev-risk { margin:0;padding-left:18px;display:flex;flex-direction:column;gap:7px; } .ev-risk li { font-size:.76rem;line-height:1.5;color:rgba(233,241,236,.72); } .ev-risk li b { color:var(--text,#eef4f0); } /* Back to top */ .ev-top { display:inline-block;margin:14px 0 4px;font-size:.72rem;font-weight:700;color:#7BB290;text-decoration:none; } .ev-top:hover { text-decoration:underline; } @media (max-width:560px) { .ev-stats { grid-template-columns:1fr; } .ev-grid2 { grid-template-columns:1fr; } .ev-stat b { font-size:1.2rem; } } /* ── Toast ── */ .fvc-toast { position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px); background:rgba(12,19,15,.96);border:1px solid rgba(123,178,144,.4);color:var(--text,#eef4f0); padding:11px 18px;border-radius:999px;font-size:.82rem;font-weight:600; box-shadow:0 10px 32px rgba(0,0,0,.5);z-index:9999;opacity:0;pointer-events:none; transition:opacity .2s,transform .2s;max-width:90vw;text-align:center; } .fvc-toast.show { opacity:1;transform:translate(-50%,0); } /* On phones the sticky watchlist bar sits at the bottom — lift the toast above it so the "signed in" badge never covers the bar. */ @media (max-width:768px) { .fvc-toast { bottom: calc(94px + env(safe-area-inset-bottom, 0px)); } } /* ── Pro lock affordance (for any [data-pro-lock] element) ── */ [data-pro-lock] { position:relative; } [data-pro-lock]:not(.pro-unlocked) { opacity:.55;filter:grayscale(.3); } .pro-lock-badge { display:inline-flex;align-items:center;gap:5px;font-size:.62rem;font-weight:800; letter-spacing:.04em;color:var(--green);background:rgba(123,178,144,.14); border:1px solid rgba(123,178,144,.34);border-radius:999px;padding:3px 9px; } @media (max-width:480px) { .sm-secondary-row { gap:5px; } .fvc-pro-feats { grid-template-columns:1fr; } } @media (max-width:560px) { .hdr-pro-btn .hdr-pro-full { display:none; } /* "Pro $9.90" on phones */ } /* ── Async pagination (below the stock list) ── */ .fvc-pagination { display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin:26px 0 8px; } .fvc-pagination:empty { display:none; } .fvc-page-btn { min-width:38px;height:38px;padding:0 12px;border-radius:10px;cursor:pointer;font-family:inherit; font-size:.82rem;font-weight:700;color:var(--text,#e8f0eb); background:rgba(255,255,255,.05);border:1px solid var(--glass-b,rgba(255,255,255,.12)); transition:background .15s,border-color .15s,transform .12s; } .fvc-page-btn:hover:not(.active):not(.dis) { background:rgba(123,178,144,.14);border-color:rgba(123,178,144,.4);transform:translateY(-1px); } .fvc-page-btn.active { background:var(--green);border-color:var(--green);color:#0e1512;cursor:default; } .fvc-page-btn.dis { opacity:.4;cursor:default; } .fvc-page-gap { color:var(--dim);padding:0 4px; } @media (max-width:560px){ .fvc-page-btn { min-width:34px;height:34px;padding:0 9px;font-size:.78rem; } } /* ── Methodology prose + AI summary ── */ .mt-ai-summary { display:flex;flex-direction:column;gap:6px; background:rgba(123,178,144,.07);border:1px solid rgba(123,178,144,.26); border-left:3px solid var(--green);border-radius:12px; padding:13px 16px;margin-bottom:18px; } .mt-ai-tag { font-size:.6rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--green); } .mt-ai-summary p { margin:0;font-size:.82rem;line-height:1.55;color:var(--text); } .mt-prose { margin:0 0 6px; } .mt-prose p { margin:0 0 10px;font-size:.83rem;line-height:1.62;color:var(--muted); } .mt-prose p strong { color:var(--text);font-weight:700; } .mt-h { font-size:.74rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase; color:var(--text);margin:20px 0 9px; } /* ── FAQ accordion ── */ .fvc-faq-section { } .fvc-faq-title { font-size:1.05rem;font-weight:800;color:var(--text);margin:0 0 14px;letter-spacing:-.01em; } .fvc-faq { display:flex;flex-direction:column;gap:8px; } .faq-item { background:rgba(255,255,255,.025);border:1px solid var(--glass-b,rgba(255,255,255,.1)); border-radius:12px;overflow:hidden;transition:border-color .15s,background .15s; } .faq-item[open] { border-color:rgba(123,178,144,.3);background:rgba(123,178,144,.04); } .faq-item > summary { list-style:none;cursor:pointer;padding:14px 16px; font-size:.86rem;font-weight:700;color:var(--text); display:flex;align-items:center;justify-content:space-between;gap:12px; } .faq-item > summary::-webkit-details-marker { display:none; } .faq-item > summary::after { content:'+';flex:0 0 auto;color:var(--green);font-size:1.1rem;font-weight:800;line-height:1; transition:transform .2s; } .faq-item[open] > summary::after { content:'−'; } .faq-item > summary:hover { color:var(--green); } .faq-a { padding:0 16px 15px; } .faq-a p { margin:0;font-size:.82rem;line-height:1.62;color:var(--muted); } @media (max-width:560px) { .mt-prose p, .mt-ai-summary p, .faq-a p { font-size:.8rem; } .faq-item > summary { font-size:.82rem;padding:13px 14px; } } /* ── Watchlist ── */ .hdr-wl-btn { position:relative; } /* Pulse the header Watchlist button when a stock is added → "it landed up there" */ @keyframes fvcWlPulse { 0% { transform:scale(1); box-shadow:0 0 0 0 rgba(123,178,144,0); } 28% { transform:scale(1.14); box-shadow:0 0 0 4px rgba(123,178,144,.40), 0 0 16px 3px rgba(123,178,144,.55); } 100% { transform:scale(1); box-shadow:0 0 0 0 rgba(123,178,144,0); } } .hdr-wl-btn.fvc-wl-pulse { animation:fvcWlPulse .9s ease-out; border-color:var(--green) !important; color:var(--green); } .hdr-wl-btn.fvc-wl-pulse .wl-count-badge { animation:fvcWlPulse .9s ease-out; } @media (prefers-reduced-motion: reduce) { .hdr-wl-btn.fvc-wl-pulse { animation:none; box-shadow:0 0 0 3px rgba(123,178,144,.45); transition:box-shadow .2s; } .hdr-wl-btn.fvc-wl-pulse .wl-count-badge { animation:none; } } /* ── Mobile sticky watchlist bar ───────────────────────────────────────────── */ .fvc-wl-bar { display:none; } /* desktop keeps the top-right star; bar is phones-only */ /* While the Filters drawer OR the Search Wizard is open the sticky bar must not cover their footer button (operator: wizard footer button was covered). */ body.fvc-filters-open .fvc-wl-bar, body.fvc-valyra-open .fvc-wl-bar { display:none !important; } @media (max-width:768px) { /* The header star stays visible on mobile too (operator: keep both) — top star and the bottom sticky bar both open the watchlist. */ /* Reserve the bar's FULL height incl. the iPhone home-indicator safe area — a flat 70px left ~24px of content (e.g. the Search Wizard button) clipped under the bar on notched phones, because the bar itself adds env(safe-area-inset-bottom). */ body { padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px)); } .fvc-wl-bar { display:flex; align-items:center; gap:11px; position:fixed; left:0; right:0; bottom:0; z-index:120; width:100%; padding:10px 16px calc(10px + env(safe-area-inset-bottom, 0px)); border:0; border-top:1px solid rgba(123,178,144,.30); background:rgba(12,18,14,.96); backdrop-filter:blur(10px); box-shadow:0 -6px 24px rgba(0,0,0,.45); font-family:inherit; text-align:left; cursor:pointer; transition:box-shadow .25s, background .25s; } .fvc-wlb-star { position:relative; flex:0 0 auto; display:inline-flex; margin-right:6px; color:rgba(233,241,236,.55); } .fvc-wl-bar.has-items .fvc-wlb-star { color:var(--green,#7BB290); } .fvc-wlb-count { position:absolute; top:-7px; right:-9px; min-width:17px; height:17px; padding:0 4px; border-radius:999px; background:var(--green,#7BB290); color:#0c120e; font-size:.62rem; font-weight:800; line-height:17px; text-align:center; } .fvc-wlb-main { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:1px; } .fvc-wlb-title { font-size:.86rem; font-weight:800; color:var(--text,#eef4f0); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .fvc-wlb-rec { font-size:.72rem; color:rgba(233,241,236,.62); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .fvc-wlb-score { flex:0 0 auto; min-width:44px; text-align:center; padding:5px 9px; border-radius:10px; font-size:.95rem; font-weight:800; font-variant-numeric:tabular-nums; background:rgba(123,178,144,.16); color:var(--green,#7BB290); } .fvc-wlb-score.grade-A, .fvc-wlb-score.grade-B { background:rgba(123,178,144,.16); color:var(--green,#7BB290); } .fvc-wlb-score.grade-C { background:rgba(230,180,90,.16); color:#e6b45a; } .fvc-wlb-score.grade-D { background:rgba(224,138,138,.16); color:#e08a8a; } .fvc-wl-bar.fvc-wlb-glow { animation:fvcWlBarGlow 1s ease-out; } .fvc-wl-bar.fvc-wlb-glow .fvc-wlb-star { animation:fvcWlPulse 1s ease-out; } @keyframes fvcWlBarGlow { 0% { box-shadow:0 -6px 24px rgba(0,0,0,.45); background:rgba(12,18,14,.96); } 25% { box-shadow:0 -2px 32px 5px rgba(123,178,144,.6); background:rgba(24,42,31,.98); } 100% { box-shadow:0 -6px 24px rgba(0,0,0,.45); background:rgba(12,18,14,.96); } } } @media (max-width:768px) and (prefers-reduced-motion: reduce) { .fvc-wl-bar.fvc-wlb-glow { animation:none; box-shadow:0 -2px 0 2px rgba(123,178,144,.5); } } .wl-count-badge { display:inline-flex;align-items:center;justify-content:center; min-width:16px;height:16px;border-radius:var(--r-pill); background:var(--green);color:#0a1a10; font-size:.58rem;font-weight:700;padding:0 4px; position:absolute;top:-5px;right:-6px; } /* Star button on cards */ .wl-btn { padding:0 12px;font-size:.77rem;min-width:78px;white-space:nowrap;font-weight:600; color:var(--text);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22); border-radius:var(--r-sm);cursor:pointer;font-family:inherit; transition:all .17s; } .wl-btn:hover { color:var(--text);background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.34);transform:translateY(-1px); } .wl-btn.wl-active { color:#0a1a10;background:var(--green);font-weight:700; border:1px solid var(--green); } .wl-btn.wl-active:hover { background:var(--green2); } /* Empty state */ .wl-empty-state { text-align:center;padding:60px 24px; } .wl-empty-icon { font-size:2.8rem;margin-bottom:14px;opacity:.35; } .wl-empty-title { font-size:1.05rem;font-weight:600;margin-bottom:8px; } .wl-empty-sub { font-size:.8rem;color:var(--dim);line-height:1.75; } /* Signal summary row */ .wl-signal-summary { display:flex;align-items:center;gap:8px;flex-wrap:wrap; padding:10px 0 14px;border-bottom:1px solid rgba(255,255,255,.06); margin-bottom:12px; } .wl-sig-pill { display:inline-flex;align-items:center;gap:5px; padding:4px 11px;border-radius:var(--r-pill); font-size:.75rem;font-weight:500;border:1px solid; } .wl-sig-hold { background:rgba(123,178,144,.12);border-color:rgba(123,178,144,.28);color:var(--green); } .wl-sig-sell { background:rgba(224,95,95,.10);border-color:rgba(224,95,95,.25);color:var(--red); } .wl-sig-review { background:rgba(240,160,84,.10);border-color:rgba(240,160,84,.25);color:var(--amber); } .wl-sig-rule-hint { font-size:.67rem;color:var(--dim);margin-left:4px; } /* Watchlist stock rows */ .wl-item { background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.07); border-radius:var(--r-sm);padding:13px 14px 10px;margin-bottom:10px; transition:border-color .18s; } .wl-item:hover { border-color:rgba(255,255,255,.13); } .wl-item.wl-item-pending { opacity:.82; } .wl-item.wl-item-pending .wl-item-top { align-items:center; } .wl-item.wl-item-hold { background:rgba(123,178,144,.04);border-color:rgba(123,178,144,.14); } .wl-item.wl-item-hold:hover { border-color:rgba(123,178,144,.28); } .wl-item.wl-item-sell { background:rgba(224,95,95,.04);border-color:rgba(224,95,95,.14); } .wl-item.wl-item-sell:hover { border-color:rgba(224,95,95,.28); } .wl-item-top { display:flex;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap; } .wl-item-identity { display:flex;align-items:center;gap:6px;flex:1;min-width:0;flex-wrap:wrap; } .wl-item-emoji { font-size:1.1rem;flex-shrink:0;line-height:1; } .wl-item-ticker { font-size:.9rem;font-weight:700;color:var(--green);flex-shrink:0; } .wl-item-exch { font-size:.63rem;color:var(--dim);flex-shrink:0; } .wl-item-co { font-size:.74rem;color:var(--muted); white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px; } .wl-item-signal { display:inline-flex;align-items:center;gap:5px; padding:6px 15px;border-radius:var(--r-pill); font-size:.92rem;font-weight:800;letter-spacing:.02em;flex-shrink:0; border:1px solid currentColor; } .wl-item-signal strong { font-weight:800; } .wl-sig-rule-badge { font-size:.6rem;opacity:.65; } .wl-remove-btn { background:none;border:none;color:var(--dim);cursor:pointer; font-size:.78rem;padding:2px 6px;border-radius:4px; flex-shrink:0;transition:color .14s; } .wl-remove-btn:hover { color:var(--red); } .wl-item-reason { font-size:.72rem;color:var(--dim);margin-bottom:9px;padding-left:2px; line-height:1.55; } .wl-item-metrics { display:flex;flex-wrap:wrap;gap:10px 20px;margin-bottom:7px; align-items:flex-start; } .wl-met { position:relative; } .wl-met-lbl { font-size:.57rem;color:var(--dim);text-transform:uppercase;letter-spacing:.06em;margin-bottom:2px; } .wl-met-val { font-size:.82rem;font-weight:600;font-variant-numeric:tabular-nums; } .wl-met-ma .wl-met-val { font-size:.72rem; } .wl-item-footer { display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.62rem;color:rgba(232,240,235,.2);margin-top:8px; } .wl-foot-txt { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; } .wl-foot-acts { flex:0 0 auto;display:flex;gap:6px; } .wl-act-btn { display:inline-flex;align-items:center;gap:5px;font-family:inherit;cursor:pointer; font-size:.72rem;font-weight:700;padding:6px 12px;border-radius:999px;touch-action:manipulation; border:1px solid rgba(123,178,144,.34);background:rgba(123,178,144,.10);color:var(--green,#7BB290); transition:background .15s,border-color .15s; } .wl-act-btn:hover { background:rgba(123,178,144,.2);border-color:rgba(123,178,144,.5); } .wl-act-share { border-color:rgba(100,160,240,.34);background:rgba(100,160,240,.10);color:#7fb0f0; } .wl-act-share:hover { background:rgba(100,160,240,.2);border-color:rgba(100,160,240,.5); } .wl-act-remove { border-color:rgba(224,138,138,.34);background:rgba(224,138,138,.10);color:#e08a8a; } .wl-act-remove:hover { background:rgba(224,138,138,.2);border-color:rgba(224,138,138,.55); } /* Diversification panel */ .wl-div-panel { background:rgba(123,178,144,.025);border:1px solid rgba(123,178,144,.1); border-radius:var(--r);padding:16px 18px;margin-top:16px; } .wl-div-title { font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em; color:var(--green);margin-bottom:12px; } .wl-div-score-row { display:flex;align-items:center;gap:16px;margin-bottom:14px; } .wl-div-grade { font-size:2.6rem;font-weight:800;line-height:1;min-width:36px; } .wl-div-final { font-size:1.45rem;font-weight:700;color:var(--text); } .wl-div-max { font-size:.85rem;color:var(--dim); } .wl-div-sub { font-size:.67rem;color:var(--dim);margin-top:2px; } .div-brk-row { display:flex;align-items:center;gap:10px;margin-bottom:7px; } .div-brk-lbl { font-size:.69rem;color:var(--dim);width:130px;flex-shrink:0; } .div-brk-bar { flex:1;height:5px;border-radius:3px; background:rgba(255,255,255,.07);overflow:hidden; } .div-brk-fill { height:100%;background:var(--green);border-radius:3px; transition:width .5s ease; } .div-brk-pts { font-size:.67rem;color:var(--muted);width:26px;text-align:right; flex-shrink:0;font-variant-numeric:tabular-nums; } .wl-div-corr { font-size:.72rem;color:var(--dim);margin-top:12px; padding-top:10px;border-top:1px solid rgba(255,255,255,.06); display:flex;flex-wrap:wrap;gap:3px;align-items:center; } .wl-div-corr-note { color:rgba(232,240,235,.2);font-size:.62rem; } /* Diversification — concrete "Next step" action tip */ .wl-div-tip { margin:12px 0 2px;padding:10px 12px;border-radius:10px; font-size:.8rem;line-height:1.45;color:#cfe6d6; background:rgba(123,178,144,.08);border:1px solid rgba(123,178,144,.22); } .wl-div-tip b { color:#9ed3b0;font-weight:800; } .wl-div-formula { font-size:.6rem;color:rgba(232,240,235,.14);margin-top:8px; font-family:monospace;letter-spacing:.02em; } /* Diversification — "How it works" accordion */ .wl-div-how { margin-top:12px;border-top:1px solid rgba(255,255,255,.06);padding-top:10px; } .wl-div-how > summary { font-size:.67rem;color:var(--dim);cursor:pointer;list-style:none; display:flex;align-items:center;gap:5px;user-select:none; } .wl-div-how > summary::before { content:'▸';font-size:.6rem;transition:transform .18s; } .wl-div-how[open] > summary::before { transform:rotate(90deg); } .wl-div-how-body { margin-top:8px;font-size:.67rem;color:rgba(232,240,235,.3);line-height:1.65; } .wl-div-how-body p { margin:0 0 5px; } /* Diversification — early-stage message */ .wl-div-early { font-size:.72rem;color:var(--dim);margin-top:12px;padding:9px 12px; background:rgba(255,255,255,.025);border-radius:var(--r-sm); border:1px solid rgba(255,255,255,.06); } /* Data unavailable section */ .wl-unavail-section { margin-top:16px; } .wl-unavail-section > summary.wl-unavail-title { font-size:.68rem;color:var(--dim);cursor:pointer;list-style:none; display:flex;align-items:center;gap:6px;padding:7px 0;user-select:none; border-top:1px solid rgba(255,255,255,.06); } .wl-unavail-section > summary.wl-unavail-title::before { content:'▸';font-size:.6rem;transition:transform .18s; } .wl-unavail-section[open] > summary.wl-unavail-title::before { transform:rotate(90deg); } .wl-unavail-card { display:flex;align-items:center;justify-content:space-between;gap:10px; padding:8px 10px;margin-bottom:6px; background:rgba(255,255,255,.018);border:1px solid rgba(255,255,255,.06); border-radius:var(--r-sm); } .wl-unavail-left { display:flex;flex-direction:column;gap:2px; } .wl-unavail-ticker { font-size:.82rem;font-weight:700;color:var(--muted); } .wl-unavail-co { font-size:.67rem;color:var(--dim); } .wl-unavail-missing { font-size:.63rem;color:rgba(224,95,95,.6); } /* Replace button */ .wl-replace-btn { background:none;border:none;color:var(--dim);cursor:pointer; font-size:.72rem;padding:2px 5px;border-radius:4px; flex-shrink:0;transition:color .14s; } .wl-replace-btn:hover { color:var(--green); } .wl-replace-reason { display:block;font-size:.67rem;color:var(--dim);margin:3px 0 5px; } .wl-replace-actions { display:flex;gap:6px;margin-top:4px; } /* Smart action buttons */ .wl-action-sm { font-size:.71rem;padding:3px 10px;border-radius:var(--r-sm);cursor:pointer; font-family:inherit;border:1px solid rgba(123,178,144,.3); background:rgba(123,178,144,.1);color:var(--green);transition:all .15s; } .wl-action-sm:hover { background:rgba(123,178,144,.2); } .wl-action-sm.wl-action-ghost { background:transparent;border-color:rgba(255,255,255,.12);color:var(--dim); } .wl-action-sm.wl-action-ghost:hover { color:var(--text);border-color:rgba(255,255,255,.25); } /* Builder bar */ .wl-builder-bar { display:flex;gap:8px;flex-wrap:wrap;justify-content:center;align-items:center; padding:16px 0 6px;border-top:1px solid rgba(255,255,255,.06); margin-top:14px; } /* Two-button footer (Save Watchlist · Email Alert) — always side by side, equal width. */ .wl-builder-bar.wl-builder-bar-2 { flex-direction:row;flex-wrap:nowrap; } .wl-builder-bar-2 .wl-action-btn { flex:1 1 0;min-width:0;justify-content:center;text-align:center; } /* ── Portfolio diversification — Pro lock (blurred preview + overlay) ── */ .wl-div-lockwrap { position:relative;margin-top:16px;border-radius:14px;overflow:hidden;border:1px solid var(--glass-b,rgba(255,255,255,.1)); } .wl-div-blur { filter:blur(5px);opacity:.5;pointer-events:none;padding:18px;background:rgba(255,255,255,.02); } .wl-div-blur .wl-div-title { font-size:.95rem;font-weight:700;color:var(--text);margin-bottom:14px; } .wl-div-bars { display:flex;flex-direction:column;gap:11px; } .wl-div-bar { display:flex;align-items:center;gap:12px;font-size:.78rem;color:var(--muted); } .wl-div-bar span { width:90px;flex:0 0 auto; } .wl-div-bar i { height:8px;border-radius:6px;background:var(--green);display:block; } .wl-div-lock { position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center; text-align:center;padding:20px;background:rgba(10,15,11,.55);backdrop-filter:blur(1px); } .wl-div-lock-title { font-size:1rem;font-weight:800;color:var(--text); } .wl-div-lock-sub { font-size:.82rem;color:var(--muted);margin-top:6px;max-width:300px; } .wl-action-btn { font-size:.76rem;padding:6px 14px;border-radius:var(--r-sm);cursor:pointer; font-family:inherit;border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.04);color:var(--muted);transition:all .16s; white-space:nowrap; } .wl-action-btn:hover { background:rgba(255,255,255,.08);color:var(--text);border-color:rgba(255,255,255,.22); } .wl-action-btn:disabled { opacity:.45;cursor:default; } .wl-action-btn.wl-action-primary { background:rgba(123,178,144,.12);border-color:rgba(123,178,144,.3);color:var(--green); } .wl-action-btn.wl-action-primary:hover { background:rgba(123,178,144,.22); } /* Autofill prompt (post-delete) */ .wl-autofill-prompt { display:flex;align-items:center;gap:10px;flex-wrap:wrap; font-size:.76rem;color:var(--dim); padding:8px 12px;margin:8px 0; background:rgba(123,178,144,.04);border:1px solid rgba(123,178,144,.1); border-radius:var(--r-sm); } /* Save & Alerts CTA */ .wl-save-cta { padding:14px 0 0;margin-top:4px; border-top:1px solid rgba(255,255,255,.06); } .wl-save-btn { width:100%;padding:10px 18px;font-size:.85rem;font-weight:600; font-family:inherit;cursor:pointer;border-radius:var(--r-sm); border:1px solid rgba(123,178,144,.35); background:rgba(123,178,144,.12);color:var(--green); transition:all .17s;white-space:nowrap; } .wl-save-btn:hover { background:rgba(123,178,144,.22);border-color:rgba(123,178,144,.55); } .wl-save-status { margin-top:6px;font-size:.7rem;text-align:center; } .wl-save-active-txt { color:var(--green); } .wl-save-local-txt { color:var(--dim); } /* Back button in modal */ .wl-back-btn { background:none;border:none;color:var(--dim);cursor:pointer; font-size:.76rem;padding:0;font-family:inherit;transition:color .14s; } .wl-back-btn:hover { color:var(--text); } /* Save & Alerts panel */ .wl-save-panel { padding:4px 0 8px; } .wl-save-section { margin-bottom:18px; } .wl-save-section-title { font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em; color:var(--dim);margin-bottom:8px; } .wl-save-tickers { display:flex;flex-wrap:wrap;gap:5px; } .wl-save-ticker { font-size:.75rem;font-weight:600;padding:3px 8px; background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1); border-radius:var(--r-sm);color:var(--muted); } .wl-save-features { list-style:none;padding:0;margin:0;font-size:.8rem; color:var(--muted);line-height:1.85; } .wl-save-email-lbl { font-size:.72rem;color:var(--dim);display:block;margin-bottom:6px; } .wl-save-email-input { width:100%;box-sizing:border-box; background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.14); border-radius:var(--r-sm);padding:9px 12px;font-size:.9rem; color:var(--text);font-family:inherit;outline:none; transition:border-color .16s; } .wl-save-email-input:focus { border-color:rgba(123,178,144,.4); } .wl-save-price-row { display:flex;align-items:baseline;gap:10px; } .wl-save-price { font-size:1.5rem;font-weight:800;color:var(--green);line-height:1; } .wl-save-price-note { font-size:.72rem;color:var(--dim); } .wl-save-unavail { font-size:.8rem;color:var(--dim);padding:12px 14px; background:rgba(255,255,255,.025);border-radius:var(--r-sm); border:1px solid rgba(255,255,255,.06); } .wl-save-disclaimer { font-size:.63rem;color:rgba(232,240,235,.2);margin-top:16px; } /* Payment success */ .wl-save-success { padding:32px 16px;text-align:center; } .wl-success-icon { width:52px;height:52px;border-radius:50%; background:rgba(123,178,144,.15);border:2px solid rgba(123,178,144,.4); display:flex;align-items:center;justify-content:center; font-size:1.4rem;color:var(--green);margin:0 auto 16px; } .wl-success-title { font-size:1.1rem;font-weight:700;color:var(--green);margin:0 0 8px; } .wl-success-sub { font-size:.82rem;color:var(--muted);margin-bottom:6px; } .wl-success-note { font-size:.72rem;color:var(--dim);margin-top:10px; } @media (max-width:480px) { .wl-item-co { max-width:120px; } .div-brk-lbl { width:100px; } .wl-builder-bar { flex-direction:column; } .wl-action-btn { text-align:center; } } /* ═══════════════════════════════════════════════════════════════════ INTELLIGENCE PANEL (ip-) — Live status bar rendered by app.js ═══════════════════════════════════════════════════════════════════ */ .ip-bar { display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px; background:rgba(123,178,144,.03); border:1px solid rgba(123,178,144,.11); border-radius:var(--r); padding:11px 20px; font-size:.71rem;color:var(--muted); backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px); } .ip-live { display:flex;align-items:center;gap:7px; font-size:.74rem;font-weight:700;color:var(--text);white-space:nowrap; } .ip-dot { display:inline-block;width:6px;height:6px;border-radius:50%; background:var(--green);box-shadow:0 0 7px rgba(123,178,144,.8); animation:blink 2.4s ease-in-out infinite;flex-shrink:0; } .ip-vsep { display:inline-block;width:1px;height:13px; background:rgba(255,255,255,.1);flex-shrink:0;align-self:center; } .ip-sources { color:var(--muted);white-space:nowrap; } .ip-cov { display:flex;align-items:center;gap:6px;white-space:nowrap; } .ip-num { font-weight:700;color:var(--green); } .ip-prog { display:inline-block;width:36px;height:3px; background:rgba(255,255,255,.07);border-radius:2px;overflow:hidden; vertical-align:middle; } .ip-prog span { display:block;height:100%; background:linear-gradient(90deg,var(--green) 0%,var(--green2) 100%); border-radius:2px; } .ip-dim { color:var(--dim); } .ip-cron-on { color:var(--green);font-weight:600; } .ip-cron-off { color:var(--dim); } .ip-right { margin-left:auto; } .ip-scope { font-size:.61rem;font-weight:600;letter-spacing:.06em; background:rgba(100,160,240,.08);color:#90b8f0; border:1px solid rgba(100,160,240,.18); border-radius:var(--r-pill);padding:2px 10px;white-space:nowrap; } @media (max-width:640px) { .ip-vsep,.ip-right { display:none; } .ip-sources { display:none; } } /* ═══════════════════════════════════════════════════════════════════ METHODOLOGY STEPPER (meth-) ═══════════════════════════════════════════════════════════════════ */ .meth-track { position:relative; display:flex;align-items:flex-start; margin:20px 0 24px;overflow-x:auto;padding-bottom:4px; } .meth-track::before { content:'';position:absolute; top:13px;left:10%;right:10%;height:1px; background:rgba(123,178,144,.2); pointer-events:none; } .meth-step { flex:1;min-width:110px;max-width:200px; display:flex;flex-direction:column;align-items:center; padding:0 10px;text-align:center;cursor:default; } .meth-node { width:26px;height:26px;border-radius:50%; background:var(--bg); border:1px solid rgba(123,178,144,.3); display:flex;align-items:center;justify-content:center; font-size:.62rem;font-weight:700;color:var(--green); position:relative;z-index:1; margin-bottom:12px; transition:background .2s,border-color .2s,box-shadow .2s; } .meth-step:hover .meth-node { background:rgba(123,178,144,.1); border-color:rgba(123,178,144,.6); box-shadow:0 0 14px rgba(123,178,144,.3); } .meth-num { font-size:.56rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--green);margin-bottom:3px; } .meth-title{ font-size:.77rem;font-weight:600;color:var(--text);margin-bottom:5px;line-height:1.2; } .meth-desc { font-size:.67rem;color:var(--dim);line-height:1.5; } @media (max-width:680px) { .meth-track { flex-direction:column;gap:14px; } .meth-track::before { display:none; } .meth-step { flex-direction:row;align-items:flex-start;text-align:left;max-width:none; } .meth-node { flex-shrink:0;margin-bottom:0;margin-right:14px; } } /* ═══════════════════════════════════════════════════════════════════ CHART KPI STRIP (rh-kpi-) ═══════════════════════════════════════════════════════════════════ */ .rh-kpi-strip { display:flex;align-items:stretch; border-top:1px solid var(--glass-b); flex-wrap:wrap; } .rh-kpi { flex:1;min-width:100px; text-align:center;padding:12px 8px; } .rh-kpi + .rh-kpi { border-left:1px solid var(--glass-b); } .rh-kpi-val { font-size:1.05rem;font-weight:700;line-height:1;margin-bottom:4px; background:linear-gradient(135deg,var(--text) 0%,var(--green) 100%); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; } .rh-kpi-val.dim { background:none;-webkit-text-fill-color:var(--muted);color:var(--muted);font-size:.92rem; } .rh-kpi-lbl { font-size:.59rem;color:var(--dim);letter-spacing:.09em;text-transform:uppercase; } @media (max-width:480px) { .rh-kpi { flex:0 0 50%; } .rh-kpi:nth-child(2n+1) { border-left:none; } .rh-kpi:nth-child(n+3) { border-top:1px solid var(--glass-b); } } /* ── Data Pipeline Center ─────────────────────────────────────────────────── */ .dpc-section { } .dpc-loading { display:flex;align-items:center;gap:10px;padding:20px 0; color:var(--dim);font-size:.8rem; } .dpc-loading-dot { width:8px;height:8px;border-radius:50%;background:var(--green); animation:dpcPulse 1.4s ease-in-out infinite; } @keyframes dpcPulse { 0%,100%{opacity:.3;transform:scale(.8)} 50%{opacity:1;transform:scale(1)} } .dpc-error { padding:16px;color:var(--dim);font-size:.8rem;text-align:center; } /* Wrapper */ .dpc-wrap { padding:20px 0 28px; } /* Header */ .dpc-header { display:flex;align-items:flex-start;justify-content:space-between; padding-bottom:16px;gap:12px;flex-wrap:wrap; } .dpc-title { font-size:1rem;font-weight:700;color:var(--text);letter-spacing:.01em; } .dpc-sub { font-size:.72rem;color:var(--dim);margin-top:3px; } .dpc-header-right { display:flex;align-items:center;gap:10px;flex-shrink:0; } .dpc-updated { font-size:.62rem;color:var(--dim); } /* KPI row */ .dpc-kpis { display:grid; grid-template-columns:repeat(6,1fr); gap:10px;margin-bottom:14px; } @media (max-width:900px) { .dpc-kpis { grid-template-columns:repeat(3,1fr); } } @media (max-width:560px) { .dpc-kpis { grid-template-columns:repeat(2,1fr); } } .dpc-kpi { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:10px;padding:12px 14px; transition:border-color .2s; } .dpc-kpi-live { border-color:rgba(123,178,144,.3); background:rgba(123,178,144,.06); } .dpc-kpi-val { font-size:1.4rem;font-weight:700;color:var(--text); display:flex;align-items:center;gap:6px;line-height:1; } .dpc-kpi-lbl { font-size:.62rem;color:var(--dim);margin-top:5px; text-transform:uppercase;letter-spacing:.05em; } .dpc-live-dot { display:inline-block;width:7px;height:7px;border-radius:50%; background:var(--green); animation:dpcPulse 1.2s ease-in-out infinite; flex-shrink:0; } /* Progress bar */ .dpc-progress-section { background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.07); border-radius:10px;padding:12px 16px;margin-bottom:14px; } .dpc-progress-row { display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap; } .dpc-progress-label { font-size:.65rem;font-weight:700;text-transform:uppercase; letter-spacing:.07em;color:var(--dim);flex:1; } .dpc-progress-nums { font-size:.72rem;font-weight:600;color:var(--text); } .dpc-progress-pct { font-size:.72rem;font-weight:700;color:var(--green); } .dpc-progress-track { height:6px;border-radius:3px;background:rgba(255,255,255,.08); overflow:hidden;margin-bottom:7px; } .dpc-progress-fill { height:100%;border-radius:3px; background:linear-gradient(90deg,#4a9e6a,var(--green)); transition:width .6s ease; } .dpc-progress-meta { font-size:.62rem;color:var(--dim); } /* Pipeline lanes */ .dpc-lanes { display:grid; grid-template-columns:repeat(5,1fr); gap:10px;margin-bottom:14px; } @media (max-width:1100px) { .dpc-lanes { grid-template-columns:repeat(3,1fr); } } @media (max-width:700px) { .dpc-lanes { grid-template-columns:repeat(2,1fr); } } @media (max-width:420px) { .dpc-lanes { grid-template-columns:1fr; } } .dpc-lane { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:10px;padding:12px; transition:border-color .2s; } .dpc-lane-active { border-color:rgba(123,178,144,.25); } .dpc-lane-running { border-color:rgba(123,178,144,.4);background:rgba(123,178,144,.06); } .dpc-lane-blocked { border-color:rgba(224,94,94,.3); } .dpc-lane-warn { border-color:rgba(240,168,80,.3); } .dpc-lane-idle { } /* Status dot */ .dpc-dot { width:7px;height:7px;border-radius:50%;flex-shrink:0; } .dpc-dot-green { background:var(--green); } .dpc-dot-pulse { background:var(--green); animation:dpcPulse 1s ease-in-out infinite; } .dpc-dot-red { background:#e05e5e; } .dpc-dot-amber { background:#f0a850; } .dpc-dot-grey { background:rgba(255,255,255,.2); } .dpc-lane-head { display:flex;align-items:center;gap:7px;margin-bottom:8px; } .dpc-lane-title { font-size:.72rem;font-weight:700;color:var(--text);flex:1; } .dpc-lane-badge { font-size:.55rem;font-weight:700;padding:1px 6px;border-radius:6px; background:rgba(255,255,255,.07);color:var(--dim);flex-shrink:0; } .dpc-lane-active .dpc-lane-badge { background:rgba(123,178,144,.15);color:var(--green); } .dpc-lane-running .dpc-lane-badge { background:rgba(123,178,144,.2);color:var(--green); } .dpc-lane-blocked .dpc-lane-badge { background:rgba(224,94,94,.12);color:#e05e5e; } .dpc-lane-warn .dpc-lane-badge { background:rgba(240,168,80,.12);color:#f0a850; } .dpc-lane-count { font-size:.65rem;color:var(--muted);margin-bottom:7px;min-height:14px; } .dpc-lane-row { display:flex;align-items:center;justify-content:space-between; font-size:.62rem;gap:4px;margin-bottom:3px; } .dpc-lane-key { color:var(--dim);flex-shrink:0; } .dpc-lane-val { font-weight:600;color:var(--text);text-align:right; } .dpc-val-ok { color:var(--green); } .dpc-val-warn { color:#f0a850; } .dpc-val-dim { color:var(--dim);font-weight:400; } .dpc-val-crit { color:#e05555;font-weight:700; } .dpc-section-header { font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em; color:var(--dim);margin:18px 0 8px;padding:6px 0 6px 2px; border-top:1px solid rgba(255,255,255,.08); } .dpc-lane-note { font-size:.6rem;color:var(--dim);margin-top:6px;line-height:1.4; border-top:1px solid rgba(255,255,255,.06);padding-top:5px; } .dpc-note-warn { color:#f0a850; } /* Bottom: activity + bottleneck */ .dpc-bottom { display:grid;grid-template-columns:1fr 280px;gap:10px; } @media (max-width:700px) { .dpc-bottom { grid-template-columns:1fr; } } .dpc-card { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:10px;padding:14px; } .dpc-card-label { font-size:.62rem;font-weight:700;text-transform:uppercase; letter-spacing:.07em;color:var(--dim);margin-bottom:10px; } /* Activity feed */ .dpc-act-feed { display:flex;flex-direction:column;gap:3px; } .dpc-act-empty { font-size:.72rem;color:var(--dim);text-align:center;padding:16px 0; } .dpc-act-row { display:flex;align-items:center;gap:8px; font-size:.67rem;padding:3px 5px;border-radius:5px; transition:background .15s; } .dpc-act-row:hover { background:rgba(255,255,255,.04); } .dpc-act-time { color:var(--dim);min-width:44px;flex-shrink:0;font-family:monospace;font-size:.6rem; } .dpc-act-ticker { font-family:monospace;font-weight:700;min-width:48px;flex-shrink:0; } .dpc-act-badge { padding:1px 7px;border-radius:6px;font-size:.58rem;font-weight:600;flex-shrink:0; } .dpc-act-ok { background:rgba(123,178,144,.15);color:var(--green); } .dpc-act-err { background:rgba(224,94,94,.12);color:#e05e5e; } .dpc-act-warn { background:rgba(240,168,80,.12);color:#f0a850; } .dpc-act-info { background:rgba(100,149,237,.1);color:#6495ed; } /* Bottleneck card */ .dpc-bn-critical { border-color:rgba(224,94,94,.35); } .dpc-bn-warn { border-color:rgba(240,168,80,.3); } .dpc-bn-ok { } .dpc-bn-body { display:flex;align-items:flex-start;gap:8px;margin-bottom:8px; } .dpc-bn-icon { font-size:.9rem;flex-shrink:0;padding-top:1px; } .dpc-bn-msg { font-size:.72rem;color:var(--text);font-weight:500;line-height:1.4; } .dpc-bn-action { margin-top:8px; } .dpc-bn-action code { font-size:.6rem;background:rgba(255,255,255,.06);padding:4px 8px;border-radius:6px; color:var(--green);word-break:break-all;display:block;line-height:1.5; } /* MANUAL ONLY lane */ .dpc-lane-manual { border-color:rgba(240,168,80,.2); } .dpc-lane-manual .dpc-lane-badge { background:rgba(240,168,80,.12);color:#f0a850; } /* Scope tag (US-only / Global) */ .dpc-scope-tag { display:inline-flex;align-items:center; font-size:.55rem;font-weight:700;padding:1px 6px;border-radius:6px; margin-left:6px;vertical-align:middle; } .dpc-scope-us { background:rgba(240,168,80,.15);color:#f0a850; } .dpc-scope-global { background:rgba(123,178,144,.15);color:var(--green); } .dpc-scope-note { background:rgba(255,255,255,.07);color:var(--dim); } .dpc-fill-seed { background:linear-gradient(90deg,#3a6ea8,#5b9bd5); } /* Running value text */ .dpc-val-run { color:var(--green);font-size:.6rem; } /* Dependencies row in header */ .dpc-dep-row { display:flex;align-items:center;gap:5px;flex-wrap:wrap; } .dpc-dep { font-size:.55rem;font-weight:600;padding:1px 6px;border-radius:6px; border:1px solid transparent; } .dpc-dep-ok { background:rgba(123,178,144,.1);border-color:rgba(123,178,144,.25);color:var(--green); } .dpc-dep-missing { background:rgba(224,94,94,.1);border-color:rgba(224,94,94,.25);color:#e05e5e; } /* ════════════════════════════════════════════════════════════════════════ Revenue History & Growth + Financial Data (stock detail view only) Dark glass / premium SaaS styling; mobile-friendly, no horizontal overflow. ════════════════════════════════════════════════════════════════════════ */ .modal-subtitle { font-size:.74rem;color:var(--dim);margin:2px 0 16px;line-height:1.45; } .company-profile { font-size:.84rem;line-height:1.6;color:var(--muted,#9aa39e);margin:2px 0 14px; } /* Rollover help (ⓘ) next to a section title — e.g. explains "ESG" */ .sec-help { position:relative;display:inline-flex;cursor:help;font-size:.72rem;color:var(--green,#7BB290);margin-left:6px;vertical-align:middle;outline:none; } .sec-help-tip { position:absolute;left:0;bottom:150%;width:max-content;max-width:260px; background:rgba(12,19,15,.98);border:1px solid rgba(123,178,144,.4);color:var(--text,#eef4f0); font-size:.72rem;font-weight:500;line-height:1.45;padding:9px 11px;border-radius:9px; opacity:0;pointer-events:none;transition:opacity .15s;z-index:60;box-shadow:0 8px 24px rgba(0,0,0,.55); } .sec-help:hover .sec-help-tip, .sec-help:focus .sec-help-tip, .sec-help:focus-visible .sec-help-tip { opacity:1; } .dim-val { color:var(--dim); } /* Summary cards (wrap on mobile) */ .rev-cards { display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px; } .rev-card { flex:1 1 90px;min-width:90px; background:var(--glass);border:1px solid var(--glass-b);border-radius:10px; padding:9px 11px; } .rev-card-lbl { font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);margin-bottom:3px; } .rev-card-val { font-size:1.02rem;font-weight:700;line-height:1.1; } .rev-card-val.pos-val { color:var(--green); } .rev-card-val.neg-val { color:var(--red); } /* Annual-revenue bar chart (CSS bars — no chart library, no number list) */ .rev-chart { display:flex;align-items:flex-end;gap:7px;height:132px;margin:22px 0 8px;padding:0 2px; } .rev-col { flex:1 1 0;display:flex;flex-direction:column;align-items:center;height:100%;min-width:0; } .rev-col-track { width:100%;flex:1;display:flex;align-items:flex-end;justify-content:center;min-height:0; } .rev-col-bar { width:100%;max-width:34px;border-radius:5px 5px 0 0; background:var(--green);opacity:.9;transition:opacity .15s,filter .15s; } .rev-col-bar.up { background:linear-gradient(180deg,var(--green2) 0%,var(--green) 100%); } .rev-col-bar.down { background:linear-gradient(180deg,#f08a8a 0%,var(--red) 100%);opacity:.8; } .rev-col-bar.flat { background:var(--dim); } .rev-col:hover .rev-col-bar { opacity:1;filter:brightness(1.12); } .rev-col-yr { font-size:.62rem;color:var(--dim);margin-top:6px;font-variant-numeric:tabular-nums; } .rev-chart-cap { font-size:.66rem;color:var(--dim);margin-bottom:14px;text-align:center; } /* Severe-only, subtle inline note (no big orange box). Sits inside .rev-method. */ .rev-method-warn { color:var(--amber);opacity:.8; } /* Historical Fair Value chart */ .histfv-ranges { display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 14px; } .histfv-range { cursor:pointer;font:inherit;font-size:.72rem;font-weight:700;line-height:1; padding:6px 12px;border-radius:999px; background:rgba(255,255,255,.045);border:1px solid var(--glass-b,rgba(255,255,255,.12));color:var(--muted); transition:background .15s,border-color .15s,color .15s; } .histfv-range:hover { background:rgba(123,178,144,.1);border-color:rgba(123,178,144,.4); } .histfv-range.active { background:rgba(123,178,144,.16);border-color:var(--green);color:var(--green); } /* aligned HTML legend (flex) — replaces the old in-SVG legend */ .histfv-legend { display:flex;flex-wrap:wrap;gap:16px;font-size:.72rem;color:var(--muted);margin:0 0 10px 2px; } .histfv-leg { display:inline-flex;align-items:center;gap:6px; } .histfv-leg i { width:13px;height:3px;border-radius:2px;display:inline-block;flex:0 0 auto; } .histfv-svg { margin-top:2px; } .histfv-cap { font-size:.68rem;color:var(--dim);margin-top:8px; } .histfv-empty { font-size:.8rem;color:var(--dim);line-height:1.5;padding:6px 0; } .histfv-metrics { display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 4px; } .histfv-metric { flex:1 1 120px;min-width:120px;background:var(--glass,rgba(255,255,255,.04)); border:1px solid var(--glass-b,rgba(255,255,255,.1));border-radius:10px;padding:8px 11px; } .histfv-m-lbl { display:block;font-size:.62rem;color:var(--dim);text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px; } .histfv-m-val { font-size:.98rem;font-weight:800;color:var(--text,#eef4f0); } @media (max-width:560px){ .histfv-metric { flex:1 1 calc(50% - 8px);min-width:0; } } .rev-method, .rev-empty { font-size:.7rem; } /* Financial Data — grouped metric cards */ .fin-source { font-size:.72rem;color:var(--dim);margin-bottom:10px; } .fin-groups { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px; } .fin-group { background:var(--glass);border:1px solid var(--glass-b);border-radius:12px;padding:11px 13px; } .fin-group-title { font-size:.64rem;letter-spacing:.07em;text-transform:uppercase;color:var(--green); font-weight:700;margin-bottom:8px; } .fin-group-grid { display:flex;flex-direction:column;gap:5px; } .fin-metric { display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:.8rem; } .fin-m-lbl { color:var(--dim);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; } .fin-m-val { font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap; } .fin-metric.is-na .fin-m-val { color:var(--dim);font-weight:500; } @media (max-width:768px) { .fin-groups { grid-template-columns:1fr; } /* stack on phones */ .rev-card { flex:1 1 calc(50% - 8px); } /* 2-up cards on phones */ .rev-chart { height:108px;gap:5px; } .rev-col-bar { max-width:26px; } .rev-col-yr { font-size:.56rem; } } /* ════════════════════════════════════════════════════════════════════════ Plain-language glossary tooltips (stock detail view) ════════════════════════════════════════════════════════════════════════ */ .fvc-term { border-bottom:1px dotted var(--green-b); cursor:help; text-decoration:none; } .fvc-term:hover, .fvc-term:focus { color:var(--green); outline:none; } #fvc-tip { position:fixed; z-index:99999; max-width:min(300px,86vw); padding:10px 13px; border-radius:10px; background:#0e1611; border:1px solid var(--green-b); color:var(--text); font-size:.78rem; line-height:1.45; font-weight:400; box-shadow:0 10px 32px rgba(0,0,0,.55); opacity:0; transform:translateY(3px); pointer-events:none; transition:opacity .12s ease, transform .12s ease; } #fvc-tip.show { opacity:1; transform:translateY(0); } /* ════════════════════════════════════════════════════════════════════════ Growth Quality interpretation block (stock detail — display only) ════════════════════════════════════════════════════════════════════════ */ .gq-block { margin-top:18px; } .gq-head { display:flex; align-items:center; gap:8px; margin-bottom:11px; } .gq-info { cursor:help; color:var(--dim); font-size:.9rem; border-bottom:none !important; line-height:1; } .gq-info:hover, .gq-info:focus { color:var(--green); outline:none; } .gq-badge { display:inline-flex; align-items:center; gap:8px; font-weight:800; font-size:1.0rem; padding:8px 15px; border-radius:999px; border:1px solid var(--glass-b); } .gq-dot { font-size:.85rem; line-height:1; } .gq-score { margin-left:6px; font-size:.7rem; font-weight:700; color:var(--dim); } .gq-sentence { margin:10px 0 8px; font-size:.86rem; line-height:1.5; color:var(--text); } .gq-metrics { display:flex; flex-wrap:wrap; gap:8px; } .gq-metric { flex:1 1 92px; min-width:92px; background:var(--glass); border:1px solid var(--glass-b); border-radius:10px; padding:8px 11px; } .gq-m-lbl { display:block; font-size:.58rem; letter-spacing:.06em; text-transform:uppercase; color:var(--dim); margin-bottom:3px; } .gq-m-val { font-size:.95rem; font-weight:700; font-variant-numeric:tabular-nums; } .gq-method { margin-top:12px; font-size:.7rem; } /* category accents on the badge */ .gq-block.gq-healthy .gq-badge { background:rgba(123,178,144,.14); border-color:var(--green-b); color:var(--green); } .gq-block.gq-mixed .gq-badge { background:rgba(240,200,90,.12); border-color:rgba(240,200,90,.40); color:#e7c75a; } .gq-block.gq-expensive .gq-badge { background:rgba(240,160,84,.12); border-color:rgba(240,160,84,.42); color:var(--amber); } .gq-block.gq-weak .gq-badge { background:rgba(233,106,106,.12); border-color:rgba(233,106,106,.40); color:var(--red); } .gq-block.gq-none .gq-badge { background:var(--glass); border-color:var(--glass-b); color:var(--dim); } @media (max-width:560px){ .gq-metric { flex:1 1 calc(50% - 8px); } } /* ── AI Moat block (stock detail · Alpha tab) ───────────────────────────── */ .modal-section.aimoat .aimoat-head { display:flex; align-items:baseline; gap:16px; margin:8px 0 4px; } .aimoat-score { font-size:1.6rem; font-weight:800; color:var(--green); line-height:1; } .aimoat-score small { font-size:.8rem; color:var(--dim); font-weight:600; } .aimoat-conf { font-size:.8rem; color:var(--dim); } .aimoat-chips { display:flex; flex-wrap:wrap; gap:6px; margin:10px 0 4px; } .aimoat-chip { font-size:.7rem; font-weight:700; color:var(--text); padding:4px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.14); white-space:nowrap; } .aimoat-flags { font-size:.76rem; color:#e9b8b2; margin:6px 0; } .aimoat-flags b { color:#e0584d; } .aimoat-meta { font-size:.74rem; color:var(--dim); margin-top:8px; } .aimoat-fv { font-size:.82rem; color:var(--text); margin-top:4px; } .modal-section.aimoat .modal-fine { font-size:.66rem; color:rgba(233,241,236,.64); margin-top:8px; font-style:italic; } /* ── Watchlist · Market Valuation & Cash Range (Pro module) ─────────────── */ .wl-market-val { margin:4px 0 14px; } /* No border: the card already sits inside the bordered watchlist panel — the extra outline read as a redundant double frame. The gradient bg keeps it a distinct card. */ .mv-card { border-radius:18px; padding:16px 18px; background:radial-gradient(120% 130% at 90% 0%, rgba(123,178,144,.10), transparent 60%), linear-gradient(160deg, rgba(20,30,24,.7), rgba(10,16,13,.6)); } .mv-loading { display:flex; align-items:center; justify-content:center; min-height:60px; } .mv-head { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:6px; } .mv-title { font-size:.95rem; font-weight:800; color:var(--text); } .mv-info { font-size:.68rem; color:#7BB290; cursor:help; border-bottom:1px dotted rgba(123,178,144,.5); } .mv-grid { display:grid; grid-template-columns:1.1fr 1.2fr .9fr; gap:14px; align-items:center; } .mv-gauge-svg { width:100%; height:auto; display:block; } .mv-gauge-end { fill:rgba(233,241,236,.64); font-size:9px; font-weight:600; } .mv-center { text-align:center; } .mv-status { display:inline-block; font-size:.92rem; font-weight:800; padding:3px 12px; border-radius:999px; color:#0e1512; background:#c9cf6a; } .mv-status.mv-z-deepundervalued { background:#2e9e63; color:#eafff2; } .mv-status.mv-z-undervalued { background:#7BB290; color:#0e1512; } .mv-status.mv-z-fairvalue { background:#c9cf6a; color:#0e1512; } .mv-status.mv-z-expensive { background:#e0a24d; color:#0e1512; } .mv-status.mv-z-veryexpensive { background:#e0584d; color:#fff; } .mv-ratio { font-size:1.05rem; font-weight:800; color:var(--text); margin-top:6px; } .mv-gap { font-size:.74rem; color:rgba(233,241,236,.7); margin-top:3px; } .mv-gap b { color:var(--text); } .mv-cash { text-align:center; border-left:1px solid rgba(255,255,255,.08); padding-left:12px; } .mv-cash-lbl { font-size:.6rem; text-transform:uppercase; letter-spacing:.05em; color:rgba(233,241,236,.70); } .mv-cash-val { font-size:1.7rem; font-weight:800; color:#7BB290; line-height:1.1; } .mv-cash-val small { font-size:.9rem; } .mv-cash-note { font-size:.58rem; color:rgba(233,241,236,.64); } .mv-foot { margin-top:12px; font-size:.66rem; color:rgba(233,241,236,.70); border-top:1px solid rgba(255,255,255,.07); padding-top:9px; } .mv-fine { font-size:.62rem; color:rgba(233,241,236,.62); margin-top:6px; font-style:italic; } /* locked teaser */ .mv-locked { text-align:center; position:relative; } .mv-lock-ico { font-size:1.3rem; opacity:.85; } .mv-teaser { font-size:.8rem; color:rgba(233,241,236,.72); margin:6px auto 12px; max-width:420px; line-height:1.45; } .mv-blur { position:relative; filter:blur(5px); opacity:.5; pointer-events:none; user-select:none; margin-bottom:6px; } .mv-blur-gauge { height:54px; margin:0 auto 8px; max-width:200px; border-radius:999px 999px 0 0; background:conic-gradient(from 270deg at 50% 100%, #2e9e63, #7BB290, #c9cf6a, #e0a24d, #e0584d); } .mv-lock-list { list-style:none; display:flex; flex-wrap:wrap; gap:6px; justify-content:center; padding:0; margin:0; } .mv-lock-list li { font-size:.66rem; color:rgba(233,241,236,.7); border:1px solid rgba(255,255,255,.12); border-radius:999px; padding:3px 10px; } .mv-cta-row { display:flex; gap:8px; justify-content:center; margin-top:12px; } .mv-cta { font-family:inherit; font-weight:800; font-size:.8rem; color:#0e1512; background:#7BB290; border:none; border-radius:11px; padding:9px 18px; cursor:pointer; transition:filter .15s, transform .12s; } .mv-cta:hover { filter:brightness(1.06); transform:translateY(-1px); } .mv-cta-ghost { background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.16); color:var(--text); } @media (max-width:560px){ .mv-grid { grid-template-columns:1fr; gap:10px; } .mv-cash { border-left:none; border-top:1px solid rgba(255,255,255,.08); padding-left:0; padding-top:10px; } } /* ── Market Valuation — three sections (Macro · FVC Aggregate · Combined) ── */ .mv-sec { padding:11px 0; border-top:1px solid rgba(255,255,255,.07); } .mv-sec:first-of-type { border-top:none; } .mv-sec-h { font-size:.72rem; font-weight:800; letter-spacing:.02em; color:var(--text); text-transform:uppercase; margin-bottom:6px; display:flex; align-items:center; gap:8px; } .mv-sec-sub { font-weight:600; text-transform:none; color:rgba(233,241,236,.70); letter-spacing:0; } .mv-sec-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap; } .mv-sec-note { font-size:.66rem; color:rgba(233,241,236,.70); margin-top:5px; line-height:1.4; } .mv-big { font-size:1.5rem; font-weight:800; color:var(--text); line-height:1; } .mv-badge { font-size:.72rem; font-weight:800; padding:3px 11px; border-radius:999px; color:#0e1512; background:#c9cf6a; } .mv-info { display:inline-flex; width:15px; height:15px; align-items:center; justify-content:center; border-radius:50%; border:1px solid rgba(123,178,144,.5); color:#7BB290; font-size:.62rem; cursor:help; } .mv-info-link { font-size:.66rem; color:#7BB290; cursor:help; border-bottom:1px dotted rgba(123,178,144,.5); } .mv-cov { font-size:.62rem; font-weight:700; padding:2px 9px; border-radius:999px; border:1px solid rgba(255,255,255,.14); } .mv-cov-good { color:#7BB290; border-color:rgba(123,178,144,.45); background:rgba(123,178,144,.12); } .mv-cov-limited { color:#e0a24d; border-color:rgba(224,162,77,.4); background:rgba(224,162,77,.1); } .mv-cov-low { color:#e0584d; border-color:rgba(224,88,77,.4); background:rgba(224,88,77,.1); } .mv-sec-combined { border-top:1px solid rgba(123,178,144,.25); margin-top:2px; } .mv-grid2 { display:grid; grid-template-columns:1fr auto; gap:14px; align-items:center; } @media (max-width:520px){ .mv-grid2 { grid-template-columns:1fr; } } /* ── Market Valuation — insufficient-data (premium clean) state ─────────── */ .mv-incomplete { text-align:left; } .mv-status-badge { display:inline-block; font-size:.66rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:#e0a24d; background:rgba(224,162,77,.12); border:1px solid rgba(224,162,77,.4); border-radius:999px; padding:4px 12px; margin:6px 0 8px; } .mv-chips { display:flex; flex-wrap:wrap; gap:7px; margin-top:8px; } .mv-chip { font-size:.66rem; color:rgba(233,241,236,.65); border:1px solid rgba(255,255,255,.12); border-radius:999px; padding:3px 10px; } .mv-chip b { color:var(--text); font-weight:700; text-transform:capitalize; } .mv-warn { color:#e0a24d; } /* ── Market Valuation info popover (click-to-toggle; works on tap, not just hover) ── */ .mv-info-link { position:relative; font-family:inherit; background:none; border:none; cursor:pointer; font-size:.66rem; color:#7BB290; border-bottom:1px dotted rgba(123,178,144,.5); padding:0; } .mv-pop { position:absolute; top:130%; right:0; z-index:30; width:min(260px,72vw); text-align:left; background:rgba(8,13,10,.98); border:1px solid rgba(255,255,255,.16); border-radius:10px; padding:9px 11px; font-size:.68rem; line-height:1.45; color:rgba(233,241,236,.82); font-weight:500; box-shadow:0 14px 36px rgba(0,0,0,.55); cursor:default; } /* ── Market Valuation — three glass cards (Macro · Internal · Cash) ─────── */ .mv-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:12px 0 8px; } @media (max-width:600px){ .mv-cards { grid-template-columns:1fr; } } .mv-tile { border:1px solid rgba(255,255,255,.10); border-radius:16px; padding:14px 15px; background:linear-gradient(158deg, rgba(255,255,255,.05), rgba(255,255,255,.015)); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); display:flex; flex-direction:column; gap:6px; } .mv-tile-cash { background:linear-gradient(158deg, rgba(123,178,144,.12), rgba(123,178,144,.02)); border-color:rgba(123,178,144,.22); } .mv-tile-muted { opacity:.78; } .mv-tile-lbl { font-size:.62rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:rgba(233,241,236,.74); } .mv-tile-val { font-size:1.85rem; font-weight:800; color:var(--text); line-height:1; } .mv-tile-val small { font-size:.9rem; font-weight:700; color:rgba(233,241,236,.74); } .mv-tile-val.mv-pos { color:#e0584d; } /* trades ABOVE FV = expensive = red */ .mv-tile-val.mv-neg { color:#7BB290; } /* trades BELOW FV = cheap = green */ .mv-tile-na { color:rgba(233,241,236,.66); font-weight:700; } .mv-tile-badge { align-self:flex-start; font-size:.66rem; font-weight:800; padding:3px 10px; border-radius:999px; color:#0e1512; background:#c9cf6a; } .mv-tile-note { font-size:.62rem; color:rgba(233,241,236,.70); line-height:1.4; margin-top:auto; } /* badge valuation colours (shared scale) */ .mv-z-cheap, .mv-z-deepundervalued { background:#2e9e63; color:#eafff2; } .mv-z-undervalued { background:#7BB290; color:#0e1512; } .mv-z-fair, .mv-z-fairvalue { background:#c9cf6a; color:#0e1512; } .mv-z-expensive { background:#e0a24d; color:#0e1512; } .mv-z-veryexpensive { background:#e0584d; color:#fff; } .mv-z-mixedsignal, .mv-z-indicativeonly, .mv-z-notavailableyet { background:rgba(255,255,255,.12); color:var(--text); } /* ── Market Valuation — combined gauge (top) ───────────────────────────── */ .mv-combined { display:grid; grid-template-columns:170px 1fr; gap:16px; align-items:center; margin:10px 0 4px; } @media (max-width:560px){ .mv-combined { grid-template-columns:1fr; text-align:center; } } .mv-combined .mv-gauge { width:170px; max-width:100%; margin:0 auto; } .mv-combined-status { display:inline-block; font-size:1rem; font-weight:800; padding:4px 14px; border-radius:999px; color:#0e1512; background:#c9cf6a; } .mv-combined-sub { font-size:.68rem; color:rgba(233,241,236,.70); margin-top:5px; } .mv-inputs { display:flex; flex-direction:column; gap:6px; margin-top:10px; } .mv-input { font-size:.7rem; color:rgba(233,241,236,.75); display:flex; align-items:center; gap:6px; flex-wrap:wrap; } .mv-input-lbl { color:rgba(233,241,236,.70); min-width:130px; } @media (max-width:560px){ .mv-inputs { align-items:center; } .mv-input-lbl { min-width:0; } } /* ── Collapsible "3 sources" — uniform rows, revealed on tap ── */ .mv-sources { margin-top:12px; border:1px solid var(--fvc-border); border-radius:var(--r-sm); background:rgba(255,255,255,.03); overflow:hidden; } .mv-sources-sum { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 12px; cursor:pointer; list-style:none; font-size:.74rem; color:var(--muted); } .mv-sources-sum::-webkit-details-marker { display:none; } .mv-sources-sum b { color:var(--text); font-weight:700; } .mv-sources-chev { color:var(--green); transition:transform .18s; } .mv-sources[open] .mv-sources-chev { transform:rotate(180deg); } .mv-sources-body { padding:2px 8px 8px; } .mv-src { display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; padding:9px 8px; font-size:.74rem; color:var(--muted); border:0; border-top:1px solid var(--fvc-border); border-radius:0; outline:none; background:none; font-family:inherit; text-align:left; -webkit-appearance:none; appearance:none; } .mv-src:first-child { border-top:0; } .mv-src-lbl { color:rgba(233,241,236,.74); } .mv-src-v { display:flex; align-items:center; gap:7px; white-space:nowrap; } .mv-src-v b { font-weight:700; color:var(--text); } .mv-src-note { color:var(--dim); font-size:.68rem; } .mv-src-tag { font-size:.62rem; padding:1px 7px; border-radius:var(--r-pill); border:1px solid var(--fvc-border); } .mv-src-btn { cursor:pointer; transition:background .15s; } .mv-src-btn:hover { background:var(--green-d); } .mv-src-go { color:var(--green); font-size:.64rem; font-weight:600; } /* Technical-signal dashboard popup */ .fvc-signal-ov { position:fixed; inset:0; z-index:9000; background:rgba(5,8,6,.78); backdrop-filter:blur(4px); display:none; align-items:center; justify-content:center; padding:18px; } .fvc-signal-ov.open { display:flex; } .fvc-signal-modal { width:min(1100px,100%); height:min(92vh,900px); background:var(--bg); border:1px solid var(--fvc-border-strong); border-radius:var(--r); overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--shadow); } .fvc-signal-bar { display:flex; align-items:center; gap:12px; padding:10px 14px; border-bottom:1px solid var(--fvc-border); background:var(--glass); } .fvc-signal-ttl { font-size:.82rem; font-weight:600; color:var(--text); } .fvc-signal-open { margin-left:auto; font-size:.74rem; color:var(--green); text-decoration:none; } .fvc-signal-x { background:none; border:0; color:var(--muted); font-size:1.1rem; cursor:pointer; padding:2px 6px; line-height:1; } .fvc-signal-x:hover { color:var(--text); } .fvc-signal-frame { flex:1; width:100%; border:0; background:var(--bg); } /* ── Model Cash Range — glass bar under the diversification panel ───────── */ .mv-cashbar { margin:14px 0 4px; border:1px solid rgba(123,178,144,.22); border-radius:16px; padding:14px 16px; background:linear-gradient(158deg, rgba(123,178,144,.12), rgba(255,255,255,.015)); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); } .mv-cashbar-paused { border-color:rgba(255,255,255,.10); background:linear-gradient(158deg, rgba(255,255,255,.05), rgba(255,255,255,.01)); } .mv-cashbar-h { display:flex; align-items:baseline; justify-content:space-between; } .mv-cashbar-lbl { font-size:.7rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:rgba(233,241,236,.62); } .mv-cashbar-val { font-size:1.5rem; font-weight:800; color:#7BB290; } .mv-cashbar-val small { font-size:.85rem; } .mv-cashbar-track { position:relative; height:12px; border-radius:999px; background:rgba(255,255,255,.06); margin:12px 0 5px; overflow:hidden; } .mv-cashbar-base { position:absolute; left:0; top:0; bottom:0; border-radius:999px 0 0 999px; background:rgba(123,178,144,.28); } /* 0→min, anchored at 0 */ .mv-cashbar-band { position:absolute; top:0; bottom:0; border-radius:999px; background:linear-gradient(90deg,#7BB290,#9ed3b0); box-shadow:0 0 12px rgba(123,178,144,.5); } /* recommended range */ .mv-cashbar-axis { display:flex; justify-content:space-between; font-size:.58rem; color:rgba(233,241,236,.64); } .mv-cashbar-note { font-size:.62rem; color:rgba(233,241,236,.70); margin-top:8px; font-style:italic; } /* Combined-status badge colour must follow the valuation scale (two-class specificity beats the .mv-combined-status base background). */ .mv-combined-status.mv-z-cheap, .mv-combined-status.mv-z-deepundervalued { background:#2e9e63; color:#eafff2; } .mv-combined-status.mv-z-undervalued { background:#7BB290; color:#0e1512; } .mv-combined-status.mv-z-fair, .mv-combined-status.mv-z-fairvalue { background:#c9cf6a; color:#0e1512; } .mv-combined-status.mv-z-expensive { background:#e0a24d; color:#0e1512; } .mv-combined-status.mv-z-veryexpensive { background:#e0584d; color:#fff; } .mv-combined-status.mv-z-mixedsignal, .mv-combined-status.mv-z-dataincomplete { background:rgba(255,255,255,.12); color:var(--text); } /* ── Sprach-Umschalter in den Hubs (Bibliothek/Rechner) ── */ .lib-lang-switch { display:flex; gap:8px; margin-bottom:16px; } .lib-lang-switch a { font-size:13px; font-weight:600; padding:7px 15px; border-radius:var(--r-pill); border:1px solid var(--fvc-border); color:var(--muted); text-decoration:none; transition:border-color .15s,color .15s; } .lib-lang-switch a.on { background:var(--green-d); border-color:var(--green-b); color:var(--green); } .lib-lang-switch a:hover { border-color:var(--fvc-border-strong); } /* ── Sprachwahl-Popup (Footer) ── */ .fvc-lang-ov { position:fixed; inset:0; z-index:9100; background:rgba(5,8,6,.74); backdrop-filter:blur(3px); display:none; align-items:center; justify-content:center; padding:20px; } .fvc-lang-ov.open { display:flex; } .fvc-lang-box { position:relative; width:min(380px,100%); background:var(--bg); border:1px solid var(--fvc-border-strong); border-radius:var(--r); box-shadow:var(--shadow); padding:26px 22px; text-align:center; } .fvc-lang-h { font-size:17px; font-weight:700; color:var(--text); margin-bottom:18px; line-height:1.3; } .fvc-lang-h span { font-size:13px; font-weight:500; color:var(--muted); } .fvc-lang-opts { display:flex; gap:12px; } .fvc-lang-opts a { flex:1; display:flex; flex-direction:column; align-items:center; gap:7px; padding:18px 10px; border:1px solid var(--fvc-border); border-radius:var(--r-sm); background:var(--glass); color:var(--text); text-decoration:none; font-weight:600; font-size:15px; transition:border-color .15s,background .15s; } .fvc-lang-opts a:hover,.fvc-lang-opts a.last { border-color:var(--green-b); background:var(--green-d); } .fvc-lang-opts .fl { font-size:34px; line-height:1; } .fvc-lang-x { position:absolute; top:10px; right:12px; background:none; border:0; color:var(--muted); font-size:1.1rem; cursor:pointer; } .fvc-lang-x:hover { color:var(--text); } /* ── Strategy / legend chips: plain pills like every other filter chip, with a subtle inline "?" that opens the exact-setup bubble. No box, no attached segment — same flat design as the Region/Sort/Evidence chips. ──────────────── */ .fvc-strategy-chip { display:inline-flex; align-items:center; gap:6px; } .fvc-legend-q { display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; border-radius:50%; font-size:.66rem; font-weight:800; line-height:1; cursor:pointer; color:inherit; opacity:.55; background:rgba(127,127,127,.16); touch-action:manipulation; transition:opacity .15s, background .15s; } .fvc-legend-q:hover, .fvc-legend-q:focus-visible { opacity:1; background:rgba(123,178,144,.28); outline:none; } /* Strategy "?" bubble — centred popup (mirrors .fvc-lang-ov). */ .fvc-strat-ov { position:fixed; inset:0; z-index:9100; background:rgba(5,8,6,.74); backdrop-filter:blur(3px); display:none; align-items:center; justify-content:center; padding:20px; } .fvc-strat-ov.open { display:flex; } .fvc-strat-box { position:relative; width:min(440px,100%); max-height:86vh; overflow-y:auto; background:var(--bg); border:1px solid var(--fvc-border-strong,rgba(123,178,144,.4)); border-radius:var(--r,16px); box-shadow:var(--shadow,0 24px 80px rgba(0,0,0,.6)); padding:24px 22px; } .fvc-strat-x { position:absolute; top:10px; right:12px; background:none; border:0; color:var(--muted); font-size:1.1rem; cursor:pointer; touch-action:manipulation; } .fvc-strat-x:hover { color:var(--text); } .fvc-strat-h { font-size:1.12rem; font-weight:800; color:var(--text); margin:0 26px 6px 0; } .fvc-strat-who { font-size:.86rem; line-height:1.5; color:var(--muted); margin:0 0 16px; } .fvc-strat-sub { font-size:.66rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--fvc-green,#7BB290); margin:0 0 9px; } .fvc-strat-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:7px; } .fvc-strat-list li { position:relative; padding-left:20px; font-size:.86rem; line-height:1.45; color:var(--text); } .fvc-strat-list li::before { content:'✓'; position:absolute; left:0; top:0; color:var(--fvc-green,#7BB290); font-weight:800; font-size:.8rem; } .fvc-strat-note { margin:14px 0 0; font-size:.78rem; line-height:1.45; color:var(--muted); border-left:2px solid rgba(123,178,144,.35); padding-left:10px; } .fvc-strat-disc { margin:14px 0 0; font-size:.7rem; line-height:1.4; color:var(--dim,rgba(233,241,236,.5)); }