/* Account-region enrichment progress */
.region-coverage { padding: 25px 28px; margin-bottom: 24px; }
.region-coverage-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.region-coverage-heading h2 { margin: 0; font-size: 20px; font-weight: 500; letter-spacing: -.025em; }
.region-coverage-heading p { margin: 6px 0 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.region-coverage-summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 22px; margin-top: 22px; }
.region-coverage-summary > strong { font-size: clamp(32px, 4vw, 43px); font-weight: 400; line-height: 1.15; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.region-coverage-summary > strong > span { font-size: .6em; color: var(--muted); }
.region-coverage-summary p { margin: 0; color: var(--muted); font-size: 14px; }
.region-coverage-summary b { font-weight: 500; color: var(--text); }
.region-coverage-track { height: 7px; overflow: hidden; border-radius: 99px; background: var(--border); margin: 19px 0 22px; }
.region-coverage-track > span { display: block; height: 100%; border-radius: inherit; background: var(--text); transition: width 700ms cubic-bezier(.22,1,.36,1); }
.region-coverage-counts { display: flex; flex-wrap: wrap; gap: 18px 42px; margin: 0 0 18px; }
.region-coverage-counts dt { font-size: 12px; color: var(--muted); margin-bottom: 5px; }
.region-coverage-counts dd { margin: 0; font-size: 19px; font-weight: 400; font-variant-numeric: tabular-nums; }
.region-coverage-note { color: var(--muted); font-size: 12px; line-height: 1.65; margin: 0; max-width: 750px; }
.region-coverage-footnote { display: flex; flex-wrap: wrap; gap: 7px 20px; color: var(--muted); font-size: 11px; margin-top: 12px; }
.region-coverage-error { color: var(--yellow); font-size: 13px; line-height: 1.6; margin: 14px 0 0; }
@media (max-width: 600px) {
  .region-coverage { padding: 20px 18px; }
  .region-coverage-heading { flex-wrap: wrap; gap: 12px; }
  .region-coverage-counts { gap: 18px 26px; }
}
@media (prefers-reduced-motion: reduce) {
  .region-coverage-track > span { transition: none; }
}

/* RecTok Admin theme, aligned with the public website's design-system.css.
   Loaded after the legacy inline rules so the current admin features remain intact. */
:root {
  --bg: #1d1c28;
  --panel: #292738;
  --panel-solid: #292738;
  --card: #282637;
  --card-hover: #322f45;
  --sidebar: #211f2f;
  --nav-active: #39354a;
  --nav-active-border: #4e4962;
  --border: #454257;
  --border-strong: #5a566b;
  --text: #e8e5ed;
  --text-dim: #d4d0db;
  --muted: #aba7b4;
  --muted-2: #817c8b;
  --accent: #f5f5f7;
  --accent-2: #f5f5f7;
  --bar: #c9c3d5;
  --bar-hi: #f5f5f7;
  --pink: #b9b3c5;
  --cyan: #b9b3c5;
  --green: #82d8a1;
  --red: #e88998;
  --yellow: #e2be75;
  --blue: #a9a1bc;
  --radius: 10px;
  --radius-sm: 8px;
  --mono: 'RecTok SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
body {
  font-family: var(--mono);
  color: var(--text);
  background: radial-gradient(900px 520px at 82% -18%, rgba(153,137,210,.14), transparent 68%), var(--bg);
}
::selection { background: #c9c3d5; color: #17151f; }
::-webkit-scrollbar-thumb { background: #4c485b; border-color: var(--bg); }
::-webkit-scrollbar-thumb:hover { background: #625d72; }

.sidebar { background: #211f2f; border-right-color: #3d394d; box-shadow: none; }
.sidebar-logo { min-height: 80px; padding: 20px 19px; border-bottom-color: #3d394d; }
.sidebar-logo .logo-lockup { width: 130px; height: 32px; }
.sidebar-logo .logo-lockup, .login-logo { filter: grayscale(1) brightness(1.55); }
.sidebar-nav { padding: 12px 11px 18px; }
.sidebar-section-label { padding: 20px 10px 8px; color: #938e9d; font-size: 9px; font-weight: 700; letter-spacing: .12em; }
.nav-item { min-height: 40px; margin: 3px 0; padding: 9px 11px; border-radius: 8px; color: #b3aeba; font-size: 13px; }
.nav-item:hover { background: #302d40; color: #f0edf4; }
.nav-item.active { background: #39354a; border-color: #4e4962; color: #fff; }
.nav-item.active .nav-icon { color: #f5f5f7; }
.sidebar-primary { padding-bottom: 8px; }
.sidebar-group { border-top: 1px solid #3d394d; padding-top: 7px; margin-top: 7px; }
.sidebar-group-toggle {
  width: 100%; min-height: 40px; display: flex; align-items: center; gap: 11px;
  padding: 9px 11px; border-radius: 8px; color: #b3aeba;
  font-size: 13px; font-weight: 600; text-align: left;
  transition: background .18s ease, color .18s ease;
}
.sidebar-group-toggle:hover, .sidebar-group-toggle.active { background: #302d40; color: #f0edf4; }
.sidebar-group-toggle:focus-visible, .nav-item:focus-visible { outline: 2px solid #f5f5f7; outline-offset: 2px; }
.sidebar-group-toggle .nav-icon { display: flex; align-items: center; justify-content: center; width: 18px; height: 18px; flex: none; }
.sidebar-group-toggle .nav-icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.sidebar-group-chevron { display: flex; margin-left: auto; flex: none; transition: transform .22s ease; }
.sidebar-group-chevron svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.sidebar-group-toggle[aria-expanded="true"] .sidebar-group-chevron { transform: rotate(180deg); }
.sidebar-group-items { max-height: 0; opacity: 0; overflow: hidden; visibility: hidden; padding-left: 8px; transition: max-height .28s ease, opacity .18s ease, visibility 0s linear .28s; }
.sidebar-group-items.open { max-height: 420px; opacity: 1; visibility: visible; transition: max-height .28s ease, opacity .18s ease, visibility 0s; }
.sidebar-group-items .nav-item { font-size: 12px; }
.sidebar-foot { min-height: 60px; padding: 14px 17px; background: transparent; border-top-color: #3d394d; }
.sidebar-foot .foot-logout { color: #b6b1bc; border: 1px solid #454257; border-radius: 8px; background: #292738; }
.sidebar-foot .foot-logout:hover { color: #fff; background: #343146; }

/* Desktop sidebar: keep navigation available as an icon rail when collapsed. */
.sidebar-logo { justify-content: space-between; }
.sidebar-collapse-toggle {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 32px; height: 32px; border: 1px solid #454257; border-radius: 8px;
  background: #292738; color: #d6d1dd;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.sidebar-collapse-toggle:hover { background: #343146; border-color: #787281; color: #fff; }
.sidebar-collapse-toggle:focus-visible { outline: 2px solid #f5f5f7; outline-offset: 2px; }
.sidebar-collapse-toggle svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.nav-label { display: block; max-width: 180px; overflow: hidden; white-space: nowrap; opacity: 1; transition: max-width .24s ease, opacity .16s ease; }
.sidebar-section-label { overflow: hidden; white-space: nowrap; }

@media (min-width: 861px) {
  .sidebar { flex-shrink: 0; transition: width .28s cubic-bezier(.22,.75,.25,1), min-width .28s cubic-bezier(.22,.75,.25,1); }
  .main { min-width: 0; }
  .sidebar-logo .logo-lockup { transition: width .22s ease, opacity .16s ease; }
  .sidebar.collapsed { width: 68px; min-width: 68px; }
  .sidebar.collapsed .sidebar-logo { justify-content: center; gap: 0; padding-left: 10px; padding-right: 10px; }
  .sidebar.collapsed .logo-lockup { width: 0; opacity: 0; }
  .sidebar.collapsed .sidebar-nav { padding-left: 9px; padding-right: 9px; }
  .sidebar.collapsed .sidebar-primary { padding-bottom: 4px; }
  .sidebar.collapsed .sidebar-group { margin-top: 4px; padding-top: 4px; }
  .sidebar.collapsed .nav-item { justify-content: center; gap: 0; padding-left: 0; padding-right: 0; }
  .sidebar.collapsed .sidebar-group-toggle { justify-content: center; gap: 0; padding-left: 0; padding-right: 0; }
  .sidebar.collapsed .sidebar-group-items { max-height: 0; opacity: 0; visibility: hidden; }
  .sidebar.collapsed .sidebar-group-chevron { display: none; }
  .sidebar.collapsed .nav-label { max-width: 0; opacity: 0; }
  .sidebar.collapsed .sidebar-foot { justify-content: center; padding-left: 9px; padding-right: 9px; }
  .sidebar.collapsed .foot-logout { margin-left: 0; }
}
@media (max-width: 860px) { .sidebar-collapse-toggle { display: none; } }
@media (prefers-reduced-motion: reduce) {
  .sidebar, .sidebar-logo .logo-lockup, .nav-label, .sidebar-collapse-toggle, .sidebar-group-items, .sidebar-group-chevron { transition: none !important; }
}

.topbar {
  min-height: 72px; padding: 14px 36px; border-bottom-color: #3d394d;
  background: rgba(29,28,40,.92); backdrop-filter: blur(18px) saturate(105%);
}
.topbar .breadcrumb { color: #aaa5b1; font-size: 13px; }
.topbar .breadcrumb .crumb-logo { color: #c5c0cc; }
.topbar .breadcrumb .crumb-cur { color: #f5f5f7; }
.topbar .breadcrumb .sep { color: #716c7a; }
.topbar-status, .topbar-clock { background: #292738; border-color: #454257; color: #d1ccd7; border-radius: 8px; }
.content { padding: 42px 40px 56px; }
.content > .page-anim { max-width: 1280px; }

.page-head { margin-bottom: 30px; }
.page-kicker { color: #aaa5b6; font-size: 10px; letter-spacing: .12em; }
.page-title { color: #f5f5f7; font-size: 34px; font-weight: 650; letter-spacing: -.045em; }
.page-sub { max-width: 660px; color: #aaa5b1; font-size: 14px; line-height: 1.6; }
.page-status { border-color: transparent; background: #253b2e; color: #afe7c2; border-radius: 999px; }
.page-status.warning { border-color: transparent; background: #423619; color: #eed08a; }
.alert-banner { border-color: #454257; background: #292738; border-radius: 10px; }

.cards-grid { gap: 14px; margin-bottom: 18px; border: 0; background: transparent; }
.dashboard-cards { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.dashboard-shortcuts {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
  margin: -2px 0 18px; padding: 10px 12px;
  border: 1px solid #454257; border-radius: 10px; background: #252334;
}
.dashboard-shortcuts-label { margin: 0 8px 0 2px; color: #aaa5b1; font-size: 11px; font-weight: 650; }
.dashboard-shortcuts button {
  padding: 7px 10px; border: 1px solid #454257; border-radius: 7px;
  background: #292738; color: #e8e5ed; font-size: 11px; font-weight: 600;
  transition: background .16s ease, border-color .16s ease;
}
.dashboard-shortcuts button:hover { background: #343146; border-color: #787281; }
.dashboard-shortcuts button:focus-visible { outline: 2px solid #f5f5f7; outline-offset: 2px; }
.dashboard-shortcuts button span { margin-left: 8px; color: #aaa5b1; }
.dashboard-chart { margin-bottom: 14px; }
.dashboard-details { margin-bottom: 10px; }
.dashboard-details > summary {
  display: flex; align-items: center; gap: 12px; list-style: none;
  min-height: 56px; padding: 16px 22px; cursor: pointer;
}
.dashboard-details > summary::-webkit-details-marker { display: none; }
.dashboard-details > summary > span:first-child { color: #f1eef4; font-size: 13px; font-weight: 650; }
.dashboard-details > summary > span:nth-child(2) { margin-left: auto; color: #aaa5b1; font-size: 11px; }
.dashboard-details > summary::after { content: '⌄'; color: #aaa5b1; font-size: 19px; line-height: 1; transition: transform .18s ease; }
.dashboard-details[open] > summary { border-bottom: 1px solid #454257; }
.dashboard-details[open] > summary::after { transform: rotate(180deg); }
.dashboard-details .snapshot-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 22px; padding: 8px 22px 18px; }
.dashboard-details .snapshot-list > div { min-width: 0; }
.cards-grid .card { padding: 22px; background: #292738; border: 1px solid #454257; border-radius: 10px; }
.metric-card, .cards-grid .metric-card { min-height: 132px; border-top: 1px solid #454257; }
.metric-card::after, .metric-marker { display: none; }
.tone-cyan, .tone-pink, .tone-green, .tone-blue { --metric-color: #c9c3d5; }
.card-label { color: #aaa5b1; font-size: 10px; font-weight: 650; letter-spacing: .1em; }
.card-value { color: #f5f5f7; font-size: 31px; font-weight: 650; letter-spacing: -.04em; }
.card-value.sm { font-size: 20px; }
.card-sub { color: #aaa5b1; font-size: 10px; letter-spacing: .045em; }
.card-trend.up { color: #afe7c2; background: #253b2e; }
.card-trend.down { color: #ffd5da; background: #4a2833; }
.panel { background: #292738; border-color: #454257; border-radius: 10px; box-shadow: none; }
.panel-head { padding: 21px 22px 4px; }
.panel-pad { padding: 22px; }
.panel-title, .table-title { color: #f1eef4; font-size: 14px; font-weight: 650; }
.panel-sub, .table-count, .panel-eyebrow { color: #aaa5b1; }
.table-toolbar { min-height: 58px; padding: 15px 22px; }
.table-toolbar, .filter-toolbar { flex-wrap: wrap; }
.table-toolbar .table-actions, .filter-toolbar .table-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.filter-panel .filter-note { padding: 0 22px 16px; color: #aaa5b1; font-size: 11px; line-height: 1.5; }
.filter-toolbar .table-actions { flex: 1; justify-content: flex-end; }
.filter-panel .filter-search { flex: 1 1 280px; min-width: 0; }
.snapshot-list span { color: #aaa5b1; }
.snapshot-list strong { color: #f1eef4; }
.range-chip { color: #aaa5b1; border-color: #454257; border-radius: 8px; }
.chart-panel .vbar { background: #817b92; box-shadow: none; }
.chart-panel .vbar.hi { background: #e8e5ed; box-shadow: none; }
.vbars { position: relative; }
.vbar-col { cursor: crosshair; }
.vbar-col:focus-visible { outline: 1px solid #c9c3d5; outline-offset: 2px; }
.vbar-col:focus-visible .vbar { opacity: 1; }
.vbar-tooltip {
  position: absolute; z-index: 3; transform: translateX(-50%); pointer-events: none;
  display: flex; flex-direction: column; gap: 2px; min-width: 132px;
  padding: 8px 11px; border: 1px solid #5a566b; border-radius: 8px;
  background: #171622; color: #aaa5b1; box-shadow: 0 10px 28px rgba(0,0,0,.35);
  font-size: 11px; line-height: 1.3; white-space: nowrap;
}
.vbar-tooltip strong { color: #f5f5f7; font-size: 12px; font-weight: 650; }
.hbar-track, .fb-distbar { background: #3a3749; }
.hbar-fill, .fb-distfill { background: #c9c3d5; }
th { background: #252334; border-color: #454257; color: #aaa5b1; font-size: 9px; letter-spacing: .1em; }
td { border-bottom-color: #3c394c; color: #dfdbe5; font-size: 12.5px; }
tbody tr:hover td { background: #302d40; }
.text-accent { color: #d4cde3; }

.search-input, .filter-select, .form-input, .login-input {
  background: #2c2a3d; border-color: #454157; border-radius: 8px; color: #f1eef4;
}
.search-input::placeholder, .form-input::placeholder { color: #96919e; }
.search-input:focus, .filter-select:focus, .form-input:focus, .login-input:focus {
  border-color: #787281; box-shadow: 0 0 0 3px rgba(202,196,214,.10);
}
.btn, .login-btn, .page-btn { min-height: 38px; border-radius: 8px; font-size: 13px; font-weight: 600; }
.btn-primary, .login-btn { background: #f5f5f7; border: 1px solid #f5f5f7; color: #111113; box-shadow: none; }
.btn-primary:hover, .login-btn:hover { background: #dedee3; border-color: #dedee3; color: #111113; opacity: 1; }
.btn-ghost { background: #292738; border-color: #454257; color: #d6d1dd; }
.btn-ghost:hover { background: #343146; border-color: #5a556d; color: #fff; }
.btn-danger { background: #4a2833; border-color: #74414e; color: #ffd5da; }
.btn-danger:hover { background: #61313f; }
.badge { border-radius: 999px; padding: 4px 9px; font-size: 10px; }
.badge-free, .badge-inactive { background: #3a3749; color: #d3ceda; }
.badge-basic { background: #31404a; color: #c8dfe3; }
.badge-premium, .badge-processing { background: #44391f; color: #f2d18d; }
.badge-active, .badge-completed { background: #253b2e; color: #afe7c2; }
.badge-banned, .badge-failed { background: #4a2833; color: #ffd5da; }
.badge-banner, .badge-sheet { background: #39354a; color: #ded9e5; }
.pill, .placeholder-chip, .legal-type { border-color: #454257; background: #343146; color: #ded9e5; border-radius: 8px; }
.page-btn { background: #292738; border-color: #454257; color: #ded9e5; }
.page-btn:hover:not(:disabled) { border-color: #787281; }
.page-btn.cur { background: #f5f5f7; border-color: #f5f5f7; color: #111113; }
.modal, .login-card { background: #292738; border-color: #514d60; border-radius: 12px; }
.login-overlay { background: radial-gradient(900px 520px at 50% -15%, rgba(153,137,210,.18), transparent 65%), #1d1c28; }
.login-overlay::before { display: none; }
.login-card { border-top: 1px solid #514d60; box-shadow: 0 25px 70px rgba(0,0,0,.25); }
.login-eyebrow { color: #aaa5b1; }
.login-eyebrow span { background: #c9c3d5; box-shadow: none; }
.login-foot { border-color: #454257; color: #aaa5b1; }
.logbox, .message-preview, .message-default pre { background: #242231; border-color: #454257; color: #d4d0db; }
.toast { background: #292738; border-radius: 10px; }
.message-row:hover, .message-row.active { background: #343146; }
.message-row.active { box-shadow: inset 2px 0 #f5f5f7; }
.message-browser { border-right-color: #454257; }
.legal-item { background: #2c2a3d; border-color: #454257; }
.legal-item summary:hover { background: #343146; }

/* Library demand reporting shares the existing analytics navigation. */
.analytics-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 24px; }
.analytics-tabs a { padding: 8px 14px; color: #b3aeba; border: 1px solid #454257; border-radius: 8px; font-size: 13px; font-weight: 600; }
.analytics-tabs a:hover { color: #fff; background: #343146; }
.analytics-tabs a.active { background: #f5f5f7; color: #111113; border-color: #f5f5f7; }
.analytics-tabs a:focus-visible { outline: 2px solid #f5f5f7; outline-offset: 3px; }
.popularity-toolbar { align-items: flex-end; gap: 14px; }
.popularity-filter { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.popularity-filter label { color: #aaa5b1; font-size: 11px; font-weight: 600; }
.popularity-filter .search-input, .popularity-filter .filter-select { min-height: 38px; width: 100%; max-width: 100%; }
.popularity-search { flex: 1 1 240px; }
.popularity-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.popularity-context { display: flex; justify-content: space-between; gap: 8px 20px; flex-wrap: wrap; color: #aaa5b1; font-size: 11px; margin: 4px 0 12px; }
.popularity-explanation { font-size: 12px; color: #aaa5b1; line-height: 1.6; margin-bottom: 12px; }
.popularity-explanation summary { width: fit-content; cursor: pointer; color: #d4d0db; font-weight: 600; }
.popularity-explanation p { max-width: 850px; margin-top: 8px; }
.popularity-history-note { font-size: 12px; color: #c9c3d5; margin-bottom: 16px; }
.popularity-table-wrap { overflow-x: auto; }
.popularity-table { min-width: 800px; }
.popularity-table th { white-space: nowrap; }
.popularity-video { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.popularity-video > strong { color: #f1eef4; font-size: 13px; }
.popularity-title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: #aaa5b1; }
.popularity-video small { font-size: 10px; }
.popularity-link { min-height: 32px; padding: 6px 8px; font-size: 11px; white-space: nowrap; }
.popularity-table .popularity-empty { padding: 36px 22px; text-align: center; color: #aaa5b1; }
@media (max-width: 640px) {
  .popularity-filter { flex: 1 1 100%; }
  .popularity-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .popularity-stats .card:last-child { grid-column: span 2; }
  .popularity-table { min-width: 0; }
  .popularity-table .popularity-empty { display: block; text-align: left; }
}

@media (max-width: 1180px) {
  .cards-grid .card { border: 1px solid #454257; }
  .dashboard-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dashboard-details .snapshot-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .topbar { min-height: 68px; padding: 13px 18px; background: rgba(29,28,40,.96); }
  .content { padding: 30px 18px calc(46px + env(safe-area-inset-bottom)); }
}
@media (max-width: 640px) {
  .dashboard-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-cards .card:last-child { grid-column: span 2; }
  .dashboard-details .snapshot-list { grid-template-columns: 1fr; }
  .dashboard-shortcuts-label { width: 100%; }
  .dashboard-details > summary { padding: 14px 16px; }
  .table-toolbar .table-actions, .filter-toolbar .table-actions { width: 100%; margin-left: 0; justify-content: stretch; }
  .table-toolbar .table-actions > *, .filter-toolbar .table-actions > * { flex: 1 1 150px; min-width: 0; }
  .filter-panel .filter-toolbar .table-title { width: 100%; }
  .filter-panel .filter-toolbar .table-actions { flex: 1 1 100%; }
  .filter-panel .filter-toolbar .table-actions > * { flex: 1 1 100%; }
  .filter-panel .filter-note { padding: 0 16px 14px; }
  .content { padding: 24px 13px calc(38px + env(safe-area-inset-bottom)); }
  .page-title { font-size: 27px; }
  .cards-grid .card { padding: 17px; }
  .card-value { font-size: 25px; }
  .cards-grid { gap: 8px; }
}
