@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/ibm-plex-sans-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/fonts/ibm-plex-sans-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/ibm-plex-sans-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/fonts/ibm-plex-sans-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/ibm-plex-mono-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Serif"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/ibm-plex-serif-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Serif"; font-style: italic; font-weight: 400; font-display: swap; src: url("/assets/fonts/ibm-plex-serif-latin-400-italic.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Serif"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/fonts/ibm-plex-serif-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Serif"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/ibm-plex-serif-latin-600-normal.woff2") format("woff2"); }

:root {

  --paper-0: #f3f4f7;
  --paper-1: #ffffff;
  --paper-2: #fbfcfd;
  --sunken:  #eceff3;

  --ink-900: #181f2e;
  --ink-800: #232c3d;
  --ink-700: #2c3548;
  --ink-600: #404a5d;
  --ink-500: #5a6577;
  --ink-400: #8b94a4;
  --ink-300: #b6bdc9;

  --line-100: #eef0f4;
  --line-200: #e1e4ea;
  --line-300: #cdd2dc;


  --indigo-50:  #f1f3fc;
  --indigo-100: #e3e7f8;
  --indigo-200: #c7cef0;
  --indigo-300: #a3aee6;
  --indigo-400: #6f7fd4;
  --indigo-500: #4a5bc4;
  --indigo-600: #3d4fb5;
  --indigo-700: #323f94;
  --indigo-800: #28336f;
  --indigo-900: #1d2650;



  --green-text:   #1b7a4d;
  --green-solid:  #1e8a57;
  --green-fill:   #e4f2ea;
  --green-border: #c0e3d0;


  --amber-text:   #97670f;
  --amber-solid:  #c68214;
  --amber-fill:   #fbf0d8;
  --amber-border: #f0dba6;


  --red-text:   #b5281c;
  --red-solid:  #c8372a;
  --red-fill:   #fbe9e6;
  --red-border: #f2c9c2;


  --sky-text:   #1f6fa6;
  --sky-solid:  #2486c0;
  --sky-fill:   #e5f0f8;
  --sky-border: #c2ddef;


  --plum-text:   #7c4f9e;
  --plum-solid:  #8a5cab;
  --plum-fill:   #f2ecf8;
  --plum-border: #e0d2ee;


  --neutral-text:   #5a6577;
  --neutral-fill:   #eef0f4;
  --neutral-border: #dde1e8;




  --background:      var(--paper-0);
  --surface:         var(--paper-1);
  --surface-raised:  var(--paper-1);
  --surface-sunken:  var(--sunken);
  --surface-hover:   var(--paper-2);
  --border:          var(--line-200);
  --border-strong:   var(--line-300);
  --divider:         var(--line-100);


  --text:        var(--ink-700);
  --text-strong: var(--ink-900);
  --text-muted:  var(--ink-500);
  --text-subtle: var(--ink-400);
  --text-on-primary: #ffffff;


  --primary:          var(--indigo-600);
  --primary-hover:    var(--indigo-700);
  --primary-active:   var(--indigo-800);
  --primary-subtle:   var(--indigo-100);
  --primary-subtle-text: var(--indigo-700);
  --primary-disabled: var(--indigo-200);


  --focus-ring:        var(--indigo-600);
  --focus-ring-offset: var(--surface);


  --correct:        var(--green-text);
  --correct-solid:  var(--green-solid);
  --correct-fill:   var(--green-fill);
  --correct-border: var(--green-border);

  --review:        var(--amber-text);
  --review-solid:  var(--amber-solid);
  --review-fill:   var(--amber-fill);
  --review-border: var(--amber-border);

  --incorrect:        var(--red-text);
  --incorrect-solid:  var(--red-solid);
  --incorrect-fill:   var(--red-fill);
  --incorrect-border: var(--red-border);

  --info:        var(--sky-text);
  --info-solid:  var(--sky-solid);
  --info-fill:   var(--sky-fill);
  --info-border: var(--sky-border);

  --unreadable:        var(--plum-text);
  --unreadable-solid:  var(--plum-solid);
  --unreadable-fill:   var(--plum-fill);
  --unreadable-border: var(--plum-border);

  --blank:        var(--neutral-text);
  --blank-fill:   var(--neutral-fill);
  --blank-border: var(--neutral-border);


  --conf-dot:       var(--ink-700);
  --conf-dot-empty: var(--line-300);
  --conf-low-fill:    var(--amber-fill);
  --conf-low-border:  var(--amber-border);
  --conf-low-accent:  var(--amber-text);
  --conf-high-fill:   var(--neutral-fill);
  --conf-high-border: var(--neutral-border);


  --selection-bg: var(--indigo-100);
}

:root {

  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  --font-serif: "IBM Plex Serif", "Iowan Old Style", Georgia, serif;


  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;


  --text-display-size: 2rem;
  --text-display-lh: 1.18;
  --text-display-lg-size: 2.625rem;
  --text-display-lg-lh: 1.12;

  --text-h1-size: 1.5rem;
  --text-h1-lh: 1.25;
  --text-h2-size: 1.1875rem;
  --text-h2-lh: 1.3;
  --text-h3-size: 1.0625rem;
  --text-h3-lh: 1.35;

  --text-body-size: 0.9375rem;
  --text-body-lh: 1.5;
  --text-sm-size: 0.8125rem;
  --text-sm-lh: 1.45;
  --text-xs-size: 0.75rem;
  --text-xs-lh: 1.4;


  --text-mono-size: 0.875rem;
  --text-mono-lh: 1.4;


  --tracking-tight: -0.011em;
  --tracking-normal: 0;
  --tracking-wide: 0.04em;
  --tracking-mono: 0.01em;


  --numeric-features: "tnum" 1, "lnum" 1;
}

