/* japonmundo-tools — стилі інструментів.
   Тримаються нейтрально, щоб не битися з темою: успадковують шрифт і
   кольори теми, а власними задають тільки те, без чого блок не читається. */

.jm-lead{font-size:1.15em;line-height:1.6}
.jm-box{border-left:5px solid currentColor;opacity:.95;padding:.9em 1.2em;margin:1.6em 0;background:rgba(0,0,0,.035);border-radius:0 8px 8px 0}
.jm-box.jm-aviso{border-left-color:#c8632b}
.jm-hero{display:flex;flex-direction:column;align-items:center;gap:.4em;margin:1.8em 0;padding:1.8em 1em;background:rgba(0,0,0,.04);border-radius:14px;text-align:center}
.jm-kana{font-size:clamp(2.6rem,9vw,4.4rem);line-height:1.1;font-weight:700}
.jm-kanji-grande{font-size:clamp(2.2rem,7vw,3.4rem);line-height:1.1}
.jm-romaji{font-size:1.05em;opacity:.75;letter-spacing:.05em}

.jm-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));margin:1.6em 0}
.jm-grid-3{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.jm-grid-6{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}
.jm-card{display:flex;flex-direction:column;gap:.35em;padding:1.1em;border:2px solid rgba(0,0,0,.12);border-radius:12px;text-decoration:none;transition:border-color .15s}
.jm-card:hover{border-color:currentColor}
.jm-card .jm-kanji{font-size:2.2rem;line-height:1}
.jm-card strong{font-size:1.05em}
.jm-card span,.jm-card em{font-size:.9em;opacity:.75;font-style:normal}
.jm-card-mini{align-items:center;text-align:center;padding:.9em .5em}

.jm-form{display:flex;flex-wrap:wrap;gap:.6em;align-items:flex-end;margin:1.4em 0;padding:1.2em;border:2px solid rgba(0,0,0,.12);border-radius:12px}
.jm-form label{display:flex;flex-direction:column;font-size:.9em;gap:.25em}
.jm-form input{padding:.6em .8em;border:1px solid rgba(0,0,0,.25);border-radius:8px;font-size:1em;min-width:5em}
.jm-form input[type=text]{flex:1 1 16em}
.jm-form button{padding:.65em 1.4em;border:0;border-radius:8px;background:#24463c;color:#fff;font-size:1em;cursor:pointer}
.jm-form button:hover{opacity:.88}

.jm-moras{display:flex;flex-wrap:wrap;gap:.5em;margin:1em 0}
.jm-mora{display:inline-flex;align-items:center;justify-content:center;min-width:2.4em;padding:.5em .6em;border:2px solid rgba(0,0,0,.15);border-radius:10px;font-size:1.4em}
.jm-vertical{display:inline-flex;flex-direction:column;align-items:center;gap:.15em;padding:.8em 1em;border:2px solid rgba(0,0,0,.15);border-radius:10px;font-size:1.8em;line-height:1.15}

.jm-ateji{display:flex;flex-wrap:wrap;gap:1.2em;align-items:center;margin:1.2em 0;padding:1em;background:rgba(0,0,0,.035);border-radius:12px}
.jm-ateji ul{margin:0;padding-left:1.1em}

.jm-lista{display:grid;gap:.5rem;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));margin:1.2em 0}
.jm-lista a{display:flex;justify-content:space-between;gap:.5em;padding:.55em .8em;border:1px solid rgba(0,0,0,.14);border-radius:8px;text-decoration:none;font-size:.95em}
.jm-anos{display:flex;flex-wrap:wrap;gap:.35em;margin:1.2em 0}
.jm-anos a{padding:.3em .6em;border:1px solid rgba(0,0,0,.14);border-radius:6px;font-size:.9em;text-decoration:none}

.jm-frases{display:flex;flex-direction:column;gap:.6em;margin:1.4em 0}
.jm-frase{display:flex;flex-wrap:wrap;align-items:center;gap:.7em;padding:.8em 1em;border:1px solid rgba(0,0,0,.14);border-radius:10px}
.jm-frase a{flex:1 1 16em;display:flex;flex-direction:column;text-decoration:none}
.jm-jp{font-size:1.35em;line-height:1.35}
.jm-rom{font-size:.9em;opacity:.7}
.jm-es{font-size:1em}
.jm-nivel{font-size:.75em;padding:.2em .6em;border-radius:20px;border:1px solid currentColor;white-space:nowrap}
.jm-casual{color:#8a8574}.jm-cortes{color:#24463c}.jm-formal{color:#a57b41}

.jm-tts{border:1px solid currentColor;background:none;border-radius:20px;padding:.3em .9em;cursor:pointer;font-size:.85em;color:inherit}
.jm-tts:hover{background:rgba(0,0,0,.06)}
.jm-tts[disabled]{opacity:.4;cursor:default}

.jm-nav{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6em;margin:2em 0;padding-top:1em;border-top:1px solid rgba(0,0,0,.12)}

.jm-widget{display:flex;flex-direction:column;align-items:flex-start;gap:.35em;margin:1.6em 0;padding:1.1em 1.3em;border:2px solid rgba(0,0,0,.14);border-radius:12px;background:rgba(0,0,0,.03)}
.jm-widget-eti{font-size:.8em;text-transform:uppercase;letter-spacing:.12em;opacity:.7}
.jm-widget-big{font-size:2rem;line-height:1.2;font-weight:700}
.jm-widget-sub{font-size:.95em;opacity:.8}
.jm-widget-cta{margin-top:.4em;font-size:.95em}
.jm-inline{font-weight:600}

@media (max-width:640px){
  .jm-form{flex-direction:column;align-items:stretch}
  .jm-form button{width:100%}
  .jm-frase{flex-direction:column;align-items:flex-start}
}

/* 1.7.0 — відповідь-абзац на хабах, картка знака, риси, «читати далі» */
.jm-answer{padding:1em 1.2em;margin:1.4em 0;border:1px solid rgba(36,70,60,.25);border-left:5px solid #24463C;border-radius:0 10px 10px 0;background:rgba(36,70,60,.06);line-height:1.6}
.jm-ficha{width:100%;border-collapse:collapse;margin:1.4em 0;font-size:.95em}
.jm-ficha th,.jm-ficha td{padding:.55em .7em;border-bottom:1px solid rgba(0,0,0,.1);text-align:left;vertical-align:top}
.jm-ficha th{width:42%;font-weight:600}
.jm-rasgos{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin:1.2em 0}
.jm-rasgos>div{padding:.9em 1.1em;border:1px solid rgba(0,0,0,.12);border-radius:12px}
.jm-rasgos h3{margin:0 0 .4em;font-size:1em}
.jm-rasgos ul{margin:0;padding-left:1.2em}
.jm-tabla{overflow-x:auto}
tr.jm-actual td{font-weight:700;background:rgba(200,99,43,.08)}
.jm-relacionados{margin:2.4em 0 1em;padding:1.1em 1.3em;border-radius:12px;background:rgba(0,0,0,.035)}
.jm-relacionados h2{margin:0 0 .5em;font-size:1.15em}
.jm-relacionados ul{margin:0;padding-left:1.2em}
.jm-relacionados li{margin:.3em 0}