/* Alignment with Tipmaster's observed product identity: navy, white, yellow CTA and trust green. */
:root {
  --ink: #09090b;
  --panel: #0f172a;
  --paper: #ffffff;
  --lime: #ffcc33;
  --mint: #86efac;
  --orange: #dc5f45;
  --muted: #64748b;
  --line: #e2e8f0;
  color-scheme: light;
  font-family: "Plus Jakarta Sans", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body { background: #f8fafc; color: var(--ink); }
.hero { background-color: #0f172a; background-image: linear-gradient(90deg, rgba(15, 23, 42, .93) 0%, rgba(15, 23, 42, .76) 55%, rgba(15, 23, 42, .48) 100%), url("assets/tipmaster-trophy-hero.png"); background-size: cover; background-position: center; color: #fff; border-bottom: 0; }
.brand-logo { width: 48px; height: 48px; object-fit: contain; }
.concept-label { padding-left: .75rem; border-left: 1px solid #334155; color: #cbd5e1; font-size: .7rem; font-weight: 800; letter-spacing: .14em; }
.brand b, .eyebrow { color: #ffcc33; }
.status { color: #cbd5e1; }
.nav-actions { display: flex; align-items: center; gap: 1rem; }
.language-toggle { border: 1px solid #475569; border-radius: 999px; background: transparent; color: #fff; padding: .45rem .7rem; font: inherit; font-size: .72rem; font-weight: 800; cursor: pointer; }
.language-toggle:hover, .language-toggle:focus-visible { border-color: #ffcc33; color: #ffcc33; }
.nav-link { color: #fff; text-decoration: none; font-size: .78rem; font-weight: 700; }
.nav-link:hover, .nav-link:focus-visible { color: #ffcc33; }
.signup-link { border-radius: 999px; background: #ffcc33; color: #1f2937; padding: .55rem .9rem; text-decoration: none; font-size: .78rem; font-weight: 800; }
.menu-button { width: 2.25rem; height: 2.25rem; border: 1px solid #475569; border-radius: .55rem; display: grid; place-content: center; gap: 3px; }
.menu-button span { display: block; width: 14px; height: 2px; background: #fff; }
@media (max-width: 720px) { .status, .nav-link { display: none; } .concept-label { display: none; } .brand-logo { width: 40px; height: 40px; } }
.pulse { background: #86efac; box-shadow: 0 0 0 .35rem rgba(134, 239, 172, .12); }
.hero h1 em { color: #ffcc33; }
.lede { color: #e2e8f0; }
.button { background: #3d8a5c; border-color: #3d8a5c; color: #fff; }
.button:hover, .button:focus-visible { border-color: #ffcc33; }
.button.primary { background: #ffcc33; border-color: #ffcc33; color: #1f2937; }
.button.ghost { background: transparent; border-color: #94a3b8; color: #fff; }
.model-card { background: rgba(255, 255, 255, .07); border-color: rgba(255, 255, 255, .16); }
.live, .safety-row { color: #86efac; }
.score-ring { border-color: #ffcc33; box-shadow: inset 0 0 2rem rgba(255, 204, 51, .08); }
.score-ring span, .model-card > p { color: #cbd5e1; }
.control-bar { background: #fff; border-color: #e2e8f0; color: #09090b; box-shadow: 0 12px 32px rgba(15, 23, 42, .12); }
.control-bar label { color: #475569; }
.control-bar select { background: #fff; border-color: #cbd5e1; color: #09090b; }
.control-bar .muted { color: #64748b; }
.section .eyebrow { color: #3d8a5c; }
.match-card { border: 1px solid #e2e8f0; box-shadow: 0 8px 24px rgba(15, 23, 42, .07); }
.match-card::before { background: #ffcc33; }
.prediction { background: #f1f5f9; }
.meter { background: #e2e8f0; }
.meter > span { background: #3d8a5c; }
.card-actions button:first-child { background: #0f172a; }
.analysis-panel { background: #fff; color: #09090b; border-color: #e2e8f0; box-shadow: 0 8px 24px rgba(15, 23, 42, .06); }
.analysis-panel .muted { color: #64748b; }
.analysis-panel .kpi { background: #f1f5f9; }
.analysis-panel .kpi span { color: #64748b; }
.factor-list li::before { color: #3d8a5c; }
.shortlist-panel { background: #0f172a; color: #fff; border-color: #1e293b; }
.shortlist-panel .eyebrow { color: #ffcc33; }
.shortlist-panel .muted, .shortlist-empty { color: #94a3b8; }
.shortlist-item { border-color: #334155; }
.agent-section { background: linear-gradient(135deg, #f1f5f9, #fff); color: #09090b; border-top: 1px solid #e2e8f0; }
.agent-section .eyebrow { color: #3d8a5c; }
.tool-list li { border-color: #e2e8f0; box-shadow: 0 4px 14px rgba(15, 23, 42, .05); }
dialog { background: #0f172a; color: #fff; border-color: #334155; }
footer { background: #0a0e1a; color: #94a3b8; }
.footer-brand { display: flex; align-items: center; gap: .65rem; }
.footer-brand img { width: 28px; height: 28px; object-fit: contain; opacity: .85; }
