:root {
  --dash-bg: #f7f7f8;
  --dash-panel: #ffffff;
  --dash-ink: #18181b;
  --dash-muted: #71717a;
  --dash-border: #e4e4e7;
  --dash-soft: #f4f4f5;
  --dash-accent: #d97706;
  --dash-accent-soft: #fff7ed;
  --dash-sidebar: 248px;
}

* { box-sizing: border-box; }
body.dashboard-page { margin: 0; min-height: 100vh; background: var(--dash-bg); color: var(--dash-ink); }
.dashboard-shell { min-height: 100vh; }
.dashboard-sidebar {
  position: fixed; inset: 0 auto 0 0; z-index: 50; display: flex; width: var(--dash-sidebar);
  flex-direction: column; border-right: 1px solid var(--dash-border); background: rgba(255,255,255,.98);
  transition: transform .2s ease;
}
.dashboard-brand { display: flex; align-items: center; gap: 11px; height: 68px; padding: 0 18px; border-bottom: 1px solid var(--dash-border); text-decoration: none; color: var(--dash-ink); }
.dashboard-brand img { width: 38px; height: 38px; border-radius: 10px; object-fit: cover; box-shadow: 0 4px 14px rgba(24,24,27,.08); }
.dashboard-brand strong { display: block; font-size: .96rem; line-height: 1.2; }
.dashboard-brand small { display: block; margin-top: 3px; color: var(--dash-muted); font-size: .66rem; }
.dashboard-nav { flex: 1; overflow-y: auto; padding: 16px 12px; }
.dashboard-nav-label { margin: 13px 10px 7px; color: #a1a1aa; font-size: .64rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.dashboard-nav-label:first-child { margin-top: 0; }
.dashboard-nav-link { display: flex; align-items: center; gap: 10px; min-height: 40px; margin: 2px 0; padding: 0 11px; border-radius: 8px; color: #52525b; font-size: .8rem; font-weight: 560; text-decoration: none; transition: background .16s ease, color .16s ease; }
.dashboard-nav-link:hover { background: var(--dash-soft); color: var(--dash-ink); }
.dashboard-nav-link.active { background: var(--dash-ink); color: #fff; }
.dashboard-nav-icon { display: grid; place-items: center; width: 20px; font-size: .9rem; }
.dashboard-sidebar-foot { padding: 12px; border-top: 1px solid var(--dash-border); }
.dashboard-user { display: flex; align-items: center; gap: 10px; padding: 10px; border-radius: 9px; background: var(--dash-soft); }
.dashboard-user-avatar { display: grid; place-items: center; width: 32px; height: 32px; flex: none; border-radius: 8px; background: var(--dash-ink); color: #fff; font-size: .75rem; font-weight: 800; }
.dashboard-user strong { display: block; max-width: 125px; overflow: hidden; font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-user small { display: block; margin-top: 2px; color: var(--dash-muted); font-size: .63rem; }
.dashboard-main { min-height: 100vh; margin-left: var(--dash-sidebar); }
.dashboard-topbar { position: sticky; top: 0; z-index: 35; display: flex; align-items: center; justify-content: space-between; height: 68px; padding: 0 28px; border-bottom: 1px solid var(--dash-border); background: rgba(255,255,255,.92); backdrop-filter: blur(14px); }
.dashboard-topbar-left, .dashboard-topbar-right { display: flex; align-items: center; gap: 12px; }
.dashboard-topbar-title { font-size: .8rem; font-weight: 650; }
.dashboard-breadcrumb { color: var(--dash-muted); font-size: .7rem; }
.dashboard-topbar-action { padding: 7px 10px; border: 1px solid var(--dash-border); border-radius: 7px; background: #fff; color: #52525b; font: 600 .7rem inherit; text-decoration: none; cursor: pointer; }
.dashboard-topbar-action:hover { border-color: #a1a1aa; color: var(--dash-ink); }
.dashboard-menu-button { display: none; width: 36px; height: 36px; border: 1px solid var(--dash-border); border-radius: 8px; background: #fff; color: var(--dash-ink); cursor: pointer; }
.dashboard-content { width: 100%; max-width: 1640px; margin: 0 auto; padding: 28px; }
.dashboard-page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 22px; }
.dashboard-page-head h1 { margin: 0; font-size: clamp(1.45rem, 2.4vw, 2rem); letter-spacing: -.035em; }
.dashboard-page-head p { margin: 7px 0 0; color: var(--dash-muted); font-size: .78rem; }
.dashboard-page-meta { color: var(--dash-muted); font-size: .74rem; }
.dashboard-section { margin-bottom: 18px; border: 1px solid var(--dash-border); border-radius: 12px; background: var(--dash-panel); box-shadow: 0 1px 2px rgba(24,24,27,.03); }
.dashboard-section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; border-bottom: 1px solid var(--dash-border); }
.dashboard-section-head h2, .dashboard-section-head h3 { margin: 0; font-size: .9rem; }
.dashboard-section-head p { margin: 4px 0 0; color: var(--dash-muted); font-size: .7rem; }
.dashboard-overlay { position: fixed; inset: 0; z-index: 45; display: none; background: rgba(24,24,27,.45); }

body.admin-page { max-width: none; padding: 0; }
.admin-page .admin-header, .admin-page .admin-back { display: none; }
.admin-page .admin-msg { padding: 8px 16px; }
.admin-page .cookie-hub { margin: 0 0 18px; padding: 0; border: 1px solid var(--dash-border); border-radius: 12px; background: #fff; box-shadow: 0 1px 2px rgba(24,24,27,.03); }
.admin-page .cookie-hub-head { margin: 0; padding: 18px 20px; border-bottom: 1px solid var(--dash-border); }
.admin-page .cookie-grid { padding: 16px; }
.admin-page .cookie-card { min-height: 198px; border-color: var(--dash-border); border-radius: 10px; box-shadow: none; }
.admin-page .cookie-card::after { display: none; }
.admin-page .admin-card { border: 1px solid var(--dash-border); border-radius: 12px; box-shadow: 0 1px 2px rgba(24,24,27,.03); }
.admin-page th { background: #fafafa; color: #71717a; }
.admin-page tr:hover td { background: #fcfcfc; }
.admin-page .amount { color: #dc2626; }
.admin-page .btn-xs { min-height: 30px; padding: 5px 10px; border-color: var(--dash-border); border-radius: 7px; background: #fff; color: #3f3f46; }
.admin-page .btn-xs:hover { border-color: #a1a1aa; color: #18181b; }
.admin-table-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; border-bottom: 1px solid var(--dash-border); }
.admin-table-head h2 { margin: 0; font-size: .9rem; }
.admin-table-head span { color: var(--dash-muted); font-size: .72rem; }
.admin-table-scroll { overflow-x: auto; }

body.profile-page { background: var(--dash-bg); }
.profile-page .bg-grid, .profile-page .bg-glow, .profile-page > .app > .header { display: none; }
.profile-page .workbench-app { max-width: none; margin: 0; padding: 0; }
.profile-page .workbench-hero { padding: 24px 26px; border-color: var(--dash-border); border-radius: 12px; background: #fff; box-shadow: 0 1px 2px rgba(24,24,27,.03); }
.profile-page .workbench-hero::after { display: none; }
.profile-page .hero-kicker { color: var(--dash-accent); }
.profile-page .workbench-hero h2 { font-family: inherit; font-size: clamp(1.45rem,2.5vw,2rem); letter-spacing: -.035em; }
.profile-page .metric { min-height: 124px; border-color: var(--dash-border); border-radius: 12px; background: #fff; box-shadow: 0 1px 2px rgba(24,24,27,.03); }
.profile-page .metric::before { width: 3px; background: #d4d4d8; }
.profile-page .metric.primary::before { background: var(--dash-accent); }
.profile-page .metric-icon { border-radius: 8px; background: var(--dash-accent-soft); color: var(--dash-accent); }
.profile-page .metric-value.money { color: var(--dash-ink); }
.profile-page .desk-card { border-color: var(--dash-border); border-radius: 12px; background: #fff; box-shadow: 0 1px 2px rgba(24,24,27,.03); }
.profile-page .desk-card-head, .profile-page .ledger-row, .profile-page .settings-group, .profile-page .account-name { border-color: var(--dash-border); }
.profile-page .ledger-row.head { background: #fafafa; }
.profile-page .source-mark { background: var(--dash-accent-soft); color: #9a3412; }
.profile-page .account-avatar { border-radius: 9px; background: var(--dash-ink); }
.profile-page .form-field input { border-color: var(--dash-border); border-radius: 8px; }
.profile-page .form-field input:focus { border-color: var(--dash-accent); box-shadow: 0 0 0 3px rgba(217,119,6,.1); }
.profile-page .binding-code { border-color: var(--dash-accent); background: var(--dash-accent-soft); color: #9a3412; }

@media (max-width: 900px) {
  .dashboard-sidebar { transform: translateX(-100%); }
  body.dashboard-nav-open .dashboard-sidebar { transform: translateX(0); }
  body.dashboard-nav-open .dashboard-overlay { display: block; }
  .dashboard-main { margin-left: 0; }
  .dashboard-menu-button { display: grid; place-items: center; }
  .dashboard-content { padding: 20px 16px; }
  .dashboard-topbar { padding: 0 16px; }
  .dashboard-breadcrumb { display: none; }
}

@media (max-width: 620px) {
  .dashboard-page-head { align-items: flex-start; flex-direction: column; gap: 8px; }
  .dashboard-topbar-right .dashboard-topbar-action:first-child { display: none; }
  .profile-page .metrics { grid-template-columns: 1fr 1fr; }
  .profile-page .workbench-hero { padding: 20px; }
  .admin-page .cookie-grid { padding: 12px; }
}
