:root { color-scheme: light; --bg:#fafafa; --surface:#fff; --line:#e4e4e7; --line-strong:#bfdbfe; --text:#18181b; --muted:#52525b; --mint:#2563eb; --mint-strong:#2563eb; --danger:#b91c1c; --warning:#92400e; --shadow:0 2px 6px #18181b08; font-family:"PingFang SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:14px; }
body { background:var(--bg); }
.read-only-notice { padding:12px 16px; border:1px solid #bfdbfe; background:#eff6ff; color:#1e40af; border-radius:8px; font-size:13px; line-height:1.6; margin-bottom:24px; }
button,input,textarea,select { border-radius:8px; font-size:14px; }
button { font-weight:500; transition:background-color 150ms,color 150ms; }
button:hover { transform:none; }
button:focus-visible,a:focus-visible,summary:focus-visible { outline:2px solid #2563eb; outline-offset:3px; }
input,textarea,select { background:#f4f4f5; color:var(--text); border:0; }
input:focus,textarea:focus,select:focus { box-shadow:0 0 0 3px #3b82f64d; }
input:disabled { color:#52525b; }
input[type=checkbox] { accent-color:#2563eb; }
.ambient,.eyebrow { display:none; }
.shell { width:auto; margin:0; padding:24px 32px 64px; }
body.authenticated .shell { margin-left:256px; }
.glass { background:#fff; border:1px solid #e4e4e7; box-shadow:0 1px 3px #18181b05; backdrop-filter:none; border-radius:12px; }
.panel { padding:24px; }
.topbar { padding:0 0 20px; border-bottom:1px solid var(--line); margin-bottom:28px; }
.brand-mark,.login-logo { border:1px solid var(--line); border-radius:8px; box-shadow:none; }
.status-pill,.count-badge,.user-badge,.role-badge,.status-badge { border-radius:6px; background:#f4f4f5; color:#52525b; }
.status-pill i { background:#059669; box-shadow:none; border-radius:2px; }
.status-pill { font-size:12px; }
.status-pill::after { content:" · 控制台"; }
.login-card { max-width:460px; padding:36px; }
.login-logo { width:56px; height:56px; }
h1 { font-size:26px; font-weight:600; letter-spacing:-.025em; line-height:1.3; }
h2 { font-size:18px; font-weight:600; }
.primary { background:#2563eb; color:#fff; }
.primary:hover { background:#1d4ed8; }
.ghost,.secondary { background:#fff; color:#3f3f46; border:1px solid var(--line); }
.ghost:hover,.secondary:hover { background:#f4f4f5; }
.danger-text,.row-actions .delete { color:#b91c1c; }
.heading-note,.panel-help { font-size:13px; line-height:1.6; max-width:75ch; }
.page-heading { margin:0 0 24px; }
.heading-actions { flex-wrap:wrap; justify-content:flex-end; }
.user-badge { display:none; }
.panel-title,.table-tools { flex-wrap:wrap; }
.table-tools { gap:12px; }
.table-tools input { width:230px; }
.table-tools select { width:145px; }
.sort-control,.count-badge { font-size:12px; }
.table-wrap { overflow-x:auto; }
table { min-width:660px; }
th { background:#fafafa; color:#52525b; font-size:12px; font-weight:500; letter-spacing:0; padding:12px; }
td { color:#3f3f46; border-bottom:1px solid #f0f0f2; font-size:13px; padding:16px 12px; }
tbody tr:hover { background:#fafafa; }
.app-title-row { flex-wrap:wrap; }
.app-title-row > strong { font-size:12px; font-weight:500; }
.stat-chips span { color:#52525b; background:#f4f4f5; font-size:11px; }
.stat-chips .dau-chip { color:#1d4ed8; background:#eff6ff; }
.summary-url-row { border:0; padding:6px 0; background:none; border-radius:0; }
.summary-url-row strong { color:#27272a; font-weight:500; font-size:12px; }
.summary-url-row > div,.summary-count,.remark-cell,.time-cell,.list-status-switch { color:#52525b; font-size:11px; }
.row-actions button { color:#1d4ed8; background:#eff6ff; border:0; font-size:12px; }
.switch,.switch::after,.compact-switch { border-radius:4px; }
.switch { background:#a1a1aa; }
.list-status-switch input:checked + .switch::after,.switch-field input:checked + .switch::after { background:white; }
.switch-field input:focus-visible + .switch,.list-status-switch input:focus-visible + .switch { outline:2px solid #2563eb; outline-offset:3px; }
.field > span,.switch-field,form label { color:#3f3f46; font-weight:500; font-size:13px; }
.role-badge.super { color:#92400e; background:#fffbeb; }
.status-badge.enabled { color:#047857; background:#ecfdf5; }
.status-badge.disabled { color:#b91c1c; background:#fef2f2; }
.person-title strong { font-size:14px; }
.person-title small { font-size:12px; }
.country-options { background:#fafafa; }
.country-option { background:transparent; }
.country-option strong { color:#27272a; }
.country-option small { color:#52525b; }
.editor-workspace { gap:20px; }
.editor-footer { box-shadow:0 -2px 8px #18181b05; }
.editor-warning { background:#fffbeb; border-color:#fde68a; }
.toast { background:#18181b; color:#fff; border-color:#3f3f46; border-radius:8px; font-size:14px; }
.dashboard,.editor-view { animation:none; }
.sidebar { position:fixed; top:0; bottom:0; left:0; z-index:40; width:256px; background:#fff; border-right:1px solid #e4e4e7; display:flex; flex-direction:column; padding:26px 16px 16px; }
.sidebar-brand { display:flex; gap:12px; align-items:center; color:#18181b; text-decoration:none; padding:0 12px 26px; font-size:20px; font-weight:600; }
.sidebar-brand img { width:36px; height:36px; border-radius:8px; }
.brand-sub { display:block; color:#71717a; font-size:12px; font-weight:400; margin-top:2px; }
.sidebar-context { display:flex; gap:10px; align-items:center; padding:12px; margin-bottom:20px; border:1px solid var(--line); border-radius:8px; font-size:13px; }
.sidebar-context small { display:block; font-size:11px; color:#71717a; margin-top:4px; }
.context-mark { padding:8px 6px; border-radius:6px; background:#fff7ed; color:#9a3412; font-size:12px; }
.sidebar-nav { overflow-y:auto; flex:1; }
.sidebar-nav p { color:#71717a; font-size:12px; margin:20px 12px 10px; }
.sidebar-nav button { display:flex; gap:12px; align-items:center; width:100%; text-align:left; padding:12px; margin-bottom:4px; background:none; color:#52525b; border:1px solid transparent; }
.sidebar-nav button:hover { background:#f4f4f5; }
.sidebar-nav button[aria-current=page] { background:#eff6ff; color:#1d4ed8; border-color:#bfdbfe; font-weight:600; }
.nav-icon { display:inline-block; width:20px; text-align:center; font-size:18px; transition:transform 150ms; }
.sidebar-nav button:hover .nav-icon { transform:translateX(2px); }
.sidebar-bottom { border-top:1px solid var(--line); padding:18px 12px 0; font-size:13px; }
.sidebar-bottom small { display:block; color:#71717a; font-size:11px; margin-top:8px; }
.sidebar-bottom button { margin-top:18px; background:#f4f4f5; width:100%; color:#52525b; }
body.sidebar-collapsed .sidebar { width:76px; padding-inline:10px; }
body.sidebar-collapsed .shell { margin-left:76px; }
body.sidebar-collapsed .sidebar-brand { padding-inline:8px; }
body.sidebar-collapsed .sidebar-brand > span,body.sidebar-collapsed .sidebar-context,body.sidebar-collapsed .nav-label,body.sidebar-collapsed .sidebar-nav p,body.sidebar-collapsed .sidebar-bottom > small,body.sidebar-collapsed #sidebarUser { display:none; }
body.sidebar-collapsed .sidebar-bottom { padding-inline:0; }
.mobile-menu { display:none; }
.analytics-toolbar { display:flex; align-items:end; gap:16px; flex-wrap:wrap; margin-bottom:24px; }
.analytics-toolbar label { display:grid; gap:8px; margin:0; font-size:13px; min-width:160px; }
.analytics-toolbar > span { color:#71717a; font-size:12px; margin-left:auto; }
.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; margin-bottom:24px; }
.metric { background:white; border:1px solid var(--line); border-radius:12px; padding:22px; }
.metric:hover { box-shadow:0 4px 10px #18181b08; }
.metric span { color:#52525b; font-size:13px; }
.metric strong { display:block; font-size:28px; font-weight:600; margin-top:14px; }
.metric small { color:#71717a; font-size:12px; display:block; margin-top:8px; }
.chart-legend { color:#1d4ed8; font-size:12px; }
.activity-chart { height:290px; display:flex; align-items:end; gap:6px; border-bottom:1px solid var(--line); padding:20px 0 30px; overflow-x:auto; background:repeating-linear-gradient(to top,transparent 0,transparent 59px,#f4f4f5 60px); }
.chart-column { display:flex; flex:1; height:100%; min-width:16px; flex-direction:column; justify-content:end; align-items:center; position:relative; }
.chart-bar { display:block; width:70%; background:#3b82f6; border-radius:3px 3px 0 0; min-height:2px; }
.chart-column:hover .chart-bar,.chart-column:focus .chart-bar { background:#1d4ed8; }
.chart-column small { position:absolute; bottom:-23px; font-size:10px; color:#71717a; white-space:nowrap; }
.chart-tooltip { display:none; position:absolute; bottom:100%; background:#18181b; color:#fff; padding:6px; border-radius:4px; z-index:2; font-size:11px; white-space:nowrap; }
.chart-column:hover .chart-tooltip,.chart-column:focus .chart-tooltip { display:block; }
.activity-detail { margin-top:24px; }
.replace-fields { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.replace-fields label { display:grid; gap:8px; }
fieldset { border:1px solid var(--line); border-radius:8px; padding:16px; margin:20px 0; }
legend { color:#3f3f46; font-weight:500; font-size:13px; }
.permission-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.permission-grid label { display:flex; gap:8px; align-items:center; margin:0; overflow-wrap:anywhere; }
.permission-grid input { width:16px; height:16px; flex:none; }
pre { white-space:pre-wrap; overflow-wrap:anywhere; font-size:12px; line-height:1.7; max-height:360px; overflow:auto; color:#3f3f46; }
.history-pagination { display:flex; justify-content:end; align-items:center; gap:16px; margin-top:20px; }
#urlSearch { max-width:360px; }
#historyApp { width:min(320px,100%); }
.history-diff { min-width:220px; }
.history-diff summary { color:#1d4ed8; cursor:pointer; }
@media(max-width:1200px) { .shell { padding:24px; } .metric-grid { gap:12px; } .page-heading { align-items:start; flex-direction:column; } }
@media(max-width:1023px) {
  body.authenticated .shell,body.sidebar-collapsed .shell { margin-left:0; padding:76px 16px 40px; }
  .sidebar { transform:translateX(-100%); }
  body.drawer-open .sidebar { transform:none; width:256px; }
  .mobile-menu { display:block; position:fixed; top:16px; left:16px; z-index:35; background:#fff; border:1px solid var(--line); }
  .sidebar-overlay { position:fixed; inset:0; z-index:39; background:#18181b66; border-radius:0; }
  .metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .permission-grid { grid-template-columns:1fr 1fr; }
  .panel { padding:16px; }
  .replace-fields { grid-template-columns:1fr; gap:0; }
  .sidebar-bottom #collapseSidebar { display:none; }
  .sidebar-nav .nav-label,.sidebar-brand > span { display:initial; }
  .analytics-toolbar > span { margin-left:0; }
}
@media(max-width:760px) {
  .table-wrap table { display:table; min-width:660px; }
  .table-wrap thead { display:table-header-group; }
  .table-wrap tbody { display:table-row-group; }
  .table-wrap tr { display:table-row; padding:0; border:0; }
  .table-wrap td,.table-wrap th { display:table-cell; }
  .table-wrap td::before { display:none; }
  .heading-actions { justify-content:start; }
  .topbar .brand-copy { display:none; }
  .metric { padding:16px; }
  .metric strong { font-size:24px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
