/* Scoped UI; inherits Weshah host tokens and font. No external assets. */
.unit-nav {
  --unit-paper: var(--panel, #faf8f3);
  --unit-bg: var(--bg, #f0ede6);
  --unit-ink: var(--ink, #292f2a);
  --unit-muted: var(--muted, #66675c);
  --unit-line: var(--line, #d0cabd);
  --unit-accent: var(--accent, #596447);
  --unit-active: var(--active, #e0e5d7);
  min-width: 0; border: 1px solid var(--unit-line); border-radius: 15px;
  padding: 18px; background: var(--unit-paper); color: var(--unit-ink);
  font: inherit; line-height: 1.7; text-align: start; direction: rtl;
}
html[data-theme='dark'] .unit-nav, .unit-nav[data-theme='dark'] {
  --unit-paper: var(--panel, #27302a); --unit-bg: var(--bg, #1d2420);
  --unit-ink: var(--ink, #f0eee5); --unit-muted: var(--muted, #c3c7b9);
  --unit-line: var(--line, #515d50); --unit-accent: var(--accent, #c0cda9);
  --unit-active: var(--active, #414e39);
  color-scheme: dark;
}
.unit-nav *, .unit-nav *::before, .unit-nav *::after {box-sizing: border-box;}
.unit-nav [hidden] {display: none !important;}
.unit-nav p {margin: 0;}
.unit-nav__header {display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; margin-block-end: 10px;}
.unit-nav__title {font-size: 1.15rem; line-height: 1.5; margin: 0;}
.unit-nav__floor {font-size: .82rem; color: var(--unit-accent);}
.unit-nav__notice {border-inline-start: 3px solid var(--unit-accent); padding-inline-start: 10px; font-size: .78rem; color: var(--unit-muted);}
.unit-nav__search-label {display: grid; gap: 5px; font-size: .78rem; margin-block-start: 16px;}
.unit-nav .unit-nav__search {
  appearance: none; width: 100%; min-width: 0; min-height: 44px; border: 1px solid var(--unit-line);
  border-radius: 9px; background: var(--unit-bg); color: var(--unit-ink); font: inherit; padding: 9px 12px;
}
.unit-nav .unit-nav__search::placeholder {color: var(--unit-muted); opacity: 1;}
.unit-nav__results {font-size: .73rem; color: var(--unit-muted); padding-block: 8px;}
.unit-nav__list {display: grid; gap: 7px; max-height: 360px; overflow: auto; overscroll-behavior: contain; padding: 4px; margin: -4px; scrollbar-gutter: stable;}
.unit-nav .unit-nav__button {
  appearance: none; min-height: 44px; min-width: 44px; font: inherit; font-size: .78rem; line-height: 1.6;
  padding: 9px 12px; margin: 0; border: 1px solid var(--unit-line); border-radius: 9px;
  color: var(--unit-ink); background: var(--unit-paper); cursor: pointer; text-align: center;
  overflow-wrap: anywhere;
}
.unit-nav .unit-nav__button:hover {border-color: var(--unit-accent);}
.unit-nav .unit-nav__button[aria-pressed='true'] {border-color: var(--unit-accent); background: var(--unit-active);}
.unit-nav .unit-nav__button:focus-visible, .unit-nav .unit-nav__search:focus-visible,
.unit-nav .unit-nav__title:focus-visible, .unit-nav summary:focus-visible {outline: 3px solid var(--unit-accent); outline-offset: 2px;}
.unit-nav .unit-nav__button:disabled, .unit-nav .unit-nav__search:disabled {opacity: .5; cursor: not-allowed;}
.unit-nav .unit-nav__unit {display: grid; gap: 3px; text-align: start; width: 100%; padding: 10px 12px;}
.unit-nav__unit-label, .unit-nav__label {font-size: .84rem; font-weight: 600; overflow-wrap: anywhere;}
.unit-nav__code {display: block; font-size: .73rem; color: var(--unit-accent);}
.unit-nav__code bdi {font-weight: 700; letter-spacing: .025em; font-size: .85rem; white-space: nowrap;}
.unit-nav__muted {font-size: .75rem; color: var(--unit-muted); overflow-wrap: anywhere;}
.unit-nav__selection {margin-block: 16px;}
.unit-nav__empty {font-size: .8rem; color: var(--unit-muted); border: 1px dashed var(--unit-line); padding: 14px; border-radius: 10px;}
.unit-nav__card {min-width: 0; border: 1px solid var(--unit-line); border-radius: 12px; padding: 14px; background: var(--unit-bg);}
.unit-nav__subtitle {font-size: .95rem; line-height: 1.6; margin: 0 0 9px;}
.unit-nav__card > .unit-nav__label {margin-block-start: 4px;}
.unit-nav__facts {display: grid; grid-template-columns: minmax(70px, .85fr) minmax(0, 1.4fr); gap: 5px 12px; margin: 12px 0; font-size: .76rem;}
.unit-nav__facts dt {color: var(--unit-muted);}
.unit-nav__facts dd {margin: 0; overflow-wrap: anywhere;}
.unit-nav__actions {display: flex; flex-wrap: wrap; gap: 6px; margin-block-start: 12px;}
.unit-nav__actions > .unit-nav__button {flex: 1 1 auto;}
.unit-nav__compare {border-block-start: 1px solid var(--unit-line); padding-block-start: 16px;}
.unit-nav__compare-cards {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-block-start: 12px;}
.unit-nav__compare-card {display: flex; flex-direction: column; padding: 12px;}
.unit-nav__compare-card .unit-nav__facts {display: block; flex: 1;}
.unit-nav__compare-card .unit-nav__facts dt {margin-block-start: 7px;}
.unit-nav__compare-card .unit-nav__facts dd {margin-block-start: 1px;}
.unit-nav__placeholder {justify-content: center; text-align: center; min-height: 130px; border-style: dashed;}
.unit-nav__compare-status {font-size: .75rem; color: var(--unit-muted); padding-block-start: 9px;}
.unit-nav__thumbnail {margin: 12px 0 0; padding: 8px; background: #fff; border: 1px solid var(--unit-line); border-radius: 8px;}
.unit-nav__thumbnail svg {display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; direction: ltr; overflow: visible;}
.unit-nav__shape {fill: var(--unit-active); stroke: var(--unit-accent); stroke-width: 1.8; stroke-linejoin: round; vector-effect: non-scaling-stroke;}
.unit-nav__shape--source {fill: #728348; fill-opacity: .08; stroke: #396222;}
.unit-nav__thumbnail figcaption {font-size: .65rem; color: #5b6054; text-align: center; margin-block-start: 4px;}
.unit-nav__limitations {margin-block-start: 14px; padding-block-start: 12px; border-block-start: 1px solid var(--unit-line); font-size: .78rem;}
.unit-nav__limitations summary {cursor: pointer; min-height: 32px;}
.unit-nav__notes {margin: 8px 0; padding-inline-start: 18px; font-size: .74rem; color: var(--unit-muted); overflow-wrap: anywhere;}
.unit-nav__notes li {margin-block: 5px;}
@media (max-width: 520px) {
  .unit-nav {padding: 13px; border-radius: 12px;}
  .unit-nav__compare-cards {gap: 7px;}
  .unit-nav__compare-card {padding: 9px;}
  .unit-nav__compare-card .unit-nav__code {display: block; font-size: .66rem;}
  .unit-nav__compare-card .unit-nav__code bdi {display: block;}
  .unit-nav__compare-card .unit-nav__button {padding-inline: 8px; font-size: .72rem;}
}
@media (max-width: 340px) {.unit-nav__compare-cards {grid-template-columns: 1fr;}}
@media (prefers-reduced-motion: reduce) {
  .unit-nav *, .unit-nav *::before, .unit-nav *::after {animation: none !important; transition: none !important; scroll-behavior: auto !important;}
}
@media (forced-colors: active) {.unit-nav__shape {fill: Canvas; stroke: CanvasText;} .unit-nav .unit-nav__button[aria-pressed='true'] {border: 2px solid Highlight;}}

.unit-nav__count-note {font-size: .72rem; color: var(--unit-muted); padding-block-start: 8px;}
