/*
 * Library (LmsBiblioClientComponents) - one global stylesheet with the bib- prefix (Docs/Biblio_Stage1_Design.md §9.4).
 * Components use ONLY --bib-* tokens. Every component root is <div class="bib" data-bib-skin="student|lecturer">; the skin
 * maps the tokens to the portal's own tokens (--aurelia-*, --tenant-*, --color-*, --portal-*) with the Aurelia defaults as
 * fallbacks (pearl surfaces, brand + warm gold, graphite text; green only for status), so in a portal the tenant token wins.
 * Rules stay low-specificity inside .bib so pages can fine-tune without ::deep; focus rings are painted on the field shell,
 * never on the bare inner control. Responsive to 360 px.
 *
 * Sections: 1 tokens and 2 skins (FOUNDATION, keep as written) · 3 onwards: components (U3).
 */

/* ---------------------------------------------------------------------------------------------------- 1 tokens */
.bib {
    --bib-text: #303238;
    --bib-text-muted: #666a73;
    --bib-surface: #ffffff;
    --bib-surface-subtle: #faf8f5;
    --bib-border: #e7e2d9;
    --bib-accent: #18314f;
    --bib-on-accent: #ffffff;
    --bib-gold: #b79c67;
    --bib-action: #18314f;
    --bib-on-action: #ffffff;
    --bib-focus: #315f86;
    --bib-danger: #b7384c;
    --bib-warning: #8a631f;
    --bib-success: #19765a;
    --bib-info: #416a8b;
    --bib-radius: 12px;
    --bib-gap: 16px;
    --bib-card-shadow: 0 2px 12px #2e292506, 0 1px 2px #2e292504;

    /* Derived tokens (skins normally leave these alone). */
    --bib-radius-sm: calc(var(--bib-radius) * .66);
    --bib-accent-soft: color-mix(in srgb, var(--bib-accent) 8%, var(--bib-surface));
    --bib-gold-soft: color-mix(in srgb, var(--bib-gold) 14%, var(--bib-surface));
    --bib-danger-soft: color-mix(in srgb, var(--bib-danger) 8%, var(--bib-surface));
    --bib-warning-soft: color-mix(in srgb, var(--bib-warning) 10%, var(--bib-surface));
    --bib-success-soft: color-mix(in srgb, var(--bib-success) 9%, var(--bib-surface));
    --bib-info-soft: color-mix(in srgb, var(--bib-info) 8%, var(--bib-surface));
    --bib-ring: 0 0 0 3px color-mix(in srgb, var(--bib-focus) 30%, transparent);

    color: var(--bib-text);
    font-family: var(--aurelia-font, "Noto Sans Georgian", "Segoe UI", system-ui, sans-serif);
}

/* ----------------------------------------------------------------------------------------------------- 2 skins */