:root {

  --space-0: 0;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;


  --radius-xs: 3px;
  --radius-sm: 5px;
  --radius-md: 7px;
  --radius-lg: 10px;
  --radius-xl: 14px;
  --radius-pill: 999px;


  --control-h-sm: 30px;
  --control-h-md: 38px;
  --control-h-lg: 44px;


  --page-max: 1200px;
  --page-gutter: var(--space-6);
  --topbar-h: 56px;


  --border-width: 1px;
  --border-width-strong: 1.5px;
  --focus-ring-width: 2px;
  --focus-ring-offset-width: 2px;


  --ease-standard: cubic-bezier(0.2, 0, 0.1, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 90ms;
  --dur-base: 150ms;
  --dur-slow: 240ms;
}


[data-density="compact"] {
  --control-h-sm: 26px;
  --control-h-md: 32px;
  --control-h-lg: 38px;
  --page-gutter: var(--space-4);
}

:root {
  --shadow-xs: 0 1px 1px rgba(24, 31, 46, 0.04);
  --shadow-sm: 0 1px 2px rgba(24, 31, 46, 0.06), 0 1px 1px rgba(24, 31, 46, 0.04);
  --shadow-md: 0 2px 6px rgba(24, 31, 46, 0.07), 0 1px 2px rgba(24, 31, 46, 0.05);
  --shadow-lg: 0 8px 24px rgba(24, 31, 46, 0.10), 0 2px 6px rgba(24, 31, 46, 0.06);
  --shadow-xl: 0 16px 48px rgba(24, 31, 46, 0.14), 0 4px 12px rgba(24, 31, 46, 0.08);


  --shadow-focus: 0 0 0 var(--focus-ring-offset-width) var(--focus-ring-offset),
                  0 0 0 calc(var(--focus-ring-offset-width) + 2px) var(--focus-ring);


  --shadow-inset: inset 0 1px 2px rgba(24, 31, 46, 0.06);
}

[data-theme="dark"] {
  --background:      #14181f;
  --surface:         #1b212b;
  --surface-raised:  #212834;
  --surface-sunken:  #11151b;
  --surface-hover:   #232b38;
  --border:          #2c3543;
  --border-strong:   #3a4555;
  --divider:         #232b36;

  --text:        #d7dce5;
  --text-strong: #f1f3f7;
  --text-muted:  #97a1b2;
  --text-subtle: #6c7689;
  --text-on-primary: #ffffff;

  --primary:          #6f7fd4;
  --primary-hover:    #8694e0;
  --primary-active:   #9aa6e8;
  --primary-subtle:   #262d45;
  --primary-subtle-text: #aab4ec;
  --primary-disabled: #343c54;

  --focus-ring:        #8694e0;
  --focus-ring-offset: var(--surface);


  --correct:        #54c98c;
  --correct-solid:  #2e9e66;
  --correct-fill:   #16321f;
  --correct-border: #275c3c;

  --review:        #e0a73c;
  --review-solid:  #c68214;
  --review-fill:   #34270d;
  --review-border: #5c481c;

  --incorrect:        #ef7b6e;
  --incorrect-solid:  #cf4133;
  --incorrect-fill:   #361613;
  --incorrect-border: #5e2b25;

  --info:        #54a8dd;
  --info-solid:  #2486c0;
  --info-fill:   #102634;
  --info-border: #24465c;

  --unreadable:        #b78bd6;
  --unreadable-solid:  #8a5cab;
  --unreadable-fill:   #261a33;
  --unreadable-border: #45345c;

  --blank:        #97a1b2;
  --blank-fill:   #222a35;
  --blank-border: #323b49;

  --conf-dot:       #c4cbd8;
  --conf-dot-empty: #3a4453;
  --conf-low-fill:    #34270d;
  --conf-low-border:  #5c481c;
  --conf-low-accent:  #e0a73c;
  --conf-high-fill:   #222a35;
  --conf-high-border: #323b49;

  --selection-bg: #2a3350;

  --shadow-xs: 0 1px 1px rgba(0, 0, 0, 0.25);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 1px rgba(0, 0, 0, 0.25);
  --shadow-md: 0 2px 6px rgba(0, 0, 0, 0.35), 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.45), 0 2px 6px rgba(0, 0, 0, 0.3);
  --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.55), 0 4px 12px rgba(0, 0, 0, 0.35);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: var(--text-body-size);
  line-height: var(--text-body-lh);
  color: var(--text);
  background: var(--background);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "kern" 1, "liga" 1;
}

::selection {
  background: var(--selection-bg);
}


.am-numeric,
.am-mono {
  font-family: var(--font-mono);
  font-feature-settings: var(--numeric-features);
  letter-spacing: var(--tracking-mono);
}


