/* ─── Brain analyzer ─────────────────────────────────────── */
:root {
  --r-amygdala: #ef8a7c;
  --r-hippocampus: #8fa8ff;
  --r-prefrontal: #6fcf9b;
  --r-nucleus_accumbens: #e3c27e;
  --r-anterior_cingulate: #c597f0;
}
:root[data-theme="light"] {
  --r-amygdala: #d9604f;
  --r-hippocampus: #4f6fe0;
  --r-prefrontal: #22985a;
  --r-nucleus_accumbens: #b58a2c;
  --r-anterior_cingulate: #9655d4;
}
.brain-stage { overflow: hidden; }
.brain-wrap { max-width: 520px; margin: 10px auto 0; }
.brain { width: 100%; height: auto; display: block; overflow: visible; }
.brain .b-shell { fill: var(--surface-2); stroke: var(--line-2); stroke-width: 1.2; }
.brain .b-gyri path { fill: none; stroke: var(--line-2); stroke-width: 1.1; stroke-linecap: round; }
.brain .b-links line { stroke: var(--text-3); stroke-width: .8; stroke-dasharray: 2 4; animation: flow 3s linear infinite; }
.brain .b-scan { opacity: 0; }
.brain.scanning .b-scan { opacity: 1; animation: scan 1.8s var(--ease) infinite alternate; }
.brain.scanning .b-gyri path { stroke-dasharray: 160; stroke-dashoffset: 160; animation: draw 2s var(--ease) infinite alternate; }
.brain .b-region { transform-box: fill-box; transform-origin: center; transition: opacity .3s; }
.brain .b-glow { transform-box: fill-box; transform-origin: center; animation: breathe var(--dur, 3s) ease-in-out infinite, pop 1s var(--ease-spring) both; mix-blend-mode: screen; }
:root[data-theme="light"] .brain .b-glow { mix-blend-mode: multiply; }
.brain .b-region.dim { opacity: .15; }
@keyframes breathe { 0%, 100% { transform: scale(1); opacity: .85; } 50% { transform: scale(1.12); opacity: 1; } }
@keyframes scan { from { transform: translateX(20px); } to { transform: translateX(250px); } }
@keyframes flow { to { stroke-dashoffset: -24; } }

.legend { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin-top: 18px; }
.legend-item { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px 12px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--line); font-size: 12px; color: var(--text-2); transition: border-color .2s; }
.legend-item:hover { border-color: var(--line-2); }
.legend-item i { width: 8px; height: 8px; border-radius: 50%; }
.legend-item b { font-size: 20px; font-weight: 500; color: var(--text); }
@media (max-width: 640px) { .legend { grid-template-columns: repeat(3, 1fr); } }

.heat { display: grid; grid-template-columns: 76px repeat(var(--cols), minmax(0, 1fr)); gap: 4px; align-items: center; }
.heat-label { font-size: 12px; color: var(--text-2); }
.heat-x { text-align: center; font: 11px var(--mono); color: var(--text-3); padding-top: 4px; }
.heat-cell { height: 30px; border-radius: 7px; background: var(--c); opacity: 0; animation: heatIn .6s var(--ease) forwards; animation-delay: var(--d); transition: transform .2s var(--ease), box-shadow .2s; }
.heat-cell:hover { transform: scaleY(1.12); }
.heat-cell.sel { box-shadow: 0 0 0 2px var(--text); }
@keyframes heatIn { from { opacity: 0; transform: scaleY(.3); } to { opacity: calc(.08 + var(--v) * .92); transform: none; } }
.seg-detail { margin-top: 18px; padding: 16px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--line); animation: fade .3s; }

/* ─── Content spy ────────────────────────────────────────── */
.spy-card .thumb { position: relative; aspect-ratio: 16 / 9; background:
  radial-gradient(300px 140px at 30% 20%, var(--accent-soft), transparent 70%),
  repeating-linear-gradient(-12deg, transparent 0 16px, var(--line) 16px 17px), var(--surface-2); overflow: hidden; }
