/* Stable icon centering: the icon and orb share a fixed vertical centre. */
#nav a{padding:34px 1px 0;min-height:53px;height:53px;justify-content:flex-start;gap:0}
#nav a .icon{position:absolute;left:50%;top:6px;transform:translateX(-50%);width:21px;height:21px;transition:top .3s ease,color .3s ease}
#nav a.active .icon{top:-5px;transform:translateX(-50%)}
#nav-orb{top:-8px}
.translation-segment{display:grid;grid-template-columns:minmax(85px,.8fr) minmax(0,1.2fr);gap:12px;padding:17px 0;border-bottom:1px solid var(--line)}
.translation-segment small{display:block;font-size:11px;margin-top:6px}
.translation-segment strong{display:block;font-weight:600;overflow-wrap:anywhere}
.translation-segment .icon-button{width:40px;min-height:44px}
.related-phrase{padding:17px 0;border-bottom:1px solid var(--line)}
.related-phrase p{color:var(--accent);margin-top:9px;overflow-wrap:anywhere}
.alphabet-heading{display:flex;align-items:center;justify-content:space-between;gap:14px}
.alphabet-heading .letter-large{margin:12px 0;font-size:clamp(44px,14vw,66px)}
.alphabet-heading .audio-actions{flex-shrink:0;display:flex}
.study .translation.long-translation{font-size:clamp(23px,6vw,31px);line-height:1.35;overflow-wrap:anywhere}
.lesson.study{min-height:0;padding:25px 20px}.study .source{margin-top:24px}
.shell{padding-bottom:calc(150px + env(safe-area-inset-bottom))}
#sheet-content{overflow-wrap:anywhere}#sheet{max-height:calc(92dvh - env(safe-area-inset-top));overflow-y:auto}
@media(max-width:375px){.translation-segment{gap:9px}.study h2{font-size:27px}.lesson h2{font-size:25px}}