:focus-visible {
  outline: var(--focus-ring-width) solid var(--focus-ring);
  outline-offset: var(--focus-ring-offset-width);
  border-radius: var(--radius-xs);
}
:focus:not(:focus-visible) {
  outline: none;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}


.am-display { font-family: var(--font-serif); font-size: var(--text-display-size); line-height: var(--text-display-lh); letter-spacing: var(--tracking-tight); font-weight: var(--weight-medium); color: var(--text-strong); }
.am-h1 { font-size: var(--text-h1-size); line-height: var(--text-h1-lh); font-weight: var(--weight-semibold); color: var(--text-strong); letter-spacing: var(--tracking-tight); }
.am-h2 { font-size: var(--text-h2-size); line-height: var(--text-h2-lh); font-weight: var(--weight-semibold); color: var(--text-strong); }
.am-h3 { font-size: var(--text-h3-size); line-height: var(--text-h3-lh); font-weight: var(--weight-semibold); color: var(--text-strong); }
.am-body { font-size: var(--text-body-size); line-height: var(--text-body-lh); }
.am-sm { font-size: var(--text-sm-size); line-height: var(--text-sm-lh); }
.am-xs { font-size: var(--text-xs-size); line-height: var(--text-xs-lh); }
.am-overline { font-size: var(--text-xs-size); letter-spacing: var(--tracking-wide); text-transform: uppercase; font-weight: var(--weight-semibold); color: var(--text-muted); }



.am-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  height: var(--control-h-md);
  padding: 0 var(--space-4);
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
  white-space: nowrap;
  user-select: none;
  transition: background var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard);
}
.am-btn:focus-visible { outline: var(--focus-ring-width) solid var(--focus-ring); outline-offset: var(--focus-ring-offset-width); }
.am-btn:disabled { cursor: not-allowed; opacity: 0.5; }
.am-btn__ico { width: 16px; height: 16px; flex: none; }
.am-btn--sm { height: var(--control-h-sm); padding: 0 var(--space-3); font-size: 13px; }
.am-btn--lg { height: var(--control-h-lg); padding: 0 var(--space-5); font-size: 15px; }
.am-btn--block { width: 100%; }

.am-btn--primary { background: var(--primary); color: var(--text-on-primary); border-color: var(--primary); }
.am-btn--primary:hover:not(:disabled) { background: var(--primary-hover); border-color: var(--primary-hover); }
.am-btn--primary:active:not(:disabled) { background: var(--primary-active); border-color: var(--primary-active); }

.am-btn--secondary { background: var(--surface); color: var(--text); border-color: var(--border-strong); }
.am-btn--secondary:hover:not(:disabled) { background: var(--surface-hover); border-color: var(--ink-400); }
.am-btn--secondary:active:not(:disabled) { background: var(--surface-sunken); }

.am-btn--ghost { background: transparent; color: var(--text); border-color: transparent; }
.am-btn--ghost:hover:not(:disabled) { background: var(--surface-sunken); }
.am-btn--ghost:active:not(:disabled) { background: var(--border); }

.am-btn--danger { background: var(--surface); color: var(--incorrect); border-color: var(--incorrect-border); }
.am-btn--danger:hover:not(:disabled) { background: var(--incorrect-fill); border-color: var(--incorrect-solid); }
.am-btn--danger-solid { background: var(--incorrect-solid); color: #fff; border-color: var(--incorrect-solid); }
.am-btn--danger-solid:hover:not(:disabled) { background: var(--incorrect); border-color: var(--incorrect); }


.am-btn--confirm { background: var(--correct-solid); color: #fff; border-color: var(--correct-solid); }
.am-btn--confirm:hover:not(:disabled) { background: var(--correct); border-color: var(--correct); }

.am-btn__spinner { width: 14px; height: 14px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: am-spin 0.7s linear infinite; }
.am-btn__kbd {
  font-family: var(--font-mono);
  font-size: 10.5px;
  font-weight: 600;
  padding: 1px 5px;
  border-radius: var(--radius-xs);
  background: rgba(255,255,255,0.22);
  margin-left: 2px;
}
.am-btn--secondary .am-btn__kbd, .am-btn--ghost .am-btn__kbd { background: var(--surface-sunken); color: var(--text-muted); }


.am-iconbtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--control-h-md);
  height: var(--control-h-md);
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  background: transparent;
  color: var(--text-muted);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard);
}
.am-iconbtn:hover:not(:disabled) { background: var(--surface-sunken); color: var(--text); }
.am-iconbtn:focus-visible { outline: var(--focus-ring-width) solid var(--focus-ring); outline-offset: var(--focus-ring-offset-width); }
.am-iconbtn:disabled { opacity: 0.45; cursor: not-allowed; }
.am-iconbtn--sm { width: var(--control-h-sm); height: var(--control-h-sm); }
.am-iconbtn--solid { background: var(--surface); border-color: var(--border-strong); }
.am-iconbtn svg { width: 18px; height: 18px; }


