/* ============================================================
   CrawlBit app skin v2 — same design language as landing2.css
   (Inter Tight, off-white page, white hairline cards, red accent,
   blue secondary), applied to the app pages that share system.css.
   Scope: everything under body.v2 — pages opt in one at a time
   (account first, then workspace…), legacy paper pages untouched.
   ============================================================ */

body.v2 {
  /* surfaces */
  --bg:#F4F4F4; --bg-2:#ECECEC; --surface-1:#FFFFFF; --surface-2:#F7F7F7; --surface-3:#F0F0F0; --navy:#E3E3E3;
  /* hairlines */
  --line:#E3E3E3; --line-2:#E9E9E9; --line-strong:#D4D4D4;
  /* accent (red) + secondary (blue) + calm semantics */
  --accent:#F33736; --accent-deep:#D92B2A; --accent-tint:rgba(243,55,54,0.08);
  --blue:#376CFB; --blue-tint:rgba(55,108,251,0.10);
  --violet:#376CFB; --violet-soft:#2F5BD6; --violet-deep:#2648A8;
  --green:#12B615; --green-soft:#0E9411;
  --amber:#B45309; --amber-soft:#96700A; --red:#DC2626; --red-soft:#DC2626;
  /* text */
  --text:#333A44; --text-bright:#111418; --text-dim:#8B8C93; --text-faint:#A6A8AE;
  /* type: Inter Tight for UI, mono for data */
  --font-display:"Inter Tight",system-ui,-apple-system,sans-serif;
  --font-body:"Inter Tight",system-ui,-apple-system,sans-serif;
  --radius:12px; --radius-lg:14px; --radius-sm:8px;
  --ink:#111418; --paper2:#FFFFFF;
  /* mascot eyes (pixel-art.js + inline SVGs read this) */
  --eye:#F33736;
  font-size:15px;
}

/* ── Backdrop: faint dots instead of blueprint grid + grain ── */
body.v2 .grain { display:none; }
body.v2 .bg-field::after {
  background-image:radial-gradient(rgba(17,20,24,0.05) 1px,transparent 1px);
  background-size:22px 22px;
}

/* ── Cards ── */
body.v2 .card {
  border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:0 1px 2px rgba(17,20,24,0.03);
}
body.v2 .feature-card { transition:box-shadow .2s ease,border-color .2s ease; }
body.v2 .feature-card:hover,
body.v2 .dcol > .card:hover {
  transform:none; border-color:#D4D4D4;
  box-shadow:0 10px 28px -10px rgba(17,20,24,0.12);
}

