:root { --primary:#0f665e; --secondary:#124b47; --accent:#e6e9c2; --link-fg:#076b61; --link-selected-fg:#064b44; --header-bg:#123c38; --breadcrumbs-bg:#e6f0ec; --breadcrumbs-fg:#38534c; --breadcrumbs-link-fg:#15584f; --button-bg:#176e63; --button-hover-bg:#0b534b; --default-button-bg:#0b534b; --default-button-hover-bg:#063f39; --ops-border:#dce5df; --ops-soft:#f3f7f4; }
html[data-theme="dark"] { --primary:#3b9b8e; --link-fg:#89cdbd; --breadcrumbs-bg:#193b35; --breadcrumbs-fg:#d4e6df; --breadcrumbs-link-fg:#b6ddce; --ops-border:#35514b; --ops-soft:#1a302b; }
body { font-family:system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif; }
#header { gap:16px; flex-wrap:wrap; padding:20px 36px; }
.ops-brand a { font-size:22px; font-weight:700; letter-spacing:.04em; color:#fff!important; }
.ops-brand span { font-weight:400; font-size:14px; margin-left:12px; opacity:.8; }
.environment-tag { padding:7px 12px; background:#eee9c9; color:#534c26; font-size:12px; border-radius:4px; }
.environment-tag.platform { background:#f0d8d3; color:#7e2119; }
#content { padding:28px 36px; }
.ops-shell { max-width:1400px; width:100%; }
.ops-nav { display:flex; flex-wrap:wrap; gap:4px; padding-bottom:18px; border-bottom:1px solid var(--ops-border); margin-bottom:22px; }
.ops-nav a { padding:10px 16px; border-radius:5px; color:var(--body-fg); font-weight:500; }
.ops-nav a[aria-current="page"] { background:var(--primary); color:#fff; }
.ops-note { border-left:3px solid #b5a75d; background:var(--ops-soft); padding:13px 17px; line-height:1.6; margin:0 0 24px; font-size:13px; }
.hero { padding:14px 0 30px; }
.eyebrow { font-size:11px; letter-spacing:.18em; color:var(--body-quiet-color); }
.hero h2 { font-size:30px; margin:12px 0; font-weight:600; }
.hero p { color:var(--body-quiet-color); font-size:14px; }
.ops-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-bottom:28px; }
.ops-card { display:block; border:1px solid var(--ops-border); background:var(--body-bg); padding:25px; border-radius:8px; color:var(--body-fg)!important; transition:box-shadow .15s,border-color .15s; }
.ops-card:hover { border-color:var(--primary); box-shadow:0 4px 14px #183c3510; }
.card-number { font-size:12px; color:var(--body-quiet-color); }
.ops-card h3 { font-size:21px; margin:18px 0 12px; }
.ops-card p { min-height:40px; line-height:1.7; color:var(--body-quiet-color); }
.ops-card > span:last-child { display:block; margin-top:24px; color:var(--link-fg); font-size:13px; }
.ops-panel { background:var(--body-bg); border:1px solid var(--ops-border); border-radius:8px; padding:24px; margin-bottom:24px; }
.ops-panel h2 { font-size:19px; font-weight:600; margin:0 0 16px; background:none; color:var(--body-fg); padding:0; }
.ops-panel p { line-height:1.7; }
.section-head { display:flex; justify-content:space-between; align-items:center; gap:18px; margin-bottom:20px; }
.section-head p { color:var(--body-quiet-color); margin:0; }
.section-head h2 { margin-bottom:8px; }
.button.primary, button.primary { display:inline-block; background:var(--button-bg); color:#fff; border:0; border-radius:5px; padding:12px 18px; cursor:pointer; font-size:13px; white-space:nowrap; }
.button.primary:hover { background:var(--button-hover-bg); }
.ops-warning { border-left:3px solid #c58a35; padding:16px; background:var(--ops-soft); margin:20px 0; line-height:1.7; }
.badge { display:inline-block; border-radius:4px; padding:5px 9px; font-size:12px; font-weight:500; background:var(--ops-soft); }
.badge.good,.badge.succeeded { background:#dceee5; color:#1d5f40; }
.badge.failed { background:#f6e4e1; color:#932c23; }
.badge.unknown,.badge.pending { background:#f7edce; color:#745719; }
.muted { color:var(--body-quiet-color); font-size:12px; }
.capabilities { display:flex; flex-wrap:wrap; gap:8px; }
.capabilities span { padding:7px 10px; background:var(--ops-soft); border-radius:4px; font-size:12px; }
.table-wrap { overflow-x:auto; }
.ops-panel table { width:100%; }
.ops-panel table th { padding:13px 12px; background:var(--ops-soft); border-bottom:1px solid var(--ops-border); font-weight:500; }
.ops-panel table td { padding:15px 12px; border-bottom:1px solid var(--ops-border); line-height:1.7; vertical-align:middle; }
.empty { padding:40px!important; text-align:center; color:var(--body-quiet-color); }
.search { display:flex; gap:8px; margin:10px 0 20px; }
.search input { min-width:260px; padding:10px 12px; }
.search button { flex-shrink:0; white-space:nowrap; padding:9px 18px; border:1px solid var(--ops-border); border-radius:4px; background:var(--ops-soft); color:var(--body-fg); cursor:pointer; }
.pagination { display:flex; justify-content:space-between; margin-top:20px; color:var(--body-quiet-color); font-size:12px; }
.pagination a { margin-left:18px; }
.form-panel { max-width:780px; }
.intro { padding-bottom:18px; border-bottom:1px solid var(--ops-border); margin-bottom:24px; color:var(--body-quiet-color); }
.ops-field { display:flex; flex-direction:column; gap:8px; margin-bottom:22px; max-width:650px; }
.ops-field label { font-size:13px; font-weight:600; }
.ops-field input:not([type="checkbox"]),.ops-field select,.ops-field textarea { box-sizing:border-box; width:100%; padding:11px 12px; border:1px solid var(--ops-border); border-radius:5px; background:var(--body-bg); color:var(--body-fg); }
.ops-field textarea { font-family:inherit; resize:vertical; }
.ops-field select { min-height:44px; height:auto; line-height:1.5; }
.ops-field .help { margin:0; padding:0; line-height:1.6; font-size:12px; }
.form-actions { display:flex; align-items:center; flex-wrap:wrap; gap:20px; padding-top:20px; border-top:1px solid var(--ops-border); margin-top:24px; }
.policy-state { padding:16px; background:var(--ops-soft); margin:20px 0 25px; }
.op-details { display:grid; grid-template-columns:100px 1fr; gap:14px; margin:24px 0; }
.op-details dt { color:var(--body-quiet-color); }.op-details dd { margin:0; overflow-wrap:anywhere; }
.mono { font-family:ui-monospace,Consolas,monospace; font-size:13px; }
.user-link { font-weight:600; }
.user-heading h2 { font-size:27px; margin:10px 0; }
.user-actions { display:flex; flex-wrap:wrap; gap:20px; }
.user-meta { display:flex; flex-wrap:wrap; gap:36px; margin:22px 0 0; }
.user-meta dt { color:var(--body-quiet-color); font-size:12px; margin-bottom:6px; }
.user-meta dd { margin:0; font-size:14px; }
.power-number { font-weight:650; font-variant-numeric:tabular-nums; }
.record-filter { display:flex; flex-wrap:wrap; align-items:flex-end; gap:14px; padding:18px; background:var(--ops-soft); border-radius:6px; margin-bottom:22px; }
.record-filter label { display:block; margin-bottom:8px; font-size:12px; }
.record-filter select,.record-filter input { box-sizing:border-box; min-height:40px; max-width:190px; padding:9px 11px; border:1px solid var(--ops-border); border-radius:4px; background:var(--body-bg); color:var(--body-fg); }
.record-filter > a { padding:12px 3px; }
.user-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:20px 0; }
.user-stats > div { padding:20px; border:1px solid var(--ops-border); border-radius:6px; }
.user-stats span { display:block; font-size:12px; color:var(--body-quiet-color); margin-bottom:10px; }
.user-stats strong { font-size:23px; font-weight:600; font-variant-numeric:tabular-nums; }
.record-id { max-width:210px; overflow-wrap:anywhere; }
.invite-code { font-size:17px; letter-spacing:1px; user-select:all; }
.reward-picker { border:1px solid var(--ops-border); border-radius:6px; padding:18px; margin-top:18px; }
.reward-picker input[type="number"] { width:110px; padding:8px; }
.reward-picker button { cursor:pointer; }
.nowrap { white-space:nowrap; }
@media(max-width:800px) { .user-stats { grid-template-columns:1fr; }.record-filter > div { width:100%; }.record-filter select,.record-filter input { width:100%; max-width:none; } }
.export-box { background:var(--ops-soft); padding:22px; border:1px solid var(--ops-border); border-radius:6px; margin:25px 0; }
pre { padding:18px; border-radius:5px; background:var(--ops-soft); white-space:pre-wrap; overflow-wrap:anywhere; }
.errorlist { padding:10px 14px!important; background:#f6e4e1; color:#932c23; border-radius:4px; list-style:none; margin:0; }
@media(max-width:800px) { #header,#content { padding:20px; }.ops-cards { grid-template-columns:1fr; }.section-head { align-items:flex-start; flex-direction:column; }.ops-nav a { padding:9px 12px; }.ops-panel { padding:18px; }.search input { min-width:0; width:100%; }.hero h2 { font-size:25px; }.ops-card p { min-height:0; }.ops-brand span { display:none; } }
