/* Bootstrap working surfaces. Taste Skill adaptation: docs/FRONTEND_TASTE_20261107.md. */
:root {
  color-scheme:dark; background:#0d1117; color:#c9d1d9;
  --canvas:#0d1117; --surface:#161b22; --surface-raised:#21262d; --field:#0d1117;
  --ink:#e6edf3; --muted:#8b949e; --line:#30363d; --line-strong:#484f58; --nav:#0d1117;
  --accent:#58a6ff; --accent-light:#13233b; --action:#1f6feb; --action-ink:#ffffff;
  --positive:#3fb950; --warning:#e3b341; --negative:#f85149; --radius:6px; --shadow:none;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px; --space-6:32px; --space-7:48px;
  --motion-in:140ms; --motion-out:200ms; --motion-press:90ms; --motion-ease:cubic-bezier(.2,.8,.2,1);
  scrollbar-color:#484f58 var(--surface);
}
body{background:var(--canvas);color:#c9d1d9}
.sidebar{background:var(--nav);border-right:1px solid var(--line)}
.brand{color:var(--ink);font-weight:500;letter-spacing:-.8px}
.brand small{color:var(--muted);letter-spacing:1.6px}
.workspace{border:0;border-bottom:1px solid var(--line);border-radius:0;color:#c9d1d9;padding:16px 6px 24px;margin:16px 10px 8px;font-weight:400}
.workspace small,.nav-caption,.operator small,.migration-status small{color:var(--muted)}
.nav-caption{letter-spacing:0;font-size:12px;font-weight:400;margin-top:24px}
#navigation{scrollbar-color:#484f58 transparent}
.nav-item{border-radius:calc(var(--radius) - 2px);color:#8b949e;font-weight:400}
.nav-item svg{color:#8b949e;width:17px;height:17px}
.nav-item:hover{background:#161b22;color:var(--ink)}
.nav-item.active{background:#21262d;color:var(--ink);box-shadow:inset 2px 0 #1f6feb}
.nav-item.active svg{color:#58a6ff}
.migration-status,.operator{color:#c9d1d9}
.operator{border-color:var(--line)}
.avatar,.top-avatar{background:#21262d;color:#c9d1d9;border-radius:calc(var(--radius) - 2px)}
.operator .icon-button{color:var(--muted)}
.operator .icon-button:hover{background:var(--surface-raised)}
.topbar{background:var(--canvas)}
.breadcrumb,.slash,.source-pill,.picker-label{color:var(--muted)}
.breadcrumb strong{color:var(--ink)}
.source-pill .status-dot,.migration-status .status-dot{background:#8b949e}
.card,.stat-card,.drawer,.modal{background:var(--surface);box-shadow:none}
.card-heading h2,.table-title h2,.stat-value,.table .cell-strong,.user-link,.empty h3,.plan-card h2,.settings-card h2,.release-item h3,.drawer-head h2,.modal-head h2,.detail-profile h3,.detail-grid strong,.drawer-section-title,.timeline-item h4,.delete-summary strong,.auth-card h1{color:var(--ink)}
.card-heading p,.table-title p,.page-caption,.stat-label,.stat-meta,.chart-summary span,.edition-row-head,.edition-name,.plan-card>p,.plan-line,.setting-line,.checklist li,.release-item p,.refresh-label,.table-subtext,.drawer-head p,.detail-grid small,.timeline-item p,.delete-summary span,.delete-confirm,.auth-card p,.permission-guide,.table td,.pagination span,.operator-state,.eyebrow{color:var(--muted)}
.page-heading h1{font-weight:500;font-size:30px;letter-spacing:-1px}
.page-heading{margin-bottom:var(--space-6)}
.page-heading p{line-height:1.7;max-width:70ch}
.plan-line strong,.setting-line strong,.form-label,.permission-table th small{color:#c9d1d9}
.button,.pagination button{background:#21262d;border-color:#484f58;color:#c9d1d9;border-radius:calc(var(--radius) - 2px);font-size:13px;font-weight:500;min-height:40px;box-shadow:none;transition:background-color var(--motion-out) var(--motion-ease),border-color var(--motion-out) var(--motion-ease),transform var(--motion-press) var(--motion-ease)}
.button:hover,.pagination button:hover{background:#30363d;border-color:#6e7681}
.button.primary{background:var(--action);border-color:var(--action);color:var(--action-ink);box-shadow:none}
.button.primary:hover{background:#1158c7;border-color:#1158c7}
.button.flat{background:transparent;border-color:transparent;color:#8b949e}
.button.flat:hover,.icon-button:hover{background:#21262d;color:#f0f6fc}
.button.danger{background:#2d171b;border-color:#6e3033;color:var(--negative)}
.button.danger.flat{background:transparent;border-color:transparent;color:var(--negative)}
.button.danger:hover,.button.danger.flat:hover{background:#4c1c24;border-color:#a53b40}
.icon-button{color:var(--muted);border-radius:calc(var(--radius) - 2px)}
.environment-picker select,.filter-select,.form-label input,.form-label select,.form-label textarea,.permission-table select,.permission-table input[type=number]{background:var(--field);border-color:var(--line-strong);color:var(--ink);border-radius:calc(var(--radius) - 2px)}
.form-label{font-size:13px;font-weight:500;margin-bottom:24px}
.form-label input,.form-label select,.form-label textarea{min-height:44px;font-size:14px}
input::placeholder,textarea::placeholder,.search input::placeholder{color:#8b949e}
input[type=checkbox]{accent-color:#1f6feb}
.form-label input:focus,.form-label select:focus,.form-label textarea:focus{border-color:#58a6ff}
.notice{background:transparent;border:0;border-left:2px solid #484f58;border-radius:0;color:#8b949e;padding:4px 16px;margin-bottom:var(--space-6)}
.notice button,.subtle-link,.permission-guide span{color:#58a6ff}
.notice.amber{background:transparent;border-color:#9e6a03;color:var(--warning)}
.badge,.role-pill{border-radius:3px;font-weight:400}
.badge.green,.role-pill.superadmin{background:#12261e;color:var(--positive);border-color:#265d3b}
.badge.orange{background:#2d2514;color:var(--warning);border-color:#6a4f15}
.badge.red{background:#2d171b;color:var(--negative);border-color:#6e3033}
.badge.gray,.badge.outline,.role-pill{background:#21262d;color:#c9d1d9;border-color:#484f58}
.badge.blue{background:#13233b;color:#79c0ff;border-color:#224b7a}
.stats{gap:0;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);margin-bottom:var(--space-6)}
.stat-card{border:0;border-right:1px solid var(--line);border-radius:0;background:transparent;padding:var(--space-5)}
.stat-card:last-child{border-right:0}
.stat-value{font-size:34px;font-weight:500;margin-top:12px}
.stat-label{font-size:13px}
.stat-label svg{color:#8b949e}
.stat-meta .dot,.status-dot{background:#3fb950}
.overview-grid{gap:var(--space-5);margin-bottom:var(--space-6)}
.chart-summary strong{color:var(--ink);font-weight:500}
.chart-grid{stroke:#30363d;stroke-dasharray:2 6}
.chart-line{stroke:#58a6ff;stroke-width:2}
.chart-fill{fill:#1f6feb;opacity:.07}
.y-axis,.x-axis{color:var(--muted)}
.edition-dot,.progress-fill{background:#58a6ff}
.edition-dot.e1,.progress-fill.e1{background:#388bfd}
.edition-dot.e2,.progress-fill.e2{background:#1f6feb}
.edition-dot.e3,.progress-fill.e3{background:#164d9e}
.progress-track{background:#21262d;height:4px;border-radius:1px}
.progress-fill{border-radius:1px}
.search{background:var(--field);border-color:var(--line-strong);color:var(--muted);border-radius:calc(var(--radius) - 2px)}
.search input{color:var(--ink);font-size:13px}
.search:focus-within{border-color:#58a6ff;box-shadow:none}
.table th{background:#0d1117;color:#8b949e;font-weight:400;border-color:var(--line)}
.table td,.plan-line,.setting-line,.timeline-item{border-color:var(--line)}
.table tbody tr:hover{background:#1c2128}
.table .cell-strong{font-weight:500}
.user-avatar,.event-icon,.check-circle,.license-key-mark{background:#21262d;color:#b1bac4;border-color:#30363d;border-radius:calc(var(--radius) - 2px)}
.event-icon.warn{background:#2d2514;color:var(--warning)}
.event-icon.danger{background:#2d171b;color:var(--negative)}
.filter-tabs{background:transparent;padding:0;border-radius:0;gap:4px}
.filter-tab{color:var(--muted);border-radius:3px;font-weight:400;border:1px solid transparent}
.filter-tab span{background:#30363d;color:#8b949e}
.filter-tab.active{background:#13233b;color:var(--ink);border-color:#224b7a;box-shadow:none}
.filter-tab.active span{background:#1c3555;color:#79c0ff}
.backdrop{background:#0009;animation:none}
.modal{border:1px solid var(--line-strong);border-radius:8px}
.drawer{border-left:1px solid var(--line-strong);animation:none}
.drawer-actions,.modal-footer,.policy-savebar,.account-action-bar,.delete-summary{background:#0d1117;border-color:var(--line)}
.key-list{background:#0d1117;border-color:#30363d;color:#c9d1d9;border-radius:calc(var(--radius) - 2px)}
.diagnostics,.totp-secret{background:var(--field);border-color:var(--line-strong);color:#c9d1d9;border-radius:calc(var(--radius) - 2px)}
.form-error{color:var(--negative)}
.error-banner{background:#2d2514;border-color:#6a4f15;color:#e3b341}
.permission-table .permission-group td{background:#21262d;color:#c9d1d9;font-weight:500;letter-spacing:0}
.timeline-item:before{background:#58a6ff}
.toast{background:#21262d;color:#e6edf3;border:1px solid #484f58;border-radius:calc(var(--radius) - 2px);box-shadow:0 8px 32px #0004}
.spinner{border-color:#30363d;border-top-color:#58a6ff}
.auth-card h1{font-weight:500;letter-spacing:-.7px}
.button:focus-visible,.icon-button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:2px solid #58a6ff;outline-offset:3px}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .button:not(:disabled):hover{transform:translateY(-1px)}
  .button:not(:disabled):active{transform:translateY(1px)}
}
@media(max-width:720px){
  .stats{overflow:hidden}
  .stat-card{padding:20px;border-bottom:1px solid var(--line)}
  .stat-card:nth-child(2){border-right:0}
  .stat-card:nth-child(n+3){border-bottom:0}
  .stat-value{font-size:30px}
  .page-heading h1{font-size:27px}
  .form-label input,.form-label select,.form-label textarea{font-size:16px}
}