/* E1 - /tooth-chart. Colours come from tokens only; only transform animates (and not under reduced motion). */
.nd-js-only { display: none; }
.js .nd-js-only { display: block; }

.nd-chart { display: grid; gap: 1.25rem; }
.nd-chart__arches { display: grid; gap: 1.25rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .nd-chart__arches { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.nd-arch { margin: 0; background: var(--nd-card); border: 1px solid var(--nd-line); border-radius: var(--nd-r); padding: .85rem .85rem 1rem; }
.nd-arch figcaption { font-weight: 800; color: var(--nd-navy); margin: 0 0 .25rem .25rem; }
.nd-arch__svg { display: block; width: 100%; height: auto; overflow: visible; }
.nd-arch__mid { stroke: var(--nd-line); stroke-width: 1.5; stroke-dasharray: 3 5; }
.nd-arch__side { font: 600 11px var(--nd-font-body); fill: var(--nd-muted); }
.nd-arch__side--end { text-anchor: end; }

.nd-tooth, .nd-tooth:hover { cursor: pointer; outline: none; text-decoration: none; }
.nd-tooth__crown { fill: var(--nd-white); stroke: var(--nd-blue); stroke-width: 2; }
.nd-tooth__groove { fill: none; stroke: var(--nd-blue); stroke-width: 1.4; stroke-linecap: round; opacity: .35; }
.nd-tooth__no { font: 700 14px var(--nd-font-body); fill: var(--nd-ink); text-anchor: middle; dominant-baseline: central; pointer-events: none; user-select: none; }
.nd-tooth__s { transform-box: fill-box; transform-origin: center; transition: transform .16s var(--nd-ease); }
.nd-tooth:hover .nd-tooth__s { transform: scale(1.08); }
.nd-tooth:hover .nd-tooth__crown { fill: var(--nd-surface-alt); }
.nd-tooth:focus-visible .nd-tooth__crown { stroke: var(--nd-red); stroke-width: 4; }
.nd-tooth[aria-current="true"] .nd-tooth__crown { fill: var(--nd-blue); stroke: var(--nd-blue); }
.nd-tooth[aria-current="true"] .nd-tooth__groove { stroke: var(--nd-white); opacity: .55; }
.nd-tooth[aria-current="true"] .nd-tooth__no { fill: var(--nd-white); }
.nd-tooth[aria-current="true"]:focus-visible .nd-tooth__crown { stroke: var(--nd-red); }
@media (prefers-reduced-motion: reduce) { .nd-tooth__s { transition: none; } .nd-tooth:hover .nd-tooth__s { transform: none; } }

.nd-tooth-panel { background: var(--nd-card); border: 1px solid var(--nd-line); border-radius: var(--nd-r); padding: 1.25rem 1.4rem; min-height: 8rem; box-shadow: var(--nd-shadow-1); }
.nd-tooth-panel__empty { margin: 0; color: var(--nd-ink-2); }
.nd-tooth-panel__head { display: flex; align-items: center; gap: 1rem; margin-bottom: .75rem; }
.nd-tooth-panel__no { flex: 0 0 auto; display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: var(--nd-blue); color: var(--nd-white); font-weight: 800; font-size: 1.25rem; }
.nd-tooth-panel h3 { font-size: 1.2rem; margin: 0; }
.nd-tooth-panel__quad { margin: .1rem 0 0; color: var(--nd-muted); font-size: .9rem; }
.nd-tooth-panel__label { font-weight: 700; margin: 1rem 0 .4rem; }
.nd-tooth-panel .btn { margin-top: 1rem; }

.nd-kinds { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(16.5rem, 1fr)); }
.nd-kind__links, .nd-tooth-panel .nd-kind__links { list-style: none; margin: .75rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.nd-kind__links a { min-height: 44px; display: inline-flex; align-items: center; padding: 0 1rem; border: 1px solid var(--nd-line); border-radius: var(--nd-r-pill); background: var(--nd-card); color: var(--nd-blue); font-weight: 600; text-decoration: none; }
.nd-kind__links a:hover { border-color: var(--nd-blue); }

.nd-tlists { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr)); }
.nd-tlist { list-style: none; margin: 0; padding: 0; }
.nd-tlist li { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr) auto; gap: .6rem; align-items: center; padding: .35rem .5rem; border-radius: var(--nd-r-sm); }
.nd-tlist li + li { border-top: 1px solid var(--nd-line); }
.nd-tlist li:target, .nd-tlist li.is-on { background: var(--nd-surface-alt); }
.nd-tlist__no { font-weight: 800; color: var(--nd-blue); }
.nd-tlist__book { min-height: 44px; display: inline-flex; align-items: center; padding: 0 .6rem; font-weight: 600; }