/* i2Speak-only shell adjustments, after shared i2Type components. */
.site-header .language-trigger > .icon:first-child { color:var(--accent); }
.type-keyboard-hero-start { background:var(--accent); color:var(--accent-ink); }
.type-keyboard-hero-start:hover { background:var(--accent-hover); color:var(--accent-ink); }
.site-charts-trigger { display:inline-flex; align-items:center; gap:7px; padding:8px 10px; font-size:14px; border-radius:8px; }
.site-charts-trigger .icon { width:18px; height:18px; }
/* Allow long layout names to breathe without changing the sister-site menu. */
.site-keyboards-panel { width:600px; }
.site-keyboards-panel .site-network-links { grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.site-keyboards-panel .site-network-link { min-height:72px; padding-block:12px; }
/* Keyboard icons inherit the same soft accent tile and readable ink as i2Suite. */
.site-keyboards-panel .site-network-link[aria-current="page"] { background:var(--accent-soft); border-color:var(--accent); color:var(--ink); }
@media(max-width:1024px) {
    .site-keyboards-panel { position:fixed; inset:76px 12px auto; width:auto; max-width:600px; margin-inline:auto; max-height:calc(100dvh - 88px); }
}
@media(max-width:680px) {
    .site-keyboards-panel .site-network-links { grid-template-columns:minmax(0,1fr); gap:3px; }
    .site-keyboards-panel .site-network-link { min-height:64px; padding-block:10px; }
}
:root[data-appearance="dark"] .type-keyboard-hero-art img { filter:brightness(.88); }
@media(max-width:680px) { .header-actions .site-charts-trigger span { display:none; } .site-charts-trigger { padding:7px; } .header-inner { gap:10px; } }

/* Information routes use the shared i2Type legal shell and readable brand ink. */
.speak-information-article { max-width:850px; margin-inline:auto; }
.legal-shell .legal-kicker,.legal-shell .legal-section>h2>span { color:var(--accent-readable,var(--accent-hover)); }
:root .legal-shell .legal-article a:not(.button) { color:var(--accent-readable,var(--accent-hover)); }
:root .legal-shell .legal-article a.button.primary { color:var(--accent-ink,#2b1530); text-decoration:none; }
:root .legal-shell .legal-tabs a[aria-current] { color:var(--accent-ink,#2b1530); }
.legal-shell .legal-contact { display:flex; justify-content:flex-start; }
@media(max-width:680px) { .legal-shell .legal-table-wrap { margin-inline:-2px; } }

/* UI direction follows the locale; phonetic notation and chart topology do not mirror. */
#typing, #key-deck, #candidate-list, #candidate-code,
#chart-symbols .ipa-table, #chart-symbols .symbol-grid,
#chart-symbols .vowel-scroll, #chart-symbols .vowel-diagram {
    direction:ltr;
    unicode-bidi:isolate;
}
#typing, #key-deck { text-align:left; }
#candidate-list .candidate-option, #chart-symbols .chart-symbol>span { direction:ltr; unicode-bidi:isolate; }
#font-family, #html-output { direction:ltr; text-align:left; }
:root[dir="rtl"] #keyboardApp { text-align:right; }
.language-dialog .language-search-empty { margin:18px 0 4px; text-align:center; color:var(--muted); }
.language-dialog [data-language][hidden], .language-dialog .language-search-empty[hidden] { display:none!important; }
.language-dialog .language-name { min-width:0; overflow-wrap:anywhere; }

/* Guides sit immediately before appearance and share the native header disclosure. */
.site-guides-panel{width:560px;padding:21px;max-height:min(660px,calc(100dvh - 100px))}
.site-guides-panel h2{display:flex;align-items:center;gap:10px;margin:0 0 16px;font-size:19px}.site-guides-panel h2>span{font-size:10px;font-weight:500;color:var(--muted);background:var(--canvas);padding:3px 7px;border-radius:6px}
.site-guides-overview{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:22px}
.site-guides-overview>a{display:flex;align-items:center;gap:10px;padding:14px 12px;background:var(--accent-soft);border:1px solid transparent;border-radius:12px;min-height:76px}.site-guides-overview>a:hover{border-color:var(--accent)}
.site-guide-menu-icon{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:8px;background:var(--accent-soft);color:var(--accent-readable)}.site-guide-menu-icon>.icon{width:17px;height:17px}.site-guides-overview>a>span:not(.site-guide-menu-icon){display:flex;flex-direction:column;gap:4px;min-width:0}.site-guides-overview strong{font-size:13px;font-weight:650}.site-guides-overview small{font-size:10px;line-height:1.5;color:var(--muted)}
.site-guide-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.site-guide-groups h3{font-size:11px;font-weight:650;color:var(--muted);line-height:1.6;margin:0 10px 8px}.site-guide-groups a{display:flex;min-width:0;align-items:center;justify-content:flex-start;gap:9px;padding:11px 10px;min-height:42px;border-radius:9px;color:var(--ink);font-size:12px;line-height:1.45}.site-guide-groups a>span:not(.site-guide-menu-icon){min-width:0;overflow-wrap:anywhere}.site-guide-groups a:hover,.site-guide-groups a[aria-current]{background:var(--accent-soft)}.site-guide-groups a[aria-current]{font-weight:650;color:var(--accent-readable)}.site-guides-picker>.is-current{background:var(--accent-soft)}
@media(max-width:1000px){.site-guides-panel{position:fixed;inset:76px 12px auto;width:auto;max-width:560px;margin-inline:auto;max-height:calc(100dvh - 88px)}}
@media(max-width:480px){.site-guides-panel{padding:18px 14px}.site-guides-overview{grid-template-columns:1fr;gap:6px;margin-bottom:18px}.site-guides-overview>a{min-height:62px;padding:10px 12px}.site-guide-groups{gap:6px}.site-guide-groups h3{margin-inline:7px;font-size:10px}.site-guide-groups a{padding:10px 7px;font-size:11px;min-height:44px}.site-guide-menu-icon{width:24px;height:24px;border-radius:7px}.site-guide-menu-icon>.icon{width:15px;height:15px}.site-guide-groups a{gap:7px}}

.site-guide-groups .site-guide-tools{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px;border-bottom:1px solid var(--line);padding-bottom:12px}
.site-guide-tools>h3{grid-column:1/-1}
@media(max-width:480px){.site-guide-groups .site-guide-tools{column-gap:6px}}

:root[data-appearance="dark"] .skip-link{color:var(--accent-ink)}