.aacmk,
.aacmk * {
	box-sizing: border-box;
}

.aacmk,
.aacmk__settings-overlay {
	--aacmk-ink: #17212b;
	--aacmk-muted: #52606d;
	--aacmk-border: #aab7c4;
	--aacmk-panel: #f4f7f9;
	--aacmk-key: #fff;
	--aacmk-accent: #075985;
	--aacmk-accent-hover: #064663;
	--aacmk-on-accent: #fff;
	--aacmk-focus: #f59e0b;
	--aacmk-surface: #fff;
	--aacmk-hover: #edf7fc;
	--aacmk-field: #fff;
	--aacmk-field-ink: #111827;
	--aacmk-field-border: #667788;
	--aacmk-undo: #fff8e7;
	--aacmk-key-shadow: #8091a1;
	--aacmk-prediction-top: #e7f5ec;
	--aacmk-prediction-top-border: #4f8d65;
	--aacmk-tab-active: #e7f4fb;
	--aacmk-header: #fff;
	--aacmk-modal-edge: #fff;
	--aacmk-alert: #7c2d12;
	--aacmk-alarm: #fdecea;
	--aacmk-alarm-ink: #7f1d1d;
	--aacmk-alarm-border: #b91c1c;
	--aacmk-alarm-active: #b91c1c;
	--aacmk-alarm-active-ink: #fff;
	--aacmk-danger: #b91c1c;
	--aacmk-danger-ink: #fff;
	--aacmk-selected: #dff2fb;
	--aacmk-key-height: clamp(54px, 8vw, 76px);
	color-scheme: light;
}

.aacmk[data-aacmk-theme="dark"],
.aacmk__settings-overlay[data-aacmk-theme="dark"] {
	--aacmk-ink: #f5f7fa;
	--aacmk-muted: #b8c4d0;
	--aacmk-border: #6f7f8d;
	--aacmk-panel: #121212;
	--aacmk-key: #1d1d1d;
	--aacmk-accent: #4fa9e2;
	--aacmk-accent-hover: #7cc4ef;
	--aacmk-on-accent: #04121b;
	--aacmk-focus: #fbbf24;
	--aacmk-surface: #000;
	--aacmk-hover: #1f2d38;
	--aacmk-field: #0a0a0a;
	--aacmk-field-ink: #fff;
	--aacmk-field-border: #7d8b99;
	--aacmk-undo: #3b2f0e;
	--aacmk-key-shadow: #3a3a3a;
	--aacmk-prediction-top: #12291b;
	--aacmk-prediction-top-border: #67b581;
	--aacmk-tab-active: #102b3a;
	--aacmk-header: #1a1a1a;
	--aacmk-modal-edge: #4a4a4a;
	--aacmk-alert: #ffb4a1;
	--aacmk-alarm: #3a1414;
	--aacmk-alarm-ink: #fca5a5;
	--aacmk-alarm-border: #f87171;
	--aacmk-alarm-active: #dc2626;
	--aacmk-alarm-active-ink: #fff;
	--aacmk-danger: #ef4444;
	--aacmk-danger-ink: #090909;
	--aacmk-selected: #123246;
	color-scheme: dark;
}

.aacmk[data-aacmk-theme="high-contrast"],
.aacmk__settings-overlay[data-aacmk-theme="high-contrast"] {
	--aacmk-ink: CanvasText;
	--aacmk-muted: GrayText;
	--aacmk-border: ButtonText;
	--aacmk-panel: Canvas;
	--aacmk-key: ButtonFace;
	--aacmk-accent: Highlight;
	--aacmk-accent-hover: Highlight;
	--aacmk-on-accent: HighlightText;
	--aacmk-focus: Highlight;
	--aacmk-surface: Canvas;
	--aacmk-hover: ButtonFace;
	--aacmk-field: Field;
	--aacmk-field-ink: FieldText;
	--aacmk-field-border: ButtonText;
	--aacmk-undo: ButtonFace;
	--aacmk-key-shadow: ButtonText;
	--aacmk-prediction-top: Highlight;
	--aacmk-prediction-top-border: ButtonText;
	--aacmk-tab-active: Highlight;
	--aacmk-header: Canvas;
	--aacmk-modal-edge: ButtonText;
	--aacmk-alert: LinkText;
	--aacmk-alarm: Highlight;
	--aacmk-alarm-ink: HighlightText;
	--aacmk-alarm-border: ButtonText;
	--aacmk-alarm-active: Highlight;
	--aacmk-alarm-active-ink: HighlightText;
	--aacmk-danger: LinkText;
	--aacmk-danger-ink: Canvas;
	--aacmk-selected: Highlight;
	color-scheme: light dark;
	forced-color-adjust: none;
}

