/* Shared Material surfaces. Load last on every workspace. */
:root, body.admin-page {
  --bg: #f6f8fc; --bg-soft: #f8faff; --panel: #fff; --panel-soft: #f0f3fa;
  --text: #202534; --text-soft: #41495c; --muted: #626d82; --muted-light: #707b8e;
  --accent: #3458c5; --accent-strong: #24439e; --accent-soft: #e8eefc;
  --line: #e2e6ef; --line-strong: #c5cddd;
  --shadow-xs: 0 1px 3px rgb(30 45 75 / 5%);
  --navigation-gradient: linear-gradient(160deg, #edf3fc 0%, #e4edfa 55%, #dae7f7 100%);
}
body { font-size: 14px; }
:where(button, a, input, select, textarea, summary):focus-visible { outline: 3px solid #5979d0; outline-offset: 3px; }
:where(input:not([type=checkbox]):not([type=radio]), select, textarea) { border-radius: 10px; border-color: var(--line-strong); }
:where(button.primary, button.secondary, .icon-button, .reviews-button, button.danger) { min-height: 44px; border-radius: 24px; box-shadow: none; font-weight: 600; }
:where(.primary, .accent-button):hover:not(:disabled) { background: var(--accent-strong); }
:where(.brand-mark, .home-brand-mark, .mobile-brand-mark, .reviews-brand-mark) { background: var(--accent); border-color: var(--accent); border-radius: 14px; box-shadow: none; }
:where(.stat-card, .admin-panel, .submission-card, .reviews-metrics article) { border-radius: 18px; box-shadow: var(--shadow-xs); }
:where(.stat-card, .reviews-metrics article, .dashboard-hero)::after { display: none; }
:where(.table-wrap, .bonus-events-table-wrap) { max-width: 100%; overflow: auto; overscroll-behavior-x: contain; }
:where(th) { background: var(--panel-soft); }
:where(td) { line-height: 1.6; }
:where(tbody tr):hover { background: #f8faff; }
:where(dialog) { max-width: calc(100vw - 32px); max-height: calc(100dvh - 32px); border-radius: 24px; }
:where(dialog)::backdrop { background: rgb(23 32 54 / 45%); backdrop-filter: blur(3px); }
:where(.status-banner) { border-radius: 12px; line-height: 1.6; }
:where(.empty-row) { padding: 40px 20px; line-height: 1.7; }
:where(.toolbar, .reviews-actions) { flex-wrap: wrap; }
:where(.toolbar input, .toolbar select) { max-width: 100%; }
.workspace-skip { position: fixed; top: -100px; left: 16px; z-index: 100; padding: 12px 20px; background: #fff; color: var(--accent); border-radius: 24px; }
.workspace-skip:focus { top: 12px; }
.workspace-nav-toggle { display: none; }
/* Entry points use the same tonal palette as the console. */
.home-header { background: var(--navigation-gradient); color: var(--text); border-color: var(--line); min-height: 80px; }
.home-brand small, .home-secure { color: var(--muted); }
.home-brand { margin-right: auto; }
.home-content { padding-top: 44px; }
.home-intro h1 { font-size: clamp(32px, 4vw, 44px); font-weight: 600; }
.dashboard-card { border-radius: 24px; padding-top: 28px; }
.dashboard-card h2 { font-weight: 600; }
.dashboard-card:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgb(30 45 75 / 9%); }
.dashboard-access { border: 0; border-radius: 20px; padding: 7px 11px; }
.login-view { background: var(--bg); padding: 24px; gap: 24px; overflow-y: auto; }
.login-showcase { border-radius: 28px; background: var(--navigation-gradient); color: var(--text); }
.login-showcase::before, .login-showcase::after { display: none; }
.login-showcase .brand p, .login-showcase-copy p { color: var(--muted); }
.login-kicker { background: #dbe5fb; border: 0; color: var(--accent-strong); }
.login-showcase-copy h2 { font-weight: 600; font-size: clamp(32px, 4vw, 54px); }
.login-preview { background: #f6f8ff; border-color: #c5d1eb; box-shadow: none; }
.login-preview-head { border-color: #d3ddf1; }
.login-preview-body div { background: #e1e8f7; border-color: #c5d1eb; }
.login-preview-body div::before { background: #a7b9e8; }
.login-preview-body div::after { background: #b5c2dd; }
.login-panel { background: #fff; border-radius: 28px; padding: clamp(28px, 5vw, 76px); }
.login-panel-heading h2 { font-weight: 600; }
.login-panel input { min-height: 52px; box-shadow: none; }
.login-submit { min-height: 48px; border-radius: 24px; box-shadow: none; }
.login-error:empty { display: none; }
/* Product navigation */
.sidebar, .reviews-sidebar { background: var(--navigation-gradient); color: var(--text); border-right: 1px solid var(--line); }
.sidebar .brand p, .reviews-brand span, .reviews-sidebar-heading span, .reviews-product-copy small,
.reviews-sidebar-profile span, .user-identity span { color: var(--muted); }
.sidebar .section-label, .user-identity strong { color: var(--text); }
.sidebar input, .reviews-search { background: #fff; color: var(--text); border-color: var(--line-strong); border-radius: 24px; min-height: 44px; }
.sidebar input::placeholder, .reviews-search::placeholder { color: var(--muted); }
.segment, .reviews-type-filter { background: transparent; border-color: var(--line-strong); border-radius: 24px; padding: 0; overflow: hidden; gap: 0; }
.segment button, .reviews-type-filter button { color: var(--text-soft); min-height: 40px; border-radius: 0; }
.segment button + button, .reviews-type-filter button + button { border-left: 1px solid var(--line-strong); }
.segment button.active, .reviews-type-filter button.active { background: #dfe8fc; color: var(--accent-strong); box-shadow: none; }
.segment button:hover, .reviews-type-filter button:hover { color: var(--accent-strong); background: var(--accent-soft); }
.product-button:hover, .reviews-product-item:hover { background: #eaf0f8; border-color: transparent; }
.product-button.active, .reviews-product-item.active { background: #dfe8fc; color: var(--accent-strong); border-color: transparent; }
.product-icon, .reviews-product-avatar, .reviews-product-item.active .reviews-product-avatar { background: var(--accent-soft); color: var(--accent-strong); border: 0; }
.reviews-product-item { color: var(--text); }
.reviews-product-badge, .live-badge { color: var(--muted); border-color: var(--line); background: #fff; }
.sidebar-footer, .reviews-sidebar-profile { background: #edf1f8; border-color: transparent; }
.reviews-button { border-radius: 24px; box-shadow: none; }
.reviews-main { padding: 28px clamp(20px, 3vw, 42px) 44px; }
.reviews-gallery-surface { background: #fff; border: 1px solid var(--line); }
.reviews-workspace-header { align-items: flex-start; flex-wrap: wrap; }
.reviews-metrics strong { white-space: normal; overflow-wrap: anywhere; }
/* Admin tables, overview and mobile section chooser */
.admin-page .dashboard-hero { background: transparent; padding: 0; border: 0; box-shadow: none; }
.admin-page .dashboard-hero h2 { font-size: 30px; font-weight: 600; }
.admin-page .dashboard-hero p:last-child { font-size: 13px; }
.admin-page .admin-panel > header { flex-wrap: wrap; gap: 14px; }
.admin-page .admin-panel > header h3 { font-size: 16px; font-weight: 600; }
.admin-page .admin-sidebar { top: 0; height: 100dvh; background: var(--navigation-gradient); }
.admin-page .admin-content, .admin-page .admin-tab-panel, .admin-page .admin-panel { min-width: 0; }
.admin-page .admin-tabs .admin-subtabs button { min-height: 44px; font-size: 13px; }
.admin-page .admin-tabs strong { font-size: 13px; }
.admin-page .admin-profile { display: grid; }
.admin-page td { font-size: 13px; }
.admin-page th { font-size: 11px; }
.admin-page .dashboard-grid .table-wrap, .admin-page .activity-panel .table-wrap { max-height: 540px; }
.admin-page .table-wrap thead { position: sticky; top: 0; z-index: 1; }
@media (max-width: 1020px) {
  .admin-page .admin-sidebar { height: auto; }
  .admin-page .workspace-nav-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; }
  .admin-page .admin-sidebar.nav-collapsed .admin-tabs { display: none; }
  .admin-page .admin-sidebar .admin-tabs { display: grid; grid-template-columns: minmax(0, 1fr); overflow: visible; padding-top: 12px; }
  .admin-page .admin-sidebar .admin-tabs button { min-width: 0; }
  .admin-page .admin-profile { display: none; }
}
@media (max-width: 800px) {
  .login-view { padding: 16px; display: block; }
  .login-panel { min-height: calc(100dvh - 32px); }
  .sidebar, .reviews-sidebar { position: static; height: auto; border-right: 0; border-bottom: 1px solid var(--line); }
  .sidebar .product-list, .reviews-product-list { max-height: 280px; }
  .sidebar .workspace-nav-toggle, .reviews-sidebar .workspace-nav-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; }
  .sidebar.nav-collapsed > :not(.sidebar-head):not(.workspace-nav-toggle),
  .reviews-sidebar.nav-collapsed > :not(.reviews-brand):not(.workspace-nav-toggle) { display: none; }
  .reviews-shell { grid-template-columns: minmax(0, 1fr); }
  .main, .reviews-main { padding: 24px 16px 32px; }
  .topbar { align-items: flex-start; }
}
@media (max-width: 600px) {
  .home-header { gap: 12px; padding: 16px; }
  .home-secure { display: none; }
  .home-content { padding: 32px 16px; }
  .home-intro h1 br { display: none; }
  .admin-page .dashboard-hero { flex-wrap: wrap; }
  .admin-page .section-intro .toolbar { width: 100%; }
  .admin-page .section-intro .toolbar > input { min-width: 0; width: 100%; }
  .reviews-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reviews-actions { justify-content: flex-start; }
  .reviews-workspace-heading { align-items: flex-start; flex-direction: column; gap: 8px; }
  input:not([type=checkbox]):not([type=radio]), select, textarea { font-size: 16px !important; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}

.sidebar .product-copy strong { color: var(--text); }
.sidebar .product-copy > span, .sidebar .product-type { color: var(--muted); }
.sidebar .product-type { border-color: var(--line-strong); }
.home-brand-mark { color: #fff; }
.home-header .secondary { min-height: 44px; padding: 0 20px; border: 1px solid var(--line-strong); border-radius: 24px; background: #fff; color: var(--text-soft); font-size: 13px; }
.admin-page .archive-package-search { display: grid; grid-template-columns: minmax(120px, 1fr) auto auto; }
@media (max-width: 600px) {
  .admin-page .archive-package-search, .admin-page #autoImagePackageSearchForm { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  .admin-page .archive-package-search input { grid-column: 1 / -1; }
  .admin-page .archive-package-search button { width: 100%; }
}
.icon-button, .primary, .danger, .secondary, .reviews-button { min-height: 44px; border-radius: 24px; box-shadow: none; font-weight: 600; }
.brand-mark, .mobile-brand-mark, .reviews-brand-mark { background: var(--accent); box-shadow: none; }
@media (max-width: 600px) {
  .stats, .admin-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat-card { padding: 16px; min-height: 136px; }
  .stat-card .stat-value { font-size: 28px; }
  .stat-card .stat-project-value { font-size: 15px; overflow-wrap: anywhere; }
}
.reviews-brand-mark { color: #fff; }
.admin-page .section-intro > button { align-self: flex-start; max-width: 100%; }

/* Distinguish navigation selection from the surrounding blue surface. */
.sidebar .segment, .reviews-type-filter { background: #fff; }
.sidebar .segment button.active, .reviews-type-filter button.active,
.sidebar .product-button.active, .reviews-product-item.active,
.admin-page .admin-tabs button.active,
.admin-page .admin-tabs .admin-subtabs button.active {
  background: var(--accent); color: #fff; border-color: var(--accent);
}
.sidebar .segment button.active:hover, .reviews-type-filter button.active:hover,
.sidebar .product-button.active:hover, .reviews-product-item.active:hover,
.admin-page .admin-tabs button.active:hover,
.admin-page .admin-tabs .admin-subtabs button.active:hover { background: var(--accent-strong); color: #fff; }
.sidebar .product-button.active .product-copy strong,
.reviews-product-item.active .reviews-product-copy strong { color: #fff; }
.sidebar .product-button.active .product-copy > span,
.sidebar .product-button.active .product-type,
.reviews-product-item.active .reviews-product-copy small { color: #eef3ff; }
.sidebar .product-button.active .product-type { border-color: #9eb5ed; }
.sidebar .product-button.active::after { background: #fff; }
.sidebar .product-button.active .product-icon,
.reviews-product-item.active .reviews-product-avatar { background: #fff; color: var(--accent-strong); }
.admin-page .admin-nav-group.active > summary { background: #d3e1f8; color: #24439e; }
.admin-page .admin-subtabs { border-left-color: #a9bcdd; }
.sidebar-footer, .reviews-sidebar-profile { background: #fff; border-color: var(--line); }

/* Presence is a separate, readable status row beneath each product. */
.sidebar .product-presence, .sidebar .product-button.active .product-presence {
  grid-column: 1 / -1; margin-top: 0; max-width: 100%; min-height: 28px;
  padding: 4px 8px; gap: 7px; border-color: #a8d5bf; background: #e9f6ee;
  color: #14532d; border-radius: 9px;
}
.sidebar .presence-label { color: #14532d; font-size: 11px; line-height: 1.4; white-space: normal; overflow-wrap: anywhere; }
.sidebar .presence-label::before { background: #15803d; box-shadow: none; }
.sidebar .presence-avatar, .sidebar .presence-more { width: 20px; height: 20px; font-size: 9px; border-color: #fff; box-shadow: none; }
.sidebar .live-badge { color: #166534; }
.sidebar .product-empty, .reviews-no-products { color: var(--muted); }
/* Use one blue family for workspace links; reserve other colors for status. */
.dashboard-card { --card-accent: var(--accent); --card-tint: var(--accent-soft); }

/* Let busy product cards grow to contain the full presence row. */
.sidebar .product-list { grid-auto-rows: max-content; }
.sidebar .product-button.has-presence { min-height: 0; height: auto; grid-template-rows: auto auto; }