.tool{max-width:72rem;margin:0 auto;padding:1.5rem 1rem 3rem}.tool__title{color:var(--color-heading);text-align:center;margin-bottom:1.25rem;font-size:1.5rem;font-weight:700}.tool__label{color:var(--color-body);margin-bottom:.5rem;font-size:.875rem;font-weight:600;display:block}.tool__section{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:1.25rem}.tool :is(input,select,textarea,button):focus-visible{box-shadow:var(--focus-ring);border-color:var(--color-primary-500);outline:none}.kanji{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:1.25rem}.kanji__loading{color:var(--color-warning-700);background-color:var(--color-warning-50);border:1px solid var(--color-warning-700);border-radius:var(--radius-field);align-items:center;gap:.625rem;margin-bottom:1rem;padding:.75rem 1rem;font-size:.875rem;display:flex}.kanji__error{color:var(--color-danger-600);background-color:var(--color-danger-50);border:1px solid var(--color-danger-600);border-radius:var(--radius-field);margin-bottom:1rem;padding:.75rem 1rem;font-size:.875rem}.kanji__spinner{border:2px solid color-mix(in srgb, var(--color-warning-700) 30%, transparent);border-top-color:var(--color-warning-700);border-radius:9999px;flex-shrink:0;width:1.125rem;height:1.125rem;animation:.7s linear infinite tool-spin}@keyframes tool-spin{to{transform:rotate(360deg)}}.kanji__grid{grid-template-columns:1fr;gap:1.25rem;display:grid}@media (width>=1024px){.kanji__grid{grid-template-columns:1fr 1fr}}.kanji__col{flex-direction:column;min-width:0;display:flex}.kanji__output-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.5rem;display:flex}.kanji__output-head .tool__label{margin-bottom:0}.kanji__type{color:var(--color-muted);align-items:center;gap:.5rem;font-size:.875rem;display:flex}.kanji__input{width:100%;min-height:220px;color:var(--color-body);background-color:var(--color-surface);border:1px solid var(--color-border-strong);border-radius:var(--radius-field);resize:vertical;padding:.75rem;font-size:max(1rem,16px)}.kanji__input:disabled{background-color:var(--color-surface-muted);cursor:not-allowed}.kanji__select{color:var(--color-body);background-color:var(--color-surface);border:1px solid var(--color-border-strong);border-radius:var(--radius-field);min-height:44px;padding:.4rem .5rem;font-size:max(.9rem,16px)}.kanji__output{width:100%;min-height:220px;color:var(--color-body);background-color:var(--color-surface-muted);border:1px solid var(--color-border-strong);border-radius:var(--radius-field);word-break:break-word;padding:.75rem;font-size:max(1rem,16px);overflow-y:auto}.kanji__output-text{background-color:var(--color-surface-muted)}.kanji__copy{align-self:flex-end;min-height:44px;margin-top:.5rem;padding:.5rem 1rem;font-size:.875rem}.kanji__convert-wrap{justify-content:center;margin-top:1.5rem;display:flex}.kanji__convert-wrap .btn{min-width:12rem;min-height:44px}.calc{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:1.25rem}.calc__head{grid-template-columns:1fr 1fr;gap:.5rem;margin-bottom:.75rem;display:grid}.calc__head-cell{text-align:center;color:var(--color-heading);font-size:1.125rem;font-weight:600}.calc__row{grid-template-columns:1fr 1fr;gap:.5rem;margin-bottom:.5rem;display:grid}.calc__field{justify-content:center;align-items:center;gap:.5rem;display:flex}.calc__icon{width:1.25rem;height:1.25rem;color:var(--color-primary-600);flex-shrink:0}.calc__input{width:100%;max-width:11rem;color:var(--color-body);background-color:var(--color-surface);border:1px solid var(--color-border-strong);border-radius:var(--radius-field);min-height:44px;padding:.5rem;font-size:max(1rem,16px)}.calc__input--invalid{border-color:var(--color-danger-600);background-color:var(--color-danger-50)}.calc__remove{width:1.75rem;height:1.75rem;color:var(--color-muted);cursor:pointer;background:0 0;border:none;border-radius:9999px;flex-shrink:0;justify-content:center;align-items:center;font-size:1.25rem;line-height:1;display:inline-flex}.calc__remove:hover{color:var(--color-danger-600);background-color:var(--color-danger-50)}.calc__actions{grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:1rem;display:grid}.calc__actions .btn{min-height:44px;padding-left:.75rem;padding-right:.75rem}.calc__result{text-align:center;color:var(--color-body);margin-top:1.5rem;font-size:1.05rem}.calc__error{color:var(--color-danger-600);font-weight:600;display:block}.calc__list{border:1px solid var(--color-border);border-radius:var(--radius-field);max-width:40rem;margin:1.25rem auto 0;font-size:.95rem;overflow:hidden}.calc__list-row{justify-content:space-between;align-items:center;gap:1rem;padding:.625rem 1rem;display:flex}.calc__list-row+.calc__list-row{border-top:1px solid var(--color-border)}.calc__list-row:nth-child(2n){background-color:var(--color-surface-muted)}.calc__list-label{color:var(--color-heading);font-weight:600}.calc__list-value{white-space:nowrap;color:var(--color-body);font-weight:600}.calc__list-value--ok,.calc__total--ok{color:var(--color-success-600);font-weight:700}.calc__list-value--warn,.calc__total--warn{color:var(--color-danger-600);font-weight:700}.calc__breakdown-title{text-align:center;color:var(--color-heading);margin-top:1.5rem;font-weight:700}.calc-notes{flex-direction:column;gap:1rem;margin-top:2rem;display:flex}.calc-note{border:1px solid var(--color-border);border-radius:var(--radius-card);background-color:var(--color-surface);padding:1.25rem}.calc-note--warning{border-color:var(--color-warning-700);background-color:var(--color-warning-50);color:var(--color-warning-700)}.calc-note__title{text-align:center;justify-content:center;align-items:center;gap:.5rem;margin-bottom:.75rem;font-size:1.25rem;font-weight:700;display:flex}.calc-note--warning .calc-note__title{color:var(--color-warning-700)}.calc-note__title-sm{font-size:1rem}.calc-note__icon{flex-shrink:0;width:1.25rem;height:1.25rem}.calc-note__body{line-height:1.9}.calc-note__list{padding-left:1.5rem;line-height:1.9;list-style:decimal}