html[data-aacmk-theme="dark"] {
	color-scheme: dark;
}

html[data-aacmk-theme="dark"],
html[data-aacmk-theme="dark"] body {
	background-color: #000 !important;
	color: #f5f7fa !important;
}

html[data-aacmk-theme="high-contrast"],
html[data-aacmk-theme="high-contrast"] body {
	background-color: Canvas !important;
	color: CanvasText !important;
}

.aacmk {
	background: var(--aacmk-surface);
	color: var(--aacmk-ink);
	font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 17px;
	line-height: 1.4;
	max-width: 1280px;
	margin: 1rem auto;
}

.aacmk[data-aacmk-text-size="small"],
.aacmk__settings-overlay[data-aacmk-text-size="small"] {
	font-size: 15px;
	--aacmk-key-height: clamp(52px, 7.5vw, 70px);
}

.aacmk[data-aacmk-text-size="medium"],
.aacmk__settings-overlay[data-aacmk-text-size="medium"] {
	font-size: 17px;
}

.aacmk[data-aacmk-text-size="large"],
.aacmk__settings-overlay[data-aacmk-text-size="large"] {
	font-size: 20px;
	--aacmk-key-height: clamp(60px, 8vw, 82px);
}

.aacmk[data-aacmk-text-size="x-large"],
.aacmk__settings-overlay[data-aacmk-text-size="x-large"] {
	font-size: 24px;
	--aacmk-key-height: clamp(70px, 9vw, 96px);
}

.aacmk [hidden],
.aacmk__settings-overlay[hidden],
.aacmk__settings-overlay [hidden] {
	display: none !important;
}

.aacmk :where(button, input, select, textarea) {
	font: inherit;
}

.aacmk :where(button, select, input[type="password"]) {
	min-height: 48px;
}

.aacmk :where(select, input, textarea) {
	background: var(--aacmk-field);
	color: var(--aacmk-field-ink);
	border: 2px solid var(--aacmk-border);
	border-radius: .45rem;
}

.aacmk :where(button) {
	border: 2px solid var(--aacmk-border);
	border-radius: .65rem;
	background: var(--aacmk-key);
	color: var(--aacmk-ink);
	cursor: pointer;
	touch-action: manipulation;
}

.aacmk :where(button):hover:not(:disabled) {
	border-color: var(--aacmk-accent);
	background: var(--aacmk-hover);
}

.aacmk :where(button, textarea, input, select):focus-visible {
	outline: 4px solid var(--aacmk-focus);
	outline-offset: 2px;
}

.aacmk :where(button):disabled {
	opacity: .55;
	cursor: default;
}