.am-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  border-radius: var(--radius-pill);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  background: var(--primary-subtle);
  color: var(--primary-subtle-text);
  font-feature-settings: var(--numeric-features);
}
.am-badge--neutral { background: var(--surface-sunken); color: var(--text-muted); }
.am-badge--solid { background: var(--primary); color: #fff; }
.am-badge--review { background: var(--review-fill); color: var(--review); }

.am-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 24px;
  padding: 0 10px;
  border-radius: var(--radius-sm);
  background: var(--surface-sunken);
  border: 1px solid var(--border);
  color: var(--text);
  font-size: 12.5px;
  font-weight: 500;
}
.am-tag__remove { display: inline-flex; cursor: pointer; color: var(--text-subtle); border: 0; background: none; padding: 0; }
.am-tag__remove:hover { color: var(--text); }
.am-tag__remove svg { width: 12px; height: 12px; }


.am-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
}
.am-card--raised { box-shadow: var(--shadow-sm); }
.am-card--pad-sm { padding: var(--space-4); }
.am-card--interactive { cursor: pointer; transition: border-color var(--dur-base) var(--ease-standard), box-shadow var(--dur-base) var(--ease-standard); text-decoration: none; color: inherit; display: block; }
.am-card--interactive:hover { border-color: var(--border-strong); box-shadow: var(--shadow-md); }
.am-card__title { font-size: 15px; font-weight: 600; color: var(--text-strong); margin: 0; }
.am-card__sub { font-size: 13px; color: var(--text-muted); margin: 2px 0 0; }


.am-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: var(--radius-pill);
  background: var(--primary-subtle);
  color: var(--primary-subtle-text);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.01em;
  flex: none;
  overflow: hidden;
}
.am-avatar img { width: 100%; height: 100%; object-fit: cover; }
.am-avatar--sm { width: 24px; height: 24px; font-size: 10.5px; }
.am-avatar--lg { width: 40px; height: 40px; font-size: 15px; }


.am-tip { position: relative; display: inline-flex; }
.am-tip__bubble {
  position: absolute;
  bottom: calc(100% + 7px);
  left: 50%;
  transform: translateX(-50%);
  background: var(--ink-900);
  color: #fff;
  font-size: 12px;
  line-height: 1.35;
  padding: 5px 9px;
  border-radius: var(--radius-sm);
  white-space: nowrap;
  box-shadow: var(--shadow-md);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--dur-fast) var(--ease-standard);
  z-index: 50;
}
.am-tip:hover .am-tip__bubble, .am-tip:focus-within .am-tip__bubble { opacity: 1; }
.am-tip__bubble::after { content: ""; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); border: 4px solid transparent; border-top-color: var(--ink-900); }

.am-field { display: flex; flex-direction: column; gap: 5px; }
.am-field__label { font-size: 12.5px; font-weight: 500; color: var(--text); }
.am-field__req { color: var(--incorrect); margin-left: 2px; }
.am-field__hint { font-size: 12px; color: var(--text-muted); }
.am-field__error { font-size: 12px; color: var(--incorrect); display: flex; align-items: center; gap: 4px; }
.am-field__error svg { width: 13px; height: 13px; flex: none; }

.am-input, .am-select {
  width: 100%;
  height: var(--control-h-md);
  padding: 0 var(--space-3);
  border-radius: var(--radius-md);
  border: 1.5px solid var(--border-strong);
  background: var(--surface);
  color: var(--text);
  font-family: var(--font-sans);
  font-size: 14px;
  transition: border-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard);
}
.am-input::placeholder { color: var(--text-subtle); }
.am-input:hover:not(:disabled), .am-select:hover:not(:disabled) { border-color: var(--ink-400); }
.am-input:focus-visible, .am-select:focus-visible {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--indigo-100);
}
.am-input:disabled, .am-select:disabled { background: var(--surface-sunken); color: var(--text-subtle); cursor: not-allowed; }
.am-input--error, .am-select--error { border-color: var(--incorrect); }
.am-input--error:focus-visible { box-shadow: 0 0 0 3px var(--incorrect-fill); }
.am-input--mono { font-family: var(--font-mono); font-feature-settings: var(--numeric-features); }
textarea.am-input { height: auto; padding: var(--space-2) var(--space-3); line-height: 1.5; resize: vertical; }


.am-select-wrap { position: relative; display: block; }
.am-select { appearance: none; padding-right: 30px; cursor: pointer; }
.am-select-wrap__chev { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); pointer-events: none; color: var(--text-muted); width: 16px; height: 16px; }


.am-num { display: inline-flex; align-items: stretch; border: 1.5px solid var(--border-strong); border-radius: var(--radius-md); background: var(--surface); overflow: hidden; height: var(--control-h-md); transition: border-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard); }
.am-num:focus-within { border-color: var(--primary); box-shadow: 0 0 0 3px var(--indigo-100); }
.am-num__input { width: 48px; border: 0; text-align: center; background: transparent; font-family: var(--font-mono); font-size: 14px; color: var(--text); font-feature-settings: var(--numeric-features); }
.am-num__input:focus { outline: none; }
.am-num__btn { width: 28px; border: 0; background: var(--surface); color: var(--text-muted); cursor: pointer; font-size: 16px; line-height: 1; display: flex; align-items: center; justify-content: center; }
.am-num__btn:hover:not(:disabled) { background: var(--surface-sunken); color: var(--text); }
.am-num__btn:disabled { opacity: 0.4; cursor: not-allowed; }
.am-num__btn--dec { border-right: 1px solid var(--border); }
.am-num__btn--inc { border-left: 1px solid var(--border); }


