/*
  ┌────────────────────────────────────────────────────────┐
  │  dhlmnn · Forest                                       │
  │  Deep green-black · Mint accent · Floating pill nav    │
  └────────────────────────────────────────────────────────┘
*/

/* ── Tokens ──────────────────────────────────────────────── */
:root {
  --bg:            #060a07;
  --surface:       rgba(255,255,255,0.028);
  --surface-hover: rgba(255,255,255,0.050);
  --border:        rgba(255,255,255,0.068);
  --border-hover:  rgba(255,255,255,0.130);
  --text:          #dff2e8;
  --text-muted:    rgba(223,242,232,0.62);
  --text-subtle:   rgba(223,242,232,0.28);
  --accent:        #6ee7b7;
  --cyan:          #22d3ee;
  --green:         #4ade80;
  --yellow:        #fbbf24;
  --red:           #f87171;
  --orange:        #fb923c;
  --navbar-h:      50px;
}

/* ── Reset ───────────────────────────────────────────────── */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html {
  height: 100%;
  background-color: #060a07;
  /* Dark moody forest photo, heavily darkened */
  background-image:
    linear-gradient(rgba(4,9,5,.78), rgba(4,9,5,.78)),
    url('forest.jpg');
  background-size: cover;
  background-position: center 60%;
  background-attachment: fixed;
  background-repeat: no-repeat;
}
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  background: transparent; color: var(--text-muted);
  height: 100%; display: flex; flex-direction: column;
  overflow: hidden; -webkit-font-smoothing: antialiased;
  line-height: 1.5;
}
/* Dot grid texture */
body::before {
  content: '';
  position: fixed; inset: 0; z-index: 0;
  background-image: radial-gradient(rgba(110,231,183,.022) 1px, transparent 1px);
  background-size: 28px 28px;
  pointer-events: none;
}
::selection { background: var(--accent); color: #000; }

/* ── Background glow ─────────────────────────────────────── */
.aurora {
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
}
/* Soft forest light — upper-center, emerald green */
.aurora::before {
  content: ''; position: absolute;
  top: -15%; left: 50%; transform: translateX(-50%);
  width: 75vw; height: 75vh;
  background: radial-gradient(circle, rgba(52,211,153,.10) 0%, transparent 58%);
  filter: blur(80px);
}
/* Second glow: low-center, deeper green */
.aurora::after {
  content: ''; position: absolute;
  bottom: -20%; left: 50%; transform: translateX(-50%);
  width: 90vw; height: 55vh;
  background: radial-gradient(ellipse at center, rgba(16,185,129,.07) 0%, transparent 60%);
  filter: blur(100px);
}

/* ── Cursor glow (follows mouse) ───────────────────────────── */
.cursor-glow {
  position: fixed;
  width: 560px; height: 560px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(110,231,183,.072) 0%, transparent 65%);
  pointer-events: none;
  z-index: 3;
  left: 0; top: 0;
  transform: translate(var(--cx, -9999px), var(--cy, -9999px));
  will-change: transform;
}

/* Hide legacy background layers */
.forest-bg, .forest-overlay, .mist-layer,
.circuit-bg, .grid-overlay { display: none !important; }

/* ── Navbar ──────────────────────────────────────────────── */
.navbar {
  flex-shrink: 0; position: relative; z-index: 100;
  background: transparent;
  border-bottom: none;
  padding: 18px 32px 0;
}
/* The inner div IS the pill */
.navbar-inner {
  max-width: 860px; width: 100%; margin: 0 auto;
  padding: 0 8px 0 22px; height: var(--navbar-h);
  display: flex; align-items: center; gap: 12px;
  background: rgba(6,14,7,.82);
  border: 1px solid rgba(110,231,183,.09);
  border-radius: 100px;
  backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
  box-shadow: 0 4px 28px rgba(0,0,0,.50), inset 0 1px 0 rgba(110,231,183,.04);
}

/* Logo */
.logo {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.95rem; font-weight: 600;
  color: var(--text); letter-spacing: .10em;
  display: inline-flex; align-items: center;
  cursor: pointer; text-decoration: none;
  flex-shrink: 0; transition: color .2s;
  border: none; background: none; padding: 0;
}
.logo:hover { color: var(--accent); }
.logo .char {
  display: inline-block;
  animation: glitchIn .5s cubic-bezier(.25,.46,.45,.94) forwards;
  opacity: 0;
}
.logo .char:nth-child(1) { animation-delay: .08s; }
.logo .char:nth-child(2) { animation-delay: .13s; }
.logo .char:nth-child(3) { animation-delay: .18s; }
.logo .char:nth-child(4) { animation-delay: .23s; }
.logo .char:nth-child(5) { animation-delay: .28s; }
.logo .char:nth-child(6) { animation-delay: .33s; }
@keyframes glitchIn {
  0%   { opacity:0; transform:translateY(-18px) skewX(18deg); filter:blur(6px); }
  30%  { opacity:1; transform:translateY(4px) skewX(-4deg); filter:blur(0); }
  55%  { transform:translateY(-1px) skewX(1deg); }
  100% { opacity:1; transform:none; filter:none; }
}
.logo-cursor {
  width: 2px; height: .9em; background: var(--accent);
  margin-left: 2px; animation: curBlink 1s step-end infinite;
}
@keyframes curBlink { 0%,49%{opacity:1} 50%,100%{opacity:0} }

/* Nav links */
.navbar-links {
  display: flex; align-items: center; gap: 2px;
  margin-left: auto;
}
.navbar-links a {
  height: 36px;
  display: flex; align-items: center;
  padding: 0 14px;
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: .82rem; font-weight: 400;
  color: rgba(255,255,255,.36); text-decoration: none;
  letter-spacing: 0;
  border-radius: 100px;
  border-bottom: none; margin-bottom: 0;
  transition: color .15s, background .15s;
}
.navbar-links a:hover  { color: rgba(223,242,232,.78); background: rgba(110,231,183,.05); }
.navbar-links a.active { color: rgba(223,242,232,.96); background: rgba(110,231,183,.12); }

/* Small clock in navbar (sub-pages) */
.navbar-clock {
  font-family: 'JetBrains Mono', monospace;
  font-size: .80rem; font-weight: 500;
  color: var(--text-subtle); letter-spacing: .04em;
  flex-shrink: 0; padding-left: 14px;
  border-left: 1px solid var(--border);
  display: flex; flex-direction: column; gap: 1px;
}
.navbar-clock .clock-time { font-size: .80rem; color: var(--text-muted); letter-spacing: .04em; }
.navbar-clock .clock-date { font-size: .56rem; letter-spacing: .12em; text-transform: uppercase; opacity: .6; }

/* ── Page root ───────────────────────────────────────────── */
.page {
  flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden;
  scrollbar-width: none; position: relative; z-index: 10;
  display: flex; flex-direction: column;
}
.page::-webkit-scrollbar { display: none; }

/* ── Container ───────────────────────────────────────────── */
.container {
  max-width: 860px; width: 100%; margin: 0 auto;
  padding: 0 28px; flex: 1; min-height: 0;
  display: flex; flex-direction: column;
}

/* ── Clock hero (index.html – large display) ─────────────── */
.clock-hero {
  max-width: 860px; width: 100%; margin: 0 auto;
  padding: 48px 28px 36px;
}
.clock-hero .clock-time {
  font-family: 'JetBrains Mono', monospace;
  font-size: clamp(2.8rem, 7.5vw, 5.5rem);
  font-weight: 500; color: var(--text);
  letter-spacing: .02em; line-height: 1;
  font-variant-ligatures: none;
  animation: fadeUp .6s ease .2s both;
}
.clock-hero .clock-date {
  font-family: 'JetBrains Mono', monospace;
  font-size: .68rem; letter-spacing: .26em;
  text-transform: uppercase; color: var(--text-subtle);
  margin-top: 8px; animation: fadeUp .6s ease .35s both;
}
@keyframes fadeUp {
  from { opacity:0; transform:translateY(14px); }
  to   { opacity:1; transform:none; }
}