.aacmk .screen-reader-text {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.aacmk__loading {
	border: 2px solid var(--aacmk-border);
	border-radius: .8rem;
	padding: 1rem;
	background: var(--aacmk-panel);
}

.aacmk-login,
.aacmk-login * {
	box-sizing: border-box;
}

.aacmk-login {
	--aacmk-login-ink: #17212b;
	--aacmk-login-border: #aab7c4;
	--aacmk-login-panel: #f4f7f9;
	--aacmk-login-accent: #075985;
	--aacmk-login-accent-hover: #064663;
	--aacmk-login-focus: #f59e0b;
	display: grid !important;
	place-items: center !important;
	width: min(1280px, 100%) !important;
	min-height: clamp(360px, 72svh, 720px) !important;
	margin: 1rem auto !important;
	padding: clamp(1rem, 4vw, 3rem) !important;
	color: var(--aacmk-login-ink);
	font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	text-align: center;
}

.aacmk-login__panel {
	width: min(680px, 100%);
	padding: clamp(2rem, 6vw, 4.5rem);
	border: 3px solid var(--aacmk-login-border);
	border-radius: 1.25rem;
	background: var(--aacmk-login-panel);
	box-shadow: 0 18px 55px rgb(15 23 42 / 16%);
}

.aacmk-login__title {
	margin: 0 0 clamp(1.5rem, 4vw, 2.5rem) !important;
	color: var(--aacmk-login-ink) !important;
	font-size: clamp(1.8rem, 4vw, 3rem) !important;
	font-weight: 800 !important;
	line-height: 1.2 !important;
}

.aacmk__alarm-row {
	display: flex;
	align-items: center;
	justify-content: stretch;
	width: 100%;
	margin: 0 0 .5rem;
	padding: 0;
}

.aacmk__toolbar {
	display: flex;
	align-items: end;
	gap: .75rem;
	margin-top: 1rem;
}

.aacmk__alarm-row > br,
.aacmk__toolbar > br {
	display: none !important;
}

.aacmk__language-label {
	font-weight: 750;
}

.aacmk__select,
.aacmk__settings-toggle {
	padding: .55rem .8rem;
}

.aacmk__settings-toggle {
	margin-inline-start: auto;
}

.aacmk .aacmk__alarm {
	width: 100%;
	margin: 0 !important;
	padding: .55rem 1.1rem;
	background: var(--aacmk-alarm);
	border-color: var(--aacmk-alarm-border);
	color: var(--aacmk-alarm-ink);
	font-weight: 800;
}

.aacmk .aacmk__alarm:hover:not(:disabled) {
	background: var(--aacmk-alarm-active);
	border-color: var(--aacmk-alarm-active);
	color: var(--aacmk-alarm-active-ink);
}

.aacmk .aacmk__alarm[aria-pressed="true"] {
	background: var(--aacmk-alarm-active);
	border-color: var(--aacmk-alarm-active);
	color: var(--aacmk-alarm-active-ink);
	animation: aacmk-alarm-pulse 1s ease-in-out infinite;
}

.aacmk[data-aacmk-theme="high-contrast"] :where(.aacmk__category-select[aria-pressed="true"], .aacmk__predictions button:nth-child(-n+2)),
.aacmk__settings-overlay[data-aacmk-theme="high-contrast"] .aacmk__settings-tabs button[aria-selected="true"] {
	color: HighlightText;
}

@keyframes aacmk-alarm-pulse {
	50% {
		opacity: .6;
	}
}

.aacmk__composer {
	background: var(--aacmk-panel);
	border: 2px solid var(--aacmk-border);
	border-radius: .85rem;
	padding: .8rem;
}

.aacmk__text-row {
	--aacmk-composer-areas: "message actions";
	--aacmk-composer-columns: minmax(0, 1fr) 160px;
	--aacmk-action-width: 160px;
	display: grid !important;
	grid-template-areas: var(--aacmk-composer-areas);
	grid-template-columns: var(--aacmk-composer-columns) !important;
	align-items: stretch !important;
	gap: .75rem;
	width: 100%;
	direction: ltr;
}

.aacmk .aacmk__text-row > .aacmk__message-frame {
	position: relative;
	grid-area: message;
	display: block !important;
	width: 100% !important;
	height: auto !important;
	min-width: 0;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	align-self: stretch !important;
}

.aacmk .aacmk__message-frame > textarea[data-role="text"] {
	display: block !important;
	width: 100% !important;
	min-height: 132px;
	height: auto !important;
	max-height: none !important;
	margin: 0 !important;
	resize: vertical;
	border: 2px solid var(--aacmk-field-border);
	border-radius: .7rem;
	background: var(--aacmk-field);
	color: var(--aacmk-field-ink);
	font-family: "Noto Sans Arabic", "Noto Sans Gurmukhi", "Noto Sans SC", system-ui, sans-serif;
	font-size: clamp(1.35em, 3vw, 2em);
	line-height: 1.55;
	padding: .75rem;
	padding-bottom: var(--aacmk-prediction-reserve, .75rem);
}

.aacmk__prediction-dock {
	position: absolute;
	inset-inline: .45rem 1.15rem;
	bottom: calc(.45rem + var(--aacmk-prediction-bottom-offset, 0px));
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: stretch;
	gap: .35rem;
	padding: 0;
	border: 0;
	background: transparent;
	direction: ltr;
}

.aacmk__predictions {
	display: flex;
	min-width: 0;
	gap: .35rem;
	overflow-x: auto;
	overflow-y: hidden;
	overscroll-behavior-inline: contain;
	scrollbar-width: thin;
	scroll-behavior: smooth;
	direction: ltr;
}

.aacmk__prediction-scroll {
	flex: 0 0 48px;
	width: 48px;
	min-width: 48px;
	min-height: 48px;
	padding: 0;
	font-size: 1.7em;
	font-weight: 800;
	line-height: 1;
}

.aacmk .aacmk__text-row > .aacmk__action-stack {
	grid-area: actions;
	display: grid !important;
	grid-template-rows: minmax(0, 1fr) 48px;
	align-self: stretch !important;
	gap: .75rem;
	width: 160px !important;
	height: auto !important;
	min-width: 0;
	margin: 0 !important;
}

.aacmk .aacmk__action-stack > .aacmk__undo[data-role="undo"] {
	position: static !important;
	width: 100% !important;
	height: 48px !important;
	min-height: 48px;
	margin: 0 !important;
	padding: .45rem .85rem;
	background: var(--aacmk-undo);
	font-weight: 750;
}

.aacmk .aacmk__action-stack > .aacmk__speak[data-role="speak"] {
	align-self: stretch !important;
	width: 100% !important;
	height: auto !important;
	margin: 0 !important;
	background: var(--aacmk-accent);
	border-color: var(--aacmk-accent);
	color: var(--aacmk-on-accent);
	font-size: clamp(1.1em, 2vw, 1.4em);
	font-weight: 800;
}

.aacmk__speak:hover:not(:disabled) {
	background: var(--aacmk-accent-hover);
	color: var(--aacmk-on-accent);
}

.aacmk__counter {
	color: var(--aacmk-muted);
	font-size: .9em;
	padding: .2rem .15rem 0;
	text-align: end;
}

.aacmk__candidates {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: .5rem;
	direction: ltr;
}

.aacmk__quick-phrases {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: .5rem;
	margin-bottom: .65rem;
	direction: ltr;
}

.aacmk__quick-phrases button {
	min-height: var(--aacmk-key-height);
	padding: .4rem .55rem;
	font-size: clamp(1em, 2.2vw, 1.25em);
	font-weight: 800;
	overflow-wrap: anywhere;
}

.aacmk .aacmk__phrases-open {
	background: var(--aacmk-accent);
	border-color: var(--aacmk-accent);
	color: var(--aacmk-on-accent);
}

.aacmk .aacmk__phrases-open:hover:not(:disabled) {
	background: var(--aacmk-accent-hover);
	color: var(--aacmk-on-accent);
}

.aacmk__phrases-screen {
	min-height: min(720px, 85svh);
	padding: clamp(.65rem, 2vw, 1rem);
	border: 2px solid var(--aacmk-border);
	border-radius: .85rem;
	background: var(--aacmk-panel);
}

.aacmk__phrases-header {
	display: grid;
	grid-template-columns: minmax(96px, auto) minmax(0, 1fr) minmax(96px, auto);
	align-items: center;
	gap: .75rem;
	margin-bottom: 1rem;
}

.aacmk__phrases-header h2 {
	grid-column: 2;
	grid-row: 1;
	margin: 0;
	text-align: center;
	font-size: clamp(1.4em, 3vw, 2em);
}

.aacmk__phrases-header [data-role="phrases-back"] {
	grid-column: 1;
	grid-row: 1;
}

.aacmk__phrases-header [data-role="phrases-edit"] {
	grid-column: 3;
	grid-row: 1;
}

.aacmk__phrases-header button {
	padding: .55rem .85rem;
	font-weight: 750;
}

.aacmk .aacmk__primary {
	background: var(--aacmk-accent);
	border-color: var(--aacmk-accent);
	color: var(--aacmk-on-accent);
}

.aacmk__phrases-layout {
	display: grid;
	grid-template-columns: minmax(180px, 30%) minmax(0, 1fr);
	gap: .8rem;
	align-items: start;
}

.aacmk__phrase-categories {
	display: grid;
	gap: .5rem;
}

.aacmk__category-select,
.aacmk__phrase-add {
	width: 100%;
	min-height: 58px;
	padding: .55rem .7rem;
	text-align: start;
	font-weight: 750;
	overflow-wrap: anywhere;
}

.aacmk__category-select[aria-pressed="true"] {
	background: var(--aacmk-selected);
	border-color: var(--aacmk-accent);
}

.aacmk__phrase-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: .65rem;
}

