.name-tool-panel { width: min(100% - 2rem, 760px); margin: 0 auto; padding: 2rem; border: 1px solid #d7cbb9; border-radius: 16px; background: #fffdf8; color: #25231f; }
.name-tool-panel h2, .name-tool-panel h3 { margin-bottom: 1rem; }
.name-tool-panel p { margin: 1rem 0; line-height: 1.7; }
.name-tool-panel form { display: grid; gap: 1rem; margin: 1.5rem 0; }
.name-tool-panel label { display: grid; gap: .5rem; font-weight: 600; }
.name-tool-panel input, .name-tool-panel select { width: 100%; min-height: 48px; font: inherit; color: #25231f; background: white; border: 1px solid #8d8171; border-radius: 8px; padding: .7rem; }
.name-tool-panel input:focus-visible, .name-tool-panel select:focus-visible, .name-tool-panel summary:focus-visible { outline: 3px solid #866234; outline-offset: 3px; }
.name-tool-panel button:disabled { opacity: .6; cursor: wait; }
.name-tool-panel input[name="name"]::placeholder { color: #b5b8bf; font-weight: 400; opacity: 1; }
.name-tool-panel li { margin: .5rem 0 .5rem 1.2rem; line-height: 1.6; }
.name-tool-card { margin: 1rem 0; padding: 1.3rem; border: 1px solid #d7cbb9; border-radius: 10px; }
.name-tool-checklist { margin-bottom: 2rem; }
.name-tool-checklist summary { cursor: pointer; font-weight: 600; }
.name-tool-panel [hidden] { display: none !important; }
.name-checker-actions { display: flex; flex-wrap: wrap; gap: 1rem; margin: 1.5rem 0; }
.name-checker-actions .btn { white-space: normal; text-align: center; }
.name-tool-panel [data-birth-step] { margin-top: 2rem; border-top: 1px solid #d7cbb9; padding-top: 1.5rem; }
.name-tool-panel [data-birth-match] { gap: .5rem; }
.name-tool-panel [data-birth-match] .form-group { min-width: 0; margin-bottom: .7rem; }
.name-tool-panel [data-birth-match] .form-label { display: block; }
.name-tool-checklist .checklist-tool { padding: 1rem 0; }
@media (max-width: 600px) { .name-tool-panel { padding: 1.25rem; } }

/* Name analysis: readable conclusions, distinct reference and traditional layers. */
.name-tool-panel [data-tool-result], .name-tool-panel [data-birth-result] { color: #292c35; font-family: Inter, sans-serif; font-size: 16px; }
.name-tool-panel .checker-result-card { margin: 1.2rem 0; padding: 1.35rem; border: 1px solid #dedbd2; border-radius: 12px; background: #fff; }
.name-tool-panel .checker-result-card h3 { font-family: Inter, sans-serif; font-size: 1.05rem; font-weight: 650; color: #25263b; letter-spacing: 0; text-transform: none; line-height: 1.45; }
.name-tool-panel .checker-result-card p, .name-tool-panel .checker-result-card li { color: #303643; font-size: 1rem; line-height: 1.75; }
.name-tool-panel .checker-verdict { border-color: #c7d8ce; background: #f1f7f3; }
.name-tool-panel .verdict-clarify, .name-tool-panel .verdict-consider_adjustment, .name-tool-panel .checker-concerns { border-color: #e0cdab; background: #fff8eb; }
.name-tool-panel .checker-traditional { border-color: #d9cba6; background: #faf6e9; }
.name-tool-panel .checker-reference { background: #f6f6f3; }
.name-tool-panel p.checker-method-note, .name-tool-panel .checker-method-note, .name-tool-panel .checker-method-note p { color: #535b69; font-size: .875rem; line-height: 1.65; }
.name-tool-panel [data-tool-status], .name-tool-panel [data-birth-status] { color: #384550; font-size: .9rem; }
.name-tool-panel [data-birth-step] > h3 { font-family: Inter, sans-serif; font-size: 1.25rem; text-transform: none; letter-spacing: 0; color: #292c35; }
.name-tool-panel [data-open-birth] { width: 100%; }
.checker-next-actions .btn { flex: 1; }
.checker-next-actions [data-open-birth] { width: auto; }
.name-tool-panel [data-personal-intro] { max-width: 64ch; }
@media (max-width: 600px) { .name-tool-panel .checker-result-card { padding: 1rem; } .name-checker-actions .btn { width: 100%; } }
.name-tool-panel > p, .name-tool-panel [data-birth-step] > p, .name-tool-panel [data-birth-fields] form > p { color: #535b69; }
.name-tool-panel [data-birth-result] { scroll-margin-top: 95px; }
.name-tool-panel .checker-help, .name-tool-panel #checker-help { font-family: Inter, sans-serif; font-size: 13px; line-height: 1.6; color: #59606a; margin: .65rem 0 1rem; }
.name-tool-panel .checker-name-heading { font-family: 'Noto Serif SC', serif; font-size: 2rem; letter-spacing: .1em; margin: 2rem 0 .4rem; color: #26283b; }
.name-tool-panel .checker-pronunciation { margin: 0 0 1.5rem; color: #5a606a; font-size: 1rem; }
.name-tool-panel .checker-literal { font-weight: 600; }
.name-tool-panel .checker-style-note { padding-top: .8rem; border-top: 1px solid #e1d5bf; color: #6b5129; }
.name-tool-panel .checker-element-direction { color: #715322; font-size: 1.2rem; font-weight: 600; }
.checker-radar-wrapper { display: flex; justify-content: center; padding: .5rem 0; }
.checker-radar-wrapper canvas { width: 260px; max-width: 100%; height: auto; aspect-ratio: 1; }
.checker-character-table { width: 100%; border-collapse: collapse; text-align: left; font-size: 14px; }
.checker-character-table th, .checker-character-table td { padding: .8rem .6rem; border-bottom: 1px solid #dedbd2; vertical-align: top; line-height: 1.6; }
.checker-character-table thead th { font-weight: 500; color: #59606a; font-size: 12px; }
.checker-character-table tbody th { width: 20%; font-weight: 400; }
.checker-character-table tbody th strong { display: block; font-family: 'Noto Serif SC', serif; font-size: 1.25rem; font-weight: 600; }
.checker-character-table small { display: block; color: #59606a; }
.checker-character-table td:last-child { width: 26%; }
.checker-character-table tr:last-child td, .checker-character-table tr:last-child th { border-bottom: 0; }
.checker-about { margin-top: 1.5rem; border-top: 1px solid #d7cbb9; padding-top: 1rem; }
.checker-about summary { cursor: pointer; }
.checker-sources { margin-top: .8rem; }
.name-tool-panel .checker-generator-value { padding: 1.6rem; background: #f7efdc; border-color: #ccb98b; }
.name-tool-panel .checker-generator-value h3 { font-family: Cinzel, serif; font-size: 1.3rem; line-height: 1.5; color: #26283b; }
.name-tool-panel .checker-generator-value > p:first-of-type { font-size: 1.05rem; }
.checker-value-inputs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 1.4rem 0; }
.checker-value-inputs strong, .checker-value-inputs span { display: block; }
.checker-value-inputs strong { font-size: .9rem; color: #65481f; margin-bottom: .3rem; }
.checker-value-inputs span { font-size: .8125rem; line-height: 1.6; color: #484442; }
.checker-generator-value .name-checker-actions { margin-bottom: .8rem; }
.checker-generator-value .btn-primary { flex: 1; }
.name-tool-panel details a { text-decoration: underline; color: #715322; }
@media (max-width: 600px) { .checker-character-table th, .checker-character-table td { padding: .65rem .3rem; font-size: 13px; } .checker-character-table thead th { font-size: 12px; } }
@media (prefers-reduced-motion: reduce) { .name-tool-panel { scroll-behavior: auto; } }
@media (max-width: 600px) { .checker-value-inputs { grid-template-columns: 1fr; gap: .8rem; } .name-tool-panel .checker-generator-value { padding: 1.1rem; } }