.am-check { display: inline-flex; align-items: center; gap: 9px; cursor: pointer; font-size: 14px; color: var(--text); user-select: none; }
.am-check input { position: absolute; opacity: 0; width: 0; height: 0; }
.am-check__box {
  width: 18px; height: 18px; flex: none;
  border: 1.5px solid var(--border-strong);
  border-radius: var(--radius-xs);
  background: var(--surface);
  display: inline-flex; align-items: center; justify-content: center;
  color: #fff;
  transition: background var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard);
}
.am-check__box svg { width: 13px; height: 13px; opacity: 0; }
.am-check input:checked + .am-check__box { background: var(--primary); border-color: var(--primary); }
.am-check input:checked + .am-check__box svg { opacity: 1; }
.am-check input:focus-visible + .am-check__box { outline: var(--focus-ring-width) solid var(--focus-ring); outline-offset: 2px; }
.am-check input:disabled + .am-check__box { background: var(--surface-sunken); border-color: var(--border); }
.am-check--radio .am-check__box { border-radius: 50%; }
.am-check--radio .am-check__box .am-dot { width: 8px; height: 8px; border-radius: 50%; background: #fff; opacity: 0; }
.am-check--radio input:checked + .am-check__box { background: var(--primary); border-color: var(--primary); }
.am-check--radio input:checked + .am-check__box .am-dot { opacity: 1; }


.am-switch { display: inline-flex; align-items: center; gap: 9px; cursor: pointer; font-size: 14px; color: var(--text); user-select: none; }
.am-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.am-switch__track { width: 38px; height: 22px; border-radius: var(--radius-pill); background: var(--border-strong); position: relative; transition: background var(--dur-base) var(--ease-standard); flex: none; }
.am-switch__thumb { position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: var(--shadow-sm); transition: transform var(--dur-base) var(--ease-standard); }
.am-switch input:checked + .am-switch__track { background: var(--primary); }
.am-switch input:checked + .am-switch__track .am-switch__thumb { transform: translateX(16px); }
.am-switch input:focus-visible + .am-switch__track { outline: var(--focus-ring-width) solid var(--focus-ring); outline-offset: 2px; }
.am-switch input:disabled + .am-switch__track { opacity: 0.5; }


.am-seg { display: inline-flex; padding: 3px; gap: 2px; background: var(--surface-sunken); border-radius: var(--radius-md); border: 1px solid var(--border); }
.am-seg__opt {
  border: 0; background: transparent; cursor: pointer;
  font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--text-muted);
  height: 28px; padding: 0 12px; border-radius: var(--radius-sm);
  transition: background var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard);
}
.am-seg__opt:hover { color: var(--text); }
.am-seg__opt--active { background: var(--surface); color: var(--text-strong); box-shadow: var(--shadow-xs); }
.am-seg__opt:focus-visible { outline: var(--focus-ring-width) solid var(--focus-ring); outline-offset: 1px; }

.am-usage { display: flex; flex-direction: column; gap: 6px; min-width: 160px; }
.am-usage__top { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); }
.am-usage__label { font-size: 12.5px; color: var(--text-muted); }
.am-usage__nums { font-family: var(--font-mono); font-size: 12.5px; font-weight: 600; color: var(--text); font-feature-settings: var(--numeric-features); }
.am-usage__track { height: 8px; border-radius: var(--radius-pill); background: var(--surface-sunken); overflow: hidden; }
.am-usage__fill { height: 100%; border-radius: var(--radius-pill); background: var(--primary); transition: width var(--dur-slow) var(--ease-out); }
.am-usage__fill--warn { background: var(--review-solid); }
.am-usage__fill--over { background: var(--incorrect-solid); }
.am-usage__note { font-size: 12px; display: flex; align-items: center; gap: 5px; }
.am-usage__note--warn { color: var(--review); }
.am-usage__note--over { color: var(--incorrect); }
.am-usage__note svg { width: 13px; height: 13px; flex: none; }


.am-usage--mini { flex-direction: row; align-items: center; gap: var(--space-2); min-width: 0; }
.am-usage--mini .am-usage__track { width: 84px; }


.am-progress { display: flex; flex-direction: column; gap: 7px; }
.am-progress__top { display: flex; align-items: baseline; justify-content: space-between; }
.am-progress__label { font-size: 13px; color: var(--text); }
.am-progress__count { font-family: var(--font-mono); font-size: 13px; font-weight: 600; color: var(--text-strong); font-feature-settings: var(--numeric-features); }
.am-progress__track { height: 8px; border-radius: var(--radius-pill); background: var(--surface-sunken); overflow: hidden; }
.am-progress__fill { height: 100%; border-radius: var(--radius-pill); background: var(--primary); transition: width var(--dur-slow) var(--ease-out); }
.am-progress__fill--indeterminate { width: 35% !important; animation: am-indet 1.2s var(--ease-standard) infinite; }
@keyframes am-indet { 0% { margin-left: -35%; } 100% { margin-left: 100%; } }