.aacmk__phrase-button {
	display: grid;
	align-content: center;
	gap: .25rem;
	width: 100%;
	min-height: 82px;
	padding: .7rem;
	text-align: start;
}

.aacmk__phrase-button strong {
	font-size: clamp(1.05em, 2vw, 1.3em);
}

.aacmk__phrase-button span {
	color: var(--aacmk-muted);
	font-size: .9em;
}

.aacmk__phrase-empty {
	grid-column: 1 / -1;
	margin: 0;
	padding: 1.25rem;
	border: 2px dashed var(--aacmk-border);
	border-radius: .65rem;
	color: var(--aacmk-muted);
	text-align: center;
}

.aacmk__phrase-category-cell,
.aacmk__phrase-cell {
	display: grid;
	gap: .5rem;
	min-width: 0;
}

.aacmk__phrase-list > .aacmk__phrase-cell--expanded {
	grid-column: 1 / -1;
}

.aacmk__phrase-cell-summary {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: .35rem;
	align-items: stretch;
	min-width: 0;
}

.aacmk__phrase-cell-actions {
	display: flex;
	gap: .25rem;
	align-items: stretch;
}

.aacmk .aacmk__icon-button {
	width: 44px;
	min-width: 44px;
	min-height: 48px;
	padding: .2rem;
	font-size: 1.35em;
	font-weight: 850;
	line-height: 1;
}

