/* Admin-only shell; creator portal keeps its existing layout and colors. */
.admin-app {
  --bg:#f4f6f5; --ink:#233a32; --muted:#77867f; --muted-strong:#52665c;
  --line:#e2e8e4; --accent:#216149; --accent-deep:#164933; --accent-soft:#e9f2ec;
  --surface-soft:#f0f5f1; --shadow:0 3px 12px rgba(24,49,37,.025);
  --sidebar-width:272px;
  min-height:100vh; min-height:100dvh; background:var(--bg);
}
.admin-app [hidden] { display:none !important; }
.admin-sidebar {
  position:fixed; inset:0 auto 0 0; width:var(--sidebar-width); z-index:45;
  display:flex; flex-direction:column; background:#122e25; color:#dce8df;
  transition:width .2s ease, transform .2s ease;
  padding:0 16px; overflow-x:hidden; box-shadow:4px 0 18px rgba(14,39,28,.04);
}
.admin-brand-row { min-height:96px; display:flex; align-items:center; gap:10px; border-bottom:1px solid #2b443a; flex-shrink:0; }
.admin-brand { display:flex; align-items:center; gap:12px; min-width:0; flex:1; }
.admin-brand-mark { display:grid; place-items:center; width:44px; height:44px; flex:0 0 44px; border-radius:12px; background:#efd49b; color:#173c2c; font-weight:800; font-size:20px; }
.admin-brand-copy { display:grid; gap:5px; white-space:nowrap; }
.admin-brand-copy strong { color:#f5f8f6; font-size:17px; }
.admin-brand-copy small { color:#9cb2a6; font-size:11px; }
.admin-sidebar-toggle { display:grid; place-items:center; width:32px; height:36px; border:1px solid #3a5246; border-radius:9px; color:#c4d4ca; background:#ffffff06; font-size:24px; flex-shrink:0; }
.admin-sidebar-toggle:hover { background:#294d3e; color:#fff; }
.admin-navigation { flex:1; min-height:0; overflow-y:auto; overflow-x:hidden; padding:12px 0 24px; scrollbar-width:thin; scrollbar-color:#466151 transparent; }
.admin-nav-group { margin-top:12px; }
.admin-group-toggle { width:100%; display:flex; justify-content:space-between; align-items:center; gap:6px; border:0; background:none; color:#92aa9d; padding:12px 12px 10px; font-size:11px; font-weight:600; letter-spacing:.08em; }
.admin-group-toggle:hover { color:#e4ece7; }
.admin-chevron { transition:transform .18s; font-size:14px; }
.admin-group-toggle[aria-expanded="false"] .admin-chevron { transform:rotate(-90deg); }
.admin-group-links { display:grid; gap:6px; }
.admin-nav-link { display:flex; width:100%; align-items:center; gap:12px; min-height:54px; padding:9px 12px; border:0; border-radius:11px; background:transparent; color:#b2c6b9; text-align:left; white-space:nowrap; font-size:14px; }
.admin-nav-link:hover { background:#1a3c2f; color:#fff; }
.admin-nav-link.active { background:#214c39; color:#f7f9f5; font-weight:700; }
.admin-nav-icon { width:34px; height:34px; flex:0 0 34px; display:grid; place-items:center; border-radius:10px; font-size:14px; background:#ffffff06; color:#a8c0b1; }
.admin-nav-link.active .admin-nav-icon { background:#efd49b; color:#163d29; }
.admin-sidebar-footer { display:flex; align-items:center; gap:10px; min-height:82px; border-top:1px solid #2b443a; padding:15px 10px calc(15px + env(safe-area-inset-bottom)); }
.admin-operator-icon { display:grid; place-items:center; width:32px; height:32px; flex:0 0 32px; border-radius:50%; color:#c6d6ca; background:#274637; font-size:13px; }
.admin-operator-copy { display:grid; gap:5px; white-space:nowrap; }
.admin-operator-copy strong { font-size:12px; font-weight:500; }
.admin-operator-copy small { font-size:10px; color:#8fa797; }
.admin-workspace { min-width:0; margin-left:var(--sidebar-width); transition:margin-left .2s ease; }
.admin-topbar { position:sticky; top:0; z-index:20; height:72px; padding:0 32px; display:flex; justify-content:space-between; align-items:center; gap:12px; border-bottom:1px solid var(--line); background:#fff; }
.admin-header-start { display:flex; gap:16px; align-items:center; min-width:0; }
.admin-menu-button { display:grid; place-items:center; width:40px; height:40px; border:1px solid var(--line); border-radius:10px; background:#fff; color:#446454; flex-shrink:0; }
.admin-menu-button:hover { background:#edf3ef; }
.admin-breadcrumb { display:flex; align-items:center; gap:12px; font-size:13px; white-space:nowrap; }
.admin-breadcrumb > span { color:#86958c; }
.admin-breadcrumb > i { color:#bac5be; font-style:normal; }
.admin-breadcrumb strong { font-weight:600; }
.admin-account-label { display:flex; align-items:center; gap:8px; color:#718578; font-size:12px; white-space:nowrap; }
.admin-status-light { width:6px; height:6px; border-radius:100%; background:#5b8c6f; }
.admin-main { padding:32px; margin:0 auto; max-width:1500px; outline:none; }
.admin-app .page-head { margin-bottom:24px; align-items:center; }
.admin-app h1 { font-size:27px; letter-spacing:0; line-height:1.35; }
.admin-app .eyebrow { color:#779483; font-size:11px; letter-spacing:.06em; }
.admin-app .page-subtitle { line-height:1.75; color:#7c8b82; font-size:13px; }
.admin-app .panel,.admin-app .kpi { box-shadow:var(--shadow); border-radius:14px; }
.admin-app .kpi-grid { grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:16px; margin-bottom:24px; }
.admin-app .kpi { padding:20px; }
.admin-app .kpi-symbol { color:#638873; background:#f0f5f1; font-size:13px; width:32px; height:32px; }
.admin-app .kpi strong { color:#254635; font-size:29px; font-weight:600; letter-spacing:0; margin-top:12px; }
.admin-app .section { margin-top:24px; }
.admin-app .section-title { gap:12px; margin-bottom:20px; flex-wrap:wrap; }
.admin-app .section-title h2 { font-size:16px; font-weight:600; }
.admin-app .data-table th { background:#f7f9f7; font-size:12px; padding:14px 16px; }
.admin-app .data-table td { padding:18px 16px; line-height:1.65; }
.admin-app .data-table th,.admin-app .data-table td { border-color:#edf1ee; }
.admin-app .data-table tr:last-child td { border-bottom:0; }
.admin-app .data-table td:first-child { white-space:normal; min-width:175px; max-width:320px; }
.admin-app .data-table td .ghost { padding:7px 11px; font-size:12px; margin:3px 5px 3px 0; }
.admin-app .primary { box-shadow:none; border-radius:9px; white-space:nowrap; }
.admin-app .primary:hover { transform:none; }
.admin-app .ghost { border-radius:9px; }
.admin-app .ghost:hover { border-color:#afc8b8; color:#245d3f; }
.admin-app .notice { background:#f4f7f3; border-color:#e1e9df; color:#687963; }
.admin-app .guide-card { background:#fafcf9; }
.admin-app .guide-card p { overflow-wrap:anywhere; }
.admin-app .guide-manager-grid { grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); align-items:start; }
.admin-app .form-panel { gap:18px; }
.admin-app .field input,.admin-app .field textarea,.admin-app .field select { font-family:inherit; border-radius:9px; }
.admin-app .field input:focus,.admin-app .field textarea:focus,.admin-app .field select:focus { border-color:#81ab92; box-shadow:0 0 0 3px #2161490c; }
.admin-app .modal { max-height:calc(100dvh - 32px); overflow-y:auto; overscroll-behavior:contain; }
.admin-app .modal-backdrop { z-index:80; }
.admin-app .toast { z-index:90; }
.admin-app button:focus-visible,.admin-app a:focus-visible { outline:2px solid #caaa6c; outline-offset:3px; }
.admin-todo-row { display:flex; align-items:center; gap:14px; width:100%; border:0; border-top:1px solid #edf1ee; background:#fff; padding:20px 4px; text-align:left; color:var(--ink); }
.admin-todo-row:hover { background:#f8faf8; }
.admin-todo-icon { display:grid; place-items:center; width:42px; height:42px; background:#eff4ef; color:#5f846d; font-size:15px; border-radius:12px; }
.admin-todo-copy { display:grid; gap:5px; flex:1; }
.admin-todo-copy strong { font-size:14px; font-weight:600; }
.admin-todo-copy small { font-size:12px; color:#839187; }
.admin-count { color:#3c654c; background:#edf4ee; border-radius:8px; padding:4px 9px; font-size:12px; }
.admin-row-arrow { color:#9eafa2; font-size:20px; margin-left:10px; }
.admin-app.is-collapsed { --sidebar-width:80px; }
.admin-app.is-collapsed .admin-sidebar { padding:0 10px; }
.admin-app.is-collapsed .admin-brand-row { min-height:118px; flex-direction:column; justify-content:center; gap:9px; padding:12px 0; }
.admin-app.is-collapsed .admin-brand { flex:0; }
.admin-app.is-collapsed .admin-brand-copy,.admin-app.is-collapsed .admin-nav-label,.admin-app.is-collapsed .admin-group-toggle,.admin-app.is-collapsed .admin-operator-copy { display:none; }
.admin-app.is-collapsed .admin-nav-link { padding:9px 0; justify-content:center; }
.admin-app.is-collapsed .admin-nav-group + .admin-nav-group { border-top:1px solid #2b443a; padding-top:12px; }
.admin-app.is-collapsed .admin-sidebar-footer { padding-left:0; padding-right:0; justify-content:center; }
.admin-backdrop { display:none; }
body.admin-drawer-lock { overflow:hidden; }
@media (max-width:1100px) {
  .admin-app { --sidebar-width:248px; }
  .admin-main { padding:26px; }
  .admin-topbar { padding:0 26px; }
  .admin-app .guide-manager-grid { grid-template-columns:1fr; }
}
@media (max-width:900px) {
  .admin-app { --sidebar-width:0px; }
  .admin-sidebar { width:min(324px,calc(100vw - 36px)); transform:translateX(-100%); visibility:hidden; padding:0 18px; z-index:71; }
  .admin-app.is-drawer-open .admin-sidebar { transform:translateX(0); visibility:visible; }
  .admin-backdrop { position:fixed; inset:0; background:#10291f66; border:0; z-index:70; padding:0; }
  .admin-app.is-drawer-open .admin-backdrop { display:block; }
  .admin-workspace { margin-left:0; }
  .admin-topbar { height:64px; padding:0 18px; }
  .admin-main { padding:24px 18px calc(30px + env(safe-area-inset-bottom)); }
  .admin-brand-row { min-height:88px; }
  .admin-navigation { padding-top:5px; }
  .admin-nav-group { margin-top:10px; }
  .admin-group-toggle { padding:10px 12px; }
  .admin-nav-link { min-height:54px; }
  .admin-sidebar-footer { min-height:70px; }
  .admin-app .page-head { flex-wrap:wrap; gap:15px; }
  .admin-app .page-head .primary { display:inline-flex; }
  .admin-app .kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .admin-app .kpi { padding:16px; }
}
@media (max-width:520px) {
  .admin-account-label { display:none; }
  .admin-header-start { gap:12px; }
  .admin-breadcrumb { gap:9px; font-size:12px; }
  .admin-main { padding:23px 14px 32px; }
  .admin-app h1 { font-size:25px; }
  .admin-app .panel { padding:16px; }
  .admin-app .kpi strong { font-size:26px; }
  .admin-app .kpi-top { font-size:12px; }
  .admin-app .kpi-symbol { width:27px; height:27px; }
  .admin-app .table-wrap::before { content:'左右滑动查看完整表格'; display:block; font-size:11px; color:#87968c; margin-bottom:10px; }
  .admin-todo-row { gap:10px; padding:18px 0; }
  .admin-todo-copy small { font-size:11px; }
}
@media (prefers-reduced-motion:reduce) {
  .admin-sidebar,.admin-workspace,.admin-chevron { transition:none; }
}

.admin-app .modal-wide { width:min(760px,calc(100vw - 32px)); }
.admin-app .form-section-title { margin-top:4px; padding-top:15px; border-top:1px solid #e8eee9; color:#2c6044; font-size:13px; font-weight:700; }
.admin-app .task-analytics-title { display:flex; align-items:center; justify-content:space-between; gap:22px; margin-bottom:20px; padding:24px 26px; }
.admin-app .task-analytics-title h2 { margin:10px 0 5px; font-size:22px; letter-spacing:-.02em; }
.admin-app .task-analytics-title p { margin:0; color:#829187; font-size:13px; }
.admin-app .analytics-rule-summary { display:grid; gap:5px; min-width:120px; text-align:right; }
.admin-app .analytics-rule-summary strong { color:#236344; font-size:25px; }
.admin-app .analytics-rule-summary span { color:#829187; font-size:12px; }
.admin-app .analytics-tabs { display:flex; flex-wrap:wrap; gap:9px; margin-bottom:16px; }
.admin-app .analytics-tabs .pill { border:1px solid #e2ebe4; background:#f7faf7; color:#5d7565; }
.admin-app .analytics-tabs .pill.active { border-color:#afd0b7; background:#e3f1e6; color:#216143; }
.admin-app .rank-number { display:inline-grid; place-items:center; min-width:27px; height:27px; border-radius:8px; background:#edf5ef; color:#3e7051; }
.admin-app .analytics-kpis { margin-bottom:20px; }
.admin-app .analytics-kpis .kpi small { white-space:nowrap; }
.admin-app .leaderboard-selector { margin-bottom:20px; }
.admin-app .leaderboard-task-select { width:min(100%,520px); min-height:44px; padding:0 14px; border:1px solid #dce8df; border-radius:12px; background:#fbfdfb; color:#244b35; font:inherit; }
@media (max-width:600px) {
  .admin-app .task-analytics-title { align-items:flex-start; flex-direction:column; padding:20px; }
  .admin-app .analytics-rule-summary { text-align:left; }
}