:root{
  --blue:#4a67f2;
  --bg:#e8ecf3;
  --muted:#888;
  --line:#e5e7eb;
  font-family:PingFang SC,Microsoft YaHei,system-ui,sans-serif;
}
*{box-sizing:border-box}
html,body,#root{background:var(--bg);height:100%;color:#1f1f1f;margin:0}
body[data-page="ops"],body[data-page="ops"] #root{height:auto;min-height:100%;background:#121820}

.proto-shell{height:100%;display:flex;flex-direction:column;background:#0e1014}
.proto-bar{flex:none;height:40px;background:#1e293b;color:#e8eef4;display:flex;align-items:center;gap:12px;padding:0 12px;font-size:13px}
.proto-bar strong{font-size:13px}
.proto-bar .muted{color:#94a3b8;font-size:12px;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.proto-bar a{color:#fff;background:#4a67f2;border-radius:999px;padding:4px 12px;font-size:12px;font-weight:600;text-decoration:none}
.proto-hover{flex:none;min-height:0;background:#0f172a;color:#cbd5e1;padding:0 12px;font-size:12px;line-height:32px;display:none}
.proto-hover.on{display:block}
.proto-hover b{color:#93c5fd;margin-right:8px}
.proto-fill{flex:1;min-height:0;position:relative;background:#0e1014}
.proto-fill iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

.ops-shell{min-height:100%;background:#121820;color:#e8eef4}
.ops-top{position:sticky;top:0;z-index:5;background:#0f172a;border-bottom:1px solid #2a3544;display:flex;align-items:center;gap:12px;padding:12px 20px}
.ops-top h1{margin:0;font-size:18px}
.ops-top .muted{color:#8b9aab;font-size:12px;flex:1}
.ops-top a{color:#fff;background:#4a67f2;border-radius:999px;padding:6px 14px;font-size:13px;font-weight:600;text-decoration:none}
.ops-body{max-width:880px;margin:0 auto;padding:20px 20px 60px}
.ops-body .ops{background:transparent;border:0;padding:0;overflow:visible}
.ops-body .chip-row{max-height:none}

.ops{color:#e8eef4;background:#121820;padding:0;overflow:visible}
.ops-head h2{margin:0 0 6px;font-size:18px}
.ops-head p{color:#8b9aab;margin:0 0 14px;font-size:12px;line-height:1.5}
.ops-hover{pointer-events:none;box-sizing:border-box;background:#1e2a38;border:1px solid #3d7eff;border-radius:10px;min-height:56px;margin-bottom:12px;padding:10px 12px}
.ops-hover.empty{color:#6b7c8f;border-style:dashed;border-color:#2f3b4a;align-items:center;font-size:12px;display:flex}
.ops-hover-title{color:#7eb6ff;margin-bottom:4px;font-weight:700}
.ops-hover-body{color:#c9d4e0;font-size:12px;line-height:1.5}
.ops-card{background:#1a222c;border:1px solid #2f3b4a;border-radius:12px;margin-bottom:12px;padding:12px}
.ops-card.page-guide{border-color:#3d7eff!important}
.ops-search{border:1px solid #3a4a5c;background:#121820;color:#e8eef4;border-radius:8px;width:100%;margin:0 0 10px;padding:7px 10px;font-size:12px}
.ops-fold-hd,.pg-fold-hd{color:#c9d4e0;cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:6px;width:100%;padding:10px 0;font-size:13px;font-weight:600;display:flex}
.ops-fold-hd .caret,.pg-fold-hd .caret{color:#7eb6ff;width:12px}
.pg-badge{color:#7eb6ff;background:#243044;border-radius:999px;margin-left:auto;padding:2px 6px;font-size:10px;font-weight:500}
.ops-fold-bd,.pg-fold-bd{padding-bottom:8px}
.ops-card.ops-fold:not(.open){padding-bottom:12px}
.ops-fold.open .ops-fold-bd{margin-top:10px}
.pg-now{flex-wrap:wrap;align-items:baseline;gap:8px;margin-bottom:8px;display:flex}
.pg-label{color:#8b9aab;font-size:11px}
.pg-now strong{color:#fff;font-size:16px}
.pg-path{color:#7eb6ff;background:#121820;border-radius:4px;padding:2px 6px;font-size:11px}
.pg-live{color:#9ec5ff;background:#243044;border-radius:6px;margin-bottom:10px;padding:6px 8px;font-size:11px;line-height:1.4}
.pg-fold{border-top:1px solid #2f3b4a;margin-top:4px}
.pg-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}
.pg-list li{background:#121820;border-radius:8px;padding:8px 10px}
.pg-link{color:#7eb6ff;cursor:pointer;text-align:left;text-underline-offset:2px;background:0 0;border:none;padding:0;font-size:13px;font-weight:600;text-decoration:underline}
.pg-name{color:#e8eef4;font-size:13px;font-weight:600}
.pg-state{color:#8b9aab;margin-top:4px;font-size:11px;line-height:1.45}
.pg-notes{color:#c9d4e0;margin:0;padding-left:16px;font-size:12px;line-height:1.55}
.pg-group{background:#121820;border-radius:8px;margin-bottom:12px;padding:10px 10px 8px}
.pg-group-title{color:#7eb6ff;margin-bottom:6px;font-size:12px;font-weight:700;line-height:1.4}
.pg-group .pg-notes{color:#b8c5d4}
.chip-row{flex-wrap:wrap;gap:6px;display:flex;max-height:220px;overflow:auto}
.chip{color:#c9d4e0;cursor:pointer;text-align:left;background:#243041;border:1px solid #3a4a5c;border-radius:8px;padding:4px 8px;font-size:11px;line-height:1.35}
.chip.on{color:#fff;background:#2a4a7a;border-color:#3d7eff}
.status-pill{color:#9ec5ff;background:#243044;border:1px solid #3d7eff;border-radius:999px;margin-bottom:8px;padding:4px 12px;font-weight:700;display:inline-block}