.aacmk .aacmk__icon-button--danger {
	color: var(--aacmk-danger);
}

.aacmk__inline-editor,
.aacmk__inline-confirm {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: .55rem;
	padding: .7rem;
	border: 2px solid var(--aacmk-accent);
	border-radius: .65rem;
	background: var(--aacmk-surface);
}

.aacmk__inline-field {
	display: grid;
	gap: .25rem;
	font-weight: 700;
}

.aacmk__inline-field--wide,
.aacmk__quick-toggle,
.aacmk__inline-hint {
	grid-column: 1 / -1;
}

.aacmk__inline-field :where(input, textarea, select) {
	width: 100%;
	padding: .5rem;
}

.aacmk__quick-toggle {
	display: flex;
	align-items: center;
	gap: .4rem;
	min-height: 44px;
	font-weight: 750;
}

.aacmk__quick-toggle input {
	width: 1.35rem;
	height: 1.35rem;
}

.aacmk__inline-hint {
	margin: -.25rem 0 0;
	color: var(--aacmk-muted);
}

.aacmk__inline-confirm {
	grid-template-columns: minmax(0, 1fr) auto auto;
	align-items: center;
	border-color: var(--aacmk-danger);
}

.aacmk__inline-confirm button {
	padding: .45rem .65rem;
}

.aacmk .aacmk__phrase-add {
	border-style: dashed;
	color: var(--aacmk-accent);
	text-align: center;
}

.aacmk .aacmk__danger {
	background: var(--aacmk-danger);
	border-color: var(--aacmk-danger);
	color: var(--aacmk-danger-ink);
}

.aacmk__phrase-status {
	min-height: 1.5em;
	margin-top: .65rem;
	color: var(--aacmk-muted);
	font-weight: 700;
}

.aacmk__predictions button,
.aacmk__candidates button {
	min-height: 48px;
	padding: .35rem .5rem;
	font-size: clamp(1em, 2.3vw, 1.35em);
	font-weight: 750;
	overflow-wrap: anywhere;
}

.aacmk__predictions button {
	flex: 0 0 auto;
	width: max-content;
	min-width: 48px;
	max-width: min(70vw, 16rem);
	white-space: nowrap;
}

.aacmk__predictions button:nth-child(-n+2) {
	background: var(--aacmk-prediction-top);
	border-color: var(--aacmk-prediction-top-border);
}

.aacmk__candidates {
	grid-template-columns: minmax(80px, auto) repeat(9, minmax(48px, 1fr));
	overflow-x: auto;
	margin-top: .65rem;
}

.aacmk__keyboard[data-aacmk-ime="stroke"] .aacmk__key-row:first-child .aacmk__key {
	max-width: 9rem;
	min-height: clamp(64px, 10vw, 92px);
	font-size: clamp(1.6em, 4vw, 2.5em);
}

.aacmk__pinyin-buffer {
	display: grid;
	place-items: center;
	min-height: 48px;
	border-bottom: 3px solid var(--aacmk-accent);
	font-weight: 750;
	color: var(--aacmk-accent);
}

.aacmk__keyboard {
	display: grid;
	gap: .45rem;
	margin-top: .8rem;
	user-select: none;
}

.aacmk__keyboard-utility {
	display: flex;
	justify-content: flex-start;
	gap: .4rem;
	direction: ltr;
	min-height: 48px;
}

/*
 * The layer toggle carries .aacmk__key for its key styling, so it must outrank
 * that rule to stay a compact label-sized control: at key sizing its wordy
 * localized labels are squeezed into a letter-key box and spill past the edge.
 */
.aacmk .aacmk__layer-toggle {
	flex: 0 1 auto;
	width: max-content;
	max-width: 100%;
	min-width: 0;
	min-height: 48px;
	padding: .5rem 1rem;
	font-size: clamp(.85em, 1.6vw, 1em);
	line-height: 1.25;
	white-space: normal;
	overflow-wrap: break-word;
}

.aacmk__keyboard[data-aacmk-view="numbers"] .aacmk__key-row {
	direction: ltr;
}

.aacmk__key-row {
	display: flex;
	justify-content: center;
	gap: .4rem;
}

.aacmk__key {
	flex: 1 1 0;
	min-width: 48px;
	max-width: 11rem;
	min-height: var(--aacmk-key-height);
	padding: .25rem;
	box-shadow: 0 2px 0 var(--aacmk-key-shadow);
	font-family: "Noto Sans Arabic", "Noto Sans Gurmukhi", "Noto Sans SC", system-ui, sans-serif;
	font-size: clamp(1.1em, 3vw, 1.75em);
	font-weight: 700;
}