/* Fallback clock styles (used when .clock-time is NOT inside .clock-hero) */
.clock-time {
  font-family: 'JetBrains Mono', monospace;
  font-size: 4rem; font-weight: 600;
  color: var(--text); letter-spacing: .03em; line-height: 1;
  font-variant-ligatures: none;
}
.clock-date {
  font-family: 'JetBrains Mono', monospace;
  font-size: .7rem; letter-spacing: .25em;
  text-transform: uppercase; color: var(--text-subtle);
}
.clock-widget { text-align: center; margin-bottom: 24px; }

/* Weather */
.weather-strip {
  display: none; align-items: center; gap: 6px;
  font-family: 'JetBrains Mono', monospace;
  font-size: .78rem; color: var(--text-subtle);
}
.wsep { color: var(--text-subtle); opacity: .4; }
.weather-strip .wdot { width: 1px; height: 10px; background: var(--border); opacity: .6; margin: 0 4px; }
#weatherIcon svg, #weatherRain svg { width: 14px; height: 14px; vertical-align: middle; margin-right: 2px; }

/* ── Main content ────────────────────────────────────────── */
main {
  flex: 1; display: flex; flex-direction: column;
  padding: 20px 0; gap: 32px;
}

/* ── Section label ───────────────────────────────────────── */
.section-label {
  font-size: .58rem; font-weight: 600;
  letter-spacing: .20em; text-transform: uppercase;
  color: rgba(255,255,255,.20);
  display: flex; align-items: center; gap: 12px; flex-shrink: 0;
  padding-bottom: 2px;
}
.section-label::after {
  content: ''; flex: 1; height: 1px;
  background: rgba(255,255,255,.048);
}

/* ── Bento link cards (index.html) ──────────────────────── */
.quick-links, #quickLinks { display: flex; flex-direction: column; gap: 36px; }
.link-section { display: flex; flex-direction: column; gap: 8px; }

.bento-link-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(92px, 1fr));
  gap: 7px;
}

.bento-link-card {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 8px; padding: 15px 8px 12px;
  background: rgba(255,255,255,.026);
  border: 1px solid rgba(255,255,255,.068);
  border-radius: 14px;
  text-decoration: none; color: inherit;
  position: relative; overflow: hidden;
  transition: background .15s, border-color .15s, transform .15s;
}
.bento-link-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 45%;
  background: linear-gradient(to bottom, rgba(110,231,183,.06), transparent);
  opacity: 0; transition: opacity .2s; pointer-events: none;
}
.bento-link-card:hover {
  background: rgba(255,255,255,.048);
  border-color: rgba(110,231,183,.22);
  transform: translateY(-2px);
}
.bento-link-card:hover::before { opacity: 1; }

.bento-link-card.cat-hosting:hover  { border-color: rgba(129,140,248,.22); }
.bento-link-card.cat-hosting::before { background: linear-gradient(to bottom, rgba(129,140,248,.07), transparent); }
.bento-link-card.cat-bookmarks:hover { border-color: rgba(251,191,36,.20); }
.bento-link-card.cat-bookmarks::before { background: linear-gradient(to bottom, rgba(251,191,36,.06), transparent); }

.bento-icon { width: 28px; height: 28px; object-fit: contain; opacity: .62; flex-shrink: 0; transition: opacity .15s, transform .15s; }
.bento-icon.invert { filter: invert(1) brightness(.8); }
.bento-link-card:hover .bento-icon { opacity: 1; transform: scale(1.1); }

.bento-name {
  font-family: 'Inter', sans-serif;
  font-size: .68rem; font-weight: 400;
  color: rgba(223,242,232,.46); text-align: center;
  letter-spacing: 0; line-height: 1.2;
  transition: color .15s;
}
.bento-link-card:hover .bento-name { color: rgba(223,242,232,.92); }

/* keep old classes for compat */
.link-icon-wrap { display: none; }
.link-card, .link-grid { display: none; }
.hero-title, .hero-cursor { display: none; }

/* ── Service status bento (monitoring.html) ──────────────── */
.svc-bento-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 6px;
}
.svc-bento-card {
  display: flex; flex-direction: column; gap: 6px;
  padding: 12px 14px;
  background: rgba(255,255,255,.026);
  border: 1px solid rgba(255,255,255,.068);
  border-radius: 12px;
  transition: border-color .15s;
}
.svc-bento-card.has-incident { border-color: rgba(248,113,113,.22); background: rgba(248,113,113,.04); }
.svc-bento-card.has-advisory { border-color: rgba(251,191,36,.20);  background: rgba(251,191,36,.03); }
.svc-dot-row { display: flex; align-items: center; gap: 7px; }
.svc-sticker {
  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
}
.svc-sticker.healthy  { background: var(--green); box-shadow: 0 0 5px rgba(74,222,128,.4); }
.svc-sticker.advisory { background: var(--yellow); }
.svc-sticker.incident { background: var(--red); box-shadow: 0 0 5px rgba(248,113,113,.5); animation: pulse 2s ease-in-out infinite; }
.svc-title { font-family: 'Inter', sans-serif; font-size: .74rem; font-weight: 500; color: rgba(223,242,232,.75); }
.svc-status-text {
  font-family: 'JetBrains Mono', monospace; font-size: .60rem;
  letter-spacing: .06em; text-transform: uppercase;
  color: rgba(223,242,232,.28);
}
.svc-status-text.incident { color: var(--red); }
.svc-status-text.advisory { color: var(--yellow); }
.svc-status-text.healthy  { color: rgba(74,222,128,.55); }

.all-ok-banner {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 16px;
  background: rgba(74,222,128,.06);
  border: 1px solid rgba(74,222,128,.15);
  border-radius: 12px;
  font-family: 'JetBrains Mono', monospace;
  font-size: .74rem; color: var(--green);
}
.all-ok-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 5px rgba(74,222,128,.5); flex-shrink: 0; }

/* ── Uptime grid (monitoring.html) ───────────────────────── */
.uptime-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 6px;
}
.uptime-group-label {
  font-size: .58rem; font-weight: 600;
  letter-spacing: .20em; text-transform: uppercase;
  color: rgba(223,242,232,.20);
  margin-bottom: 8px; margin-top: 4px;
  display: flex; align-items: center; gap: 12px;
}
.uptime-group-label::after { content: ''; flex: 1; height: 1px; background: rgba(255,255,255,.05); }