/* ── Buttons ── */
body.v2 .btn {
  font-family:var(--font-body); font-weight:600; letter-spacing:0; font-size:13.5px;
  border:1px solid var(--line-strong); background:var(--surface-1); color:var(--text-bright);
  border-radius:8px; transition:background .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease;
}
body.v2 .btn:hover { transform:none; background:var(--surface-2); border-color:#B9BCC2; }
body.v2 .btn-primary {
  background:var(--accent); border-color:var(--accent); color:#fff;
  box-shadow:0 2px 10px -2px rgba(243,55,54,0.40);
}
body.v2 .btn-primary:hover {
  background:var(--accent-deep); border-color:var(--accent-deep); color:#fff;
  transform:none; box-shadow:0 6px 16px -4px rgba(243,55,54,0.45);
}
body.v2 .btn-ghost { background:transparent; }
body.v2 .btn-ghost:hover { background:var(--surface-2); }

/* ── Tags & chips ── */
body.v2 .tag {
  border:1px solid var(--line-strong); color:var(--text-dim); background:var(--surface-1);
  border-radius:100px; padding:3px 10px; clip-path:none; transform:none; opacity:1;
  font-size:10px; letter-spacing:0.08em;
}
body.v2 .tag-green { color:#0E9411; background:rgba(18,182,21,0.08); border-color:rgba(18,182,21,0.25); }
body.v2 .tag-violet { color:var(--accent-deep); background:var(--accent-tint); border-color:rgba(243,55,54,0.25); }
body.v2 .tag-amber { color:#96700A; background:rgba(255,184,0,0.12); border-color:rgba(255,184,0,0.3); }
body.v2 .echip { border:1px solid var(--line); background:var(--surface-1); border-radius:100px; font-size:12px; color:var(--text); }
body.v2 .echip .ck.ok { background:rgba(18,182,21,0.12); color:#0E9411; }
body.v2 .echip .ck.no { background:rgba(220,38,38,0.10); color:var(--red); }
body.v2 .icontile { border:none; border-radius:10px; }
body.v2 .icontile.violet { background:var(--blue-tint); color:var(--violet-soft); }
body.v2 .icontile.green { background:rgba(18,182,21,0.10); color:#0E9411; }
body.v2 .icontile.amber { background:rgba(255,184,0,0.14); color:#96700A; }
body.v2 .icontile.cyan { background:var(--blue-tint); color:var(--violet-soft); }

/* ── Top bars (workspace dtopbar + account anav) ── */
body.v2 .dtopbar, body.v2 .anav { background:rgba(244,244,244,0.85); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
body.v2 .anav .bname { font-family:var(--font-body); font-weight:700; letter-spacing:-0.3px; font-size:17px; }

/* ── Scan bar ── */
body.v2 .urlscan { border:1px solid var(--line-strong); background:var(--surface-1); border-radius:8px; transition:border-color .18s ease,box-shadow .18s ease; }
body.v2 .urlscan:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-tint); }
body.v2 .urlscan .dot { background:var(--green); border:none; box-shadow:none; width:8px; height:8px; }

/* ── Labels ── */
body.v2 .eyebrow { color:var(--text-faint); letter-spacing:0.12em; font-size:10.5px; }
body.v2 .eyebrow-green { color:#0E9411; } body.v2 .eyebrow-violet { color:var(--violet-soft); }
body.v2 .panel-h { font-weight:700; font-size:15px; }
body.v2 .panel-h .pi { color:var(--accent); }
body.v2 .scores-head .sh-title { font-weight:700; letter-spacing:0.06em; font-size:13px; text-transform:uppercase; color:var(--text-dim); }
body.v2 .display { font-family:var(--font-body); }

/* ── Workspace: verdict, rings, agents, chat, feed ── */
body.v2 .vcell { border:1px solid var(--line); border-radius:12px; background:var(--surface-2); }
body.v2 .vn { font-weight:700; letter-spacing:-1px; }
body.v2 .ring .glabel, body.v2 .gauge .glabel { font-family:var(--font-body); font-size:12px; color:var(--text-dim); font-weight:500; }
body.v2 .agent .run {
  background:var(--surface-1); border:1px solid var(--line-strong); border-radius:8px;
  font-family:var(--font-body); font-weight:600; font-size:12.5px;
}
body.v2 .agent .run:hover { border-color:var(--accent); background:var(--accent-tint); color:var(--accent-deep); }
body.v2 .agent-status .count { color:#96700A; }
body.v2 .msg.user { background:#111418; }
body.v2 .qchip { font-family:var(--font-body); font-size:12px; background:var(--surface-1); border:1px solid var(--line-strong); color:var(--text); }
body.v2 .qchip:hover { border-color:var(--accent); background:var(--accent-tint); color:var(--accent-deep); }
body.v2 .checklist .cb { border:1px solid var(--line-strong); border-radius:5px; }
body.v2 .chatinput .chatsend { background:var(--accent); color:#fff; }
body.v2 .msg.agent .who .pixel { color:var(--accent); }
body.v2 .connect .locked { background:repeating-linear-gradient(135deg,rgba(17,20,24,0.03) 0 6px,transparent 6px 12px); border:1px dashed var(--line-strong); }
body.v2 .connect .cic.green { background:rgba(18,182,21,0.10); border:none; }
body.v2 .connect .cic.violet { background:var(--blue-tint); border:none; }
body.v2 .livedot, body.v2 .trow .st.green, body.v2 .trow .st.amber, body.v2 .ss-dot, body.v2 .actdot.good, body.v2 .actdot.warn { box-shadow:none; }
body.v2 .site-card-head .sdot { background:var(--accent); }
body.v2 .acttag, body.v2 .docrow .ti, body.v2 .ssrow.add span, body.v2 .cbmh-plan { color:var(--accent-deep); }
body.v2 .actdot.info { background:var(--blue); }
body.v2 .actempty { border:1px dashed var(--line-strong); }
body.v2 .actempty a { color:var(--accent-deep); }
body.v2 .ssrow.current { background:var(--accent-tint); }

/* ── Modal / side panel / menus ── */
body.v2 .modal { border:1px solid var(--line); border-radius:14px; box-shadow:0 24px 60px -12px rgba(17,20,24,0.22); }
body.v2 .modal h3 { font-weight:700; }
body.v2 .modal code, body.v2 .modal .codebox { background:var(--surface-2); border:1px solid var(--line); color:var(--text); }
body.v2 .modal .copybtn { background:var(--accent); color:#fff; border-radius:8px; font-family:var(--font-body); font-weight:600; }
body.v2 .modal .copybtn:hover { background:var(--accent-deep); }
body.v2 .modal .closebtn { border:1px solid var(--line-strong); border-radius:8px; font-family:var(--font-body); font-weight:600; }
body.v2 .modal-overlay { background:rgba(17,20,24,0.40); }
body.v2 .cite-answer { background:var(--surface-2); border:1px solid var(--line); }
body.v2 .cite-answer .hl-you { background:rgba(18,182,21,0.14); color:#0E9411; }
body.v2 .cite-answer .hl-comp { background:rgba(220,38,38,0.10); color:var(--red); }
body.v2 .cbmenu, body.v2 .ssmenu { border:1px solid var(--line); border-radius:12px; box-shadow:0 16px 40px -12px rgba(17,20,24,0.16); }
body.v2 .cbpanel { border-left:1px solid var(--line); }
body.v2 .cbpanel-btn { border-radius:8px; font-family:var(--font-body); font-weight:600; }
body.v2 .cbpanel-btn:hover { border-color:var(--accent); background:var(--accent-tint); }
body.v2 .brief h1 { font-weight:700; letter-spacing:-0.8px; }
body.v2 .brief h3 { color:var(--accent-deep); }
body.v2 .brief .bn { font-weight:700; }
body.v2 .brief .bfnum { color:var(--accent); }

/* ── Account page (auth + plans) ── */
body.v2 .authbox h1 { font-weight:700; letter-spacing:-0.8px; font-size:30px; }
body.v2 .authtab { font-family:var(--font-body); font-weight:600; border-radius:8px; }
body.v2 .authtab.active { background:var(--accent-tint); border-color:rgba(243,55,54,0.3); color:var(--accent-deep); }
body.v2 .field label { font-family:var(--font-body); font-weight:500; letter-spacing:0; font-size:13px; }
body.v2 .field input { background:var(--surface-1); border:1px solid var(--line-strong); border-radius:8px; transition:border-color .15s ease, box-shadow .15s ease; }
body.v2 .field input:focus { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-tint); }
body.v2 .authfine { font-family:var(--font-body); }
body.v2 .planbadge { font-family:var(--font-body); font-weight:600; border-radius:100px; background:var(--accent-tint); border-color:rgba(243,55,54,0.3); color:var(--accent-deep); }
body.v2 .planbadge.pro { background:rgba(18,182,21,0.10); border-color:rgba(18,182,21,0.3); color:#0E9411; }
body.v2 .pname { font-family:var(--font-body); font-weight:600; color:var(--violet-soft); }
body.v2 .pname.g { color:var(--accent-deep); }
body.v2 .pprice .amt { font-weight:700; letter-spacing:-2px; }
body.v2 .pcard.popular { border-color:rgba(243,55,54,0.45); box-shadow:0 14px 34px -16px rgba(243,55,54,0.25); }
body.v2 .pcard.current { border-color:rgba(18,182,21,0.4); box-shadow:none; }
body.v2 .pfeats .ck { color:#0E9411; }
body.v2 .trendline i { background:rgba(55,108,251,0.45); }
body.v2 .notice.info { background:rgba(255,184,0,0.10); border-color:rgba(255,184,0,0.3); color:#96700A; }

/* ── Intel page chrome ── */
body.v2 .inav { background:rgba(244,244,244,0.85); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
body.v2 .inav .bname { font-family:var(--font-body); font-weight:700; letter-spacing:-0.3px; font-size:17px; }
body.v2 .itab { font-family:var(--font-body); font-weight:600; border-radius:100px; }
body.v2 .itab.active { background:var(--accent-tint); border-color:rgba(243,55,54,0.3); color:var(--accent-deep); box-shadow:none; }
body.v2 .icta { background:#111418; color:#fff; border-color:#111418; border-radius:16px; }
body.v2 .icta h2, body.v2 .icta .display { color:#fff; }

/* Profile chip (workspace.js chrome): avatar + meta live in dashboard.css,
   which intel/settings don't load — define them here for every v2 app page. */
body.v2 .davatar { width:38px; height:38px; border-radius:10px; flex:0 0 auto; background:#111418; display:inline-flex; align-items:center; justify-content:center; font-size:13px; color:#fff; font-weight:600; }
body.v2 .dmeta { line-height:1.3; white-space:nowrap; }
body.v2 .dmeta .nm { font-size:13.5px; color:var(--text-bright); display:block; }
body.v2 .dmeta .pl { font-size:11px; color:var(--text-dim); display:block; }

/* ── Marketing pages built on tools.css (case-study, tools, blog, why) ── */
body.v2 .tnav { background:rgba(244,244,244,0.85); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
body.v2 .tnav .bname { font-family:var(--font-body); font-weight:700; letter-spacing:-0.3px; font-size:17px; }
body.v2 .tnav-links a { font-family:var(--font-body); font-size:14px; }
body.v2 .thero h1 { font-weight:600; letter-spacing:-1.6px; line-height:1.1; }
body.v2 .thero p { color:var(--text-dim); }
body.v2 .toolcta { background:#111418; color:#fff; border-color:#111418; border-radius:16px; }
body.v2 .toolcta h2 { color:#fff; font-weight:600; letter-spacing:-0.8px; }
body.v2 .toolcta p { color:rgba(255,255,255,0.62); }
body.v2 .seo-prose h2 { font-weight:600; letter-spacing:-0.6px; }
body.v2 .foundernote .fn-h, body.v2 .post-card .pc-tag { color:var(--accent-deep); }

/* ── Global feel ── */
body.v2 ::selection { background:rgba(243,55,54,0.14); color:inherit; }
body.v2 :focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
body.v2 .cursor { background:var(--accent); }
body.v2 .term-lines .g { color:#0E9411; }
body.v2 .grad-word { color:var(--accent-deep); }
body.v2 .hover-row:hover { background:rgba(17,20,24,0.04); }
body.v2 .pixelart svg { filter:drop-shadow(0 1px 1px rgba(17,20,24,0.15)); }