.aacmk__key:active {
	box-shadow: none;
	transform: translateY(2px);
}

.aacmk__key-row--functions {
	direction: ltr !important;
}

.aacmk__key--function {
	flex: 1 1 0;
	max-width: none;
	font-size: clamp(.82em, 1.8vw, 1.05em);
}

.aacmk__key--space {
	flex-grow: 2;
}

.aacmk__status {
	min-height: 1.7em;
	padding: .4rem .2rem;
	font-weight: 650;
}

body.aacmk-modal-open {
	overflow: hidden;
}

.aacmk__settings-overlay {
	position: fixed;
	inset: 0;
	z-index: 2147483000;
	display: grid;
	place-items: center;
	padding: clamp(.5rem, 2vw, 1.5rem);
	color: var(--aacmk-ink);
	font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 17px;
	line-height: 1.4;
}

.aacmk__settings-overlay,
.aacmk__settings-overlay * {
	box-sizing: border-box;
}

.aacmk__settings-backdrop {
	position: absolute;
	inset: 0;
	background: rgb(15 23 42 / 72%);
}

.aacmk__settings-modal {
	position: relative;
	display: flex;
	flex-direction: column;
	width: min(880px, 100%);
	max-height: calc(100dvh - clamp(1rem, 4vw, 3rem));
	overflow: hidden;
	border: 3px solid var(--aacmk-modal-edge);
	border-radius: .9rem;
	background: var(--aacmk-panel);
	box-shadow: 0 24px 80px rgb(0 0 0 / 40%);
}

.aacmk__settings-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: .85rem 1rem;
	background: var(--aacmk-header);
	border-bottom: 2px solid var(--aacmk-border);
}

.aacmk__settings-header h2 {
	margin: 0;
	font-size: 1.4em;
}

.aacmk__settings-close,
.aacmk__settings-tabs button,
.aacmk__settings-modal button {
	min-height: 48px;
	border: 2px solid var(--aacmk-border);
	border-radius: .65rem;
	background: var(--aacmk-key);
	color: var(--aacmk-ink);
	cursor: pointer;
	font: inherit;
	padding: .45rem .85rem;
}

.aacmk__settings-modal :where(button, input, select, textarea) {
	font: inherit;
}

.aacmk__settings-overlay :where(button, textarea, input, select):focus-visible {
	outline: 4px solid var(--aacmk-focus);
	outline-offset: 2px;
}

.aacmk__settings-tabs {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	grid-template-rows: minmax(48px, auto) !important;
	grid-auto-flow: column !important;
	align-items: stretch !important;
	gap: .35rem;
	width: 100%;
	padding: .65rem 1rem 0;
	background: var(--aacmk-panel);
	direction: ltr;
}

.aacmk__settings-status {
	min-height: 1.5em;
	margin: .35rem 1rem 0;
	color: var(--aacmk-alert);
	font-weight: 700;
}

.aacmk__settings-tabs > button {
	width: 100% !important;
	min-width: 0 !important;
	max-width: none !important;
	height: 100%;
	margin: 0 !important;
}

.aacmk__settings-tabs > button:nth-child(1) {
	grid-column: 1 !important;
	grid-row: 1 !important;
}

.aacmk__settings-tabs > button:nth-child(2) {
	grid-column: 2 !important;
	grid-row: 1 !important;
}

.aacmk__settings-tabs > button:nth-child(3) {
	grid-column: 3 !important;
	grid-row: 1 !important;
}

.aacmk__settings-tabs > button:nth-child(4) {
	grid-column: 4 !important;
	grid-row: 1 !important;
}

.aacmk__settings-tabs button[aria-selected="true"] {
	border-color: var(--aacmk-accent);
	background: var(--aacmk-tab-active);
	box-shadow: inset 0 -4px 0 var(--aacmk-accent);
	font-weight: 800;
}

.aacmk__settings-body {
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: 1rem;
}

.aacmk__settings-body h3 {
	font-size: 1.15em;
	margin: 0 0 .7rem;
}

.aacmk__settings-body h3 ~ h3 {
	margin-top: 1.6rem;
}

.aacmk__device-context,
.aacmk__keyboard-guidance {
	border-radius: .6rem;
	background: var(--aacmk-panel);
	padding: .75rem;
}

.aacmk__keyboard-guidance {
	margin-block: .75rem;
	font-weight: 650;
}