.am-stepper { display: flex; align-items: center; gap: 0; }
.am-step { display: flex; align-items: center; gap: 9px; }
.am-step__dot {
  width: 26px; height: 26px; border-radius: 50%; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--font-mono); font-size: 12px; font-weight: 600;
  border: 1.5px solid var(--border-strong); background: var(--surface); color: var(--text-muted);
}
.am-step__dot svg { width: 14px; height: 14px; }
.am-step--current .am-step__dot { border-color: var(--primary); color: var(--primary); background: var(--primary-subtle); }
.am-step--done .am-step__dot { border-color: var(--primary); background: var(--primary); color: #fff; }
.am-step__label { font-size: 13px; font-weight: 500; color: var(--text-muted); white-space: nowrap; }
.am-step--current .am-step__label, .am-step--done .am-step__label { color: var(--text-strong); }
.am-step__bar { width: 28px; height: 2px; background: var(--border); margin: 0 var(--space-3); flex: none; }
.am-step__bar--done { background: var(--primary); }


.am-toast-region { position: fixed; top: var(--space-4); right: var(--space-4); display: flex; flex-direction: column; gap: var(--space-2); z-index: 100; max-width: 360px; }
.am-toast {
  display: flex; align-items: flex-start; gap: var(--space-3);
  background: var(--surface); border: 1px solid var(--border);
  border-left: 3px solid var(--primary);
  border-radius: var(--radius-md); box-shadow: var(--shadow-lg);
  padding: var(--space-3) var(--space-4);
  font-size: 13.5px; color: var(--text);
}
.am-toast--success { border-left-color: var(--correct-solid); }
.am-toast--error { border-left-color: var(--incorrect-solid); }
.am-toast--warn { border-left-color: var(--review-solid); }
.am-toast__ico { width: 18px; height: 18px; flex: none; margin-top: 1px; }
.am-toast--success .am-toast__ico { color: var(--correct); }
.am-toast--error .am-toast__ico { color: var(--incorrect); }
.am-toast--warn .am-toast__ico { color: var(--review); }
.am-toast--info .am-toast__ico { color: var(--primary); }
.am-toast__body { flex: 1; }
.am-toast__title { font-weight: 600; color: var(--text-strong); }
.am-toast__close { border: 0; background: none; cursor: pointer; color: var(--text-subtle); padding: 0; display: inline-flex; }
.am-toast__close:hover { color: var(--text); }
.am-toast__close svg { width: 15px; height: 15px; }


.am-dialog-overlay { position: fixed; inset: 0; background: rgba(24,31,46,0.42); display: flex; align-items: center; justify-content: center; padding: var(--space-6); z-index: 90; }
.am-dialog {
  background: var(--surface); border-radius: var(--radius-xl);
  box-shadow: var(--shadow-xl); width: 100%; max-width: 460px;
  padding: var(--space-6); border: 1px solid var(--border);
}
.am-dialog__title { font-size: 19px; font-weight: 600; color: var(--text-strong); margin: 0 0 var(--space-2); }
.am-dialog__body { font-size: 14px; color: var(--text); line-height: 1.55; }
.am-dialog__actions { display: flex; justify-content: flex-end; gap: var(--space-2); margin-top: var(--space-6); }


.am-skel { background: var(--surface-sunken); border-radius: var(--radius-sm); position: relative; overflow: hidden; }
.am-skel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.6), transparent); animation: am-shimmer 1.4s infinite; }
@keyframes am-shimmer { 100% { transform: translateX(100%); } }
.am-skel + .am-skel { margin-top: var(--space-2); }

.am-tabs { display: flex; gap: var(--space-1); border-bottom: 1px solid var(--border); }
.am-tab {
  border: 0; background: none; cursor: pointer;
  font-family: var(--font-sans); font-size: 14px; font-weight: 500; color: var(--text-muted);
  padding: 9px 12px; position: relative; margin-bottom: -1px;
  border-bottom: 2px solid transparent;
  transition: color var(--dur-fast) var(--ease-standard);
}
.am-tab:hover { color: var(--text); }
.am-tab--active { color: var(--text-strong); border-bottom-color: var(--primary); }
.am-tab:focus-visible { outline: var(--focus-ring-width) solid var(--focus-ring); outline-offset: -2px; border-radius: var(--radius-xs); }
.am-tab__badge { margin-left: 6px; }


.am-crumbs { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-muted); }
.am-crumbs a { color: var(--text-muted); text-decoration: none; }
.am-crumbs a:hover { color: var(--text); text-decoration: underline; }
.am-crumbs__sep { color: var(--text-subtle); }
.am-crumbs__current { color: var(--text-strong); font-weight: 500; }


.am-pg { display: inline-flex; align-items: center; gap: 3px; }
.am-pg__btn {
  min-width: 32px; height: 32px; padding: 0 8px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid transparent; border-radius: var(--radius-md);
  background: none; cursor: pointer; color: var(--text-muted);
  font-family: var(--font-mono); font-size: 13px; font-feature-settings: var(--numeric-features);
}
.am-pg__btn:hover:not(:disabled) { background: var(--surface-sunken); color: var(--text); }
.am-pg__btn--active { background: var(--primary); color: #fff; }
.am-pg__btn:disabled { opacity: 0.4; cursor: not-allowed; }
.am-pg__btn svg { width: 16px; height: 16px; }
.am-pg__ellipsis { padding: 0 4px; color: var(--text-subtle); }


.am-menu-wrap { position: relative; display: inline-block; }
.am-menu {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 60;
  min-width: 180px; background: var(--surface);
  border: 1px solid var(--border); border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg); padding: var(--space-1);
}
.am-menu__item {
  display: flex; align-items: center; gap: 9px; width: 100%;
  border: 0; background: none; cursor: pointer; text-align: left;
  font-family: var(--font-sans); font-size: 13.5px; color: var(--text);
  padding: 8px 10px; border-radius: var(--radius-sm); text-decoration: none;
}
.am-menu__item:hover { background: var(--surface-sunken); }
.am-menu__item:focus-visible { outline: var(--focus-ring-width) solid var(--focus-ring); outline-offset: -2px; }
.am-menu__item svg { width: 15px; height: 15px; color: var(--text-muted); }
.am-menu__item--danger { color: var(--incorrect); }
.am-menu__item--danger svg { color: var(--incorrect); }
.am-menu__sep { height: 1px; background: var(--divider); margin: var(--space-1) 0; }
.am-menu__label { font-size: 11px; letter-spacing: 0.03em; text-transform: uppercase; color: var(--text-subtle); font-weight: 600; padding: 6px 10px 3px; }


