/* IpHost status page — Security tab (attack map). Sequential single-hue orange scale: more attempts = more intense orange. */
:root{ --a0:#eceaef; --a1:#fee4cc; --a2:#fdc18c; --a3:#fb9a52; --a4:#f97420; --a5:#e04f00; --abar:#f97420;
  --g-sea1:#ffffff; --g-sea2:#e4e0ea; --g-halo:#fbb47a; --g-grat:rgba(70,66,85,.09); --g-land:#d9d5df; }
/* the page is light-only (see app.css), so the dark scale follows its opt-in theme instead of the OS setting */
:root[data-theme="dark"]{ --g-sea1:#34313f; --g-sea2:#1d1b25; --g-halo:#c25a10; --g-grat:rgba(255,255,255,.07); --g-land:#4a4659; --a0:#3c3948; --a1:#5a3218; --a2:#8a4514; --a3:#c25a10; --a4:#f07a20; --a5:#ffad6b; --abar:#f07a20; }
.atk-ctl{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;margin-bottom:16px}
.atk-cats{display:flex;flex-wrap:wrap;gap:6px}
.atk-cats button{background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:4px 12px;font:inherit;font-size:13px;color:var(--text);cursor:pointer}
.atk-cats button span{color:var(--muted);margin-left:4px;font-variant-numeric:tabular-nums}
.atk-cats button:hover{border-color:var(--brand)}
.atk-cats button[aria-pressed="true"]{background:var(--text);border-color:var(--text);color:var(--surface)}
.atk-cats button[aria-pressed="true"] span{color:inherit;opacity:.85}
.atk .counter b{font-variant-numeric:tabular-nums}
.atk .counter b.atk-topc{font-size:20px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.atk-hint{margin:-10px 0 16px;font-size:13px}
.atk .card>header{flex-wrap:wrap}

.atk-map{padding:12px 12px 8px}
.atk-map svg{display:block;width:100%;height:auto}
.atk-map path,.atk-map circle{stroke:var(--surface);stroke-width:.6;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.atk-map circle{stroke-width:2}
.atk-map .on{stroke:var(--text);stroke-width:1.6}
.b0{fill:var(--a0)}.b1{fill:var(--a1)}.b2{fill:var(--a2)}.b3{fill:var(--a3)}.b4{fill:var(--a4)}.b5{fill:var(--a5)}
.atk-globe{padding:18px 12px 4px}
.atk-globe svg{max-width:560px;margin:0 auto;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none;overflow:visible}
.atk-globe svg:active{cursor:grabbing}
.atk-globe .atk-halo,.atk-globe .atk-shine{stroke:none;pointer-events:none}
.atk-globe .atk-sphere{stroke:none}
.atk-globe .atk-grat{fill:none;stroke:var(--g-grat);stroke-width:1}
.atk-globe .atk-land .b0{fill:var(--g-land)}
.atk-globe .atk-land path{stroke-width:.5}
.atk-globe .atk-dots circle{stroke-width:1.5}
.atk-map .sel{stroke:var(--text);stroke-width:2.2}
.atk-tbl tr[data-cc]{cursor:pointer}
.atk-tbl tr.sel td{background:var(--a1)}
.atk-tbl tr.sel td:nth-child(2){font-weight:700}
.atk-cap{text-align:center;font-size:14px;margin:4px 16px 16px;min-height:1.5em}
.atk-cap b{color:var(--text)}
.atk-leg{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.atk-leg span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.atk-leg i{width:12px;height:12px;border-radius:3px}
.atk-leg i.b0{background:var(--a0)}.atk-leg i.b1{background:var(--a1)}.atk-leg i.b2{background:var(--a2)}.atk-leg i.b3{background:var(--a3)}.atk-leg i.b4{background:var(--a4)}.atk-leg i.b5{background:var(--a5)}

.atk-tbl{width:100%;border-collapse:collapse;font-size:14px}
.atk-tbl th{font-size:12px;font-weight:600;color:var(--muted);text-align:left;padding:8px 16px}
.atk-tbl td{padding:7px 16px;border-top:1px solid var(--line)}
.atk-tbl .r{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.atk-tbl td:first-child,.atk-tbl th:first-child{width:36px;padding-right:0}
.atk-tbl tr.on td{background:var(--bg)}
.atk-barcol{width:38%}
.atk-barcol i{display:block;height:10px;border-radius:0 4px 4px 0;background:var(--abar);min-width:2px}
.atk-more{padding:10px 16px;border-top:1px solid var(--line);text-align:center}

.atk-trend{padding:14px 16px 12px}
.atk-cols{display:flex;align-items:stretch;gap:2px;height:96px;border-bottom:1px solid var(--line)}
.atk-cols i{flex:1 1 0;min-width:2px;display:flex;align-items:flex-end}
.atk-cols b{display:block;width:100%;background:var(--abar);border-radius:3px 3px 0 0}
.atk-cols i.on b{background:var(--text)}
.atk-note{font-size:13px;margin:10px 2px 0;max-width:820px}
@media (max-width:640px){
  .atk-barcol{display:none}
  .atk-tbl th,.atk-tbl td{padding-left:12px;padding-right:12px}
  .atk-map{padding:8px 4px 4px}
}