/* Issue #16 · Shared visual system for every platform page. */
@font-face {
  font-family: Inter;
  src: url('/static/fonts/InterVariable.woff2') format('woff2');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
.vde-design {
  --navy: #172f42;
  --primary: #1464de;
  --primary-hover: #104fb6;
  --success: #17634f;
  --success-soft: #edf7f1;
  --accent-teal: #087e8a;
  --accent-violet: #6451bf;
  --ink: #223747;
  --muted: #596b77;
  --canvas: #f4f7f8;
  --surface: #ffffff;
  --line: #dce5e7;
  --soft: #edf4ff;
  --amber: #805619;
  --amber-soft: #fff8e9;
  --danger: #993b3b;
  --danger-soft: #fff3f2;
  --focus: #176bba;
  --field-line: #adbfc4;
  --disabled-bg: #e9eef0;
  --disabled-ink: #596b77;
  --radius: 16px;
  --radius-control: 10px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --shadow: 0 2px 8px #172f4206;
  --shadow-hover: 0 4px 16px #172f420a;
  --ease: 140ms ease;
  font-family: Inter, system-ui, sans-serif;
  font-size: 15px;
  background: var(--canvas);
  color: var(--ink);
}
.vde-design :is(button, input, select, textarea) { font-family: inherit; }
.vde-design :is(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}
.vde-design .container { max-width: 1600px; padding: var(--space-6) var(--space-7) var(--space-7); }
.vde-design .breadcrumb { font-size: 13px; margin-bottom: var(--space-6); }
.vde-design .heading { align-items: flex-start; gap: var(--space-5); margin-bottom: var(--space-6); }
.vde-design h1 { font-size: clamp(28px, 2.7vw, 38px); font-weight: 720; letter-spacing: -.045em; line-height: 1.18; }
.vde-design h2 { font-size: 20px; font-weight: 650; letter-spacing: -.025em; }
.vde-design :is(p, .heading p) { font-size: 14px; line-height: 1.65; }
.vde-design .heading p { max-width: 70ch; margin-top: var(--space-3); }
.vde-design .eyebrow { font-size: 12px; letter-spacing: .08em; margin-bottom: var(--space-3); }
.vde-design :is(.section-heading > span, .page-tools, .op-help, .form-intro, .rel-intro, .pagination, .text-link) { font-size: 13px; line-height: 1.65; }
.vde-design .section-heading { margin-top: var(--space-6); margin-bottom: var(--space-4); gap: var(--space-3); }
.vde-design .button, .vde-design .clear, .vde-design .vde-link {
  display: inline-flex; align-items: center; justify-content: center;
  gap: var(--space-2); min-height: 46px; padding: var(--space-3) var(--space-4);
  border: 1px solid transparent; border-radius: var(--radius-control);
  font-size: 14px; font-weight: 620; line-height: 1.25; letter-spacing: -.01em;
  background: var(--primary); color: var(--surface); text-decoration: none;
  box-shadow: var(--shadow); cursor: pointer;
  transition: background-color var(--ease), border-color var(--ease), box-shadow var(--ease), transform var(--ease);
}
.vde-design :is(.button, .clear, .vde-link):hover { background: var(--primary-hover); color: var(--surface); box-shadow: var(--shadow-hover); }
.vde-design :is(.button.secondary, .clear) { background: var(--surface); color: var(--ink); border-color: var(--field-line); box-shadow: none; }
.vde-design :is(.button.secondary, .clear):hover { background: var(--soft); border-color: var(--primary); color: var(--primary-hover); }
.vde-design .button.ghost { background: transparent; color: var(--muted); box-shadow: none; }
.vde-design .button.ghost:hover { background: var(--soft); color: var(--primary-hover); }
.vde-design .button.danger { background: var(--danger-soft); color: var(--danger); border-color: var(--danger); box-shadow: none; }
.vde-design .button.danger:hover { background: var(--danger); color: var(--surface); }
.vde-design :is(.button, .clear, .vde-link):active:not(:disabled) { transform: translateY(1px); box-shadow: none; }
.vde-design :is(.button.compact, .row-actions .button) { min-height: 40px; font-size: 13px; padding: var(--space-2) var(--space-3); }
.vde-design .button:disabled, .vde-design .button[aria-disabled='true'] {
  background: var(--disabled-bg); border-color: var(--line); color: var(--disabled-ink); box-shadow: none; cursor: not-allowed; transform: none;
}
.vde-design .button[aria-busy='true'] { cursor: wait; }
.vde-design .button[aria-busy='true']::before {
  content: ''; width: 14px; height: 14px; border: 2px solid currentColor; border-right-color: transparent;
  border-radius: 50%; animation: vde-spin .8s linear infinite;
}
.vde-design .button.success { background: var(--success-soft); color: var(--success); border-color: var(--success); }
.vde-design .button .icon { width: 18px; height: 18px; flex: none; }
.vde-design .icon-button { min-width: 44px; min-height: 44px; border-radius: var(--radius-control); }
.vde-design .topbar { border-bottom-color: var(--line); }
.vde-design .topbar-school b { font-size: 14px; }
.vde-design :is(.topbar-school small, .account-name small, .sidebar-caption, .brand-copy small) { font-size: 12px; }
.vde-design .nav-group summary { font-size: 12px; letter-spacing: .035em; }
.vde-design .nav-link { font-size: 14px; min-height: 44px; }
.vde-design .nav-link[aria-current] { background: var(--primary); border-color: transparent; color: var(--surface); box-shadow: none; }
.vde-design .nav-link[aria-current] .icon { color: var(--surface); }
.vde-design .quick-panel { padding: var(--space-5); background: var(--soft); border-color: var(--line); gap: var(--space-5); }
.vde-design .quick-panel h2 { font-size: 18px; }
.vde-design .quick-panel p { font-size: 13px; }
.vde-design .quick-actions { gap: var(--space-2); }
.vde-design .quick-actions a { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-control); min-height: 44px; padding: var(--space-3); font-size: 13px; }
.vde-design .quick-actions a:hover { border-color: var(--primary); }
.vde-design .cards { gap: var(--space-4); }
.vde-design .card { padding: var(--space-5); box-shadow: var(--shadow); min-height: 155px; transition: border-color var(--ease), box-shadow var(--ease); }
.vde-design .card:hover { border-color: var(--primary); box-shadow: var(--shadow-hover); }
.vde-design .card-label { font-size: 13px; font-weight: 550; line-height: 1.5; }
.vde-design .cards--activity .card-label .icon { width: 36px; height: 36px; padding: var(--space-2); border-radius: var(--radius-control); background: var(--soft); }
.vde-design .cards--activity .card:nth-child(2) .icon { color: var(--accent-teal); background: var(--success-soft); }
.vde-design .cards--activity .card:nth-child(4) .icon { color: var(--accent-violet); }
.vde-design .card strong { font-size: 40px; font-weight: 650; font-variant-numeric: tabular-nums; letter-spacing: -.045em; margin: var(--space-3) 0 var(--space-1); }
.vde-design .card small { font-size: 12px; line-height: 1.5; }
.vde-design .card.warning { background: var(--amber-soft); border-color: var(--line); }
.vde-design .cards--stock { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.vde-design .cards--stock .card { min-height: 135px; padding: var(--space-4); }
.vde-design .cards--stock .card strong { font-size: 30px; margin-top: auto; padding-top: var(--space-3); }
.vde-design .cards--stock .card-label { font-size: 12px; }
.vde-design :is(.banner, .history-panel) { padding: var(--space-5); }
.vde-design :is(.banner p, .history-panel p, .history-panel .text-link) { font-size: 13px; }
.vde-design .banner { background: var(--amber-soft); border-color: var(--line); }
.vde-design :is(.op-form, .rel-form, .op-bar) { padding: var(--space-5); box-shadow: var(--shadow); border-color: var(--line); border-radius: var(--radius); }
.vde-design .op-form { max-width: 940px; gap: var(--space-5); }
.vde-design .op-form > .op-help { grid-column: 1 / -1; margin: 0; padding: var(--space-4); background: var(--soft); border-radius: var(--radius-control); }
.vde-design :is(.op-form label, .rel-filters label, .search-field) { font-size: 14px; font-weight: 550; }
.vde-design :is(input:not([type='hidden']):not([type='checkbox']), select, textarea) {
  min-height: 46px; font-size: 14px; padding: var(--space-3); border-color: var(--field-line); border-radius: var(--radius-control); line-height: 1.4;
}
.vde-design input[type='checkbox'] { width: 20px; height: 20px; }
.vde-design .op-check { min-height: 44px; }
.vde-design .form-actions { padding-top: var(--space-5); margin-top: var(--space-2); gap: var(--space-3); }
.vde-design :is(.op-ok, .op-erro) { border-radius: var(--radius-control); padding: var(--space-4); font-size: 14px; }
.vde-design .rel-filters { gap: var(--space-5); }
.vde-design .rel-buttons { padding-top: var(--space-5); gap: var(--space-3); }
.vde-design .rel-drill { gap: var(--space-2); padding: var(--space-4) 0; }
.vde-design .rel-drill a { display: inline-flex; align-items: center; min-height: 44px; padding: var(--space-2) var(--space-3); background: var(--soft); color: var(--primary-hover); border-radius: var(--radius-control); font-size: 13px; }
.vde-design .copy-summary { gap: var(--space-3); }
.vde-design .copy-summary div { border-color: var(--line); box-shadow: var(--shadow); padding: var(--space-4); }
.vde-design .copy-summary span { font-size: 13px; }
.vde-design .copy-summary strong { font-size: 30px; font-weight: 650; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.vde-design .copy-summary small { font-size: 12px; }
.vde-design .copy-summary strong { display: block; margin-bottom: var(--space-2); }
.vde-design .page-tools a { font-size: 13px; min-height: 44px; }
.vde-design .op-form > * { min-width: 0; }
.vde-design .action-panel summary { min-height: 44px; font-size: 13px; border-radius: var(--radius-control); }
.vde-design .busca-opcoes button { font: inherit; min-height: 44px; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--soft); color: var(--primary-hover); padding: var(--space-2) var(--space-3); }
.vde-design .table-wrap { box-shadow: var(--shadow); }
.vde-design table { font-size: 14px; }
.vde-design thead { background: var(--canvas); }
.vde-design th { font-size: 12px; font-weight: 650; letter-spacing: .015em; color: var(--muted); }
.vde-design :is(th, td) { padding: var(--space-4); border-bottom-color: var(--line); }
.vde-design td { line-height: 1.55; }
.vde-design tbody tr:hover { background: var(--soft); }
.vde-design .row-actions { gap: var(--space-2); min-width: 180px; }
.vde-design .pill { font-size: 12px; padding: var(--space-1) var(--space-2); }
.vde-design .pagination a { min-height: 44px; padding: var(--space-3); border-radius: var(--radius-control); }
.vde-design .busca-opcoes { border-color: var(--field-line); border-radius: var(--radius-control); box-shadow: var(--shadow-hover); margin-top: var(--space-2); }
.vde-design .busca-opcoes li { min-height: 44px; padding: var(--space-3); font-size: 14px; line-height: 1.5; border-bottom: 1px solid var(--line); }
.vde-design .busca-opcoes li[aria-selected='true'] { background: var(--soft); color: var(--primary-hover); box-shadow: inset 3px 0 var(--primary); }
.vde-design .busca-opcoes mark { color: var(--ink); background: var(--amber-soft); font-weight: 650; }
.vde-design .busca-status { font-size: 13px; line-height: 1.5; }
.vde-design footer { font-size: 12px; }
.vde-design :is(.vde-form, .login-card, .op-card, .op-grid > section) {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: var(--space-5); box-shadow: var(--shadow);
}
.vde-design .vde-form { max-width: 940px; gap: var(--space-3); }
.vde-design :is(.vde-form > label, .login-card label, .op-inline label) { font-size: 14px; font-weight: 550; }
.vde-design :is(.vde-help, .vde-tip, .op-card p, .op-inline, .op-box span, .login-card small) { font-size: 13px; line-height: 1.65; }
.vde-design :is(.alert, .vde-alert, .op-warning, .op-help, .rel-note) { font-size: 13px; line-height: 1.65; padding: var(--space-4); border-radius: var(--radius-control); }
.vde-design :is(.alert.danger, .vde-alert.danger, .op-erro) { color: var(--danger); background: var(--danger-soft); border-color: var(--danger); }
.vde-design :is(.alert.success, .vde-alert.success, .op-ok) { color: var(--success); background: var(--success-soft); border-color: var(--success); }
.vde-design :is(.op-warning, .rel-note) { color: var(--amber); background: var(--amber-soft); border-color: var(--line); }
.vde-design :is(.status, .badge) { font-size: 12px; line-height: 1.5; border-radius: var(--radius-control); padding: var(--space-1) var(--space-2); }
.vde-design .status.success { color: var(--success); background: var(--success-soft); }
.vde-design .status.warn { color: var(--amber); background: var(--amber-soft); }
.vde-design .status.danger { color: var(--danger); background: var(--danger-soft); }
.vde-design .op-grid { gap: var(--space-5); }
.vde-design .op-card h3 { font-size: 17px; font-weight: 650; letter-spacing: -.015em; }
.vde-design .op-card summary { min-height: 44px; font-size: 14px; padding: var(--space-3) 0; }
.vde-design .op-permissions { grid-column: 1 / -1; padding: var(--space-4); border-color: var(--line); border-radius: var(--radius-control); gap: var(--space-3); }
.vde-design .op-permissions legend { font-size: 14px; padding: 0 var(--space-2); }
.vde-design .op-inline { gap: var(--space-3); }
.vde-design .op-inline label { display: grid; gap: var(--space-2); }
.vde-design .op-form > :is(p, fieldset) { grid-column: 1 / -1; }
.vde-design .op-form > .button { justify-self: start; align-self: end; }
.vde-design .op-form > input[type='hidden'] { display: none; }
.vde-design input[type='file'] { width: 100%; }
.vde-design input[type='file']::file-selector-button {
  font: inherit; color: var(--primary-hover); background: var(--soft); border: 1px solid var(--line);
  border-radius: var(--radius-control); padding: var(--space-2) var(--space-3); margin-right: var(--space-3); cursor: pointer;
}
.vde-design .vde-buttons { margin-top: var(--space-4); padding-top: var(--space-5); border-top: 1px solid var(--line); gap: var(--space-3); }
.vde-design :is(.auth-school, .account-name, .institution small) { font-size: 13px; }
.vde-design .institution b { font-size: 13px; }
.vde-design.auth-layout .container { max-width: 1000px; }
.vde-design.auth-layout main > .op-form { max-width: 580px; grid-template-columns: 1fr; margin: var(--space-5) auto; padding: var(--space-6); }
.vde-design.auth-layout main > :is(h1, h2, p, a, code) { display: block; max-width: 580px; margin-left: auto; margin-right: auto; }
.vde-design.auth-layout main > h1 { margin-top: var(--space-7); }
.vde-design.auth-layout .op-form > .button { width: 100%; }
.vde-design .login-card { padding: var(--space-6); }
.vde-design dialog { padding: var(--space-5); border-radius: var(--radius); border-color: var(--line); }
.vde-design dialog p { font-size: 14px; }
.vde-design .back { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; }
@keyframes vde-spin { to { transform: rotate(360deg); } }
/* Composition: summary strip → chart / operations / priorities → stock / history. */
.vde-design .dashboard-heading { display: flex; justify-content: space-between; gap: var(--space-5); margin-bottom: var(--space-5); }
.vde-design .dashboard-heading h1 { margin: 0 0 var(--space-2); }
.vde-design .dashboard-heading p { margin: var(--space-1) 0; }
.vde-design .dashboard-heading .dashboard-school { font-size: 18px; color: var(--ink); }
.vde-design .dashboard-heading > span { color: var(--muted); font-size: 13px; white-space: nowrap; padding-top: var(--space-2); }
.vde-design .dashboard-metrics { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: var(--space-3); margin-bottom: var(--space-5); }
.vde-design .dashboard-metric { display: flex; align-items: center; gap: var(--space-3); min-width: 0; padding: var(--space-4); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.vde-design .dashboard-metric:hover { border-color: var(--primary); }
.vde-design .dashboard-metric strong { display: block; font-size: 28px; line-height: 1.2; font-weight: 680; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.vde-design .dashboard-metric div > span { display: block; font-size: 12px; color: var(--muted); line-height: 1.5; margin-top: var(--space-1); }
.vde-design .metric-icon { display: grid; place-items: center; width: 40px; height: 44px; flex: none; background: var(--soft); color: var(--primary); border-radius: var(--radius-control); }
.vde-design .metric-people { color: var(--amber); background: var(--amber-soft); }
.vde-design .metric-teacher { color: var(--accent-violet); }
.vde-design .metric-circulation { color: var(--accent-teal); background: var(--success-soft); }
.vde-design .metric-warning { color: var(--danger); background: var(--danger-soft); }
.vde-design .dashboard-workbench { display: grid; grid-template-columns: 1.5fr 1.2fr 1fr; gap: var(--space-4); align-items: stretch; margin-bottom: var(--space-5); }
.vde-design .dashboard-workbench > * { min-width: 0; }
.vde-design :is(.chart-panel,.dashboard-actions,.dashboard-priorities,.dashboard-stock,.dashboard-history) { margin: 0; padding: var(--space-5); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.vde-design .dashboard-movements .chart-panel { height: 100%; }
.vde-design :is(.dashboard-workbench,.chart-panel) h2 { font-size: 17px; letter-spacing: -.02em; margin: 0 0 var(--space-3); }
.vde-design .chart-panel { min-width: 0; }
.vde-design .chart-panel figcaption p { font-size: 12px; margin: 0 0 var(--space-4); color: var(--muted); }
.vde-design .chart-legend { display: flex; flex-wrap: wrap; gap: var(--space-4); list-style: none; padding: 0; margin: var(--space-4) 0; font-size: 12px; color: var(--muted); }
.vde-design .chart-legend li { display: flex; align-items: center; gap: var(--space-2); }
.vde-design .chart-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--primary); }
.vde-design .chart-dot.return { background: var(--success); }
.vde-design .chart-dot.reservation { background: var(--amber); }
.vde-design .chart-scroll { max-width: 100%; overflow-x: auto; }
.vde-design .daily-chart { display: block; width: 100%; height: auto; }
.vde-design .chart-grid path { stroke: var(--line); stroke-width: 1; fill: none; }
.vde-design .chart-axis { fill: var(--muted); font-size: 18px; }
.vde-design .chart-bar.loan { fill: var(--primary); }
.vde-design .chart-bar.return { fill: var(--success); }
.vde-design .chart-bar.reservation { fill: var(--amber); }
.vde-design .chart-track { fill: var(--soft); }
.vde-design .chart-empty { min-height: 160px; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; color: var(--muted); border: 1px dashed var(--line); border-radius: var(--radius-control); padding: var(--space-5); }
.vde-design .chart-empty small { font-size: 12px; }
.vde-design .chart-data { margin-top: var(--space-2); font-size: 13px; color: var(--muted); }
.vde-design .chart-data summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; text-decoration: underline; }
.vde-design .chart-data dl { max-height: 260px; overflow-y: auto; margin: var(--space-2) 0 0; }
.vde-design .chart-data dl > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-2); padding: var(--space-3) 0; border-top: 1px solid var(--line); }
.vde-design .chart-data dd { display: flex; flex-wrap: wrap; gap: var(--space-3); margin: 0; }
.vde-design .quick-primary-actions { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); margin: var(--space-4) 0; }
.vde-design .quick-primary-actions .button { min-height: 72px; padding: var(--space-3); }
.vde-design .quick-primary-actions .button span { text-align: left; font-size: 13px; }
.vde-design .quick-primary-actions .return-action { background: var(--success); }
.vde-design .quick-primary-actions .return-action:hover { background: var(--primary-hover); }
.vde-design .quick-tile-actions { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--space-2); }
.vde-design .quick-tile-actions > :is(a,span) { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); padding: var(--space-3); border: 1px solid var(--line); border-radius: var(--radius-control); font-size: 12px; line-height: 1.5; }
.vde-design .quick-tile-actions a:hover { background: var(--soft); border-color: var(--primary); }
.vde-design .quick-tile-actions .icon:first-child { width: 34px; height: 34px; padding: var(--space-2); background: var(--soft); color: var(--primary); border-radius: var(--radius-control); }
.vde-design .quick-tile-actions .icon:last-child { width: 16px; height: 16px; align-self: flex-end; }
.vde-design [aria-disabled='true'] { color: var(--disabled-ink); }
.vde-design .panel-heading { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); }
.vde-design .panel-heading p { font-size: 13px; margin: 0; color: var(--muted); }
.vde-design .priority-item { display: flex; gap: var(--space-3); align-items: center; padding: var(--space-4) 0; border-bottom: 1px solid var(--line); font-size: 13px; line-height: 1.45; }
.vde-design .priority-item strong { font-size: 23px; font-variant-numeric: tabular-nums; }
.vde-design .priority-item > .icon { width: 16px; height: 16px; margin-left: auto; flex: none; }
.vde-design .priority-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: var(--radius-control); background: var(--soft); color: var(--primary); flex: none; }
.vde-design .priority-item.danger :is(strong,.priority-icon) { color: var(--danger); }
.vde-design .priority-item.danger .priority-icon { background: var(--danger-soft); }
.vde-design .priority-item.warn :is(strong,.priority-icon) { color: var(--amber); }
.vde-design .priority-item.warn .priority-icon { background: var(--amber-soft); }
.vde-design .dashboard-priorities > p { font-size: 12px; color: var(--muted); }
.vde-design .dashboard-stock { margin-bottom: var(--space-4); }
.vde-design .stock-primary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin: var(--space-5) 0; gap: var(--space-5); }
.vde-design .stock-primary > div { padding-left: var(--space-4); border-left: 2px solid var(--line); }
.vde-design .stock-primary dt { font-size: 13px; color: var(--muted); }
.vde-design .stock-primary dd { font-size: 28px; font-weight: 650; margin: var(--space-2) 0 0; font-variant-numeric: tabular-nums; }
.vde-design :is(.stock-complement,.dashboard-history) > summary { min-height: 44px; cursor: pointer; font-size: 14px; font-weight: 550; }
.vde-design .stock-complement dl { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--space-4); }
.vde-design .stock-complement dl > div { display: flex; justify-content: space-between; gap: var(--space-3); font-size: 13px; padding: var(--space-3) 0; border-bottom: 1px solid var(--line); }
.vde-design .stock-complement dd { font-weight: 650; margin: 0; }
.vde-design .stock-note { font-size: 12px; color: var(--muted); margin-bottom: 0; }
.vde-design .dashboard-history { padding: var(--space-4) var(--space-5); background: var(--canvas); box-shadow: none; }
.vde-design .history-content { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); padding: var(--space-4) 0; }
.vde-design .history-content :is(p,a) { font-size: 13px; }
.vde-design .report-charts { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-4); margin: var(--space-5) 0; }
.vde-design .report-charts .chart-panel:last-child:nth-child(odd) { grid-column: 1 / -1; }
.vde-design .chart-ranking { list-style: none; padding: 0; margin: var(--space-5) 0 0; }
.vde-design .chart-ranking li { display: grid; grid-template-columns: minmax(90px,1fr) 1.1fr 32px; align-items: center; gap: var(--space-3); margin-bottom: var(--space-4); font-size: 13px; }
.vde-design .chart-ranking li > span { overflow-wrap: anywhere; line-height: 1.5; }
.vde-design .chart-ranking svg { width: 100%; }
.vde-design .chart-ranking strong { text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 1500px) {
  .vde-design .dashboard-workbench { grid-template-columns: 1.2fr 1fr; }
  .vde-design .dashboard-movements { grid-column: 1 / -1; }
  .vde-design .dashboard-movements .daily-chart { max-height: 220px; }
  .vde-design .dashboard-metric { padding: var(--space-3); gap: var(--space-2); }
  .vde-design .metric-icon { width: 30px; height: 36px; }
}
@media (max-width: 1200px) { .vde-design .dashboard-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width: 768px) {
  .vde-design .dashboard-heading { flex-direction: column; gap: var(--space-2); }
  .vde-design .dashboard-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .vde-design .dashboard-workbench, .vde-design .report-charts { grid-template-columns: 1fr; }
  .vde-design .quick-primary-actions .button { min-height: 64px; }
  .vde-design .quick-tile-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .vde-design .daily-chart { min-width: 680px; }
  .vde-design .stock-primary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .vde-design .stock-complement dl { grid-template-columns: 1fr; }
  .vde-design .history-content { grid-template-columns: 1fr; }
  .vde-design .panel-heading { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 480px) {
  .vde-design :is(.chart-panel,.dashboard-actions,.dashboard-priorities,.dashboard-stock,.dashboard-history) { padding: var(--space-4); }
  .vde-design .quick-primary-actions { grid-template-columns: 1fr; }
  .vde-design .dashboard-metric strong { font-size: 24px; }
}
@media (min-width: 1600px) {
  .vde-design .cards--activity { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .vde-design .cards--activity .card { padding: var(--space-4); }
}
@media (max-width: 1280px) {
  .vde-design .container { padding: var(--space-6); }
  .vde-design .cards--stock { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .vde-design .quick-panel { align-items: center; }
}
@media (max-width: 768px) {
  .vde-design .container { padding: var(--space-5); }
  .vde-design .cards--activity { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vde-design .cards--stock { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vde-design .heading { flex-direction: column; }
  .vde-design .quick-panel { align-items: flex-start; flex-direction: column; }
  .vde-design .section-heading { align-items: flex-start; flex-direction: column; }
  .vde-design :is(.button.compact, .row-actions .button) { min-height: 44px; }
}
@media (max-width: 480px) {
  .vde-design .container { padding: var(--space-5) var(--space-4); }
  .vde-design .cards--activity { grid-template-columns: 1fr; }
  .vde-design .card { min-height: 140px; }
  .vde-design .cards--stock .card { min-height: 145px; }
  .vde-design :is(.op-form, .rel-form, .op-bar) { padding: var(--space-4); }
  .vde-design .quick-actions { display: grid; grid-template-columns: 1fr; width: 100%; }
  .vde-design .heading > .button { width: 100%; }
  .vde-design .form-actions > :is(.button, .clear) { flex: 1 1 auto; }
  .vde-design :is(.vde-form, .login-card, .op-card, .op-grid > section, .auth-layout main > .op-form) { padding: var(--space-4); }
  .vde-design.auth-layout main > .op-form { padding: var(--space-4); }
  .vde-design .op-inline { display: flex; flex-direction: column; align-items: stretch; }
}
@media (prefers-reduced-motion: reduce) {
  .vde-design *, .vde-design *::before, .vde-design *::after { animation: none !important; transition: none !important; }
  .vde-design :is(.button, .clear, .vde-link):active { transform: none; }
}

/* Shared compact actions; native routes and confirmation forms are preserved. */
.vde-design .action-icon { position:relative; display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; min-width:44px; padding:0; border:1px solid #d5dfed; border-radius:9px; background:#edf4ff; color:#1459b5; text-decoration:none; cursor:pointer; }
.vde-design .action-stock,.vde-design .action-add { color:#17634f; background:#edf8f3; border-color:#cce3dc; }
.vde-design .action-reserve { color:#693bb1; background:#f4effc; border-color:#dfd4ef; }
.vde-design .action-danger { color:#aa2738; background:#fff1f3; border-color:#f2d2d8; }
.vde-design .action-icon:hover { filter:brightness(.94); }
.vde-design .action-icon:focus-visible { outline:3px solid #1464de; outline-offset:3px; }
.vde-design .action-icon[aria-disabled=true] { opacity:.55; cursor:default; }
.vde-design .action-tooltip { position:absolute; bottom:calc(100% + 4px); right:0; z-index:20; width:max-content; max-width:240px; white-space:normal; padding:8px 10px; border-radius:6px; color:white; background:#172f42; font-size:12px; line-height:1.4; pointer-events:none; visibility:hidden; }
.vde-design .action-icon:hover .action-tooltip,.vde-design .action-icon:focus-visible .action-tooltip { visibility:visible; }
.vde-design .action-panel summary.action-icon::marker { content:''; }
.vde-design .stock-cell { min-width:245px; }
.vde-design .stock-cell strong,.vde-design .stock-cell small { display:block; margin-bottom:6px; }
.vde-design .manual-index { display:flex; flex-wrap:wrap; gap:12px; }
.vde-design .manual-section { scroll-margin-top:90px; border-top:1px solid var(--line); padding:24px 0; }
.vde-design .button.add-units { background:#17634f; border-color:#17634f; color:white; }
