/* Decoy theme: midnight black ~60%, electric blue ~25%, loop orange ~15%.
   Loaded last: it re-colours the tokens of style.css and workflow.css.
   Blue = action, progress, safe. Orange = the central loop, danger, blocked attempts. */
:root {
  --midnight: #05070d; --midnight-2: #0a0f1c; --midnight-3: #0f1626; --midnight-4: #151e33;
  --blue: #2d7bff; --blue-glow: #5b9bff; --blue-soft: rgba(45, 123, 255, .16);
  --orange: #ff7a1a; --orange-soft: rgba(255, 122, 26, .15);
  --accent: #2d7bff; --ink: #e8eefc; --frame: #060910; --canvas: var(--midnight-2); --card: var(--midnight-3); --card2: var(--midnight-4);
  --line: #1f2b46; --muted: #8e9bbb;
  --red: var(--orange); --red-soft: var(--orange-soft); --green: var(--blue-glow); --green-soft: var(--blue-soft);
  --amber: #ffa24d; --amber-soft: rgba(255, 162, 77, .15);
}
body[data-risk="idle"], body[data-risk="clean"] { --accent: #2d7bff; }
body[data-risk="warn"] { --accent: #ffa24d; }
body[data-risk="danger"] { --accent: #ff7a1a; }
body { background: radial-gradient(900px 520px at 85% -8%, color-mix(in srgb, var(--accent) 30%, transparent), transparent 70%), var(--midnight); color: var(--ink); }
.device { background: var(--frame); box-shadow: 0 30px 80px rgba(0, 0, 0, .6), inset 0 0 0 1px #141c33; }
.logo { background: var(--blue); color: #fff; }
.titletab, .canvas { background: var(--canvas); }
.titletab::after { background: radial-gradient(circle at 100% 0, transparent 28px, var(--canvas) 29px); }
.pill { background: #121a2e; color: #c7d3ef; }
.pill.ok { background: var(--blue-soft); color: #9ec3ff; }
.pill.warn { background: var(--orange-soft); color: #ffb277; }
.pill.vultr { background: #fff; color: #05070d; }
.card, .wfpanel { background: var(--card); box-shadow: inset 0 0 0 1px #17213a; }
.sheet, .wf-stats div, .limits span, .life li, .wfpanel .trace { background: var(--card2); }
.steps::before { background: var(--line); }
.steps-fill { background: var(--blue); }
.steps li b { background: var(--card); color: var(--muted); }
.steps li.on { color: var(--ink); }
.steps li.on b { background: var(--blue); color: #fff; box-shadow: 0 0 0 3px rgba(45, 123, 255, .3); }
.steps li.done b { background: var(--blue-soft); color: var(--blue-glow); }
.intake h2 span { color: var(--blue-glow); }
.ask input, .decide input { background: var(--midnight); color: var(--ink); box-shadow: inset 0 0 0 1.5px #22304f; }
.ask input:focus, .decide input:focus { box-shadow: inset 0 0 0 2px var(--blue); }
.ask input::placeholder, .decide input::placeholder { color: #66749a; }
.chipset button { background: var(--card2); color: var(--ink); box-shadow: inset 0 0 0 1.5px #22304f; }
.chipset button:hover { box-shadow: inset 0 0 0 1.5px var(--blue); }
.btn { background: var(--card2); color: var(--ink); box-shadow: inset 0 0 0 1.5px #22304f; }
.btn.primary { background: var(--blue); color: #fff; box-shadow: 0 6px 20px rgba(45, 123, 255, .35); transition: transform .15s; }
.btn.danger { background: var(--orange); color: #1a0c00; }
.err { color: #ffb277; }
.ring-bg { stroke: var(--line); }
.ring-fg { stroke: var(--blue); }
body[data-risk="danger"] .ring-fg { stroke: var(--orange); } body[data-risk="clean"] .ring-fg { stroke: var(--blue-glow); }
body[data-risk="danger"] .vlevel { color: var(--orange); } body[data-risk="clean"] .vlevel { color: var(--blue-glow); } body[data-risk="warn"] .vlevel { color: #ffa24d; }
#evidence .w { background: var(--midnight); color: var(--muted); }
#evidence li.pass::before { color: var(--blue-glow); }
.lootbox { background: var(--orange-soft); } .lootbox b { color: var(--orange); }
.decide { border-top-color: var(--line); }
.chrome, .strip { background: var(--card2); }
.addr { background: var(--midnight); color: #c7d3ef; }
.seal { background: var(--midnight); color: var(--muted); } .seal.on { background: var(--blue-soft); color: var(--blue-glow); }
.seal.dev { background: var(--orange-soft); color: #ffb277; } .seal.gone { background: var(--blue); color: #fff; }
.screen { background: #04060b; }
.strip img.on { border-color: var(--blue); }
.life li.on { background: var(--blue); color: #fff; } .life li.gone { background: var(--blue-soft); color: var(--blue-glow); }
.limits span.warn { background: var(--orange-soft); color: #ffb277; }
.blocked li { border-bottom-color: var(--line); } .blocked li b { color: var(--orange); }
.blocked li.fresh { animation: flashO 1.2s; } @keyframes flashO { from { background: var(--orange-soft); } }
.riskbar { background: repeating-linear-gradient(135deg, #05070d 0 12px, #0d1322 12px 24px); }
.riskbar .dot { background: var(--orange); }
.foot { color: #5f6c8d; }
* { scrollbar-color: rgba(120, 150, 220, .3) transparent; }
::-webkit-scrollbar-thumb { background: rgba(120, 150, 220, .28); background-clip: padding-box; }
::-webkit-scrollbar-thumb:hover { background: rgba(120, 150, 220, .5); background-clip: padding-box; }

/* workflow panel */
.wf-head b { color: var(--ink); }
.wf-cancel { background: var(--card2); color: var(--ink); border-color: #22304f; }
.wf-orb, .wn.core .ball { background: radial-gradient(circle at 35% 30%, #ffe2c7, #ff9a45 42%, #e8590c 100%); }
.wfpanel.run .wf-orb { animation: orbO 1.5s infinite; } @keyframes orbO { 70% { box-shadow: 0 0 0 14px rgba(255, 122, 26, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 122, 26, 0); } }
.wf-legend .c { background: #6f7da3; } .wf-legend .m { background: var(--blue); } .wf-legend .h { background: #ffa24d; } .wf-legend .x { background: var(--orange); }
.wn { background: #0d1628; border-color: #25324f; box-shadow: 0 4px 14px rgba(0, 0, 0, .35); color: var(--ink); }
.wn b i { background: #17223b; } .wn.model { border-color: #2a5cb8; } .wn.model b i { background: var(--blue-soft); }
.wn.human { background: #1a1206; border-color: #8a5a1c; } .wn.human b i { background: var(--orange-soft); }
.wn.core { border-color: #8a4a14; box-shadow: 0 0 24px rgba(255, 122, 26, .22); }
.wn .live { color: var(--blue-glow); }
.wn.active { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(45, 123, 255, .25), 0 0 26px rgba(45, 123, 255, .45); }
.wn.active .live { color: #9ec3ff; }
.wn.done { border-color: #2a4f9a; }
.wn.bad { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255, 122, 26, .22), 0 0 26px rgba(255, 122, 26, .4); }
.wn.bad .live { color: #ffb277; }
.we { stroke: #25324f; } .we.model { stroke: #2a5cb8; }
.we.on { stroke: var(--blue-glow); filter: drop-shadow(0 0 5px rgba(91, 155, 255, .8)); }
.we.on.bad { stroke: var(--orange); filter: drop-shadow(0 0 5px rgba(255, 122, 26, .8)); }
.we.done { stroke: #2a5cb8; }
.wp { fill: #cfe0ff; filter: drop-shadow(0 0 6px #5b9bff) drop-shadow(0 0 12px #2d7bff); }
.wp.bad { fill: #ffd9b8; filter: drop-shadow(0 0 6px #ff7a1a) drop-shadow(0 0 12px #ff7a1a); }
.wf-stats .hot b { color: var(--orange); }
.wfpanel .trace-head { color: var(--blue-glow); }
.wfpanel .trace li { border-left-color: var(--line); } .wfpanel .trace li.ai { border-left-color: var(--blue); }
.wfpanel .trace li.bad { border-left-color: var(--orange); } .wfpanel .trace li.bad .txt { color: #ffb277; }
.wfpanel .trace li.good { border-left-color: var(--blue-glow); } .wfpanel .trace li.typing .txt::after { color: var(--blue-glow); }

.wf-brand { display: flex; align-items: center; gap: 9px; padding: 8px 12px; border-radius: 14px; background: #0a1224; box-shadow: inset 0 0 0 1px #1c2a4a; }
.wf-brand .vlogo { width: 22px; height: 22px; background: #2d8bff; }
.wf-brand span { font-weight: 800; font-size: 17px; letter-spacing: -.02em; }
.wf-brand small { margin-left: auto; color: var(--muted); font-size: 10.5px; font-weight: 600; text-align: right; line-height: 1.25; max-width: 190px; }

/* ---- aurora look (reference: midnight sky, electric-blue beam melting into orange, vertical light streaks, glass cards, serif headlines) ---- */
body { background: #03050c; position: relative; }
body::before { content: ""; position: fixed; inset: 0; z-index: -2; pointer-events: none; transition: opacity .8s;
  background:
    radial-gradient(38% 62% at 50% 52%, color-mix(in srgb, var(--accent) 70%, transparent) 0, transparent 72%),
    radial-gradient(75% 38% at 50% 108%, rgba(255, 122, 26, .85) 0, rgba(255, 90, 20, .35) 45%, transparent 75%),
    radial-gradient(60% 40% at 18% 100%, rgba(255, 122, 26, .35), transparent 70%),
    radial-gradient(60% 40% at 82% 100%, rgba(255, 122, 26, .35), transparent 70%),
    linear-gradient(180deg, #02040a 0%, #040a1e 40%, #07122e 70%, #0a0f1e 100%); }
body::after { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: .9;
  background: repeating-linear-gradient(90deg, rgba(160, 190, 255, .07) 0 1px, transparent 1px 6px);
  -webkit-mask: linear-gradient(180deg, transparent 5%, #000 45%, #000 70%, transparent 100%); mask: linear-gradient(180deg, transparent 5%, #000 45%, #000 70%, transparent 100%); }
.device { background: rgba(4, 7, 16, .45); backdrop-filter: blur(18px) saturate(1.2); -webkit-backdrop-filter: blur(18px) saturate(1.2);
  box-shadow: 0 40px 100px rgba(0, 0, 0, .55), inset 0 0 0 1px rgba(150, 180, 255, .12); }
.titletab, .canvas { background: rgba(7, 11, 24, .35); }
.titletab::after { background: radial-gradient(circle at 100% 0, transparent 28px, rgba(7, 11, 24, .35) 29px); }
.card, .wfpanel { background: rgba(10, 16, 34, .55); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: inset 0 0 0 1px rgba(150, 180, 255, .12), 0 14px 40px rgba(0, 0, 0, .35); }
.sheet, .wf-stats div, .limits span, .life li, .wfpanel .trace, .chrome, .strip { background: rgba(8, 13, 28, .55); }
.wn { background: rgba(10, 18, 38, .62); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.wn.human { background: rgba(40, 22, 6, .6); }
.wf-brand { background: rgba(8, 14, 32, .6); }
.pill { background: rgba(14, 22, 44, .65); }
.pill.vultr { background: rgba(255, 255, 255, .95); }
.ask input, .decide input { background: rgba(3, 6, 14, .6); }
.chipset button, .btn { background: rgba(14, 22, 44, .6); }
.btn.primary { background: linear-gradient(180deg, #4a8dff, #2d6bff); box-shadow: 0 8px 26px rgba(45, 123, 255, .5); }
.btn.danger { background: linear-gradient(180deg, #ff9a45, #ff7a1a); }
.steps li b { background: rgba(14, 22, 44, .7); }
/* Friendly, common typography: Inter everywhere (JetBrains Mono only for the live trace) */
.intake h2, .vlevel, .wf-head b, .wf-brand span, .titletab h1 { font-family: Inter, system-ui, sans-serif; font-weight: 700; }
.intake h2 { font-size: clamp(28px, 4vw, 44px); line-height: 1.12; letter-spacing: -.025em; }
.intake h2 span { color: #dbe7ff; font-weight: 600; }
.intake h2 em { font-style: normal; color: #7fb0ff; }
.vlevel { font-size: clamp(24px, 3.4vw, 32px); line-height: 1.15; letter-spacing: -.02em; }
.wf-head b { font-size: 18px; letter-spacing: -.01em; }
.titletab h1 { font-size: 24px; letter-spacing: -.03em; }
.wf-brand span { font-size: 16px; }
.sub { color: #a9b6d6; }
.riskbar { background: repeating-linear-gradient(135deg, #03050c 0 12px, #0d1322 12px 24px); }

/* ---- phone layout ---- */
@media (max-width: 700px) {
  body { padding: 0; }
  .device { border-radius: 0; box-shadow: none; backdrop-filter: none; padding-bottom: 0; background: rgba(4, 7, 16, .6); }
  .frame-top { padding: 12px 14px 0; min-height: 0; gap: 10px; flex-wrap: wrap; align-items: center; }
  .logo { width: 38px; height: 38px; } .logo svg { width: 22px; height: 22px; }
  .titletab { height: auto; padding: 0; background: none; align-items: center; } .titletab::after { display: none; } .titletab h1 { font-size: 22px; }
  .pills { margin-left: auto; gap: 6px; } .pill { padding: 6px 11px; font-size: 11.5px; } .pill:not(.vultr) { display: none; }
  .canvas { margin: 0; border-radius: 0; padding: 12px 14px 22px; gap: 14px; background: none; }
  .steps { padding: 0 4px; height: 48px; } .steps li { width: 64px; font-size: 10.5px; } .steps::before, .steps-fill { left: 24px; right: 24px; }
  .intake { padding: 18px 16px; border-radius: 20px; } .sub { font-size: 14px; }
  .ask { flex-direction: column; } .ask input { font-size: 16px; padding: 14px; } .btn.primary { width: 100%; padding: 14px; }
  .examples { flex-direction: column; align-items: flex-start; }
  .layout { grid-template-columns: 1fr; gap: 14px; } .wfpanel { position: static; max-height: none; order: 2; padding: 14px 12px; }
  .left { order: 1; }
  .verdict { padding: 16px; } .vhead { grid-template-columns: auto 1fr; gap: 14px; } .vmeta { display: none; }
  .ring, .ring svg { width: 64px; height: 64px; } .ring b { font-size: 18px; }
  .vsum { font-size: 15px; } .vgrid, .grid3 { grid-template-columns: 1fr; }
  .decide { grid-template-columns: 1fr; } .decide .row .btn { flex: 1 1 100%; padding: 13px; }
  .screen-msg { font-size: 11px; max-width: 92%; } .addr { font-size: 11px; }
  .wf-stage { height: 760px; } .wn { width: 142px; } .wn b { font-size: 12px; } 
  .wfpanel .trace { height: 170px; font-size: 11.5px; }
  .canary dd { font-size: 11.5px; }
}
@media (max-width: 400px) { .wn { width: 128px; padding: 6px 7px; } .wn small, .wn .live { margin-left: 26px; font-size: 9.5px; } .wn b i { width: 20px; height: 20px; } }

/* the orange bubbles carry the Vultr logo */
.wf-orb, .wn.core .ball { display: grid; place-items: center; }
.wf-orb::after, .wn.core .ball::after { content: ""; display: block; width: 52%; height: 52%; background: #fff; filter: drop-shadow(0 1px 2px rgba(120, 40, 0, .5));
  -webkit-mask: url(/static/assets/vultr.svg) center / contain no-repeat; mask: url(/static/assets/vultr.svg) center / contain no-repeat; }

/* ---- swarm, memory, ask, history, QR ---- */
.qrbtn { display: inline-block; padding: 7px 14px; border-radius: 99px; background: rgba(14, 22, 44, .6); box-shadow: inset 0 0 0 1.5px #22304f; font-weight: 700; font-size: 12.5px; cursor: pointer; }
.qrbtn:hover { box-shadow: inset 0 0 0 1.5px var(--blue); }
.swarm { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.sw { background: rgba(8, 13, 28, .55); border-radius: 16px; padding: 10px; display: flex; flex-direction: column; gap: 8px; box-shadow: inset 0 0 0 1px rgba(150, 180, 255, .1); }
.swh { display: flex; flex-direction: column; } .swh b { font-size: 14px; } .swh span { font-size: 11.5px; color: var(--muted); font-weight: 600; }
.swimg { aspect-ratio: 16 / 10; border-radius: 10px; background: #04060b; overflow: hidden; display: grid; place-items: center; }
.swimg img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
#sw-phone .swimg img { object-fit: contain; }
.swt { min-height: 2.6em; overflow-wrap: anywhere; }
.swchip { display: flex; flex-wrap: wrap; gap: 5px; min-height: 22px; }
.swchip i, .hist i { font-style: normal; font-size: 11px; font-weight: 800; padding: 3px 9px; border-radius: 99px; background: rgba(255, 255, 255, .08); }
.swchip i.bad, .hist i.bad { background: var(--orange-soft); color: #ffb277; }
.swchip i.ok, .hist i.ok { background: var(--blue-soft); color: #9ec3ff; }
.swchip i.warn, .hist i.warn { background: rgba(255, 162, 77, .18); color: #ffc58f; }
.swarmwarn { background: var(--orange-soft); border-radius: 12px; padding: 10px 14px; margin-bottom: 12px; color: #ffcfa3; font-weight: 600; }
.memory { background: rgba(45, 123, 255, .12); border-radius: 14px; padding: 8px 14px; margin-top: 14px; color: #cfe0ff; }
.memory p { margin: 4px 0; } .memory b { color: var(--orange); }
.askbox { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.askrow { display: flex; gap: 8px; margin-top: 10px; }
.askrow input { flex: 1; min-width: 0; border: 0; border-radius: 12px; padding: 11px 14px; background: rgba(3, 6, 14, .6); color: var(--ink); box-shadow: inset 0 0 0 1.5px #22304f; }
.askrow input:focus { outline: none; box-shadow: inset 0 0 0 2px var(--blue); }
.askout { margin-top: 10px; background: rgba(8, 13, 28, .55); border-radius: 14px; padding: 10px 14px; }
.askout p { margin: 0 0 6px; }
.hist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.hist li { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 12px; background: rgba(8, 13, 28, .55); }
.hist .hu { font: 12.5px "JetBrains Mono", Consolas, monospace; overflow-wrap: anywhere; flex: 1 1 140px; }
.hist em { font-style: normal; font-size: 11px; color: #ffb277; background: var(--orange-soft); padding: 2px 8px; border-radius: 99px; }
.hist small { color: var(--muted); font-size: 11px; }
.rescan { border: 0; background: rgba(45, 123, 255, .18); color: #9ec3ff; border-radius: 99px; width: 28px; height: 28px; cursor: pointer; font-size: 15px; }
@media (max-width: 900px) { .swarm { grid-template-columns: 1fr; } .sw { flex-direction: row; flex-wrap: wrap; } .swimg { width: 46%; } }
@media (max-width: 700px) { .askrow { flex-direction: column; } .askrow .btn { width: 100%; } }

/* ---- light mode: same three colours (midnight text/frame, electric blue, loop orange) on a soft white sky ---- */
.themebtn { border: 0; cursor: pointer; width: 36px; height: 36px; border-radius: 50%; background: rgba(14, 22, 44, .65); color: #dbe7ff; font-size: 17px; line-height: 1; }
.themebtn:hover { box-shadow: 0 0 0 2px var(--blue); }
:root[data-theme="light"] {
  --ink: #0b1530; --muted: #56658a; --line: #d2dcf1; --frame: #dfe8fb; --canvas: #f3f6ff; --card: #ffffff; --card2: #edf2ff;
  --blue: #1f63f0; --blue-glow: #2d6bff; --blue-soft: rgba(31, 99, 240, .12); --orange: #f26a0a; --orange-soft: rgba(242, 106, 10, .12);
  --accent: #2d6bff; --amber: #d9730d; --amber-soft: rgba(217, 115, 13, .14);
  --red: var(--orange); --red-soft: var(--orange-soft); --green: var(--blue); --green-soft: var(--blue-soft);
  color-scheme: light;
}
:root[data-theme="light"] body[data-risk="danger"] { --accent: #f26a0a; }
:root[data-theme="light"] body[data-risk="warn"] { --accent: #ff9a45; }
:root[data-theme="light"] body { background: #eef3ff; color: var(--ink); }
:root[data-theme="light"] body::before { background:
  radial-gradient(38% 56% at 50% 40%, color-mix(in srgb, var(--accent) 34%, transparent) 0, transparent 72%),
  radial-gradient(75% 36% at 50% 108%, rgba(255, 140, 50, .5) 0, rgba(255, 120, 40, .2) 45%, transparent 75%),
  linear-gradient(180deg, #f8faff 0%, #e8efff 60%, #fdeede 100%); }
:root[data-theme="light"] body::after { background: repeating-linear-gradient(90deg, rgba(31, 99, 240, .06) 0 1px, transparent 1px 6px); }
:root[data-theme="light"] .device { background: rgba(255, 255, 255, .5); box-shadow: 0 30px 80px rgba(30, 60, 140, .18), inset 0 0 0 1px rgba(31, 99, 240, .12); }
:root[data-theme="light"] .titletab, :root[data-theme="light"] .canvas { background: rgba(255, 255, 255, .35); }
:root[data-theme="light"] .titletab::after { background: radial-gradient(circle at 100% 0, transparent 28px, rgba(255, 255, 255, .35) 29px); }
:root[data-theme="light"] .pill { background: rgba(255, 255, 255, .85); color: #2a3b66; }
:root[data-theme="light"] .pill.ok { background: var(--blue-soft); color: #174ec4; }
:root[data-theme="light"] .pill.warn { background: var(--orange-soft); color: #b24a00; }
:root[data-theme="light"] .pill.vultr { background: #0b1530; color: #fff; }
:root[data-theme="light"] .themebtn { background: rgba(255, 255, 255, .9); color: #0b1530; box-shadow: inset 0 0 0 1px #d2dcf1; }
:root[data-theme="light"] .card, :root[data-theme="light"] .wfpanel { background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 1px rgba(31, 99, 240, .1), 0 12px 34px rgba(30, 60, 140, .1); }
:root[data-theme="light"] .sheet, :root[data-theme="light"] .wf-stats div, :root[data-theme="light"] .limits span, :root[data-theme="light"] .life li,
:root[data-theme="light"] .wfpanel .trace, :root[data-theme="light"] .sw, :root[data-theme="light"] .hist li, :root[data-theme="light"] .askout,
:root[data-theme="light"] .chrome, :root[data-theme="light"] .strip { background: rgba(236, 242, 255, .85); }
:root[data-theme="light"] .intake h2 span { color: #26365f; } :root[data-theme="light"] .intake h2 em { color: var(--blue); }
:root[data-theme="light"] .sub { color: #4a5a82; }
:root[data-theme="light"] .ask input, :root[data-theme="light"] .decide input, :root[data-theme="light"] .askrow input { background: #fff; color: var(--ink); box-shadow: inset 0 0 0 1.5px #c5d2ee; }
:root[data-theme="light"] .ask input::placeholder, :root[data-theme="light"] .decide input::placeholder { color: #8a97b8; }
:root[data-theme="light"] .chipset button, :root[data-theme="light"] .btn, :root[data-theme="light"] .qrbtn { background: #fff; color: var(--ink); box-shadow: inset 0 0 0 1.5px #c5d2ee; }
:root[data-theme="light"] .btn.primary { background: linear-gradient(180deg, #3b7bff, #1f63f0); color: #fff; box-shadow: 0 8px 22px rgba(31, 99, 240, .35); }
:root[data-theme="light"] .btn.danger { background: linear-gradient(180deg, #ff8a35, #f26a0a); color: #fff; }
:root[data-theme="light"] .steps li b { background: #fff; color: var(--muted); }
:root[data-theme="light"] .steps li.done b { background: var(--blue-soft); color: var(--blue); }
:root[data-theme="light"] .steps li.on b { background: var(--blue); color: #fff; }
:root[data-theme="light"] .addr { background: #fff; color: #26365f; } :root[data-theme="light"] .seal { background: #fff; }
:root[data-theme="light"] #evidence .w { background: #fff; }
:root[data-theme="light"] .memory { background: rgba(31, 99, 240, .1); color: #1d3a82; }
:root[data-theme="light"] .swarmwarn { color: #9a3f00; } :root[data-theme="light"] .swchip i { background: rgba(11, 21, 48, .07); color: #26365f; }
:root[data-theme="light"] .swchip i.bad, :root[data-theme="light"] .hist i.bad, :root[data-theme="light"] .hist em { background: var(--orange-soft); color: #b24a00; }
:root[data-theme="light"] .swchip i.ok, :root[data-theme="light"] .hist i.ok { background: var(--blue-soft); color: #174ec4; }
:root[data-theme="light"] .lootbox { background: var(--orange-soft); } :root[data-theme="light"] .lootbox b { color: #c4560a; }
:root[data-theme="light"] .blocked li b { color: #c4560a; } :root[data-theme="light"] .err { color: #c4560a; }
:root[data-theme="light"] .foot { color: #6b7aa0; }
:root[data-theme="light"] .riskbar { color: #fff; }
:root[data-theme="light"] .wf-head b, :root[data-theme="light"] .wf-brand span { color: var(--ink); }
:root[data-theme="light"] .wf-brand { background: rgba(236, 242, 255, .9); box-shadow: inset 0 0 0 1px #d2dcf1; }
:root[data-theme="light"] .wf-brand .vlogo { background: #1f63f0; }
:root[data-theme="light"] .wf-cancel { background: #fff; color: var(--ink); border-color: #c5d2ee; }
:root[data-theme="light"] .wn { background: rgba(255, 255, 255, .92); border-color: #c5d2ee; color: var(--ink); box-shadow: 0 4px 12px rgba(30, 60, 140, .1); }
:root[data-theme="light"] .wn b i { background: #e8eefc; } :root[data-theme="light"] .wn.model { border-color: #8fb0f5; }
:root[data-theme="light"] .wn.human { background: #fff3e6; border-color: #f0b784; } :root[data-theme="light"] .wn.core { border-color: #f0a566; }
:root[data-theme="light"] .wn.done { border-color: #7ea4f2; }
:root[data-theme="light"] .wn .live { color: var(--blue); } :root[data-theme="light"] .wn.bad .live { color: #c4560a; }
:root[data-theme="light"] .we { stroke: #c5d2ee; } :root[data-theme="light"] .we.model { stroke: #9cbbf6; } :root[data-theme="light"] .we.done { stroke: #7ea4f2; }
:root[data-theme="light"] .wfpanel .trace li.bad .txt { color: #c4560a; } :root[data-theme="light"] .wfpanel .trace-head { color: var(--blue); }
:root[data-theme="light"] .wf-legend .c { background: #8a97b8; }
:root[data-theme="light"] .vsum { color: var(--ink); }
:root[data-theme="light"] * { scrollbar-color: rgba(31, 99, 240, .3) transparent; }
:root[data-theme="light"] ::-webkit-scrollbar-thumb { background: rgba(31, 99, 240, .28); background-clip: padding-box; }
@media (max-width: 700px) { :root[data-theme="light"] .device { background: rgba(255, 255, 255, .6); } }
:root[data-theme="light"] .seal { color: #56658a; box-shadow: inset 0 0 0 1px #d2dcf1; }
:root[data-theme="light"] .seal.on { background: var(--blue-soft); color: #174ec4; }
:root[data-theme="light"] .seal.gone { background: var(--blue); color: #fff; }
:root[data-theme="light"] .seal.dev, :root[data-theme="light"] .limits span.warn { background: var(--orange-soft); color: #b24a00; }
:root[data-theme="light"] .life li.on { background: var(--blue); color: #fff; } :root[data-theme="light"] .life li.gone { background: var(--blue-soft); color: #174ec4; }
:root[data-theme="light"] .rescan { background: var(--blue-soft); color: var(--blue); }

/* ---- investigate mode ---- */
.modes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; max-width: 760px; }
.modes button { text-align: left; border: 0; cursor: pointer; padding: 10px 14px; border-radius: 14px; background: rgba(14, 22, 44, .6); color: var(--ink); box-shadow: inset 0 0 0 1.5px #22304f; font: inherit; }
.modes button b { display: block; font-size: 14px; } .modes button small { color: var(--muted); font-size: 11.5px; font-weight: 600; }
.modes button.on { box-shadow: inset 0 0 0 2px var(--blue), 0 0 22px rgba(45, 123, 255, .3); background: rgba(45, 123, 255, .14); }
:root[data-theme="light"] .modes button { background: #fff; box-shadow: inset 0 0 0 1.5px #c5d2ee; } :root[data-theme="light"] .modes button.on { background: var(--blue-soft); box-shadow: inset 0 0 0 2px var(--blue); }
.invbar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 14px; }
.desks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.desk { background: rgba(8, 13, 28, .55); border-radius: 16px; padding: 12px; box-shadow: inset 0 0 0 1px rgba(150, 180, 255, .1); }
.desk.working { box-shadow: inset 0 0 0 1.5px var(--blue), 0 0 22px rgba(45, 123, 255, .25); }
.dh { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; } .dh i { font-style: normal; width: 26px; height: 26px; border-radius: 9px; display: grid; place-items: center; background: var(--blue-soft); }
.dh b { font-size: 13.5px; } .dh .st { margin-left: auto; font-size: 10.5px; color: var(--muted); font-weight: 700; }
.df { margin: 0; padding-left: 18px; font-size: 13px; } .df li { margin: 4px 0; }
.report { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.rh { display: flex; gap: 14px; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; } .rh h4 { margin: 4px 0 0; font-size: 20px; letter-spacing: -.015em; max-width: 640px; }
.rdl { display: flex; gap: 8px; } .rdl .btn { text-decoration: none; color: inherit; font-size: 13px; padding: 9px 14px; }
.rcols { display: grid; grid-template-columns: 1.2fr 1fr; gap: 18px; } .report h5 { margin: 14px 0 6px; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); }
.report ol, .report ul { margin: 0; padding-left: 20px; } .report li { margin: 5px 0; }
.tw { overflow-x: auto; } .ioc { width: 100%; border-collapse: collapse; font-size: 12.5px; } .ioc th { text-align: left; color: var(--muted); font-weight: 700; padding: 6px 8px; }
.ioc td { padding: 6px 8px; border-top: 1px solid var(--line); vertical-align: top; } .ioc code { font: 12px "JetBrains Mono", Consolas, monospace; overflow-wrap: anywhere; }
@media (max-width: 900px) { .desks, .rcols { grid-template-columns: 1fr; } .modes { grid-template-columns: 1fr; } }