.spy-card .thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.spy-card:hover .thumb img { transform: scale(1.04); }
.outlier { position: absolute; top: 10px; right: 10px; padding: 4px 9px; border-radius: 99px; font: 600 12px var(--mono); background: rgba(0,0,0,.72); color: #fff; backdrop-filter: blur(6px); }

.spy-card .thumb { display: block; }
.spy-card .btn svg { width: 15px; height: 15px; }
.seg.sm button { height: 28px; padding: 0 11px; font-size: 12.5px; }
.spy-profile { margin-bottom: 16px; }
.spy-profile summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.spy-profile summary::-webkit-details-marker { display: none; }
.spy-profile summary small { display: block; color: var(--text-3, var(--text-2)); font-size: 12.5px; margin-top: 3px; }
.spy-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin-top: 16px; }
.spy-fields label span { display: block; font-size: 12px; color: var(--text-2); margin-bottom: 6px; }
.spy-loading { display: grid; place-items: center; gap: 12px; padding: 48px 0; color: var(--text-2); text-align: center; }
.spy-loading svg { width: 28px; height: 28px; color: var(--accent); animation: spin 1.6s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.spy-break { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.spy-break section { padding: 18px; border-radius: 16px; background: var(--surface-2); border: 1px solid var(--line); min-width: 0; }
.spy-break .mine { border-color: var(--accent); background: linear-gradient(180deg, var(--accent-soft), var(--surface-2) 60%); }
.spy-kv { display: grid; grid-template-columns: 84px 1fr; gap: 10px; margin-top: 14px; font-size: 13.5px; }
.spy-kv > span { color: var(--text-2); font-size: 12px; padding-top: 2px; }
.spy-kv.col { grid-template-columns: 1fr; gap: 6px; }
.spy-kv b { font-weight: 500; }
.spy-list { margin: 6px 0 0; padding-left: 18px; font-size: 13.5px; line-height: 1.6; }
.spy-pick { display: flex; width: 100%; text-align: left; justify-content: space-between; gap: 10px; padding: 10px 12px; margin-top: 6px; border-radius: 10px; background: var(--surface); border: 1px solid var(--line); font-size: 13.5px; line-height: 1.45; transition: border-color .2s; }
.spy-pick:hover { border-color: var(--accent); }
.spy-pick svg { width: 14px; height: 14px; flex: none; color: var(--text-2); margin-top: 3px; }
@media (max-width: 720px) { .spy-break { grid-template-columns: 1fr; } }

/* ─── QR ─────────────────────────────────────────────────── */
.qr-frame { width: min(260px, 70vw); padding: 18px; border-radius: 20px; background: #fff; box-shadow: 0 30px 60px -30px rgba(0,0,0,.5); animation: pop .6s var(--ease-spring); }
.qr-frame svg { width: 100%; height: auto; display: block; }
.qr-frame svg rect[fill="#ffffff"], .qr-frame svg rect[fill="white"] { fill: #fff; }
.qr-frame.big { width: min(420px, 82vw); padding: 24px; box-shadow: none; }
.qr-modal { background: #fff; max-width: 520px; text-align: center; padding: 34px 24px; }
.qr-full { display: flex; flex-direction: column; align-items: center; cursor: pointer; }

/* ─── Admin ──────────────────────────────────────────────── */
.leak-row { display: grid; grid-template-columns: 64px 1fr 140px 110px 70px 32px; gap: 8px; align-items: center; margin-bottom: 8px; }
.leak-row .input, .leak-row .select { padding: 8px 10px; font-size: 13px; }
@media (max-width: 900px) { .leak-row { grid-template-columns: 56px 1fr; } .leak-row > :nth-child(n+3) { grid-column: auto; } }

/* ─── Admin: Today board ─────────────────────────────────── */
.admin-tabs { overflow-x: auto; max-width: 100%; scrollbar-width: none; }
.admin-tabs::-webkit-scrollbar { display: none; }
.admin-tabs button { flex: none; }
.today-kpis { margin-bottom: 18px; }
.bad-t { color: var(--bad); } .warn-t { color: var(--warn); }
.today-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 14px; }
.today-card { display: flex; flex-direction: column; gap: 12px; }
.tc-head { display: flex; align-items: center; gap: 12px; }
.tc-name { min-width: 0; flex: 1; } .tc-name b { display: block; } .tc-name small { color: var(--text-3); font-size: 12.5px; }
.tc-touch { font-size: 12px; white-space: nowrap; }
.tc-flags { display: flex; flex-wrap: wrap; gap: 6px; }
.tc-rev { display: flex; align-items: baseline; gap: 8px; font-size: 13px; } .tc-rev b { font-size: 22px; font-weight: 500; }
.tc-leak { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; line-height: 1.5; padding: 10px 12px; border-radius: 12px; background: var(--surface-2); }
.tc-leak svg { width: 15px; height: 15px; flex: none; margin-top: 2px; color: var(--purple); }
.tc-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; }
.tc-actions .badge { margin-left: 2px; }

/* ─── Admin: weekly update, invite, guide, numbers ───────── */
.wk section { display: flex; flex-direction: column; gap: 10px; padding-top: 16px; border-top: 1px solid var(--line); }
.wk section:first-child { border-top: 0; padding-top: 0; }
.wk h4 { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; }
.wk h4 svg { width: 16px; height: 16px; color: var(--purple); }
.wk h4 .faint { font-weight: 400; font-size: 12px; }
.wk-leak { display: grid; grid-template-columns: 1fr 130px 76px; gap: 8px; align-items: center; font-size: 13.5px; }
@media (max-width: 560px) { .wk-leak { grid-template-columns: 1fr 76px; } .wk-leak > span { grid-column: 1 / -1; } }
.wk-check { display: flex; gap: 10px; align-items: center; font-size: 14px; color: var(--text-2); cursor: pointer; }
.wk-check input { width: 18px; height: 18px; accent-color: var(--purple); }
.invite-code { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; border-radius: 14px; background: var(--surface-2); }
.invite-code b { font-size: 20px; letter-spacing: .06em; }
.invite-msg { margin: 0; padding: 16px; border-radius: 14px; border: 1px solid var(--line); white-space: pre-wrap; font: 13.5px/1.6 var(--sans, inherit); color: var(--text-2); }
.g-step { display: grid; grid-template-columns: 30px 1fr; gap: 12px; padding: 12px 0; border-top: 1px solid var(--line); }
.g-step:first-of-type { border-top: 0; }
.g-step p { font-size: 13.5px; margin-top: 4px; line-height: 1.55; }
.g-n { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--purple-soft); color: var(--purple); font: 600 12px var(--mono); }
.num-row { display: grid; grid-template-columns: 1fr 130px 120px 32px; gap: 8px; margin-bottom: 8px; }
.num-row.rev { grid-template-columns: 90px 160px 32px; }
@media (max-width: 640px) { .num-row { grid-template-columns: 1fr 1fr 32px; } .num-row .select { grid-column: 1 / -2; grid-row: 2; } }
.edit-top { flex-wrap: wrap; gap: 10px; }
.edit-lists .file { padding: 10px 0; }
.advanced summary { cursor: pointer; font-size: 13.5px; color: var(--text-2); }
.today-kpis .kpi { padding: 14px 16px; }
.today-kpis .kpi .value { font-size: 24px; }
@container (max-width: 560px) { .today-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; } .today-kpis .kpi { padding: 10px; } .today-kpis .kpi .label { font-size: 10.5px; line-height: 1.3; } .today-kpis .kpi .value { font-size: 20px; } }