.aacmk__settings-grid {
	--aacmk-settings-columns: repeat(4, minmax(150px, 1fr));
	display: grid;
	grid-template-columns: var(--aacmk-settings-columns);
	gap: .75rem;
	align-items: end;
}

.aacmk__setting-label-line {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: .5rem;
}

.aacmk__settings-grid label,
.aacmk__credential-row label {
	display: grid;
	gap: .25rem;
	font-weight: 700;
}

.aacmk__settings-modal select,
.aacmk__settings-modal input {
	width: 100%;
	min-height: 48px;
	padding: .45rem;
	border: 2px solid var(--aacmk-border);
	border-radius: .45rem;
	background: var(--aacmk-field);
	color: var(--aacmk-field-ink);
}

.aacmk__appearance {
	display: grid;
	gap: .25rem;
	max-width: 320px;
	font-weight: 700;
}

.aacmk__appearance-choice {
	min-width: 0;
	max-width: 680px;
	margin: 0 0 1rem;
	padding: 0;
	border: 0;
}

.aacmk__appearance-choice legend {
	margin-bottom: .35rem;
	padding: 0;
	font-weight: 800;
}

.aacmk__segmented {
	display: grid;
	gap: .35rem;
	direction: ltr;
}

.aacmk__segmented--three {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.aacmk__segmented--four {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.aacmk__segmented label {
	position: relative;
	min-width: 0;
	cursor: pointer;
}

.aacmk__settings-modal .aacmk__segmented input {
	position: absolute;
	width: 1px;
	height: 1px;
	min-height: 1px;
	margin: 0;
	opacity: 0;
	pointer-events: none;
}

.aacmk__segmented span {
	display: grid;
	place-items: center;
	min-height: 48px;
	padding: .45rem .55rem;
	border: 2px solid var(--aacmk-border);
	border-radius: .55rem;
	background: var(--aacmk-key);
	color: var(--aacmk-ink);
	font-weight: 750;
	line-height: 1.2;
	text-align: center;
	overflow-wrap: anywhere;
}

.aacmk__segmented input:checked + span {
	border-color: var(--aacmk-accent);
	background: var(--aacmk-accent);
	color: var(--aacmk-on-accent);
	font-weight: 850;
}

.aacmk__segmented input:focus-visible + span {
	outline: 4px solid var(--aacmk-focus);
	outline-offset: 2px;
}

.aacmk__consent {
	display: flex;
	align-items: center;
	gap: .6rem;
	font-weight: 750;
}

.aacmk__consent input {
	width: 24px;
	height: 24px;
}

.aacmk__privacy {
	max-width: 75ch;
	color: var(--aacmk-muted);
}

.aacmk__credentials {
	display: grid;
	gap: .65rem;
}

.aacmk__credential-row {
	display: grid;
	grid-template-columns: minmax(180px, .8fr) minmax(240px, 2fr) auto auto;
	gap: .55rem;
	align-items: end;
	padding-top: .6rem;
	border-top: 1px solid var(--aacmk-border);
}

.aacmk__credential-status {
	color: var(--aacmk-muted);
	font-size: .82em;
	font-weight: 500;
}

.aacmk__credential-row button,
.aacmk__secondary {
	padding: .45rem .85rem;
}

.aacmk-login .aacmk-login__button {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: min(320px, 100%) !important;
	min-height: 72px !important;
	margin: 0 !important;
	padding: 1rem 2rem !important;
	border: 3px solid var(--aacmk-login-accent) !important;
	border-radius: .9rem !important;
	background: var(--aacmk-login-accent) !important;
	box-shadow: 0 8px 20px rgb(7 89 133 / 28%);
	color: #fff !important;
	font-size: clamp(1.25rem, 3vw, 1.65rem) !important;
	font-weight: 800 !important;
	line-height: 1.2 !important;
	text-align: center !important;
	text-decoration: none !important;
	touch-action: manipulation;
}

.aacmk-login .aacmk-login__button:hover {
	border-color: var(--aacmk-login-accent-hover) !important;
	background: var(--aacmk-login-accent-hover) !important;
	color: #fff !important;
}

.aacmk-login .aacmk-login__button:focus-visible {
	outline: 5px solid var(--aacmk-login-focus) !important;
	outline-offset: 4px !important;
}

@media (max-width: 700px) {
	.aacmk-login {
		min-height: clamp(340px, 78svh, 620px) !important;
		padding: 1rem !important;
	}

	.aacmk-login__panel {
		padding: 2rem 1.25rem;
	}

	.aacmk__alarm-row {
		margin-block: 0 .25rem;
		padding-block: 0;
	}

	.aacmk__alarm-row .aacmk__alarm {
		margin: 0 !important;
		width: 100%;
	}

	.aacmk__toolbar {
		align-items: stretch;
		flex-direction: column;
	}

	.aacmk__settings-toggle {
		margin-inline-start: 0;
	}

	.aacmk__text-row {
		--aacmk-composer-areas:
			"message"
			"actions";
		--aacmk-composer-columns: minmax(0, 1fr);
		--aacmk-action-width: 100%;
	}

	.aacmk .aacmk__text-row > .aacmk__action-stack {
		grid-template-rows: 64px 48px;
		width: 100% !important;
		height: auto !important;
	}

	.aacmk .aacmk__action-stack > .aacmk__speak[data-role="speak"] {
		min-height: 64px;
	}

	.aacmk__quick-phrases {
		grid-template-columns: repeat(2, 1fr);
	}

	.aacmk__quick-phrases .aacmk__phrases-open {
		grid-column: 1 / -1;
	}

	.aacmk__phrases-screen {
		padding: .5rem;
	}

	.aacmk__phrases-header {
		grid-template-columns: minmax(76px, auto) minmax(0, 1fr) minmax(76px, auto);
		gap: .35rem;
	}

	.aacmk__phrases-header button {
		padding-inline: .45rem;
	}

	.aacmk__phrases-layout {
		grid-template-columns: minmax(108px, 38%) minmax(0, 1fr);
		gap: .45rem;
	}

	.aacmk__phrase-list {
		grid-template-columns: 1fr;
		gap: .45rem;
	}

	.aacmk__phrase-categories .aacmk__phrase-cell-summary {
		grid-template-columns: 1fr;
	}

	.aacmk__phrase-categories .aacmk__phrase-cell-actions > button {
		flex: 1 1 0;
		width: auto;
	}

	.aacmk__category-select,
	.aacmk__phrase-add,
	.aacmk__phrase-button {
		min-height: 64px;
		padding: .45rem;
	}

	.aacmk__inline-editor,
	.aacmk__inline-confirm {
		grid-template-columns: 1fr;
	}

	.aacmk__inline-field--wide,
	.aacmk__quick-toggle,
	.aacmk__inline-hint {
		grid-column: 1;
	}

	.aacmk__inline-confirm span {
		grid-column: 1 / -1;
	}

	.aacmk__key-row {
		gap: .2rem;
		flex-wrap: wrap;
	}

	.aacmk__key-row--functions {
		flex-wrap: nowrap;
	}

	/*
	 * Narrow screens cannot fit a long row at an accessible key size, so rows
	 * wrap. Keys therefore keep a fixed width instead of growing: a growing key
	 * would let the two or three that wrap onto the last line absorb all the
	 * leftover width and tower over the rest of the keyboard. Each wrapped line
	 * is centred, and wider phones simply fit more keys per line.
	 */
	.aacmk__key {
		flex: 0 0 auto;
		width: clamp(48px, 12.5vw, 64px);
		min-width: 0;
		max-width: none;
		min-height: var(--aacmk-key-height);
		font-size: clamp(.9em, 4.5vw, 1.25em);
	}

	.aacmk__key--function {
		flex: 1 1 0;
		width: auto;
	}

	.aacmk__key--space {
		flex-grow: 2;
	}

	.aacmk__keyboard[data-aacmk-ime="stroke"] .aacmk__key-row:first-child .aacmk__key {
		width: clamp(60px, 17vw, 9rem);
	}

	.aacmk__key--wide {
		font-size: .68em;
	}

	.aacmk__settings-grid,
	.aacmk__credential-row {
		--aacmk-settings-columns: 1fr;
		grid-template-columns: 1fr;
	}

	.aacmk__settings-modal {
		max-height: calc(100dvh - 1rem);
	}

	.aacmk__settings-tabs {
		padding-inline: .5rem;
	}

	.aacmk__settings-tabs button {
		padding-inline: .2rem;
		font-size: .78em;
		line-height: 1.15;
		overflow-wrap: anywhere;
	}

	.aacmk__segmented--four {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.aacmk__keyboard-mode-options {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	.aacmk *,
	.aacmk *::before,
	.aacmk *::after {
		scroll-behavior: auto !important;
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
	}

	.aacmk__key:active {
		transform: none;
	}

	.aacmk__predictions {
		scroll-behavior: auto;
	}
}

@media (forced-colors: active) {
	.aacmk button,
	.aacmk textarea,
	.aacmk select,
	.aacmk input,
	.aacmk__settings-overlay button,
	.aacmk__settings-overlay select,
	.aacmk__settings-overlay input {
		border: 2px solid ButtonText;
	}
}