.uptime-item {
  display: flex; flex-direction: column; gap: 8px;
  padding: 12px 14px;
  background: rgba(255,255,255,.026);
  border: 1px solid rgba(255,255,255,.068);
  border-radius: 12px;
}
.uptime-item.down { border-color: rgba(248,113,113,.25); background: rgba(248,113,113,.04); }
.uptime-body { display: flex; flex-direction: column; gap: 5px; }
.uptime-top { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.uptime-name { font-family: 'Inter', sans-serif; font-size: .76rem; font-weight: 500; color: rgba(223,242,232,.78); }
.uptime-ping { font-family: 'JetBrains Mono', monospace; font-size: .60rem; color: rgba(223,242,232,.36); }
.uptime-bars { display: flex; gap: 2px; align-items: flex-end; height: 16px; }
.uptime-bar { width: 4px; border-radius: 2px; flex-shrink: 0; }
.uptime-bar.up      { background: rgba(74,222,128,.55); }
.uptime-bar.down-bar{ background: rgba(248,113,113,.70); }
.uptime-bar.unknown { background: rgba(255,255,255,.12); }

/* ── History list (monitoring.html) ──────────────────────── */
.history-list { display: flex; flex-direction: column; gap: 6px; }
.history-item {
  padding: 12px 16px;
  background: rgba(255,255,255,.026);
  border: 1px solid rgba(255,255,255,.068);
  border-radius: 12px;
  display: flex; flex-direction: column; gap: 5px;
}
.history-svc { font-family: 'JetBrains Mono', monospace; font-size: .60rem; letter-spacing: .06em; text-transform: uppercase; color: rgba(223,242,232,.30); }
.history-title { font-family: 'Inter', sans-serif; font-size: .80rem; font-weight: 500; color: rgba(223,242,232,.76); }
.history-meta { display: flex; gap: 14px; flex-wrap: wrap; font-family: 'JetBrains Mono', monospace; font-size: .62rem; color: rgba(223,242,232,.30); }
.history-resolved { color: var(--green); }

/* ── Glass card ──────────────────────────────────────────── */
.card { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; display: flex; flex-direction: column; }
.card-header { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid rgba(255,255,255,.04); flex-shrink: 0; }
.card-title { font-family: 'JetBrains Mono', monospace; font-size: .63rem; text-transform: uppercase; letter-spacing: .12em; color: var(--text-subtle); display: flex; align-items: center; gap: 8px; }
.card-title .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.card-body { padding: 18px; display: flex; flex-direction: column; gap: 10px; }
.card-body.scrollable { max-height: 420px; overflow-y: auto; scrollbar-width: none; }
.card-body.scrollable::-webkit-scrollbar { display: none; }

/* ── Stats pills ─────────────────────────────────────────── */
.stats-row { display: flex; gap: 8px; flex-wrap: wrap; }
.stat-pill { display: flex; align-items: center; gap: 6px; padding: 6px 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 100px; font-family: 'JetBrains Mono', monospace; font-size: .68rem; letter-spacing: .06em; }
.stat-pill .stat-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.stat-pill.incident   { border-color: rgba(248,113,113,.22); }
.stat-pill.incident .stat-dot { background: var(--red); box-shadow: 0 0 6px rgba(248,113,113,.5); animation: pulse 2.5s ease-in-out infinite; }
.stat-pill.incident .stat-num { color: var(--red); }
.stat-pill.advisory   { border-color: rgba(251,191,36,.22); }
.stat-pill.advisory .stat-dot { background: var(--yellow); box-shadow: 0 0 6px rgba(251,191,36,.4); }
.stat-pill.advisory .stat-num { color: var(--yellow); }
.stat-pill.healthy .stat-dot  { background: var(--green); box-shadow: 0 0 6px rgba(52,211,153,.4); }
.stat-pill.healthy .stat-num  { color: var(--green); }
.stat-num { font-weight: 600; }
.stat-lbl { color: var(--text-subtle); }

/* ── Issue components ────────────────────────────────────── */
.issues-stack { display: flex; flex-direction: column; }
.issues-stack .issue-detail { padding: 16px; border-bottom: 1px solid rgba(255,255,255,.04); }
.issues-stack .issue-detail:last-child { border-bottom: none; }
.issue-detail  { display: flex; flex-direction: column; gap: 10px; }
.issue-badge   { display: inline-flex; align-items: center; gap: 5px; font-family: 'JetBrains Mono', monospace; font-size: .62rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; padding: 3px 10px; border-radius: 100px; }
.issue-badge.incident { background: rgba(248,113,113,.10); color: var(--red);    border: 1px solid rgba(248,113,113,.25); }
.issue-badge.advisory { background: rgba(251,191,36,.10);  color: var(--yellow); border: 1px solid rgba(251,191,36,.25); }
.issue-service     { font-family: 'JetBrains Mono', monospace; font-size: .68rem; color: var(--accent); text-transform: uppercase; letter-spacing: .06em; }
.issue-title       { font-family: 'JetBrains Mono', monospace; font-size: .90rem; font-weight: 600; color: var(--text); line-height: 1.4; }
.issue-description { font-family: 'JetBrains Mono', monospace; font-size: .78rem; color: var(--text-subtle); line-height: 1.65; }
.issue-meta        { display: flex; flex-wrap: wrap; gap: 16px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.04); flex-shrink: 0; }
.meta-item         { display: flex; flex-direction: column; gap: 2px; }
.meta-label        { font-family: 'JetBrains Mono', monospace; font-size: .55rem; text-transform: uppercase; letter-spacing: .1em; color: var(--text-subtle); opacity: .7; }
.meta-value        { font-family: 'JetBrains Mono', monospace; font-size: .70rem; color: var(--text-muted); }
.issue-list        { display: flex; flex-direction: column; gap: 6px; }
.issue-item        { display: flex; align-items: flex-start; gap: 8px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; cursor: pointer; transition: all .2s; }
.issue-item:hover                { background: var(--surface-hover); border-color: var(--border-hover); }
.issue-item.active               { background: rgba(167,139,250,.06); border-color: rgba(167,139,250,.28); }
.issue-item.incident-item.active { background: rgba(248,113,113,.05); border-color: rgba(248,113,113,.22); }
.item-dot          { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; margin-top: 4px; }
.item-dot.incident { background: var(--red);    box-shadow: 0 0 5px rgba(248,113,113,.5); animation: pulse 2.5s ease-in-out infinite; }
.item-dot.advisory { background: var(--yellow); box-shadow: 0 0 5px rgba(251,191,36,.38); }
.item-info    { flex: 1; min-width: 0; }
.item-service { font-family: 'JetBrains Mono', monospace; font-size: .58rem; color: var(--text-subtle); text-transform: uppercase; letter-spacing: .04em; }
.item-name    { font-family: 'JetBrains Mono', monospace; font-size: .72rem; color: var(--text-muted); line-height: 1.3; }

/* ── Loading / empty states ──────────────────────────────── */
.state-center  { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center; }
.spinner       { width: 24px; height: 24px; border: 2px solid rgba(255,255,255,.08); border-top-color: var(--accent); border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.state-text    { font-family: 'JetBrains Mono', monospace; font-size: .70rem; color: var(--text-subtle); }
.state-icon    { font-size: 2rem; color: var(--accent); }
.news-loading  { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 60px 0; }
.news-empty    { padding: 40px 0; font-family: 'JetBrains Mono', monospace; font-size: .70rem; color: var(--text-subtle); opacity: .4; text-align: center; }
.show-more-btn { background: transparent; border: 1px solid var(--border); color: var(--text-subtle); font-family: 'JetBrains Mono', monospace; font-size: .68rem; padding: 7px 20px; border-radius: 100px; cursor: pointer; display: block; margin: 0 auto; transition: border-color .2s, color .2s; }
.show-more-btn:hover { border-color: var(--accent); color: var(--accent); }

/* ── Tools page layout ───────────────────────────────────── */
.tools-section { display: flex; flex-direction: column; gap: 14px; }
.tools-twin {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
  align-items: start;
}
@media (max-width: 680px) { .tools-twin { grid-template-columns: 1fr; } }
.tool-card-label {
  font-size: .62rem; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase; color: var(--text-subtle);
  padding-bottom: 4px;
}

/* ── Domain tool card ────────────────────────────────────── */
.domain-tool-card { display: flex; flex-direction: column; gap: 16px; padding: 16px 20px; }
.tool-group       { display: flex; flex-direction: column; gap: 8px; }
.tool-group-label { font-size: .58rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--text-subtle); }
.tool-chips       { display: flex; flex-wrap: wrap; gap: 5px; }
.ip-info-twin     { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: start; }
.ip-info-chips    { flex-direction: column; flex-wrap: nowrap; align-items: flex-start; }
#sourceCard       { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; min-height: 48px; }
@media (max-width: 680px) { .ip-info-twin { grid-template-columns: 1fr; } .ip-info-chips { flex-direction: row; } }
.tool-chip { padding: 5px 12px; border-radius: 100px; font-family: 'JetBrains Mono', monospace; font-size: .70rem; font-weight: 500; color: var(--text-muted); background: var(--surface); border: 1px solid var(--border); cursor: pointer; transition: background .13s, border-color .13s, color .13s; letter-spacing: .02em; }
.tool-chip:hover  { background: var(--surface-hover); border-color: var(--border-hover); color: var(--text); }
.tool-chip.active { color: var(--accent); border-color: rgba(110,231,183,.32); background: rgba(110,231,183,.06); }
.tool-chip-accent { color: var(--accent) !important; border-color: rgba(110,231,183,.22) !important; }
.tool-chip-accent:hover { background: rgba(110,231,183,.08) !important; border-color: rgba(110,231,183,.40) !important; }

