/* THC Names — uses the child theme's palette tokens (same fallbacks as the Range Finder). The child theme may restyle any .thc-nd class. */

.thc-nd, .thc-say {
  --nd-canvas: var(--wp--preset--color--base, #f7f1e4);
  --nd-raised: var(--wp--preset--color--accent-5, #fcf8ef);
  --nd-muted: var(--wp--preset--color--accent-4, #ece4d9);
  --nd-border: var(--wp--preset--color--accent-6, #d9d0bc);
  --nd-text: var(--wp--preset--color--contrast, #332d25);
  --nd-leaf: var(--wp--preset--color--accent-1, #5e7d53);
  --nd-deep: var(--wp--preset--color--accent-3, #3f5c3b);
  --nd-sage: var(--wp--preset--color--accent-2, #a8b79a);
  --nd-stroke: var(--wp--preset--color--control-stroke, #8a7f66);
  --nd-warn: #8a5a1f;
  --nd-radius: 12px;
}
.thc-nd { color: var(--nd-text); margin-block: var(--wp--preset--spacing--md, 1rem) 0; }
.thc-nd__lead { margin: 0 0 var(--wp--preset--spacing--md, 1rem); font-size: var(--wp--preset--font-size--large, 1.25rem); }
.thc-nd__small { font-size: var(--wp--preset--font-size--small, .875rem); color: var(--nd-deep); }

/* ---------- form ---------- */
.thc-nd__form { position: relative; background: var(--nd-raised); border: 1px solid var(--nd-border); border-radius: var(--nd-radius); padding: var(--wp--preset--spacing--lg, 1.25rem); }
.thc-nd__label { display: block; font-size: var(--wp--preset--font-size--small, .875rem); font-weight: 600; color: var(--nd-deep); margin-bottom: .35rem; }
.thc-nd__row { display: flex; flex-wrap: wrap; gap: .6rem; }
.thc-nd__row input { flex: 1 1 14rem; min-width: 0; font: inherit; color: inherit; background: var(--nd-canvas); border: 1px solid var(--nd-stroke); border-radius: 10px; padding: .6em .85em; box-sizing: border-box; }
.thc-nd input:focus-visible, .thc-nd textarea:focus-visible, .thc-nd button:focus-visible, .thc-nd summary:focus-visible, .thc-nd a:focus-visible, .thc-say__btn:focus-visible, .thc-nd__card:focus-visible { outline: 2px solid var(--nd-leaf); outline-offset: 2px; }
.thc-nd__card:focus { outline: none; }
.thc-nd__btn { font: inherit; font-weight: 600; border: 1px solid var(--nd-leaf); background: var(--nd-leaf); color: #fff; border-radius: 999px; padding: .6em 1.3em; cursor: pointer; white-space: nowrap; }
.thc-nd__btn:hover { background: var(--nd-deep); border-color: var(--nd-deep); }
.thc-nd__btn--ghost { background: transparent; color: var(--nd-deep); border-color: var(--nd-stroke); }
.thc-nd__btn--ghost:hover, .thc-nd__btn--ghost[aria-pressed="true"] { background: var(--nd-muted); color: var(--nd-deep); }
.thc-nd__btn--ghost[aria-pressed="true"] { border-color: var(--nd-deep); }
.thc-nd__suggest { list-style: none; margin: .3rem 0 0; padding: .3rem; position: absolute; left: var(--wp--preset--spacing--lg, 1.25rem); right: var(--wp--preset--spacing--lg, 1.25rem); z-index: 20; background: var(--nd-canvas); border: 1px solid var(--nd-stroke); border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.12); max-height: 22rem; overflow: auto; }
.thc-nd__suggest li { padding: .5rem .6rem; border-radius: 8px; cursor: pointer; overflow-wrap: anywhere; }
.thc-nd__suggest li[aria-selected="true"], .thc-nd__suggest li:hover { background: var(--nd-muted); }
.thc-nd__try { margin: .8rem 0 0; font-size: var(--wp--preset--font-size--small, .875rem); color: var(--nd-deep); }
.thc-nd__chip, .thc-nd__try button { font: inherit; font-size: .95em; border: 1px solid var(--nd-border); background: var(--nd-canvas); color: inherit; border-radius: 999px; padding: .2em .75em; margin: .15em .1em; cursor: pointer; }
.thc-nd__chip:hover, .thc-nd__try button:hover { border-color: var(--nd-stroke); background: var(--nd-muted); }

/* ---------- card ---------- */
.thc-nd__result { margin-top: var(--wp--preset--spacing--lg, 1.5rem); scroll-margin-top: 5rem; }
.thc-nd__card { background: var(--nd-raised); border: 1px solid var(--nd-border); border-radius: var(--nd-radius); padding: var(--wp--preset--spacing--lg, 1.25rem); scroll-margin-top: 5rem; }
.thc-nd__title { margin: 0 0 .2em; font-size: clamp(1.5rem, 5vw, 2.2rem); line-height: 1.15; overflow-wrap: anywhere; }
.thc-nd__eng { margin: 0; color: var(--nd-deep); }
.thc-nd__fam { color: var(--nd-deep); }
.thc-nd__exotic { display: inline-block; font-size: .8em; border: 1px solid var(--nd-stroke); border-radius: 999px; padding: 0 .6em; margin-left: .3em; }
.thc-nd__via { margin: .4em 0 0; font-size: var(--wp--preset--font-size--small, .875rem); }
.thc-nd__h { font-size: var(--wp--preset--font-size--medium, 1.1rem); margin: 1.4rem 0 .5rem; color: var(--nd-deep); text-transform: none; }
.thc-nd__say { border-top: 1px solid var(--nd-border); margin-top: 1rem; }
.thc-nd__resp { font-size: clamp(1.35rem, 4.4vw, 1.9rem); line-height: 1.35; margin: .2rem 0 .8rem; letter-spacing: .01em; overflow-wrap: anywhere; }
.thc-nd__resp b { font-weight: 800; color: var(--nd-deep); }
.thc-nd__dash { color: var(--nd-stroke); margin: 0 .03em; }
.thc-nd__gap { display: inline-block; width: .5em; }
.thc-nd__rw { white-space: nowrap; }
.thc-nd__rw.is-none { color: var(--nd-deep); }
.thc-nd__controls { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .6rem; }
.thc-nd__play[data-playing] span, .thc-nd__mini[data-playing] span, .thc-say__btn[data-playing] span { display: inline-block; animation: thc-nd-pulse 1s ease-in-out infinite; }
@keyframes thc-nd-pulse { 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .thc-nd__play[data-playing] span, .thc-nd__mini[data-playing] span, .thc-say__btn[data-playing] span { animation: none; } }
.thc-nd__how { margin: .3rem 0; font-size: var(--wp--preset--font-size--small, .875rem); color: var(--nd-deep); }
.thc-nd__alts { margin-top: .6rem; }
.thc-nd__alts summary, .thc-nd__report summary, .thc-nd__panel > summary { cursor: pointer; font-weight: 600; color: var(--nd-deep); }
.thc-nd__k2 { margin: .7rem 0 .2rem; font-weight: 600; font-size: var(--wp--preset--font-size--small, .875rem); }
.thc-nd__altlist { margin: 0; padding-left: 1.1rem; }
.thc-nd__classic { margin: 0; font-size: 1.1rem; }
.thc-nd__mini { font: inherit; font-size: .8rem; line-height: 1; border: 1px solid var(--nd-stroke); background: var(--nd-canvas); color: var(--nd-deep); border-radius: 999px; min-width: 2rem; min-height: 2rem; padding: .3em .55em; cursor: pointer; vertical-align: middle; }
.thc-nd__mini:hover { background: var(--nd-muted); }
.thc-nd__mean { border-top: 1px solid var(--nd-border); margin-top: 1.2rem; }
.thc-nd__together { margin: .2rem 0 .8rem; font-size: 1.1rem; }
.thc-nd__word { padding: .8rem 0; border-bottom: 1px dashed var(--nd-border); }
.thc-nd__word:last-child { border-bottom: 0; }
.thc-nd__wh { margin: 0 0 .3rem; font-size: 1.15rem; display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; }
.thc-nd__wl { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--nd-deep); background: color-mix(in srgb, var(--nd-sage) 28%, var(--nd-raised)); border: 1px solid var(--nd-border); border-radius: 6px; padding: .1em .5em; }
.thc-nd__gloss { margin: .1rem 0 .4rem; font-size: 1.1rem; font-weight: 600; }
.thc-nd__parts { margin: 0 0 .4rem; padding-left: 1.1rem; }
.thc-nd__parts li { margin: .15rem 0; }
.thc-nd__piece { font-weight: 600; }
.thc-nd__root { font: inherit; font-weight: 600; border: 0; border-bottom: 1px dashed var(--nd-leaf); background: none; color: var(--nd-deep); padding: 0; cursor: pointer; }
.thc-nd__src { color: var(--nd-deep); font-size: .92em; }
.thc-nd__honors { margin: .3rem 0; }
.thc-nd__k { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--nd-deep); margin-right: .35em; }
.thc-nd__who { color: var(--nd-deep); }
.thc-nd__note { margin: .3rem 0; }
.thc-nd__tier { margin: .5rem 0 0; font-size: var(--wp--preset--font-size--small, .875rem); border-radius: 8px; padding: .4em .7em; }
.thc-nd__tier.is-checked { background: color-mix(in srgb, var(--nd-sage) 30%, var(--nd-raised)); border: 1px solid var(--nd-sage); }
.thc-nd__tier.is-draft { background: var(--nd-canvas); border: 1px dashed var(--nd-stroke); }
.thc-nd__tier.is-auto { background: var(--nd-canvas); border: 1px dashed var(--nd-warn); }
@supports not (color: color-mix(in srgb, red 50%, blue)) { .thc-nd__tier.is-checked { background: #e8ecdf; } }
.thc-nd__list ul { margin: 0; padding-left: 1.1rem; columns: 2 16rem; }
.thc-nd__list li { break-inside: avoid; margin: .15rem 0; }
.thc-nd__link { font: inherit; border: 0; background: none; padding: 0; color: var(--nd-deep); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.thc-nd__more { margin: 1rem 0 0; }
.thc-nd__more a { color: var(--nd-deep); }
.thc-nd__foot { display: flex; flex-wrap: wrap; align-items: flex-start; gap: .8rem 1rem; border-top: 1px solid var(--nd-border); margin-top: 1.2rem; padding-top: 1rem; }
.thc-nd__report { flex: 1 1 16rem; }
.thc-nd__rform { display: grid; gap: .4rem; margin-top: .6rem; }
.thc-nd__rform textarea, .thc-nd__rform input[type="email"] { font: inherit; color: inherit; background: var(--nd-canvas); border: 1px solid var(--nd-stroke); border-radius: 10px; padding: .5em .7em; width: 100%; box-sizing: border-box; }
.thc-nd__rform label { font-size: var(--wp--preset--font-size--small, .875rem); font-weight: 600; color: var(--nd-deep); }
.thc-nd__rform .thc-nd__btn { justify-self: start; }
.thc-nd__hp { position: absolute !important; left: -9999px !important; }
.thc-nd__rstatus { margin: 0; font-size: var(--wp--preset--font-size--small, .875rem); }

/* ---------- who calls it what, other names, worldwide (ITIS) ---------- */
.thc-nd__auth { font-size: .5em; font-weight: 400; color: var(--nd-deep); white-space: nowrap; }
.thc-nd__refs, .thc-nd__names { border-top: 1px solid var(--nd-border); margin-top: 1.2rem; padding-top: .9rem; }
.thc-nd__refs > summary, .thc-nd__names > summary, .thc-nd__allsp > summary { cursor: pointer; font-weight: 600; color: var(--nd-deep); }
.thc-nd__refs > summary, .thc-nd__names > summary { font-size: var(--wp--preset--font-size--medium, 1.1rem); }
.thc-nd__reft { width: 100%; border-collapse: collapse; margin: .7rem 0 .4rem; }
.thc-nd__reft th, .thc-nd__reft td { text-align: left; vertical-align: top; padding: .55rem .6rem; border-top: 1px solid var(--nd-border); }
.thc-nd__reft tr:first-child th, .thc-nd__reft tr:first-child td { border-top: 0; }
.thc-nd__reft th { width: 9.5rem; font-weight: 700; color: var(--nd-deep); }
.thc-nd__reft td p { margin: 0 0 .25rem; }
.thc-nd__reft td p:last-child { margin-bottom: 0; }
.thc-nd__reft tr.is-diff td { background: color-mix(in srgb, var(--nd-sage) 18%, var(--nd-raised)); border-radius: 8px; }
@supports not (color: color-mix(in srgb, red 50%, blue)) { .thc-nd__reft tr.is-diff td { background: #eef0e6; } }
.thc-nd__rsub { display: block; font-weight: 400; font-size: .8rem; line-height: 1.3; }
.thc-nd__names p { margin: .5rem 0; overflow-wrap: anywhere; }
.thc-nd__allsp { margin-top: .5rem; }
.thc-nd__wslot:empty { display: none; }
.thc-nd__cite { margin-top: 1rem; }
@media (max-width: 480px) {
  .thc-nd__reft, .thc-nd__reft tbody, .thc-nd__reft tr, .thc-nd__reft th, .thc-nd__reft td { display: block; width: auto; }
  .thc-nd__reft th { padding-bottom: .1rem; }
  .thc-nd__reft td { border-top: 0; padding-top: .2rem; }
}

/* ---------- panels ---------- */
.thc-nd__panel { margin-top: var(--wp--preset--spacing--lg, 1.5rem); background: var(--nd-raised); border: 1px solid var(--nd-border); border-radius: var(--nd-radius); padding: .9rem 1.1rem; }
.thc-nd__panel[open] > summary { margin-bottom: .6rem; }
.thc-nd__rules { margin: 0; padding-left: 1.2rem; }
.thc-nd__rules li { margin: .45rem 0; }
.thc-nd__bh { margin: .8rem 0 .2rem; font-size: 1rem; }
.thc-nd__chips { margin: 0; }
.thc-nd__rootbox { margin-top: 1rem; background: var(--nd-raised); border: 1px solid var(--nd-border); border-radius: var(--nd-radius); padding: .9rem 1.1rem; }
.thc-nd__rootbox:focus { outline: 2px solid var(--nd-leaf); outline-offset: 2px; }
.thc-nd__about { margin-top: var(--wp--preset--spacing--lg, 1.5rem); font-size: var(--wp--preset--font-size--small, .875rem); color: var(--nd-deep); }
.thc-nd__about p { margin: .4rem 0; }

/* ---------- inline [thc_say] ---------- */
.thc-say { white-space: nowrap; }
.thc-say__resp { font-style: normal; color: var(--nd-deep); font-size: .92em; }
.thc-say__resp b { font-weight: 800; }
.thc-say__btn { font: inherit; font-size: .75em; line-height: 1; border: 1px solid var(--nd-stroke); background: var(--nd-canvas); color: var(--nd-deep); border-radius: 999px; min-width: 1.9em; min-height: 1.9em; padding: .25em .5em; cursor: pointer; vertical-align: .1em; }

@media (max-width: 480px) {
  .thc-nd__form, .thc-nd__card { padding: 1rem; }
  .thc-nd__row .thc-nd__btn { flex: 1 1 100%; }
}
