:root {
  --rp-bg: #050000;
  --rp-bg2: #120000;
  --rp-panel: #0d0505;
  --rp-panel2: #170808;
  --rp-red: #e30613;
  --rp-red2: #ff2535;
  --rp-dark-red: #7a0008;
  --rp-dim: #8f222a;
  --rp-text: #ffe8e8;
  --rp-muted: #d48c8c;
  --rp-success: #39ff88;
  --rp-yellow: #ffd84d;
  --rp-bad: #ff4141;
  --rp-white: #fff6f6;
}
* { box-sizing: border-box; }
.rp-remote-panel-inline, .rp-remote-panel-inline * { box-sizing: border-box; }
.rp-remote-page {
  margin: 0;
  min-height: 100vh;
  background: var(--rp-bg);
  color: var(--rp-text);
  font-family: Consolas, "Lucida Console", monospace;
  overflow: auto;
  text-shadow: 0 0 8px rgba(227,6,19,0.45);
}
.rp-remote-page::before, .rp-remote-panel-shell::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 50% 0%, rgba(227,6,19,0.22), transparent 34%), linear-gradient(135deg, rgba(227,6,19,0.06), transparent 45%);
  z-index: 0;
}
.rp-remote-page::after, .rp-remote-panel-shell::after {
  content: "";
  pointer-events: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: linear-gradient(rgba(18,16,16,0) 50%, rgba(0,0,0,0.25) 50%), linear-gradient(90deg, rgba(227,6,19,0.08), rgba(0,0,0,0.04), rgba(255,37,53,0.05));
  background-size: 100% 4px, 6px 100%;
  mix-blend-mode: screen;
}
.rp-remote-panel-shell {
  position: relative;
  z-index: 1;
  width: 100%;
  min-height: 100%;
  background: var(--rp-bg);
  color: var(--rp-text);
  font-family: Consolas, "Lucida Console", monospace;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.rp-rpbox, .rp-remote-panel-header, .rp-remote-panel-statusbar, .rp-module-card, .rp-detail-panel, .rp-filterbar, .rp-notice, .rp-action-row a, .rp-action-row button, .rp-remote-panel-btn, .rp-mini-btn, .rp-category-card {
  border: 2px solid var(--rp-red);
  background: rgba(13,5,5,0.96);
  box-shadow: 0 0 0 2px #050000, 0 0 18px rgba(227,6,19,0.28);
}
.rp-remote-panel-header {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 18px;
  padding: 18px;
}
.rp-remote-panel-title strong {
  display: block;
  color: var(--rp-red);
  font-size: clamp(26px, 4vw, 42px);
  letter-spacing: 3px;
  line-height: 1.05;
}
.rp-remote-panel-title span { display: block; margin-top: 7px; color: var(--rp-dim); font-size: 13px; overflow-wrap: anywhere; }
.rp-session-box { min-width: 260px; text-align: right; color: var(--rp-red2); line-height: 1.5; font-size: 13px; overflow-wrap: anywhere; }
.rp-remote-panel-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; align-content: start; }
.rp-remote-panel-btn, .rp-mini-btn, .rp-action-row a, .rp-action-row button {
  color: var(--rp-text);
  text-decoration: none;
  font: inherit;
  background: #170808;
  padding: 9px 12px;
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.rp-remote-panel-btn:hover, .rp-mini-btn:hover, .rp-action-row a:hover, .rp-action-row button:hover { background: #26080a; border-color: var(--rp-red2); color: var(--rp-white); }
.rp-remote-panel-statusbar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 12px;
  padding: 12px;
}
.rp-remote-panel-stat { border: 1px solid var(--rp-dim); background: #100304; padding: 12px; min-height: 74px; }
.rp-remote-panel-stat b { display: block; color: var(--rp-red2); font-size: 26px; }
.rp-remote-panel-stat span { display: block; color: var(--rp-muted); margin-top: 6px; font-size: 12px; text-transform: uppercase; }
.rp-filterbar { display: flex; gap: 8px; flex-wrap: wrap; padding: 12px; align-items: center; }
.rp-filterbar button { border: 1px solid var(--rp-dim); background: #100304; color: var(--rp-text); font: inherit; padding: 8px 10px; cursor: pointer; }
.rp-filterbar button.active, .rp-filterbar button:hover { border-color: var(--rp-red2); color: var(--rp-red2); background: #26080a; }
.rp-filterbar input { flex: 1 1 220px; min-width: 160px; border: 1px solid var(--rp-dim); background: #100304; color: var(--rp-text); font: inherit; padding: 9px 10px; }
.rp-main-layout { display: grid; grid-template-columns: minmax(360px, 1.25fr) minmax(320px, 0.75fr); gap: 14px; align-items: start; }
.rp-remote-panel-grid { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.rp-module-card { padding: 14px; min-width: 0; }
.rp-module-card.active { border-color: var(--rp-red2); background: #170607; }
.rp-module-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.rp-module-name { color: var(--rp-red2); font-size: 21px; letter-spacing: 1px; overflow-wrap: anywhere; }
.rp-module-meta { color: var(--rp-muted); font-size: 12px; margin-top: 6px; overflow-wrap: anywhere; }
.rp-module-desc { color: var(--rp-white); font-size: 12px; margin-top: 8px; opacity: 0.9; }
.rp-pill { display: inline-block; border: 1px solid currentColor; padding: 4px 8px; text-transform: uppercase; font-size: 12px; white-space: nowrap; }
.rp-pill.online { color: var(--rp-success); }
.rp-pill.partial { color: var(--rp-yellow); }
.rp-pill.offline { color: var(--rp-bad); }
.rp-pill.unknown { color: var(--rp-muted); }
.rp-check-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 8px 14px; margin-top: 12px; }
.rp-check-row { display: flex; gap: 8px; color: var(--rp-muted); font-size: 12px; line-height: 1.35; min-width: 0; overflow-wrap: anywhere; }
.rp-check-dot { flex: 0 0 10px; height: 10px; width: 10px; border: 1px solid var(--rp-bad); margin-top: 3px; box-shadow: 0 0 8px rgba(255,65,65,0.6); }
.rp-check-dot.ok { border-color: var(--rp-success); box-shadow: 0 0 8px rgba(57,255,136,0.6); background: rgba(57,255,136,0.25); }
.rp-module-actions, .rp-action-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.rp-detail-panel { position: sticky; top: 14px; padding: 14px; max-height: calc(100vh - 28px); overflow: auto; min-width: 0; }
.rp-detail-title { color: var(--rp-red2); font-size: 22px; padding-bottom: 8px; border-bottom: 1px dashed var(--rp-dim); margin-bottom: 10px; overflow-wrap: anywhere; }
.rp-kv { display: flex; justify-content: space-between; gap: 16px; border-bottom: 1px dotted #661018; padding: 8px 0; font-size: 13px; }
.rp-kv span:first-child { color: var(--rp-muted); }
.rp-kv span:last-child { color: var(--rp-white); text-align: right; overflow-wrap: anywhere; }
.rp-subtitle { color: var(--rp-red2); margin-top: 16px; padding-top: 10px; border-top: 1px dashed var(--rp-dim); letter-spacing: 1px; }
.rp-logbox { white-space: pre-wrap; background: #050000; border: 1px solid var(--rp-dim); padding: 12px; color: var(--rp-white); max-height: 440px; overflow: auto; font-size: 12px; line-height: 1.35; }
.rp-remote-panel-error, .rp-notice { padding: 12px 14px; color: var(--rp-white); }
.rp-remote-panel-error { border: 2px solid var(--rp-bad); background: rgba(80,0,0,0.85); }
.rp-remote-floating { position: fixed; right: 18px; bottom: 18px; z-index: 9998; }
.rp-remote-floating button, .rp-auth-remote-ai-link { border: 2px solid var(--rp-red); background: #0d0505; color: var(--rp-red2); box-shadow: 0 0 18px rgba(227,6,19,0.45); font: 13px Consolas, monospace; padding: 11px 14px; text-transform: uppercase; cursor: pointer; text-decoration: none; }
.rp-remote-floating button:hover, .rp-auth-remote-ai-link:hover { background: #26080a; color: var(--rp-white); }
.rp-remote-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,0.74); z-index: 9996; display: none; }
.rp-remote-backdrop.open { display: block; }
.rp-remote-drawer { position: fixed; top: 0; right: 0; width: min(1180px, 96vw); height: 100vh; z-index: 9997; transform: translateX(105%); transition: transform 160ms ease; overflow: auto; background: var(--rp-bg); border-left: 2px solid var(--rp-red); }
.rp-remote-drawer.open { transform: translateX(0); }
.rp-auth-remote-ai-wrap { margin: 12px 0; display: flex; justify-content: center; }
@media (max-width: 980px) {
  .rp-remote-panel-shell { padding: 10px; }
  .rp-remote-panel-header { flex-direction: column; }
  .rp-session-box { text-align: left; min-width: 0; }
  .rp-main-layout { grid-template-columns: 1fr; }
  .rp-detail-panel { position: static; max-height: none; }
  .rp-check-list { grid-template-columns: 1fr; }
  .rp-module-top { flex-direction: column; }
}