/* ── Subnet bento result ─────────────────────────────────── */
.subnet-bento { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 6px; }
.subnet-cell  { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 4px; }
.subnet-cell.hl { border-color: rgba(110,231,183,.22); }
.subnet-cell-label { font-size: .55rem; letter-spacing: .14em; text-transform: uppercase; color: var(--text-subtle); }
.subnet-cell-value { font-family: 'JetBrains Mono', monospace; font-size: .74rem; color: var(--text); }
.subnet-cell-value.dim { color: var(--text-muted); }
.subnet-hosts-grid { display: flex; flex-wrap: wrap; gap: 6px; max-height: 280px; overflow-y: auto; padding: 2px 0; }
.subnet-host-ip    { font-family: 'JetBrains Mono', monospace; font-size: .70rem; color: var(--text-muted); background: var(--surface); border: 1px solid var(--border); border-radius: 6px; padding: 3px 8px; }
.prop-grid         { display: flex; flex-direction: column; gap: 0; margin-top: 8px; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.prop-row          { display: grid; grid-template-columns: 88px 1fr auto; align-items: baseline; gap: 10px; padding: 7px 12px; border-bottom: 1px solid rgba(255,255,255,.04); font-family: 'JetBrains Mono', monospace; font-size: .72rem; }
.prop-row:last-child { border-bottom: none; }
.prop-name         { color: var(--text-subtle); font-size: .64rem; letter-spacing: .04em; white-space: nowrap; }
.prop-val          { color: var(--text-muted); word-break: break-all; line-height: 1.6; }
.prop-odd          { background: rgba(251,191,36,.04); }
.prop-odd .prop-val { color: #fbbf24; }
.prop-err          { opacity: .45; }

/* ── SSL expiry badge ────────────────────────────────────── */
.ssl-expiry { font-family: 'JetBrains Mono', monospace; font-size: 1.6rem; font-weight: 600; line-height: 1; }
.ssl-expiry.ok   { color: var(--green); }
.ssl-expiry.warn { color: var(--yellow); }
.ssl-expiry.err  { color: var(--red); }


/* ── Tool inputs ─────────────────────────────────────────── */
.tool-input-wrap { display: flex; flex-direction: column; gap: 8px; }
.tool-input-row  { display: flex; gap: 8px; }
.tool-input { flex: 1; padding: 11px 16px; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; color: var(--text); font-family: 'JetBrains Mono', monospace; font-size: .80rem; outline: none; transition: border-color .15s; min-width: 0; }
.tool-input:focus        { border-color: var(--accent); }
.tool-input::placeholder { color: var(--text-subtle); }
.tool-select { padding: 11px 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; color: var(--text-muted); font-family: 'JetBrains Mono', monospace; font-size: .80rem; outline: none; cursor: pointer; transition: border-color .15s; }
.tool-select:focus { border-color: var(--accent); }
.tool-select option { background: #0a0a0a; color: var(--text); }
.tool-btn { padding: 11px 20px; background: rgba(167,139,250,.08); border: 1px solid rgba(167,139,250,.24); border-radius: 10px; color: var(--accent); font-family: 'JetBrains Mono', monospace; font-size: .80rem; cursor: pointer; transition: all .15s; white-space: nowrap; }
.tool-btn:hover    { background: rgba(167,139,250,.16); border-color: rgba(167,139,250,.42); }
.tool-btn:disabled { opacity: .4; cursor: not-allowed; }
.extra-row         { display: none; gap: 8px; }
.extra-row.visible { display: flex; }

/* ── Result card ─────────────────────────────────────────── */
.result-wrap         { position: relative; display: none; }
.result-wrap.visible { display: block; }
.result-card { font-family: 'JetBrains Mono', monospace; font-size: .78rem; color: var(--text-muted); padding: 18px; padding-right: 58px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; line-height: 1.7; }
.result-card .result-card { background: rgba(167,139,250,.04); border-color: rgba(167,139,250,.10); }
.result-copy { position: absolute; top: 10px; right: 10px; background: var(--surface-hover); border: 1px solid var(--border); border-radius: 7px; color: var(--text-subtle); font-family: 'JetBrains Mono', monospace; font-size: .66rem; padding: 4px 10px; cursor: pointer; transition: all .15s; }
.result-copy:hover, .result-copy.copied { color: var(--accent); border-color: var(--accent); }

/* ── DNS (compat) ────────────────────────────────────────── */
.dns-section { display: flex; flex-direction: column; gap: 8px; }
.dns-tool    { display: flex; gap: 8px; }
.dns-input { flex: 1; padding: 11px 16px; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; color: var(--text); font-family: 'JetBrains Mono', monospace; font-size: .80rem; outline: none; transition: border-color .15s; }
.dns-input:focus        { border-color: var(--accent); }
.dns-input::placeholder { color: var(--text-subtle); }
.dns-btn { padding: 11px 16px; background: rgba(167,139,250,.08); border: 1px solid rgba(167,139,250,.24); border-radius: 10px; color: var(--accent); font-family: 'JetBrains Mono', monospace; font-size: .80rem; cursor: pointer; transition: all .15s; }
.dns-btn:hover { background: rgba(167,139,250,.16); border-color: rgba(167,139,250,.42); }
.dns-result-wrap        { position: relative; display: none; }
.dns-result-wrap.visible { display: block; }
.dns-result { font-family: 'JetBrains Mono', monospace; font-size: .78rem; color: var(--text-muted); padding: 16px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; }
.dns-host   { color: var(--text); margin-bottom: 12px; word-break: break-all; }
.dns-type-block { margin-top: 8px; }
.dns-type-block:first-of-type { margin-top: 0; }
.dns-type-label  { color: var(--text-subtle); font-size: .66rem; margin-bottom: 4px; letter-spacing: .05em; }
.dns-resolver    { display: flex; flex-direction: column; gap: 4px; }
.dns-row         { display: flex; gap: 12px; align-items: baseline; }
.dns-row-name    { color: var(--text-subtle); width: 80px; flex-shrink: 0; }
.dns-row-data           { word-break: break-all; }
.dns-row-data.match     { color: var(--green); }
.dns-row-data.mismatch  { color: var(--red); }
.dns-copy { position: absolute; top: 10px; right: 10px; background: var(--surface-hover); border: 1px solid var(--border); border-radius: 7px; color: var(--text-subtle); font-family: 'JetBrains Mono', monospace; font-size: .66rem; padding: 4px 10px; cursor: pointer; transition: all .15s; }
.dns-copy:hover, .dns-copy.copied { color: var(--accent); border-color: var(--accent); }

/* ── Result elements ─────────────────────────────────────── */
.res-host    { color: var(--text); margin-bottom: 16px; font-size: .90rem; word-break: break-all; }
.res-section { margin-bottom: 16px; }
.res-section:last-child { margin-bottom: 0; }
.res-label   { font-size: .66rem; color: var(--text-subtle); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 8px; display: flex; align-items: center; gap: 8px; }
.res-divider { border: none; border-top: 1px solid var(--border); margin: 14px 0; }
.check-row            { display: flex; align-items: baseline; gap: 12px; padding: 5px 0; border-bottom: 1px solid rgba(255,255,255,.04); }
.check-row:last-child { border-bottom: none; }
.check-name  { color: var(--text-muted); min-width: 160px; flex-shrink: 0; font-size: .78rem; }
.check-value { color: var(--text-subtle); flex: 1; word-break: break-all; font-size: .78rem; }
.rec-row    { display: flex; gap: 8px; align-items: baseline; padding: 3px 0; }
.rec-prio   { color: var(--text-subtle); min-width: 32px; text-align: right; font-size: .66rem; }
.rec-val    { color: var(--text-muted); word-break: break-all; flex: 1; }
.chain-step  { display: flex; align-items: center; gap: 8px; padding: 4px 0; color: var(--text-muted); }
.chain-arrow { color: var(--text-subtle); }
.res-loading { color: var(--text-subtle); font-size: .78rem; display: flex; align-items: center; gap: 8px; }
.res-loading::before { content: ''; display: inline-block; width: 10px; height: 10px; border: 1.5px solid rgba(255,255,255,.10); border-top-color: var(--accent); border-radius: 50%; animation: spin .8s linear infinite; }

/* ── Badges ──────────────────────────────────────────────── */
.badge { display: inline-block; padding: 1px 8px; border-radius: 100px; font-size: .66rem; font-weight: 500; letter-spacing: .05em; white-space: nowrap; flex-shrink: 0; }
.badge.ok   { background: rgba(52,211,153,.10);  color: var(--green);       border: 1px solid rgba(52,211,153,.25); }
.badge.err  { background: rgba(248,113,113,.10); color: var(--red);         border: 1px solid rgba(248,113,113,.25); }
.badge.warn { background: rgba(251,191,36,.10);  color: var(--yellow);      border: 1px solid rgba(251,191,36,.25); }
.badge.info { background: rgba(255,255,255,.05); color: var(--text-subtle); border: 1px solid var(--border); }

/* ── Score bar ───────────────────────────────────────────── */
.score-wrap      { display: flex; align-items: center; gap: 12px; margin-top: 16px; }
.score-bar       { flex: 1; height: 3px; background: rgba(255,255,255,.06); border-radius: 2px; overflow: hidden; }
.score-bar-lg    { height: 5px; }
.score-fill      { height: 100%; border-radius: 2px; background: var(--accent); transition: width .6s ease; }
.score-fill.warn { background: var(--yellow); }
.score-fill.err  { background: var(--red); }
.score-label     { font-size: .66rem; color: var(--text-subtle); white-space: nowrap; }

/* ── Full-check sub-scores ───────────────────────────────── */
.subscore-row  { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin: 10px 0 4px; }
.subscore      { display: flex; flex-direction: column; gap: 5px; }
.subscore-label{ font-size: .60rem; text-transform: uppercase; letter-spacing: .12em; color: var(--text-subtle); }
.subscore-pts  { font-size: .64rem; color: var(--text-muted); text-align: right; }
.score-total-wrap { display: flex; align-items: center; gap: 12px; margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.06); }
.score-total-num  { font-size: .72rem; font-weight: 600; color: var(--text); white-space: nowrap; }

/* ── Blacklist / WHOIS ───────────────────────────────────── */
.bl-row            { display: flex; align-items: center; gap: 12px; padding: 4px 0; border-bottom: 1px solid rgba(255,255,255,.04); }
.bl-row:last-child { border-bottom: none; }
.bl-name           { flex: 1; color: var(--text-subtle); font-size: .78rem; }
.kv-row            { display: flex; gap: 12px; padding: 4px 0; border-bottom: 1px solid rgba(255,255,255,.04); }
.kv-row:last-child { border-bottom: none; }
.kv-key  { color: var(--text-subtle); min-width: 130px; flex-shrink: 0; font-size: .78rem; }
.kv-val  { color: var(--text-muted); word-break: break-all; font-size: .78rem; }
.sec-rec            { display: flex; gap: 10px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,.04); align-items: flex-start; }
.sec-rec:last-child { border-bottom: none; }
.sec-rec-icon       { font-size: .78rem; flex-shrink: 0; margin-top: 2px; }
.sec-rec-text       { font-size: .78rem; color: var(--text-subtle); line-height: 1.5; }
.sec-rec-text strong { color: var(--text-muted); }

/* ── Source grid ─────────────────────────────────────────── */
.source-grid { display: grid; grid-template-columns: 120px 1fr; gap: 0; font-family: 'JetBrains Mono', monospace; font-size: .78rem; }
.src-key     { color: var(--text-subtle); font-size: .66rem; letter-spacing: .06em; padding: 5px 12px 5px 0; border-bottom: 1px solid rgba(255,255,255,.04); align-self: center; }
.src-val     { color: var(--text-muted); padding: 5px 0; border-bottom: 1px solid rgba(255,255,255,.04); word-break: break-all; }
.src-key:last-of-type, .src-val:last-of-type { border-bottom: none; }
.src-loading { opacity: .4; }
.src-divider       { grid-column: 1/-1; border: none; border-top: 1px solid var(--border); margin: 10px 0; }
.src-section-label { grid-column: 1/-1; font-size: .66rem; color: var(--text-subtle); text-transform: uppercase; letter-spacing: .1em; padding-bottom: 4px; }

/* ── News / Articles ─────────────────────────────────────── */
.search-row  { display: flex; align-items: center; gap: 10px; }
.news-search { flex: 1; padding: 10px 16px; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; color: var(--text); font-family: 'JetBrains Mono', monospace; font-size: .78rem; outline: none; transition: border-color .15s; }
.news-search:focus        { border-color: var(--accent); }
.news-search::placeholder { color: var(--text-subtle); }
.refresh-label { font-family: 'JetBrains Mono', monospace; font-size: .58rem; color: var(--text-subtle); opacity: .5; white-space: nowrap; flex-shrink: 0; }
.source-row    { display: flex; align-items: center; gap: 10px; }
.source-select {
  padding: 7px 14px; background: var(--surface); border: 1px solid var(--border);
  border-radius: 100px; color: var(--text-subtle);
  font-family: 'JetBrains Mono', monospace; font-size: .68rem; font-weight: 500;
  letter-spacing: .06em; cursor: pointer; transition: all .15s;
  outline: none; appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23a78bfa' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; padding-right: 30px;
}
.source-select:hover  { color: var(--text-muted); border-color: var(--border-hover); }
.source-select:focus  { border-color: var(--accent); color: var(--accent); }
.source-select option { background: #0a0a0a; color: var(--text-subtle); }
.article-list { display: flex; flex-direction: column; gap: 6px; }

.a-card { display: flex; flex-direction: column; gap: 6px; background: var(--surface); border: 1px solid var(--border); border-left: 3px solid transparent; border-radius: 10px; text-decoration: none; padding: 14px 16px; transition: border-color .15s, background .15s; }
.a-card:hover              { background: var(--surface-hover); border-color: var(--border-hover); }
.a-card.tag-microsoft      { border-left-color: var(--accent); }
.a-card.tag-security       { border-left-color: var(--red); }
.a-card.tag-homelab        { border-left-color: var(--orange); }
.a-card.tag-reddit         { border-left-color: var(--yellow); }
.a-card.tag-msfeed         { border-left-color: rgba(167,139,250,.45); }
.a-card.tag-msfeed-action  { border-left-color: var(--yellow); }
.a-card.tag-msfeed-fix     { border-left-color: var(--red); }
.a-top   { display: flex; align-items: center; gap: 8px; min-width: 0; }
.a-badge { font-family: 'JetBrains Mono', monospace; font-size: .55rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; padding: 2px 7px; border-radius: 100px; flex-shrink: 0; white-space: nowrap; }
.a-badge.microsoft { background: rgba(167,139,250,.10); color: var(--accent);  border: 1px solid rgba(167,139,250,.20); }
.a-badge.reddit    { background: rgba(251,191,36,.08);  color: var(--yellow); border: 1px solid rgba(251,191,36,.20); }
.a-badge.security  { background: rgba(248,113,113,.08); color: var(--red);    border: 1px solid rgba(248,113,113,.20); }
.a-badge.homelab   { background: rgba(251,146,60,.08);  color: var(--orange); border: 1px solid rgba(251,146,60,.20); }
.a-badge.action    { background: rgba(251,191,36,.10);  color: var(--yellow); border: 1px solid rgba(251,191,36,.22); }
.a-badge.info      { background: rgba(167,139,250,.10); color: var(--accent); border: 1px solid rgba(167,139,250,.22); }
.a-badge.fix       { background: rgba(248,113,113,.10); color: var(--red);    border: 1px solid rgba(248,113,113,.22); }
.a-source  { font-family: 'JetBrains Mono', monospace; font-size: .58rem; color: var(--text-subtle); opacity: .7; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.a-time    { font-family: 'JetBrains Mono', monospace; font-size: .56rem; color: var(--text-subtle); opacity: .4; flex-shrink: 0; margin-left: auto; }
.a-title   { font-family: 'Inter', -apple-system, sans-serif; font-size: .82rem; font-weight: 600; color: var(--text); line-height: 1.4; letter-spacing: -.01em; }
.a-excerpt { font-family: 'Inter', -apple-system, sans-serif; font-size: .70rem; color: var(--text-subtle); line-height: 1.65; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* Entra / Roadmap cards */
.entra-card { display: flex; flex-direction: column; gap: 5px; background: var(--surface); border: 1px solid var(--border); border-left: 3px solid transparent; border-radius: 10px; text-decoration: none; padding: 12px 16px; transition: border-color .15s, background .15s; color: inherit; }
.entra-card:hover    { background: var(--surface-hover); border-color: var(--border-hover); }
.entra-card.retiring { border-left-color: var(--red); }
.entra-card.breaking { border-left-color: var(--red); border-color: rgba(248,113,113,.20); }
.entra-card.preview  { border-left-color: var(--cyan); }
.entra-card.new      { border-left-color: var(--accent); }
.e-badge          { font-family: 'JetBrains Mono', monospace; font-size: .55rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: 2px 7px; border-radius: 100px; flex-shrink: 0; }
.e-badge.retiring { background: rgba(248,113,113,.14); color: var(--red);    border: 1px solid rgba(248,113,113,.30); }
.e-badge.breaking { background: rgba(248,113,113,.22); color: var(--red);    border: 1px solid rgba(248,113,113,.45); }
.e-badge.preview  { background: rgba(34,211,238,.10);  color: var(--cyan);   border: 1px solid rgba(34,211,238,.25); }
.e-badge.new      { background: rgba(167,139,250,.08); color: var(--accent); border: 1px solid rgba(167,139,250,.20); }
.rm-badge          { font-family: 'JetBrains Mono', monospace; font-size: .55rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: 2px 7px; border-radius: 100px; flex-shrink: 0; }
.rm-badge.launched { background: rgba(52,211,153,.12);  color: var(--green);  border: 1px solid rgba(52,211,153,.25); }
.rm-badge.rolling  { background: rgba(34,211,238,.10);  color: var(--cyan);   border: 1px solid rgba(34,211,238,.25); }
.rm-badge.dev      { background: rgba(251,191,36,.10);  color: var(--yellow); border: 1px solid rgba(251,191,36,.25); }

/* ── CVE ─────────────────────────────────────────────────── */
.cve-list { display: flex; flex-direction: column; gap: 6px; }
.cve-card { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 10px 14px; display: grid; grid-template-columns: auto 1fr auto; grid-template-rows: auto auto auto; column-gap: 12px; row-gap: 2px; text-decoration: none; color: inherit; transition: border-color .15s; }
.cve-card:hover          { border-color: var(--border-hover); }
.cve-card.cve-kev        { border-color: rgba(251,191,36,.22); }
.cve-card.cve-ransomware { border-color: rgba(248,113,113,.45); animation: cvePulse 2.4s ease-in-out infinite; }
@keyframes cvePulse { 0%,100%{border-color:rgba(248,113,113,.45)} 50%{border-color:rgba(248,113,113,.80);box-shadow:0 0 8px 2px rgba(248,113,113,.10)} }
.cve-kev-badge { grid-row:1/4; grid-column:1; align-self:center; font-family:'JetBrains Mono',monospace; font-size:.52rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; padding:3px 6px; border-radius:6px; white-space:nowrap; background:rgba(251,191,36,.10); color:var(--yellow); border:1px solid rgba(251,191,36,.22); }
.cve-card.cve-ransomware .cve-kev-badge { background:rgba(248,113,113,.14); color:var(--red); border-color:rgba(248,113,113,.35); }
.cve-id     { grid-column:2; grid-row:1; font-family:'JetBrains Mono',monospace; font-size:.76rem; font-weight:600; color:var(--accent); align-self:end; }
.cve-card.cve-ransomware .cve-id { color:var(--red); }
.cve-date   { grid-column:3; grid-row:1; font-family:'JetBrains Mono',monospace; font-size:.58rem; color:var(--text-subtle); opacity:.5; text-align:right; align-self:end; white-space:nowrap; }
.cve-vendor { grid-column:2/4; grid-row:2; font-family:'JetBrains Mono',monospace; font-size:.60rem; color:var(--text-muted); }
.cve-desc   { grid-column:2/4; grid-row:3; font-family:'JetBrains Mono',monospace; font-size:.63rem; color:var(--text-subtle); line-height:1.5; }
.cve-score          { font-family:'JetBrains Mono',monospace; font-size:.58rem; font-weight:700; padding:2px 6px; border-radius:4px; white-space:nowrap; }
.cve-score.critical { background:rgba(248,113,113,.14); color:var(--red);    border:1px solid rgba(248,113,113,.25); }
.cve-score.high     { background:rgba(251,191,36,.12);  color:var(--yellow); border:1px solid rgba(251,191,36,.22); }
.cve-badge-count    { font-size:.58rem; padding:2px 7px; border-radius:100px; background:rgba(248,113,113,.14); color:var(--red); border:1px solid rgba(248,113,113,.22); margin-left:4px; }
.cve-state          { font-family:'JetBrains Mono',monospace; font-size:.70rem; color:var(--text-subtle); padding:20px 0; text-align:center; }
.cve-state.cve-error { color:var(--red); }
.cve-filter-row      { display:flex; gap:6px; flex-wrap:wrap; }
.cve-filter-pill     { padding:5px 12px; background:var(--surface); border:1px solid var(--border); border-radius:100px; color:var(--text-subtle); font-family:'JetBrains Mono',monospace; font-size:.63rem; font-weight:500; letter-spacing:.05em; cursor:pointer; transition:all .15s; }
.cve-filter-pill:hover  { color:var(--text-muted); border-color:var(--border-hover); }
.cve-filter-pill.active { background:rgba(167,139,250,.10); border-color:rgba(167,139,250,.38); color:var(--accent); }
.cve-status              { font-family:'JetBrains Mono',monospace; font-size:.55rem; font-weight:700; padding:2px 7px; border-radius:4px; white-space:nowrap; letter-spacing:.06em; flex-shrink:0; }
.cve-status.kev            { background:rgba(248,113,113,.16); color:var(--red);    border:1px solid rgba(248,113,113,.35); }
.cve-status.kev-ransomware { background:rgba(248,113,113,.24); color:var(--red);    border:1px solid rgba(248,113,113,.55); }
.cve-status.weaponized     { background:rgba(251,146,60,.14);  color:var(--orange); border:1px solid rgba(251,146,60,.30); }
.cve-status.watch          { background:rgba(251,191,36,.10);  color:var(--yellow); border:1px solid rgba(251,191,36,.22); }
.cve-status.new            { background:rgba(255,255,255,.04); color:var(--text-subtle); border:1px solid var(--border); }
.epss-bar-wrap { display:flex; align-items:center; gap:6px; margin-top:3px; }
.epss-bar      { height:2px; border-radius:1px; flex:1; background:rgba(255,255,255,.06); }
.epss-fill     { height:100%; border-radius:1px; transition:width .4s ease; }
.epss-label    { font-family:'JetBrains Mono',monospace; font-size:.55rem; color:var(--text-subtle); opacity:.6; white-space:nowrap; }
.cve-card.intel { grid-template-columns:auto 1fr auto; grid-template-rows:auto auto auto auto; }
.cve-epss-row   { grid-column:2/4; grid-row:4; }

/* ── Tab bar (news) ──────────────────────────────────────── */
.tab-bar { display:flex; gap:0; border-bottom:1px solid rgba(255,255,255,.05); margin:0 -28px; padding:0 28px; flex-shrink:0; }
.tab-btn { font-family:'JetBrains Mono',monospace; font-size:.72rem; font-weight:500; letter-spacing:.06em; padding:10px 16px; color:var(--text-subtle); background:none; border:none; border-bottom:2px solid transparent; cursor:pointer; transition:color .15s,border-color .15s; white-space:nowrap; position:relative; }
.tab-btn:hover  { color:var(--text-muted); }
.tab-btn.active { color:var(--accent); border-bottom-color:var(--accent); }
.tab-btn .tab-count { font-size:.52rem; padding:1px 5px; border-radius:100px; margin-left:5px; background:rgba(167,139,250,.12); color:var(--accent); border:1px solid rgba(167,139,250,.22); display:none; }
.tab-btn.active .tab-count { display:inline; }
.tab-panel        { display:none; flex-direction:column; gap:8px; flex:1; min-height:0; }
.tab-panel.active { display:flex; }

/* ── Top stories ─────────────────────────────────────────── */
.top-stories         { display:none; flex-direction:column; gap:5px; padding:10px 0; border-bottom:1px solid rgba(255,255,255,.04); }
.top-stories.visible { display:flex; }
.ts-row  { display:flex; align-items:center; gap:8px; padding:6px 10px; background:var(--surface); border:1px solid var(--border); border-left:3px solid transparent; border-radius:8px; text-decoration:none; color:inherit; transition:border-color .15s; }
.ts-row:hover    { background:var(--surface-hover); }
.ts-row.retiring { border-left-color:var(--red);    border-color:rgba(248,113,113,.18); }
.ts-row.breaking { border-left-color:var(--red);    border-color:rgba(248,113,113,.18); }
.ts-row.action   { border-left-color:var(--yellow); border-color:rgba(251,191,36,.14); }
.ts-title        { flex:1; font-family:'Inter',-apple-system,sans-serif; font-size:.76rem; font-weight:600; color:var(--text); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ts-dead         { font-family:'JetBrains Mono',monospace; font-size:.58rem; font-weight:700; flex-shrink:0; white-space:nowrap; }
.ts-dead.urgent  { color:var(--red); }
.ts-dead.plan    { color:var(--yellow); }

/* ── Easter egg overlay ──────────────────────────────────── */
#logoOverlay { position:fixed; inset:0; background:rgba(0,0,0,.78); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); display:flex; flex-direction:column; align-items:center; justify-content:center; z-index:9999; opacity:0; pointer-events:none; transition:opacity .5s ease; }
#logoOverlay.visible { opacity:1; pointer-events:all; }
#logoOverlay.hiding  { opacity:0; }
.overlay-text { font-family:'JetBrains Mono',monospace; font-size:clamp(36px,12vw,180px); font-weight:700; letter-spacing:.1em; color:var(--text); user-select:none; }
.overlay-sub  { font-family:'JetBrains Mono',monospace; font-size:clamp(11px,3vw,16px); letter-spacing:.3em; color:var(--text-subtle); margin-top:24px; opacity:.5; user-select:none; }

/* ── Light theme ─────────────────────────────────────────── */
html.light {
  background-image:
    linear-gradient(rgba(236,246,238,.84), rgba(236,246,238,.84)),
    url('forest.jpg');
}
body.light {
  --surface:       rgba(0,0,0,0.040);
  --surface-hover: rgba(0,0,0,0.065);
  --border:        rgba(0,0,0,0.098);
  --border-hover:  rgba(0,0,0,0.175);
  --text:          #1a2e1d;
  --text-muted:    rgba(26,46,29,0.72);
  --text-subtle:   rgba(26,46,29,0.38);
  --accent:        #047857;
  color: rgba(26,46,29,0.72);
}
body.light .aurora::before { background: radial-gradient(circle, rgba(16,185,129,.10) 0%, transparent 58%); }
body.light .aurora::after  { background: radial-gradient(ellipse at center, rgba(52,211,153,.07) 0%, transparent 60%); }
body.light .cursor-glow    { background: radial-gradient(circle, rgba(4,120,87,.06) 0%, transparent 65%); }
body.light body::before    { background-image: radial-gradient(rgba(5,105,70,.025) 1px, transparent 1px); }
body.light .navbar-inner   { background: rgba(240,248,241,.88); border-color: rgba(4,120,87,.14); box-shadow: 0 4px 28px rgba(0,0,0,.12), inset 0 1px 0 rgba(4,120,87,.05); }
body.light .navbar-links a { color: rgba(26,46,29,.42); }
body.light .navbar-links a:hover  { color: rgba(26,46,29,.82); background: rgba(4,120,87,.07); }
body.light .navbar-links a.active { color: rgba(26,46,29,.96); background: rgba(4,120,87,.12); }
body.light .logo           { color: #1a2e1d; }

/* light: section labels */
body.light .section-label         { color: rgba(26,46,29,.38); }
body.light .section-label::after  { background: rgba(0,0,0,.08); }

/* light: bento link cards */
body.light .bento-link-card       { background: rgba(255,255,255,.60); border-color: rgba(0,0,0,.10); }
body.light .bento-link-card:hover { background: rgba(255,255,255,.80); border-color: rgba(4,120,87,.30); }
body.light .bento-name            { color: rgba(26,46,29,.52); }
body.light .bento-link-card:hover .bento-name { color: rgba(26,46,29,.90); }
body.light .bento-icon            { opacity: .75; }
body.light .bento-icon.invert     { filter: invert(0) brightness(1); }
body.light .bento-link-card:hover .bento-icon { opacity: 1; }

/* light: result/tool cards */
body.light .result-card           { background: rgba(255,255,255,.60); border-color: rgba(0,0,0,.10); }
body.light .result-card .result-card { background: rgba(4,120,87,.04); border-color: rgba(4,120,87,.12); }
body.light #sourceCard            { background: rgba(255,255,255,.60); border-color: rgba(0,0,0,.10); }

/* light: spinner */
body.light .res-loading::before   { border-color: rgba(0,0,0,.10); border-top-color: var(--accent); }

/* light: tool chips */
body.light .tool-chip             { background: rgba(255,255,255,.55); border-color: rgba(0,0,0,.12); color: rgba(26,46,29,.60); }
body.light .tool-chip:hover       { background: rgba(255,255,255,.80); border-color: rgba(4,120,87,.28); color: rgba(26,46,29,.90); }
body.light .tool-chip.active      { color: var(--accent); border-color: rgba(4,120,87,.40); background: rgba(4,120,87,.08); }
body.light .tool-chip-accent      { color: var(--accent) !important; border-color: rgba(4,120,87,.30) !important; }

/* light: monitoring bento */
body.light .svc-bento-card        { background: rgba(255,255,255,.60); border-color: rgba(0,0,0,.10); }
body.light .uptime-bar            { background: rgba(0,0,0,.08); }

/* light: subnet cells */
body.light .subnet-cell           { background: rgba(255,255,255,.60); border-color: rgba(0,0,0,.10); }
body.light .subnet-cell.hl        { border-color: rgba(4,120,87,.28); }
body.light .subnet-cell-value     { color: rgba(26,46,29,.80); }
body.light .subnet-cell-value.dim { color: rgba(26,46,29,.45); }

/* light: propagation grid */
body.light .prop-grid             { border-color: rgba(0,0,0,.10); }
body.light .prop-row              { border-bottom-color: rgba(0,0,0,.06); }
body.light .prop-val              { color: rgba(26,46,29,.72); }
body.light .prop-odd              { background: rgba(180,130,0,.06); }
body.light .prop-odd .prop-val    { color: #92620a; }

/* light: news tab bar */
body.light .tab-bar               { border-bottom-color: rgba(0,0,0,.10); }
body.light .tab-btn .tab-count    { background: rgba(4,120,87,.10); border-color: rgba(4,120,87,.22); }

/* light: news article/top-story cards */
body.light .top-stories           { border-bottom-color: rgba(0,0,0,.07); }
body.light .a-card                { background: rgba(255,255,255,.60); border-color: rgba(0,0,0,.10); }
body.light .a-card:hover          { background: rgba(255,255,255,.82); border-color: rgba(0,0,0,.18); }
body.light .ts-row                { background: rgba(255,255,255,.60); border-color: rgba(0,0,0,.10); }
body.light .ts-row:hover          { background: rgba(255,255,255,.82); }
body.light .cve-card              { background: rgba(255,255,255,.60); }
body.light .entra-card            { background: rgba(255,255,255,.60); border-color: rgba(0,0,0,.10); }
body.light .entra-card:hover      { background: rgba(255,255,255,.82); }

/* light: monitoring service cards */
body.light .svc-bento-card                { background: rgba(255,255,255,.60); border-color: rgba(0,0,0,.10); }
body.light .svc-bento-card.has-incident   { background: rgba(248,113,113,.06); }
body.light .svc-bento-card.has-advisory   { background: rgba(251,191,36,.05); }
body.light .uptime-bar.unknown            { background: rgba(0,0,0,.12); }
body.light .history-item                  { background: rgba(255,255,255,.60); border-color: rgba(0,0,0,.10); }

/* ── Theme toggle (fixed bottom-left) ────────────────────── */
.theme-toggle {
  position: fixed; z-index: 200;
  left: 24px; bottom: 28px;
  width: 38px; height: 38px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(6,14,7,.82);
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 50%;
  color: rgba(255,255,255,.82); cursor: pointer;
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 4px 20px rgba(0,0,0,.40);
  transition: background .18s, border-color .18s, transform .25s;
}
.theme-toggle:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.28); transform: translateY(-2px); }
body.light .theme-toggle { background: rgba(255,255,255,.82); border-color: rgba(0,0,0,.14); color: rgba(0,0,0,.72); box-shadow: 0 4px 20px rgba(0,0,0,.12); }
body.light .theme-toggle:hover { background: rgba(0,0,0,.06); border-color: rgba(0,0,0,.22); }
.theme-toggle .theme-text { display: none; }

/* ── Back-to-top ─────────────────────────────────────────── */
.back-to-top {
  position: fixed; z-index: 200;
  right: 24px; bottom: 28px;
  width: 38px; height: 38px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(6,14,7,.82);
  border: 1px solid rgba(110,231,183,.18);
  border-radius: 50%;
  color: var(--accent); cursor: pointer;
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 4px 20px rgba(0,0,0,.40);
  opacity: 0; pointer-events: none;
  transform: translateY(10px);
  transition: opacity .25s, transform .25s;
}
.back-to-top.visible { opacity: 1; pointer-events: all; transform: translateY(0); }
.back-to-top:hover   { background: rgba(110,231,183,.14); border-color: rgba(110,231,183,.35); transform: translateY(-2px); }
body.light .back-to-top { background: rgba(240,248,241,.88); border-color: rgba(4,120,87,.22); color: var(--accent); box-shadow: 0 4px 20px rgba(0,0,0,.14); }
body.light .back-to-top:hover { background: rgba(4,120,87,.10); }

/* ── Hidden / compat elements ────────────────────────────── */
#statusContainer { display:none !important; }
.system-card, .system-header, .system-content, .system-line,
.system-prompt, .system-key, .system-value-inline, .system-separator,
.system-cursor, .system-divider, .system-row, .system-cmd, .system-output,
.system-header-dots, .system-header-dot, .system-header-title,
.system-header-left, .system-header-live, .system-path, .system-stat,
.system-stat-value, .system-stat-label, .system-stat-icon { display: none; }

/* ── Global status (monitoring) ──────────────────────────── */
.global-status { display:flex; align-items:center; gap:10px; font-family:'JetBrains Mono',monospace; font-size:.76rem; padding:12px 18px; background:var(--surface); border:1px solid var(--border); border-radius:10px; transition:all .3s; }
.global-status.loading  { color:var(--text-subtle); }
.global-status.healthy  { color:var(--green);  border-color:rgba(52,211,153,.22); }
.global-status.degraded { color:var(--yellow); border-color:rgba(251,191,36,.22); }
.global-status.incident { color:var(--red);    border-color:rgba(248,113,113,.22); }
.gs-dot  { width:8px; height:8px; border-radius:50%; background:currentColor; flex-shrink:0; }
.gs-main { font-weight:600; }
.update-hint { font-family:'JetBrains Mono',monospace; font-size:.60rem; color:var(--text-subtle); opacity:.5; }
.refresh-btn { font-family:'JetBrains Mono',monospace; font-size:.66rem; padding:5px 12px; background:var(--surface); border:1px solid var(--border); border-radius:7px; color:var(--text-subtle); cursor:pointer; transition:all .15s; display:flex; align-items:center; gap:6px; }
.refresh-btn:hover { color:var(--accent); border-color:rgba(167,139,250,.35); }
.ref-icon { display:inline-block; transition:transform .3s; }
.refresh-btn:hover .ref-icon { transform:rotate(180deg); }

/* ── Footer ──────────────────────────────────────────────── */
footer {
  padding: 28px 0;
  display: flex; justify-content: center; align-items: center;
  flex-shrink: 0; margin-top: auto;
  border-top: 1px solid rgba(255,255,255,.04);
}
.footer-text {
  font-family: 'JetBrains Mono', monospace;
  font-size: .70rem; color: var(--text-subtle);
}

/* ── Shared keyframes ────────────────────────────────────── */
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.4} }

/* ── Mobile ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .navbar         { padding: 12px 16px 0; }
  .navbar-inner   { padding: 0 6px 0 18px; border-radius: 100px; }
  .navbar-links a { height: 34px; padding: 0 10px; font-size: .78rem; }
  .navbar-clock   { display: none; }
  .clock-hero     { padding: 28px 18px 20px; }
  .container      { padding: 0 18px; }
  .tab-bar        { margin: 0 -18px; padding: 0 18px; overflow-x:auto; scrollbar-width:none; }
  .tab-bar::-webkit-scrollbar { display:none; }
  .tab-btn        { font-size:.64rem; padding:8px 10px; }
  .link-grid      { display: none; }
  main            { padding: 18px 0; gap: 24px; }
  .tool-input-row { flex-wrap: wrap; }
  .tool-btn       { width: 100%; }
  .tool-input     { font-size: 16px !important; }
  .check-name     { min-width: 100px; }
  .news-search    { font-size: 16px !important; }
  .refresh-label  { display: none; }
}