.reference-body { min-height: 100vh; }
.reference-shell { width: min(1460px, calc(100% - 32px)); margin: 0 auto; padding: 18px 0 42px; }
.reference-shell[hidden], .admin-view[hidden] { display: none; }
.reference-header { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 18px; margin-bottom: 16px; }
.reference-brand { display: flex; align-items: center; gap: 12px; }
.reference-brand small, .dictionary-heading p, .users-heading p { color: var(--blue); font-size: .68rem; font-weight: 800; letter-spacing: .11em; }
.reference-brand h1 { margin: 2px 0 0; font-size: clamp(1.25rem, 2.4vw, 1.8rem); }
.reference-header .telegram-account { display: inline-flex; align-items: center; justify-self: end; gap: 7px; }
.reference-header [data-shared-header-controls] { justify-self: end; }
.back-link { color: var(--blue-dark); font-size: .82rem; font-weight: 720; text-decoration: none; }
#references-view { display: grid; grid-template-columns: 230px minmax(0,1fr); gap: 14px; align-items: start; }
.dictionary-nav { display: grid; gap: 7px; position: sticky; top: 14px; }
.dictionary-nav button { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 9px; min-height: 52px; padding: 8px 11px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: var(--paper); text-align: left; cursor: pointer; }
.dictionary-nav button > span { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 8px; color: var(--blue-dark); background: var(--blue-soft); font-family: "Noto Serif CJK TC", SimSun, serif; font-size: 1rem; }
.dictionary-nav button b { font-size: .8rem; }
.dictionary-nav button small { color: var(--muted); font-size: .66rem; }
.dictionary-nav button.is-active { border-color: var(--blue); box-shadow: 0 8px 24px rgba(17,120,201,.12); }
.dictionary-nav button[data-dictionary="users"] { border-color: color-mix(in srgb, var(--fire) 52%, var(--line)); color: color-mix(in srgb, var(--fire) 84%, var(--ink)); background: color-mix(in srgb, var(--fire) 7%, var(--paper)); }
.dictionary-nav button[data-dictionary="users"] > span { color: var(--fire); background: color-mix(in srgb, var(--fire) 12%, var(--paper)); }
.dictionary-nav button[data-dictionary="users"].is-active { border-color: var(--fire); box-shadow: 0 8px 24px color-mix(in srgb, var(--fire) 18%, transparent); }
.dictionary-workspace, .users-workspace { min-width: 0; padding: 18px; border: 1px solid var(--line); border-radius: 15px; background: var(--paper); box-shadow: var(--shadow); }
.dictionary-workspace[hidden], .users-workspace[hidden] { display: none; }
.dictionary-heading, .users-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.dictionary-heading h2, .users-heading h2 { margin: 4px 0 0; font-size: 1.1rem; }
.dictionary-heading small, .users-heading small { display: block; margin-top: 4px; color: var(--muted); font-size: .7rem; }
.count-badge { padding: 6px 9px; border-radius: 999px; color: var(--blue-dark); background: var(--blue-soft); font-size: .68rem; font-weight: 760; }
.dictionary-tools { display: grid; grid-template-columns: minmax(240px,480px) 1fr; align-items: center; gap: 12px; margin: 15px 0 11px; }
.dictionary-tools input { min-height: 40px; }
#save-status, #users-status { justify-self: end; color: var(--muted); font-size: .7rem; }
.structure-stem-filter { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 12px; padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: color-mix(in srgb,var(--canvas) 45%,var(--paper)); }
.structure-stem-filter[hidden] { display: none; }
.structure-stem-filter button { display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 0 10px; border: 1px solid var(--line); border-radius: 8px; color: var(--ink); background: var(--paper); cursor: pointer; }
.structure-stem-filter button b { font-size: .67rem; }
.structure-stem-filter button small { color: var(--muted); font-size: .58rem; }
.structure-stem-filter button.is-active { color: white; border-color: var(--blue); background: var(--blue); }
.structure-stem-filter button.is-active small { color: white; }
.reference-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 10px; }
.reference-table { width: 100%; border-collapse: collapse; }
.reference-table th { padding: 9px 10px; color: var(--muted); background: color-mix(in srgb,var(--canvas) 55%,var(--paper)); font-size: .65rem; text-align: left; white-space: nowrap; }
.reference-table td { padding: 10px; border-top: 1px solid var(--line); font-size: .72rem; vertical-align: middle; }
.reference-table td b, .reference-table td small { display: block; }
.reference-table td small { margin-top: 3px; color: var(--muted); font-size: .62rem; }
.glyph-cell { width: 58px; color: var(--blue-dark); font-family: "Noto Serif CJK TC", SimSun, serif; font-size: 1.35rem !important; font-weight: 700; }
.reference-table code { color: var(--muted); font-size: .65rem; }
.status { display: inline-flex; padding: 4px 7px; border-radius: 999px; font-size: .6rem; font-weight: 760; }
.status-active { color: #23704a; background: rgba(54,171,108,.14); }
.status-draft { color: #9a6320; background: rgba(221,158,53,.16); }
.status-archived { color: var(--muted); background: color-mix(in srgb,var(--muted) 12%,transparent); }
.edit-entry { width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 8px; color: var(--blue-dark); background: var(--paper); cursor: pointer; }
.empty-row { padding: 30px !important; color: var(--muted); text-align: center; }
.entry-dialog { width: min(980px,calc(100% - 24px)); max-height: min(88vh,900px); padding: 0; border: 1px solid var(--line); border-radius: 16px; color: var(--ink); background: var(--paper); box-shadow: 0 36px 110px rgba(0,0,0,.35); }
.entry-dialog::backdrop { background: rgba(5,12,20,.72); backdrop-filter: blur(5px); }
.entry-dialog form { display: grid; max-height: 88vh; grid-template-rows: auto minmax(0,1fr) auto; }
.entry-dialog header, .entry-dialog footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 18px; }
.entry-dialog header { border-bottom: 1px solid var(--line); }
.entry-dialog header small { color: var(--blue); font-size: .65rem; font-weight: 780; letter-spacing: .08em; }
.entry-dialog h2 { margin: 3px 0 0; font-size: 1.05rem; }
.dialog-close { border: 0; color: var(--muted); background: transparent; font-size: 1.6rem; cursor: pointer; }
.entry-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; padding: 18px; overflow-y: auto; }
.entry-fields textarea { width: 100%; min-height: 88px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: color-mix(in srgb,var(--canvas) 45%,var(--paper)); resize: vertical; font: inherit; }
.entry-fields input[readonly] { opacity: .68; }
.wide-field { grid-column: 1 / -1; }
.checkbox-field { display: flex; align-items: center; gap: 9px; }
.checkbox-field input { width: 17px; min-height: 17px; }
.entry-dialog footer { justify-content: flex-end; border-top: 1px solid var(--line); }
.entry-dialog footer button { min-width: 120px; }
#users-status { display: block; margin-top: 12px; }
.users-tools { display:grid; grid-template-columns:minmax(240px,2fr) minmax(155px,.8fr) minmax(180px,1fr) auto; align-items:end; gap:8px; margin-top:14px; }
.users-tools label { display:grid; gap:5px; }
.users-tools label > span { color:var(--muted); font-size:.64rem; font-weight:760; }
.users-tools input,.users-tools select { width:100%; min-height:40px; padding:8px 10px; border:1px solid var(--line); border-radius:8px; color:var(--ink); background:var(--paper); font:inherit; font-size:.74rem; }
.users-tools input:focus,.users-tools select:focus { border-color:var(--blue); outline:2px solid color-mix(in srgb,var(--blue) 16%,transparent); }
.users-tools .secondary-button { min-height:40px; padding:0 12px; }
.users-list { display: grid; gap: 12px; margin-top: 12px; }
.user-card { min-width: 0; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb,var(--canvas) 28%,var(--paper)); overflow: hidden; }
.user-row { display: grid; grid-template-columns: 92px 42px minmax(250px,1fr) minmax(130px,.62fr) minmax(150px,.72fr) 18px; align-items: center; gap: 12px; min-height: 68px; padding: 12px 13px; background: var(--paper); cursor: pointer; list-style: none; }
.user-row::-webkit-details-marker { display: none; }
.user-card[open] > .user-row { border-bottom: 1px solid var(--line); }
.user-public-id { display: grid; gap: 3px; color: var(--ink); }
.user-public-id small { color: var(--muted); font-size: .56rem; font-weight: 760; letter-spacing: .08em; }
.user-public-id code { color: var(--ink); font-size: .74rem; font-weight: 800; letter-spacing: .04em; }
.user-avatar { display: grid; width: 42px; height: 42px; place-items: center; overflow: hidden; border-radius: 50%; color: white; background: var(--blue); font-size: 1rem; font-weight: 800; }
.user-avatar img { width: 100%; height: 100%; object-fit: cover; }
.user-identity { display: flex; align-items: center; min-width: 0; gap: 8px; white-space: nowrap; }
.user-identity b { font-size: .86rem; }
.user-identity small { overflow: hidden; margin: 0; color: var(--muted); font-size: .67rem; text-overflow: ellipsis; }
.user-role-inline { padding: 4px 7px; border-radius: 999px; color: var(--blue-dark); background: var(--blue-soft); font-size: .61rem; font-weight: 780; white-space: nowrap; }
.user-row-fact { display: grid; gap: 4px; min-width: 0; }
.user-row-fact small { color: var(--muted); font-size: .6rem; }
.user-row-fact b { overflow: hidden; font-size: .69rem; text-overflow: ellipsis; white-space: nowrap; }
.user-role-badge { padding: 5px 8px; border-radius: 999px; color: var(--blue-dark); background: var(--blue-soft); font-size: .62rem; font-weight: 780; white-space: nowrap; }
.user-expand-icon { display: grid; width: 20px; height: 20px; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--blue-dark); font-size: .86rem; font-weight: 800; line-height: 1; }
.user-expand-icon span:last-child, .user-card[open] .user-expand-icon span:first-child { display: none; }
.user-card[open] .user-expand-icon span:last-child { display: block; }
.presence { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: .62rem; font-weight: 760; }
.presence::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #85919b; }
.presence.is-online { color: #188652; }
.presence.is-online::before { background: #25ad6b; box-shadow: 0 0 0 4px rgba(37,173,107,.12); }
.user-details { padding: 13px; }
.user-detail-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.user-info-group { min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); }
.user-info-group > header { margin-bottom: 10px; }
.user-info-group > header small { color: var(--blue); font-size: .57rem; font-weight: 820; letter-spacing: .1em; }
.user-info-group > header h3 { margin: 3px 0 0; font-size: .78rem; }
.telegram-info-group > header small { color: #278b65; }
.statistics-info-group > header small { color: #b77a20; }
.saved-cards-info-group > header small { color: #8b62c4; }
.saved-card-counters { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }
.saved-card-counters a { display: grid; min-width: 0; gap: 4px; padding: 10px; border: 1px solid color-mix(in srgb,#8b62c4 32%,var(--line)); border-radius: 9px; color: var(--ink); background: color-mix(in srgb,#8b62c4 7%,var(--paper)); text-decoration: none; transition: transform .15s ease,border-color .15s ease,background .15s ease; }
.saved-card-counters a:hover { transform: translateY(-1px); border-color: #8b62c4; background: color-mix(in srgb,#8b62c4 13%,var(--paper)); }
.saved-card-counters small { color: var(--muted); font-size: .58rem; }
.saved-card-counters b { color: var(--blue-dark); font-size: 1rem; }
.saved-card-counters span { overflow: hidden; color: #8b62c4; font-size: .57rem; font-weight: 760; text-overflow: ellipsis; white-space: nowrap; }
.role-editor { display: grid; grid-template-columns: minmax(130px,1fr); gap: 7px; padding: 0 0 10px; }
.role-editor select, .role-editor button { min-height: 40px; }
.role-editor label { display: grid; gap: 5px; }
.role-editor label > small { color: var(--muted); font-size: .61rem; }
.platform-access-editor { grid-template-columns: repeat(2,minmax(0,1fr)); padding-top: 10px; border-top: 1px solid var(--line); }
.platform-access-editor button { grid-column: 1 / -1; }
.user-facts { display: grid; grid-template-columns: 1fr; padding: 0; }
.user-facts div { display: grid; grid-template-columns: minmax(105px,.8fr) minmax(0,1.2fr); gap: 9px; min-width: 0; padding: 8px 2px; border-bottom: 1px solid var(--line); }
.user-facts dt { color: var(--muted); font-size: .61rem; }
.user-facts dd { margin: 0; overflow-wrap: anywhere; font-size: .7rem; font-weight: 680; }
.session-history { margin-top: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); }
.session-history > summary { padding: 11px 14px; color: var(--blue-dark); cursor: pointer; font-size: .7rem; font-weight: 760; }
.session-history ul { display: grid; gap: 7px; margin: 0; padding: 0 13px 13px; list-style: none; }
.session-history li { display: grid; gap: 4px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); }
.session-history li > div { display: flex; justify-content: space-between; gap: 10px; }
.session-history li b { font-size: .7rem; }
.session-history li small { overflow: hidden; color: var(--muted); font-size: .62rem; text-overflow: ellipsis; white-space: nowrap; }
.empty-users { color: var(--muted); font-size: .7rem; line-height: 1.4; }
.access-denied { grid-column: 1 / -1; padding: 42px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper); text-align: center; }
.access-denied p { margin: 8px 0 18px; color: var(--muted); }
.access-denied a { color: var(--blue-dark); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
html[data-theme="dark"] .status-active { color: #8ce1b2; }
html[data-theme="dark"] .status-draft { color: #f1c579; }
@media (max-width: 1180px) {
  .user-row { grid-template-columns: 88px 42px minmax(220px,1fr) minmax(125px,.7fr) 18px; }
  .user-row-fact:nth-child(5) { display: none; }
  .user-detail-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 820px) {
  .reference-shell { width: calc(100% - 16px); }
  .reference-header { grid-template-columns: auto 1fr; }
  .reference-header .telegram-account { grid-column: 1 / -1; justify-self: start; }
  .reference-header [data-shared-header-controls] { grid-column: 1 / -1; justify-self: stretch; }
  #references-view { grid-template-columns: 1fr; }
  .dictionary-nav { position: static; grid-template-columns: repeat(6,minmax(118px,1fr)); overflow-x: auto; padding-bottom: 4px; }
  .dictionary-nav button { grid-template-columns: 28px 1fr; min-width: 118px; }
  .dictionary-nav button small { display: none; }
  .dictionary-nav button > span { width: 28px; height: 28px; }
  .user-row { grid-template-columns: 88px 42px minmax(150px,1fr) 18px; }
  .user-row-fact { display: none; }
  .user-detail-grid { grid-template-columns: 1fr; }
  .users-tools { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .users-search { grid-column:1 / -1; }
}

@media (max-width: 560px) {
  .reference-brand .brand-mark { display: none; }
  .dictionary-workspace, .users-workspace { padding: 13px; }
  .users-tools { grid-template-columns:1fr; }
  .users-search { grid-column:auto; }
  .dictionary-tools { grid-template-columns: 1fr; }
  #save-status, #users-status { justify-self: start; }
  .entry-fields { grid-template-columns: 1fr; padding: 13px; }
  .wide-field { grid-column: auto; }
  .user-row { grid-template-columns: 82px 38px minmax(0,1fr) 18px; gap: 8px; padding-inline: 10px; }
  .user-avatar { width: 38px; height: 38px; }
  .user-identity { gap: 5px; }
  .user-identity small, .user-identity .presence { display: none; }
  .role-editor, .platform-access-editor { grid-template-columns: 1fr; }
  .platform-access-editor button { grid-column: auto; }
  .user-facts div { grid-template-columns: 1fr; gap: 3px; }
  .saved-card-counters { grid-template-columns: 1fr; }
}