/* Approved design 02: compact dark presentation; existing behavior retained. */
      :root {
        --bg-main: #0B1220;
        --bg-surface: #111827;
        --bg-card: #111827;
        --border-color: #2a3549;
        --border-subtle: #253045;
        --border-focus: #a99bff;
        --text-main: #edf2fc;
        --text-sub: #a1afc5;
        --text-muted: #8493ab;
        --primary: #8270e8;
        --primary-gradient: linear-gradient(135deg, #7562d5, #8977e9);
        --primary-glow: rgba(137, 119, 233, 0.12);
      }
      body { background: var(--bg-main); padding: 16px 24px 0; }
      .app-layout { max-width: 1480px; }
      header {
        margin: 0 0 20px;
        padding: 14px 0 18px;
        gap: 16px;
        border-bottom-color: var(--border-color);
      }
      .header-brand { flex-direction: row; gap: 12px; padding: 0; }
      .header-brand-info { align-items: flex-start; text-align: left; gap: 3px; }
      .logo-box, .logo-box:hover {
        width: 44px; height: 44px; margin: 0;
        border: 1px solid #61558c; border-radius: 12px;
        box-shadow: none; transform: none;
      }
      header h1 { font-size: 1.22rem; text-shadow: none; }
      .header-brand:hover { transform: none; }
      .stats-badge { box-shadow: none; background: transparent; border-color: var(--border-color); }
      .user-greeting-bar {
        margin-bottom: 20px; padding: 14px 18px;
        background: var(--bg-surface); border: 1px solid var(--border-color);
        border-radius: 12px;
      }
      .user-greeting-bar::before, .user-greeting-bar::after { content: none; }
      .user-greeting-avatar { box-shadow: none; background: #292342; }
      .add-box.admin-unified-card, .add-box.admin-unified-card:hover {
        background: var(--bg-surface); border: 1px solid var(--border-color);
        border-radius: 14px; transform: none;
        margin-bottom: 22px;
      }
      .admin-card-header { padding: 16px 20px; border-bottom-color: var(--border-color); }
      .admin-card-title { letter-spacing: 0; }
      .admin-card-subtitle { color: var(--text-sub); font-size: .76rem; }
      .add-box-content { padding: 18px 20px; }
      .storage-switcher-bar { gap: 12px; margin-bottom: 20px; }
      .storage-tab-btn, .storage-tab-btn:hover {
        background: var(--bg-surface); border: 1px solid var(--border-color);
        border-radius: 12px; padding: 15px 18px;
        box-shadow: none; transform: none;
      }
      .storage-tab-btn.active, .storage-tab-btn.active#storage-tab-chungsuc {
        background: #24213b; border-color: #8270e8; box-shadow: none;
      }
      .storage-tab-btn.active .storage-tab-title,
      .storage-tab-btn.active#storage-tab-chungsuc .storage-tab-title { color: #d4cbff; }
      .storage-tab-sub { color: var(--text-sub); font-size: .74rem; }
      .storage-tab-icon { font-size: 1.4rem; }
      .storage-tab-pill { box-shadow: none; }
      .zone-divider-header { margin: 16px 0 12px; padding: 10px 0; }
      .zone-title-text { font-size: .88rem; }
      .zone-desc-text { color: var(--text-sub); font-size: .75rem; }
      .zone-badge { border-radius: 6px; font-size: .62rem; box-shadow: none; }
      .search-bar-wrap { margin-bottom: 10px; }
      .search-bar-inner, .search-bar-inner:hover {
        background: var(--bg-surface); border: 1px solid var(--border-color);
        border-radius: 10px; box-shadow: none; transform: none;
      }
      .search-bar-inner:focus-within { border-color: var(--border-focus); box-shadow: 0 0 0 2px rgba(169,155,255,.12); }
      .search-bar-input { font-size: .86rem; padding-top: 12px; padding-bottom: 12px; }
      .toolbar {
        top: 8px; margin: 10px 0 16px; padding: 10px;
        background: var(--bg-surface); border: 1px solid var(--border-color);
        border-radius: 10px; box-shadow: 0 6px 16px #0002;
      }
      .rank-nav-chip { border-radius: 7px; padding: 7px 12px; background: #1c2639; }
      .rank-nav-chip.active, .rank-nav-chip:hover { box-shadow: none; transform: none; }
      .rank-nav-chip.chip-created-history.active { box-shadow: none !important; }
      .desktop-table-wrap {
        background: var(--bg-surface); border: 1px solid var(--border-color);
        border-radius: 12px; padding: 0 8px 8px;
      }
      .acc-table { border-spacing: 0 4px; font-size: .84rem; }
      .acc-table th { padding: 12px 10px; font-size: .69rem; }
      .acc-table tbody tr.acc-row-item,
      .acc-table tbody tr.acc-row-item:hover {
        background: #192336 !important; box-shadow: none !important;
        transform: none !important; opacity: 1; will-change: auto;
      }
      .acc-table tbody tr.acc-row-item td { padding-top: 10px; padding-bottom: 10px; border-color: var(--border-color); }
      .acc-table tbody tr.acc-row-item:hover { background: #202d43 !important; }
      .acc-table tbody tr.acc-group-header-row td, .rank-group-banner {
        animation: none !important; box-shadow: none !important; text-shadow: none !important;
      }
      .btn, .btn-change-user-name, .btn-card-collapse, .btn-target-pill,
      .btn-quick-paste-purple { border-radius: 8px; box-shadow: none; }
      .btn:hover, .btn-change-user-name:hover, .btn-quick-paste-purple:hover { box-shadow: none; transform: none; }
      .btn-primary { background: var(--primary-gradient); }
      #rawInput, #defaultUnlock, #defaultRank, #defaultUyTin {
        background: #101827; border-color: var(--border-color);
        color: var(--text-main); border-radius: 8px; box-shadow: none;
      }
      .btn-snow-track { display: none; }
      .mobile-card-list { gap: 10px; }
      .m-row-card {
        background: var(--bg-surface); border-color: var(--border-color);
        border-radius: 10px; box-shadow: none; opacity: 1;
        transform: none !important; will-change: auto;
      }
      .acc-table tbody tr.acc-row-item.is-banned,
      .acc-table tbody tr.acc-row-item.is-banned:hover { background: #301e2c !important; }
      .modal-card, .modal-card-analytics, .noti-flyout-panel,
      .option-menu-dropdown { background: var(--bg-surface); border-color: var(--border-color); }
      .app-footer { margin-top: 28px !important; background: var(--bg-main); border-top-color: var(--border-color); }
      .app-footer::before { content: none; }
      .footer-container { padding-top: 22px; padding-bottom: 16px; }
      .footer-logo-box, .footer-author-card { box-shadow: none; }
      @media (max-width: 820px) {
        body { padding: 12px 12px 0; }
        header { gap: 10px; margin-bottom: 16px; padding: 10px 0 14px; }
        .header-brand { flex-direction: column; gap: 6px; }
        .header-brand-info { align-items: center; text-align: center; }
        .logo-box, .logo-box:hover { width: 38px; height: 38px; }
        header h1 { font-size: 1rem; }
        .user-greeting-bar { padding: 12px; margin-bottom: 16px; }
        .storage-switcher-bar { gap: 8px; margin-bottom: 16px; }
        .storage-tab-btn, .storage-tab-btn:hover { padding: 12px; border-radius: 10px; }
        .storage-tab-title { font-size: .8rem; }
        .storage-tab-sub { font-size: .66rem; }
        .storage-tab-icon { font-size: 1.15rem; }
        .admin-card-header, .add-box-content { padding: 14px 12px; }
        .toolbar { top: 6px; padding: 8px; }
        .rank-nav-chip { min-height: 36px; padding: 8px 11px; }
        .zone-divider-header { gap: 8px; }
      }
      /* Approved layout refinement: hierarchy through spacing, tabs and separators. */
      header { grid-template-columns: minmax(0, 1fr) auto auto; }
      .header-brand { grid-column: 1; grid-row: 1; justify-self: start; }
      .header-left { grid-column: 2; grid-row: 1; }
      header > .header-action-group { grid-column: 3; grid-row: 1; }
      .header-brand-info { width: auto; }
      .header-sub .stats-badge { background: transparent; border: 0; box-shadow: none; padding-left: 0; }
      .user-greeting-bar {
        background: transparent; border: 0; border-radius: 0;
        padding: 0 0 18px; margin-bottom: 8px; box-shadow: none;
      }
      .user-greeting-avatar { background: transparent; border: 0; width: 28px; height: 28px; }
      .user-greeting-sub { display: none; }
      .storage-switcher-bar {
        display: flex; flex-wrap: wrap;
        justify-content: flex-start; gap: 28px; margin: 0 0 20px;
        border-bottom: 1px solid var(--border-color);
      }
      .storage-tab-btn, .storage-tab-btn:hover,
      .storage-tab-btn.active, .storage-tab-btn.active#storage-tab-chungsuc {
        flex: 0 1 auto; width: auto; min-width: 0; gap: 9px;
        background: transparent; border: 0; border-bottom: 2px solid transparent;
        border-radius: 0; padding: 14px 0; margin-bottom: -1px;
        box-shadow: none; transform: none;
      }
      .storage-tab-btn.active, .storage-tab-btn.active#storage-tab-chungsuc { border-bottom-color: #a99bff; }
      .storage-tab-sub { display: none; }
      .storage-tab-text-wrap { flex: 0 1 auto; }
      .storage-tab-icon { font-size: 1rem; }
      .storage-tab-title { font-size: .9rem; }
      .storage-tab-pill, .storage-tab-btn.active .storage-tab-pill,
      .storage-tab-btn.active#storage-tab-chungsuc .storage-tab-pill {
        background: #202a3b; color: var(--text-sub); border: 0;
        border-radius: 5px; padding: 2px 7px; min-width: 28px;
      }
      .add-box.admin-unified-card, .add-box.admin-unified-card:hover {
        background: transparent; border: 0; border-bottom: 1px solid var(--border-color);
        border-radius: 0; margin: 0 0 24px; box-shadow: none;
      }
      .admin-card-header { background: transparent; border: 0; padding: 0 0 16px; }
      .admin-card-title { font-size: .94rem; color: var(--text-main); }
      .admin-card-subtitle { margin-top: 3px; }
      .add-box-content { padding: 0 0 20px; }
      .zone-badge-admin, .zone-badge-player { display: none; }
      .add-target-pill-group { background: transparent; border: 0; padding: 0; box-shadow: none; }
      .btn-card-collapse { background: transparent; border-color: var(--border-color); }
      .btn-primary, .btn-primary:hover { box-shadow: none !important; }
      .btn-text-glossy { text-shadow: none; }
      .zone-divider-header.zone-player-divider {
        background: transparent; border: 0; border-radius: 0;
        padding: 0; margin: 4px 0 16px; align-items: baseline;
      }
      .zone-title-text { font-size: 1.05rem; text-transform: none; letter-spacing: 0; }
      .search-bar-wrap { max-width: 620px; margin: 0 0 12px; }
      .search-bar-inner { border-radius: 8px; }
      .toolbar {
        background: var(--bg-main); border: 0; border-bottom: 1px solid var(--border-color);
        border-radius: 0; box-shadow: none; padding: 10px 0 16px; margin: 0 0 16px;
      }
      .quick-rank-nav { flex-wrap: wrap; overflow: visible; gap: 12px 24px; }
      .filter-section { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; min-width: 0; }
      .filter-label { color: var(--text-muted); font-size: .72rem; font-weight: 600; margin-right: 5px; }
      .history-filters { border-left: 1px solid var(--border-color); padding-left: 20px; }
      .filter-actions { margin-left: auto; }
      .quick-rank-nav .rank-nav-chip {
        background: transparent; border: 1px solid transparent;
        color: var(--text-sub); box-shadow: none; font-weight: 600;
      }
      .quick-rank-nav .rank-nav-chip:hover { background: #1c2639; color: var(--text-main); }
      .quick-rank-nav .rank-nav-chip.active {
        background: #292342 !important; color: #d4cbff !important;
        border-color: #61558c !important; box-shadow: none !important;
      }
      .quick-rank-nav .chip-recent, .quick-rank-nav .chip-created-history,
      .quick-rank-nav .btn-toggle-all-rank-groups {
        border-color: transparent !important; background: transparent !important;
        color: var(--text-sub) !important;
      }
      .quick-rank-nav .chip-recent.active, .quick-rank-nav .chip-created-history.active {
        background: #292342 !important; color: #d4cbff !important; border-color: #61558c !important;
      }
      .desktop-table-wrap { background: transparent; border: 0; border-radius: 0; padding: 0 0 8px; }
      .acc-table { border-spacing: 0; }
      .acc-table tbody tr.acc-row-item { background: transparent !important; }
      .acc-table tbody tr.acc-row-item td { border-bottom: 1px solid #253045; border-radius: 0; }
      .acc-table tbody tr.acc-group-header-row td { border-radius: 4px; }
      .m-row-card { background: transparent; border: 0; border-bottom: 1px solid var(--border-color); border-radius: 0; }
      @media (max-width: 820px) {
        header { grid-template-columns: minmax(0, 1fr) auto; row-gap: 12px; }
        .header-brand { flex-direction: row; align-items: center; }
        .header-brand-info { align-items: flex-start; text-align: left; }
        .header-left { grid-row: 2; grid-column: 1 / -1; }
        header > .header-action-group { grid-column: 2; grid-row: 1; }
        .storage-switcher-bar { gap: 20px; }
        .storage-tab-btn, .storage-tab-btn:hover { padding: 12px 0; gap: 6px; }
        .storage-tab-title { font-size: .78rem; }
        .storage-tab-pill { font-size: .68rem; }
        .admin-card-header { padding: 0 0 14px; }
        .add-box-content { padding: 0 0 16px; }
        .zone-divider-header.zone-player-divider { gap: 5px; }
        .zone-desc-text { width: 100%; }
        .quick-rank-nav { gap: 10px; }
        .rank-filters { width: 100%; }
        .history-filters { padding-left: 0; border-left: 0; }
        .filter-actions { margin-left: 0; }
        .toolbar { padding: 8px 0 12px; }
      }
      /* Approved priority 1: readable typography, restrained accents, static decoration. */
      :root { --text-sub: #afbdd0; --text-muted: #97a6bc; }
      body { font-size: 14px; line-height: 1.55; }
      .header-brand h1 #brand-typewriter-text { font-size: 1.15rem; color: var(--text-main); }
      .header-brand h1 #brand-typewriter-text span {
        font-size: .8rem !important; font-weight: 500 !important;
        color: var(--text-sub) !important; text-shadow: none !important;
      }
      .typewriter-cursor { display: inline-block; }
      .header-sub #stat-count, .header-sub #stat-active, .header-sub #stat-ban {
        font-size: .78rem; font-weight: 600; text-shadow: none !important;
      }
      .user-greeting-main { font-size: .88rem; font-weight: 500; }
      .user-greeting-name { font-weight: 600; }
      .admin-card-title, .storage-tab-title, .zone-title-text,
      .rank-group-title, .rank-title-text { font-weight: 600; }
      .admin-card-subtitle, .zone-desc-text, .filter-label,
      .add-target-label, .add-fields-row label { font-size: .8rem; color: var(--text-sub); }
      .zone-title-text { line-height: 1.5; }
      .acc-table { font-size: .875rem; line-height: 1.5; }
      .acc-table th {
        font-size: .75rem; text-transform: none; letter-spacing: 0;
        color: var(--text-sub); font-weight: 600;
      }
      .acc-table .tbl-input { font-size: .875rem; text-shadow: none !important; }
      .search-bar-input, #rawInput, #defaultRank, #defaultUnlock, #defaultUyTin { font-size: .875rem; }
      .btn, .btn-copy-action, .rank-nav-chip, .btn-card-collapse,
      .btn-change-user-name { font-weight: 600; letter-spacing: 0; }
      .btn-copy-action { text-shadow: none; box-shadow: none; }
      .btn-copy-action:not(.btn-copy-locked):not(.copied) {
        background: #292342 !important; border-color: #61558c !important;
        color: #e1dbff !important;
      }
      .btn-copy-action:hover, .btn-copy-action.copied { box-shadow: none !important; transform: none; }
      .rank-title-text, .acc-group-header-row .badge, .rank-group-banner .badge,
      .status-dot-active, .btn-noti-bell.has-unread #noti-bell-icon,
      .noti-badge-count, .welcome-icon-box, .badge-just-unbanned {
        animation: none !important; box-shadow: none; filter: none; text-shadow: none;
      }
      .rank-title-text { color: var(--text-main); opacity: 1; }
      .rank-weather-track { display: none !important; }
      .rank-drop { animation: none !important; }
      .status-dot-active::after { content: none; }
      #btn-add::before, #btn-add::after { content: none; }
      #btn-add, #btn-add:hover { background: #7562d5; border-color: #8977e9; box-shadow: none !important; }
      .btn-quick-paste-purple, .btn-quick-paste-purple:hover,
      .btn-target-pill:not(.active), .btn-change-user-name {
        background: transparent; color: var(--text-sub); border-color: var(--border-color);
      }
      .acc-table tbody tr.acc-row-item td, .m-row-card { text-shadow: none; }
      .acc-table tbody tr.acc-group-header-row td [style*="text-shadow"],
      .acc-table .tbl-input[style*="text-shadow"] { text-shadow: none !important; }
      .btn:focus-visible, .rank-nav-chip:focus-visible, .btn-copy-action:focus-visible,
      .storage-tab-btn:focus-visible, .btn-card-collapse:focus-visible,
      .btn-change-user-name:focus-visible {
        outline: 2px solid var(--border-focus); outline-offset: 3px;
      }
      @media (max-width: 820px) {
        .header-brand h1 #brand-typewriter-text { font-size: 1rem; }
        .header-brand h1 #brand-typewriter-text span { font-size: .72rem !important; }
        .header-sub #stat-count, .header-sub #stat-active, .header-sub #stat-ban { font-size: .72rem; }
        .m-row-card { font-size: .875rem; line-height: 1.55; }
        .rank-group-title { font-size: .9rem; }
        .filter-label, .rank-nav-chip { font-size: .8rem; }
      }
      /* Approved working layout: account list and remembered admin entry panel. */
      .account-workspace, .account-list-workspace { min-width: 0; }
      .account-list-workspace .search-bar-wrap { max-width: none; }
      .account-list-workspace .zone-divider-header { align-items: flex-start; }
      .account-list-workspace .zone-desc-text { width: 100%; }
      #input-container .admin-card-title-group { min-width: 0; }
      #input-container .admin-card-subtitle { line-height: 1.5; }
      @media (min-width: 1101px) {
        .account-workspace.has-admin-tools {
          display: grid; grid-template-columns: clamp(270px, 20vw, 350px) minmax(0, 1fr);
          align-items: start; gap: clamp(16px, 1.5vw, 28px);
        }
        .has-admin-tools > .account-list-workspace { grid-column: 2; grid-row: 1; }
        .account-workspace.has-admin-tools > #input-container {
          grid-column: 1; grid-row: 1; position: sticky; top: 20px;
          max-height: calc(100dvh - 40px); overflow-y: auto;
          border: 0; border-right: 1px solid var(--border-color);
          border-radius: 0; padding: 0 24px 0 0; margin: 0;
          scrollbar-width: thin; scrollbar-gutter: stable;
        }
        .has-admin-tools #input-container .admin-card-header {
          align-items: flex-start; flex-direction: column; gap: 12px;
          padding-bottom: 18px;
        }
        .has-admin-tools #input-container .admin-card-title { font-size: 1rem; }
        .has-admin-tools #input-container .admin-card-subtitle { font-size: .78rem; }
        .has-admin-tools #input-container .add-control-row {
          flex-direction: column; align-items: stretch; gap: 12px;
        }
        .has-admin-tools #input-container .add-target-selector {
          flex-direction: column; align-items: flex-start; gap: 8px;
        }
        .has-admin-tools #input-container .add-target-pill-group { width: 100%; }
        .has-admin-tools #input-container .btn-target-pill { flex: 1; justify-content: center; padding: 8px; font-size: .75rem; }
        .has-admin-tools #input-container .btn-quick-paste-purple { justify-content: center; width: 100%; white-space: normal; }
        .has-admin-tools #input-container #rawInput { min-height: 130px; }
        .has-admin-tools #input-container .add-fields-row { grid-template-columns: 1fr 1fr; gap: 12px; }
        .has-admin-tools #input-container #field-wrap-rank { grid-column: 1 / -1; grid-row: 1; }
        .has-admin-tools #input-container #field-wrap-unlock { grid-column: 1; grid-row: 2; }
        .has-admin-tools #input-container #field-wrap-uytin { grid-column: 2; grid-row: 2; }
        .has-admin-tools #input-container .field-wrap-action { grid-column: 1 / -1; }
        .has-admin-tools #input-container .field-wrap-action > label { display: none; }
        .has-admin-tools #input-container .add-form-grid.mode-chungsuc .add-fields-row { display: block; }
        .has-admin-tools #input-container .add-form-grid.mode-chungsuc #btn-add { min-width: 0; }
        .has-admin-tools .filter-actions { margin-left: 0; }
        .has-admin-tools .history-filters { border: 0; padding-left: 0; }
      }
      @media (max-width: 580px) {
        #input-container .admin-card-header { flex-wrap: wrap; gap: 12px; }
        #input-container .admin-card-title-group { flex: 1 1 190px; }
        .account-list-workspace .btn-copy-action { min-height: 40px; }
      }
      /* Full-width account tables: allocate columns instead of overflowing the page. */
      .app-layout { max-width: none; }
      @media (min-width: 1101px) {
        body { padding-left: clamp(20px, 2vw, 40px); padding-right: clamp(20px, 2vw, 40px); }
        .desktop-table-wrap .acc-table { width: 100%; table-layout: fixed; }
        .desktop-table-wrap .acc-table th {
          width: auto !important; min-width: 0 !important;
          white-space: normal; overflow-wrap: anywhere; padding: 12px 5px;
        }
        .desktop-table-wrap .acc-table td {
          min-width: 0; white-space: normal !important;
          overflow-wrap: anywhere; padding-left: 5px; padding-right: 5px;
        }
        .desktop-table-wrap .acc-table td > div { max-width: 100%; min-width: 0; }
        .desktop-table-wrap .acc-table .tbl-input { min-width: 0; max-width: 100%; padding-left: 3px !important; padding-right: 3px !important; }
        .desktop-table-wrap .acc-table .rank-input-field { width: 100% !important; }
        .desktop-table-wrap .acc-table .badge { max-width: 100%; white-space: normal; font-size: .7rem; padding: 4px 5px; }
        .desktop-table-wrap .acc-table .btn-copy-action { width: auto; max-width: 100%; white-space: normal; padding: 7px 10px; font-size: .75rem; }
        .desktop-table-wrap .acc-table .btn-toggle-row-eye { right: 0 !important; }
        .desktop-table-wrap .acc-table input[type="password"] { padding-right: 25px !important; padding-left: 2px !important; letter-spacing: 1px !important; }
        .desktop-table-wrap .acc-table td:has(.btn-toggle-row-eye) input { padding-right: 25px !important; }
      }
      @media (min-width: 821px) and (max-width: 1100px) {
        .account-list-workspace .desktop-table-wrap { display: none; }
        .account-list-workspace .mobile-card-list { display: flex; }
      }
      /* Analytics: one consistent scope, calm hierarchy and responsive reports. */
      #analytics-modal .modal-card-analytics {
        width: min(1320px, 96vw); height: 92dvh; max-height: none;
        background: var(--bg-main); border: 1px solid var(--border-color);
        border-radius: 16px; box-shadow: 0 24px 80px #0007;
      }
      #analytics-modal .analytics-header { background: var(--bg-main); padding: 20px 24px; }
      #analytics-modal .analytics-title-main { font-size: 1.15rem; font-weight: 600; letter-spacing: 0; }
      #analytics-modal .analytics-icon-badge { background: #292342; border-color: #61558c; box-shadow: none; }
      #analytics-modal .analytics-body { padding: 20px 24px 28px; gap: 18px; min-height: 0; }
      .analytics-controls { display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
      .analytics-controls label, .analytics-date-controls legend { font-size: .78rem; color: var(--text-sub); }
      .analytics-controls label { display: flex; flex-direction: column; gap: 6px; }
      .analytics-controls select { color: var(--text-main); background: var(--bg-surface); border: 1px solid var(--border-color); border-radius: 8px; padding: 9px 12px; min-height: 40px; font: inherit; }
      .analytics-date-controls { border: 0; padding: 0; margin: 0; min-width: 0; }
      .analytics-date-controls legend { margin-bottom: 6px; }
      #analytics-modal .analytics-time-filter { display: flex; flex-wrap: wrap; gap: 4px; }
      #analytics-modal .analytics-filter-chip { min-height: 40px; font-weight: 600; }
      #analytics-modal .analytics-filter-chip.active { background: #292342; color: #ded7ff; box-shadow: none; }
      .analytics-scope-line { display: flex; justify-content: space-between; gap: 8px 18px; flex-wrap: wrap; font-size: .78rem; }
      .analytics-scope-line span { color: var(--text-sub); }
      .analytics-data-explainer { border-left: 2px solid #61558c; padding: 0 0 0 12px; font-size: .78rem; color: var(--text-sub); }
      .analytics-data-explainer summary { cursor: pointer; color: #c9bfff; }
      .analytics-data-explainer p { margin: 10px 0 0; line-height: 1.7; }
      #analytics-modal .analytics-kpi-card, #analytics-modal .analytics-kpi-card:hover {
        background: var(--bg-surface); border-color: var(--border-color);
        border-radius: 10px; padding: 18px; transform: none; box-shadow: none;
      }
      #analytics-modal .analytics-kpi-icon { display: none; }
      #analytics-modal .analytics-kpi-val { font-size: 1.7rem; font-weight: 600; font-variant-numeric: tabular-nums; }
      #analytics-modal .analytics-kpi-lbl { text-transform: none; letter-spacing: 0; color: var(--text-sub); font-size: .8rem; margin-top: 8px; }
      #analytics-modal .analytics-kpi-sub { color: var(--text-sub); line-height: 1.5; }
      #analytics-modal .analytics-tab-bar { overflow: visible; padding-bottom: 12px; }
      #analytics-modal .analytics-tab-btn { background: transparent; border: 1px solid transparent; border-radius: 7px; font-weight: 600; padding: 10px 12px; }
      #analytics-modal .analytics-tab-btn.active { background: #292342; color: #ded7ff; border-color: #61558c; box-shadow: none; }
      #analytics-modal .analytics-section-card { background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 12px 0; min-width: 0; }
      #analytics-modal .analytics-section-header { flex-wrap: wrap; gap: 8px; }
      #analytics-modal .analytics-section-title { font-weight: 600; line-height: 1.5; }
      #analytics-modal .daily-pulse-card { background: transparent; border: 0; border-left: 2px solid var(--border-color); border-radius: 0; box-shadow: none; }
      #analytics-modal .daily-pulse-val { color: var(--text-main); font-size: 1.4rem; }
      #analytics-modal .daily-pulse-sub { color: var(--text-sub); }
      #analytics-modal .daily-chart-container { display: grid; grid-template-columns: repeat(var(--analytics-chart-columns, 7), minmax(0, 1fr)); height: auto; overflow: visible; padding: 16px 0; background: transparent; border: 0; gap: 14px 8px; }
      #analytics-modal .daily-chart-col { background: transparent; color: inherit; border: 0; border-radius: 4px; font: inherit; min-width: 0; height: 160px; padding: 0 2px; transform: none; }
      #analytics-modal .daily-chart-bar-wrap { flex: 1; min-height: 0; }
      #analytics-modal .daily-chart-bar-fill { min-height: 0; box-shadow: none; background: #8270e8; }
      #analytics-modal .daily-chart-col.is-today .daily-chart-bar-fill { background: #68bda4; }
      #analytics-modal .analytics-bar-fill { box-shadow: none; }
      #analytics-modal .analytics-table { width: 100%; table-layout: fixed; }
      #analytics-modal .analytics-table th { min-width: 0; width: auto !important; white-space: normal; text-transform: none; font-size: .75rem; letter-spacing: 0; }
      #analytics-modal .analytics-table td { white-space: normal; overflow-wrap: anywhere; font-size: .8rem; line-height: 1.5; }
      #analytics-modal .analytics-table th, #analytics-modal .analytics-table td { padding: 12px 8px; }
      .analytics-number { text-align: right; font-variant-numeric: tabular-nums; }
      .analytics-empty { text-align: center; color: var(--text-sub); padding: 24px 12px !important; }
      .analytics-status-ban { color: #f18b9e; }
      .analytics-status-ready { color: #68d9b0; }
      .analytics-activity-row { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--border-color); padding: 12px 0; font-size: .8rem; }
      .analytics-activity-row > div { min-width: 0; overflow-wrap: anywhere; }
      .analytics-activity-row span { display: block; color: var(--text-sub); font-size: .74rem; }
      #analytics-modal button:focus-visible, #analytics-modal select:focus-visible, #analytics-modal summary:focus-visible { outline: 2px solid var(--border-focus); outline-offset: 3px; }
      @media (max-width: 900px) {
        #analytics-modal .analytics-tab-panel > div[style*="grid-template-columns"] { grid-template-columns: minmax(0, 1fr) !important; }
        #analytics-modal .analytics-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      }
      @media (max-width: 600px) {
        #analytics-modal .modal-card-analytics { width: 100%; max-width: 100vw; height: 100dvh; border-radius: 0; }
        #analytics-modal .analytics-header { padding: 14px; }
        #analytics-modal .analytics-title-main { font-size: 1rem; flex-wrap: wrap; }
        #analytics-modal .analytics-icon-badge { display: none; }
        #analytics-modal .analytics-body { padding: 16px 12px 28px; }
        #analytics-modal .analytics-kpi-card { padding: 14px; }
        #analytics-modal .analytics-filter-chip, #analytics-modal .analytics-tab-btn, #analytics-modal .analytics-close-btn { min-height: 44px; }
        #analytics-modal .analytics-controls { gap: 12px; }
        #analytics-modal .analytics-date-controls { width: 100%; }
        #analytics-modal .daily-pulse-grid { grid-template-columns: minmax(0, 1fr); }
        #analytics-modal .daily-chart-container { grid-template-columns: repeat(min(var(--analytics-chart-columns), 7), minmax(0, 1fr)); }
        #analytics-modal .daily-chart-col { height: 130px; }
        #analytics-modal .analytics-table th, #analytics-modal .analytics-table td { padding: 10px 3px; font-size: .72rem; }
      }