.aw-app .aw-lang-module {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  width: 100%;
  padding: clamp(14px, 2.2vw, 30px);
  gap: 18px;
  color: #253347;
  box-sizing: border-box;
  container-type: inline-size;
}
.aw-app .aw-lang-module * { box-sizing: border-box; }
.aw-app .aw-lang-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; flex: 0 0 auto; }
.aw-app .aw-lang-button {
  min-height: 52px;
  min-width: 52px;
  border: 1px solid #dce3eb;
  border-radius: 14px;
  padding: 11px 18px;
  background: #fff;
  color: #344357;
  font: inherit;
  font-size: 16px;
  font-weight: 650;
  line-height: 1.3;
  cursor: pointer;
  touch-action: manipulation;
}
.aw-app .aw-lang-button:hover { border-color: #b7b0dd; background: #f6f4ff; }
.aw-app .aw-lang-button-primary { color: #fff; border-color: #6551ae; background: #6551ae; }
.aw-app .aw-lang-button-primary:hover { background: #554294; border-color: #554294; }
.aw-app .aw-lang-button:disabled { opacity: .42; cursor: default; }
.aw-app .aw-lang-button[aria-pressed="true"] { background: #eee9fb; border-color: #9988cd; color: #554294; }
.aw-app .aw-lang-button:focus-visible,
.aw-app .aw-lang-swatch:focus-visible,
.aw-app .aw-sentence-word:focus-visible,
.aw-app .aw-lang-input:focus-visible,
.aw-app .aw-note-text:focus-visible,
.aw-app .aw-lang-settings > summary:focus-visible { outline: 3px solid #7863b8; outline-offset: 4px; }
.aw-app .aw-lang-segmented, .aw-app .aw-lang-navigation { display: flex; gap: 6px; align-items: center; }
.aw-app .aw-lang-counter { min-width: 48px; padding: 0 5px; text-align: center; color: #6b7789; font-size: 15px; font-variant-numeric: tabular-nums; }
.aw-app .aw-lang-colors { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.aw-app .aw-lang-swatch {
  width: 48px;
  height: 48px;
  padding: 7px;
  display: grid;
  place-items: center;
  border: 2px solid transparent;
  border-radius: 50%;
  font: inherit;
  cursor: pointer;
  touch-action: manipulation;
  background: var(--aw-lang-color-background);
  color: var(--aw-lang-color-ink);
}
.aw-app .aw-lang-swatch[aria-pressed="true"] { border-color: var(--aw-lang-color-ink); box-shadow: 0 0 0 3px #fff inset; }
.aw-app .aw-lang-swatch-mark { font-size: 22px; line-height: 1; font-weight: 800; }
.aw-app .aw-lang-color-violet { --aw-lang-color-background: #ece5fc; --aw-lang-color-ink: #60459a; }
.aw-app .aw-lang-color-blue { --aw-lang-color-background: #e2effc; --aw-lang-color-ink: #225d91; }
.aw-app .aw-lang-color-mint { --aw-lang-color-background: #ddf3e9; --aw-lang-color-ink: #256e57; }
.aw-app .aw-lang-color-orange { --aw-lang-color-background: #fff0da; --aw-lang-color-ink: #905918; }
.aw-app .aw-lang-color-pink { --aw-lang-color-background: #fbe4ee; --aw-lang-color-ink: #994364; }
.aw-app .aw-lang-color-none { --aw-lang-color-background: #f6f7fa; --aw-lang-color-ink: #29374a; }
.aw-app .aw-lang-stage { display: flex; flex: 1 0 auto; align-items: center; justify-content: center; min-height: 260px; padding: 22px 0; }
.aw-app .aw-lang-caption { margin: 0; color: #677386; text-align: center; font-size: 15px; line-height: 1.55; }
.aw-app .aw-lang-empty { margin: 24px 0; color: #7b8595; font-size: 30px; font-weight: 500; text-align: center; }
.aw-app .aw-lang-settings { width: 100%; margin-top: 2px; flex: 0 0 auto; }
.aw-app .aw-lang-settings > summary { width: fit-content; min-height: 48px; display: flex; align-items: center; gap: 8px; cursor: pointer; color: #677386; font-size: 15px; font-weight: 600; padding: 10px 14px; border-radius: 12px; list-style: none; }
.aw-app .aw-lang-settings > summary::-webkit-details-marker { display: none; }
.aw-app .aw-lang-settings > summary::before { content: '+'; font-size: 23px; font-weight: 400; }
.aw-app .aw-lang-settings[open] > summary::before { content: '−'; }
.aw-app .aw-lang-settings-form { display: grid; gap: 16px; border: 1px solid #e4e9f0; background: #f8f9fc; padding: 20px; border-radius: 16px; }
.aw-app .aw-lang-settings-form > .aw-lang-button { justify-self: start; }
.aw-app .aw-lang-field { display: grid; gap: 10px; color: #48586d; font-size: 15px; font-weight: 600; }
.aw-app .aw-lang-input { width: 100%; border-radius: 12px; border: 1px solid #d9e0e9; background: #fff; color: #253347; padding: 12px 14px; min-height: 52px; font: inherit; font-size: 18px; line-height: 1.55; }
.aw-app textarea.aw-lang-input { resize: vertical; min-height: 150px; }
.aw-app input.aw-lang-input[type="number"] { max-width: 200px; }
.aw-app input.aw-lang-input[type="range"] { padding-inline: 0; accent-color: #6551ae; }
.aw-app .aw-sentence-stage { flex-direction: column; gap: 38px; }
.aw-app .aw-sentence-words { width: 100%; display: flex; align-items: stretch; justify-content: center; gap: 14px 12px; flex-wrap: wrap; }
.aw-app .aw-sentence-word {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 104px;
  max-width: 100%;
  border: 2px solid transparent;
  border-radius: 20px;
  padding: 15px 21px;
  background: var(--aw-lang-color-background);
  color: var(--aw-lang-color-ink);
  font: inherit;
  cursor: pointer;
  touch-action: manipulation;
  transition: border-color .12s, box-shadow .12s;
}
.aw-app .aw-sentence-word:hover { border-color: #c2b7df; }
.aw-app .aw-sentence-word[aria-pressed="true"] { border-color: #7863b8; box-shadow: 0 0 0 4px #ebe5fa; }
.aw-app .aw-sentence-word-text { font-size: clamp(34px, 5.5vw, 66px); font-weight: 650; line-height: 1.25; letter-spacing: -.035em; overflow-wrap: anywhere; }
.aw-app .aw-sentence-category { font-size: clamp(14px, 1.5vw, 18px); line-height: 1.2; font-weight: 650; }
.aw-app .aw-sentence-anatomy { display: flex; align-items: stretch; justify-content: center; flex-wrap: wrap; gap: 16px; width: 100%; }
.aw-app .aw-sentence-anatomy > span { display: grid; gap: 8px; padding: 15px 20px; border-radius: 16px; font-size: 24px; line-height: 1.4; }
.aw-app .aw-sentence-anatomy small { text-transform: uppercase; font-size: 12px; font-weight: 700; letter-spacing: .1em; }
.aw-app .aw-sentence-subject { background: #e9effb; color: #325781; }
.aw-app .aw-sentence-predicate { background: #eee8fb; color: #695092; }
.aw-app .aw-reading-stage { justify-content: flex-start; }
.aw-app .aw-reading-page { width: 100%; padding: 2px clamp(0px, 2vw, 24px); }
.aw-app .aw-reading-line { margin: 0 0 .42em; font-size: var(--aw-reading-size, 48px); line-height: 1.5; font-weight: 540; letter-spacing: -.022em; overflow-wrap: anywhere; }
.aw-app .aw-reading-line:last-child { margin-bottom: 0; }
.aw-app .aw-reading-pending { display: grid; gap: 17px; margin: 22px 0 6px; max-width: 88%; }
.aw-app .aw-reading-placeholder { display: block; background: #eef0f5; height: 15px; border-radius: 10px; }
.aw-app .aw-reading-placeholder:nth-child(2) { width: 92%; }
.aw-app .aw-reading-placeholder:nth-child(3) { width: 76%; }
.aw-app .aw-dictation-stage { min-height: 320px; }
.aw-app .aw-dictation-hidden { display: grid; justify-items: center; gap: 18px; text-align: center; }
.aw-app .aw-dictation-hidden > p { font-size: clamp(34px, 5vw, 60px); font-weight: 650; letter-spacing: -.035em; margin: 0; }
.aw-app .aw-dictation-sound { display: grid; place-items: center; height: 100px; width: 100px; border-radius: 32px; background: #eee8fb; color: #7259ad; font-size: 70px; line-height: 1; }
.aw-app .aw-dictation-text { font-size: clamp(34px, 4.7vw, 60px); line-height: 1.55; margin: 0; text-align: left; width: 100%; overflow-wrap: anywhere; }
.aw-app .aw-dictation-module > .aw-lang-toolbar { justify-content: center; }
.aw-app .aw-dictation-status { min-height: 24px; }
.aw-app .aw-timer-stage { min-height: 300px; }
.aw-app .aw-timer-face { width: min(100%, 800px); text-align: center; }
.aw-app .aw-timer-digits { font-size: clamp(70px, 16vw, 208px); letter-spacing: -.06em; line-height: 1.16; font-weight: 720; font-variant-numeric: tabular-nums; color: #455f87; }
.aw-app .aw-timer-progress { width: 80%; max-width: 580px; height: 12px; margin: 26px auto; border-radius: 10px; background: #edf0f5; overflow: hidden; }
.aw-app .aw-timer-progress-fill { display: block; width: 100%; height: 100%; border-radius: inherit; background: #98c9ba; transform: scaleX(var(--aw-timer-progress, 1)); transform-origin: left center; }
.aw-app .aw-timer-label { color: #788396; margin: 0; font-size: 21px; font-weight: 550; }
.aw-app .aw-timer-finished .aw-timer-digits { color: #a45455; }
.aw-app .aw-timer-finished .aw-timer-label { color: #a45455; }
.aw-app .aw-timer-module > .aw-lang-toolbar { justify-content: center; }
.aw-app .aw-timer-module > .aw-lang-toolbar > .aw-lang-button { min-width: 150px; }
.aw-app .aw-note-stage { background: var(--aw-lang-color-background); border-radius: 26px; min-height: 300px; padding: clamp(20px, 4vw, 48px); }
.aw-app .aw-note-text { display: block; width: 100%; min-height: 250px; padding: 0; border: 0; resize: vertical; background: transparent; color: var(--aw-lang-color-ink); text-align: center; font: inherit; font-size: var(--aw-note-size, 64px); font-weight: 650; line-height: 1.4; letter-spacing: -.03em; }
.aw-app .aw-note-text::placeholder { color: var(--aw-lang-color-ink); opacity: .55; }
@supports (font-size: 1cqi) {
  .aw-app .aw-sentence-word-text { font-size: clamp(32px, 6.7cqi, 72px); }
  .aw-app .aw-timer-digits { font-size: clamp(64px, 23cqi, 220px); }
  .aw-app .aw-dictation-text { font-size: clamp(32px, 5.6cqi, 64px); }
}
@media (max-width: 680px) {
  .aw-app .aw-lang-module { padding: 14px; gap: 14px; }
  .aw-app .aw-lang-toolbar { justify-content: center; gap: 10px; }
  .aw-app .aw-lang-button { padding: 11px 14px; }
  .aw-app .aw-sentence-word { min-height: 78px; border-radius: 16px; padding: 12px 14px; }
  .aw-app .aw-sentence-anatomy > span { font-size: 20px; }
  .aw-app .aw-lang-stage { min-height: 220px; }
  .aw-app .aw-reading-line { font-size: min(var(--aw-reading-size, 48px), 42px); }
  .aw-app .aw-note-text { font-size: min(var(--aw-note-size, 64px), 52px); }
  .aw-app .aw-lang-settings-form { padding: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .aw-app .aw-sentence-word { transition: none; }
}