/* CCC presentation layer. Keep the existing routes, controls, copy and state.
 * Palette and compact geometry follow the closed /ccc-mining/ console.
 * Loaded after the existing DApp styles; no runtime or protocol dependencies. */
:root[data-design='keep360-v1'] {
  --bg: #070d18;
  --bg-soft: #13213a;
  --panel: #0e192c;
  --panel-soft: #13213a;
  --text: #e9f1ff;
  --muted: #a3b4cc;
  --border: #19263d;
  --surface-border: var(--border);
  --quiet-divider: color-mix(in srgb, var(--border) 72%, transparent);
  --page-background: var(--bg);
  --header-background: var(--bg);
  --nav-background: var(--panel);
  --surface-gradient: var(--panel);
  --surface-strong-gradient: var(--panel);
  --card-gradient: var(--panel);
  --tile-surface: var(--panel);
  --card-border: var(--border);
  --shell-bg: var(--bg);
  --input-bg: var(--panel);
  --input-border: #30415d;
  --input-text: var(--text);
  --input-placeholder: var(--muted);
  --control-bg: var(--panel);
  --control-soft-bg: var(--bg-soft);
  --control-border: var(--border);
  --control-text: var(--muted);
  --nav-active-bg: #142b49;
  --nav-active-text: #8fc7ff;
  --control-active-bg: var(--nav-active-bg);
  --control-active-text: var(--nav-active-text);
  --button-secondary-bg: var(--panel);
  --badge-bg: var(--bg-soft);
  --badge-border: transparent;
  --badge-text: var(--muted);
  --chip-bg: var(--bg-soft);
  --chip-text: var(--nav-active-text);
  --chip-border: transparent;
  --accent-surface-bg: var(--bg-soft);
  --accent-surface-border: var(--border);
  --accent-surface-shadow: none;
  --toast-bg: var(--panel);
  --toast-border: var(--border);
  --radius-xl: 8px;
  --radius-lg: 8px;
  --radius-md: 8px;
  --surface-shadow: none;
  --card-shadow: none;
  --tile-shadow: none;
  --panel-glow: none;
  --primary-shadow: none;
  --shadow-soft: 0 8px 22px rgb(3 10 22 / 14%);
  --shadow: 0 18px 44px rgb(3 10 22 / 28%);
  --ccc-console-text: #e9f1ff;
  --ccc-console-muted: #a3b4cc;
  --ccc-console-surface: rgb(255 255 255 / 5%);
  --ccc-console-border: rgb(163 180 204 / 16%);
  --ccc-console-background: radial-gradient(110% 80% at 100% 0%, rgb(62 230 200 / 18%), transparent 58%), radial-gradient(90% 80% at 0% 100%, rgb(36 93 204 / 38%), transparent 62%), linear-gradient(160deg, #0d1729, #0a1120 58%, #070d18);
  --ccc-ease: cubic-bezier(.16, 1, .3, 1);
  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  scrollbar-color: var(--muted) var(--bg);
  scroll-padding-top: 80px;
}
:root[data-design='keep360-v1'][data-appearance='light'] {
  --bg: #f2f5fa;
  --bg-soft: #e8eef7;
  --panel: #fff;
  --panel-soft: #f4f7fc;
  --text: #13203a;
  --muted: #4c5d74;
  --border: #e2e8f1;
  --input-border: #b9c8dd;
  --nav-active-bg: #e5eefd;
  --nav-active-text: #1f5fd0;
  --shadow-soft: 0 8px 22px rgb(20 42 79 / 8%);
  --shadow: 0 18px 44px rgb(20 42 79 / 16%);
}
/* Retain the user's existing colour-theme choices and storage semantics. */
:root[data-design='keep360-v1'][data-theme='ocean'] {
  --nav-active-bg: color-mix(in srgb, #6ea8ff 14%, var(--panel));
  --nav-active-text: #a6b7ff;
}
:root[data-design='keep360-v1'][data-theme='ocean'][data-appearance='light'] { --nav-active-text: #314cb1; }
:root[data-design='keep360-v1'][data-theme='nebula'] {
  --nav-active-bg: color-mix(in srgb, #3ee6c8 12%, var(--panel));
  --nav-active-text: #72decf;
}
:root[data-design='keep360-v1'][data-theme='nebula'][data-appearance='light'] { --nav-active-text: #086c73; }

html[data-design='keep360-v1'] body {
  font-size: 14px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
html[data-design='keep360-v1'] ::selection { background: #245dcc; color: #fff; }
html[data-design='keep360-v1'] :is(input, textarea) { caret-color: var(--nav-active-text); }
html[data-design='keep360-v1'] :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--nav-active-text);
  outline-offset: 4px;
}
html[data-design='keep360-v1'] :is(a, button) { -webkit-tap-highlight-color: rgb(110 168 255 / 15%); }
html[data-design='keep360-v1'] .mobile-shell {
  --ccc-shell-inset-start: 18px;
  --ccc-shell-inset-end: 18px;
  --ccc-header-content-inset: 16px;
  background: var(--bg);
  padding-inline: 18px;
}
html[data-design='keep360-v1'] .page-content { min-width: 0; }
html[data-design='keep360-v1'] .page-content.with-topbar { padding-top: 18px; }
html[data-design='keep360-v1'] .app-frame .page-stack { gap: 22px !important; }
html[data-design='keep360-v1'] .app-frame .page-stack > * { min-width: 0; }
html[data-design='keep360-v1'] .mobile-shell.shell-with-tabbar { padding-bottom: calc(98px + env(safe-area-inset-bottom)); }
html[data-design='keep360-v1'] .mobile-shell.shell-without-tabbar { padding-bottom: calc(28px + env(safe-area-inset-bottom)); }

/* The header surface spans the shell; its controls retain the content inset. */
html[data-design='keep360-v1'] .mobile-topbar {
  min-height: 60px;
  width: calc(100% + var(--ccc-shell-inset-start) + var(--ccc-shell-inset-end));
  margin-inline-start: calc(0px - var(--ccc-shell-inset-start));
  margin-inline-end: calc(0px - var(--ccc-shell-inset-end));
  padding-inline: 0;
  padding-block: 8px;
  background: var(--panel);
  border-bottom: 0;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-design='keep360-v1'] .mobile-topbar-content {
  height: auto;
  min-height: 44px;
  padding-inline-start: calc(var(--ccc-shell-inset-start) + var(--ccc-header-content-inset));
  padding-inline-end: calc(var(--ccc-shell-inset-end) + var(--ccc-header-content-inset));
}
html[data-design='keep360-v1'] .mobile-topbar-content-primary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
}
html[data-design='keep360-v1'] .mobile-topbar-content-secondary {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}
html[data-design='keep360-v1'] .mobile-topbar-secondary-title-wrap {
  position: static;
  padding: 0;
  min-width: 0;
}
html[data-design='keep360-v1'] .mobile-topbar-title {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: -.02em;
  white-space: normal;
  overflow: visible;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
html[data-design='keep360-v1'] .mobile-topbar-content-primary .mobile-topbar-title {
  font-size: 14px;
  font-weight: 500;
  color: var(--muted);
}
html[data-design='keep360-v1'] .mobile-topbar-wallet-pill {
  background: var(--bg-soft);
  border: 0;
  color: var(--muted);
  font-size: 11px;
  box-shadow: none;
}
html[data-design='keep360-v1'] .mobile-topbar-wallet-pill::before { box-shadow: none; }
html[data-design='keep360-v1'] .nav-actions { gap: 2px; }
html[data-design='keep360-v1'] .app-frame :is(.nav-action-button, .nav-back-button, .nav-more-button, .icon-button, .keep-icon-button) {
  min-width: 44px;
  min-height: 44px;
  border-radius: 8px;
  box-shadow: none;
}
html[data-design='keep360-v1'] .app-frame :is(.nav-action-button.is-icon, .nav-back-button, .nav-more-button) { width: 44px; height: 44px; }
html[data-design='keep360-v1'] .app-frame .nav-action-button.is-text { padding-inline: 8px; font-size: 13px; font-weight: 600; }
html[data-design='keep360-v1'] :is(.nav-action-icon-svg, .nav-back-icon) { width: 22px; height: 22px; stroke-width: 1.7; }
html[data-design='keep360-v1'] .nav-action-badge { top: 2px; right: 1px; box-shadow: 0 0 0 2px var(--panel); }
html[data-design='keep360-v1'] .nav-overflow-panel {
  z-index: 2;
  width: max-content;
  min-width: 188px;
  max-width: min(300px, calc(100vw - 36px));
  padding: 6px;
  border: 0;
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow);
}
html[data-design='keep360-v1'] .nav-overflow-item { min-height: 44px; border-radius: 6px; font-size: 13px; white-space: normal; }
html[data-design='keep360-v1'] .mobile-tabbar {
  padding: 7px 10px calc(9px + env(safe-area-inset-bottom));
  background: var(--panel);
  border-top: 1px solid var(--border);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-design='keep360-v1'] .mobile-tabbar-item { min-height: 56px; gap: 5px; color: var(--muted); border-radius: 8px; }
html[data-design='keep360-v1'] .mobile-tabbar-item.active { background: var(--nav-active-bg); color: var(--nav-active-text); }
html[data-design='keep360-v1'] .mobile-tabbar-item.active :is(.mobile-tabbar-label, .mobile-tabbar-icon) { color: var(--nav-active-text); filter: none; }
html[data-design='keep360-v1'] .mobile-tabbar-icon-svg { width: 23px; height: 23px; stroke-width: 1.7; }
html[data-design='keep360-v1'] .mobile-tabbar-label { font-size: 11px; line-height: 1.35; font-weight: 600; }

/* Hierarchy comes from spacing and numerals, rather than nested frames. */
html[data-design='keep360-v1'] .app-frame .section-head { margin-bottom: 12px; }
html[data-design='keep360-v1'] .app-frame .section-head h2 { font-size: 16px; font-weight: 650; line-height: 1.5; }
html[data-design='keep360-v1'] .app-frame :is(.list-card, .form-card, .premium-entry-card, .premium-stat-card, .stat-card, .summary-tile) {
  border-radius: 8px;
  box-shadow: none;
  min-width: 0;
}
html[data-design='keep360-v1'] .app-frame .page-stack .list-stack > .list-card,
html[data-design='keep360-v1'] .app-frame .page-stack .form-card,
html[data-design='keep360-v1'] .app-frame .page-stack .premium-entry-card {
  background: var(--panel) !important;
  border: 1px solid var(--border) !important;
  padding: 16px !important;
  box-shadow: none !important;
}
html[data-design='keep360-v1'] .app-frame :is(.list-card, .form-card) :is(p, li) { line-height: 1.7; }
html[data-design='keep360-v1'] .app-frame :is(.list-card, .form-card) p { font-size: 13px; }
html[data-design='keep360-v1'] .app-frame :is(.list-card, .form-card) :is(h3, strong) { font-weight: 600; }
html[data-design='keep360-v1'] .app-frame :is(.inset-card, .detail-info-card, .compact-result-card) {
  background: var(--bg-soft);
  border-color: transparent;
  border-radius: 6px;
  box-shadow: none;
}
html[data-design='keep360-v1'] .app-frame :is(.premium-stat-card, .stat-card, .summary-tile) { background: var(--panel); border-color: transparent; }
html[data-design='keep360-v1'] .app-frame :is(.stat-value, .stat-card strong, .premium-stat-card > strong, .mini-stats dd, .platform-stages strong, .keep-balance, .keep-position-amount) {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  letter-spacing: -.02em;
  overflow-wrap: anywhere;
}
html[data-design='keep360-v1'] .app-frame :is(.premium-stat-card, .stat-card) > strong { font-size: 24px; line-height: 1.3; }
html[data-design='keep360-v1'] .app-frame :is(.detail-row, .kv-row, .detail-info-row, .task-market-meta-row) { gap: 10px; }
html[data-design='keep360-v1'] .app-frame :is(.detail-value, .address-text, .address-safe, .robot-query-code-value) { min-width: 0; overflow-wrap: anywhere; }
html[data-design='keep360-v1'] .app-frame :is(.tag, .tag-lite, .count-chip) { font-size: 11px; line-height: 1.5; font-weight: 600; box-shadow: none; }
html[data-design='keep360-v1'] .app-frame .tag.success::before { box-shadow: none; }

/* CCC's dark console remains dark in both appearances. */
html[data-design='keep360-v1'] .app-frame .page-stack :is(.hero-card, .dapp-home-console, .dapp-account-console, .invite-console, .signal-console, .keep-balance-card, .invite-poster-card) {
  --text: var(--ccc-console-text);
  --muted: var(--ccc-console-muted);
  --panel: var(--ccc-console-surface);
  --bg-soft: rgb(255 255 255 / 6%);
  --border: var(--ccc-console-border);
  --nav-active-bg: rgb(110 168 255 / 14%);
  --nav-active-text: #a9d1ff;
  --tile-surface: var(--ccc-console-surface);
  --input-text: var(--ccc-console-text);
  --input-placeholder: var(--ccc-console-muted);
  --input-bg: rgb(255 255 255 / 6%);
  --input-border: rgb(163 180 204 / 32%);
  --success: #3ee6c8;
  --warning: #f6cc74;
  --danger: #ff9292;
  color: var(--ccc-console-text);
  background: var(--ccc-console-background) !important;
  border: 0 !important;
  border-radius: 8px !important;
  padding: 18px 16px !important;
  box-shadow: none !important;
}
html[data-design='keep360-v1'] .app-frame :is(.hero-card, .dapp-home-console, .dapp-account-console, .invite-console, .signal-console, .keep-balance-card, .invite-poster-card) :is(h2, h3, strong) {
  text-shadow: none;
  -webkit-text-fill-color: currentColor;
}
html[data-design='keep360-v1'] .app-frame .hero-card h2 { font-size: 23px; line-height: 1.4; text-wrap: balance; }
html[data-design='keep360-v1'] .app-frame :is(.hero-card, .signal-console, .dapp-home-console, .dapp-account-console, .invite-console) :is(p, small, .muted, dt) { color: var(--ccc-console-muted); }
html[data-design='keep360-v1'] .app-frame :is(.dapp-home-stats > a, .dapp-account-stats > div, .signal-console-stats > div, .invite-console-stats > div) {
  padding: 12px;
  border: 0 !important;
  border-radius: 8px;
  background: var(--ccc-console-surface);
  box-shadow: none;
}
html[data-design='keep360-v1'] .app-frame :is(.dapp-home-stats strong, .dapp-account-stats dd, .signal-console-stats dd, .invite-console-stats dd) { font-size: 21px; font-weight: 650; line-height: 1.3; text-shadow: none; }
html[data-design='keep360-v1'] .app-frame :is(.dapp-home-stats span, .dapp-home-stats small, .dapp-account-stats dt, .signal-console-stats dt) { font-size: 12px; }
html[data-design='keep360-v1'] .app-frame :is(.dapp-home-console-head h2, .dapp-account-console h2) { color: var(--ccc-console-text); font-size: 21px; text-shadow: none; }
html[data-design='keep360-v1'] .app-frame :is(.dapp-home-brand, .launch-console-logo, .dapp-account-avatar, .signal-console-title svg, .empty-mark, .robot-bbji-query-only-mark) { filter: none; box-shadow: none; }
html[data-design='keep360-v1'] .app-frame .dapp-home-intel { padding: 11px 12px; background: rgb(255 255 255 / 5%); border: 0; }
html[data-design='keep360-v1'] .app-frame .dapp-home-intel span { color: #a9d1ff; }
html[data-design='keep360-v1'] .app-frame .invite-code-surface { box-shadow: none !important; }
html[data-design='keep360-v1'] .app-frame .invite-code-surface strong { color: #7fe9d6; text-shadow: none; }

/* Home is a working summary: title, brand signature, then one data surface. */
html[data-design='keep360-v1'] .app-frame .dapp-home-console { gap: 12px; }
html[data-design='keep360-v1'] .app-frame .dapp-home-console::after { content: none; }
html[data-design='keep360-v1'] .app-frame .dapp-home-console-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 24px auto;
  gap: 8px;
  min-height: 0;
  padding: 0;
  align-items: center;
}
html[data-design='keep360-v1'] .app-frame .dapp-home-console-head > div { display: contents; }
html[data-design='keep360-v1'] .app-frame .dapp-home-console-head h2 {
  grid-column: 1;
  grid-row: 1;
  margin: 0;
  font-size: 21px;
  line-height: 1.35;
  overflow-wrap: anywhere;
  text-wrap: pretty;
}
html[data-design='keep360-v1'] .app-frame .dapp-home-console-head .dapp-home-brand { grid-column: 2; grid-row: 1; width: 24px; height: 24px; }
html[data-design='keep360-v1'] .app-frame .dapp-home-console-head p { grid-column: 3; grid-row: 1; margin: 0; font-size: 11px; line-height: 1.4; }
html[data-design='keep360-v1'] .app-frame .dapp-home-console > .legacy-console-caption { margin: 0; font-size: 11px; line-height: 1.4; }
html[data-design='keep360-v1'] .app-frame .dashboard-page .dapp-home-console .dapp-home-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border: 0; border-radius: 6px; background: rgb(255 255 255 / 4%); }
html[data-design='keep360-v1'] .app-frame .dashboard-page .dapp-home-console .dapp-home-stats > a {
  gap: 3px !important;
  padding: 8px 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none;
}
html[data-design='keep360-v1'] .app-frame .dashboard-page .dapp-home-console .dapp-home-stats > a:nth-child(odd) { border-right: 1px solid var(--ccc-console-border) !important; }
html[data-design='keep360-v1'] .app-frame .dashboard-page .dapp-home-console .dapp-home-stats > a:nth-child(n+3) { border-top: 1px solid var(--ccc-console-border) !important; }
html[data-design='keep360-v1'] .app-frame .dashboard-page .dapp-home-console .dapp-home-stats :is(span, small) { line-height: 1.3; }
html[data-design='keep360-v1'] .app-frame .dashboard-page .dapp-home-console .dapp-home-stats strong { font-size: 26px !important; line-height: 1.2 !important; }
html[data-design='keep360-v1'] .app-frame .dapp-home-intel {
  padding: 12px 0 0;
  border-top: 1px solid var(--ccc-console-border);
  border-radius: 0;
  background: transparent;
}
html[data-design='keep360-v1'] .app-frame .dapp-home-intel .intelligence-summary-action { min-height: 44px; padding: 8px 12px; border-radius: 6px; }
html[data-design='keep360-v1'] .app-frame .dapp-quick-nav { padding: 10px 6px; background: var(--panel); border: 0; border-radius: 8px; box-shadow: none; }
html[data-design='keep360-v1'] .app-frame .dapp-quick-nav a { min-height: 76px; gap: 8px; }
html[data-design='keep360-v1'] .app-frame .dapp-quick-nav a > svg { padding: 9px; width: 40px; height: 40px; background: var(--nav-active-bg); color: var(--nav-active-text); border-radius: 8px; }
html[data-design='keep360-v1'] .app-frame .dapp-quick-nav a > strong { font-size: 12px; font-weight: 600; }
html[data-design='keep360-v1'] .app-frame :is(.dapp-keep-entry, .dapp-ccc-entry, .dashboard-page > .ai-assistant-home-bubble, .me-settings-item) { background: var(--panel); border-color: var(--border); box-shadow: none; border-radius: 8px; }
html[data-design='keep360-v1'] .app-frame :is(.dapp-ccc-icon, .me-settings-icon svg, .dapp-keep-entry > svg) { stroke-width: 1.7; }
html[data-design='keep360-v1'] .app-frame .dashboard-page > .ai-assistant-home-bubble { z-index: auto; }
html[data-design='keep360-v1'] .app-frame .dashboard-page .ai-assistant-home-bubble-avatar { box-shadow: none; }
html[data-design='keep360-v1'] .app-frame .me-settings-icon { border-radius: 8px; background: var(--nav-active-bg); }

/* User-requested navigation: Keep 360 is reached from staking only. */
html[data-design='keep360-v1'] .app-frame a.dapp-keep-entry[href^='/staking/keep360'] { display: none !important; }
html[data-design='keep360-v1'] .app-frame .dashboard-page > .dapp-ccc-entry { grid-column: 1 / -1; }

/* Controls retain their original disabled/busy/danger semantics. */
html[data-design='keep360-v1'] .app-frame :is(.primary-button, .primary-btn, .secondary-button, .ghost-button, .ghost-btn, .keep-button) {
  min-height: 44px;
  border-radius: 8px;
  padding-block: 11px;
  font-size: 14px;
  line-height: 1.5;
  font-weight: 600;
  box-shadow: none;
  text-shadow: none;
}
html[data-design='keep360-v1'] .app-frame :is(.primary-button, .primary-btn):not(.secondary):not(.danger) { background: var(--primary); color: #fff; }
html[data-design='keep360-v1'] .app-frame :is(.primary-button, .primary-btn):not(.secondary):not(.danger):disabled { background: var(--bg-soft) !important; color: var(--muted) !important; border-color: transparent !important; opacity: 1; }
html[data-design='keep360-v1'] .app-frame :is(.primary-button, .primary-btn):not(.secondary):not(.danger):disabled > span { color: var(--muted) !important; }
html[data-design='keep360-v1'] .app-frame :is(.secondary-button, .ghost-button, .ghost-btn, .primary-button.secondary, .primary-btn.secondary) { color: var(--text); background: var(--panel); border: 1px solid var(--border); }
html[data-design='keep360-v1'] .app-frame :is(.primary-button.danger, .primary-btn.danger) { box-shadow: none; }
html[data-design='keep360-v1'] .app-frame :is(.filter-chip, .stake-action-tab, .segment-btn, .keep-tabs button, .keep-text-button, .list-toolbar select, .pagination-bar button, .ai-assistant-topup-presets button) { min-height: 44px; }
html[data-design='keep360-v1'] .app-frame :is(.stake-action-tabs, .task-action-tabs, .segmented-control, .tab-switcher, .dapp-product-switch) { padding: 4px; gap: 4px; background: var(--bg-soft); border: 0; border-radius: 8px; box-shadow: none; }
html[data-design='keep360-v1'] .app-frame :is(.stake-action-tab, .segment-btn, .dapp-product-switch > a) { border-radius: 6px; font-size: 13px; }
html[data-design='keep360-v1'] .app-frame :is(.stake-action-tab.active, .segment-btn.active, .dapp-product-switch > a[aria-current='page']) { color: var(--nav-active-text); background: var(--panel); box-shadow: none; }
html[data-design='keep360-v1'] .app-frame :is(input:not([type='checkbox']):not([type='radio']):not([type='range']), textarea, select) {
  min-width: 0;
  min-height: 44px;
  background: var(--input-bg);
  border: 1px solid var(--input-border);
  border-radius: 8px;
  color: var(--input-text);
  font-size: 16px;
  line-height: 1.5;
  box-shadow: none;
}
html[data-design='keep360-v1'] .app-frame :is(input, textarea)::placeholder { color: var(--input-placeholder); opacity: 1; }
html[data-design='keep360-v1'] .app-frame :is(input, textarea, select):focus { border-color: var(--nav-active-text); box-shadow: none; }
html[data-design='keep360-v1'] .app-frame :is(input, textarea, select)[aria-invalid='true'] { border-color: var(--danger); }
html[data-design='keep360-v1'] .app-frame select option { background: var(--panel); color: var(--text); }
html[data-design='keep360-v1'] .app-frame :is(input[type='checkbox'], input[type='radio']) { accent-color: var(--primary); }
html[data-design='keep360-v1'] .app-frame :is(.input-group, .subscription-contact-form) { gap: 8px; }

/* Dense data stays readable and complete, including the original table scroll. */
html[data-design='keep360-v1'] .app-frame .member-list { padding-inline: 14px; border-color: var(--border); border-radius: 8px; background: var(--panel); box-shadow: none; }
html[data-design='keep360-v1'] .app-frame .member-row { gap: 10px; padding-block: 14px; }
html[data-design='keep360-v1'] .app-frame .member-row + .member-row { border-color: var(--quiet-divider); }
html[data-design='keep360-v1'] .app-frame .member-avatar { width: 34px; height: 34px; background: var(--nav-active-bg); color: var(--nav-active-text); font-size: 13px; }
html[data-design='keep360-v1'] .app-frame :is(.list-toolbar, .filter-bar, .pagination-bar) { gap: 8px; min-width: 0; }
html[data-design='keep360-v1'] .app-frame .list-toolbar-search { width: 100%; min-width: 0; }
html[data-design='keep360-v1'] .app-frame .pagination-meta { font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
html[data-design='keep360-v1'] .app-frame .pagination-bar { flex-wrap: wrap; }
html[data-design='keep360-v1'] .app-frame .data-table-shell { max-width: 100%; border: 1px solid var(--border); border-radius: 8px; background: var(--panel); box-shadow: none; }
html[data-design='keep360-v1'] .app-frame .data-table { color: var(--text); font-size: 13px; font-variant-numeric: tabular-nums; }
html[data-design='keep360-v1'] .app-frame .data-table :is(td, th) { padding: 12px 14px; border-color: var(--quiet-divider); line-height: 1.6; }
html[data-design='keep360-v1'] .app-frame .data-table th { font-size: 12px; color: var(--muted); background: var(--bg-soft); font-weight: 600; }
html[data-design='keep360-v1'] .app-frame :is(.message-filters, .message-console) { min-width: 0; }
html[data-design='keep360-v1'] .app-frame .message-filters select { width: 100%; max-width: 100%; padding-right: 30px; color: var(--input-text); background-color: var(--input-bg); text-overflow: clip; }
html[data-design='keep360-v1'] .app-frame .premium-message-card { text-align: left; }
html[data-design='keep360-v1'] .app-frame .dashboard-update-time { color: var(--muted); font-size: 11px; }

/* Existing progress, stepper and charts are information, not decoration. */
html[data-design='keep360-v1'] .app-frame :is(.robot-raise-bar, .robot-loss-compensation-progress-track, .subscription-carousel-progress, .trend-bar, .mining-meter-bar) { box-shadow: none; }
html[data-design='keep360-v1'] .app-frame :is(.robot-raise-bar span, .robot-loss-compensation-progress-track > span, .subscription-carousel-progress-fill) { box-shadow: none; }
html[data-design='keep360-v1'] .app-frame .signal-stepper { background: var(--panel); box-shadow: none; border: 0; padding-block: 18px; }
html[data-design='keep360-v1'] .app-frame .signal-step-icon { border: 1px solid color-mix(in srgb, var(--nav-active-text) 30%, var(--border)); color: var(--nav-active-text); background: var(--panel); box-shadow: 0 0 0 4px var(--panel); border-radius: 8px; }
html[data-design='keep360-v1'] .app-frame .signal-stepper li { line-height: 1.5; }
html[data-design='keep360-v1'] .app-frame :is(.signal-step-icon svg, .intel-note svg) { stroke-width: 1.7; }
html[data-design='keep360-v1'] .app-frame .intel-rank li { background: var(--panel); border-radius: 8px; box-shadow: none; }
html[data-design='keep360-v1'] .app-frame .intel-rank .is-top-1 .intel-rank-badge { box-shadow: none; }
html[data-design='keep360-v1'] .app-frame .keep-balance-card { padding-bottom: 0 !important; }
html[data-design='keep360-v1'] .app-frame .keep-balance { font-size: 36px; line-height: 1.35; }
html[data-design='keep360-v1'] .app-frame .keep-position-card { padding: 16px; background: var(--panel); border-color: var(--border); border-radius: 8px; box-shadow: none; }
html[data-design='keep360-v1'] .app-frame :is(.keep-create-card, .keep-friend, .keep-record-list) { background: var(--panel); border-color: var(--border); border-radius: 8px; box-shadow: none; }
html[data-design='keep360-v1'] .app-frame .keep-preview { background: var(--bg-soft); border: 0; border-radius: 8px; }
html[data-design='keep360-v1'] .app-frame .keep-invite-hero { background: var(--nav-active-bg); border: 0; border-radius: 8px; }
html[data-design='keep360-v1'] .app-frame .keep-position-amount { font-size: 27px; }
html[data-design='keep360-v1'] .app-frame .keep-position-footer { border-color: var(--quiet-divider); }
html[data-design='keep360-v1'] .app-frame .keep-page progress { background: var(--bg-soft); }
html[data-design='keep360-v1'] .app-frame .keep-page progress::-webkit-progress-bar { background: var(--bg-soft); }
html[data-design='keep360-v1'] .app-frame .keep-tabs { border-color: var(--border); }
html[data-design='keep360-v1'] .app-frame .keep-rule-summary { font-size: 13px; }
html[data-design='keep360-v1'] .app-frame :is(.keep-consent, .keep-faq, .keep-alert, .keep-notice) { line-height: 1.7; }

/* Feedback and protected-focus surfaces keep their existing roles and behaviour. */
html[data-design='keep360-v1'] .app-frame .empty-state {
  padding: 28px 20px !important;
  background: var(--panel) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
html[data-design='keep360-v1'] .app-frame .empty-mark { color: var(--nav-active-text); background: var(--nav-active-bg); border-radius: 8px; box-shadow: none; }
html[data-design='keep360-v1'] .app-frame .empty-state h3 { font-size: 15px; line-height: 1.5; font-weight: 600; }
html[data-design='keep360-v1'] .app-frame .empty-state p { font-size: 13px; line-height: 1.7; color: var(--muted); }
html[data-design='keep360-v1'] .app-frame .soft-loading-state { background: var(--panel); border-radius: 8px; box-shadow: none; }
html[data-design='keep360-v1'] .app-frame :is(.tx-modal-backdrop, .wallet-bridge-modal-backdrop, .stake-dialog-backdrop) { background: rgb(5 12 28 / 58%); backdrop-filter: none; padding: 16px; }
html[data-design='keep360-v1'] .app-frame :is(.tx-modal-card, .wallet-bridge-modal, .stake-dialog-card, .subscription-contact-modal, .keep-sheet) {
  max-width: 100%;
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  background: var(--panel);
  color: var(--text);
  border: 0;
  border-radius: 8px;
  box-shadow: var(--shadow);
  overflow-y: auto;
  overscroll-behavior: contain;
}
html[data-design='keep360-v1'] .app-frame :is(.tx-modal-card, .wallet-bridge-modal, .stake-dialog-card, .keep-sheet) { padding: 22px; }
html[data-design='keep360-v1'] .app-frame :is(.tx-modal-card h3, .wallet-bridge-modal h3, .keep-sheet h3) { font-size: 18px; line-height: 1.45; font-weight: 650; }
html[data-design='keep360-v1'] .app-frame .tx-modal-card p { font-size: 14px; color: var(--muted); line-height: 1.75; }
html[data-design='keep360-v1'] .app-frame .tx-modal-badge { box-shadow: none; }
html[data-design='keep360-v1'] .app-frame .wallet-bridge-modal-code { background: #fff; border-radius: 8px; }
html[data-design='keep360-v1'] .app-frame .wallet-bridge-modal-code svg { max-width: 100%; height: auto; }
html[data-design='keep360-v1'] .app-frame .action-toast { background: var(--panel); color: var(--text); border: 0; border-radius: 8px; box-shadow: var(--shadow); }
html[data-design='keep360-v1'] .app-frame .page-busy-strip { color: var(--text); background: var(--bg-soft); border-radius: 6px; box-shadow: none; }
html[data-design='keep360-v1'] .app-frame :is(.appearance-option-card, .appearance-theme-card, .language-option-card) { border-radius: 8px; box-shadow: none; }
html[data-design='keep360-v1'] .app-frame :is(.appearance-option-card, .appearance-theme-card, .language-option-card).active { border-color: var(--nav-active-text); color: var(--nav-active-text); background: var(--nav-active-bg); }
html[data-design='keep360-v1'] .app-frame .appearance-theme-card .appearance-selection { color: var(--nav-active-text); }
html[data-design='keep360-v1'] .app-frame :is(.ai-chat-shell, .ai-chat-message, .ai-chat-empty) { border-radius: 8px; box-shadow: none; }
html[data-design='keep360-v1'] .app-frame .ai-chat-message.is-user { background: var(--nav-active-bg); color: var(--text); }
html[data-design='keep360-v1'] .app-frame .ai-chat-empty-mark { color: var(--nav-active-text); background: var(--nav-active-bg); box-shadow: none; }

/* Only direct control feedback animates. Existing real loading indicators remain. */
html[data-design='keep360-v1'] .app-frame :is(.dapp-home-brand, .dapp-account-avatar, .ai-assistant-home-bubble, .ai-assistant-home-bubble-avatar, .mining-console-grid, .mining-status-dot, .mining-pulse span),
html[data-design='keep360-v1'] .app-frame .mining-console::after { animation: none; }
@media (prefers-reduced-motion: no-preference) {
  html[data-design='keep360-v1'] .app-frame :is(.primary-button, .primary-btn, .secondary-button, .ghost-button, .ghost-btn, .keep-button, .nav-action-button, .nav-back-button, .nav-overflow-item, .mobile-tabbar-item, .filter-chip, .stake-action-tab, .segment-btn, .dapp-quick-nav a, .dapp-keep-entry, .dapp-ccc-entry) {
    transition: background-color 180ms var(--ccc-ease), color 180ms var(--ccc-ease), border-color 180ms var(--ccc-ease), transform 180ms var(--ccc-ease);
  }
  html[data-design='keep360-v1'] .app-frame :is(.primary-button, .primary-btn, .secondary-button, .ghost-button, .ghost-btn, .keep-button, .nav-action-button, .nav-back-button, .mobile-tabbar-item, .dapp-quick-nav a):not(:disabled):active { transform: scale(.98); }
}
@media (hover: hover) {
  html[data-design='keep360-v1'] .app-frame :is(.primary-button, .primary-btn):not(:disabled):not(.secondary):not(.danger):hover { background: var(--primary-strong) !important; filter: none; }
  html[data-design='keep360-v1'] .app-frame :is(.nav-action-button, .nav-back-button, .nav-overflow-item, .dapp-quick-nav a):hover { background: var(--bg-soft); }
  html[data-design='keep360-v1'] .app-frame :is(.list-card.interactive, .dapp-keep-entry, .dapp-ccc-entry):hover { border-color: var(--input-border); transform: none; box-shadow: none; }
}
@media (max-width: 359px) {
  html[data-design='keep360-v1'] .mobile-shell { --ccc-shell-inset-start: 14px; --ccc-shell-inset-end: 14px; padding-inline: 14px; }
  html[data-design='keep360-v1'] .app-frame .page-stack { gap: 18px !important; }
  html[data-design='keep360-v1'] .mobile-topbar-content-primary { gap: 3px; }
  html[data-design='keep360-v1'] .mobile-topbar-title { font-size: 16px; }
  html[data-design='keep360-v1'] .mobile-topbar-wallet-pill { padding-inline: 6px; font-size: 10px; max-width: 88px; }
  html[data-design='keep360-v1'] .app-frame .nav-action-button.is-text { padding-inline: 4px; font-size: 12px; }
  html[data-design='keep360-v1'] .app-frame .dapp-home-console-head { row-gap: 6px; }
  html[data-design='keep360-v1'] .app-frame .dapp-home-console-head h2 { grid-column: 1 / -1; font-size: 20px; }
  html[data-design='keep360-v1'] .app-frame .dapp-home-console-head .dapp-home-brand,
  html[data-design='keep360-v1'] .app-frame .dapp-home-console-head p { grid-row: 2; }
  html[data-design='keep360-v1'] .app-frame :is(.dapp-home-stats > a, .dapp-account-stats > div, .signal-console-stats > div) { padding: 10px; }
  html[data-design='keep360-v1'] .app-frame .dapp-home-intel { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 8px; }
  html[data-design='keep360-v1'] .app-frame .dapp-home-intel .intelligence-summary-copy { display: grid; min-width: 0; gap: 2px; }
  html[data-design='keep360-v1'] .app-frame .dapp-home-intel .intelligence-summary-metric { display: flex; flex-wrap: wrap; gap: 4px; align-items: baseline; }
  html[data-design='keep360-v1'] .app-frame .dapp-home-intel .intelligence-summary-metric > span { font-size: 11px; }
  html[data-design='keep360-v1'] .app-frame .dapp-home-intel strong { flex: 0 0 auto; }
  html[data-design='keep360-v1'] .app-frame .dapp-home-intel .intelligence-summary-action { min-height: 44px; padding-block: 9px; }
  html[data-design='keep360-v1'] .app-frame .dapp-quick-nav a > strong { font-size: 11px; }
  html[data-design='keep360-v1'] .app-frame .member-row { grid-template-columns: 28px minmax(0, 1fr) auto; gap: 8px; }
  html[data-design='keep360-v1'] .app-frame .member-avatar { width: 28px; height: 28px; }
  html[data-design='keep360-v1'] .app-frame .member-side b { font-size: 12px; white-space: normal; overflow-wrap: anywhere; }
}
@media (min-width: 700px) {
  html[data-design='keep360-v1'] .mobile-shell { --ccc-shell-inset-start: 28px; --ccc-shell-inset-end: 28px; --ccc-header-content-inset: 24px; padding-inline: 28px; }
  html[data-design='keep360-v1'] .page-content.with-topbar { padding-top: 24px; }
  html[data-design='keep360-v1'] .app-frame .page-stack :is(.hero-card, .dapp-home-console, .dapp-account-console, .invite-console, .signal-console, .keep-balance-card, .invite-poster-card) { padding: 24px !important; }
  html[data-design='keep360-v1'] .app-frame .keep-balance-card { padding-bottom: 0 !important; }
  html[data-design='keep360-v1'] .app-frame .dapp-home-console-head h2 { font-size: 23px; }
  html[data-design='keep360-v1'] .app-frame .dashboard-page .dapp-home-console .dapp-home-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  html[data-design='keep360-v1'] .app-frame .dashboard-page .dapp-home-console .dapp-home-stats > a { padding: 12px 16px !important; border-top: 0 !important; }
  html[data-design='keep360-v1'] .app-frame .dashboard-page .dapp-home-console .dapp-home-stats > a:nth-child(n+3) { border-top: 0 !important; }
  html[data-design='keep360-v1'] .app-frame .dashboard-page .dapp-home-console .dapp-home-stats > a:not(:last-child) { border-right: 1px solid var(--ccc-console-border) !important; }
  html[data-design='keep360-v1'] .app-frame .dashboard-page .dapp-home-console .dapp-home-stats strong { font-size: 28px !important; }
}
@media (min-width: 1100px) {
  html[data-design='keep360-v1'] .mobile-shell.shell-with-tabbar { --ccc-shell-inset-start: 148px; max-width: 1160px; padding-left: 148px; padding-bottom: 32px; }
  html[data-design='keep360-v1'] .mobile-tabbar {
    left: max(16px, calc(50% - 580px));
    right: auto;
    top: 84px;
    bottom: auto;
    width: 112px;
    max-width: none;
    grid-template-columns: 1fr;
    gap: 4px;
    padding: 8px;
    border: 1px solid var(--border);
    border-radius: 8px;
    transform: none;
    box-shadow: none;
  }
  html[data-design='keep360-v1'] .mobile-tabbar-item { min-height: 64px; }
  html[data-design='keep360-v1'] .shell-with-tabbar .action-toast { bottom: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-design='keep360-v1'] .app-frame *,
  html[data-design='keep360-v1'] .app-frame *::before,
  html[data-design='keep360-v1'] .app-frame *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  html[data-design='keep360-v1'] .app-frame :is(.nav-action-button, .nav-back-button, .nav-overflow-item, .mobile-setting-segment-button, .mobile-tabbar-item):active { transform: none; }
}