.am-dropzone {
  border: 1.5px dashed var(--border-strong); border-radius: var(--radius-lg);
  background: var(--surface-sunken); padding: var(--space-8) var(--space-6);
  display: flex; flex-direction: column; align-items: center; gap: var(--space-2);
  text-align: center; color: var(--text-muted); cursor: pointer;
  transition: border-color var(--dur-fast) var(--ease-standard), background var(--dur-fast) var(--ease-standard);
}
.am-dropzone:hover, .am-dropzone--active { border-color: var(--primary); background: var(--primary-subtle); }
.am-dropzone__ico { width: 30px; height: 30px; color: var(--primary); }
.am-dropzone__title { font-size: 14px; font-weight: 600; color: var(--text-strong); }
.am-dropzone__hint { font-size: 12.5px; color: var(--text-muted); }

.am-conf {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 8px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--conf-high-border);
  background: var(--conf-high-fill);
  font-family: var(--font-sans);
  line-height: 1;
  white-space: nowrap;
}
.am-conf--low { background: var(--conf-low-fill); border-color: var(--conf-low-border); }
.am-conf__dots { display: inline-flex; gap: 3px; }
.am-conf__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--conf-dot-empty); }
.am-conf__dot--on { background: var(--conf-dot); }
.am-conf--low .am-conf__dot--on { background: var(--conf-low-accent); }
.am-conf__num {
  font-family: var(--font-mono);
  font-size: 11.5px;
  font-weight: 600;
  color: var(--text-muted);
  font-feature-settings: var(--numeric-features);
}
.am-conf--low .am-conf__num { color: var(--conf-low-accent); }
.am-conf__flag { width: 12px; height: 12px; color: var(--conf-low-accent); }
.am-conf--lg { padding: 4px 10px; gap: 7px; }
.am-conf--lg .am-conf__dot { width: 10px; height: 10px; }
.am-conf--lg .am-conf__num { font-size: 13px; }


.am-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px 3px 7px;
  border-radius: var(--radius-pill);
  font-family: var(--font-sans);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.3;
  border: 1px solid transparent;
  white-space: nowrap;
}
.am-pill__ico { width: 14px; height: 14px; flex: none; }
.am-pill--sm { font-size: 11.5px; padding: 2px 8px 2px 6px; }
.am-pill--sm .am-pill__ico { width: 12px; height: 12px; }

.am-pill--correct    { color: var(--correct);    background: var(--correct-fill);    border-color: var(--correct-border); }
.am-pill--partial    { color: var(--review);      background: var(--review-fill);      border-color: var(--review-border); }
.am-pill--incorrect  { color: var(--incorrect);   background: var(--incorrect-fill);   border-color: var(--incorrect-border); }
.am-pill--blank      { color: var(--blank);       background: var(--blank-fill);       border-color: var(--blank-border); }
.am-pill--unreadable { color: var(--unreadable);  background: var(--unreadable-fill);  border-color: var(--unreadable-border); }
.am-pill--info       { color: var(--info);        background: var(--info-fill);        border-color: var(--info-border); }
.am-pill--neutral    { color: var(--blank);       background: var(--blank-fill);       border-color: var(--blank-border); }


.am-pill--processing { color: var(--info); background: var(--info-fill); border-color: var(--info-border); }
.am-pill--committed  { color: #fff; background: var(--primary); border-color: var(--primary); }
.am-pill__spinner { width: 12px; height: 12px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: am-spin 0.7s linear infinite; opacity: 0.85; }
@keyframes am-spin { to { transform: rotate(360deg); } }


.am-crop {
  position: relative;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--surface-sunken);
  border: 1px solid var(--border);
}
.am-crop__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.am-crop--placeholder {
  border: 1.5px dashed var(--border-strong);
  background: repeating-linear-gradient(135deg, var(--surface-sunken) 0 8px, var(--paper-2) 8px 16px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  color: var(--text-muted);
  text-align: center;
  padding: 8px;
}
.am-crop--placeholder svg { width: 18px; height: 18px; opacity: 0.7; }
.am-crop__cite {
  font-family: var(--font-mono);
  font-size: 10.5px;
  font-weight: 500;
  color: var(--text-muted);
}
.am-crop__expand {
  position: absolute;
  top: 5px; right: 5px;
  width: 24px; height: 24px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--radius-sm);
  background: rgba(255,255,255,0.86);
  border: 1px solid var(--border);
  color: var(--text);
  cursor: pointer;
  backdrop-filter: blur(2px);
  transition: background var(--dur-fast) var(--ease-standard);
}
.am-crop__expand:hover { background: #fff; }
.am-crop__expand svg { width: 13px; height: 13px; }
.am-crop__badge {
  position: absolute;
  left: 5px; bottom: 5px;
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--text-muted);
  background: rgba(255,255,255,0.86);
  border: 1px solid var(--border);
  padding: 1px 5px;
  border-radius: var(--radius-xs);
}


