:root{
  --shell-gap:12px;
  --rail-width:420px;
  --sticky-top:78px;
  --live-table-max:calc(100vh - 265px);
  --bg-deep:#071018;
  --bg-panel:#0f1823;
  --bg-panel-soft:#132131;
  --line:#203246;
  --line-strong:#35506f;
  --ink:#e8eef7;
  --muted:#91a6bf;
  --accent-cyan:#73c9ff;
  --accent-amber:#ffcf73;
  --accent-coral:#ff8e8e;
  --accent-violet:#d59bff;
  --accent-mint:#74efb8;
}
*{box-sizing:border-box}
html,body{
  margin:0;
  padding:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Noto Sans JP","Noto Sans",sans-serif;
  background:
    radial-gradient(circle at top left,rgba(115,201,255,.12),transparent 28%),
    radial-gradient(circle at top right,rgba(213,155,255,.09),transparent 26%),
    linear-gradient(180deg,#08111a,#060d14 58%,#09121d);
  color:var(--ink);
  overflow-x:hidden;
}
html{color-scheme:dark}

.bar{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;background:#0f1622;border-bottom:1px solid #1e2a3a;position:sticky;top:0;z-index:10;gap:12px}
.left{display:flex;flex-direction:column;gap:2px}
.title{font-weight:900;letter-spacing:.2px}
.sub{font-size:12px;color:#8ea0b7}
.right{display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.meta{display:flex;align-items:center;gap:8px;color:#b8c4d6;font-size:12px;flex-wrap:wrap;justify-content:flex-end}
.meta2{color:#8ea0b7;font-size:12px}
.sep{opacity:.5}
.dot{width:10px;height:10px;border-radius:999px;display:inline-block;background:#666}
.dot.on{background:#39d98a}
.dot.off{background:#f05d5e}
.wrap{max-width:1720px;margin:16px auto;padding:0 12px;display:flex;flex-direction:column;gap:12px}
.card{background:#0f1622;border:1px solid #1e2a3a;border-radius:14px;padding:12px}
.trackerWorkspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,var(--rail-width));gap:var(--shell-gap);align-items:start}
.trackerPrimary,.trackerRail{display:flex;flex-direction:column;gap:var(--shell-gap);min-width:0}
.trackerRail{position:sticky;top:var(--sticky-top);max-height:calc(100vh - var(--sticky-top) - 14px);overflow:auto;padding-right:4px}
.trackerRail::-webkit-scrollbar{width:8px}
.trackerRail::-webkit-scrollbar-thumb{background:#1e2e40;border-radius:999px}
.liveCard{display:flex;flex-direction:column;min-height:0}
.hero{padding:10px 14px}
.heroTop{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.heroBtns{display:flex;gap:8px;flex-wrap:wrap}
.ctrlRow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ctrlSep{flex:1}
.ctrlLabel{font-size:11px;font-weight:700;color:#5a7aaa;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}
.settingsCard{padding:10px 14px}
.pill.sm{padding:4px 10px;border-radius:999px}
.pill.sm span{font-size:11px;color:#8ea0b7}
.pill.sm input{height:26px;width:44px;padding:0 6px;font-size:12px;text-align:center;border-radius:7px}
.pill.sm select{height:26px;padding:0 6px;font-size:12px;border-radius:7px}
.row{display:flex;gap:12px;flex-wrap:wrap}
.row.tight{gap:8px}
.between{justify-content:space-between;align-items:center}
.field{flex:1;min-width:240px}
label{display:block;font-size:12px;color:#b8c4d6;margin-bottom:6px}
input,select,textarea{padding:10px 10px;border-radius:12px;border:1px solid #223249;background:#0b101a;color:#e7edf5;outline:none}
textarea{width:100%;min-height:40px;max-height:80px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;margin-top:10px;resize:vertical}
select,input{height:40px}
.hint{font-size:12px;color:#8ea0b7;margin-top:6px}
.hintTop{font-size:12px;color:#8ea0b7}
.h2{font-weight:900;margin-bottom:6px}
button{padding:10px 12px;border-radius:12px;border:1px solid #223249;background:#0b101a;color:#e7edf5;cursor:pointer;white-space:nowrap}
button:hover{border-color:#2f4666}
button.primary{background:#184dff;border-color:#184dff}
button.danger{background:#2a0f12;border-color:#5b1e25}
button,input,select,textarea,.livePlayerCard{touch-action:manipulation;-webkit-tap-highlight-color:rgba(115,201,255,.18)}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.livePlayerCard:focus-visible{
  outline:2px solid rgba(115,201,255,.8);
  outline-offset:2px;
  border-color:#4f7bad;
}
.pill{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid #223249;border-radius:999px;background:#0b101a}
.pill span{color:#b8c4d6;font-size:12px}
.pill button{padding:8px 10px;border-radius:999px}
.advanced{margin-top:12px}
.tableWrap{overflow:auto;border-radius:12px;border:1px solid #223249;margin-top:10px}
.tableWrap--live{max-height:var(--live-table-max);min-height:380px;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.liveCardsShell{
  padding:12px;
  font-size:0;
  background:
    radial-gradient(circle at top left,rgba(115,201,255,.13),transparent 34%),
    radial-gradient(circle at 85% 0,rgba(255,207,115,.08),transparent 30%),
    linear-gradient(180deg,rgba(12,22,34,.98),rgba(7,12,20,.98));
}
.liveCardList{display:grid;grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:12px;align-content:start;font-size:14px}
.livePlayerCard{
  --card-accent:#73c9ff;
  --card-glow:rgba(115,201,255,.18);
  --card-bg-top:rgba(17,28,41,.96);
  --card-bg-bottom:rgba(8,14,23,.98);
  --card-edge:rgba(69,102,139,.55);
  position:relative;
  display:flex;
  flex-direction:column;
  gap:8px;
  font-size:14px;
  padding:12px;
  border:1px solid var(--card-edge);
  border-radius:22px;
  background:
    radial-gradient(circle at 100% 0,var(--card-glow),transparent 45%),
    linear-gradient(180deg,var(--card-bg-top),var(--card-bg-bottom)),
    linear-gradient(135deg,rgba(255,255,255,.04),transparent 42%);
  box-shadow:0 12px 28px rgba(0,0,0,.26);
  cursor:pointer;
  overflow:hidden;
  isolation:isolate;
  content-visibility:auto;
  contain-intrinsic-size:156px;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.livePlayerCard::before{
  content:"";
  position:absolute;
  inset:-18% 44% 48% -8%;
  background:radial-gradient(circle,var(--card-glow),transparent 72%);
  pointer-events:none;
}
.livePlayerCard::after{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  background:linear-gradient(90deg,var(--card-accent),transparent 72%);
  opacity:.9;
  pointer-events:none;
}
.livePlayerCard > *{position:relative;z-index:1}
.livePlayerCard:hover{transform:translateY(-2px);box-shadow:0 20px 38px rgba(0,0,0,.34)}
.livePlayerCard.is-active{border-color:#6ebfff;box-shadow:0 0 0 1px rgba(110,191,255,.28),0 22px 42px rgba(0,0,0,.36)}
.livePlayerCard.state-POST_MATCH_WAIT,.livePlayerCard.state-LOBBY{--card-accent:#73c9ff;--card-glow:rgba(115,201,255,.22);--card-bg-top:rgba(11,31,46,.96);--card-bg-bottom:rgba(7,16,27,.99);--card-edge:rgba(70,124,165,.58)}
.livePlayerCard.state-IN_MATCH{--card-accent:#74efb8;--card-glow:rgba(116,239,184,.22);--card-bg-top:rgba(10,34,28,.96);--card-bg-bottom:rgba(7,18,15,.99);--card-edge:rgba(67,126,105,.58)}
.livePlayerCard.state-IN_TOURNAMENT_DEEP,.livePlayerCard.state-RETURNING{--card-accent:#d59bff;--card-glow:rgba(213,155,255,.24);--card-bg-top:rgba(29,18,44,.97);--card-bg-bottom:rgba(13,11,24,.99);--card-edge:rgba(114,82,150,.56)}
.livePlayerCard.state-NOT_FOUND{--card-accent:#ffcf73;--card-glow:rgba(255,207,115,.2);--card-bg-top:rgba(42,27,9,.96);--card-bg-bottom:rgba(21,15,8,.99);--card-edge:rgba(140,100,39,.55)}
.livePlayerCard.state-NAME_CHANGED{--card-accent:#8fe3ff;--card-glow:rgba(143,227,255,.22);--card-bg-top:rgba(10,30,40,.96);--card-bg-bottom:rgba(8,16,24,.99);--card-edge:rgba(69,118,140,.55)}
.livePlayerCard.state-BANNED{--card-accent:#ff8e8e;--card-glow:rgba(255,142,142,.24);--card-bg-top:rgba(42,13,16,.97);--card-bg-bottom:rgba(20,9,11,.99);--card-edge:rgba(145,71,77,.55)}
.livePlayerCard.state-OFFLINE,.livePlayerCard.state-UNKNOWN{--card-accent:#8fa0b5;--card-glow:rgba(143,160,181,.12);--card-bg-top:rgba(20,25,33,.95);--card-bg-bottom:rgba(10,13,19,.99);--card-edge:rgba(72,82,96,.48)}
.livePlayerCard.cat-cheater{--card-accent:#ff6678;--card-edge:rgba(214,78,96,.96);box-shadow:inset 0 0 0 1px rgba(214,78,96,.32),0 0 0 1px rgba(214,78,96,.16),0 12px 28px rgba(0,0,0,.26)}
.livePlayerCard.cat-suspicious{--card-accent:#ffb04d;--card-edge:rgba(173,113,44,.92);box-shadow:inset 0 0 0 1px rgba(173,113,44,.2),0 0 0 1px rgba(173,113,44,.12),0 12px 28px rgba(0,0,0,.26)}
.livePlayerCard.cat-pro{--card-edge:rgba(178,145,49,.88);box-shadow:inset 0 0 0 1px rgba(178,145,49,.14),0 12px 28px rgba(0,0,0,.26)}
.livePlayerCard.cat-notable{--card-edge:rgba(69,132,166,.82);box-shadow:inset 0 0 0 1px rgba(69,132,166,.12),0 12px 28px rgba(0,0,0,.26)}
.livePlayerCard.is-danger{--card-accent:#ff8e8e;--card-glow:rgba(255,142,142,.18)}
.livePlayerCard.is-watch{--card-accent:#d59bff;--card-glow:rgba(213,155,255,.18)}
.liveCardTop{display:flex;gap:10px;align-items:flex-start}
.liveCardPick,.liveCardAction,.detailActionBtn,.liveDetailClose{font:inherit}
.liveCardMain{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}
.liveCardHeadline{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.liveCardHeadMain{min-width:0;display:flex;flex-direction:column;gap:6px}
.liveCardName{
  font-size:14px;
  font-weight:900;
  color:#f5f8ff;
  line-height:1.2;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.liveCardHeadMain .liveStatePill{align-self:flex-start}
.liveCardSide{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex-shrink:0;max-width:136px}
.liveCardSideMeta{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;max-width:136px}
.liveCardPin{
  min-width:24px;
  height:24px;
  padding:0 7px;
  border-radius:999px;
  border:1px solid rgba(181,130,37,.65);
  background:rgba(52,34,8,.86);
  color:#ffe3a4;
  font-size:11px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.liveCardPick{
  width:30px;
  height:30px;
  border-radius:11px;
  border:1px solid rgba(86,110,138,.65);
  background:rgba(8,14,23,.88);
  color:#8ea0b7;
  font-size:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.liveCardPick:hover{color:#ffe3a4;border-color:#b58225;background:#251806}
.liveCardPick.is-on{color:#ffe3a4;border-color:#b58225;background:#342208}
.liveCardRank{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end;text-align:right}
.liveCardRank .rankNum{margin-left:0}
.liveCardMeta{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.liveFlagRail{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end;min-width:0}
.liveFlag{
  min-width:22px;
  height:20px;
  padding:0 6px;
  border-radius:999px;
  border:1px solid rgba(74,102,131,.56);
  background:rgba(9,17,27,.76);
  color:#dce8f5;
  font-size:10px;
  font-weight:800;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}
.liveFlag.is-region{background:rgba(15,23,35,.78);color:#9bc2ee}
.liveFlag.is-cat-cheater,.liveFlag.is-ban{background:rgba(58,11,15,.88);border-color:rgba(142,57,67,.72);color:#ffb7b7}
.liveFlag.is-cat-suspicious,.liveFlag.is-missing{background:rgba(57,34,10,.88);border-color:rgba(150,101,33,.72);color:#ffd18b}
.liveFlag.is-cat-notable,.liveFlag.is-name{background:rgba(10,33,45,.88);border-color:rgba(51,105,135,.72);color:#a9ebff}
.liveFlag.is-cat-pro{background:rgba(44,38,10,.88);border-color:rgba(146,122,34,.72);color:#ffe27b}
.liveFlag.is-error{background:rgba(44,25,10,.88);border-color:rgba(146,103,34,.72);color:#ffd28e}
.liveFlag.is-manual{background:rgba(37,15,44,.88);border-color:rgba(113,69,145,.72);color:#e5c0ff}
.liveStatePill{
  display:inline-flex;
  align-items:center;
  padding:4px 8px;
  border-radius:999px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.35px;
  text-transform:uppercase;
  border:1px solid #2a405d;
  background:#10192a;
  color:#b8c4d6;
}
.liveStatePill.POST_MATCH_WAIT,.liveStatePill.LOBBY{color:#97d8ff;border-color:#2d6fa1;background:rgba(11,34,52,.88)}
.liveStatePill.IN_MATCH{color:#8ef3c5;border-color:#24785d;background:rgba(10,34,27,.88)}
.liveStatePill.IN_TOURNAMENT_DEEP,.liveStatePill.RETURNING{color:#e0bbff;border-color:#784ea6;background:rgba(31,16,45,.9)}
.liveStatePill.OFFLINE,.liveStatePill.UNKNOWN{color:#b3c0cf;border-color:#45566b;background:rgba(20,29,41,.88)}
.liveStatePill.NOT_FOUND{color:#ffd995;border-color:#9b6514;background:rgba(42,24,8,.9)}
.liveStatePill.BANNED{color:#ffb0b0;border-color:#8a3434;background:rgba(42,12,14,.9)}
.liveStatePill.NAME_CHANGED{color:#9be9ff;border-color:#2a6f8f;background:rgba(10,27,38,.9)}
.liveCardSignal{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid rgba(71,97,124,.55);
  background:rgba(8,15,24,.72);
  color:#cfe0f3;
  font-size:10px;
  line-height:1.35;
  font-variant-numeric:tabular-nums;
}
.liveCardCompact{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,88px) 20px;
  gap:8px;
  align-items:stretch;
}
.liveCardStat{
  border:1px solid rgba(66,94,120,.38);
  background:rgba(7,13,21,.54);
  border-radius:14px;
  min-width:0;
  padding:9px 10px;
}
.liveCardStat.is-delta{padding-right:8px}
.liveCardStatLabel{
  font-size:9px;
  font-weight:700;
  letter-spacing:.24px;
  color:#96afca;
  margin-bottom:4px;
}
.liveCardStatValue{
  font-size:15px;
  font-weight:900;
  color:#f8fbff;
  line-height:1.05;
  font-variant-numeric:tabular-nums;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.liveCardStatValue.is-positive,.liveDetailMetricValue.is-positive{color:#8ef3c5}
.liveCardStatValue.is-negative,.liveDetailMetricValue.is-negative{color:#ff9d9d}
.liveCardPeek{
  align-self:center;
  justify-self:end;
  color:#84b7eb;
  font-size:20px;
  line-height:1;
  opacity:.88;
}
.liveCardFooter{padding-top:2px;border-top:1px solid rgba(67,95,124,.22)}
.liveCardQuickRow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
.liveCardQuick{
  height:24px;
  padding:0 6px;
  border-radius:8px;
  font-size:9px;
  font-weight:800;
  letter-spacing:.18px;
}
.liveCardActions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;min-width:0}
.encQuickGroup{position:relative}
.encQuickMenu{
  display:none;
  position:absolute;
  top:30px;
  left:0;
  z-index:30;
  min-width:104px;
  padding:4px;
  border-radius:10px;
  border:1px solid #27415f;
  background:rgba(8,16,26,.98);
  box-shadow:0 12px 26px rgba(0,0,0,.36);
}
.encQuickSubBtn{
  display:block;
  width:100%;
  padding:6px 8px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#d9e7ff;
  text-align:left;
  font-size:11px;
  cursor:pointer;
}
.encQuickSubBtn:hover,.encQuickSubBtn:focus-visible{background:rgba(115,201,255,.14)}
.liveQuickBtn,.liveCardActions .encQuickGroupBtn{
  width:100%;
  min-width:0;
  height:30px;
  padding:0 9px;
  border-radius:10px;
  font-size:10px;
  font-weight:800;
  line-height:1;
  letter-spacing:.2px;
}
.liveQuickBtn,.liveCardActions .encQuickGroupBtn{
  border:1px solid rgba(74,107,138,.7);
  background:rgba(12,24,38,.84);
  color:#def0ff;
}
.liveQuickBtn.is-win{border-color:#2e7d59;background:rgba(10,34,27,.9);color:#d7ffe9}
.liveQuickBtn.is-off{border-color:#5b6674;background:rgba(20,29,41,.9);color:#dae3ef}
.liveCardAction{
  align-self:flex-end;
  height:28px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(76,115,157,.75);
  background:rgba(11,23,35,.88);
  color:#e4f1ff;
  font-size:10px;
  font-weight:800;
  letter-spacing:.18px;
  text-transform:none;
}
.liveCardAction:hover{border-color:#8acfff;color:#fff}
body.detail-open{overflow:hidden}
.liveDetailOverlay{position:fixed;inset:0;z-index:70;display:flex;justify-content:flex-end;opacity:0;pointer-events:none;transition:opacity .18s ease}
.liveDetailOverlay.open{opacity:1;pointer-events:auto}
.liveDetailScrim{position:absolute;inset:0;background:rgba(4,8,12,.68);backdrop-filter:blur(5px)}
.liveDetailPanel{
  position:relative;
  z-index:1;
  width:min(540px,100%);
  height:100%;
  display:flex;
  flex-direction:column;
  background:
    radial-gradient(circle at top left,rgba(115,201,255,.12),transparent 28%),
    radial-gradient(circle at top right,rgba(255,207,115,.08),transparent 26%),
    linear-gradient(180deg,rgba(13,20,31,.99),rgba(8,12,20,.99));
  border-left:1px solid #2a415c;
  box-shadow:-18px 0 48px rgba(0,0,0,.38);
  transform:translateX(26px);
  transition:transform .18s ease;
  overscroll-behavior:contain;
}
.liveDetailOverlay.open .liveDetailPanel{transform:translateX(0)}
.liveDetailPanelHead{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 18px 14px;border-bottom:1px solid #22344b}
.liveDetailClose{
  width:38px;
  height:38px;
  padding:0;
  border-radius:12px;
  border:1px solid #2b4360;
  background:#0b101a;
  color:#b6c7dc;
  font-size:15px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.liveDetailBody{flex:1;overflow:auto;padding:18px;overscroll-behavior:contain}
.liveDetailPlaceholder{
  min-height:100%;
  display:grid;
  place-items:center;
  padding:28px;
  border:1px dashed #35506f;
  border-radius:18px;
  background:rgba(10,16,26,.55);
  color:#8098b6;
  text-align:center;
  line-height:1.6;
}
.liveDetailContent{display:flex;flex-direction:column;gap:14px}
.liveDetailSummary,.liveDetailSection{
  padding:15px;
  border:1px solid rgba(53,80,111,.7);
  border-radius:18px;
  background:rgba(9,15,24,.82);
}
.liveDetailTitleRow{display:flex;gap:12px;justify-content:space-between;align-items:flex-start;flex-wrap:wrap}
.liveDetailName{font-size:22px;font-weight:900;line-height:1.1;color:#f4f7ff;word-break:break-word}
.liveDetailExplain{margin-top:8px;font-size:12px;color:#8aa0ba;line-height:1.6}
.liveDetailBadges{display:flex;gap:6px;flex-wrap:wrap;align-items:center;justify-content:flex-end}
.liveDetailMetrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}
.liveDetailMetric{
  padding:11px 12px;
  border-radius:14px;
  border:1px solid rgba(58,84,112,.58);
  background:rgba(9,16,26,.76);
}
.liveDetailMetricLabel{font-size:10px;font-weight:700;letter-spacing:.2px;color:#7f9abb;margin-bottom:5px}
.liveDetailMetricValue{font-size:14px;font-weight:800;color:#eef4ff;line-height:1.35}
.liveDetailActions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.detailActionBtn{
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(76,115,157,.75);
  background:rgba(11,23,35,.88);
  color:#d8e7ff;
  font-size:11px;
  font-weight:800;
}
.detailActionBtn:hover{border-color:#8acfff;color:#fff}
.detailActionBtn.is-on{color:#ffe3a4;border-color:#b58225;background:#342208}
.detailActionBtn.is-danger{color:#ffb0b0;border-color:#8a3434;background:#2a0f12}
.liveDetailControlGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.liveDetailControl{display:flex;flex-direction:column;gap:6px;min-width:0}
.liveDetailControlLabel{font-size:11px;font-weight:700;letter-spacing:.2px;color:#7f9abb}
.liveDetailControl select,.liveDetailControl textarea{width:100%}
.liveDetailControl textarea{min-height:120px;max-height:220px;margin-top:0;resize:vertical}
table{width:100%;border-collapse:collapse}
th,td{padding:11px 14px;border-bottom:1px solid #131d2b;font-size:13px;white-space:nowrap;vertical-align:middle}
th{position:sticky;top:0;background:#0d1520;text-align:left;color:#7a9ab8;font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid #1e2a3a}
td.num,th.num{text-align:right}
tbody tr:nth-child(even){background:rgba(255,255,255,.018)}
tbody tr:hover{background:rgba(24,77,255,.07)}
tbody tr td:first-child{font-weight:600;color:#cfe0ff}
.state{font-weight:700;font-size:13px}
.state.IN_MATCH{color:#39d98a}
.state.POST_MATCH_WAIT,.state.LOBBY{color:#5b9cf6}
.state.IN_TOURNAMENT_DEEP,.state.RETURNING{color:#c77dff}
.state.OFFLINE{color:#8ea0b7}
.state.BANNED{color:#ff4444}
.state.NOT_FOUND{color:#ff9944}
.state.NAME_CHANGED{color:#6de9ff}
.state.UNKNOWN{color:#5a7aaa}
.foot{color:#8ea0b7;font-size:12px;padding:16px;text-align:center}
.sparkWrap{display:flex;flex-direction:column;gap:8px;padding:4px 0}
.sparkBar{width:9px;border-radius:6px;background:#184dff;opacity:.85;transition:opacity .2s}
.sparkBar.low{opacity:.2}
.sparkBar.mid{opacity:.5}
.sparkBar.peak{background:#39d98a;opacity:1;box-shadow:0 0 8px rgba(57,217,138,.5)}
.sparkHotCount{display:flex;align-items:center;gap:6px;flex-shrink:0}
.psItem{background:#0b101a;border:1px solid #1e2a3a;border-radius:10px;padding:10px 12px}
.psHeader{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.psName{font-weight:700;color:#cfe0ff;font-size:13px}
.psTag{color:#5a7aaa;font-weight:400;font-size:11px}
.psPct{font-size:16px;font-weight:900}
.psGraph{display:flex;flex-direction:column;gap:3px}
.psBars{display:flex;align-items:flex-end;gap:3px}
.psAxis{display:flex;justify-content:space-between;padding:0 1px;margin-top:3px}
.psAxis span{font-size:10px;color:#5a7aaa}
.psEmpty{color:#5a7aaa;font-size:13px;padding:16px 0;text-align:center}
.nameCell{cursor:pointer;user-select:none;display:flex;align-items:center;gap:4px;flex-wrap:nowrap;white-space:nowrap}
.nameCell:hover .expandCaret{color:#b8c4d6}
.playerName{flex-shrink:1;overflow:hidden;text-overflow:ellipsis;min-width:60px}
.expandCaret{font-size:9px;color:#5a7aaa;margin-left:auto;flex-shrink:0}
.expandRow .expandCell{padding:8px 16px 12px!important;background:#090d14;border-top:none}
.toast{position:fixed;right:16px;bottom:16px;max-width:560px;padding:10px 12px;border-radius:12px;border:1px solid #223249;background:#0f1622;color:#e7edf5;display:none;box-shadow:0 10px 40px rgba(0,0,0,.35)}
.toast.show{display:block}
.toast b{color:#cfe0ff}
code{background:#0b101a;border:1px solid #223249;padding:2px 6px;border-radius:8px}

.checkbox{display:flex;align-items:center;gap:8px;user-select:none}
.sectionLabel{font-size:11px;font-weight:700;color:#5a7aaa;text-transform:uppercase;letter-spacing:.6px;margin-top:14px;margin-bottom:6px}
.matchTimeRow{margin-bottom:4px}
.advSection{margin-top:14px;padding-top:12px;border-top:1px solid #1e2a3a}
.advLabel{font-size:11px;font-weight:700;color:#5a7aaa;text-transform:uppercase;letter-spacing:.6px;margin-bottom:8px}
.muted{font-size:12px;color:#8ea0b7}
.advanced summary{cursor:pointer;color:#b8c4d6;font-weight:700;padding:10px 0 4px;font-size:13px}
.advanced summary:hover{color:#e7edf5}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}
.rankCell{white-space:nowrap}
.rankNum{font-variant-numeric:tabular-nums;font-size:12px;color:#8ea0b7;margin-left:4px}
.badge{display:inline-block;font-size:10px;font-weight:900;padding:2px 7px;border-radius:999px;letter-spacing:.3px;text-transform:uppercase;vertical-align:middle}
.badge-ruby{background:#3d0f1a;color:#ff6b8a;border:1px solid #8a1f35}
.badge-diamond{background:#0f2a3d;color:#6de9ff;border:1px solid #1e5a7a}
.badge-platinum{background:#1a2535;color:#c0d8e8;border:1px solid #3a5070}
.badge-gold{background:#2d2200;color:#f5c842;border:1px solid #6a5000}
.badge-silver{background:#1e2530;color:#a8b8c8;border:1px solid #3a4a5a}
.badge-bronze{background:#2a1800;color:#c48a4a;border:1px solid #5a3a10}
.searchHero{padding:20px 0 8px}
.searchHint{font-size:12px;color:#5a7aaa;text-align:center;margin-top:8px}
.bigSearchWrap{position:relative;max-width:860px;margin:0 auto}
.bigSearchBar{display:flex;align-items:center;gap:12px;background:#0f1622;border:1px solid #223249;border-radius:16px;padding:10px 10px 10px 20px;transition:border-color .2s;box-shadow:0 4px 24px rgba(0,0,0,.35)}
.bigSearchBar:focus-within{border-color:#3a5580;box-shadow:0 4px 32px rgba(24,77,255,.15)}
.searchIcon{color:#5a7aaa;flex-shrink:0}
.bigSearchBar input{flex:1;border:none;background:transparent;color:#e7edf5;font-size:16px;height:40px;outline:none;min-width:0}
.bigSearchBar input::placeholder{color:#5a7aaa;font-size:15px}
.bigSearchBar #btnAdd{padding:10px 28px;border-radius:12px;font-size:14px;font-weight:700;flex-shrink:0}
.suggestions{position:absolute;left:0;right:0;top:calc(100% + 3px);z-index:100;background:#162030;border:1px solid #3a5580;border-radius:10px;overflow:hidden;display:none;box-shadow:0 8px 32px rgba(0,0,0,.7)}
.suggestions.open{display:block}
.suggItem{display:flex;align-items:center;gap:10px;padding:9px 14px;cursor:pointer;font-size:13px;border-bottom:1px solid #1e2a3a}
.suggItem:last-child{border-bottom:none}
.suggItem:hover{background:#1e3050}
.suggRank{color:#5a7aaa;font-size:11px;min-width:42px;font-variant-numeric:tabular-nums}
.suggName{color:#e7edf5;font-weight:700;flex:1}
.suggAlt{color:#8ea0b7;font-size:11px}
.checkbox input{transform:translateY(1px)}
.state.NOT_FOUND{color:#ff9944}
.state.BANNED{color:#ff5555}
.state.NAME_CHANGED{color:#6de9ff}
.modeTabs{display:flex;gap:6px;margin-bottom:12px}
.modeTab{padding:6px 18px;border-radius:999px;font-size:12px;font-weight:700;color:#8ea0b7}
.modeTab.active{background:#184dff;border-color:#184dff;color:#fff}
.resetBtn{padding:3px 8px;font-size:11px;border-radius:8px;opacity:.55;line-height:1}
.resetBtn:hover{opacity:1;color:#ffcf5c;border-color:#ffcf5c}
.deleteBtn{padding:3px 8px;font-size:11px;border-radius:8px;opacity:.35;line-height:1;margin-left:4px}
.deleteBtn:hover{opacity:1;color:#ff5555;border-color:#7a1a1a;background:#2a0808}
.globalPlayerList{display:flex;flex-direction:column;gap:4px;margin-top:8px;max-height:220px;overflow-y:auto}
.globalPlayerItem{display:flex;align-items:center;gap:8px;padding:6px 10px;border:1px solid #1e2a3a;border-radius:8px;font-size:13px;background:#0b101a}
.globalPlayerName{flex:1;font-weight:600;color:#cfe0ff}
.globalAddBtn{padding:3px 10px;font-size:11px;border-radius:999px;color:#39d98a;border-color:#1e5a1e;background:#0d2a0d}
.globalAddBtn:hover{background:#1a4a1a}
.regionTabs{display:flex;gap:5px;flex-wrap:wrap}
.regionTab{padding:4px 14px;border-radius:999px;font-size:11px;font-weight:700;color:#8ea0b7}
.regionTab.active{background:#223249;border-color:#3a5580;color:#e7edf5}
.regionGroupLabel{font-size:10px;font-weight:700;color:#5a7aaa;text-transform:uppercase;letter-spacing:.5px;margin:8px 0 4px;padding-left:2px}
.stateFilterWrap{position:relative;display:inline-block}
.stateFilterToggle{padding:4px 14px;border-radius:999px;font-size:11px;font-weight:700;cursor:pointer;background:#0d1520;border:1px solid #1e2e40;color:#8ea0b7;transition:border-color .15s,color .15s}
.stateFilterToggle:hover{border-color:#3a5580;color:#e7edf5}
.stateFilterToggle.hasFilter{border-color:#5b9cf6;color:#5b9cf6;background:#0a1828}
.stateFilterMenu{position:absolute;top:calc(100% + 4px);left:0;z-index:40;min-width:200px;background:#0b101a;border:1px solid #223249;border-radius:10px;padding:6px 0;box-shadow:0 8px 24px rgba(0,0,0,.5)}
.stateFilterItem{display:flex;align-items:center;gap:8px;padding:5px 14px;cursor:pointer;font-size:12px;color:#b8c4d6;transition:background .1s}
.stateFilterItem:hover{background:#111a28}
.stateFilterItem input[type="checkbox"]{accent-color:#5b9cf6;width:14px;height:14px;cursor:pointer}
.stateFilterItem .state{font-size:11px;padding:2px 8px}
.stateFilterReset{display:block;width:calc(100% - 16px);margin:4px 8px 2px;padding:4px 0;border-radius:6px;font-size:11px;cursor:pointer;background:transparent;border:1px solid #1e2e40;color:#5a7aaa;text-align:center}
.stateFilterReset:hover{border-color:#5b9cf6;color:#5b9cf6}
.catBadge{font-size:10px;font-weight:700;padding:2px 8px;border-radius:999px;flex-shrink:0}
.catCheater{background:#2a0808;color:#ff5555;border:1px solid #7a1a1a}
.catSuspicious{background:#2a1a00;color:#ffaa44;border:1px solid #7a4a00}
.catNotable{background:#0a1a2a;color:#6de9ff;border:1px solid #1e4a6a}
.catPro{background:#1a1a08;color:#ffd700;border:1px solid #6a5a1a}
.manualBadge{display:inline-block;font-size:10px;font-weight:700;padding:1px 7px;border-radius:999px;background:#2a0a0a;color:#ff6666;border:1px solid #7a1a1a;margin-left:5px;vertical-align:middle}
tbody tr.tr--danger td:first-child{border-left:3px solid #ff3333}
tbody tr.tr--danger{background:rgba(255,51,51,.07)!important}
tbody tr.tr--danger:hover{background:rgba(255,51,51,.14)!important}
.psItem--danger{border-color:#7a1a1a!important;box-shadow:0 0 12px rgba(255,51,51,.3);animation:dangerPulse 2s ease-in-out infinite}
@keyframes dangerPulse{0%,100%{box-shadow:0 0 8px rgba(255,51,51,.25)}50%{box-shadow:0 0 18px rgba(255,51,51,.55)}}
.psDangerBadge{font-size:10px;font-weight:900;padding:2px 8px;border-radius:999px;background:#3a0808;color:#ff6666;border:1px solid #7a1a1a;margin:0 4px}
.dangerCount{color:#ff4444;font-weight:900;font-size:18px;margin-right:8px;animation:dangerPulse 1.5s ease-in-out infinite}
.sparkBar.d-low{background:#7a2020;opacity:.5}
.sparkBar.d-mid{background:#cc4422;opacity:.75}
.sparkBar.d-high{background:#ff3333;opacity:.9}
.sparkBar.d-high.peak{background:#ff0000;box-shadow:0 0 10px rgba(255,0,0,.7);opacity:1}
.psGraph--danger .psAxis span{color:#ff6666}
tbody tr.tr--watching td:first-child{border-left:3px solid #9b5de5}
tbody tr.tr--watching{background:rgba(155,93,229,.07)!important}
tbody tr.tr--watching:hover{background:rgba(155,93,229,.14)!important}
.communityNote{font-size:11px;color:#8ea0b7;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.communityDelBtn{padding:2px 7px;font-size:11px;border-radius:6px;color:#666;border-color:#333;opacity:.6;margin-left:auto}
.communityDelBtn:hover{opacity:1;color:#ff5555;border-color:#7a1a1a}
.communityAddWrap{border:1px solid #1e2a3a;border-radius:10px;overflow:hidden}
.communityAddSummary{cursor:pointer;padding:8px 12px;font-size:12px;font-weight:700;color:#8ea0b7;background:#0b101a;list-style:none}
.communityAddSummary:hover{color:#e7edf5}
.communityAddForm{display:flex;gap:6px;flex-wrap:wrap;padding:10px 12px;background:#090d14;align-items:center}
.communityAddForm input{flex:1;min-width:120px;height:34px;font-size:12px}
.communityAddForm select{height:34px;font-size:12px;flex-shrink:0}
.communityAddForm button{height:34px;flex-shrink:0}
.banAlertList{margin-top:14px}
.banAlertTitle{font-size:11px;font-weight:700;color:#ff9944;text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;margin-top:10px}
.banAlertTitle:first-child{margin-top:0}
.banAlertTitle.banTitleBan{color:#ff4444}
.banAlertTitle.banTitleNameChange{color:#6de9ff}
.banAlertItem{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:8px;background:#1e1000;border:1px solid #5a3000;margin-bottom:4px;flex-wrap:wrap}
.banAlertItem:last-child{margin-bottom:0}
.banAlertBan{background:#1e0808;border-color:#7a1a1a}
.banAlertNameChange{background:#071520;border-color:#1e5a8a}
.banAlertIcon{font-size:14px;flex-shrink:0}
.banAlertName{font-weight:700;color:#ffb84d;flex-shrink:0}
.banAlertBan .banAlertName{color:#ff7777}
.banAlertNameChange .banAlertName{color:#6de9ff}
.banAlertReason{font-size:12px;color:#c09060;font-weight:600;flex:1}
.banAlertNameChange .banAlertReason{color:#6de9ff}
.banAlertMeta{font-size:11px;color:#9a7040;flex-basis:100%}
.hotCount{color:#39d98a;font-weight:900;font-size:14px}
/* ── pickup ★ ボタン ── */
.pickupBtn{padding:2px 5px;font-size:11px;border-radius:6px;opacity:.35;line-height:1;margin-right:4px;background:transparent;border-color:transparent;color:#e7edf5}
.pickupBtn:hover{opacity:.8;color:#ffcf5c}
.pickupBtn.pickupOn{opacity:1;color:#ffcf5c;border-color:#7a5a00;background:#2a1e00}
/* ── pickup グラフ ── */
.pickupBars{display:flex;align-items:flex-end;gap:3px;height:108px;padding:4px 0}
.pickupBar{width:12px;border-radius:6px;background:#184dff;opacity:.75;transition:height .3s}
.pickupBarPeak{background:#ffcf5c;opacity:1;box-shadow:0 0 10px rgba(255,207,92,.5)}
.pickupAxis{display:flex;justify-content:space-between;padding:0 1px;margin-top:4px}
.pickupAxis span{font-size:10px;color:#5a7aaa}
.pickupNames{font-size:11px;color:#8ea0b7;margin-top:6px}
/* ── state log ── */
.logList{display:flex;flex-direction:column;gap:3px;max-height:260px;overflow-y:auto;margin-top:8px}
.logEntry{display:flex;align-items:center;gap:8px;padding:4px 8px;border-radius:6px;font-size:12px;background:#0b101a;border:1px solid #131d2b}
.logTime{color:#5a7aaa;font-family:ui-monospace,monospace;font-size:11px;min-width:52px}
.logName{font-weight:700;color:#cfe0ff;min-width:80px;overflow:hidden;text-overflow:ellipsis;max-width:120px}
.logFrom{color:#8ea0b7}
.logArrow{color:#5a7aaa}
.logTo{font-weight:700}
.logDelta{font-family:ui-monospace,monospace;font-size:11px;margin-left:2px}
/* ── region タグ ── */
.regionTag{display:inline-block;font-size:10px;font-weight:700;padding:1px 6px;border-radius:999px;vertical-align:middle;flex-shrink:0}
.regionTag-AS{background:#0d2030;color:#6de9ff;border:1px solid #1e5a8a}
.regionTag-EU{background:#1a2010;color:#7fff6e;border:1px solid #3a6a1a}
.regionTag-NA{background:#2a1a00;color:#ffaa44;border:1px solid #7a4a00}
/* ── th ヘルプツールチップ ── */
.thHelp{position:relative;display:inline-block;vertical-align:middle}
.thHelpIcon{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;border-radius:999px;background:#223249;color:#8ea0b7;font-size:10px;font-weight:700;cursor:help;margin-left:4px;line-height:1;vertical-align:middle;border:1px solid #2f4666}
.thHelpIcon:hover{background:#2f4666;color:#e7edf5}
/* settingsエリア用: CSS ホバーでそのまま下に表示 */
.thHelpTip{display:none;position:absolute;left:0;top:calc(100% + 4px);z-index:200;background:#0f1622;border:1px solid #223249;border-radius:10px;padding:10px 12px;min-width:220px;max-width:300px;box-shadow:0 8px 32px rgba(0,0,0,.75);font-size:11px;font-weight:400;text-transform:none;letter-spacing:0;color:#b8c4d6;white-space:normal;line-height:1.6;pointer-events:none}
.thHelp:hover .thHelpTip{display:block}
/* th 内のツールチップは JS グローバル版を使うので CSS ホバーを無効化 */
th .thHelpTip{display:none!important}
/* グローバル fixed ツールチップ（テーブルヘッダー用）*/
.globalTooltip{display:none;position:fixed;z-index:9999;background:#0f1622;border:1px solid #3a5580;border-radius:10px;padding:10px 14px;min-width:240px;max-width:360px;box-shadow:0 12px 40px rgba(0,0,0,.9),0 0 0 1px rgba(24,77,255,.12);font-size:11px;font-weight:400;text-transform:none;letter-spacing:0;color:#b8c4d6;white-space:normal;line-height:1.6;pointer-events:none}
.globalTooltip.show{display:block}
.thHelpRow{display:flex;gap:8px;margin-bottom:6px;align-items:baseline}
.thHelpRow:last-child{margin-bottom:0}
.thHelpState{font-weight:700;min-width:138px;flex-shrink:0;font-size:11px}
.thHelpRow span:last-child{color:#8ea0b7;font-size:11px}
.thHelpRow span:last-child b{font-weight:700}
.thHelpNote{border-top:1px solid #223249;margin-top:8px;padding-top:6px;color:#5a7aaa;font-size:10px}
/* ── ログインモーダル ── */
.loginModalOverlay{position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:10000;display:flex;align-items:center;justify-content:center}
.loginModalBox{background:#0f1622;border:1px solid #3a5580;border-radius:14px;padding:24px;width:100%;max-width:360px;display:flex;flex-direction:column;gap:14px;box-shadow:0 20px 60px rgba(0,0,0,.9)}
.loginModalTitle{font-weight:900;font-size:15px;color:#e7edf5}
.loginError{color:#ff5555;font-size:12px;min-height:16px}
.loginModalBtns{display:flex;gap:8px;justify-content:flex-end}
/* ── 許可ユーザー行 ── */
.allowedUserRow{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid #131d2b}
.allowedUserRow:last-child{border-bottom:none}
.allowedUserId{flex:1;color:#cfe0ff;font-weight:600;font-size:13px}
/* ── table cell sizing ── */
.tsCell{font-size:12px;color:#8ea0b7;white-space:nowrap}
.errCell{font-size:11px;color:#8ea0b7;max-width:140px;overflow:hidden;text-overflow:ellipsis}
.actCell{white-space:nowrap}
/* ── 言語切り替え ── */
.langSwitcher{display:flex;gap:4px;align-items:center;margin-top:4px}
.langBtn{padding:3px 10px;font-size:11px;border-radius:999px;border:1px solid #1e2e40;background:#0d1520;color:#5a7aaa;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s}
.langBtn:hover{background:#162035;color:#8ea0b7}
.langBtn.active{background:#1a3a6e;color:#7eb8ff;border-color:#2a5a9e;font-weight:700}
/* ── ヘッダー認証ボタン ── */
.headerAuthBtn{padding:5px 14px;font-size:12px;border-radius:999px;height:30px;white-space:nowrap}
/* ── サイトフッター ── */
.siteFooter{text-align:center;padding:24px 16px 32px;color:#4a6080;font-size:12px;border-top:1px solid #131d2b;margin-top:16px}
.footerDesc{max-width:580px;margin:0 auto 18px;color:#4e6887;font-size:12px;line-height:1.75;border-bottom:1px solid #131d2b;padding-bottom:16px}
.footerTitle{font-weight:700;color:#6a809f;margin-bottom:10px;font-size:13px}
.footerContacts{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 24px;line-height:1.9}
.footerContacts strong{color:#7eb8ff}
.footerSub{margin-top:12px;color:#2e4060;font-size:11px}

@media (max-width: 1240px){
  :root{--live-table-max:none}
  .trackerWorkspace{grid-template-columns:1fr}
  .trackerRail{position:static;max-height:none;overflow:visible;padding-right:0}
  .tableWrap--live{max-height:none;min-height:0}
  .liveCardList{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
}

@media (max-width: 860px){
  .liveCardsShell{padding:10px}
  .liveCardList{grid-template-columns:1fr;gap:10px}
  .livePlayerCard{padding:13px}
  .liveCardCompact{grid-template-columns:minmax(0,1fr) minmax(0,82px) 18px}
  .liveDetailPanel{width:100%;border-left:none}
  .liveDetailBody{padding:14px}
  .liveDetailSummary,.liveDetailSection{padding:13px;border-radius:16px}
  .liveDetailMetrics,.liveDetailControlGrid{grid-template-columns:1fr}
}

@media (max-width: 480px){
  .liveCardMeta{align-items:flex-start}
  .liveCardCompact{grid-template-columns:minmax(0,1fr) 74px 16px;gap:6px}
  .liveCardStat{padding:8px 9px}
  .liveCardStatValue{font-size:14px}
}

/* ── Log Timeline ───────────────────────────────────────────── */
.logDateSep{font-size:10px;font-weight:700;color:#3a4a5a;text-transform:uppercase;letter-spacing:.8px;padding:8px 0 3px;border-bottom:1px solid #1a2535;margin-bottom:4px;}
.logState{font-size:11px;font-weight:600;padding:1px 5px;border-radius:3px;background:rgba(255,255,255,0.05);}
.logDelta{font-size:11px;font-weight:700;margin-left:6px;padding:1px 4px;border-radius:3px;}
.logDelta.pos{color:#39d98a;background:rgba(57,217,138,0.1);}
.logDelta.neg{color:#ff7b7b;background:rgba(255,123,123,0.1);}
