:root {
  --bg: #0b0a09; --panel: #15120f; --panel2: #1d1915; --line: #2f2922; --text: #f3ece2; --muted: #a2968a;
  --accent: #ff7a1a; --good: #4fd17b; --warn: #f5c542; --bad: #ff4d4d; --radius: 10px;
  --font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; background: var(--bg); color: var(--text); font: 15px/1.5 var(--font); }
a { color: var(--accent); }
h1, h2, h3 { line-height: 1.2; margin: 0 0 .5em; }
h1 { font-size: 1.7rem; } h2 { font-size: 1.15rem; } h3 { font-size: 1rem; }
code { font-family: var(--mono); font-size: .9em; background: var(--panel2); padding: .1em .35em; border-radius: 4px; overflow-wrap: anywhere; }
.muted { color: var(--muted); } .small { font-size: .85rem; } .pad { padding: 20px; }
.shell { display: grid; grid-template-columns: 210px 1fr; min-height: 100%; }
.side { position: sticky; top: 0; height: 100vh; background: var(--panel); border-right: 1px solid var(--line); padding: 16px 10px; display: flex; flex-direction: column; gap: 14px; overflow-y: auto; }
.brand { display: flex; align-items: center; gap: 10px; color: var(--text); text-decoration: none; padding: 2px 8px; line-height: 1.15; }
.brand b { color: var(--accent); }
.brand-mark { width: 30px; height: 30px; flex: none; border-radius: 50%; border: 2px solid var(--accent); background: radial-gradient(circle, var(--accent) 0 3px, transparent 4px); }
nav { display: flex; flex-direction: column; gap: 2px; flex: 1; }
nav a { display: flex; gap: 10px; align-items: center; padding: 9px 10px; border-radius: 8px; color: var(--text); text-decoration: none; white-space: nowrap; }
nav a:hover { background: var(--panel2); }
nav a[aria-current="page"] { background: #2a1b0e; color: var(--accent); }
nav .ico { width: 1.3em; text-align: center; }
.account { font-size: .82rem; color: var(--muted); padding: 0 8px; }
.main { padding: 22px; max-width: 1180px; width: 100%; outline: none; min-width: 0; }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; margin-bottom: 14px; min-width: 0; }
.grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); margin-bottom: 14px; }
.two { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
.stat { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; }
.stat .n { font: 700 1.6rem var(--mono); } .stat .l { color: var(--muted); font-size: .8rem; }
.hero { padding: 26px; background: linear-gradient(135deg, #24150a, var(--panel)); }
.hero p { max-width: 62ch; }
.btn { display: inline-block; border: 1px solid var(--line); background: var(--panel2); color: var(--text); padding: 9px 14px; border-radius: 8px; font: inherit; text-decoration: none; cursor: pointer; margin: 3px 6px 3px 0; }
.btn:hover { border-color: var(--accent); }
.btn.primary { background: var(--accent); border-color: var(--accent); color: #180c02; font-weight: 700; }
.btn:focus-visible, a:focus-visible, .row:focus-visible, circle:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.row { display: flex; gap: 10px; align-items: center; justify-content: space-between; padding: 11px 4px; border-bottom: 1px solid var(--line); color: var(--text); text-decoration: none; }
.row:last-child { border-bottom: 0; } .row:hover { background: var(--panel2); }
.row .who { min-width: 0; overflow: hidden; } .row .name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.row .right { text-align: right; white-space: nowrap; font-family: var(--mono); font-size: .9rem; }
.pill { display: inline-block; padding: 1px 8px; border-radius: 99px; font-size: .75rem; border: 1px solid var(--line); margin-right: 4px; white-space: nowrap; }
.pill.bad { color: var(--bad); border-color: var(--bad); } .pill.warn { color: var(--warn); border-color: var(--warn); } .pill.good { color: var(--good); border-color: var(--good); }
.up { color: var(--good); } .down { color: var(--bad); }
.banner { padding: 11px 14px; border-radius: 8px; margin-bottom: 12px; border: 1px solid var(--bad); background: #2a1010; }
.banner.warn { border-color: var(--warn); background: #2a2310; }
.radar { display: block; width: 100%; max-width: 520px; margin: 0 auto; }
.radar .ring { fill: none; stroke: #3a2c1e; } .radar .sweep { fill: rgba(255, 122, 26, .16); transform-origin: 200px 200px; animation: spin 6s linear infinite; }
.radar circle.dot { cursor: pointer; stroke: #0b0a09; stroke-width: 1.5; } .radar text { fill: var(--muted); font-size: 10px; }
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .radar .sweep { animation: none; } }
.legend { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; font-size: .8rem; color: var(--muted); margin-top: 8px; }
.legend i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 5px; }
.legend i.c4fd17b { background: #4fd17b; } .legend i.cff7a1a { background: #ff7a1a; } .legend i.cf5c542 { background: #f5c542; } .legend i.cff4d4d { background: #ff4d4d; }
.chart { width: 100%; height: 170px; display: block; } .chart .line { fill: none; stroke: var(--accent); stroke-width: 2; vector-effect: non-scaling-stroke; } .chart .base { stroke: var(--muted); stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
.tbl { width: 100%; border-collapse: collapse; font-size: .9rem; } .tbl th, .tbl td { text-align: right; padding: 9px 6px; border-bottom: 1px solid var(--line); } .tbl th:first-child, .tbl td:first-child { text-align: left; } .tbl th { color: var(--muted); font-weight: 500; }
.scroll { overflow-x: auto; }
.rich { white-space: pre-line; overflow-wrap: anywhere; }
.choice { display: block; width: 100%; text-align: left; margin: 6px 0; }
.topics { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
.login-widget { min-height: 48px; margin: 10px 0; }
@media (max-width: 760px) {
  .shell { display: block; padding-bottom: 66px; }
  .side { position: fixed; z-index: 5; bottom: 0; left: 0; right: 0; top: auto; height: auto; flex-direction: row; padding: 4px; border-right: 0; border-top: 1px solid var(--line); padding-bottom: max(4px, env(safe-area-inset-bottom)); }
  .brand, .account { display: none; }
  nav { flex-direction: row; overflow-x: auto; gap: 0; }
  nav a { flex-direction: column; gap: 0; font-size: .68rem; padding: 5px 9px; }
  nav .ico { font-size: 1.15rem; }
  .main { padding: 14px; } .two { grid-template-columns: minmax(0, 1fr); } h1 { font-size: 1.4rem; } .hero { padding: 18px; }
}

/* Risk levels (bot: Get-RiskTier). Strobes pulse 2 times a second, under the 3-per-second photosensitivity limit
   (WCAG 2.3.1). Reduced-motion settings get a steady coloured edge and no fireworks. */
.risk-rug { --fx: #ff2a2a; } .risk-high { --fx: #ffc400; } .risk-good { --fx: #2bff6a; } .risk-gem { --fx: #ffcd28; }
.row[class*="risk-"] { box-shadow: inset 4px 0 0 var(--fx); padding-left: 12px; }
.row.risk-rug, .row.risk-high, .row.risk-good { animation: strobe-row .5s cubic-bezier(.2, .8, .3, 1) infinite; }
@keyframes strobe-row { 0% { box-shadow: inset 4px 0 0 var(--fx), inset 90px 0 50px -50px var(--fx); } 100% { box-shadow: inset 4px 0 0 var(--fx); } }
.card.risk { position: relative; overflow: hidden; border: 2px solid var(--fx); }
.card.risk > :not(.fx-fireworks) { position: relative; z-index: 1; }
.card.risk h2 { color: var(--fx); letter-spacing: .02em; }
.card.risk-rug, .card.risk-high, .card.risk-good { animation: strobe-card .5s cubic-bezier(.2, .8, .3, 1) infinite; }
@keyframes strobe-card { 0% { box-shadow: 0 0 28px 4px var(--fx), inset 0 0 34px -12px var(--fx); } 100% { box-shadow: 0 0 4px 0 var(--fx); } }
.card.risk-gem { min-height: 190px; box-shadow: 0 0 20px 2px var(--fx); background: radial-gradient(ellipse at top, #2a2108, var(--panel) 70%); }
.fx-fireworks { position: absolute; inset: 0; pointer-events: none; }
.fx-fireworks .b { position: absolute; width: 0; height: 0; }
.fx-fireworks i { position: absolute; left: 0; top: 0; width: 6px; height: 6px; margin: -3px; border-radius: 50%; opacity: 0;
  background: var(--c1); box-shadow: 0 0 9px 2px var(--c1); animation: spark 1.8s cubic-bezier(.15, .7, .3, 1) infinite; animation-delay: var(--d); }
.fx-fireworks i:nth-child(even) { background: var(--c2); box-shadow: 0 0 9px 2px var(--c2); }
@keyframes spark { 0% { opacity: 1; transform: rotate(var(--a)) translateY(0) scale(1.3); } 75% { opacity: .85; } 100% { opacity: 0; transform: rotate(var(--a)) translateY(-70px) scale(.3); } }
.b1 { left: 10%; top: 30%; --c1: #ffd700; --c2: #ff3cc8; --d: 0s; } .b2 { left: 86%; top: 22%; --c1: #00e6ff; --c2: #fff; --d: .3s; }
.b3 { left: 50%; top: 12%; --c1: #50ff78; --c2: #ffd700; --d: .6s; } .b4 { left: 26%; top: 78%; --c1: #ff3cc8; --c2: #00e6ff; --d: .9s; }
.b5 { left: 70%; top: 72%; --c1: #ff7a1e; --c2: #aa5aff; --d: 1.2s; } .b6 { left: 94%; top: 88%; --c1: #fff; --c2: #ffd700; --d: 1.5s; }
.s0 { --a: 0deg; } .s1 { --a: 30deg; } .s2 { --a: 60deg; } .s3 { --a: 90deg; } .s4 { --a: 120deg; } .s5 { --a: 150deg; }
.s6 { --a: 180deg; } .s7 { --a: 210deg; } .s8 { --a: 240deg; } .s9 { --a: 270deg; } .s10 { --a: 300deg; } .s11 { --a: 330deg; }
@media (prefers-reduced-motion: reduce) { .row[class*="risk-"], .card.risk { animation: none; } .fx-fireworks { display: none; } }