/* Student and Lecturer: MudBlazor Aurelia portals, tenant brand + warm gold on pearl. */
.bib[data-bib-skin="student"],
.bib[data-bib-skin="lecturer"] {
    --bib-text: var(--portal-text, var(--color-text-primary, #303238));
    --bib-text-muted: var(--portal-muted, var(--color-text-secondary, #666a73));
    --bib-surface: var(--color-surface, #ffffff);
    --bib-surface-subtle: var(--color-surface-subtle, #faf8f5);
    --bib-border: var(--portal-border, var(--color-border, #e7e2d9));
    --bib-accent: var(--aurelia-brand, var(--tenant-primary, #18314f));
    --bib-on-accent: var(--aurelia-on-brand, var(--tenant-on-primary, #ffffff));
    --bib-gold: var(--aurelia-accent, var(--tenant-accent, #b79c67));
    --bib-action: var(--aurelia-brand, var(--tenant-action, #18314f));
    --bib-on-action: var(--aurelia-on-brand, var(--tenant-on-action, #ffffff));
    --bib-focus: var(--tenant-focus-ring, #315f86);
    --bib-danger: var(--color-danger, #b7384c);
    --bib-warning: var(--color-warning, #8a631f);
    --bib-success: var(--color-success, #19765a);
    --bib-info: var(--color-info, #416a8b);
    --bib-radius: var(--radius-lg, 12px);
    --bib-card-shadow: var(--shadow-card, 0 2px 12px #2e292506, 0 1px 2px #2e292504);
}

/* ----------------------------------------------------------------------------------------------------- 3 base */
html.bib-scroll-locked { overflow: hidden; }

.bib { box-sizing: border-box; min-width: 0; font-size: 13px; line-height: 1.55; }
.bib *, .bib *::before, .bib *::after { box-sizing: border-box; }
.bib :where(h2, h3, h4, p, ul, ol, dl, dd, figure) { margin: 0; }
.bib :where(ul, ol) { padding: 0; list-style: none; }
.bib :where(button, input, select, textarea) { font: inherit; color: inherit; }
/* MudBlazor (loaded by both portals) sets button { display: inline-flex; justify-content: center }: buttons that are titles or
   list items would float to the middle of their box. They start at the left edge; .bib-button and the icon buttons centre
   their own content further down. */
.bib :where(button) { justify-content: normal; }
.bib :where(a) { color: var(--bib-accent); text-decoration: none; }
/* tabindex="-1" = a dialog, drawer or scan view focused by script: no ring around the whole sheet (it keeps its own shadow). */
.bib :where(button, a, [tabindex]:not([tabindex="-1"]), summary):focus-visible { outline: none; box-shadow: var(--bib-ring); }
/* Decorative inks of the material-type covers and the void card face (skins may override them). */
.bib { --bib-ink-graphite: #3d4049; --bib-ink-slate: #5d6068; --bib-ink-umber: #7a5a3a; --bib-ink-plum: #6b4a6e; }
.bib-icon { flex: none; fill: currentColor; }
.bib-visually-hidden { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.bib-muted { color: var(--bib-text-muted); }
.bib-mono { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: .94em; font-variant-numeric: tabular-nums; }
.bib-ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bib-eyebrow { display: block; color: color-mix(in srgb, var(--bib-gold) 72%, var(--bib-text)); font-size: 11px; font-weight: 500; letter-spacing: .03em; line-height: 1.5; }
.bib-label { color: var(--bib-text-muted); font-size: 11px; line-height: 1.5; }
.bib-dot { display: inline-block; width: 3px; height: 3px; border-radius: 50%; background: currentColor; opacity: .55; }
.bib-count { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--bib-accent-soft); color: var(--bib-accent); font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; }
.bib-required { color: var(--bib-danger); font-style: normal; }
.bib-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }

/* ---------------------------------------------------------------------------------------------------- 4 buttons */
.bib-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 36px; padding: 0 14px; border: 1px solid var(--bib-border); border-radius: 9px; background: var(--bib-surface); color: var(--bib-text); font-size: 12.5px; font-weight: 500; line-height: 1.2; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, box-shadow 150ms ease; }
.bib-button:hover { border-color: color-mix(in srgb, var(--bib-accent) 26%, var(--bib-border)); background: var(--bib-accent-soft); color: var(--bib-accent); }
.bib-button:disabled, .bib-button[aria-disabled="true"] { opacity: .55; cursor: default; pointer-events: none; }
.bib-button--primary { border-color: var(--bib-action); background: linear-gradient(135deg, color-mix(in srgb, var(--bib-action) 84%, #000), var(--bib-action)); color: var(--bib-on-action); box-shadow: inset 0 1px #ffffff26, 0 2px 8px color-mix(in srgb, var(--bib-action) 22%, transparent); }
.bib-button--primary:hover { border-color: var(--bib-action); background: var(--bib-action); color: var(--bib-on-action); box-shadow: inset 0 1px #ffffff26, 0 4px 14px color-mix(in srgb, var(--bib-action) 30%, transparent); }
.bib-button--ghost { background: var(--bib-surface); }
.bib-button--small { min-height: 30px; padding: 0 10px; border-radius: 8px; font-size: 11.5px; }
.bib-button--block { width: 100%; }
.bib-button--danger { color: var(--bib-danger); }
.bib-button--danger:hover { border-color: color-mix(in srgb, var(--bib-danger) 30%, var(--bib-border)); background: var(--bib-danger-soft); color: var(--bib-danger); }
.bib-icon-button { display: inline-grid; place-items: center; flex: none; width: 34px; height: 34px; padding: 0; border: 1px solid transparent; border-radius: 9px; background: transparent; color: var(--bib-text-muted); cursor: pointer; transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease; }
.bib-icon-button:hover { border-color: var(--bib-border); background: var(--bib-accent-soft); color: var(--bib-accent); }
.bib-icon-button:disabled { opacity: .4; cursor: default; pointer-events: none; }
.bib-icon-button--small { width: 28px; height: 28px; border-radius: 7px; }
.bib-icon-button--danger:hover { background: var(--bib-danger-soft); color: var(--bib-danger); }
.bib-link-button { display: inline-flex; align-items: center; gap: 4px; padding: 2px 0; border: 0; background: none; color: var(--bib-accent); font-size: 11.5px; font-weight: 500; cursor: pointer; }
.bib-link-button:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ------------------------------------------------------------------------------------------------------ 5 chips */
.bib-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; min-width: 0; }
.bib-chip { display: inline-flex; align-items: center; gap: 4px; min-width: 0; max-width: 100%; padding: 2px 8px; border: 1px solid var(--bib-border); border-radius: 6px; background: var(--bib-surface-subtle); color: var(--bib-text-muted); font-size: 11px; font-weight: 500; line-height: 1.6; overflow-wrap: anywhere; }
.bib-chip--info { border-color: color-mix(in srgb, var(--bib-info) 22%, var(--bib-border)); background: var(--bib-info-soft); color: var(--bib-info); }
.bib-chip--success { border-color: color-mix(in srgb, var(--bib-success) 24%, var(--bib-border)); background: var(--bib-success-soft); color: var(--bib-success); }
.bib-chip--warning { border-color: color-mix(in srgb, var(--bib-warning) 24%, var(--bib-border)); background: var(--bib-warning-soft); color: var(--bib-warning); }
.bib-chip--danger { border-color: color-mix(in srgb, var(--bib-danger) 24%, var(--bib-border)); background: var(--bib-danger-soft); color: var(--bib-danger); }
.bib-chip--accent { border-color: color-mix(in srgb, var(--bib-gold) 30%, var(--bib-border)); background: var(--bib-gold-soft); color: color-mix(in srgb, var(--bib-gold) 62%, var(--bib-text)); }
.bib-chip--brand { border-color: color-mix(in srgb, var(--bib-accent) 22%, var(--bib-border)); background: var(--bib-accent-soft); color: var(--bib-accent); }
.bib-chip--button { cursor: pointer; transition: filter 150ms ease, border-color 150ms ease; }
.bib-chip--button:hover { border-color: color-mix(in srgb, var(--bib-gold) 55%, var(--bib-border)); filter: saturate(1.15); }

/* ----------------------------------------------------------------------------------------------------- 6 fields */
/* align-content: start - a field next to a taller one (a hint under it) keeps its own height instead of stretching its box. */
.bib-field { display: grid; align-content: start; gap: 5px; min-width: 0; }
.bib-field__label { color: var(--bib-text); font-size: 11.5px; font-weight: 500; line-height: 1.4; }
.bib-field__shell { display: flex; align-items: center; gap: 8px; min-width: 0; min-height: 38px; padding: 0 11px; border: 1px solid var(--bib-border); border-radius: 9px; background: var(--bib-surface); color: var(--bib-text-muted); transition: border-color 150ms ease, box-shadow 150ms ease; }
.bib-field__shell:focus-within { border-color: var(--bib-accent); box-shadow: var(--bib-ring); }
.bib-field__shell.is-invalid { border-color: var(--bib-danger); }
.bib-field__control { flex: 1; width: 100%; min-width: 0; padding: 8px 0; border: 0; outline: 0; background: transparent; color: var(--bib-text); font-size: 13px; line-height: 1.45; }
.bib-field__control::placeholder { color: var(--bib-text-muted); opacity: .8; }
.bib-field__control:disabled { cursor: default; opacity: .55; }
textarea.bib-field__control { resize: vertical; min-height: 44px; }
select.bib-field__control { appearance: none; padding-right: 22px; cursor: pointer; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%2370747c' d='M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z'/%3E%3C/svg%3E") no-repeat right center / 18px; }
.bib-field__error { color: var(--bib-danger); font-size: 11px; }
.bib-field__hint { color: var(--bib-text-muted); font-size: 11.5px; line-height: 1.5; }
.bib-field--inline { grid-auto-flow: column; align-items: center; justify-content: start; gap: 8px; }
.bib-field--inline .bib-field__label { color: var(--bib-text-muted); font-weight: 400; }
.bib-field--inline .bib-field__shell { min-height: 32px; }
.bib-field--inline .bib-field__control { padding-block: 5px; font-size: 12px; }
.bib-check { display: grid; place-items: center; width: 16px; height: 16px; border: 1.5px solid var(--bib-border); border-color: color-mix(in srgb, var(--bib-text) 22%, var(--bib-border)); border-radius: 4px; background: var(--bib-surface); color: transparent; transition: background-color 120ms ease, border-color 120ms ease; }

/* ---------------------------------------------------------------------------------------- 7 panels, callouts, states */
.bib-panel { display: grid; align-content: start; gap: 12px; min-width: 0; padding: 16px; border: 1px solid var(--bib-border); border-radius: var(--bib-radius); background: var(--bib-surface); box-shadow: var(--bib-card-shadow); }
.bib-section-title { display: flex; align-items: center; gap: 8px; color: var(--bib-text); font-size: 13.5px; font-weight: 600; line-height: 1.4; }
.bib-section-title > .bib-icon { color: var(--bib-accent); }
.bib-section-title > .bib-count { margin-left: auto; }
.bib-callout { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--bib-border); border-radius: 10px; background: var(--bib-surface-subtle); color: var(--bib-text); font-size: 12.5px; line-height: 1.5; }
.bib-callout > .bib-icon { color: var(--bib-text-muted); }
.bib-callout > div { display: grid; gap: 3px; min-width: 0; }
.bib-callout--block { align-items: flex-start; }
.bib-callout--block > .bib-icon { margin-top: 1px; }
.bib-callout--info { border-color: color-mix(in srgb, var(--bib-info) 22%, var(--bib-border)); background: var(--bib-info-soft); }
.bib-callout--info > .bib-icon { color: var(--bib-info); }
.bib-callout--success { border-color: color-mix(in srgb, var(--bib-success) 24%, var(--bib-border)); background: var(--bib-success-soft); }
.bib-callout--success > .bib-icon { color: var(--bib-success); }
.bib-callout--warning { border-color: color-mix(in srgb, var(--bib-warning) 24%, var(--bib-border)); background: var(--bib-warning-soft); }
.bib-callout--warning > .bib-icon { color: var(--bib-warning); }
.bib-callout--danger { border-color: color-mix(in srgb, var(--bib-danger) 24%, var(--bib-border)); background: var(--bib-danger-soft); }
.bib-callout--danger > .bib-icon { color: var(--bib-danger); }

.bib-state { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-width: 0; padding: 34px 18px; border: 1px dashed color-mix(in srgb, var(--bib-text) 14%, var(--bib-border)); border-radius: var(--bib-radius); background: var(--bib-surface); color: var(--bib-text); text-align: center; }
.bib-state__icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--bib-accent-soft); color: var(--bib-accent); }
.bib-state__copy { display: grid; gap: 4px; max-width: 58ch; }
.bib-state__copy strong { font-size: 14px; font-weight: 600; text-wrap: balance; }
.bib-state__copy span { color: var(--bib-text-muted); font-size: 12.5px; line-height: 1.6; text-wrap: pretty; }
.bib-state--error .bib-state__icon { background: var(--bib-danger-soft); color: var(--bib-danger); }
.bib-state.is-warning .bib-state__icon { background: var(--bib-warning-soft); color: var(--bib-warning); }
.bib-state--disabled .bib-state__icon { background: var(--bib-surface-subtle); color: var(--bib-text-muted); }
.bib-state--signinrequired .bib-state__icon { background: var(--bib-gold-soft); color: color-mix(in srgb, var(--bib-gold) 70%, var(--bib-text)); }
.bib-state--compact { flex-direction: row; justify-content: flex-start; flex-wrap: wrap; gap: 12px; padding: 14px; border-style: solid; background: var(--bib-surface-subtle); text-align: left; }
.bib-state--compact .bib-state__icon { width: 36px; height: 36px; }
.bib-state--compact .bib-state__copy { flex: 1; min-width: 180px; }
.bib-spinner { display: inline-block; width: 22px; height: 22px; border: 2px solid color-mix(in srgb, var(--bib-accent) 18%, transparent); border-top-color: var(--bib-accent); border-radius: 50%; animation: bib-spin .8s linear infinite; }
.bib-spinner--small { width: 14px; height: 14px; border-width: 2px; border-color: color-mix(in srgb, currentColor 25%, transparent); border-top-color: currentColor; }
.bib-skeleton-stack { display: grid; gap: 9px; align-content: center; min-width: 0; }
.bib-skeleton { display: block; height: 12px; border-radius: 6px; background: linear-gradient(90deg, var(--bib-surface-subtle) 0%, color-mix(in srgb, var(--bib-border) 70%, var(--bib-surface)) 50%, var(--bib-surface-subtle) 100%); background-size: 200% 100%; animation: bib-shimmer 1.3s ease-in-out infinite; }
.bib-skeleton--short { width: 55%; }
.bib-skeleton--cover { width: 56px; height: 78px; border-radius: 4px 8px 8px 4px; }
@keyframes bib-spin { to { transform: rotate(360deg); } }
@keyframes bib-shimmer { from { background-position: 100% 0; } to { background-position: -100% 0; } }
@keyframes bib-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes bib-slide { from { transform: translateX(28px); opacity: .4; } to { transform: none; opacity: 1; } }
@keyframes bib-pop { from { transform: translateY(8px) scale(.985); opacity: 0; } to { transform: none; opacity: 1; } }

/* ------------------------------------------------------------------------------------------------- 8 workspace tabs */
.bib-workspace { display: grid; min-width: 0; }
.bib-tabs { display: flex; gap: 4px; min-width: 0; padding: 4px; overflow-x: auto; border: 1px solid var(--bib-border); border-radius: 13px; background: var(--bib-surface); box-shadow: var(--bib-card-shadow); scrollbar-width: none; }
.bib-tabs::-webkit-scrollbar { display: none; }
/* A tab row wider than the screen: a soft fade on the side that has more tabs (biblio.js watchOverflow sets data-more-*).
   Sticky offsets count from the bar's content box, so -4px (= the bar's padding) puts the fade flush with the padding edge. */
.bib-tabs::before, .bib-tabs::after { content: ""; position: sticky; z-index: 1; flex: none; width: 30px; opacity: 0; pointer-events: none; transition: opacity 150ms ease; }
.bib-tabs::before { left: -4px; margin: -4px -30px -4px -4px; border-radius: 12px 0 0 12px; background: linear-gradient(to right, var(--bib-surface) 25%, transparent); }
.bib-tabs::after { right: -4px; margin: -4px -4px -4px -30px; border-radius: 0 12px 12px 0; background: linear-gradient(to left, var(--bib-surface) 25%, transparent); }
.bib-tabs[data-more-start]::before, .bib-tabs[data-more-end]::after { opacity: 1; }
.bib-tab { display: inline-flex; flex: none; align-items: center; gap: 7px; min-height: 38px; padding: 0 15px; border: 0; border-radius: 9px; background: transparent; color: var(--bib-text-muted); font-size: 12.5px; font-weight: 500; white-space: nowrap; cursor: pointer; transition: background-color 150ms ease, color 150ms ease, box-shadow 150ms ease; }
.bib-tab:hover { background: var(--bib-accent-soft); color: var(--bib-accent); }
.bib-tab.is-active { background: linear-gradient(135deg, color-mix(in srgb, var(--bib-accent) 84%, #000), var(--bib-accent)); color: var(--bib-on-accent); box-shadow: inset 0 1px #ffffff26, 0 3px 10px color-mix(in srgb, var(--bib-accent) 22%, transparent); }
.bib-tab.is-active .bib-icon { color: var(--bib-gold); }
.bib-tabpanel { display: grid; gap: 14px; min-width: 0; margin-top: 14px; }

/* ------------------------------------------------------------------------------------------- 9 search and suggest */
.bib-search { display: grid; gap: 14px; min-width: 0; }
.bib-search__bar { display: grid; gap: 12px; padding: 14px; border: 1px solid var(--bib-border); border-radius: var(--bib-radius); background: var(--bib-surface); box-shadow: var(--bib-card-shadow); }
.bib-search--hero .bib-search__bar { gap: 16px; padding: 24px; background: radial-gradient(ellipse at top right, var(--bib-gold-soft), transparent 52%), linear-gradient(110deg, var(--bib-surface) 50%, var(--bib-accent-soft)); }
.bib-search__hero { display: grid; gap: 6px; }
.bib-search__hero h2 { color: var(--bib-text); font-size: clamp(20px, 2.4vw, 28px); font-weight: 600; letter-spacing: -.3px; line-height: 1.35; }
.bib-search__hero p { max-width: 70ch; color: var(--bib-text-muted); font-size: 13px; line-height: 1.6; }

.bib-searchbox { position: relative; display: flex; align-items: stretch; gap: 8px; min-width: 0; }
.bib-searchbox__field { display: flex; flex: 1; align-items: center; gap: 9px; min-width: 0; min-height: 44px; padding: 0 12px; border: 1px solid var(--bib-border); border-radius: 11px; background: var(--bib-surface); color: var(--bib-text-muted); cursor: text; transition: border-color 150ms ease, box-shadow 150ms ease; }
.bib-searchbox__field:focus-within { border-color: var(--bib-accent); box-shadow: var(--bib-ring); color: var(--bib-accent); }
.bib-searchbox__input { flex: 1; min-width: 0; padding: 10px 0; border: 0; outline: 0; background: transparent; color: var(--bib-text); font-size: 14px; }
.bib-searchbox__input::placeholder { color: var(--bib-text-muted); opacity: .85; }
.bib-searchbox__input::-webkit-search-cancel-button { appearance: none; }
.bib-searchbox__clear { display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 7px; background: transparent; color: var(--bib-text-muted); cursor: pointer; }
.bib-searchbox__clear:hover { background: var(--bib-surface-subtle); color: var(--bib-text); }
.bib-searchbox__submit { min-height: 44px; padding: 0 18px; border-radius: 11px; }
.bib-searchbox--large .bib-searchbox__field { min-height: 52px; padding: 0 16px; border-radius: 13px; }
.bib-searchbox--large .bib-searchbox__input { font-size: 15.5px; }
.bib-searchbox--large .bib-searchbox__submit { min-height: 52px; padding: 0 22px; border-radius: 13px; font-size: 13.5px; }
.bib-suggest { position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 30; display: none; max-height: 340px; padding: 6px; overflow-y: auto; border: 1px solid var(--bib-border); border-radius: 12px; background: var(--bib-surface); box-shadow: 0 18px 50px #2e292524, 0 2px 6px #2e292508; }
.bib-suggest.is-open { display: grid; gap: 1px; animation: bib-fade 120ms ease-out; }
.bib-suggest__option { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto auto; align-items: center; gap: 9px; padding: 7px 8px; border-radius: 8px; color: var(--bib-text); cursor: pointer; }
.bib-suggest__option:hover, .bib-suggest__option.is-active { background: var(--bib-accent-soft); }
.bib-suggest__kind { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 7px; background: var(--bib-accent-soft); color: var(--bib-accent); }
.bib-suggest__kind--author { background: var(--bib-gold-soft); color: color-mix(in srgb, var(--bib-gold) 70%, var(--bib-text)); }
.bib-suggest__kind--subject { background: var(--bib-info-soft); color: var(--bib-info); }
.bib-suggest__text { min-width: 0; font-size: 13px; font-weight: 500; overflow-wrap: anywhere; }
.bib-suggest__meta { color: var(--bib-text-muted); font-size: 11px; }
.bib-suggest__count { min-width: 22px; padding: 0 6px; border-radius: 999px; background: var(--bib-surface-subtle); color: var(--bib-text-muted); font-size: 11px; text-align: center; font-variant-numeric: tabular-nums; }

.bib-search__layout { display: grid; grid-template-columns: 252px minmax(0, 1fr); align-items: start; gap: 14px; min-width: 0; }
.bib-search__filters { min-width: 0; }
.bib-search__filters-sheet { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 12px 14px 14px; border: 1px solid var(--bib-border); border-radius: var(--bib-radius); background: var(--bib-surface); box-shadow: var(--bib-card-shadow); }
.bib-search__filters-head { display: flex; align-items: center; gap: 8px; }
.bib-search__filters-head h3 { display: flex; flex: 1; align-items: center; gap: 7px; min-width: 0; font-size: 13px; font-weight: 600; }
.bib-search__filters-head .bib-link-button { flex: none; white-space: nowrap; }
.bib-search__filters-head h3 .bib-icon { color: var(--bib-accent); }
.bib-search__filters-close, .bib-search__filters-foot, .bib-search__filters-backdrop, .bib-search__filters-open { display: none; }
.bib-search__results { display: grid; gap: 12px; min-width: 0; }
.bib-search__summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; min-width: 0; scroll-margin-top: 140px; }
.bib-search__count { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; min-width: 0; }
.bib-search__count strong { font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; }
.bib-search__count span { font-size: 12px; overflow-wrap: anywhere; }
.bib-search__tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.bib-search__selected { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }

.bib-facets { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; }
.bib-facet { min-width: 0; padding-top: 8px; border-top: 1px solid var(--bib-border); }
.bib-facet:first-child { padding-top: 0; border-top: 0; }
.bib-facet__head { display: flex; align-items: center; justify-content: space-between; gap: 4px; min-width: 0; }
.bib-facet__toggle { display: flex; flex: 1; align-items: center; gap: 6px; min-width: 0; padding: 4px 2px; border: 0; border-radius: 6px; background: none; color: var(--bib-text); font-size: 12px; font-weight: 600; text-align: left; cursor: pointer; }
.bib-facet__toggle > .bib-icon { margin-left: auto; color: var(--bib-text-muted); }
.bib-facet__name { min-width: 0; overflow-wrap: break-word; }
.bib-facet__head > .bib-icon-button { margin-right: -4px; }
.bib-facet__badge { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--bib-accent); color: var(--bib-on-accent); font-size: 10px; font-weight: 600; }
.bib-facet__values { display: grid; gap: 1px; margin: 4px 0 2px; }
.bib-facet__value { display: grid; grid-template-columns: 16px minmax(0, 1fr) auto; align-items: center; gap: 8px; width: 100%; padding: 5px 6px; border: 0; border-radius: 7px; background: transparent; color: var(--bib-text); font-size: 12px; line-height: 1.4; text-align: left; cursor: pointer; transition: background-color 120ms ease; }
.bib-facet__value:hover { background: var(--bib-surface-subtle); }
.bib-facet__value.is-selected { background: var(--bib-accent-soft); color: var(--bib-accent); font-weight: 500; }
.bib-facet__value.is-selected .bib-check { border-color: var(--bib-accent); background: var(--bib-accent); color: var(--bib-on-accent); }
.bib-facet__label { min-width: 0; overflow-wrap: anywhere; }
.bib-facet__count { color: var(--bib-text-muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.bib-facet__more { margin: 2px 0 0 4px; }

/* ------------------------------------------------------------------------------------------------ 10 hits and covers */
.bib-hits { display: grid; gap: 10px; min-width: 0; transition: opacity 150ms ease; }
.bib-hits.is-refreshing { opacity: .55; }
.bib-hit { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: 14px; min-width: 0; padding: 14px; border: 1px solid var(--bib-border); border-radius: var(--bib-radius); background: var(--bib-surface); box-shadow: var(--bib-card-shadow); transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease; }
.bib-hit:hover { border-color: color-mix(in srgb, var(--bib-accent) 26%, var(--bib-border)); box-shadow: 0 8px 22px #2e29250e, 0 1px 2px #2e292506; }
.bib-hit--skeleton { grid-template-columns: auto minmax(0, 1fr); }
.bib-hit__body { display: grid; gap: 4px; min-width: 0; }
.bib-hit__eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; color: color-mix(in srgb, var(--bib-gold) 72%, var(--bib-text)); font-size: 11px; font-weight: 500; }
.bib-hit__title { font-size: 15px; font-weight: 600; line-height: 1.4; }
.bib-hit__open { padding: 0; border: 0; background: none; color: var(--bib-text); font: inherit; text-align: left; overflow-wrap: anywhere; cursor: pointer; }
.bib-hit__open:hover { color: var(--bib-accent); text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--bib-accent) 35%, transparent); text-underline-offset: 3px; }
.bib-hit__subtitle { color: var(--bib-text-muted); font-size: 12.5px; overflow-wrap: anywhere; }
.bib-hit__meta { color: var(--bib-text-muted); font-size: 12px; overflow-wrap: anywhere; }
.bib-hit__sep { color: var(--bib-text-muted); }
.bib-hit__authors { color: var(--bib-text); }
.bib-hit .bib-chips { margin-top: 4px; }
.bib-hit__chevron { display: grid; place-items: center; align-self: center; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--bib-text-muted); cursor: pointer; }
.bib-hit:hover .bib-hit__chevron { background: var(--bib-accent-soft); color: var(--bib-accent); }

.bib-cover { --bib-cover-ink: var(--bib-accent); position: relative; display: grid; flex: none; place-items: center; width: 56px; height: 78px; overflow: hidden; border-radius: 4px 8px 8px 4px; background: radial-gradient(ellipse at top right, #ffffff2e, transparent 60%), linear-gradient(155deg, color-mix(in srgb, var(--bib-cover-ink) 78%, #fff), var(--bib-cover-ink)); color: #fff; box-shadow: inset 0 1px #ffffff33, 0 3px 8px #2e292522; }
.bib-cover__spine { position: absolute; top: 0; bottom: 0; left: 0; width: 5px; background: linear-gradient(var(--bib-gold), color-mix(in srgb, var(--bib-gold) 55%, #000)); }
.bib-cover__initial { padding-left: 4px; font-size: 22px; font-weight: 600; line-height: 1; text-shadow: 0 1px 2px #00000033; }
.bib-cover__type { position: absolute; right: 5px; bottom: 5px; display: grid; opacity: .82; }
.bib-cover--small { width: 38px; height: 52px; border-radius: 3px 6px 6px 3px; }
.bib-cover--small .bib-cover__spine { width: 4px; }
.bib-cover--small .bib-cover__initial { font-size: 15px; }
.bib-cover--small .bib-cover__type { right: 3px; bottom: 3px; }
.bib-cover--large { width: 104px; height: 146px; border-radius: 5px 11px 11px 5px; }
.bib-cover--large .bib-cover__spine { width: 7px; }
.bib-cover--large .bib-cover__initial { font-size: 42px; }
.bib-cover--large .bib-cover__type { right: 8px; bottom: 8px; }
.bib-cover--type-2 { --bib-cover-ink: color-mix(in srgb, var(--bib-accent) 58%, var(--bib-gold)); }
.bib-cover--type-3 { --bib-cover-ink: var(--bib-ink-graphite); }
.bib-cover--type-4 { --bib-cover-ink: var(--bib-info); }
.bib-cover--type-5 { --bib-cover-ink: var(--bib-ink-umber); }
.bib-cover--type-6 { --bib-cover-ink: var(--bib-ink-plum); }
.bib-cover--type-7 { --bib-cover-ink: color-mix(in srgb, var(--bib-accent) 55%, var(--bib-info)); }
.bib-cover--type-8 { --bib-cover-ink: var(--bib-ink-slate); }

.bib-pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px; padding-top: 4px; }
.bib-pager__step { display: inline-flex; align-items: center; gap: 4px; min-height: 32px; padding: 0 10px; border: 1px solid var(--bib-border); border-radius: 8px; background: var(--bib-surface); color: var(--bib-text); font-size: 12px; font-weight: 500; cursor: pointer; }
.bib-pager__step:hover { background: var(--bib-accent-soft); color: var(--bib-accent); }
.bib-pager__step:disabled { opacity: .45; cursor: default; pointer-events: none; }
.bib-pager__pages { display: flex; flex-wrap: wrap; gap: 4px; }
.bib-pager__page { justify-content: center; min-width: 32px; height: 32px; padding: 0 8px; border: 1px solid var(--bib-border); border-radius: 8px; background: var(--bib-surface); color: var(--bib-text); font-size: 12px; font-weight: 500; font-variant-numeric: tabular-nums; cursor: pointer; }
.bib-pager__page:hover { background: var(--bib-accent-soft); color: var(--bib-accent); }
.bib-pager__page.is-current { border-color: var(--bib-accent); background: var(--bib-accent); color: var(--bib-on-accent); cursor: default; }
.bib-pager__gap { align-self: center; padding: 0 2px; color: var(--bib-text-muted); }
.bib-pager__summary { display: none; color: var(--bib-text-muted); font-size: 12px; font-variant-numeric: tabular-nums; }

/* ------------------------------------------------------------------------------------- 11 overlays: drawer and modal */
.bib-overlay { position: fixed; inset: 0; z-index: 1300; display: flex; align-items: center; justify-content: center; padding: 16px; }
.bib-overlay__backdrop { position: absolute; inset: 0; background: #25211d66; backdrop-filter: blur(2px); animation: bib-fade 160ms ease-out; }
.bib-overlay--drawer { align-items: stretch; justify-content: flex-end; padding: 0; }
.bib-drawer { position: relative; display: grid; grid-template-rows: auto minmax(0, 1fr); width: min(780px, 100vw); height: 100%; outline: none; background: var(--bib-surface-subtle); box-shadow: -14px 0 44px #2e29252e; animation: bib-slide 220ms cubic-bezier(.2, .7, .2, 1); }
.bib-drawer__bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px 10px 16px; border-bottom: 1px solid var(--bib-border); background: var(--bib-surface); }
.bib-drawer__label { display: inline-flex; align-items: center; gap: 7px; color: var(--bib-text-muted); font-size: 12.5px; font-weight: 600; }
.bib-drawer__label .bib-icon { color: var(--bib-accent); }
.bib-drawer__body { min-height: 0; padding: 16px; overflow-y: auto; overscroll-behavior: contain; }
.bib-modal { position: relative; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; width: min(560px, 100%); max-height: calc(100dvh - 32px); outline: none; border: 1px solid var(--bib-border); border-radius: 15px; background: var(--bib-surface); box-shadow: 0 24px 60px #2e292530, 0 2px 8px #2e29250c; animation: bib-pop 180ms cubic-bezier(.2, .7, .2, 1); }
.bib-modal--wide { width: min(840px, 100%); }
.bib-modal__header { display: flex; align-items: flex-start; gap: 12px; padding: 16px 14px 13px 18px; border-bottom: 1px solid var(--bib-border); }
.bib-modal__emblem { display: grid; flex: none; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: linear-gradient(135deg, color-mix(in srgb, var(--bib-accent) 82%, #000), var(--bib-accent)); color: var(--bib-on-accent); box-shadow: inset 0 1px #ffffff2a, 0 3px 9px color-mix(in srgb, var(--bib-accent) 22%, transparent); }
.bib-modal__emblem .bib-icon { color: var(--bib-gold); }
.bib-modal__heading { display: grid; flex: 1; gap: 2px; min-width: 0; }
.bib-modal__heading h2 { color: var(--bib-text); font-size: 16px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.bib-modal__heading p { color: var(--bib-text-muted); font-size: 12px; }
.bib-modal__heading .bib-eyebrow { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bib-modal__body { display: grid; align-content: start; gap: 12px; min-height: 0; padding: 16px 18px; overflow-y: auto; overscroll-behavior: contain; }
.bib-modal__footer { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; padding: 12px 18px; border-top: 1px solid var(--bib-border); border-radius: 0 0 15px 15px; background: var(--bib-surface-subtle); }
.bib-modal__footer:empty { display: none; }

/* ---------------------------------------------------------------------------------------------------- 12 record view */
.bib-record { display: grid; gap: 14px; min-width: 0; }
.bib-record__head { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 18px; min-width: 0; padding: 18px; border: 1px solid var(--bib-border); border-radius: var(--bib-radius); background: radial-gradient(ellipse at top right, var(--bib-gold-soft), transparent 50%), linear-gradient(110deg, var(--bib-surface) 55%, var(--bib-accent-soft)); box-shadow: var(--bib-card-shadow); }
.bib-record__headline { display: grid; align-content: start; gap: 6px; min-width: 0; }
.bib-record__eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; color: color-mix(in srgb, var(--bib-gold) 72%, var(--bib-text)); font-size: 11.5px; font-weight: 500; }
.bib-record__title { color: var(--bib-text); font-size: clamp(18px, 2vw, 22px); font-weight: 600; letter-spacing: -.2px; line-height: 1.35; overflow-wrap: anywhere; }
.bib-record__subtitle { color: var(--bib-text-muted); font-size: 14px; overflow-wrap: anywhere; }
.bib-record__authors { color: var(--bib-text); font-size: 13px; overflow-wrap: anywhere; }
.bib-record__actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.bib-record__layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; align-items: start; gap: 14px; min-width: 0; }
.bib-record__main, .bib-record__aside { display: grid; align-content: start; gap: 14px; min-width: 0; }
/* One column (the drawer, narrow screens): the request card first, the shelf strip last. */
.bib-record--embedded .bib-record__layout { display: flex; flex-direction: column; align-items: stretch; }
.bib-record--embedded :is(.bib-record__main, .bib-record__aside) { display: contents; }
.bib-record--embedded .bib-request { order: -1; }
.bib-record__subjects { display: grid; gap: 6px; }
.bib-record__prose { display: grid; gap: 4px; }
.bib-record__prose p { font-size: 13px; line-height: 1.7; white-space: pre-line; overflow-wrap: anywhere; }
.bib-facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px 18px; }
.bib-facts > div { display: grid; align-content: start; gap: 2px; min-width: 0; }
.bib-facts dd.is-warning { color: var(--bib-warning); font-weight: 500; }
.bib-facts dt { color: var(--bib-text-muted); font-size: 11px; }
.bib-facts dd { color: var(--bib-text); font-size: 13px; overflow-wrap: anywhere; }
.bib-holdings { display: grid; gap: 10px; }
.bib-holding { overflow: hidden; border: 1px solid var(--bib-border); border-radius: 10px; }
.bib-holding__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; padding: 9px 12px; border-bottom: 1px solid var(--bib-border); background: var(--bib-surface-subtle); }
.bib-holding__place { display: inline-flex; align-items: center; gap: 6px; min-width: 0; font-size: 12.5px; overflow-wrap: anywhere; }
.bib-holding__place .bib-icon { color: var(--bib-accent); }
.bib-holding__call { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 6px; color: var(--bib-text); font-size: 12.5px; }
.bib-items { display: grid; }
.bib-item { display: grid; grid-template-columns: minmax(90px, .8fr) minmax(110px, 1fr) minmax(0, 1.4fr); align-items: center; gap: 6px 12px; padding: 9px 12px; border-top: 1px solid var(--bib-border); }
.bib-item:first-child { border-top: 0; }
.bib-item__copy { font-size: 12.5px; font-weight: 500; overflow-wrap: break-word; }
.bib-item__loan { color: var(--bib-text-muted); font-size: 12px; overflow-wrap: break-word; }
.bib-item__status { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; font-size: 11.5px; }
.bib-item__note { grid-column: 1 / -1; color: var(--bib-text-muted); font-size: 11.5px; }
.bib-files { display: grid; gap: 8px; container: bib-files / inline-size; }
.bib-file { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 4px 10px; padding: 9px 10px; border: 1px solid var(--bib-border); border-radius: 10px; background: var(--bib-surface); }
.bib-file.is-locked { background: var(--bib-surface-subtle); }
.bib-file__icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: var(--bib-accent-soft); color: var(--bib-accent); }
.bib-file.is-locked .bib-file__icon { background: var(--bib-surface); color: var(--bib-text-muted); }
.bib-file__copy { display: grid; gap: 1px; min-width: 0; }
.bib-file__copy strong { font-size: 12.5px; font-weight: 500; overflow-wrap: anywhere; }
.bib-file__copy span { font-size: 11px; overflow-wrap: break-word; }
.bib-file__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; min-width: 0; }
/* A narrow list (a phone, a reading card in a side column): the actions go under the file name. */
@container bib-files (max-width: 460px) {
    .bib-file { grid-template-columns: auto minmax(0, 1fr); }
    .bib-file__actions { grid-column: 2; justify-self: start; }
}
.bib-files--compact { gap: 6px; margin-top: 4px; }
.bib-files--compact .bib-file { padding: 6px 8px; }
.bib-files--compact .bib-file__icon { width: 28px; height: 28px; }
.bib-request { gap: 10px; }
.bib-request__queue { display: flex; align-items: center; gap: 6px; color: var(--bib-warning); font-size: 12px; }
.bib-shelf__strip { display: grid; gap: 6px; max-height: 440px; overflow-y: auto; overscroll-behavior: contain; }
/* More entries above / below (biblio.js watchOverflow): the strip fades out on that side. */
.bib-shelf__strip[data-more-end] { mask-image: linear-gradient(to bottom, #000 calc(100% - 44px), transparent); }
.bib-shelf__strip[data-more-start] { mask-image: linear-gradient(to top, #000 calc(100% - 44px), transparent); }
.bib-shelf__strip[data-more-start][data-more-end] { mask-image: linear-gradient(to bottom, transparent, #000 44px, #000 calc(100% - 44px), transparent); }
.bib-shelf__entry button { display: grid; gap: 2px; width: 100%; padding: 8px 10px; border: 1px solid var(--bib-border); border-radius: 9px; background: var(--bib-surface); color: var(--bib-text); text-align: left; cursor: pointer; transition: border-color 150ms ease, background-color 150ms ease; }
.bib-shelf__entry button:hover { border-color: color-mix(in srgb, var(--bib-accent) 26%, var(--bib-border)); background: var(--bib-accent-soft); }
.bib-shelf__entry button:disabled { cursor: default; }
.bib-shelf__entry.is-anchor button { border-color: color-mix(in srgb, var(--bib-gold) 55%, var(--bib-border)); background: var(--bib-gold-soft); }
.bib-shelf__entry strong { font-size: 12px; font-weight: 500; overflow-wrap: anywhere; }
.bib-shelf__entry .bib-muted { font-size: 11px; overflow-wrap: anywhere; }
.bib-shelf__call { color: color-mix(in srgb, var(--bib-gold) 70%, var(--bib-text)); font-size: 11px; }

/* --------------------------------------------------------------------------------------------------- 13 my account */
.bib-account { display: grid; gap: 14px; min-width: 0; }
.bib-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.bib-kpis--five { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.bib-kpi { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto; align-items: center; column-gap: 11px; min-width: 0; padding: 12px 14px; border: 1px solid var(--bib-border); border-radius: var(--bib-radius); background: var(--bib-surface); box-shadow: var(--bib-card-shadow); }
.bib-kpi__icon { display: grid; grid-row: span 2; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: var(--bib-accent-soft); color: var(--bib-accent); }
.bib-kpi__label { color: var(--bib-text-muted); font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
.bib-kpi__value { color: var(--bib-text); font-size: 19px; font-weight: 600; line-height: 1.25; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.bib-kpi__sub { grid-column: -2 / -1; color: var(--bib-warning); font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
.bib-kpis--five .bib-kpi { grid-template-columns: minmax(0, 1fr); }
/* Five tiles as 3 + 2 (no tile alone on a row) wherever they do not fit on one row. */
@media (max-width: 1180px) {
    .bib-kpis.bib-kpis--five { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .bib-kpis--five > :nth-child(-n + 3) { grid-column: span 2; }
    .bib-kpis--five > :nth-child(n + 4) { grid-column: span 3; }
}
.bib-kpi--brand { border-color: var(--bib-accent); background: radial-gradient(ellipse at top right, #ffffff1c, transparent 70%), linear-gradient(120deg, color-mix(in srgb, var(--bib-accent) 82%, #000), var(--bib-accent)); box-shadow: inset 0 1px #ffffff26, 0 4px 12px color-mix(in srgb, var(--bib-accent) 20%, transparent); }
.bib-kpi--brand .bib-kpi__icon { border: 1px solid #ffffff2a; background: #ffffff14; color: var(--bib-gold); }
.bib-kpi--brand .bib-kpi__label, .bib-kpi--brand .bib-kpi__value { color: var(--bib-on-accent); }
.bib-kpi--danger .bib-kpi__icon { background: var(--bib-danger-soft); color: var(--bib-danger); }
.bib-kpi--danger .bib-kpi__value { color: var(--bib-danger); }
.bib-kpi--success .bib-kpi__icon { background: var(--bib-success-soft); color: var(--bib-success); }
.bib-kpi--success .bib-kpi__value { color: var(--bib-success); }
.bib-kpi--warning .bib-kpi__icon { background: var(--bib-warning-soft); color: var(--bib-warning); }
.bib-kpi--warning .bib-kpi__value { color: var(--bib-warning); }
.bib-account__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 14px; }
.bib-blocks { display: grid; gap: 4px; margin: 4px 0; }
.bib-blocks li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; font-size: 12.5px; }
.bib-rows { display: grid; }
.bib-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 11px 0; border-top: 1px solid var(--bib-border); }
.bib-row:first-child { padding-top: 2px; border-top: 0; }
.bib-rows--compact .bib-row { padding: 8px 0; }
.bib-rows__subhead { display: flex; align-items: center; gap: 8px; margin-top: 4px; padding-top: 10px; border-top: 1px solid var(--bib-border); color: var(--bib-text-muted); font-size: 11.5px; font-weight: 600; }
.bib-rows__subhead > .bib-icon { color: var(--bib-danger); }
.bib-row__main { display: grid; gap: 3px; min-width: 0; }
.bib-row__title { padding: 0; border: 0; background: none; color: var(--bib-text); font-size: 13px; font-weight: 600; line-height: 1.4; text-align: left; overflow-wrap: anywhere; cursor: pointer; }
.bib-row__title:hover { color: var(--bib-accent); }
.bib-row__title--static, .bib-row__title--static:hover { color: var(--bib-text); cursor: default; }
.bib-row__meta { color: var(--bib-text-muted); font-size: 12px; overflow-wrap: anywhere; }
.bib-row__chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 3px; }
.bib-row__side { display: grid; justify-items: end; gap: 3px; }
.bib-row__note { max-width: 190px; color: var(--bib-text-muted); font-size: 11px; line-height: 1.45; text-align: right; }
.bib-row__amount strong { font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.bib-row__amount .bib-muted { font-size: 11px; white-space: nowrap; }
.bib-total { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 13px; border: 1px solid color-mix(in srgb, var(--bib-gold) 32%, var(--bib-border)); border-radius: 10px; background: var(--bib-gold-soft); }
.bib-total > div { display: grid; gap: 1px; }
.bib-total > div > span:first-child { font-size: 12.5px; font-weight: 600; }
.bib-total > div > .bib-muted { font-size: 11px; }
.bib-total > strong { font-size: 17px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.bib-total__note { font-size: 11.5px; line-height: 1.5; }
.bib-switch-row { display: grid; gap: 6px; padding-bottom: 4px; }
.bib-switch-row > .bib-muted { font-size: 11.5px; line-height: 1.5; }
.bib-switch { display: inline-flex; align-items: center; justify-self: start; gap: 10px; padding: 2px 0; border: 0; border-radius: 999px; background: none; color: var(--bib-text); font-size: 12.5px; font-weight: 500; cursor: pointer; }
.bib-switch:disabled { opacity: .6; cursor: default; }
.bib-switch__track { position: relative; flex: none; width: 36px; height: 20px; border-radius: 999px; background: color-mix(in srgb, var(--bib-text) 18%, var(--bib-border)); transition: background-color 150ms ease; }
.bib-switch__thumb { position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px #2e292540; transition: transform 160ms ease; }
.bib-switch.is-on .bib-switch__track { background: var(--bib-accent); }
.bib-switch.is-on .bib-switch__thumb { transform: translateX(16px); }

/* ---------------------------------------------------------------------------------------------- 14 library card */
.bib-cardpanel { display: grid; gap: 14px; min-width: 0; }
.bib-cardpanel__layout { display: grid; grid-template-columns: minmax(0, 430px) minmax(0, 1fr); align-items: start; gap: 14px; }
.bib-cardpanel__details { gap: 14px; }
.bib-libcard { position: relative; display: grid; gap: 14px; min-width: 0; padding: 18px; overflow: hidden; border-radius: 17px; background: radial-gradient(ellipse at top right, color-mix(in srgb, var(--bib-gold) 34%, transparent), transparent 55%), linear-gradient(135deg, color-mix(in srgb, var(--bib-accent) 74%, #000), var(--bib-accent)); color: var(--bib-on-accent); box-shadow: inset 0 1px #ffffff2a, 0 12px 32px color-mix(in srgb, var(--bib-accent) 26%, transparent); }
.bib-libcard::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, transparent, var(--bib-gold), transparent); }
.bib-libcard.is-void { background: linear-gradient(135deg, var(--bib-ink-graphite), var(--bib-ink-slate)); box-shadow: 0 8px 24px #2e292526; }
.bib-libcard__head { display: flex; align-items: center; gap: 12px; min-width: 0; }
.bib-libcard__head > div { display: grid; min-width: 0; }
.bib-libcard__mark { display: grid; flex: none; place-items: center; width: 42px; height: 42px; border: 1px solid #ffffff2a; border-radius: 12px; background: #ffffff16; color: var(--bib-gold); }
.bib-libcard__eyebrow { color: color-mix(in srgb, var(--bib-gold) 75%, #fff); font-size: 11px; font-weight: 500; }
.bib-libcard__name { font-size: 17px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.bib-libcard__group { font-size: 12px; opacity: .85; overflow-wrap: anywhere; }
.bib-libcard__codes { display: grid; grid-template-columns: 132px minmax(0, 1fr); align-items: stretch; gap: 12px; }
.bib-libcard__qr { display: grid; place-items: center; margin: 0; padding: 8px; border-radius: 12px; background: #fff; }
.bib-libcard__qr svg { display: block; width: 100%; height: auto; }
.bib-libcard__barcode { display: grid; align-items: center; margin: 0; padding: 12px; border-radius: 12px; background: #fff; }
.bib-libcard__barcode svg { display: block; width: 100%; height: 72px; }
.bib-libcard__void { display: grid; justify-items: center; gap: 6px; padding: 18px 12px; border-radius: 12px; background: #ffffff12; text-align: center; }
.bib-libcard__void span { font-size: 12px; opacity: .85; }
.bib-libcard__foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; padding-top: 12px; border-top: 1px solid #ffffff26; }
.bib-libcard__label { display: block; font-size: 11px; opacity: .8; }
.bib-libcard__number { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 18px; font-weight: 600; letter-spacing: .08em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.bib-libcard .bib-chip { border-color: #ffffff38; background: #ffffff1c; color: var(--bib-on-accent); }
.bib-libcard .bib-chip--warning { border-color: color-mix(in srgb, var(--bib-gold) 70%, transparent); background: color-mix(in srgb, var(--bib-gold) 34%, transparent); color: #fff; }
.bib-scan { position: fixed; inset: 0; z-index: 1350; display: grid; place-items: center; padding: 24px 16px; overflow-y: auto; outline: none; background: #ffffff; color: #1d2025; animation: bib-fade 160ms ease-out; }
.bib-scan__close { position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 46px; height: 46px; padding: 0; border: 1px solid #dddddd; border-radius: 50%; background: #ffffff; color: #1d2025; cursor: pointer; }
.bib-scan__content { display: grid; justify-items: center; gap: 16px; width: min(560px, 100%); }
.bib-scan__name { font-size: 18px; font-weight: 600; text-align: center; }
.bib-scan__qr { width: min(320px, 78vw); margin: 0; }
.bib-scan__qr svg { display: block; width: 100%; height: auto; }
.bib-scan__barcode { width: 100%; margin: 0; }
.bib-scan__barcode svg { display: block; width: 100%; height: 110px; }
.bib-scan__number { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: clamp(20px, 6vw, 28px); font-weight: 600; letter-spacing: .1em; }
.bib-scan__hint { color: #555a62; font-size: 13px; }

/* ------------------------------------------------------------------------------------------- 15 literature (students) */
.bib-literature { display: grid; gap: 14px; min-width: 0; }
.bib-literature__layout { display: grid; grid-template-columns: 280px minmax(0, 1fr); align-items: start; gap: 14px; }
.bib-literature__courses { gap: 10px; padding: 12px; }
.bib-literature__summary { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid color-mix(in srgb, var(--bib-gold) 30%, var(--bib-border)); border-radius: 10px; background: var(--bib-gold-soft); }
.bib-literature__summary .bib-kpi__icon { grid-row: auto; background: var(--bib-surface); color: color-mix(in srgb, var(--bib-gold) 70%, var(--bib-text)); }
.bib-literature__summary > div { display: grid; }
.bib-literature__summary strong { font-size: 20px; font-weight: 600; line-height: 1.2; font-variant-numeric: tabular-nums; }
.bib-courses { display: grid; gap: 3px; }
.bib-course { display: grid; gap: 3px; width: 100%; padding: 9px 10px; border: 1px solid transparent; border-radius: 9px; background: transparent; color: var(--bib-text); text-align: left; cursor: pointer; transition: background-color 150ms ease, border-color 150ms ease; }
.bib-course:hover { background: var(--bib-surface-subtle); }
.bib-course.is-active { border-color: color-mix(in srgb, var(--bib-accent) 22%, var(--bib-border)); background: var(--bib-accent-soft); }
.bib-course__title { font-size: 12.5px; font-weight: 500; line-height: 1.45; overflow-wrap: anywhere; }
.bib-course.is-active .bib-course__title { color: var(--bib-accent); font-weight: 600; }
.bib-course__meta { display: flex; flex-wrap: wrap; gap: 2px 10px; color: var(--bib-text-muted); font-size: 11px; }
.bib-course__required { color: var(--bib-accent); }
.bib-literature__list { gap: 14px; }
.bib-literature__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 10px 14px; padding-bottom: 12px; border-bottom: 1px solid var(--bib-border); }
.bib-literature__title { display: grid; gap: 2px; min-width: 0; }
.bib-literature__head h3 { font-size: 16px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.bib-literature__group { display: grid; gap: 8px; }
.bib-literature__group-title { display: flex; align-items: center; gap: 8px; }
.bib-literature__week { display: grid; gap: 6px; }
.bib-literature__week + .bib-literature__week { margin-top: 4px; }
.bib-literature__week-title { display: flex; margin: 0; align-items: center; gap: 8px; color: var(--bib-text-muted); font-size: 11.5px; font-weight: 600; letter-spacing: .01em; }
.bib-literature__week-title::after { content: ""; flex: 1; height: 1px; background: var(--bib-border); }
.bib-segment { display: inline-flex; flex: none; flex-wrap: wrap; max-width: 100%; gap: 3px; padding: 3px; border: 1px solid var(--bib-border); border-radius: 10px; background: var(--bib-surface-subtle); }
.bib-segment__option { display: inline-flex; align-items: center; gap: 5px; padding: 6px 11px; border: 0; border-radius: 7px; background: transparent; color: var(--bib-text-muted); font-size: 12px; font-weight: 500; white-space: nowrap; cursor: pointer; transition: background-color 120ms ease, color 120ms ease; }
.bib-segment__option:hover { color: var(--bib-accent); }
.bib-segment__option.is-active { background: var(--bib-surface); color: var(--bib-accent); box-shadow: 0 1px 3px #2e292517; }
/* A form choice that spans its row: equal options, a long label wraps inside its option instead of dropping to a new row. */
.bib-segment--fill { display: grid; grid-auto-columns: minmax(0, 1fr); grid-auto-flow: column; width: 100%; }
.bib-segment--fill .bib-segment__option { justify-content: center; min-height: 32px; white-space: normal; text-align: center; line-height: 1.3; }
.bib-readings { display: grid; gap: 8px; container: bib-readings / inline-size; }
/* One fixed column for the category chip, so titles line up across Required / Recommended / Additional. */
.bib-reading { display: grid; grid-template-columns: 8.75rem minmax(0, 1fr) auto; align-items: start; gap: 12px; padding: 11px 12px; border: 1px solid var(--bib-border); border-radius: 10px; background: var(--bib-surface); }
.bib-reading--compact { gap: 10px; padding: 8px 10px; }
.bib-reading--plain { grid-template-columns: minmax(0, 1fr) auto; }
/* The longest caption (ka „რეკომენდებული“) fits the column on one line; a category is never broken mid-word. */
.bib-reading__category { justify-self: start; margin-top: 1px; white-space: nowrap; overflow-wrap: normal; }
/* A narrow list (a phone, a side column): the chip above the title. */
@container bib-readings (max-width: 560px) {
    .bib-reading { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 10px; }
    .bib-reading__category { grid-column: 1 / -1; }
}
.bib-reading__body { display: grid; gap: 3px; min-width: 0; }
.bib-reading__title { padding: 0; border: 0; background: none; color: var(--bib-text); font-size: 13px; font-weight: 600; line-height: 1.45; text-align: left; text-decoration: none; overflow-wrap: anywhere; cursor: pointer; }
.bib-reading__title:hover { color: var(--bib-accent); }
.bib-reading__title--citation, .bib-reading__title--citation:hover { color: var(--bib-text); font-weight: 500; cursor: auto; }
.bib-reading__authors { color: var(--bib-text-muted); font-size: 12px; overflow-wrap: anywhere; }
.bib-reading__meta { display: flex; flex-wrap: wrap; gap: 2px 12px; color: var(--bib-text-muted); font-size: 11.5px; }
.bib-reading__note { display: flex; align-items: flex-start; gap: 6px; margin-top: 2px; padding: 6px 8px; border-radius: 8px; background: var(--bib-gold-soft); color: var(--bib-text); font-size: 12px; line-height: 1.5; }
.bib-reading__note .bib-icon { margin-top: 2px; color: color-mix(in srgb, var(--bib-gold) 70%, var(--bib-text)); }
.bib-reading__chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 3px; }
.bib-readingcard { display: grid; gap: 12px; min-width: 0; padding: 14px; border: 1px solid var(--bib-border); border-radius: var(--bib-radius); background: var(--bib-surface); box-shadow: var(--bib-card-shadow); }
.bib-readingcard--compact { padding: 12px; background: var(--bib-surface-subtle); box-shadow: none; }
.bib-readingcard--compact .bib-reading { background: var(--bib-surface); }
.bib-readingcard--inset { margin: 10px; border-color: color-mix(in srgb, var(--bib-accent) 16%, var(--bib-border)); background: var(--bib-surface-subtle); box-shadow: none; }
.bib-readingcard__head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.bib-readingcard__head > div { display: grid; min-width: 0; }
.bib-readingcard__head h3 { font-size: 14px; font-weight: 600; line-height: 1.4; }
.bib-readingcard__icon { display: grid; flex: none; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: var(--bib-gold-soft); color: color-mix(in srgb, var(--bib-gold) 70%, var(--bib-text)); }
.bib-readingcard__counts { display: flex; flex-wrap: wrap; gap: 5px; margin-left: auto; }
.bib-readingcard__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.bib-readingcard__foot:empty { display: none; }

/* -------------------------------------------------------------------------------------- 16 syllabus literature editor */
.bib-editor { display: grid; gap: 14px; min-width: 0; }
.bib-editor__list { gap: 14px; }
.bib-editor__list-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 14px; }
.bib-editor__list-head > div { display: grid; gap: 2px; min-width: 0; }
.bib-editor__list-head h3 { font-size: 17px; font-weight: 600; line-height: 1.4; }
.bib-editor__list-head p { font-size: 12.5px; }
.bib-editor__filter { min-width: min(260px, 100%); }
.bib-syllabi { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.bib-syllabus { display: grid; align-content: start; gap: 5px; width: 100%; height: 100%; padding: 13px 14px; border: 1px solid var(--bib-border); border-radius: var(--bib-radius); background: var(--bib-surface); color: var(--bib-text); text-align: left; cursor: pointer; box-shadow: 0 1px 3px #2e292506; transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease; }
.bib-syllabus:hover { border-color: color-mix(in srgb, var(--bib-accent) 28%, var(--bib-border)); box-shadow: 0 8px 22px #2e29250e; transform: translateY(-1px); }
.bib-syllabus__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px; }
.bib-syllabus__code { color: color-mix(in srgb, var(--bib-gold) 70%, var(--bib-text)); font-size: 11px; }
.bib-syllabus__title { font-size: 13.5px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.bib-syllabus > .bib-muted { font-size: 12px; overflow-wrap: anywhere; }
.bib-syllabus__stats { display: flex; flex-wrap: wrap; gap: 3px 12px; margin-top: 4px; color: var(--bib-text-muted); font-size: 11.5px; }
.bib-syllabus__stats strong { color: var(--bib-text); font-weight: 600; font-variant-numeric: tabular-nums; }
.bib-syllabus__stats .is-warning strong { color: var(--bib-warning); }
.bib-syllabus__stats .is-info strong { color: var(--bib-info); }
.bib-editor__detail { display: grid; gap: 12px; min-width: 0; }
.bib-editor__back { justify-self: start; }
.bib-editor__head { gap: 12px; }
.bib-editor__title { display: grid; gap: 2px; min-width: 0; }
.bib-editor__title h3 { font-size: 18px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.bib-editor__title > .bib-muted { font-size: 12px; }
.bib-editor__counts { display: flex; flex-wrap: wrap; gap: 6px; }
.bib-editor__toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding-top: 12px; border-top: 1px solid var(--bib-border); }
.bib-subtabs { display: flex; gap: 2px; overflow-x: auto; border-bottom: 1px solid var(--bib-border); scrollbar-width: none; }
.bib-subtabs::-webkit-scrollbar { display: none; }
.bib-subtabs[data-more-end] { mask-image: linear-gradient(to right, #000 calc(100% - 40px), transparent); }
.bib-subtabs[data-more-start] { mask-image: linear-gradient(to left, #000 calc(100% - 40px), transparent); }
.bib-subtabs[data-more-start][data-more-end] { mask-image: linear-gradient(to right, transparent, #000 40px, #000 calc(100% - 40px), transparent); }
.bib-subtab__short { display: none; }
.bib-subtab { display: inline-flex; flex: none; align-items: center; gap: 6px; margin-bottom: -1px; padding: 9px 12px; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--bib-text-muted); font-size: 12.5px; font-weight: 500; white-space: nowrap; cursor: pointer; }
.bib-subtab:hover { color: var(--bib-accent); }
.bib-subtab.is-active { border-bottom-color: var(--bib-gold); color: var(--bib-accent); font-weight: 600; }
.bib-editor-items { display: grid; }
.bib-editor-item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: 12px; padding: 12px 0; border-top: 1px solid var(--bib-border); }
.bib-editor-item:first-child { padding-top: 2px; border-top: 0; }
.bib-editor-item__order { display: grid; gap: 4px; }
.bib-editor-item__body { display: grid; gap: 4px; min-width: 0; }
.bib-editor-item__chips { display: flex; flex-wrap: wrap; gap: 5px; }
.bib-editor-item__title { padding: 0; border: 0; background: none; color: var(--bib-text); font-size: 13.5px; font-weight: 600; line-height: 1.45; text-align: left; overflow-wrap: anywhere; cursor: pointer; }
.bib-editor-item__title:hover { color: var(--bib-accent); }
.bib-editor-item__title--citation, .bib-editor-item__title--citation:hover { color: var(--bib-text); font-weight: 500; cursor: auto; }
.bib-editor-item__body > .bib-muted { font-size: 12px; overflow-wrap: anywhere; }
.bib-editor-item__body > .bib-muted:empty, .bib-editor-item__meta:empty { display: none; }
.bib-editor-item__meta { color: var(--bib-text-muted); font-size: 11.5px; }
.bib-editor-item__review { display: flex; align-items: flex-start; gap: 6px; padding: 6px 8px; border-radius: 8px; background: var(--bib-info-soft); color: var(--bib-info); font-size: 12px; line-height: 1.5; }
.bib-editor-item__review .bib-icon { margin-top: 2px; }
.bib-editor-item__review.is-rejected { background: var(--bib-danger-soft); color: var(--bib-danger); }
.bib-editor-item__actions { display: flex; gap: 2px; }
.bib-picker { display: grid; gap: 6px; }
.bib-picker__row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--bib-border); border-radius: 10px; background: var(--bib-surface); }
.bib-picker__icon { display: grid; flex: none; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--bib-accent-soft); color: var(--bib-accent); }
.bib-picker__copy { display: grid; gap: 3px; min-width: 0; }
.bib-picker__copy strong { font-size: 13px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.bib-picker__copy > .bib-muted { font-size: 12px; overflow-wrap: anywhere; }
.bib-lookup { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 8px; }
.bib-lookup .bib-button { min-height: 38px; }
.bib-lookup__result { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px; padding: 12px; border: 1px solid var(--bib-border); border-radius: 12px; background: var(--bib-surface-subtle); }
.bib-lookup__result > div { display: grid; align-content: start; gap: 4px; min-width: 0; }
.bib-lookup__result strong { font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.bib-lookup__result .bib-callout { margin-top: 4px; }
.bib-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; }
.bib-form__wide, .bib-form > .bib-callout, .bib-form__record { grid-column: 1 / -1; }
.bib-form__record { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--bib-border); border-radius: 10px; background: var(--bib-surface-subtle); }
.bib-form__record > div { display: grid; gap: 1px; min-width: 0; }
.bib-form__record strong { font-size: 13px; overflow-wrap: anywhere; }
.bib-form__record .bib-muted { font-size: 12px; }
.bib-coverage { display: grid; gap: 12px; min-width: 0; }
.bib-table-wrap { overflow-x: auto; border: 1px solid var(--bib-border); border-radius: 10px; }
.bib-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.bib-table th { padding: 8px 10px; border-bottom: 1px solid var(--bib-border); background: var(--bib-surface-subtle); color: var(--bib-text-muted); font-size: 11px; font-weight: 600; text-align: left; white-space: nowrap; }
.bib-table td { padding: 9px 10px; border-top: 1px solid var(--bib-border); vertical-align: middle; }
.bib-table tbody tr:first-child td { border-top: 0; }
.bib-table tr.is-gap td { background: var(--bib-danger-soft); }
.bib-table tr.is-warning td { background: var(--bib-warning-soft); }
.bib-table td.is-over { color: var(--bib-warning); font-weight: 600; }
.bib-table__title { display: block; margin-bottom: 3px; font-weight: 500; overflow-wrap: anywhere; }
.bib-num { text-align: right; font-variant-numeric: tabular-nums; }
.bib-table th.bib-num { text-align: right; }

/* ---------------------------------------------------------------------------------------------------- 17 responsive */
@media (max-width: 1180px) {
    .bib-account__grid { grid-template-columns: minmax(0, 1fr); }
    .bib-record__layout { grid-template-columns: minmax(0, 1fr) 270px; }
}

@media (max-width: 900px) {
    .bib-search__layout, .bib-literature__layout, .bib-cardpanel__layout { grid-template-columns: minmax(0, 1fr); }
    .bib-record__layout { display: flex; flex-direction: column; align-items: stretch; }
    .bib-record__main, .bib-record__aside { display: contents; }
    .bib-request { order: -1; }
    .bib-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bib-search__filters-open { display: inline-flex; }
    .bib-search__filters { position: fixed; inset: 0; z-index: 1300; display: none; }
    .bib-search__filters.is-open { display: block; }
    .bib-search__filters-sheet { position: absolute; top: 0; right: 0; bottom: 0; z-index: 1; width: min(380px, 92vw); align-content: start; padding: 14px; overflow-y: auto; border-radius: 15px 0 0 15px; box-shadow: -14px 0 44px #2e29252e; animation: bib-slide 200ms ease-out; }
    .bib-search__filters-backdrop { position: absolute; inset: 0; display: block; padding: 0; border: 0; background: #25211d66; }
    .bib-search__filters-close { display: inline-grid; }
    .bib-search__filters-foot { position: sticky; bottom: -14px; display: block; margin: 0 -14px -14px; padding: 12px 14px; border-top: 1px solid var(--bib-border); background: var(--bib-surface); }
    .bib-courses { grid-auto-columns: minmax(190px, 72%); grid-auto-flow: column; overflow-x: auto; padding-bottom: 4px; scroll-snap-type: x proximity; }
    .bib-course { scroll-snap-align: start; border-color: var(--bib-border); }
}

@media (max-width: 640px) {
    .bib-panel { padding: 13px; }
    .bib-search__bar { padding: 12px; }
    .bib-search--hero .bib-search__bar { padding: 16px; }
    /* The cover beside the title (not alone on its own row), so the request card stays on the first screen. */
    .bib-record__head { grid-template-columns: 56px minmax(0, 1fr); gap: 12px; padding: 14px; }
    .bib-record__head .bib-cover--large { width: 56px; height: 78px; border-radius: 4px 8px 8px 4px; }
    .bib-record__head .bib-cover--large .bib-cover__spine { width: 5px; }
    .bib-record__head .bib-cover--large .bib-cover__initial { font-size: 22px; }
    .bib-record__head .bib-cover--large .bib-cover__type { right: 5px; bottom: 5px; }
    /* A copy: the copy and its loan type on one line (the loan type wraps to its own line when long), the status under them. */
    .bib-item { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
    .bib-item__status, .bib-item__note { flex-basis: 100%; justify-content: flex-start; }
    .bib-overlay { align-items: flex-end; padding: 0; }
    .bib-overlay--drawer { align-items: stretch; }
    .bib-modal, .bib-modal--wide { width: 100%; max-height: 92dvh; border-radius: 16px 16px 0 0; }
    .bib-modal__footer { border-radius: 0; }
    .bib-modal__footer .bib-button { flex: 1 1 auto; }
    .bib-editor-item { grid-template-columns: auto minmax(0, 1fr); }
    .bib-editor-item__actions { grid-column: 2; justify-self: start; margin-left: -8px; }
    .bib-pager__pages { display: none; }
    .bib-pager__summary { display: inline; }
    .bib-pager__step-label { display: none; }
    .bib-table thead { display: none; }
    .bib-table tr { display: grid; gap: 2px; padding: 9px 10px; border-top: 1px solid var(--bib-border); }
    .bib-table tbody tr:first-child { border-top: 0; }
    .bib-table td { display: flex; justify-content: space-between; gap: 10px; padding: 2px 0; border-top: 0; text-align: right; }
    .bib-table td::before { content: attr(data-label); color: var(--bib-text-muted); font-size: 11px; font-weight: 400; text-align: left; }
    .bib-table td:first-child { display: grid; justify-items: start; text-align: left; }
    .bib-table td:first-child::before { content: none; }
    /* One tint per card, not a band per cell. */
    .bib-table tr.is-gap { background: var(--bib-danger-soft); }
    .bib-table tr.is-warning { background: var(--bib-warning-soft); }
    .bib-table tr.is-gap td, .bib-table tr.is-warning td { background: transparent; }
}

@media (max-width: 480px) {
    .bib-kpi { grid-template-columns: minmax(0, 1fr); padding: 10px 12px; }
    .bib-kpi__icon { display: none; }
    .bib-kpi__label { overflow-wrap: normal; }
    /* Five coverage tiles on a phone: the student count on its own row, the four required-literature counts 2 x 2 (a third of
       the row is too narrow for "სავალდებულო"). */
    .bib-kpis.bib-kpis--five { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bib-kpis--five > :nth-child(n) { grid-column: auto; }
    .bib-kpis--five > :first-child { grid-column: 1 / -1; }
    .bib-hit { grid-template-columns: auto minmax(0, 1fr); gap: 11px; padding: 12px; }
    .bib-hit__chevron { display: none; }
    .bib-hit .bib-cover { width: 44px; height: 62px; }
    .bib-hit .bib-cover__initial { font-size: 18px; }
    .bib-searchbox__submit span { display: none; }
    .bib-searchbox__submit { padding: 0 13px; }
    /* The hero's large box steps down to the regular size on a phone, so the whole placeholder (up to "ISBN") fits. */
    .bib-searchbox--large .bib-searchbox__field { padding: 0 12px; }
    .bib-searchbox--large .bib-searchbox__input { font-size: 14px; }
    .bib-searchbox--large .bib-searchbox__submit { padding: 0 14px; }
    .bib-row { grid-template-columns: minmax(0, 1fr); }
    .bib-row__side { justify-items: start; }
    .bib-row__note { text-align: left; max-width: none; }
    .bib-libcard { padding: 15px; }
    .bib-libcard__codes { grid-template-columns: minmax(0, 1fr); }
    .bib-libcard__qr { justify-self: center; width: 168px; }
    .bib-lookup { grid-template-columns: minmax(0, 1fr); }
    .bib-lookup__result { grid-template-columns: minmax(0, 1fr); }
    .bib-picker__row { grid-template-columns: auto minmax(0, 1fr); }
    .bib-picker__row > :last-child { grid-column: 2; justify-self: start; }
    .bib-tab { padding: 0 12px; }
    .bib-subtab { padding: 9px 10px; }
    .bib-subtab__long { display: none; }
    .bib-subtab__short { display: inline; }
}

/* ---------------------------------------------------------------------------------- 18 motion, contrast and print */
@media (prefers-reduced-motion: reduce) {
    .bib *, .bib *::before, .bib *::after { animation: none !important; transition: none !important; }
}

@media (forced-colors: active) {
    .bib-tab.is-active, .bib-button--primary, .bib-pager__page.is-current, .bib-facet__value.is-selected { forced-color-adjust: none; border: 1px solid CanvasText; }
    .bib-libcard__qr, .bib-libcard__barcode, .bib-scan { forced-color-adjust: none; }
    /* Forced colours drop box-shadow: the focus ring comes back as an outline (on the field shell, never the bare control). */
    .bib :where(button, a, [tabindex]:not([tabindex="-1"]), summary):focus-visible { outline: 2px solid Highlight; outline-offset: 2px; }
    .bib :is(.bib-field__shell, .bib-searchbox__field):focus-within { outline: 2px solid Highlight; outline-offset: 2px; }
}

@media print {
    .bib-overlay, .bib-tabs, .bib-search__filters, .bib-pager, .bib-record__actions, .bib-searchbox { display: none !important; }
    .bib-panel, .bib-hit, .bib-record__head { box-shadow: none; break-inside: avoid; }
}