.aksharkosh-keyboard {
	--kb-line: var(--aksharkosh-border, rgba(128, 128, 128, 0.5));
	--kb-accent: var(--dl-accent, #3b47c4);
	margin: 1.5em 0;
	padding: clamp(1rem, 3vw, 2rem);
	border: 1px solid var(--kb-line);
	border-radius: 6px;
	background: var(--dl-page, #fff);
	color: inherit;
	font-family: inherit;
}
.aksharkosh-keyboard * { box-sizing: border-box; }
.aksharkosh-keyboard .kb-heading, .aksharkosh-keyboard .kb-editor-head {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 1rem;
}
.aksharkosh-keyboard .kb-heading h2 { margin: 0; font-family: inherit; font-size: clamp(1.7rem, 4vw, 2.5rem); line-height: 1.15; }
.aksharkosh-keyboard .kb-heading p { margin: .35rem 0 0; }
.aksharkosh-keyboard button { font: inherit; cursor: pointer; }
.aksharkosh-keyboard button:focus-visible, .aksharkosh-keyboard textarea:focus-visible, .aksharkosh-keyboard .kb-scroll:focus-visible { outline: 2px solid var(--aksharkosh-focus, rgba(37, 99, 235, 0.6)); outline-offset: 2px; }
.aksharkosh-keyboard .kb-action, .aksharkosh-keyboard .kb-controls button { padding: .5rem .85rem; border: 1px solid var(--kb-accent); border-radius: 999px; background: var(--dl-page, #fff); color: var(--kb-accent); font-weight: 600; }
.aksharkosh-keyboard .kb-action:hover, .aksharkosh-keyboard .kb-controls button:hover { background: var(--kb-accent); color: #fff; }
.aksharkosh-keyboard .kb-tabs { display: flex; gap: .25rem; margin: 1.5rem 0 0; border-bottom: 2px solid var(--kb-line); }
.aksharkosh-keyboard .kb-tabs button { padding: .65rem 1.1rem; border: 0; border-bottom: 3px solid transparent; border-radius: 0; background: transparent; color: inherit; font-weight: 600; }
.aksharkosh-keyboard .kb-tabs button[aria-selected="true"] { border-color: var(--kb-accent); color: var(--kb-accent); }
.aksharkosh-keyboard .kb-panel[hidden] { display: none; }
.aksharkosh-keyboard .kb-panel h3 { margin: 1.25rem 0 .15rem; font-size: 1.25rem; }
.aksharkosh-keyboard .kb-panel h3 small { display: inline-block; margin-left: .4rem; font-size: .7em; font-weight: 400; opacity: .75; }
.aksharkosh-keyboard .kb-legend { margin: 0 0 .6rem; font-size: .83rem; opacity: .75; }
.aksharkosh-keyboard .kb-scroll { overflow-x: auto; padding: .75rem; border: 1px solid var(--kb-line); border-radius: 6px; background: var(--dl-page, #fff); }
.aksharkosh-keyboard .kb-chart { min-width: 780px; }
.aksharkosh-keyboard .kb-row { display: flex; gap: 4px; margin-bottom: 4px; }
.aksharkosh-keyboard .kb-row:last-child { margin-bottom: 0; }
.aksharkosh-keyboard .kb-key { position: relative; flex: 1 0 0; min-width: 0; height: 58px; padding: 5px; border: 1px solid var(--kb-line); border-bottom-width: 3px; border-radius: 6px; background: var(--dl-page, #fff); color: inherit; text-align: left; }
.aksharkosh-keyboard button.kb-key:hover { border-color: var(--kb-accent); }
.aksharkosh-keyboard .kb-empty { background: var(--aksharkosh-pane-bg, #f7f7f9); }
.aksharkosh-keyboard .kb-latin { position: absolute; top: 3px; left: 6px; font-family: inherit; font-size: 11px; line-height: 1; opacity: .7; }
.aksharkosh-keyboard .kb-normal-output, .aksharkosh-keyboard .kb-shift-output { position: absolute; right: 6px; font-family: inherit; font-size: 21px; font-weight: 700; line-height: 1.1; }
.aksharkosh-keyboard .kb-shift-output { top: 3px; color: var(--kb-accent); }
.aksharkosh-keyboard .kb-normal-output { bottom: 5px; }
.aksharkosh-keyboard.kb-shifted .kb-shift-output { text-decoration: underline; text-underline-offset: 3px; }
.aksharkosh-keyboard .kb-control, .aksharkosh-keyboard .kb-space { display: flex; align-items: end; min-width: 50px; padding: 5px 7px; border: 1px solid var(--kb-line); border-bottom-width: 3px; border-radius: 6px; background: var(--aksharkosh-pane-bg, #f7f7f9); color: inherit; font-size: 11px; }
.aksharkosh-keyboard .kb-tab, .aksharkosh-keyboard .kb-caps, .aksharkosh-keyboard .kb-shift { min-width: 64px; }
.aksharkosh-keyboard .kb-backspace, .aksharkosh-keyboard .kb-enter { min-width: 76px; }
.aksharkosh-keyboard .kb-bottom-row { justify-content: center; }
.aksharkosh-keyboard .kb-space { flex: 0 1 50%; justify-content: center; height: 38px; }
.aksharkosh-keyboard .kb-help { max-width: 70ch; margin: .8rem 0 1.5rem; font-size: .92rem; line-height: 1.5; opacity: .75; }
.aksharkosh-keyboard .kb-editor { padding: 1rem; border: 1px solid var(--kb-line); border-radius: 6px; background: var(--dl-page, #fff); }
.aksharkosh-keyboard .kb-editor-head { align-items: center; margin-bottom: .6rem; }
.aksharkosh-keyboard .kb-editor-head label { font-size: 1.1rem; font-weight: 700; }
.aksharkosh-keyboard textarea { display: block; width: 100%; min-height: 10rem; padding: .8rem; border: 1px solid var(--kb-line); border-radius: 6px; background: var(--aksharkosh-pane-bg, transparent); color: inherit; font-family: inherit; font-size: 1.3rem; line-height: 1.7; resize: vertical; }
.aksharkosh-keyboard .kb-physical { display: inline-flex; align-items: center; gap: .4rem; margin: .75rem 0; font-size: .9rem; }
.aksharkosh-keyboard .kb-controls { display: flex; flex-wrap: wrap; gap: .4rem; }
.aksharkosh-keyboard .kb-controls button[aria-pressed="true"] { background: var(--kb-accent); color: white; }
.aksharkosh-keyboard .kb-editor-note, .aksharkosh-keyboard .kb-status { margin: .7rem 0 0; font-size: .85rem; opacity: .75; }
.aksharkosh-keyboard .kb-status:empty { display: none; }
@media (max-width: 600px) {
	.aksharkosh-keyboard .kb-heading { align-items: start; }
	.aksharkosh-keyboard .kb-print { white-space: nowrap; font-size: .8rem; }
}
@media print {
	@page { size: A4 landscape; margin: 10mm; }
	.aksharkosh-keyboard { margin: 0; padding: 0; border: 0; background: white; color: black; }
	.aksharkosh-keyboard .kb-heading, .aksharkosh-keyboard .kb-tabs, .aksharkosh-keyboard .kb-editor { display: none; }
	.aksharkosh-keyboard .kb-panel[hidden] { display: none; }
	.aksharkosh-keyboard .kb-panel { break-inside: avoid; }
	.aksharkosh-keyboard .kb-panel h3 { margin-top: 0; }
	.aksharkosh-keyboard .kb-scroll { overflow: visible; padding: 0; border: 0; background: white; }
	.aksharkosh-keyboard .kb-chart { min-width: 0; width: 100%; }
	.aksharkosh-keyboard .kb-key { height: 51px; border-color: #888; }
	.aksharkosh-keyboard .kb-control, .aksharkosh-keyboard .kb-space { border-color: #888; }
	.aksharkosh-keyboard .kb-help { margin-bottom: 0; color: black; }
}