.am-review {
  display: grid;
  grid-template-columns: 132px 1fr auto;
  gap: var(--space-5);
  align-items: stretch;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: var(--space-4);
  transition: border-color var(--dur-base) var(--ease-standard), box-shadow var(--dur-base) var(--ease-standard);
}
.am-review--flagged { border-left: 3px solid var(--review-solid); }
.am-review--active { border-color: var(--primary); box-shadow: 0 0 0 1px var(--primary), var(--shadow-md); }
.am-review--resolved { opacity: 0.55; }
.am-review__crop { width: 132px; }
.am-review__body { min-width: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.am-review__head { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.am-review__q { font-size: 13px; font-weight: 600; color: var(--text-strong); }
.am-review__type { font-size: 12px; color: var(--text-muted); }
.am-review__spacer { flex: 1; }
.am-review__label { font-size: 11px; letter-spacing: 0.03em; text-transform: uppercase; font-weight: 600; color: var(--text-subtle); }
.am-review__extracted {
  font-size: 17px;
  font-weight: 500;
  color: var(--text-strong);
  font-family: var(--font-sans);
  word-break: break-word;
}
.am-review__key { font-size: 13px; color: var(--text); }
.am-review__key b { font-family: var(--font-mono); font-weight: 600; color: var(--text-strong); }
.am-review__actions { display: flex; flex-direction: column; gap: var(--space-2); justify-content: center; min-width: 132px; }
.am-review__resolved-tag { display: inline-flex; align-items: center; gap: 5px; align-self: center; color: var(--correct); font-size: 13px; font-weight: 600; }
.am-review__resolved-tag svg { width: 16px; height: 16px; }

@media (max-width: 720px) {
  .am-review { grid-template-columns: 1fr; }
  .am-review__crop { width: 100%; height: 120px; }
  .am-review__actions { flex-direction: row; }
}


.am-bulkbar {
  position: sticky;
  bottom: var(--space-4);
  display: flex;
  align-items: center;
  gap: var(--space-4);
  background: var(--ink-900);
  color: #fff;
  border-radius: var(--radius-lg);
  padding: var(--space-3) var(--space-4);
  box-shadow: var(--shadow-lg);
}
.am-bulkbar__count { font-family: var(--font-mono); font-weight: 600; font-feature-settings: var(--numeric-features); }
.am-bulkbar__spacer { flex: 1; }
.am-bulkbar__actions { display: flex; gap: var(--space-2); }


.am-item { display: grid; grid-template-columns: 36px 1fr 64px; gap: var(--space-3); align-items: center; padding: var(--space-2) 0; }
.am-item__q { font-family: var(--font-mono); font-size: 13px; color: var(--text-muted); font-weight: 600; }
.am-item__track { height: 10px; border-radius: var(--radius-pill); background: var(--surface-sunken); overflow: hidden; }
.am-item__fill { height: 100%; border-radius: var(--radius-pill); background: var(--correct-solid); }
.am-item__fill--low { background: var(--review-solid); }
.am-item__val { font-family: var(--font-mono); font-size: 12.5px; color: var(--text); text-align: right; font-feature-settings: var(--numeric-features); }
.am-item--worst .am-item__q { color: var(--incorrect); }

.am-table-wrap { width: 100%; overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.am-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.am-table thead th {
  text-align: left; font-weight: 600; color: var(--text-muted);
  font-size: 12px; letter-spacing: 0.02em;
  padding: 10px var(--space-4); border-bottom: 1px solid var(--border);
  background: var(--surface); white-space: nowrap;
}
.am-table th.am-table__num, .am-table td.am-table__num { text-align: right; font-family: var(--font-mono); font-feature-settings: var(--numeric-features); }
.am-table tbody td { padding: 10px var(--space-4); border-bottom: 1px solid var(--divider); color: var(--text); vertical-align: middle; }
.am-table tbody tr:last-child td { border-bottom: 0; }
.am-table tbody tr:hover { background: var(--surface-hover); }
.am-table__sort { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; background: none; border: 0; font: inherit; color: inherit; font-weight: 600; }
.am-table__sort svg { width: 13px; height: 13px; opacity: 0.5; }
.am-table__sort--active svg { opacity: 1; color: var(--primary); }
[data-density="compact"] .am-table thead th, [data-density="compact"] .am-table tbody td { padding: 6px var(--space-3); }


.am-kv { display: grid; grid-template-columns: auto 1fr; gap: 7px var(--space-5); align-items: baseline; }
.am-kv__k { font-size: 13px; color: var(--text-muted); }
.am-kv__v { font-size: 13.5px; color: var(--text-strong); font-weight: 500; }
.am-kv__v--mono { font-family: var(--font-mono); font-feature-settings: var(--numeric-features); }