:root {
  color-scheme: light;
  --ink: #102421;
  --muted: #60716b;
  --line: #b5c6bc;
  --paper: #f8fbf6;
  --panel: #eaf3ee;
  --screen: #061310;
  --teal: #008f8c;
  --teal-dark: #006a67;
  --coral: #c94850;
  --gold: #bd8b20;
  --green: #2d955f;
  --violet: #6756a6;
  --shadow: 0 22px 70px rgba(6, 19, 16, 0.18);
  --glow: 0 0 0 1px rgba(0, 143, 140, 0.2), 0 0 22px rgba(0, 143, 140, 0.18);
  font-family: Inter, "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", Arial, sans-serif;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  color: var(--ink);
  background:
    linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px),
    radial-gradient(circle at 18% 8%, rgba(0, 143, 140, 0.28), transparent 26%),
    radial-gradient(circle at 82% 0%, rgba(189, 139, 32, 0.22), transparent 24%),
    linear-gradient(135deg, #071411 0%, #16302a 38%, #eef6f0 38%, #f8fbf6 100%);
  background-size: 28px 28px, 28px 28px, auto, auto, auto;
}

button,
input,
textarea {
  font: inherit;
}

button {
  border: 0;
  cursor: pointer;
}

.demo-mode-panel[hidden],
.toolbox-panel[hidden],
.communication-step-panel[hidden],
.branch-intro-panel[hidden],
.generation-tier-strip[hidden],
.scenario-function-toggles[hidden],
.articulation-level-strip[hidden],
.voice-assessment-panel[hidden],
.language-dialogue-panel[hidden],
.fluency-panel[hidden],
.auditory-training-panel[hidden],
.swallow-screening-panel[hidden],
.pt-head-neck-panel[hidden],
.pt-direction-panel[hidden],
.pt-secondary-module[hidden],
.scenario-plan-output[hidden],
.scenario-generated-output[hidden],
.scenario-feedback-summary[hidden],
.toolbox-pack-grid[hidden],
.material-quality-workbench[hidden],
.material-layered-quality-report[hidden],
.quality-maintenance-system[hidden] {
  display: none;
}

.app-shell {
  width: min(1440px, 100%);
  margin: 0 auto;
  padding: 24px;
}

.workspace {
  display: grid;
  grid-template-columns: 280px 1fr;
  min-height: calc(100vh - 48px);
  overflow: hidden;
  border: 1px solid rgba(181, 198, 188, 0.9);
  border-radius: 8px;
  background: rgba(248, 251, 246, 0.92);
  box-shadow: var(--shadow);
}

.sidebar {
  display: flex;
  flex-direction: column;
  gap: 22px;
  padding: 24px;
  border-right: 1px solid var(--line);
  background:
    linear-gradient(180deg, rgba(6, 19, 16, 0.96), rgba(18, 45, 39, 0.96)),
    var(--screen);
  color: #eef8f4;
}

.brand {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.brand img {
  width: 74px;
  height: 74px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid rgba(124, 233, 216, 0.32);
  background: #dbeee8;
  box-shadow: var(--glow);
}

.brand p,
.eyebrow,
.section-heading p {
  margin: 0 0 4px;
  color: var(--teal-dark);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.sidebar .brand p,
.sidebar label {
  color: #98d8ca;
}

.sidebar .brand h1 {
  color: #f4fffb;
}

.brand h1,
.topbar h2,
.section-heading h3,
.phrase-header h3 {
  margin: 0;
}

.brand h1 {
  font-size: 1.06rem;
  line-height: 1.18;
}

.sidebar-title {
  display: grid;
  gap: 6px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(124, 233, 216, 0.18);
}

.sidebar-title p {
  margin: 0;
  color: #98d8ca;
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.sidebar-title h2 {
  margin: 0;
  color: #f4fffb;
  font-size: 1.3rem;
  line-height: 1.2;
}

.sidebar-mode-nav {
  display: grid;
  gap: 8px;
}

.sidebar-mode-nav[hidden] {
  display: none !important;
}

.sidebar-workflow-status[hidden] {
  display: none !important;
}

.sidebar-tools[hidden] {
  display: none !important;
}

.sidebar-mode-nav button {
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 8px 10px;
  align-items: center;
  min-height: 54px;
  padding: 10px 12px;
  border: 1px solid rgba(124, 233, 216, 0.2);
  border-radius: 8px;
  color: #eafdf8;
  background: rgba(255, 255, 255, 0.07);
  text-align: left;
}

.pt-sidebar-mode-nav button {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 8px;
  min-height: 42px;
  padding: 7px 9px;
}

.pt-sidebar-mode-nav span {
  overflow-wrap: anywhere;
}

.pt-sidebar-mode-nav small {
  justify-self: end;
  font-size: 0.82rem;
  font-weight: 850;
  opacity: 0.9;
}

.pt-sidebar-mode-nav .rehab-flow-step {
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  min-height: 58px;
  padding: 12px;
}

.pt-sidebar-mode-nav .rehab-flow-step > span:first-child {
  justify-self: start;
}

.pt-sidebar-mode-nav .rehab-flow-step > span:last-child {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.pt-sidebar-mode-nav .pt-guided-start {
  position: relative;
  border-color: rgba(212, 240, 108, 0.72);
  background:
    linear-gradient(135deg, rgba(124, 233, 216, 0.16), rgba(212, 240, 108, 0.14)),
    rgba(255, 255, 255, 0.08);
  box-shadow: 0 0 0 1px rgba(212, 240, 108, 0.32), 0 16px 32px rgba(124, 233, 216, 0.16);
  animation: ptGentleGuidePulse 2.8s ease-in-out 1;
}

.pt-sidebar-mode-nav .rehab-flow-step[aria-current="step"] {
  border-color: rgba(124, 233, 216, 0.72);
  color: #102421;
  background: linear-gradient(135deg, rgba(124, 233, 216, 0.94), rgba(212, 240, 108, 0.88));
}

.pt-step-badge {
  justify-self: start;
  width: fit-content;
  padding: 2px 7px;
  border-radius: 999px;
  color: #102421;
  background: rgba(212, 240, 108, 0.92);
  font-size: 0.72rem;
  font-style: normal;
  font-weight: 950;
  letter-spacing: 0.04em;
}

@keyframes ptGentleGuidePulse {
  0% {
    box-shadow: 0 0 0 0 rgba(212, 240, 108, 0.42), 0 16px 32px rgba(124, 233, 216, 0.12);
  }
  52% {
    box-shadow: 0 0 0 8px rgba(212, 240, 108, 0.12), 0 18px 34px rgba(124, 233, 216, 0.22);
  }
  100% {
    box-shadow: 0 0 0 1px rgba(212, 240, 108, 0.32), 0 16px 32px rgba(124, 233, 216, 0.16);
  }
}

@media (prefers-reduced-motion: reduce) {
  .pt-sidebar-mode-nav .pt-guided-start {
    animation: none;
  }
}

.sidebar-mode-nav button:hover,
.sidebar-mode-nav button:focus-visible,
.sidebar-mode-nav button.active {
  border-color: transparent;
  color: #102421;
  background: linear-gradient(135deg, #7ce9d8, #d4f06c);
  box-shadow: 0 10px 24px rgba(124, 233, 216, 0.24);
}

.sidebar-mode-nav span {
  font-size: 1.04rem;
  font-weight: 950;
}

.sidebar-mode-nav small {
  min-width: 0;
  color: inherit;
  font-size: 0.76rem;
  line-height: 1.25;
  opacity: 0.82;
}

.sidebar-workflow-status {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid rgba(124, 233, 216, 0.18);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.07);
}

.sidebar-workflow-status p,
.sidebar-workflow-status strong,
.sidebar-workflow-status span {
  margin: 0;
}

.sidebar-workflow-status p {
  color: #98d8ca;
  font-size: 0.75rem;
  font-weight: 900;
  text-transform: uppercase;
}

.sidebar-workflow-status strong {
  color: #f4fffb;
  font-size: 1rem;
}

.sidebar-workflow-status span {
  color: #cbe9e2;
  font-size: 0.82rem;
  line-height: 1.45;
}

.field-group {
  display: grid;
  gap: 8px;
}

.sidebar-tools {
  display: grid;
  gap: 12px;
  margin-top: auto;
  padding-top: 18px;
  border-top: 1px solid rgba(124, 233, 216, 0.2);
}

.sidebar-tools p {
  margin: 0;
  color: #98d8ca;
  font-size: 0.82rem;
  font-weight: 900;
}

label {
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 700;
}

input,
textarea,
select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  background: var(--paper);
}

.sidebar input,
.sidebar textarea {
  color: #ecfff8;
  border-color: rgba(124, 233, 216, 0.26);
  background: rgba(255, 255, 255, 0.06);
}

input,
select {
  min-height: 44px;
  padding: 0 12px;
}

textarea {
  resize: vertical;
  padding: 12px;
  line-height: 1.55;
}

.segmented,
.domain-tabs {
  display: grid;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.segmented {
  grid-template-columns: 1fr 1fr;
}

.domain-tabs {
  grid-template-columns: 1fr;
}

.segmented button,
.domain-tabs button,
.controls button,
.speech-check button,
.inline-form button,
.primary-action,
.secondary-action {
  min-height: 42px;
  border-radius: 8px;
  font-weight: 800;
}

.segmented button,
.domain-tabs button {
  color: var(--muted);
  background: transparent;
}

.segmented button.active,
.domain-tabs button.active {
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  box-shadow: var(--glow);
}

.primary-action {
  margin-top: auto;
  color: #fff;
  background: linear-gradient(135deg, var(--coral), var(--gold));
}

.secondary-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #dffcf4;
  border: 1px solid rgba(124, 233, 216, 0.28);
  background: rgba(255, 255, 255, 0.08);
  text-decoration: none;
}

.main-panel {
  display: grid;
  grid-template-rows: auto auto auto 1fr auto;
  gap: 20px;
  padding: 24px;
}

.topbar {
  position: relative;
  z-index: 80;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "hero actions";
  align-items: flex-start;
  gap: 16px 20px;
}

.topbar::after {
  content: "";
  grid-column: 1 / -1;
  justify-self: center;
  width: min(420px, 72%);
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(0, 143, 140, 0), rgba(0, 143, 140, 0.72), rgba(248, 176, 67, 0.62), rgba(0, 143, 140, 0));
  box-shadow: 0 10px 24px rgba(0, 143, 140, 0.12);
}

body.is-pt-tool .topbar::after {
  justify-self: start;
  width: min(520px, 100%);
  background: linear-gradient(90deg, rgba(36, 33, 26, 0.62), rgba(166, 95, 55, 0.38), rgba(73, 106, 147, 0));
}

.topbar h2 {
  max-width: 920px;
  font-size: clamp(1.25rem, 2.2vw, 2.05rem);
  line-height: 1.18;
  white-space: normal;
  text-wrap: balance;
}

.hero-copy {
  grid-area: hero;
  display: grid;
  gap: 8px;
  max-width: none;
  min-width: 0;
}

body:not(.is-pt-tool) .hero-copy {
  align-self: center;
  justify-items: center;
  text-align: center;
}

body:not(.is-pt-tool) .topbar h2 {
  margin-inline: auto;
  text-align: center;
}

.hero-service-positioning {
  max-width: 720px;
  margin: 0;
  color: rgba(16, 36, 33, 0.82);
  font-size: 0.94rem;
  font-weight: 850;
  line-height: 1.45;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.62);
}

body.is-pt-tool .topbar h2 {
  max-width: 980px;
  font-size: clamp(1.02rem, 1.72vw, 1.48rem);
  line-height: 1.28;
  text-wrap: pretty;
}

body.is-pt-tool .hero-service-positioning {
  color: rgba(16, 36, 33, 0.72);
  font-size: 0.88rem;
}

.stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(92px, 1fr));
  gap: 10px;
}

.stats div {
  min-width: 96px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(234, 243, 238, 0.92)),
    var(--paper);
  box-shadow: inset 0 0 0 1px rgba(0, 143, 140, 0.08);
}

.stats strong {
  display: block;
  font-size: 1.5rem;
}

.stats span {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
}

.topbar-actions {
  grid-area: actions;
  display: grid;
  gap: 10px;
  align-items: start;
  justify-content: end;
  justify-items: end;
  min-width: 0;
  width: min(100%, 460px);
}

.topbar-brand {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  justify-content: stretch;
  justify-items: start;
  width: 100%;
  padding: 2px 0;
  background: transparent;
}

.topbar-brand img {
  width: 44px;
  height: 44px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid rgba(0, 143, 140, 0.18);
}

.topbar-brand-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.brand-eyebrow {
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 1.1;
  text-transform: uppercase;
}

.topbar-brand h1,
.fantasy-title {
  margin: 0;
  color: var(--ink);
  font-family: "Cinzel", "Trajan Pro", Georgia, "Times New Roman", "Noto Sans TC", serif;
  font-size: clamp(0.9rem, 1.15vw, 1.12rem);
  font-weight: 900;
  line-height: 1.16;
  letter-spacing: 0;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.85), 0 0 14px rgba(0, 143, 140, 0.22);
  max-width: 100%;
  overflow-wrap: anywhere;
  text-align: left;
  text-wrap: balance;
  white-space: normal;
}

.rehab-home-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid rgba(0, 143, 140, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.02em;
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
}

.rehab-home-link:hover,
.rehab-home-link:focus-visible {
  border-color: rgba(0, 143, 140, 0.36);
  color: var(--brand-dark);
}

.pt-rehab-home-link[hidden] {
  display: none !important;
}

.pt-rehab-home-link {
  width: auto;
}

body.is-pt-tool .pt-rehab-home-link {
  justify-self: end;
  align-self: start;
  min-height: 40px;
  border-color: rgba(166, 95, 55, 0.26);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(244, 236, 223, 0.86)),
    #fff;
  color: #3a2a1d;
}

body.is-pt-tool .pt-rehab-home-link:hover,
body.is-pt-tool .pt-rehab-home-link:focus-visible {
  border-color: rgba(166, 95, 55, 0.48);
  color: #2b2018;
}

.topbar-login-row {
  display: grid;
  grid-template-columns: minmax(148px, 1fr) minmax(126px, 0.82fr);
  gap: 10px;
  align-items: start;
  justify-content: end;
  width: min(390px, 100%);
}

.professional-menu,
.addon-menu,
.material-peer-review-menu,
.topbar-service-menu {
  position: relative;
  min-width: 0;
}

.professional-menu summary,
.addon-menu summary,
.material-peer-review-menu summary,
.topbar-service-menu summary {
  min-height: 42px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  box-shadow: var(--glow);
  cursor: pointer;
  font-weight: 900;
  list-style: none;
  text-align: center;
}

.professional-menu summary::-webkit-details-marker,
.addon-menu summary::-webkit-details-marker,
.material-peer-review-menu summary::-webkit-details-marker,
.topbar-service-menu summary::-webkit-details-marker {
  display: none;
}

.professional-menu[open] summary,
.addon-menu[open] summary,
.material-peer-review-menu[open] summary,
.topbar-service-menu[open] summary {
  background: linear-gradient(135deg, var(--coral), var(--gold));
}

.professional-menu:not([open]) .professional-panel,
.addon-menu:not([open]) .addon-panel,
.material-peer-review-menu:not([open]) .material-peer-review-panel,
.topbar-service-menu:not([open]) .topbar-service-panel,
.business-panel:not([open]) > :not(summary) {
  display: none;
}

.professional-menu.primary-entry summary {
  background: linear-gradient(135deg, var(--teal), var(--green));
}

.topbar-service-menu summary {
  background: rgba(255, 255, 255, 0.78);
  color: var(--ink);
  box-shadow: none;
}

.topbar-service-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 24;
  display: grid;
  gap: 10px;
  width: min(620px, calc(100vw - 56px));
  max-height: min(76dvh, 760px);
  overflow: auto;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.08), transparent 48%),
    #fff;
  box-shadow: 0 24px 60px rgba(16, 36, 33, 0.2);
  scrollbar-gutter: stable;
}

.topbar-service-panel .rehab-home-link {
  width: 100%;
  min-height: 40px;
}

.topbar-service-panel .addon-panel,
.topbar-service-panel .material-peer-review-panel {
  position: static;
  width: 100%;
  max-height: none;
  box-shadow: none;
}

.addon-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 25;
  display: grid;
  gap: 12px;
  width: min(980px, calc(100vw - 56px));
  max-height: min(72dvh, 760px);
  overflow: auto;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.08), transparent 44%),
    #fff;
  box-shadow: 0 24px 60px rgba(16, 36, 33, 0.22);
  scrollbar-gutter: stable;
}

.addon-panel .business-panel {
  width: 100%;
}

.addon-panel .plan-service-panel,
.addon-panel .report-output-panel,
.addon-panel .line-service-panel {
  justify-self: stretch;
  width: 100%;
  padding: 10px;
}

.addon-panel .line-service-content {
  max-height: none;
  overflow: visible;
}

.professional-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 20;
  display: grid;
  gap: 12px;
  width: min(560px, calc(100vw - 56px));
  max-height: min(72dvh, 640px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(240, 247, 243, 0.98)),
    var(--paper);
  box-shadow: 0 18px 42px rgba(19, 47, 55, 0.16);
  scrollbar-gutter: stable;
}

.material-peer-review-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 22;
  display: grid;
  gap: 14px;
  width: min(720px, calc(100vw - 56px));
  max-height: min(72dvh, 700px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.1), rgba(246, 177, 122, 0.08)),
    #fff;
  box-shadow: 0 24px 60px rgba(16, 36, 33, 0.22);
  scrollbar-gutter: stable;
}

.peer-review-steps,
.material-peer-review-form {
  display: grid;
  gap: 10px;
}

.peer-review-steps {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 0;
  margin: 0;
  list-style: none;
}

.peer-review-steps li,
.material-peer-review-form label {
  border: 1px solid rgba(0, 143, 140, 0.18);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.82);
  padding: 12px;
}

.peer-review-steps b,
.peer-review-steps span,
.material-peer-review-form label {
  display: grid;
  gap: 6px;
}

.material-peer-review-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.material-peer-review-form label,
.material-peer-review-form input,
.material-peer-review-form select,
.material-peer-review-form textarea {
  min-width: 0;
}

.material-peer-review-form input,
.material-peer-review-form select,
.material-peer-review-form textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  font: inherit;
}

.material-peer-review-form textarea {
  resize: vertical;
}

.material-peer-review-form .peer-review-attestation,
.material-peer-review-form button {
  grid-column: 1 / -1;
}

.peer-review-attestation {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
}

.peer-review-attestation input {
  width: auto;
  margin-top: 3px;
}

.material-review-backoffice {
  display: grid;
  gap: 12px;
  padding-top: 4px;
}

.compact-heading h3 {
  font-size: clamp(1.02rem, 1.8vw, 1.28rem);
}

.peer-review-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.peer-review-lane {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(0, 143, 140, 0.18);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.78);
}

.peer-review-lane-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 0.9rem;
}

.peer-review-lane-heading b {
  color: var(--ink);
}

.peer-review-lane-heading span {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 0.78rem;
}

.peer-review-queue-card,
.peer-review-empty {
  min-width: 0;
  margin: 0;
  padding: 10px;
  border-radius: 10px;
  background: rgba(243, 249, 246, 0.9);
}

.peer-review-queue-card {
  display: grid;
  gap: 5px;
  border: 1px solid rgba(246, 177, 122, 0.28);
}

.peer-review-queue-card span,
.peer-review-queue-card small,
.peer-review-empty {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.45;
}

.peer-review-queue-card strong {
  color: var(--ink);
  font-size: 0.92rem;
}

.peer-review-queue-card p {
  margin: 0;
  color: var(--ink);
  font-size: 0.8rem;
  line-height: 1.45;
}

#signInProfessional {
  position: sticky;
  bottom: 0;
  z-index: 2;
  min-height: 48px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  box-shadow: 0 -8px 18px rgba(248, 251, 246, 0.94);
  font-weight: 900;
}

#billingStatus {
  position: sticky;
  bottom: 0;
  z-index: 2;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.2);
  border-radius: 8px;
  background: rgba(255, 253, 248, 0.96);
  box-shadow: 0 -10px 22px rgba(16, 36, 33, 0.08);
}

.upgrade-nudge[hidden] {
  display: none !important;
}

.upgrade-nudge {
  position: fixed;
  right: clamp(16px, 3vw, 32px);
  bottom: clamp(16px, 3vw, 32px);
  z-index: 80;
  display: grid;
  gap: 10px;
  width: min(380px, calc(100vw - 32px));
  padding: 16px;
  border: 1px solid rgba(0, 143, 140, 0.24);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 252, 249, 0.98)),
    var(--paper);
  box-shadow: 0 18px 44px rgba(17, 44, 53, 0.18);
}

.upgrade-nudge-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--teal-dark);
  font-size: 0.82rem;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.upgrade-nudge strong {
  color: var(--ink);
  font-size: 1.02rem;
}

.upgrade-nudge p {
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

.upgrade-nudge-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.upgrade-nudge-actions button {
  flex: 1 1 140px;
  min-height: 40px;
}

.upgrade-nudge-close {
  width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 999px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.82);
  font-size: 1.18rem;
  line-height: 1;
  box-shadow: none;
}

.upgrade-nudge-close:hover,
.upgrade-nudge-close:focus-visible {
  color: var(--ink);
  border-color: rgba(0, 143, 140, 0.42);
  background: rgba(237, 248, 244, 0.96);
}

.professional-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 10px;
  align-items: end;
}

.professional-grid label {
  display: grid;
  gap: 8px;
}

.professional-grid .email-consent-row {
  grid-column: 1 / -1;
  grid-template-columns: 20px 1fr;
  align-items: start;
  gap: 9px;
  padding: 10px 12px;
  border: 1px solid rgba(181, 198, 188, 0.6);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
}

.email-consent-row input {
  width: 18px;
  min-height: 18px;
  margin: 2px 0 0;
  accent-color: var(--teal);
}

.email-consent-row span {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.45;
}

.professional-grid button {
  grid-column: 1 / -1;
  min-height: 42px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-weight: 900;
}

.professional-grid .gm-test-button {
  color: var(--teal-dark);
  border: 1px solid rgba(0, 143, 140, 0.28);
  background: rgba(234, 243, 238, 0.8);
}

.qa-full-access-panel {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.34);
  border-radius: 8px;
  background: rgba(234, 243, 238, 0.9);
}

.qa-full-access-panel[hidden] {
  display: none;
}

.qa-full-access-panel p {
  margin: 0;
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.45;
}

.demo-mode-panel {
  display: grid;
  gap: 16px;
  padding: 18px;
}

.demo-mode-panel > p {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  font-weight: 800;
  line-height: 1.55;
}

.demo-flow-grid,
.demo-comic-panel {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 12px;
}

.demo-comic-panel {
  grid-template-columns: repeat(3, minmax(170px, 1fr)) minmax(240px, 0.95fr);
  align-items: stretch;
}

.demo-flow-grid article,
.demo-comic-card,
.demo-comic-preview {
  display: grid;
  gap: 8px;
  min-height: 132px;
  padding: 16px;
  border: 1px solid rgba(181, 198, 188, 0.72);
  border-radius: 8px;
  background: #f8f6ee;
}

.demo-comic-card,
.demo-comic-preview {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.08), transparent 45%),
    #f8f6ee;
}

.demo-comic-card::after,
.demo-comic-preview::after {
  position: absolute;
  inset: 0;
  border: 2px solid rgba(255, 255, 255, 0.58);
  border-radius: inherit;
  pointer-events: none;
  content: "";
}

.demo-flow-grid b,
.demo-comic-card b {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
}

.demo-flow-grid strong,
.demo-comic-card strong,
.demo-comic-preview strong {
  color: var(--teal-dark);
}

.demo-flow-grid span,
.demo-comic-card span,
.demo-comic-preview span {
  color: var(--muted);
  line-height: 1.5;
}

.comic-visual {
  position: relative;
  display: grid;
  min-height: 86px;
  place-items: center;
  border: 1px solid rgba(0, 143, 140, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(234, 243, 238, 0.78)),
    var(--paper);
  animation: demoGlow 3.2s ease-in-out infinite;
}

.comic-visual span {
  z-index: 1;
  display: grid;
  min-width: 68px;
  min-height: 34px;
  place-items: center;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-weight: 900;
}

.comic-visual i {
  position: absolute;
  display: block;
  border-radius: 999px;
  background: rgba(201, 72, 80, 0.2);
}

.comic-visual i:nth-child(1) {
  width: 46px;
  height: 12px;
  top: 18px;
  left: 18px;
}

.comic-visual i:nth-child(2) {
  width: 30px;
  height: 30px;
  right: 22px;
  bottom: 18px;
  background: rgba(189, 139, 32, 0.24);
}

.comic-visual i:nth-child(3) {
  width: 54px;
  height: 10px;
  right: 16px;
  top: 22px;
  background: rgba(103, 86, 166, 0.18);
}

.magic-builder {
  animation-delay: 0.35s;
}

.feedback-loop {
  animation-delay: 0.7s;
}

.demo-comic-preview {
  align-content: center;
  background:
    linear-gradient(135deg, rgba(103, 86, 166, 0.1), transparent 42%),
    #fff;
}

.demo-comic-preview p {
  margin: 0;
  color: var(--ink);
  font-weight: 900;
  line-height: 1.45;
}

.demo-comic-preview div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.demo-comic-preview button {
  min-height: 34px;
  padding: 0 10px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-size: 0.88rem;
  font-weight: 900;
  cursor: default;
}

.demo-comic-preview button:nth-child(2) {
  background: linear-gradient(135deg, var(--gold), var(--violet));
}

.demo-comic-preview button:nth-child(3) {
  background: linear-gradient(135deg, var(--coral), var(--gold));
}

@keyframes demoGlow {
  0%,
  100% {
    box-shadow: inset 0 0 0 1px rgba(0, 143, 140, 0.04);
    transform: translateY(0);
  }
  50% {
    box-shadow: inset 0 0 0 1px rgba(0, 143, 140, 0.2), 0 10px 24px rgba(0, 143, 140, 0.12);
    transform: translateY(-3px);
  }
}

.lesson-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
}

.lesson-card {
  display: grid;
  gap: 8px;
  min-height: 118px;
  padding: 16px;
  text-align: left;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(239, 247, 242, 0.95)),
    var(--paper);
}

.lesson-card.active {
  border-color: var(--teal);
  box-shadow: inset 0 0 0 2px rgba(0, 143, 140, 0.18), var(--glow);
}

.lesson-card strong {
  font-size: 1rem;
}

.lesson-card em {
  color: var(--coral);
  font-size: 0.8rem;
  font-style: normal;
  font-weight: 900;
}

.lesson-card span {
  color: var(--muted);
  line-height: 1.45;
}

.practice-area {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 18px;
  align-items: start;
}

.practice-card,
.homework,
.history,
.agent-panel,
.auth-panel,
.demo-mode-panel,
.system-check-panel,
.business-panel,
.line-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(240, 247, 243, 0.94)),
    var(--paper);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.practice-card {
  display: grid;
  gap: 18px;
  padding: 22px;
}

.phrase-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.phrase-header p {
  margin: 0 0 6px;
  color: var(--muted);
  font-weight: 800;
}

.phrase-header h3 {
  font-size: clamp(1.28rem, 2.5vw, 2.05rem);
  line-height: 1.2;
}

#difficultyTag {
  flex: 0 0 auto;
  padding: 8px 10px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--gold), var(--violet));
  font-size: 0.82rem;
  font-weight: 900;
  box-shadow: var(--glow);
}

.cue-list {
  display: grid;
  gap: 10px;
}

.cue {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border-radius: 8px;
  border: 1px solid rgba(181, 198, 188, 0.65);
  background: #f3f8f5;
}

.cue b {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
}

.cue span {
  line-height: 1.45;
}

.practice-flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 1fr));
  gap: 10px;
}

.practice-flow p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 800;
}

.practice-flow div {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 8px;
  align-items: center;
  min-height: 58px;
  padding: 10px;
  border: 1px solid rgba(181, 198, 188, 0.65);
  border-radius: 8px;
  background: #f8fbf6;
}

.practice-flow b {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(135deg, var(--gold), var(--coral));
  font-size: 0.86rem;
}

.practice-flow span {
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.35;
}

.controls {
  display: grid;
  grid-template-columns: repeat(3, minmax(130px, 1fr));
  gap: 10px;
}

.controls button,
.speech-check button,
.inline-form button {
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
}

.controls button:nth-child(2) {
  background: linear-gradient(135deg, var(--coral), #8d4fb6);
}

.controls button:nth-child(3) {
  background: linear-gradient(135deg, var(--green), var(--gold));
}

audio {
  width: 100%;
}

.business-panel {
  display: grid;
  gap: 16px;
  padding: 18px;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.14), transparent 42%),
    linear-gradient(315deg, rgba(103, 86, 166, 0.12), transparent 36%),
    #ffffff;
}

.toolbox-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.1), transparent 40%),
    linear-gradient(315deg, rgba(189, 139, 32, 0.12), transparent 36%),
    #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.76);
}

.toolbox-panel {
  display: grid;
  gap: 16px;
  padding: 18px;
}

.scenario-composer-copy {
  max-width: 900px;
  margin: 0;
  color: var(--muted);
  font-weight: 800;
  line-height: 1.55;
}

.generation-tier-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
}

.generation-tier-strip article {
  display: grid;
  gap: 8px;
  min-height: 118px;
  padding: 14px;
  border: 1px solid rgba(181, 198, 188, 0.82);
  border-radius: 8px;
  color: var(--ink);
  text-align: left;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(243, 248, 245, 0.94)),
    var(--paper);
}

.generation-tier-strip .advanced-generation-locked {
  border-color: rgba(201, 72, 80, 0.42);
  background:
    linear-gradient(135deg, rgba(201, 72, 80, 0.18), rgba(232, 179, 68, 0.2) 48%, rgba(103, 86, 166, 0.14)),
    #fffaf1;
  box-shadow: 0 14px 28px rgba(201, 72, 80, 0.12);
}

.generation-tier-strip span {
  color: var(--coral);
  font-size: 0.8rem;
  font-weight: 900;
}

.generation-tier-strip strong {
  font-size: 1rem;
}

.generation-tier-strip p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.unlock-advanced-button {
  min-height: 46px;
  padding: 0 18px;
  border: 0;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--coral), var(--gold) 52%, var(--violet));
  box-shadow: 0 12px 22px rgba(201, 72, 80, 0.24);
  font-weight: 950;
  letter-spacing: 0;
}

.unlock-advanced-button:hover,
.unlock-advanced-button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 16px 30px rgba(201, 72, 80, 0.32);
}

.scenario-function-toggles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  gap: 8px;
}

.scenario-function-toggles label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 8px;
  background: #f8fbf6;
  color: var(--ink);
  font-weight: 900;
}

.scenario-function-toggles input {
  width: 18px;
  min-height: 18px;
  accent-color: var(--teal);
}

.scenario-function-toggles label:has(input:checked) {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, var(--teal), var(--green));
  box-shadow: var(--glow);
}

.communication-branch-gate {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
  gap: 8px;
}

.communication-branch-gate button {
  display: grid;
  gap: 5px;
  min-height: 86px;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.78);
  border-radius: 8px;
  color: var(--ink);
  background: rgba(255, 255, 255, 0.82);
  text-align: left;
  box-shadow: 0 8px 18px rgba(16, 36, 33, 0.06);
}

.communication-branch-gate button:hover,
.communication-branch-gate button:focus-visible,
.communication-branch-gate button.active {
  border-color: transparent;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  box-shadow: var(--glow);
}

.communication-branch-gate span {
  font-size: 1.06rem;
  font-weight: 950;
}

.communication-branch-gate strong {
  font-size: 0.76rem;
  line-height: 1.35;
}

.communication-step-panel {
  display: grid;
  gap: 14px;
}

.branch-intro-panel {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(0, 143, 140, 0.24);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(238, 247, 242, 0.9)),
    var(--paper);
  box-shadow: 0 14px 32px rgba(16, 36, 33, 0.08);
}

.branch-intro-track {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
  gap: 10px;
}

.branch-intro-track article {
  display: grid;
  min-height: 168px;
  gap: 8px;
  align-content: start;
  padding: 14px;
  border: 1px solid rgba(181, 198, 188, 0.72);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.76);
  animation: branchIntroSweep 10s ease-in-out infinite;
  animation-delay: var(--intro-delay);
}

.branch-intro-track .intro-delay-0 {
  --intro-delay: 0s;
}

.branch-intro-track .intro-delay-2 {
  --intro-delay: 2s;
}

.branch-intro-track .intro-delay-4 {
  --intro-delay: 4s;
}

.branch-intro-track .intro-delay-6 {
  --intro-delay: 6s;
}

.branch-intro-track .intro-delay-8 {
  --intro-delay: 8s;
}

.branch-intro-track .intro-delay-10 {
  --intro-delay: 10s;
}

.branch-intro-track span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  color: #fff;
  background: var(--teal);
  font-size: 0.78rem;
  font-weight: 950;
}

.branch-intro-track strong {
  color: var(--teal-dark);
  font-size: 1rem;
}

.branch-intro-track p {
  margin: 0;
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.55;
}

.branch-intro-progress {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(181, 198, 188, 0.44);
}

.branch-intro-progress span {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--teal), var(--gold), var(--coral));
  transform-origin: left center;
  animation: branchIntroProgress 10s linear infinite;
}

.branch-safety-boundary {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid rgba(181, 198, 188, 0.72);
  border-radius: 8px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.74);
  font-size: 0.88rem;
  line-height: 1.6;
}

@keyframes branchIntroSweep {
  0%,
  18%,
  100% {
    border-color: rgba(181, 198, 188, 0.72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.76);
    transform: translateY(0);
  }
  6%,
  12% {
    border-color: rgba(189, 139, 32, 0.72);
    box-shadow: 0 0 0 4px rgba(189, 139, 32, 0.16), 0 16px 26px rgba(16, 36, 33, 0.12);
    transform: translateY(-2px);
  }
}

@keyframes branchIntroProgress {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}

.articulation-level-strip,
.generated-articulation-levels div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.articulation-level-strip button,
.generated-articulation-levels button {
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font-weight: 900;
}

.articulation-level-strip button:hover,
.articulation-level-strip button:focus-visible,
.generated-articulation-levels button:hover,
.generated-articulation-levels button:focus-visible,
.generated-articulation-levels button.active {
  border-color: transparent;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  box-shadow: var(--glow);
}

.articulation-setup-panel,
.voice-assessment-panel,
.language-dialogue-panel,
.auditory-training-panel,
.swallow-screening-panel {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(181, 198, 188, 0.78);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.78);
}

.articulation-sampler-panel {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(0, 143, 140, 0.28);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.12), transparent 45%),
    #f8fbf6;
}

.articulation-setup-panel[hidden],
.articulation-sampler-panel[hidden],
.voice-assessment-panel[hidden],
.language-dialogue-panel[hidden],
.fluency-panel[hidden],
.auditory-training-panel[hidden],
.swallow-screening-panel[hidden] {
  display: none;
}

.sampler-heading,
.sampler-controls,
.language-dialogue-controls {
  display: grid;
  gap: 10px;
}

.sampler-heading {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}

.sampler-heading span,
.sampler-mark-guide-label {
  color: var(--teal);
  font-size: 0.78rem;
  font-weight: 950;
  text-transform: uppercase;
}

.sampler-heading h4,
.sampler-heading p {
  margin: 0;
}

.sampler-heading output {
  min-width: 132px;
  padding: 10px 12px;
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font-weight: 950;
  text-align: center;
}

.branch-inline-status {
  display: inline-grid;
  justify-self: start;
  min-width: min(220px, 100%);
  padding: 9px 12px;
  border: 1px solid rgba(0, 143, 140, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--ink);
  font-weight: 900;
}

.sampler-controls {
  grid-template-columns: repeat(2, minmax(160px, 1fr));
}

.sampler-controls label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-weight: 900;
}

.sampler-mark-guide {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-self: start;
  width: fit-content;
  max-width: 100%;
  gap: 6px;
  background: transparent;
}

.sampler-mark-guide-label {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(0, 143, 140, 0.1);
}

.sampler-mark-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.sampler-mark-guide b {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 6px 10px;
  border: 1px solid rgba(0, 143, 140, 0.12);
  border-radius: 999px;
  background: #fff;
  color: var(--ink);
  box-shadow: 0 6px 14px rgba(28, 71, 68, 0.06);
}

.sampler-recording-row {
  display: grid;
  grid-template-columns: auto minmax(180px, 0.6fr) minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.sampler-recording-row button {
  min-height: 40px;
  padding: 8px 12px;
  border: 0;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--teal), var(--green));
  color: #fff;
  font-weight: 950;
}

.sampler-recording-row audio {
  width: 100%;
}

.sampler-recording-row span {
  color: var(--muted);
  line-height: 1.45;
}

.sampler-mode-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 10px;
}

.sampler-mode-row article {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
}

.sampler-mode-row span {
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 950;
}

.sampler-mode-row strong {
  color: var(--ink);
}

.voice-layer-grid,
.auditory-source-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 12px;
}

.auditory-source-strip {
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

.language-dialogue-studio {
  background:
    radial-gradient(circle at 10% 12%, rgba(232, 179, 68, 0.18), transparent 32%),
    linear-gradient(135deg, rgba(0, 143, 140, 0.12), rgba(103, 86, 166, 0.08)),
    #f8fbf6;
}

.language-mode-stage,
.language-practice-stage {
  display: grid;
  gap: 14px;
}

.language-mode-stage[hidden],
.language-practice-stage[hidden] {
  display: none;
}

.language-studio-rail {
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: 10px;
}

.language-studio-rail article {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.2);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.language-studio-rail span {
  color: var(--coral);
  font-size: 0.76rem;
  font-weight: 950;
}

.language-studio-rail strong {
  color: var(--ink);
  font-size: 1rem;
}

.language-studio-rail p {
  margin: 0;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.4;
}

.language-mode-selector {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

.language-mode-selector button,
.language-mode-selector a {
  display: grid;
  gap: 7px;
  min-height: 112px;
  padding: 16px;
  border: 1px solid rgba(0, 143, 140, 0.24);
  border-radius: 8px;
  color: var(--ink);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(248, 251, 246, 0.84)),
    var(--paper);
  text-align: left;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
  text-decoration: none;
}

.language-mode-selector button.active {
  border-color: rgba(0, 143, 140, 0.58);
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.16), rgba(232, 179, 68, 0.2)),
    #fff;
  box-shadow: 0 12px 24px rgba(16, 36, 33, 0.1);
}

.language-mode-selector a:hover,
.language-mode-selector a:focus-visible,
.language-mode-selector button:hover,
.language-mode-selector button:focus-visible {
  border-color: rgba(0, 143, 140, 0.46);
  box-shadow: 0 12px 24px rgba(16, 36, 33, 0.1);
  transform: translateY(-1px);
}

.language-mode-selector span {
  color: var(--coral);
  font-size: 0.76rem;
  font-weight: 950;
}

.language-mode-selector strong {
  color: var(--ink);
  font-size: 1.02rem;
}

.language-mode-selector small {
  color: var(--muted);
  font-weight: 800;
  line-height: 1.35;
}

.language-mode-selector .language-mode-start-cue {
  margin-top: 2px;
  color: rgba(16, 36, 33, 0.84);
  font-size: 0.78rem;
  font-weight: 950;
  line-height: 1.38;
}

.language-play-top-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  white-space: nowrap;
}

.quest-card-explainer,
.device-material-import {
  padding: 14px 16px;
  border: 1px solid rgba(0, 143, 140, 0.24);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.84);
}

.quest-card-explainer > div:first-child {
  display: grid;
  gap: 5px;
}

.quest-card-explainer span,
.quest-sample-pair small {
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 950;
}

.quest-card-explainer p,
.device-material-import p {
  margin: 3px 0 0;
  color: var(--muted);
}

.quest-sample-pair {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  margin-top: 12px;
}

.quest-sample-pair article {
  min-height: 120px;
  padding: 14px;
  border: 2px solid rgba(0, 143, 140, 0.3);
  border-radius: 12px;
  background: linear-gradient(145deg, #fff, rgba(225, 245, 238, 0.74));
  box-shadow: 0 10px 22px rgba(16, 36, 33, 0.08);
}

.quest-sample-pair article:last-child {
  border-color: rgba(217, 92, 67, 0.34);
  background: linear-gradient(145deg, #fff, rgba(255, 235, 219, 0.8));
}

.quest-sample-pair article strong,
.quest-sample-pair article p {
  display: block;
  margin-top: 6px;
}

.device-material-import summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  justify-content: space-between;
  cursor: pointer;
}

.device-material-import > :not(summary) {
  margin-top: 10px;
}

.device-material-import input[type="file"],
.device-material-import output,
.device-material-import ol {
  display: block;
  width: 100%;
}

.device-material-import ol {
  max-height: 220px;
  overflow: auto;
}

@media (max-width: 680px) {
  .quest-sample-pair { grid-template-columns: 1fr; }
  .quest-sample-pair > span { text-align: center; }
}

.language-play-entry {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  border: 1px solid rgba(0, 143, 140, 0.28);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
}

.language-play-entry p {
  margin: 4px 0 0;
  color: var(--muted);
}

.language-play-entry a {
  flex: 0 0 auto;
  min-height: 44px;
  padding: 10px 16px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-weight: 950;
  text-decoration: none;
}

.quest-demo-panel {
  display: grid;
  gap: 0;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.26);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(242, 248, 244, 0.88)),
    var(--paper);
  box-shadow: 0 14px 32px rgba(16, 36, 33, 0.08);
}

.quest-demo-disclosure summary {
  display: grid;
  grid-template-columns: minmax(92px, auto) minmax(0, 1fr) minmax(180px, auto) auto;
  gap: 10px;
  align-items: center;
  cursor: pointer;
  list-style: none;
}

.quest-demo-disclosure summary::-webkit-details-marker {
  display: none;
}

.quest-demo-disclosure summary::after {
  justify-self: end;
  color: var(--coral);
  content: "+";
  font-size: 1.18rem;
  font-weight: 950;
  line-height: 1;
}

.quest-demo-disclosure[open] summary::after {
  content: "-";
}

.quest-demo-disclosure summary span {
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 950;
}

.quest-demo-disclosure summary strong {
  color: var(--teal-dark);
  font-size: 1rem;
}

.quest-demo-disclosure summary small {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 850;
  line-height: 1.35;
}

.quest-demo-body {
  display: grid;
  gap: 14px;
  padding-top: 14px;
}

.quest-demo-copy {
  display: grid;
  gap: 5px;
}

.quest-demo-copy span {
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 950;
}

.quest-demo-copy h4 {
  margin: 0;
  color: var(--ink);
  font-size: 1.1rem;
}

.quest-demo-copy p {
  max-width: 78ch;
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

.quest-demo-stage {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px;
}

.quest-demo-step {
  position: relative;
  display: grid;
  min-height: 166px;
  gap: 8px;
  align-content: start;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.72);
  border-radius: 8px;
  color: var(--ink);
  text-align: left;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.quest-demo-step span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  color: #fff;
  background: var(--teal);
  font-size: 0.82rem;
  font-weight: 950;
}

.quest-demo-step strong {
  color: var(--teal-dark);
  font-size: 0.92rem;
}

.quest-demo-step b {
  color: var(--ink);
  font-size: 0.94rem;
  line-height: 1.45;
}

.quest-demo-step small {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.45;
}

.quest-demo-step.active {
  border-color: rgba(189, 139, 32, 0.72);
  box-shadow: 0 0 0 3px rgba(189, 139, 32, 0.16), 0 16px 28px rgba(16, 36, 33, 0.12);
  transform: translateY(-2px);
  animation: questDemoPulse 1.3s ease-in-out infinite;
}

.quest-demo-step.active span {
  background: linear-gradient(135deg, var(--gold), var(--coral));
}

.quest-demo-controls {
  display: grid;
  grid-template-columns: auto auto auto minmax(220px, 1fr);
  gap: 8px;
  align-items: center;
}

.quest-demo-controls output {
  min-height: 42px;
  padding: 10px 12px;
  border: 1px solid rgba(0, 143, 140, 0.22);
  border-radius: 8px;
  color: var(--teal-dark);
  background: #eef7f2;
  font-weight: 900;
}

@keyframes questDemoPulse {
  0% {
    box-shadow: 0 0 0 3px rgba(189, 139, 32, 0.12), 0 16px 28px rgba(16, 36, 33, 0.1);
  }
  50% {
    box-shadow: 0 0 0 6px rgba(189, 139, 32, 0.2), 0 18px 32px rgba(16, 36, 33, 0.14);
  }
  100% {
    box-shadow: 0 0 0 3px rgba(189, 139, 32, 0.12), 0 16px 28px rgba(16, 36, 33, 0.1);
  }
}

.language-dialogue-controls {
  grid-template-columns: minmax(180px, 1fr) minmax(150px, 0.8fr) auto;
  align-items: end;
}

.language-practice-start-hint {
  grid-column: 1 / -1;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid rgba(0, 143, 140, 0.14);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.72);
  color: rgba(16, 36, 33, 0.76);
  font-size: 0.86rem;
  font-weight: 850;
  line-height: 1.5;
}

.language-response-choice-card {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(0, 143, 140, 0.22);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(248, 251, 246, 0.88)),
    var(--paper);
}

.language-response-choice-card > span {
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 950;
}

.language-response-choice-card > strong {
  color: var(--ink);
  font-size: 1.08rem;
}

.language-response-context {
  margin: 0;
  color: var(--ink);
  line-height: 1.55;
}

.language-response-choice-card blockquote {
  margin: 0;
  padding: 12px 14px;
  border-left: 4px solid var(--teal);
  border-radius: 10px;
  background: rgba(0, 143, 140, 0.08);
  color: var(--teal-dark);
  font-weight: 900;
}

.language-response-choice-grid {
  display: grid;
  gap: 10px;
}

.language-response-choice-grid button {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: center;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid rgba(181, 198, 188, 0.8);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.88);
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.language-response-choice-grid button.active {
  border-color: rgba(0, 143, 140, 0.58);
  background: rgba(0, 143, 140, 0.1);
}

.language-response-choice-grid b {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: var(--teal);
  color: #fff;
}

.language-response-feedback {
  min-height: 28px;
  color: var(--teal-dark);
  font-weight: 900;
  line-height: 1.45;
}

.language-dialogue-controls label {
  display: grid;
  gap: 6px;
  color: var(--teal-dark);
  font-size: 0.84rem;
  font-weight: 900;
}

.language-dialogue-controls select {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(181, 198, 188, 0.78);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--ink);
}

.language-flow-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.language-flow-steps li {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.22);
  border-radius: 8px;
  background: #f6fbf8;
}

.language-flow-steps b {
  color: var(--teal-dark);
}

.language-flow-steps span {
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.45;
}

.language-presentation-toggle {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(181, 198, 188, 0.68);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.76);
}

.language-presentation-toggle span {
  color: var(--teal-dark);
  font-weight: 900;
}

.language-presentation-toggle button {
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid rgba(0, 143, 140, 0.24);
  border-radius: 8px;
  color: var(--teal-dark);
  background: #fff;
  font-weight: 900;
}

.language-presentation-toggle button.active {
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
}

.language-dialogue-profile {
  display: block;
  padding: 10px 12px;
  border: 1px solid rgba(0, 143, 140, 0.32);
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-weight: 900;
}

.language-dialogue-current-card {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(0, 143, 140, 0.3);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(241, 249, 246, 0.92)),
    var(--paper);
  box-shadow: 0 14px 30px rgba(16, 36, 33, 0.08);
}

.language-dialogue-current-card span {
  color: var(--coral);
  font-size: 0.82rem;
  font-weight: 900;
}

.language-dialogue-current-card strong {
  display: block;
  margin-top: 4px;
  color: var(--ink);
  font-size: 1.05rem;
}

.language-dialogue-current-card > div > p {
  max-width: 68ch;
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.language-story-focus-card {
  display: grid;
  grid-template-columns: minmax(104px, 0.32fr) minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.24);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(244, 251, 248, 0.92)),
    var(--paper);
}

.language-story-focus-visual {
  display: grid;
  place-items: center;
  min-height: 132px;
  border: 2px solid rgba(16, 36, 33, 0.86);
  border-radius: 8px;
  color: var(--ink);
  background: #fff;
}

.language-story-focus-visual svg {
  width: min(100%, 118px);
  height: auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.language-story-focus-card h5,
.language-story-focus-card p {
  margin: 0;
}

.language-story-focus-card h5 {
  color: var(--ink);
  font-size: 1.08rem;
}

.language-story-focus-card p {
  margin-top: 5px;
  color: var(--muted);
  font-weight: 800;
  line-height: 1.45;
}

.language-picture-description-card {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  align-items: start;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.24);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(244, 251, 248, 0.9)),
    var(--paper);
}

.language-picture-scene-visual {
  display: grid;
  place-items: center;
  min-height: 280px;
  padding: 14px;
  border: 2px solid rgba(16, 36, 33, 0.84);
  border-radius: 8px;
  color: var(--ink);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 251, 247, 0.96));
}

.language-picture-scene-visual svg {
  display: block;
  width: min(100%, 760px);
  height: clamp(240px, 38vw, 420px);
  aspect-ratio: 420 / 260;
}

.language-picture-scene-visual img {
  display: block;
  width: min(100%, 960px);
  height: auto;
  max-height: 520px;
  object-fit: contain;
  border-radius: 6px;
  background: #fff;
}

.language-picture-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.language-picture-quick-actions button {
  padding: 6px 10px;
  border: 1px solid rgba(0, 143, 140, 0.24);
  border-radius: 999px;
  color: var(--teal-deep);
  background: rgba(255, 255, 255, 0.82);
  font-size: 0.78rem;
  font-weight: 950;
}

.language-picture-quick-actions button.active {
  color: #fff;
  background: var(--teal);
}

.language-picture-description-copy {
  display: grid;
  gap: 9px;
  align-content: start;
}

.language-picture-description-copy span {
  color: var(--coral);
  font-size: 0.76rem;
  font-weight: 950;
}

.language-picture-description-copy strong {
  color: var(--ink);
  font-size: 1.02rem;
}

.language-picture-description-copy small {
  color: var(--muted);
  font-weight: 850;
  line-height: 1.45;
}

.language-picture-description-copy h5,
.language-picture-description-copy p,
.language-picture-checklist {
  margin: 0;
}

.language-picture-description-copy h5 {
  color: var(--ink);
  font-size: 1.08rem;
}

.language-picture-description-copy p {
  color: var(--muted);
  font-weight: 800;
  line-height: 1.45;
}

.language-picture-observation-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.language-picture-observation-grid span {
  padding: 6px 9px;
  border: 1px solid rgba(0, 143, 140, 0.26);
  border-radius: 999px;
  color: var(--teal-deep);
  background: rgba(0, 143, 140, 0.08);
  font-size: 0.78rem;
  font-weight: 950;
}

.language-picture-checklist {
  display: grid;
  gap: 6px;
  padding-left: 18px;
  color: var(--ink);
  font-weight: 800;
  line-height: 1.42;
}

.language-picture-story-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.language-picture-story-grid > div,
.language-picture-adaptation-box {
  display: grid;
  gap: 7px;
  padding: 9px;
  border: 1px solid rgba(16, 36, 33, 0.1);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
}

.language-picture-story-grid b,
.language-picture-adaptation-box b {
  color: var(--ink);
  font-size: 0.78rem;
}

.language-picture-question-list,
.language-picture-adaptation-box ul {
  display: grid;
  gap: 5px;
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1.35;
}

.language-picture-scaffold-steps {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.language-picture-scaffold-steps li {
  display: grid;
  grid-template-columns: 4.5rem minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  padding: 8px;
  border-left: 3px solid rgba(245, 125, 84, 0.78);
  border-radius: 8px;
  background: rgba(255, 248, 232, 0.78);
}

.language-picture-scaffold-steps b {
  color: var(--coral);
  font-size: 0.8rem;
}

.language-picture-scaffold-steps span {
  color: var(--ink);
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.38;
}

.language-picture-task-card {
  display: grid;
  gap: 6px;
  padding: 10px;
  border-radius: 8px;
  background: rgba(255, 248, 232, 0.9);
}

.language-picture-task-card h5,
.language-picture-task-card p {
  margin: 0;
}

.language-picture-task-card h5 {
  color: var(--ink);
}

.language-picture-task-card p {
  color: var(--muted);
  font-weight: 800;
  line-height: 1.45;
}

.language-picture-task-card ol {
  display: grid;
  gap: 5px;
  margin: 0;
  padding-left: 20px;
  color: var(--muted);
  font-weight: 850;
}

.language-picture-next-step {
  justify-self: start;
  min-height: 40px;
  margin-top: 4px;
}

.language-story-progress {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin-top: 10px;
}

.language-story-progress span {
  display: grid;
  gap: 4px;
  min-height: 56px;
  padding: 7px;
  border: 1px solid rgba(181, 198, 188, 0.7);
  border-radius: 8px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.7);
  font-size: 0.75rem;
  font-weight: 850;
  line-height: 1.25;
}

.language-story-progress span.active {
  border-color: rgba(255, 123, 84, 0.64);
  color: var(--ink);
  background: rgba(255, 248, 232, 0.96);
}

.language-story-progress b {
  color: var(--coral);
  font-size: 0.8rem;
}

.language-dialogue-turns {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.language-workflow-steps,
.language-support-prompts ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.language-workflow-steps li {
  padding: 9px 10px;
  border-radius: 8px;
  background: rgba(0, 143, 140, 0.09);
  color: var(--ink);
  font-weight: 850;
  line-height: 1.45;
}

.language-support-prompts {
  display: grid;
  gap: 8px;
  padding: 10px;
  border-radius: 8px;
  background: rgba(255, 123, 84, 0.1);
}

.language-support-prompts b {
  color: var(--coral);
}

.language-support-prompts li {
  color: var(--ink);
  line-height: 1.45;
}

.support-center-host {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 40;
  width: min(24rem, calc(100vw - 2rem));
}

.support-center-host > p {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.support-center {
  max-height: min(86vh, 720px);
  display: grid;
  justify-items: end;
  gap: 0.75rem;
}

.support-center-entry,
.support-center-form button {
  border: 0;
  border-radius: 999px;
  background: #1f4f46;
  color: #fff;
  cursor: pointer;
  font-weight: 800;
  padding: 0.85rem 1.1rem;
  box-shadow: 0 16px 36px rgba(15, 35, 31, 0.22);
}

.support-center[data-support-center-open="true"] .support-center-entry {
  display: none;
}

.support-center-panel {
  width: 100%;
  max-height: min(76vh, 620px);
  overflow-y: auto;
  border: 1px solid rgba(31, 79, 70, 0.18);
  border-radius: 1.25rem;
  background: #fffdf8;
  box-shadow: 0 24px 60px rgba(15, 35, 31, 0.24);
  padding: 1rem;
}

.support-center-header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 1rem;
}

.support-center-header p,
.support-center-header h2,
.support-center-timeline h3 {
  margin: 0;
}

.support-center-close {
  border: 0;
  border-radius: 999px;
  background: rgba(31, 79, 70, 0.1);
  color: #1f4f46;
  cursor: pointer;
  font-size: 1.25rem;
  line-height: 1;
  min-width: 2rem;
  min-height: 2rem;
}

.support-center-form {
  display: grid;
  gap: 0.75rem;
}

.support-center-form label {
  display: grid;
  gap: 0.35rem;
  font-weight: 700;
}

.support-center-form input,
.support-center-form select,
.support-center-form textarea {
  width: 100%;
  border: 1px solid rgba(31, 79, 70, 0.25);
  border-radius: 0.8rem;
  font: inherit;
  padding: 0.7rem 0.8rem;
}

.support-center-form textarea::placeholder {
  color: rgba(31, 79, 70, 0.52);
  font-weight: 700;
}

.support-center-status {
  display: block;
  min-height: 1.4rem;
  margin-top: 0.75rem;
  font-weight: 800;
  color: #1f4f46;
}

.support-center-timeline {
  max-height: min(18dvh, 160px);
  overflow-y: auto;
  margin-top: 1rem;
  border-top: 1px solid rgba(31, 79, 70, 0.14);
  padding-top: 0.85rem;
}

.support-center-timeline ol {
  margin: 0.5rem 0 0;
  padding-left: 1.25rem;
}

.pwa-update-banner {
  position: fixed;
  left: 50%;
  bottom: 1rem;
  z-index: 60;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: min(42rem, calc(100vw - 2rem));
  padding: 0.85rem 1rem;
  border: 1px solid rgba(0, 143, 140, 0.24);
  border-radius: 999px;
  color: var(--ink);
  background: rgba(255, 253, 248, 0.96);
  box-shadow: 0 18px 42px rgba(16, 36, 33, 0.2);
  transform: translateX(-50%);
}

.pwa-update-banner span {
  min-width: 0;
  font-weight: 850;
}

.pwa-update-banner button {
  flex: 0 0 auto;
  min-height: 40px;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-weight: 950;
  padding: 0 1rem;
}

.language-dialogue-turns li {
  display: grid;
  grid-template-columns: minmax(76px, 0.28fr) minmax(0, 1fr);
  gap: 8px;
  padding: 8px;
  border-radius: 8px;
  background: #f3f8f5;
}

.language-dialogue-turns li.is-answer-hidden {
  border: 1px dashed rgba(189, 139, 32, 0.48);
  background: #fff8e8;
}

.language-dialogue-turns li.is-answer-hidden span {
  color: var(--coral);
  font-weight: 900;
}

.language-dialogue-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 10px;
}

.language-dialogue-detail-grid section {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.68);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.74);
}

.language-dialogue-detail-grid h4 {
  margin: 0;
  color: var(--teal-dark);
}

.language-dialogue-detail-grid ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
}

.language-dialogue-mark-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.language-dialogue-mark-buttons button {
  min-height: 40px;
  padding: 0 12px;
  border-radius: 8px;
  color: var(--teal-dark);
  background: #eaf3ee;
  font-weight: 900;
}

.language-dialogue-mark-buttons button.active {
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
}

.fluency-edge-panel {
  display: grid;
  gap: 14px;
}

.fluency-control-grid {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(220px, 1fr) auto;
  gap: 10px;
  align-items: end;
}

.articulation-control-grid {
  grid-template-columns: repeat(3, minmax(160px, 1fr));
}

.fluency-control-grid label,
.fluency-transcript-field {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-weight: 900;
}

.fluency-current-sample,
.fluency-record-card,
.fluency-mark-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.86);
}

.fluency-sample-meta {
  display: grid;
  gap: 4px;
}

.fluency-sample-meta span {
  color: var(--coral);
  font-size: 0.8rem;
  font-weight: 950;
}

.fluency-sample-meta strong {
  color: var(--ink);
  font-size: 1.1rem;
}

.fluency-current-sample blockquote {
  margin: 0;
  padding: 14px;
  border-left: 4px solid var(--teal);
  border-radius: 8px;
  background: #f3f8f5;
  color: var(--ink);
  font-size: 1.08rem;
  line-height: 1.8;
}

.fluency-task-brief {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.28);
  border-radius: 8px;
  background: rgba(0, 143, 140, 0.08);
}

.fluency-task-brief > b {
  color: var(--teal-dark);
}

.fluency-task-brief dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.fluency-task-brief dl div {
  display: grid;
  gap: 2px;
  padding: 8px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
}

.fluency-task-brief dt {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 900;
}

.fluency-task-brief dd {
  margin: 0;
  color: var(--ink);
  font-weight: 850;
}

.fluency-interaction-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border-radius: 8px;
  background: #f3f8f5;
}

.fluency-interaction-card > b {
  color: var(--teal-dark);
}

.fluency-interaction-steps,
.fluency-support-prompts ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.fluency-interaction-steps li {
  display: grid;
  grid-template-columns: minmax(76px, auto) minmax(0, 1fr);
  gap: 5px 10px;
  padding: 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
}

.fluency-interaction-steps strong {
  color: var(--coral);
}

.fluency-interaction-steps span,
.fluency-interaction-steps small {
  min-width: 0;
  line-height: 1.45;
}

.fluency-interaction-steps small {
  grid-column: 2;
  color: var(--muted);
}

.fluency-step-track {
  display: flex;
  gap: 8px;
}

.fluency-step-track li {
  display: block;
  flex: 1;
  padding: 0;
  min-height: 8px;
  background: rgba(0, 143, 140, 0.18);
}

.fluency-step-track li span {
  display: block;
  height: 8px;
  overflow: hidden;
  text-indent: 120%;
  white-space: nowrap;
}

.fluency-step-track li.active {
  background: var(--teal);
}

.fluency-step-panel {
  display: grid;
  gap: 8px;
  padding: 14px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.9);
}

.fluency-step-panel > span {
  color: var(--coral);
  font-size: 0.82rem;
  font-weight: 950;
}

.fluency-step-panel strong {
  color: var(--teal-dark);
  font-size: 1rem;
}

.fluency-step-panel p {
  margin: 0;
  color: var(--ink);
  font-size: 1.04rem;
  line-height: 1.75;
}

.fluency-step-panel small,
.fluency-step-panel em {
  color: var(--muted);
  font-style: normal;
  line-height: 1.5;
}

.fluency-step-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.fluency-step-actions button {
  min-width: 88px;
  padding: 9px 12px;
  border: 1px solid rgba(0, 143, 140, 0.28);
  border-radius: 8px;
  background: #fff;
  color: var(--teal-dark);
  font-weight: 950;
  cursor: pointer;
}

.fluency-step-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.fluency-support-prompts {
  display: grid;
  gap: 6px;
  padding: 10px;
  border-radius: 8px;
  background: rgba(255, 123, 84, 0.1);
}

.fluency-support-prompts span {
  color: var(--coral);
  font-weight: 950;
}

.fluency-support-prompts li {
  line-height: 1.45;
}

.fluency-model-sentence {
  padding: 10px;
  border-radius: 8px;
  background: rgba(0, 143, 140, 0.1);
  color: var(--ink);
  font-weight: 900;
}

.fluency-current-sample small,
.fluency-record-card p,
.fluency-mark-card p {
  color: var(--muted);
  line-height: 1.5;
}

.fluency-edge-grid {
  display: grid;
  grid-template-columns: minmax(260px, 0.95fr) minmax(280px, 1.05fr);
  gap: 12px;
}

.fluency-transcript-field textarea {
  width: 100%;
  resize: vertical;
}

.fluency-candidate-summary,
#fluencyCandidateSummary,
.fluency-summary {
  display: block;
  padding: 10px 12px;
  border-radius: 8px;
  background: #edf7f4;
  color: var(--teal-dark);
  font-weight: 900;
  line-height: 1.5;
}

.fluency-mark-buttons {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.fluency-mark-buttons button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-height: 42px;
  padding: 8px 10px;
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font-weight: 900;
  text-align: left;
}

.fluency-mark-buttons button.active {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, var(--teal), var(--green));
}

.fluency-mark-buttons button b {
  display: inline-grid;
  min-width: 28px;
  min-height: 28px;
  place-items: center;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.08);
}

.fluency-mark-buttons .fluency-clear-mark {
  grid-column: 1 / -1;
  justify-content: center;
  text-align: center;
  color: var(--teal-dark);
  background: #edf7f4;
}

.voice-layer-card,
.auditory-source-strip article,
.auditory-current-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.84);
}

.voice-layer-card p,
.auditory-current-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.voice-diary-card {
  grid-column: 1 / -1;
  border-color: rgba(0, 143, 140, 0.2);
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.08), transparent 42%),
    rgba(255, 255, 255, 0.9);
}

.voice-record-row,
.auditory-control-row,
.auditory-output-row {
  display: grid;
  grid-template-columns: auto minmax(120px, 1fr);
  gap: 10px;
  align-items: center;
}

.auditory-control-row {
  grid-template-columns: minmax(220px, 1fr) auto;
}

.auditory-output-row {
  grid-template-columns: auto minmax(0, 1fr);
}

.voice-record-row button,
.auditory-mark-buttons button {
  min-height: 38px;
  padding: 8px 12px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-weight: 950;
}

.voice-record-row output,
.voice-result-banner,
.auditory-control-row output,
.auditory-output-row output,
.auditory-frequency-hint {
  padding: 10px 12px;
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font-weight: 900;
}

.voice-parameter-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(130px, 1fr));
  gap: 8px;
}

.voice-parameter-grid article {
  display: grid;
  gap: 4px;
  padding: 10px;
  border-radius: 8px;
  background: rgba(0, 143, 140, 0.1);
}

.voice-parameter-grid span,
.auditory-source-strip span,
.auditory-current-card span {
  color: var(--teal);
  font-size: 0.78rem;
  font-weight: 950;
}

.voice-diary-form {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 10px;
}

.voice-diary-form label,
.voice-diary-note {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 900;
}

.voice-diary-form input,
.voice-diary-form select,
.voice-diary-note textarea {
  width: 100%;
  border: 1px solid rgba(181, 198, 188, 0.9);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font: inherit;
}

.voice-diary-form input,
.voice-diary-form select {
  min-height: 38px;
  padding: 8px 10px;
}

.voice-diary-form input[type="range"] {
  min-height: auto;
  padding: 0;
  accent-color: var(--teal);
}

.voice-diary-form label span {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
}

.voice-diary-note textarea {
  min-height: 62px;
  padding: 10px 12px;
  resize: vertical;
}

.voice-diary-checklist {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.voice-diary-checklist legend {
  grid-column: 1 / -1;
  width: 100%;
  padding: 0;
  color: var(--teal-dark);
  font-size: 0.82rem;
  font-weight: 950;
}

.voice-diary-checklist label {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  min-height: 42px;
  padding: 9px 11px;
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.76);
  color: var(--ink);
  font-size: 0.84rem;
  font-weight: 900;
  transition: border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
}

.voice-diary-checklist input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  opacity: 0;
}

.voice-diary-checklist label::before {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  border: 1px solid rgba(0, 143, 140, 0.44);
  border-radius: 50%;
  color: #fff;
  background: rgba(255, 255, 255, 0.82);
  content: "";
  font-size: 0.72rem;
  font-weight: 950;
}

.voice-diary-checklist label:has(input:checked) {
  border-color: rgba(0, 143, 140, 0.56);
  background: linear-gradient(135deg, rgba(0, 143, 140, 0.16), rgba(81, 169, 106, 0.12));
  box-shadow: 0 8px 20px rgba(0, 78, 83, 0.08);
}

.voice-diary-checklist label:has(input:checked)::before {
  border-color: transparent;
  background: linear-gradient(135deg, var(--teal), var(--green));
  content: "✓";
}

.voice-diary-checklist label:focus-within {
  outline: 3px solid rgba(0, 143, 140, 0.2);
  outline-offset: 2px;
}

.voice-diary-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.voice-diary-actions button {
  min-height: 38px;
  padding: 8px 12px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-weight: 950;
}

.voice-diary-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.voice-diary-list li {
  display: grid;
  gap: 4px;
  padding: 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
}

.voice-diary-list strong {
  color: var(--ink);
}

.voice-diary-list span,
.voice-diary-list small {
  color: var(--muted);
  line-height: 1.5;
}

.auditory-control-row label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-weight: 900;
}

.auditory-current-card strong {
  color: var(--ink);
  font-size: clamp(1.25rem, 2.2vw, 1.55rem);
  line-height: 1.2;
}

.swallow-screening-panel {
  gap: 14px;
}

.pt-head-neck-panel {
  gap: 14px;
}

.swallow-lede {
  max-width: 56ch;
  margin: 0;
  color: var(--muted);
  font-size: 0.98rem;
  line-height: 1.65;
}

.pt-head-neck-lede {
  max-width: 64ch;
  margin: 0;
  color: var(--muted);
  font-size: 0.98rem;
  line-height: 1.65;
}

.pt-head-neck-primary-workspace,
.pt-head-neck-secondary-stack {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.pt-head-neck-primary-workspace {
  padding: 0;
}

.audience-mode-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.audience-mode-card {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(0, 143, 140, 0.18);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.92);
  color: inherit;
  box-shadow: 0 12px 28px rgba(16, 36, 33, 0.07);
  text-decoration: none;
}

.audience-mode-card.primary {
  background:
    linear-gradient(135deg, rgba(124, 233, 216, 0.14), rgba(255, 255, 255, 0.9)),
    rgba(255, 255, 255, 0.94);
}

.audience-mode-card.professional {
  background:
    linear-gradient(135deg, rgba(212, 240, 108, 0.12), rgba(255, 255, 255, 0.9)),
    rgba(255, 255, 255, 0.94);
}

.audience-mode-card span {
  color: var(--teal-dark);
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.08em;
}

.audience-mode-card strong {
  color: var(--ink);
  line-height: 1.35;
}

.audience-mode-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.audience-mode-card em {
  width: fit-content;
  border-radius: 999px;
  padding: 5px 10px;
  background: rgba(0, 143, 140, 0.1);
  color: var(--teal-dark);
  font-size: 0.78rem;
  font-style: normal;
  font-weight: 950;
}

.audience-mode-card[aria-current="page"] {
  box-shadow: 0 0 0 3px rgba(0, 143, 140, 0.16), 0 12px 28px rgba(16, 36, 33, 0.07);
}

.pt-head-neck-panel[data-pt-audience="patient"] .pt-head-neck-secondary-stack {
  display: none;
}

.pt-head-neck-panel[data-pt-audience="professional"] .pt-head-neck-primary-workspace {
  display: none;
}

.pt-head-neck-panel[data-pt-audience="professional"] .pt-guided-flow-card,
.pt-head-neck-panel[data-pt-audience="professional"] .pt-guided-next-action {
  display: none;
}

.pt-head-neck-panel[data-pt-audience="patient"] .pt-head-neck-lede {
  display: none;
}

.pt-head-neck-panel[data-pt-audience="patient"] .audience-mode-card p,
.pt-head-neck-panel[data-pt-audience="patient"] .audience-mode-card em,
.pt-head-neck-panel[data-pt-audience="patient"] .pt-guided-flow-copy p,
.pt-head-neck-panel[data-pt-audience="patient"] .pt-secondary-module > summary small {
  display: none;
}

.pt-head-neck-panel[data-pt-audience="patient"] .pt-secondary-module > summary {
  min-height: 46px;
  grid-template-columns: minmax(110px, 0.68fr) minmax(0, 1fr);
  padding: 10px 12px;
}

.pt-head-neck-panel[data-pt-audience="patient"] .pt-secondary-module > summary span {
  align-self: center;
}

.report-watermark-footer {
  margin-top: 14px;
  padding-top: 8px;
  border-top: 1px solid rgba(32, 45, 44, 0.14);
  color: rgba(54, 67, 64, 0.72);
  font-size: 0.72rem;
  line-height: 1.55;
  letter-spacing: 0.01em;
  word-break: break-word;
}

.pt-head-neck-panel[data-pt-audience="professional"] .pt-head-neck-secondary-stack {
  margin-top: 16px;
}

.pt-guided-flow-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgba(0, 143, 140, 0.18);
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.08), rgba(212, 240, 108, 0.12)),
    rgba(255, 255, 255, 0.92);
  box-shadow: 0 12px 30px rgba(16, 36, 33, 0.08);
}

.pt-guided-flow-card[hidden] {
  display: none !important;
}

.pt-guided-flow-copy {
  display: grid;
  gap: 4px;
}

.pt-guided-flow-copy span {
  color: var(--teal-dark);
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.08em;
}

.pt-guided-flow-copy strong {
  color: var(--ink);
  font-size: 1.05rem;
}

.pt-guided-flow-copy p {
  max-width: 68ch;
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.pt-guided-flow-list {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pt-guided-flow-list li {
  min-height: 38px;
  padding: 8px 9px;
  border: 1px solid rgba(0, 143, 140, 0.14);
  border-radius: 10px;
  color: var(--teal-dark);
  background: rgba(255, 255, 255, 0.82);
  font-size: 0.86rem;
  font-weight: 900;
}

.pt-guided-flow-list li.active {
  border-color: rgba(0, 143, 140, 0.42);
  color: #102421;
  background: linear-gradient(135deg, rgba(124, 233, 216, 0.38), rgba(212, 240, 108, 0.32));
}

.pt-guide-dismiss {
  justify-self: end;
  white-space: nowrap;
}

.pt-guided-next-action {
  display: inline-grid;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  justify-self: start;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  color: #102421;
  background: linear-gradient(135deg, #7ce9d8, #d4f06c);
  box-shadow: 0 14px 28px rgba(0, 143, 140, 0.18);
  font-weight: 950;
}

.pt-guided-next-action[hidden] {
  display: none !important;
}

.pt-head-neck-secondary-stack {
  margin-top: 4px;
}

.pt-professional-mode-intro {
  border-style: dashed;
}

.pt-head-neck-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}

.pt-head-neck-card,
.pt-head-neck-summary-card {
  min-width: 0;
  border: 1px solid rgba(0, 143, 140, 0.2);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 14px 34px rgba(16, 36, 33, 0.08);
  padding: 16px;
}

.pt-report-preview-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(0, 143, 140, 0.14);
}

.pt-report-preview-header div {
  display: grid;
  gap: 4px;
}

.pt-report-preview-header span {
  color: var(--teal);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.pt-report-preview-header strong {
  color: var(--ink);
  font-size: 1rem;
}

.rehab-service-next-step {
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid rgba(0, 143, 140, 0.16);
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.08), transparent 54%),
    rgba(255, 255, 255, 0.88);
}

.rehab-service-next-step span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.rehab-service-next-step strong {
  color: var(--ink);
  font-size: 1rem;
}

.rehab-service-next-step p {
  margin: 0;
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.6;
}

.rehab-entitlement-action-row {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.rehab-trust-card {
  display: grid;
  gap: 6px;
  width: 100%;
  margin: 12px 0 16px;
  padding: 13px 15px;
  border: 1px solid rgba(0, 143, 140, 0.16);
  border-left: 5px solid rgba(0, 143, 140, 0.68);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(235, 250, 247, 0.72));
  box-shadow: 0 10px 22px rgba(18, 55, 49, 0.06);
}

.rehab-trust-card span {
  color: var(--teal);
  font-size: 0.76rem;
  font-weight: 950;
  letter-spacing: 0.08em;
}

.rehab-trust-card p,
.rehab-trust-card small {
  margin: 0;
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.6;
}

.rehab-trust-card small {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 650;
}

.rehab-entitlement-chip {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 4px 9px;
  border: 1px solid rgba(0, 143, 140, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--teal);
  font-size: 0.75rem;
  font-weight: 950;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.rehab-entitlement-chip.is-silver {
  border-color: rgba(79, 96, 118, 0.2);
  color: #405168;
  background: linear-gradient(135deg, rgba(232, 237, 245, 0.92), rgba(255, 255, 255, 0.86));
}

.rehab-entitlement-chip.is-gold {
  border-color: rgba(183, 128, 33, 0.24);
  color: #8a5b0f;
  background: linear-gradient(135deg, rgba(255, 238, 186, 0.9), rgba(255, 255, 255, 0.86));
}

.rehab-entitlement-upgrade-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 6px;
}

.rehab-entitlement-upgrade-card {
  display: grid;
  gap: 7px;
  width: 100%;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.15);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.84);
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.rehab-entitlement-upgrade-card:hover,
.rehab-entitlement-upgrade-card:focus-visible {
  border-color: rgba(0, 143, 140, 0.34);
  box-shadow: 0 12px 26px rgba(18, 55, 49, 0.1);
  outline: none;
}

.rehab-entitlement-upgrade-card strong {
  font-size: 0.95rem;
}

.rehab-entitlement-upgrade-card small {
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.45;
}

.pt-functional-baseline-card {
  grid-column: 1 / -1;
  display: grid;
  gap: 12px;
}

.pt-baseline-field-grid {
  display: grid;
  grid-template-columns: minmax(220px, 0.72fr) minmax(320px, 1.28fr);
  gap: 12px;
  align-items: start;
}

.pt-functional-baseline-card select {
  max-width: 360px;
}

.pt-secondary-module {
  display: block;
  overflow: hidden;
  padding: 0;
}

.pt-secondary-module > summary {
  display: grid;
  grid-template-columns: minmax(110px, 0.68fr) minmax(0, 1fr) auto;
  gap: 4px 10px;
  align-items: center;
  min-height: 46px;
  padding: 10px 12px;
  cursor: pointer;
  list-style: none;
}

.pt-secondary-module > summary::-webkit-details-marker {
  display: none;
}

.pt-secondary-module > summary::after {
  content: "展開";
  justify-self: end;
  grid-column: 3;
  grid-row: 1 / span 2;
  padding: 3px 8px;
  border-radius: 999px;
  color: var(--teal-dark);
  background: rgba(0, 143, 140, 0.1);
  font-size: 0.78rem;
  font-weight: 950;
}

.pt-secondary-module[open] > summary::after {
  content: "收合";
}

.pt-secondary-module > summary span {
  color: var(--teal-dark);
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.pt-secondary-module > summary strong {
  color: var(--ink);
  font-size: 1.02rem;
  line-height: 1.35;
}

.pt-secondary-module > summary small {
  grid-column: 2;
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.25;
}

.pt-secondary-body {
  display: grid;
  gap: 12px;
  padding: 0 16px 16px;
}

.pt-service-direction-card,
.pt-general-msk-card,
.pt-movement-quest-card {
  display: grid;
  gap: 12px;
}

.pt-service-direction-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.pt-service-direction {
  display: grid;
  align-content: start;
  gap: 5px;
  min-height: 104px;
  padding: 10px;
  border: 1px solid rgba(43, 67, 92, 0.14);
  border-radius: 8px;
  background: rgba(247, 252, 250, 0.84);
}

.pt-service-direction[role="button"] {
  cursor: pointer;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.pt-service-direction[role="button"]:hover {
  border-color: rgba(0, 143, 140, 0.3);
  box-shadow: 0 12px 24px rgba(43, 67, 92, 0.1);
  transform: translateY(-1px);
}

.pt-service-direction:focus-visible {
  outline: 3px solid rgba(0, 143, 140, 0.34);
  outline-offset: 3px;
}

.pt-service-direction.active {
  border-color: rgba(0, 143, 140, 0.32);
  background: rgba(0, 143, 140, 0.08);
}

.pt-service-direction.next {
  border-color: rgba(244, 138, 93, 0.34);
  background: rgba(255, 247, 242, 0.9);
}

.pt-service-direction span {
  color: var(--coral);
  font-size: 0.76rem;
  font-weight: 950;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.pt-service-direction strong {
  color: var(--teal-dark);
  font-size: 1rem;
  line-height: 1.35;
}

.pt-service-direction p {
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.35;
}

.pt-general-msk-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.pt-post-op-orthopedic-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.pt-neuro-balance-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.pt-cardio-frailty-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.pt-return-activity-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.pt-general-msk-grid .swallow-question:nth-of-type(n + 2),
.pt-general-msk-grid .pt-general-msk-safety,
.pt-post-op-orthopedic-grid .swallow-question:nth-of-type(n + 4),
.pt-post-op-orthopedic-grid .pt-post-op-safety,
.pt-neuro-balance-grid .swallow-question:nth-of-type(n + 4),
.pt-neuro-balance-grid .pt-neuro-safety,
.pt-cardio-frailty-grid .swallow-question:nth-of-type(n + 3),
.pt-cardio-frailty-grid .pt-cardio-safety,
.pt-return-activity-grid .swallow-question:nth-of-type(n + 3),
.pt-return-activity-grid .pt-return-safety {
  grid-column: span 3;
}

.pt-general-msk-actions,
.pt-post-op-actions,
.pt-neuro-actions,
.pt-cardio-actions,
.pt-return-actions {
  margin-top: 12px;
}

#ptGeneralMskOutput,
#ptPostOpOutput,
#ptNeuroOutput,
#ptCardioOutput,
#ptReturnOutput {
  margin-top: 12px;
}

.pt-general-msk-choice-group {
  display: grid;
  gap: 6px;
  padding: 10px;
  border: 1px solid rgba(0, 143, 140, 0.15);
  border-radius: 8px;
  background: rgba(247, 252, 250, 0.82);
}

.pt-general-msk-choice-group strong {
  color: var(--teal-dark);
  font-size: 0.96rem;
}

.pt-general-msk-choice-group label {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 28px;
  color: var(--ink);
  font-size: 0.94rem;
  line-height: 1.3;
}

.pt-general-msk-choice-group input,
.pt-movement-quest-safety input,
.pt-consult-routing-choice-group input,
.pt-consult-routing-attestations input,
.pt-support-faq-choice-group input,
.pt-support-faq-attestations input {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
}

.pt-general-msk-choice-group label,
.pt-movement-quest-safety label,
.pt-consult-routing-choice-group label,
.pt-consult-routing-attestations label,
.pt-support-faq-choice-group label,
.pt-support-faq-attestations label {
  gap: 9px;
  min-height: 34px;
  font-size: 1rem;
}

.pt-movement-quest-form {
  display: grid;
  gap: 12px;
}

.pt-movement-quest-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.pt-consult-routing-choice-grid,
.pt-support-faq-urgent-grid {
  grid-template-columns: minmax(0, 1fr);
}

.pt-movement-quest-safety {
  display: grid;
  grid-column: span 3;
  gap: 6px;
  padding: 10px;
  border: 1px solid rgba(244, 138, 93, 0.22);
  border-radius: 8px;
  background: rgba(255, 247, 242, 0.88);
}

.pt-movement-quest-safety strong {
  color: var(--teal-dark);
  font-size: 0.96rem;
}

.pt-movement-quest-safety label {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 28px;
  color: var(--ink);
  font-size: 0.94rem;
  line-height: 1.3;
}

.pt-movement-quest-status {
  display: block;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(0, 143, 140, 0.08);
  color: var(--teal-dark);
  font-size: 0.9rem;
  font-weight: 850;
}

.pt-movement-quest-output {
  display: grid;
  gap: 12px;
  min-height: 84px;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.14);
  border-radius: 8px;
  background: rgba(247, 252, 250, 0.82);
}

.pt-movement-quest-output p {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.pt-movement-quest-summary {
  display: grid;
  gap: 4px;
}

.pt-movement-quest-summary span,
.pt-movement-quest-selected span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
}

.pt-movement-quest-summary strong {
  color: var(--teal-dark);
  font-size: 1rem;
  line-height: 1.4;
}

.pt-movement-quest-selected {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pt-movement-quest-selected li {
  display: grid;
  gap: 4px;
  padding: 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(43, 67, 92, 0.1);
}

.pt-movement-quest-selected strong {
  color: var(--ink);
  font-size: 0.92rem;
}

.pt-movement-quest-handoff {
  display: grid;
  gap: 8px;
}

.pt-movement-quest-handoff b {
  color: var(--teal-dark);
}

.pt-movement-quest-handoff ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 18px;
  color: var(--ink);
  line-height: 1.55;
}

.pt-head-neck-question-card {
  display: grid;
  gap: 12px;
}

.pt-head-neck-journal-card {
  display: grid;
  gap: 12px;
}

.pt-head-neck-journal-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.pt-consult-routing-card,
.pt-consult-routing-form {
  display: grid;
  gap: 12px;
}

.pt-consult-routing-grid {
  display: grid;
  grid-template-columns: 0.8fr 1fr 1fr;
  gap: 12px;
}

.pt-consult-routing-choice-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.pt-consult-routing-choice-group {
  display: grid;
  gap: 6px;
  padding: 10px;
  border: 1px solid rgba(0, 143, 140, 0.15);
  border-radius: 8px;
  background: rgba(247, 252, 250, 0.82);
}

.pt-consult-routing-choice-group strong {
  color: var(--teal-dark);
  font-size: 0.96rem;
}

.pt-consult-routing-choice-group label,
.pt-consult-routing-attestations label {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 28px;
  color: var(--ink);
  font-size: 0.94rem;
  line-height: 1.3;
}

.pt-consult-routing-attestations {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-weight: 850;
}

.pt-consult-routing-status {
  display: block;
  min-height: 40px;
  padding: 10px 12px;
  border-radius: 8px;
  color: var(--teal-dark);
  background: rgba(0, 143, 140, 0.08);
  font-weight: 900;
  line-height: 1.45;
}

.pt-consult-handoff {
  display: grid;
  gap: 10px;
}

.pt-consult-handoff-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(43, 67, 92, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.88);
}

.pt-consult-handoff-card section {
  display: grid;
  gap: 4px;
}

.pt-consult-handoff-card h4,
.pt-consult-handoff-card p,
.pt-consult-handoff-card ul {
  margin: 0;
}

.pt-consult-handoff-card ul {
  padding-left: 18px;
}

.pt-consult-routing-lanes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.pt-consult-routing-lane {
  display: grid;
  gap: 8px;
  min-height: 122px;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.16);
  border-radius: 8px;
  background: rgba(247, 252, 250, 0.86);
}

.pt-consult-routing-lane div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: var(--teal-dark);
  font-weight: 950;
}

.pt-consult-routing-empty,
.pt-consult-routing-row p,
.pt-consult-routing-row small {
  margin: 0;
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.45;
}

.pt-consult-routing-row {
  display: grid;
  gap: 4px;
}

.pt-support-faq-card,
.pt-support-faq-form {
  display: grid;
  gap: 12px;
}

.pt-support-faq-grid {
  display: grid;
  grid-template-columns: 0.8fr 1.4fr;
  gap: 12px;
}

.pt-support-faq-urgent-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.pt-consult-routing-choice-grid,
.pt-support-faq-urgent-grid,
.pt-professional-review-issue-grid,
.pt-template-ugc-grid {
  grid-template-columns: minmax(0, 1fr);
}

.pt-support-faq-choice-group {
  display: grid;
  gap: 6px;
  padding: 10px;
  border: 1px solid rgba(0, 143, 140, 0.15);
  border-radius: 8px;
  background: rgba(247, 252, 250, 0.82);
}

.pt-support-faq-choice-group strong {
  color: var(--teal-dark);
  font-size: 0.96rem;
}

.pt-support-faq-choice-group p {
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.55;
}

.pt-support-faq-choice-group label,
.pt-support-faq-attestations label {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 28px;
  color: var(--ink);
  font-size: 0.94rem;
  line-height: 1.3;
}

.pt-support-faq-attestations {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-weight: 850;
}

.pt-support-faq-status {
  display: block;
  min-height: 40px;
  padding: 10px 12px;
  border-radius: 8px;
  color: var(--teal-dark);
  background: rgba(0, 143, 140, 0.08);
  font-weight: 900;
  line-height: 1.45;
}

.pt-support-faq-reply {
  display: grid;
  gap: 10px;
}

.pt-support-faq-reply-card {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid rgba(43, 67, 92, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.88);
}

.pt-support-faq-reply-card p,
.pt-support-faq-reply-card small {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.pt-support-faq-lanes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.pt-support-faq-lane {
  display: grid;
  gap: 8px;
  min-height: 122px;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.16);
  border-radius: 8px;
  background: rgba(247, 252, 250, 0.86);
}

.pt-support-faq-lane div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: var(--teal-dark);
  font-weight: 950;
}

.pt-support-faq-empty,
.pt-support-faq-row p,
.pt-support-faq-row small {
  margin: 0;
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.45;
}

.pt-support-faq-row {
  display: grid;
  gap: 4px;
}

.pt-report-output-v2-panel {
  display: grid;
  gap: 12px;
}

.pt-report-output-v2-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
  gap: 12px;
  align-items: start;
}

.pt-report-output-v2-controls div {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.15);
  border-radius: 8px;
  background: rgba(247, 252, 250, 0.82);
}

.pt-report-output-v2-controls strong {
  color: var(--teal-dark);
  font-size: 0.92rem;
}

.pt-report-output-v2-controls p {
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.55;
}

.pt-report-output-v2-status {
  display: block;
  min-height: 40px;
  padding: 10px 12px;
  border-radius: 8px;
  color: var(--teal-dark);
  background: rgba(0, 143, 140, 0.08);
  font-weight: 900;
  line-height: 1.45;
}

.pt-report-output-v2-preview {
  display: grid;
  gap: 10px;
}

.pt-report-output-v2-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(43, 67, 92, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.9);
}

.pt-report-output-v2-card div {
  display: grid;
  gap: 4px;
}

.pt-report-output-v2-card h4,
.pt-report-output-v2-card p,
.pt-report-output-v2-card ul {
  margin: 0;
}

.pt-report-output-v2-card ul {
  padding-left: 18px;
}

.pt-report-output-v2-share-panel {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(0, 143, 140, 0.18);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(234, 243, 238, 0.92), rgba(255, 255, 255, 0.94));
}

.pt-report-output-v2-share-panel h4,
.pt-report-output-v2-share-panel p {
  margin: 0;
}

.pt-report-output-v2-share-panel h4 {
  color: var(--teal-dark);
  font-size: 1rem;
}

.pt-report-output-v2-share-panel p,
.pt-report-output-v2-share-panel output {
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.55;
}

.pt-report-output-v2-share-card {
  border-color: rgba(43, 67, 92, 0.16);
}

.pt-professional-review-card,
.pt-professional-review-form,
.pt-professional-review-decision-form {
  display: grid;
  gap: 12px;
}

.pt-professional-review-grid,
.pt-professional-review-decision-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.pt-professional-review-decision-form {
  padding: 12px;
  border: 1px solid rgba(43, 67, 92, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.74);
}

.pt-professional-review-issue-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.pt-professional-review-issue-grid label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid rgba(0, 143, 140, 0.14);
  border-radius: 8px;
  color: var(--ink);
  background: rgba(247, 252, 250, 0.78);
  font-size: 0.88rem;
  line-height: 1.35;
}

.pt-professional-review-attestations {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 850;
}

.pt-professional-review-status {
  display: block;
  min-height: 40px;
  padding: 10px 12px;
  border-radius: 8px;
  color: var(--teal-dark);
  background: rgba(0, 143, 140, 0.08);
  font-weight: 900;
  line-height: 1.45;
}

.pt-professional-review-lanes {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.pt-professional-review-lane {
  display: grid;
  gap: 8px;
  min-height: 132px;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.16);
  border-radius: 8px;
  background: rgba(247, 252, 250, 0.86);
}

.pt-professional-review-lane div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: var(--teal-dark);
  font-weight: 950;
}

.pt-professional-review-empty,
.pt-professional-review-row p,
.pt-professional-review-row small {
  margin: 0;
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.45;
}

.pt-professional-review-row {
  display: grid;
  gap: 4px;
}

.pt-professional-review-row span {
  color: var(--coral);
  font-size: 0.76rem;
  font-weight: 950;
}

.pt-template-ugc-card,
.pt-template-ugc-form {
  display: grid;
  gap: 12px;
}

.pt-template-ugc-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.pt-template-ugc-attestations {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 850;
}

.pt-template-ugc-status {
  display: block;
  min-height: 40px;
  padding: 10px 12px;
  border-radius: 8px;
  color: var(--teal-dark);
  background: rgba(0, 143, 140, 0.08);
  font-weight: 900;
  line-height: 1.45;
}

.pt-template-ugc-lanes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.pt-template-ugc-lane {
  display: grid;
  gap: 8px;
  min-height: 132px;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.16);
  border-radius: 8px;
  background: rgba(247, 252, 250, 0.86);
}

.pt-template-ugc-lane div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: var(--teal-dark);
  font-weight: 950;
}

.pt-template-ugc-empty,
.pt-template-ugc-row p,
.pt-template-ugc-row small {
  margin: 0;
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.45;
}

.pt-template-ugc-row {
  display: grid;
  gap: 4px;
}

.pt-template-ugc-row span {
  color: var(--coral);
  font-size: 0.76rem;
  font-weight: 950;
}

.pt-head-neck-check-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  margin-top: 10px;
}

.pt-head-neck-check {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  min-height: 32px;
  padding: 6px 8px;
  border: 1px solid rgba(0, 143, 140, 0.16);
  border-radius: 8px;
  background: rgba(247, 252, 250, 0.86);
  color: var(--ink);
  font-size: 0.95rem;
  line-height: 1.28;
  overflow-wrap: anywhere;
}

.pt-head-neck-check input {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
}

.pt-head-neck-panel .swallow-question select {
  min-height: 38px;
  padding: 0 10px;
  border-radius: 8px;
  font-size: 0.96rem;
}

.pt-head-neck-panel .swallow-question input {
  min-height: 38px;
  padding: 0 10px;
  border-radius: 8px;
  font-size: 0.96rem;
}

.pt-head-neck-panel .swallow-question textarea {
  padding: 10px;
  border-radius: 8px;
  font-size: 0.96rem;
  line-height: 1.45;
}

.pt-head-neck-report {
  display: grid;
  gap: 10px;
  color: var(--ink);
}

.pt-head-neck-report-card {
  display: grid;
  gap: 10px;
}

.pt-head-neck-report-card h4,
.pt-head-neck-report-card p,
.pt-head-neck-report-card ul {
  margin: 0;
}

.pt-head-neck-report-card ul {
  padding-left: 1.2rem;
}

.pt-head-neck-report-card span,
.pt-head-neck-report-card small {
  color: var(--muted);
  line-height: 1.55;
}

.swallow-summary-card,
.swallow-gated-note,
.swallow-card {
  border: 1px solid rgba(0, 143, 140, 0.2);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 14px 34px rgba(16, 36, 33, 0.08);
}

.swallow-card-heading strong,
.swallow-summary-card output:first-child {
  color: var(--ink);
  font-weight: 900;
}

.swallow-gated-note p,
.swallow-note,
.swallow-reference {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.swallow-gated-note p {
  font-size: 0.78rem;
  line-height: 1.45;
}

.swallow-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
  gap: 12px;
  align-items: start;
}

.swallow-grid > .swallow-card:first-child {
  grid-column: 1;
  grid-row: 1 / span 2;
}

.swallow-grid > .swallow-card:nth-child(2),
.swallow-grid > .mna-card {
  grid-column: 2;
}

.swallow-gated-note,
.swallow-card,
.swallow-summary-card {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.swallow-card[hidden],
.mna-card[hidden] {
  display: none;
}

.swallow-gated-note {
  gap: 4px;
  padding: 8px 12px;
  border-style: dashed;
  border-color: rgba(0, 143, 140, 0.16);
  background: linear-gradient(135deg, rgba(238, 247, 242, 0.52), rgba(255, 255, 255, 0.72));
  box-shadow: none;
}

.swallow-card-heading span {
  color: var(--teal);
  font-size: 0.8rem;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.swallow-gated-note strong,
.swallow-card-heading strong {
  color: var(--ink);
  font-size: clamp(1rem, 1.5vw, 1.12rem);
  line-height: 1.25;
}

.swallow-gated-note strong {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
  line-height: 1.35;
}

.swallow-card-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 12px;
}

.swallow-score-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.swallow-score-pill {
  display: inline-grid;
  grid-template-columns: auto auto auto;
  align-items: baseline;
  gap: 6px;
  min-width: 148px;
  padding: 10px 12px;
  border: 1px solid rgba(0, 143, 140, 0.2);
  border-radius: 999px;
  background: rgba(0, 143, 140, 0.08);
  color: var(--ink);
}

.swallow-score-pill span,
.swallow-score-pill small {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}

.swallow-score-pill output {
  color: var(--teal);
  font-size: clamp(1.35rem, 2vw, 1.75rem);
  font-weight: 950;
  line-height: 1;
}

.swallow-question-list {
  display: grid;
  gap: 10px;
}

.swallow-question {
  display: grid;
  gap: 6px;
  color: var(--ink);
  font-weight: 800;
}

.swallow-question span {
  font-size: 0.95rem;
  line-height: 1.5;
}

.swallow-question select,
.swallow-question input {
  min-height: 42px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0 12px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 0.96rem;
}

.swallow-result {
  display: block;
  padding: 12px;
  border-radius: 10px;
  background: rgba(0, 143, 140, 0.08);
  color: var(--ink);
  font-weight: 900;
  line-height: 1.5;
}

.rsst-guidance {
  margin: 0;
  padding: 12px 14px;
  border: 1px solid rgba(0, 143, 140, 0.18);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(238, 247, 242, 0.9), rgba(255, 255, 255, 0.96));
  color: var(--ink);
  font-weight: 850;
  line-height: 1.65;
}

.rsst-workflow-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  align-items: stretch;
}

.rsst-position-card,
.rsst-measure-card {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(0, 143, 140, 0.16);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.82);
}

.rsst-position-card {
  align-content: start;
  background: linear-gradient(135deg, rgba(238, 247, 242, 0.78), rgba(255, 255, 255, 0.94));
}

.rsst-position-card strong {
  color: var(--ink);
  font-size: 0.95rem;
  font-weight: 900;
}

.rsst-placement-list {
  display: grid;
  gap: 8px;
}

.rsst-position-visual--image {
  display: grid;
  place-items: center;
  padding: 8px;
  border: 1px solid rgba(16, 36, 33, 0.12);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}

.rsst-position-visual--image img {
  display: block;
  width: 100%;
  max-width: 360px;
  height: auto;
  border-radius: 8px;
  object-fit: contain;
}

.rsst-placement-list span {
  display: grid;
  grid-template-columns: 4.2em minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(0, 143, 140, 0.14);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
}

.rsst-placement-list b {
  color: var(--teal);
  font-weight: 900;
}

.rsst-placement-list small,
.rsst-position-card p {
  color: var(--muted);
  font-size: 0.85rem;
  font-weight: 800;
  line-height: 1.5;
}

.rsst-position-card p {
  margin: 0;
}

.rsst-measure-card {
  align-content: center;
}

.rsst-timer-control,
.swallow-two-column {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
  align-items: center;
}

.rsst-timer-control output {
  display: grid;
  min-height: 42px;
  place-items: center;
  border-radius: 10px;
  background: rgba(238, 247, 242, 0.95);
  color: var(--teal);
  font-size: 1.15rem;
  font-weight: 900;
}

.swallow-summary-card {
  position: sticky;
  bottom: 16px;
  background: linear-gradient(135deg, rgba(238, 247, 242, 0.96), rgba(255, 255, 255, 0.98));
}

.swallow-summary-card output {
  line-height: 1.6;
}

.swallow-reference {
  font-size: 0.9rem;
}

.swallow-reference-card {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid rgba(0, 143, 140, 0.16);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.5;
}

.swallow-reference-card strong {
  color: var(--ink);
  font-weight: 900;
}

.swallow-rights-note {
  margin: 0;
}

.swallow-reference-list {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 18px;
  font-size: 0.78rem;
  line-height: 1.45;
}

.swallow-reference-list a {
  color: var(--teal);
  font-weight: 800;
}

.auditory-answer-pair,
.auditory-card-actions,
.auditory-mark-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.auditory-answer-pair b {
  min-width: 72px;
  padding: 12px 16px;
  border-radius: 8px;
  border: 1px solid rgba(255, 123, 84, 0.34);
  background: linear-gradient(135deg, rgba(255, 123, 84, 0.18), rgba(255, 214, 194, 0.32));
  color: var(--ink);
  font-size: 1.05rem;
  text-align: center;
}

.auditory-context-sentence {
  margin: 0;
  max-width: 62ch;
  color: var(--ink);
  font-size: clamp(1.6rem, 3.2vw, 2.1rem);
  font-weight: 900;
  line-height: 1.35;
}

.auditory-context-sentence.is-note {
  font-size: 0.86rem;
  opacity: 0.78;
}

.auditory-card-actions {
  padding-top: 2px;
}

.auditory-mark-buttons button {
  border: 1px solid rgba(181, 198, 188, 0.76);
  color: var(--ink);
  background: #fff;
}

.auditory-mark-buttons button.active {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, var(--teal), var(--green));
}

.articulation-step-actions {
  display: grid;
  grid-template-columns: auto minmax(120px, 1fr) auto auto;
  gap: 10px;
  align-items: center;
}

.articulation-step-actions:has(#articulationStartPractice) {
  grid-template-columns: auto auto;
  justify-content: space-between;
}

.primary-step-action,
.secondary-step-action {
  min-height: 42px;
  padding: 8px 14px;
  border-radius: 8px;
  font-weight: 950;
}

.primary-step-action {
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  box-shadow: var(--glow);
}

.secondary-step-action {
  color: var(--ink);
  border: 1px solid rgba(181, 198, 188, 0.78);
  background: rgba(255, 255, 255, 0.86);
}

.primary-step-action:disabled,
.secondary-step-action:disabled {
  cursor: not-allowed;
  opacity: 0.48;
  box-shadow: none;
}

.articulation-step-actions output {
  justify-self: center;
  color: var(--muted);
  font-weight: 950;
}

.articulation-sample-list {
  display: grid;
  gap: 10px;
}

.articulation-sample-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
}

.articulation-current-sample {
  grid-template-columns: minmax(0, 1.25fr) minmax(150px, 0.75fr);
}

.articulation-sample-card div:first-child {
  display: grid;
  gap: 5px;
}

.articulation-sample-card span,
.articulation-sample-card small {
  color: var(--muted);
}

.articulation-sample-card strong {
  font-size: 1.45rem;
}

.articulation-current-sample strong {
  font-size: clamp(2.2rem, 6vw, 4rem);
  line-height: 1.08;
}

.visual-material-card {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 10px;
  border: 1px solid rgba(16, 36, 33, 0.28);
  border-radius: 8px;
  color: #102421;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 251, 246, 0.9)),
    repeating-linear-gradient(0deg, rgba(16, 36, 33, 0.035), rgba(16, 36, 33, 0.035) 1px, transparent 1px, transparent 9px);
}

.visual-material-card svg {
  width: 100%;
  height: auto;
  color: currentColor;
}

.visual-material-card figcaption {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 850;
  line-height: 1.35;
  text-align: center;
}

.articulation-visual-card {
  justify-self: end;
  width: min(100%, 190px);
}

.articulation-visual-card svg {
  max-height: 150px;
}

.language-story-card {
  width: 100%;
}

.language-story-card figcaption {
  text-align: left;
}

.articulation-mark-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  grid-column: 1 / -1;
  justify-self: end;
  width: fit-content;
  max-width: 100%;
  background: transparent;
}

.articulation-mark-buttons-label {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 5px 9px;
  border: 1px solid rgba(0, 143, 140, 0.14);
  border-radius: 999px;
  background: rgba(0, 143, 140, 0.08);
  color: var(--teal-deep);
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.articulation-mark-button-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
}

.articulation-mark-buttons button {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 6px 10px;
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 999px;
  background: #fff;
  color: var(--ink);
  font-size: 0.82rem;
  font-weight: 900;
  line-height: 1.15;
}

.articulation-mark-buttons button.active {
  border-color: rgba(0, 143, 140, 0.28);
  color: var(--teal);
  background: rgba(0, 143, 140, 0.12);
  box-shadow: inset 0 0 0 1px rgba(0, 143, 140, 0.12);
}

.articulation-paid-markup {
  display: grid;
  grid-column: 1 / -1;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.18);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(238, 247, 242, 0.92), rgba(255, 255, 255, 0.95));
}

.articulation-paid-markup > div:first-child {
  display: grid;
  gap: 3px;
}

.articulation-paid-markup.locked {
  border-style: dashed;
  background: linear-gradient(135deg, rgba(255, 250, 235, 0.95), rgba(255, 255, 255, 0.96));
}

.articulation-paid-markup-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.articulation-paid-markup-header > div {
  display: grid;
  gap: 3px;
}

.articulation-paid-markup > div:first-child span,
.articulation-paid-markup > div:first-child small {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 850;
}

.articulation-paid-markup > div:first-child strong {
  color: var(--ink);
  font-size: 1rem;
}

.articulation-color-palette {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.articulation-color-chip {
  min-height: 34px;
  padding: 7px 10px;
  border: 1px solid color-mix(in srgb, var(--mark-color, var(--teal)) 42%, #ffffff);
  border-radius: 999px;
  color: var(--ink);
  background: #fff;
  font-weight: 900;
}

.articulation-color-chip::before {
  content: "";
  display: inline-block;
  width: 0.72em;
  height: 0.72em;
  margin-right: 6px;
  border-radius: 50%;
  background: var(--mark-color, var(--teal));
  vertical-align: -0.06em;
}

.articulation-color-chip.active {
  color: #fff;
  border-color: transparent;
  background: var(--mark-color, var(--teal));
}

.articulation-color-chip.active::before {
  background: #fff;
}

.articulation-markup-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr));
  gap: 8px;
}

.articulation-markup-grid label,
.articulation-markup-note {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 850;
}

.articulation-markup-grid select,
.articulation-markup-note textarea {
  width: 100%;
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  font: inherit;
}

.articulation-markup-grid select {
  min-height: 38px;
  padding: 7px 9px;
}

.articulation-markup-note textarea {
  min-height: 64px;
  padding: 9px 10px;
  resize: vertical;
}

.sampler-stability-hint {
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--muted);
  line-height: 1.5;
}

.scenario-composer-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 10px;
}

.scenario-composer-controls label {
  display: grid;
  gap: 8px;
}

.scenario-plan-output {
  display: grid;
  grid-template-columns: minmax(220px, 0.8fr) minmax(220px, 0.9fr) minmax(260px, 1.1fr);
  gap: 12px;
}

.scenario-plan-output article {
  display: grid;
  gap: 8px;
  min-height: 112px;
  padding: 14px;
  border: 1px solid rgba(181, 198, 188, 0.75);
  border-radius: 8px;
  background: #f8f6ee;
}

.scenario-plan-output span {
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 900;
}

.scenario-plan-output strong {
  font-size: 1.06rem;
}

.scenario-plan-output p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.scenario-generated-output {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(181, 198, 188, 0.82);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.1), transparent 42%),
    #f8fbf6;
}

.scenario-generated-output section,
.scenario-generated-output .generated-hero {
  display: grid;
  gap: 8px;
  margin: 0;
}

.scenario-generated-output h4,
.scenario-generated-output strong,
.scenario-generated-output p,
.scenario-generated-output ol,
.scenario-generated-output ul {
  margin: 0;
}

.scenario-generated-output h4 {
  color: var(--teal-dark);
  font-size: 1rem;
}

.scenario-generated-output ol,
.scenario-generated-output ul {
  padding-left: 20px;
  color: var(--muted);
  line-height: 1.55;
}

.scenario-generated-output span {
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 900;
}

.generated-visual-cards > div,
.generated-udl-supports ul {
  display: grid;
  gap: 8px;
}

.generated-visual-cards > div {
  grid-template-columns: repeat(auto-fit, minmax(138px, 1fr));
}

.generated-visual-card {
  display: grid;
  gap: 6px;
  min-height: 78px;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 8px;
  background: #fff;
}

.generated-visual-card strong {
  color: var(--ink);
  font-size: 0.98rem;
}

.generated-read-aloud {
  grid-template-columns: minmax(220px, 1fr) auto;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.24);
  border-radius: 8px;
  background: #fff;
}

.generated-read-aloud h4,
.generated-read-aloud p {
  grid-column: 1;
}

.generated-read-aloud button {
  grid-column: 2;
  grid-row: 1 / span 2;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-weight: 900;
}

.scenario-generated-output p,
.scenario-generated-output small,
.generated-note {
  color: var(--muted);
  line-height: 1.55;
}

.generated-function-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 10px;
}

.generated-function-grid article {
  display: grid;
  gap: 7px;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.74);
  border-radius: 8px;
  background: #fff;
}

.scenario-generated-output pre {
  margin: 0;
  white-space: pre-wrap;
  color: var(--ink);
  font-family: inherit;
  line-height: 1.55;
}

.scenario-feedback-copy,
.scenario-feedback-summary {
  margin: 0;
  color: var(--muted);
  font-weight: 800;
  line-height: 1.5;
}

.generated-sentence-list {
  display: grid;
  gap: 10px;
}

.generated-sentence-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 8px;
  background: #fff;
}

.generated-sentence-card[data-feedback-state="accepted"] {
  border-color: rgba(45, 149, 95, 0.52);
  background: #f3fbf6;
}

.generated-sentence-card[data-feedback-state="edited"] {
  border-color: rgba(0, 143, 140, 0.52);
  background: #f1fbfa;
}

.generated-sentence-card[data-feedback-state="rejected"] {
  border-color: rgba(201, 72, 80, 0.44);
  background: #fff6f6;
}

.sentence-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.sentence-actions button,
.sentence-edit-panel button {
  min-height: 36px;
  padding: 0 12px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-weight: 900;
}

.sentence-actions button:nth-child(2) {
  background: linear-gradient(135deg, var(--gold), var(--violet));
}

.sentence-actions button:nth-child(3) {
  background: linear-gradient(135deg, var(--coral), var(--gold));
}

.sentence-edit-panel {
  display: grid;
  gap: 8px;
}

.sentence-edit-panel[hidden] {
  display: none;
}

.scenario-feedback-summary {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 8px;
  background: #f8f6ee;
}

.scenario-feedback-summary b {
  color: var(--teal-dark);
}

.style-backstage-panel {
  border: 1px solid rgba(181, 198, 188, 0.76);
  border-radius: 8px;
  background: #f8f6ee;
}

.style-backstage-panel summary {
  min-height: 44px;
  padding: 11px 12px;
  color: var(--teal-dark);
  cursor: pointer;
  font-weight: 900;
  list-style: none;
}

.style-backstage-panel summary::-webkit-details-marker {
  display: none;
}

.style-backstage-panel summary::after {
  float: right;
  color: var(--coral);
  content: "+";
}

.style-backstage-panel[open] summary::after {
  content: "-";
}

.style-backstage-content {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 10px;
  padding: 0 12px 12px;
}

.style-backstage-content article {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.68);
  border-radius: 8px;
  background: #fff;
}

.style-backstage-content span {
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 900;
}

.style-backstage-content strong {
  color: var(--teal-dark);
  font-size: 0.98rem;
}

.style-backstage-content p,
.style-backstage-content ul {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.style-backstage-content ul {
  display: grid;
  gap: 7px;
  padding: 0;
  list-style: none;
}

.style-backstage-content li {
  display: grid;
  gap: 3px;
}

.toolbox-pack-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
}

.scenario-material-grid.is-hidden {
  display: none;
}

.toolbox-pack-card {
  display: grid;
  gap: 8px;
  min-height: 164px;
  padding: 16px;
  text-align: left;
  border: 1px solid rgba(181, 198, 188, 0.8);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(243, 248, 245, 0.96)),
    var(--paper);
}

.toolbox-pack-card:hover,
.toolbox-pack-card:focus-visible {
  border-color: var(--teal);
  box-shadow: var(--glow);
}

.toolbox-pack-card em {
  color: var(--coral);
  font-size: 0.8rem;
  font-style: normal;
  font-weight: 900;
}

.toolbox-pack-card strong {
  font-size: 1.1rem;
}

.toolbox-pack-card span,
.toolbox-pack-card p,
.toolbox-pack-card small,
.empty-state {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.toolbox-pack-card small {
  font-weight: 800;
}

.line-service-panel summary,
.plan-service-panel summary,
.report-output-panel summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid rgba(0, 143, 140, 0.24);
  border-radius: 8px;
  color: var(--teal-dark);
  background: rgba(234, 243, 238, 0.78);
  cursor: pointer;
  font-weight: 900;
  list-style: none;
}

.line-service-panel,
.plan-service-panel,
.report-output-panel {
  justify-self: end;
  width: min(100%, 320px);
  padding: 10px;
}

.line-service-panel:not([open]),
.plan-service-panel:not([open]),
.report-output-panel:not([open]) {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.line-service-panel[open],
.plan-service-panel[open],
.report-output-panel[open] {
  justify-self: stretch;
  width: 100%;
}

.line-service-panel summary span,
.line-service-panel summary small,
.plan-service-panel summary span,
.plan-service-panel summary small,
.report-output-panel summary span,
.report-output-panel summary small {
  min-width: 0;
}

.line-service-panel summary span,
.plan-service-panel summary span,
.report-output-panel summary span {
  font-weight: 950;
}

.line-service-panel summary small,
.plan-service-panel summary small,
.report-output-panel summary small {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 900;
}

.line-service-panel summary::-webkit-details-marker,
.plan-service-panel summary::-webkit-details-marker,
.report-output-panel summary::-webkit-details-marker {
  display: none;
}

.line-service-panel summary::after,
.plan-service-panel summary::after,
.report-output-panel summary::after {
  color: var(--coral);
  content: "+";
  font-size: 1.25rem;
  line-height: 1;
}

.line-service-panel[open] summary::after,
.plan-service-panel[open] summary::after,
.report-output-panel[open] summary::after {
  content: "-";
}

.line-service-content {
  display: grid;
  gap: 16px;
  max-height: min(72vh, 760px);
  overflow: auto;
  padding: 6px 4px 2px;
  scrollbar-gutter: stable;
}

.st-share-summary-panel {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(0, 143, 140, 0.18);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(234, 243, 238, 0.92), rgba(255, 255, 255, 0.94));
}

.st-share-summary-panel h4,
.st-share-summary-panel p {
  margin: 0;
}

.st-share-summary-panel h4 {
  color: var(--teal-dark);
  font-size: 1rem;
}

.st-share-summary-panel p {
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.55;
}

.st-share-summary-print-card {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(0, 143, 140, 0.18);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(234, 243, 238, 0.9)),
    radial-gradient(circle at 88% 10%, rgba(210, 122, 84, 0.13), transparent 26%);
  box-shadow: 0 14px 30px rgba(19, 53, 57, 0.08);
}

.share-summary-card-brand {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  color: var(--teal-dark);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.st-share-summary-print-card h5 {
  margin: 0;
  color: var(--ink);
  font-size: 1.18rem;
  line-height: 1.25;
}

.share-summary-meta,
.share-summary-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.share-summary-meta div,
.share-summary-metrics span {
  padding: 10px;
  border: 1px solid rgba(0, 143, 140, 0.13);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.78);
}

.share-summary-meta dt,
.share-summary-metrics small {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 850;
}

.share-summary-meta dd,
.share-summary-metrics b {
  display: block;
  margin: 3px 0 0;
  color: var(--ink);
  font-size: 1rem;
}

.st-share-summary-print-card footer {
  color: var(--muted);
  font-size: 0.72rem;
  line-height: 1.45;
}

.st-share-summary-text {
  display: block;
  min-height: 96px;
  white-space: pre-wrap;
  padding: 12px;
  border: 1px dashed rgba(0, 143, 140, 0.28);
  border-radius: 14px;
  color: var(--ink);
  background: rgba(255, 255, 255, 0.86);
  font-size: 0.9rem;
  line-height: 1.55;
}

.st-share-summary-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.plan-comparison-grid {
  grid-template-columns: repeat(3, minmax(180px, 1fr));
}

.business-copy {
  display: grid;
  gap: 8px;
}

.business-copy h3 {
  max-width: 820px;
  margin: 0;
  font-size: clamp(1.4rem, 3vw, 2rem);
  line-height: 1.14;
}

.business-copy p:last-child {
  max-width: 860px;
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.line-feedback-blueprint,
.advanced-material-bank {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
}

.line-feedback-blueprint article,
.advanced-material-bank article {
  display: grid;
  gap: 8px;
  min-height: 138px;
  padding: 14px;
  border: 1px solid rgba(181, 198, 188, 0.68);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.08), transparent 44%),
    #f8fbf6;
}

.line-feedback-blueprint span,
.advanced-material-bank span {
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 900;
}

.line-feedback-blueprint strong,
.advanced-material-bank strong {
  color: var(--teal-dark);
  font-size: 1rem;
}

.line-feedback-blueprint p,
.advanced-material-bank p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.material-quality-workbench {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(16, 36, 33, 0.16);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 209, 102, 0.18), rgba(0, 143, 140, 0.08) 54%, rgba(255, 255, 255, 0.94)),
    var(--paper);
  box-shadow: 0 16px 34px rgba(20, 39, 35, 0.08);
}

.material-quality-workbench > div:first-child {
  display: grid;
  gap: 6px;
}

.material-quality-workbench span {
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 950;
}

.material-quality-workbench strong {
  color: var(--ink);
  font-size: 1.05rem;
}

.material-quality-workbench p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.material-quality-toolbar {
  display: grid;
  grid-template-columns: minmax(140px, 0.8fr) minmax(180px, 1fr) minmax(160px, 1fr) auto;
  gap: 10px;
  align-items: end;
}

.material-quality-toolbar label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 950;
}

.material-quality-toolbar select,
.material-quality-toolbar input {
  width: 100%;
}

.material-quality-toolbar select {
  min-height: 42px;
  padding: 0 10px;
  border: 1px solid rgba(16, 36, 33, 0.22);
  border-radius: 8px;
  color: var(--ink);
  background: #fff;
  font-weight: 900;
}

.material-quality-toolbar output {
  justify-self: start;
  min-width: 34px;
  padding: 3px 8px;
  border-radius: 999px;
  color: var(--teal-deep);
  background: rgba(0, 143, 140, 0.1);
  font-weight: 950;
}

.material-quality-toolbar button {
  min-height: 42px;
  padding: 0 14px;
  border-radius: 8px;
  color: #fff;
  background: var(--teal);
  font-weight: 950;
}

.material-quality-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(92px, 1fr));
  gap: 8px;
}

.material-quality-summary article {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid rgba(16, 36, 33, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
}

.material-quality-summary strong {
  font-size: 1.2rem;
}

.material-quality-list {
  display: grid;
  gap: 8px;
  max-height: 520px;
  overflow: auto;
  padding-right: 2px;
}

.material-quality-row,
.material-quality-empty {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.75);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.9);
}

.material-quality-row[data-material-quality-status="missing"] {
  border-color: rgba(190, 92, 67, 0.38);
  background: rgba(255, 247, 241, 0.95);
}

.material-quality-row[data-material-quality-status="approved"] {
  border-color: rgba(0, 143, 140, 0.36);
  background: rgba(240, 251, 248, 0.96);
}

.material-quality-row[data-material-quality-status="rejected"] {
  border-color: rgba(126, 89, 176, 0.36);
  background: rgba(249, 246, 255, 0.96);
}

.material-quality-row span,
.material-quality-row small {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 900;
}

.material-quality-row strong {
  display: block;
  margin: 3px 0;
  color: var(--ink);
  font-size: 1.08rem;
}

.material-quality-row-meta {
  display: grid;
  gap: 4px;
  min-width: 90px;
  text-align: right;
}

.material-quality-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(54px, 1fr));
  gap: 6px;
}

.material-quality-actions button {
  min-height: 36px;
  padding: 0 10px;
  border-radius: 8px;
  color: #fff;
  background: var(--teal);
  font-weight: 950;
}

.material-quality-actions button[data-material-quality-action="reject"] {
  background: var(--coral);
}

.material-quality-status {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 850;
}

.material-quality-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}

.material-quality-grid article {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.7);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.78);
}

.material-quality-grid b {
  color: var(--teal-dark);
}

.material-layered-quality-report {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(0, 143, 140, 0.2);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.1), rgba(255, 255, 255, 0.9) 54%, rgba(255, 209, 102, 0.1)),
    var(--paper);
  box-shadow: 0 16px 34px rgba(20, 39, 35, 0.08);
}

.material-layered-quality-report > div:first-child,
.material-layered-quality-report-card > div:first-child,
.material-layered-quality-samples > div:first-child {
  display: grid;
  gap: 6px;
}

.material-layered-quality-report span,
.material-layered-quality-report-card span,
.material-layered-quality-samples span,
.material-layered-quality-layer span {
  color: var(--teal-dark);
  font-size: 0.78rem;
  font-weight: 950;
}

.material-layered-quality-report strong,
.material-layered-quality-report-card strong,
.material-layered-quality-branch h4,
.material-layered-quality-sample-branch h4 {
  color: var(--ink);
}

.material-layered-quality-report p,
.material-layered-quality-report-card p,
.material-layered-quality-samples p {
  margin: 0;
  color: var(--muted);
  line-height: 1.52;
}

.material-layered-quality-toolbar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.material-layered-quality-toolbar button {
  min-height: 42px;
  padding: 0 14px;
  border-radius: 8px;
  color: #fff;
  background: var(--teal);
  font-weight: 950;
}

.material-layered-quality-toolbar output {
  padding: 10px 12px;
  border-radius: 8px;
  color: var(--ink);
  background: #fff;
  font-weight: 900;
}

.material-layered-quality-report-card,
.material-layered-quality-samples {
  display: grid;
  gap: 12px;
}

.material-layered-quality-branches {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

.material-layered-quality-branch,
.material-layered-quality-fix-note,
.material-layered-quality-sample-branch {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.72);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.84);
}

.material-layered-quality-branch[data-layered-quality-status="blocked"] {
  border-color: rgba(210, 78, 78, 0.42);
  background: rgba(255, 236, 236, 0.9);
}

.material-layered-quality-layer-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.material-layered-quality-layer {
  display: grid;
  gap: 4px;
  padding: 10px;
  border-radius: 8px;
  background: rgba(0, 143, 140, 0.08);
}

.material-layered-quality-layer strong {
  font-size: 1.2rem;
}

.material-layered-quality-layer small,
.material-layered-quality-sample-layer li span {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 850;
}

.material-layered-quality-sample-layer {
  display: grid;
  gap: 6px;
}

.material-layered-quality-sample-layer ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.material-layered-quality-sample-layer li {
  display: grid;
  gap: 4px;
  padding: 8px;
  border-radius: 8px;
  background: rgba(246, 250, 247, 0.94);
}

.quality-maintenance-system {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(0, 143, 140, 0.22);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.12), rgba(255, 255, 255, 0.86) 48%, rgba(255, 209, 102, 0.12)),
    var(--paper);
  box-shadow: 0 16px 34px rgba(20, 39, 35, 0.08);
}

.quality-maintenance-system > div:first-child {
  display: grid;
  gap: 6px;
}

.quality-maintenance-system > div:first-child span,
.quality-maintenance-summary span,
.quality-maintenance-gate span,
.quality-maintenance-actions span {
  color: var(--teal-dark);
  font-size: 0.78rem;
  font-weight: 950;
}

.quality-maintenance-system > div:first-child strong {
  color: var(--ink);
  font-size: 1.05rem;
}

.quality-maintenance-system p {
  margin: 0;
  color: var(--muted);
  line-height: 1.52;
}

.quality-maintenance-toolbar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.quality-maintenance-toolbar button {
  min-height: 42px;
  padding: 0 14px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-weight: 950;
}

.quality-maintenance-toolbar output {
  padding: 10px 12px;
  border-radius: 8px;
  color: var(--ink);
  background: #fff;
  font-weight: 900;
}

.quality-maintenance-summary,
.quality-maintenance-gates,
.quality-maintenance-actions {
  display: grid;
  gap: 10px;
}

.quality-maintenance-summary {
  grid-template-columns: repeat(5, minmax(92px, 1fr));
}

.quality-maintenance-summary article,
.quality-maintenance-gate,
.quality-maintenance-actions article {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.72);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.84);
}

.quality-maintenance-summary strong,
.quality-maintenance-gate strong,
.quality-maintenance-actions strong {
  color: var(--ink);
}

.quality-maintenance-gate {
  grid-template-columns: minmax(0, 1.15fr) minmax(210px, 0.85fr);
  align-items: start;
}

.quality-maintenance-gate[data-quality-gate-status="blocked"] {
  border-color: rgba(210, 78, 78, 0.42);
  background: rgba(255, 236, 236, 0.9);
}

.quality-maintenance-gate[data-quality-gate-status="watch"] {
  border-color: rgba(255, 123, 84, 0.38);
  background: rgba(255, 247, 232, 0.9);
}

.quality-maintenance-gate ul {
  display: grid;
  gap: 4px;
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 850;
}

.quality-maintenance-actions {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.quest-backstage-workbench {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(103, 86, 166, 0.25);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(103, 86, 166, 0.09), rgba(0, 143, 140, 0.08)),
    #f8fbf6;
}

.quest-copy {
  max-width: 940px;
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.quest-control-grid {
  display: grid;
  grid-template-columns: minmax(160px, 0.85fr) minmax(190px, 0.95fr) minmax(240px, 1.35fr) minmax(150px, auto);
  gap: 10px;
  align-items: end;
}

.quest-control-grid label,
.quest-domain-toggles {
  display: grid;
  gap: 6px;
  margin: 0;
  color: var(--teal-dark);
  font-size: 0.84rem;
  font-weight: 900;
}

.quest-control-grid select {
  width: 100%;
  min-height: 44px;
  border: 1px solid rgba(181, 198, 188, 0.78);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--ink);
  font: inherit;
}

.quest-domain-toggles {
  grid-template-columns: repeat(3, minmax(66px, 1fr));
  padding: 8px 10px;
  border: 1px solid rgba(181, 198, 188, 0.78);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.78);
}

.quest-domain-toggles legend {
  grid-column: 1 / -1;
  color: var(--teal-dark);
  font-size: 0.78rem;
}

.quest-domain-toggles label {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--ink);
}

.quest-domain-toggles input {
  width: 20px;
  height: 20px;
  accent-color: var(--violet);
}

.quest-control-grid > button,
.quest-line-panel button {
  min-height: 44px;
  padding: 0 16px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--violet), var(--teal));
  font-weight: 950;
}

.quest-workflow-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.65fr);
  gap: 12px;
  align-items: start;
}

.quest-card-output,
.quest-line-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.68);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.86);
}

.quest-card-output > p,
.quest-line-panel output {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
  white-space: pre-wrap;
}

.quest-card-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.quest-card-tabs button {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(181, 198, 188, 0.82);
  border-radius: 8px;
  color: var(--teal-dark);
  background: #fff;
  font-weight: 900;
}

.quest-card-tabs button.active,
.quest-feedback-buttons button.active {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, var(--teal), var(--violet));
}

.quest-card-detail {
  display: grid;
  gap: 10px;
}

.quest-card-detail span,
.quest-card-detail h4,
.quest-card-detail p {
  margin: 0;
}

.quest-card-detail > span {
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 950;
}

.quest-card-detail h4,
.quest-line-panel h4 {
  margin: 0;
  color: var(--teal-dark);
  font-size: 1.04rem;
}

.quest-card-detail p,
.quest-card-detail li,
.quest-card-token-row span {
  color: var(--muted);
  line-height: 1.48;
}

.quest-card-token-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(0, 143, 140, 0.08);
}

.quest-card-token-row b {
  color: var(--teal-dark);
}

.quest-mini-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 8px;
}

.quest-mini-cards div {
  display: grid;
  gap: 4px;
  padding: 8px;
  border-radius: 8px;
  background: rgba(103, 86, 166, 0.08);
}

.quest-mini-cards b {
  color: var(--violet);
  font-size: 0.78rem;
}

.quest-mini-cards span {
  color: var(--ink);
  font-size: 0.88rem;
}

.quest-feedback-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.65fr);
  gap: 10px;
  align-items: center;
}

.quest-feedback-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.quest-feedback-buttons button {
  min-height: 38px;
  padding: 0 12px;
  border: 1px solid rgba(181, 198, 188, 0.78);
  border-radius: 8px;
  color: var(--teal-dark);
  background: rgba(255, 255, 255, 0.9);
  font-weight: 900;
}

.quest-feedback-row output {
  display: block;
  min-height: 38px;
  padding: 9px 12px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal-dark), var(--violet));
  font-weight: 900;
  line-height: 1.4;
}

.service-outcome-workbench {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(0, 143, 140, 0.22);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.08), rgba(232, 179, 68, 0.1)),
    #f8fbf6;
}

.service-outcome-copy {
  max-width: 940px;
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.service-outcome-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr));
  gap: 10px;
}

.service-outcome-grid article {
  display: grid;
  gap: 6px;
  min-height: 118px;
  padding: 13px;
  border: 1px solid rgba(181, 198, 188, 0.72);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.84);
}

.service-outcome-grid span {
  color: var(--coral);
  font-size: 0.76rem;
  font-weight: 950;
}

.service-outcome-grid strong {
  color: var(--teal-dark);
  font-size: 1.35rem;
}

.service-outcome-grid small,
#serviceOutcomeUpdatedAt {
  color: var(--muted);
  font-weight: 800;
  line-height: 1.35;
}

.service-outcome-risk-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.service-outcome-risk-row output {
  display: block;
  min-height: 42px;
  padding: 10px 12px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal-dark), var(--violet));
  font-weight: 900;
  line-height: 1.4;
}

.service-outcome-risk-row output[data-risk="watch"] {
  background: linear-gradient(135deg, #8a5d0c, var(--coral));
}

.service-outcome-risk-row output[data-risk="high"] {
  background: linear-gradient(135deg, #7d2433, var(--coral));
}

.service-outcome-risk-row button {
  min-height: 42px;
  padding: 0 14px;
}

.control-plane-workbench {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(82, 69, 140, 0.24);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(82, 69, 140, 0.08), rgba(0, 143, 140, 0.08)),
    #f9fbfc;
}

.control-plane-copy {
  max-width: 960px;
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.control-plane-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.control-plane-toolbar button {
  min-height: 40px;
  padding: 0 12px;
}

.control-plane-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(110px, 1fr));
  gap: 10px;
}

.control-plane-summary article,
.control-plane-list article {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.72);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.86);
}

.control-plane-summary span,
.control-plane-list small {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
  line-height: 1.35;
}

.control-plane-summary strong,
.control-plane-list b {
  color: var(--teal-dark);
}

.control-plane-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(240px, 1fr));
  gap: 12px;
}

.control-plane-grid section {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.control-plane-grid h4 {
  margin: 0;
  color: var(--ink);
}

.control-plane-list {
  display: grid;
  gap: 8px;
}

.control-plane-list span {
  overflow-wrap: anywhere;
  color: var(--coral);
  font-weight: 900;
}

.service-moat-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(82, 69, 140, 0.22);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
}

.service-moat-card > div:first-child {
  display: grid;
  gap: 5px;
}

.service-moat-card span {
  color: var(--coral);
  font-size: 0.76rem;
  font-weight: 950;
}

.service-moat-card strong {
  color: var(--ink);
  font-size: 1.08rem;
}

.service-moat-card p {
  max-width: 860px;
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.service-moat-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(118px, 1fr));
  gap: 8px;
}

.service-moat-grid article {
  display: grid;
  gap: 5px;
  min-height: 112px;
  padding: 11px;
  border: 1px solid rgba(181, 198, 188, 0.72);
  border-radius: 8px;
  background: rgba(248, 251, 246, 0.9);
}

.service-moat-grid strong {
  color: var(--teal-dark);
  font-size: 1.45rem;
}

.service-moat-grid small,
#moatReadinessStatus {
  color: var(--muted);
  font-weight: 850;
  line-height: 1.35;
}

.daily-note-workbench {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(0, 143, 140, 0.22);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.08), rgba(232, 179, 68, 0.1)),
    #f8fbf6;
}

.daily-note-copy {
  max-width: 920px;
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.report-wizard-panel {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(0, 143, 140, 0.24);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(243, 248, 245, 0.92)),
    var(--paper);
  box-shadow: 0 14px 34px rgba(16, 36, 33, 0.08);
}

.daily-note-workflow-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.report-wizard-steps {
  grid-template-columns: repeat(4, minmax(120px, 1fr));
}

.daily-note-workflow-steps li,
.daily-note-source-summary {
  display: grid;
  gap: 5px;
  padding: 10px;
  border: 1px solid rgba(181, 198, 188, 0.68);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.78);
}

.report-intent-picker {
  display: grid;
  gap: 10px;
}

.report-intent-picker > div:first-child {
  display: grid;
  gap: 4px;
}

.report-intent-picker span {
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 950;
}

.report-intent-picker h4 {
  margin: 0;
  color: var(--ink);
  font-size: 1.02rem;
}

.report-intent-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px;
}

.report-intent-cards button {
  display: grid;
  gap: 6px;
  min-height: 132px;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.72);
  border-radius: 8px;
  color: var(--ink);
  text-align: left;
  background: rgba(255, 255, 255, 0.84);
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease, background 160ms ease;
}

.report-intent-cards button:hover,
.report-intent-cards button:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(0, 143, 140, 0.44);
  box-shadow: 0 10px 22px rgba(16, 36, 33, 0.1);
}

.report-intent-cards button.active {
  border-color: transparent;
  color: #fff;
  background:
    linear-gradient(135deg, rgba(0, 143, 140, 0.94), rgba(103, 86, 166, 0.92)),
    var(--teal);
  box-shadow: 0 12px 28px rgba(0, 143, 140, 0.2);
}

.report-intent-cards span {
  color: var(--coral);
  font-size: 0.72rem;
  font-weight: 950;
}

.report-intent-cards strong {
  font-size: 1.04rem;
}

.report-intent-cards small {
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.45;
}

.report-intent-cards button.active span,
.report-intent-cards button.active small {
  color: rgba(255, 255, 255, 0.86);
}

.report-intent-cards button.active strong {
  color: #fff;
}

.daily-note-workflow-steps b,
.daily-note-source-summary b,
.daily-note-composer-blocks b {
  color: var(--teal-dark);
  font-size: 0.9rem;
}

.daily-note-workflow-steps span,
.daily-note-source-summary span,
.daily-note-composer-blocks span {
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.42;
}

.daily-note-template-engine {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(103, 86, 166, 0.22);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(243, 248, 245, 0.9)),
    var(--paper);
  box-shadow: 0 12px 26px rgba(16, 36, 33, 0.08);
}

.daily-note-advanced-template {
  padding: 0;
  overflow: hidden;
}

.daily-note-advanced-template summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px 14px;
  cursor: pointer;
  list-style: none;
}

.daily-note-advanced-template summary::-webkit-details-marker {
  display: none;
}

.daily-note-advanced-template summary::after {
  color: var(--coral);
  content: "+";
  font-size: 1.15rem;
  font-weight: 950;
  line-height: 1;
}

.daily-note-advanced-template[open] summary::after {
  content: "-";
}

.daily-note-advanced-template summary span {
  color: var(--teal-dark);
  font-weight: 950;
}

.daily-note-advanced-template summary small {
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.35;
}

.daily-note-advanced-template[open] > :not(summary) {
  margin: 0 14px 12px;
}

.daily-note-template-controls {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) auto auto;
  gap: 10px;
  align-items: end;
}

.daily-note-template-controls label {
  display: grid;
  gap: 6px;
  color: var(--teal-dark);
  font-size: 0.84rem;
  font-weight: 900;
}

.daily-note-template-controls select {
  min-height: 42px;
  border: 1px solid rgba(181, 198, 188, 0.78);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.94);
  color: var(--ink);
  font: inherit;
}

.daily-note-template-controls button,
.daily-note-template-feedback-buttons button {
  min-height: 42px;
  padding: 0 14px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-weight: 950;
}

.daily-note-template-controls button:nth-of-type(2) {
  background: linear-gradient(135deg, var(--gold), var(--coral));
}

.daily-note-template-preview {
  display: grid;
  gap: 8px;
  min-height: 92px;
  padding: 12px;
  border: 1px dashed rgba(0, 143, 140, 0.34);
  border-radius: 8px;
  background: #f3f8f5;
}

.daily-note-template-preview-card {
  display: grid;
  gap: 8px;
}

.daily-note-template-preview-card span {
  color: var(--coral);
  font-size: 0.8rem;
  font-weight: 950;
}

.daily-note-template-preview-card h4,
.daily-note-template-version-panel h5 {
  margin: 0;
  color: var(--ink);
}

.daily-note-template-preview-card ul,
.daily-note-template-version-panel ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.daily-note-template-preview-card li,
.daily-note-template-version-panel li {
  display: grid;
  gap: 3px;
  padding: 8px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.74);
}

.daily-note-template-preview-card b,
.daily-note-template-version-panel strong {
  color: var(--teal-dark);
}

.daily-note-template-preview-card span,
.daily-note-template-version-panel span,
.daily-note-template-feedback-row output {
  color: var(--muted);
  line-height: 1.45;
}

.daily-note-template-feedback-row {
  display: grid;
  grid-template-columns: auto minmax(220px, 1fr);
  gap: 10px;
  align-items: center;
}

.daily-note-template-feedback-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.daily-note-template-feedback-buttons button:nth-child(2) {
  background: linear-gradient(135deg, var(--gold), var(--violet));
}

.daily-note-template-feedback-buttons button:nth-child(3) {
  background: linear-gradient(135deg, var(--coral), var(--violet));
}

.daily-note-template-version-panel {
  display: grid;
  gap: 8px;
}

.daily-note-form-heading {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: baseline;
  padding: 0 2px;
}

.daily-note-form-heading b {
  color: var(--teal-dark);
  font-size: 0.9rem;
}

.daily-note-form-heading span {
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.4;
}

.daily-note-form {
  display: grid;
  grid-template-columns: minmax(140px, 0.8fr) minmax(180px, 1fr) repeat(2, minmax(220px, 1.5fr));
  gap: 10px;
  align-items: stretch;
}

.daily-note-form label {
  display: grid;
  gap: 6px;
  color: var(--teal-dark);
  font-size: 0.84rem;
  font-weight: 900;
}

.daily-note-form input,
.daily-note-form textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(181, 198, 188, 0.78);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--ink);
  font: inherit;
}

.daily-note-form textarea {
  resize: vertical;
}

.daily-note-composer-blocks {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(0, 143, 140, 0.24);
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(235, 247, 242, 0.94), rgba(255, 255, 255, 0.9));
}

.daily-note-composer-block-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
}

.daily-note-composer-block-grid article {
  display: grid;
  gap: 6px;
  min-height: 118px;
  padding: 10px;
  border: 1px solid rgba(181, 198, 188, 0.58);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
}

.daily-note-composer-block-grid strong {
  color: var(--ink);
}

.daily-note-composer-block-grid p,
.daily-note-composer-block-grid small {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.daily-note-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.daily-note-actions button {
  min-height: 42px;
  padding: 0 16px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--coral), var(--gold) 54%, var(--violet));
  font-weight: 950;
}

.daily-note-actions button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  filter: grayscale(0.25);
}

.daily-note-output-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(240px, 0.65fr);
  gap: 12px;
  align-items: start;
}

.daily-note-preview,
.daily-note-evidence,
.daily-note-history-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.daily-note-preview h4,
.daily-note-evidence h4,
.daily-note-history-panel h4 {
  margin: 0;
  color: var(--teal-dark);
  font-size: 0.98rem;
}

.daily-note-preview-frame,
.daily-note-evidence-summary,
.daily-note-history {
  min-height: 120px;
  max-height: 360px;
  overflow: auto;
  padding: 12px;
  border: 1px solid rgba(181, 198, 188, 0.68);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.86);
}

.daily-note-preview-frame h1 {
  margin: 0 0 8px;
  color: var(--ink);
  font-size: 1.2rem;
}

.daily-note-preview-frame h2 {
  margin: 12px 0 6px;
  color: var(--teal-dark);
  font-size: 0.98rem;
}

.daily-note-preview-frame p,
.daily-note-preview-frame li {
  color: var(--ink);
  line-height: 1.5;
}

.daily-note-evidence-summary dl {
  display: grid;
  gap: 8px;
  margin: 0;
}

.daily-note-evidence-summary div,
.daily-note-history li {
  display: grid;
  gap: 4px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(181, 198, 188, 0.48);
}

.daily-note-evidence-summary div:last-child,
.daily-note-history li:last-child {
  border-bottom: 0;
}

.daily-note-evidence-summary dt,
.daily-note-history strong {
  color: var(--teal-dark);
  font-weight: 950;
}

.daily-note-evidence-summary dd {
  margin: 0;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.daily-note-history {
  margin: 0;
  list-style: none;
}

.daily-note-history span {
  color: var(--muted);
  font-size: 0.88rem;
  overflow-wrap: anywhere;
}

.billing-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(190px, 1fr));
  gap: 12px;
}

.billing-card {
  display: grid;
  gap: 10px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(248, 251, 246, 0.94)),
    var(--paper);
}

.billing-card.featured {
  border-color: var(--teal);
  box-shadow: inset 0 0 0 2px rgba(0, 143, 140, 0.14), var(--glow);
}

.billing-card[data-plan-selected="true"] {
  border-color: var(--coral);
  box-shadow: inset 0 0 0 2px rgba(201, 72, 80, 0.14), var(--glow);
}

.billing-card span,
.model-panel span,
.edge-agent-panel span {
  color: var(--coral);
  font-size: 0.8rem;
  font-weight: 900;
  text-transform: uppercase;
}

.billing-card strong {
  font-size: 1.12rem;
}

.billing-card p,
.model-panel p,
.edge-agent-panel p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.billing-card button,
.model-panel button,
.edge-agent-panel button {
  min-height: 42px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-weight: 900;
}

.usage-policy {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 12px;
}

.usage-policy section,
.usage-consent {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid rgba(181, 198, 188, 0.65);
  border-radius: 8px;
  background: #f8fbf6;
}

.usage-policy h4 {
  margin: 0;
  color: var(--teal-dark);
  font-size: 0.96rem;
}

.usage-policy p,
.usage-consent span {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.usage-consent {
  grid-column: 1 / -1;
  grid-template-columns: 22px 1fr;
  align-items: start;
}

.usage-consent input {
  width: 20px;
  min-height: 20px;
  margin: 2px 0 0;
  accent-color: var(--teal);
}

.status-line {
  color: var(--muted);
  background:
    linear-gradient(90deg, rgba(0, 143, 140, 0.08), transparent),
    var(--panel);
}

.model-panel {
  display: grid;
  grid-template-columns: 1fr 140px 140px;
  gap: 10px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f3f8f5;
}

.model-panel output {
  grid-column: 1 / -1;
}

.edge-agent-panel {
  display: grid;
  grid-template-columns: 1fr 140px 150px;
  gap: 10px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8f6ee;
}

.edge-agent-panel output,
.edge-advice {
  grid-column: 1 / -1;
}

.edge-advice {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 10px;
}

.edge-advice div {
  display: grid;
  gap: 8px;
  min-height: 112px;
  padding: 12px;
  border-radius: 8px;
  border: 1px solid rgba(181, 198, 188, 0.65);
  background: #f3f8f5;
}

.edge-advice b {
  color: var(--teal-dark);
}

.edge-advice span {
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.5;
  text-transform: none;
}

.speech-check {
  display: grid;
  grid-template-columns: 1fr 150px;
  gap: 12px;
  align-items: end;
  padding: 14px;
  border-radius: 8px;
  border: 1px solid rgba(181, 198, 188, 0.7);
  background: var(--panel);
}

output {
  display: block;
  min-height: 42px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.assessment {
  display: grid;
  grid-template-columns: repeat(2, minmax(130px, 180px)) minmax(260px, 1fr);
  gap: 12px;
  align-items: stretch;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8f6ee;
}

.score-tile {
  display: grid;
  gap: 8px;
  min-height: 136px;
  padding: 14px;
  border-radius: 8px;
  border: 1px solid rgba(181, 198, 188, 0.65);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.76), rgba(243, 248, 245, 0.9)),
    #f3f8f5;
}

.score-tile span,
.compare-text b {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 900;
}

.score-tile strong {
  font-size: clamp(2rem, 5vw, 3rem);
  line-height: 1;
}

.difference strong {
  color: var(--coral);
}

.meter {
  width: 100%;
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: #dfe7e4;
}

.meter i {
  display: block;
  width: 0%;
  height: 100%;
  border-radius: inherit;
  background: var(--teal);
  transition: width 220ms ease;
}

.difference .meter i {
  background: var(--coral);
}

.compare-text {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.compare-text div {
  display: grid;
  gap: 6px;
}

.compare-text output {
  min-height: 78px;
  line-height: 1.5;
}

#assessmentHint {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.agent-panel {
  display: grid;
  gap: 16px;
  padding: 18px;
}

.auth-panel {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.auth-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr)) 120px;
  gap: 10px;
  align-items: end;
}

.auth-grid label,
.client-form label {
  display: grid;
  gap: 8px;
}

.auth-grid button,
.client-form button,
.line-entitlement button {
  min-height: 42px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-weight: 900;
}

.client-workflow {
  display: grid;
  grid-template-columns: minmax(280px, 1.2fr) minmax(240px, 0.8fr);
  gap: 12px;
}

.client-form,
.line-entitlement {
  display: grid;
  gap: 12px;
  padding: 14px;
  border-radius: 8px;
  border: 1px solid rgba(181, 198, 188, 0.65);
  background: #f3f8f5;
}

.line-entitlement p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.client-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 10px;
}

.client-list div {
  display: grid;
  gap: 8px;
  min-height: 116px;
  padding: 12px;
  border-radius: 8px;
  background: #f8f6ee;
  border: 1px solid var(--line);
}

.client-list b {
  color: var(--teal-dark);
}

.client-list span,
.client-list code {
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.client-list code {
  color: var(--coral);
}

.system-check-panel {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.system-check-copy {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.system-check-copy p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.system-check-copy button {
  min-width: 150px;
  min-height: 42px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--teal), var(--green));
  font-weight: 900;
}

.system-check-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 10px;
}

.system-check-grid div {
  display: grid;
  gap: 8px;
  min-height: 96px;
  padding: 12px;
  border-radius: 8px;
  border: 1px solid rgba(181, 198, 188, 0.65);
  background: #f3f8f5;
}

.system-check-grid b {
  color: var(--teal-dark);
}

.system-check-grid span {
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.45;
}

.system-check-grid .ok span {
  color: var(--green);
}

.system-check-grid .warn span {
  color: var(--gold);
}

.system-check-grid .fail span {
  color: var(--coral);
}

.advanced-system-check {
  border-color: rgba(124, 233, 216, 0.22);
  background:
    linear-gradient(135deg, rgba(124, 233, 216, 0.12), rgba(255, 255, 255, 0.78)),
    #f8fbf6;
  box-shadow: none;
}

.advanced-system-check .section-heading p {
  color: var(--coral);
}

.advanced-system-check .section-heading h3 {
  color: var(--ink);
}

.advanced-system-check .system-check-copy {
  display: grid;
  gap: 12px;
}

.advanced-system-check .system-check-copy p {
  color: var(--muted);
}

.advanced-system-check .system-check-copy button {
  width: 100%;
  min-width: 0;
}

.advanced-system-check .system-check-grid {
  grid-template-columns: repeat(4, minmax(140px, 1fr));
}

.advanced-system-check .system-check-grid div {
  min-height: auto;
  border-color: rgba(124, 233, 216, 0.18);
  background: rgba(255, 255, 255, 0.74);
}

.advanced-system-check .system-check-grid b {
  color: var(--ink);
}

.advanced-system-check .system-check-grid span {
  color: var(--muted);
}

.agent-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr)) 150px;
  gap: 12px;
  align-items: end;
}

.agent-grid label {
  display: grid;
  gap: 8px;
}

.agent-grid button {
  min-height: 44px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--coral), var(--violet));
  font-weight: 900;
}

.plan-output {
  display: grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: 12px;
}

.plan-output div {
  display: grid;
  gap: 8px;
  padding: 14px;
  border-radius: 8px;
  border: 1px solid rgba(181, 198, 188, 0.65);
  background: #f3f8f5;
}

.plan-output b {
  color: var(--teal-dark);
}

.plan-output span {
  color: var(--muted);
  line-height: 1.5;
}

.homework {
  padding: 18px;
}

.homework ol,
.history ul {
  margin: 0;
  padding: 0;
}

.homework li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  list-style: none;
}

.homework input[type="checkbox"] {
  width: 20px;
  min-height: 20px;
  margin-top: 2px;
  accent-color: var(--teal);
}

.compact {
  margin-top: 16px;
}

.inline-form {
  display: grid;
  grid-template-columns: 1fr 74px;
  gap: 8px;
}

.history {
  padding: 18px;
}

.history-heading-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

.history-stats {
  flex: 0 0 auto;
  grid-template-columns: repeat(2, minmax(86px, 1fr));
}

.history-stats div {
  padding: 10px 12px;
}

.history-stats strong {
  font-size: 1.24rem;
}

.line-panel {
  padding: 18px;
}

.line-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 12px;
}

.line-grid div {
  display: grid;
  gap: 8px;
  padding: 14px;
  border-radius: 8px;
  border: 1px solid rgba(181, 198, 188, 0.65);
  background: #f3f8f5;
}

.line-grid strong {
  font-size: 0.96rem;
}

.line-grid code {
  white-space: normal;
  overflow-wrap: anywhere;
  color: var(--teal-dark);
  font-size: 0.88rem;
  font-weight: 800;
}

.line-grid span {
  color: var(--muted);
  line-height: 1.45;
}

.history ul {
  display: grid;
  gap: 8px;
  list-style: none;
}

.history li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 8px;
  background: #eef6f0;
  color: var(--muted);
}

.practice-card,
.agent-panel,
.auth-panel,
.system-check-panel {
  position: relative;
}

.practice-card::before,
.agent-panel::before,
.auth-panel::before,
.system-check-panel::before {
  position: absolute;
  top: 0;
  left: 18px;
  right: 18px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--teal), var(--green), var(--gold), var(--coral));
  content: "";
}

.history strong {
  color: var(--ink);
}

.lesson-grid,
.practice-area,
.history {
  display: none;
}

@media (max-width: 1280px) {
  .topbar h2 {
    font-size: clamp(1.25rem, 2.2vw, 2.05rem);
  }
}

@media (max-width: 1080px) {
  .workspace,
  .practice-area {
    grid-template-columns: 1fr;
  }

  .topbar h2 {
    font-size: 1.95rem;
  }

  .sidebar {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .sidebar-mode-nav {
    grid-template-columns: repeat(5, minmax(112px, 1fr));
  }

  .communication-branch-gate {
    grid-template-columns: repeat(3, minmax(120px, 1fr));
  }

  .lesson-grid {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
  }
}

@media (max-width: 680px) {
  .app-shell {
    padding: 10px;
  }

  .app-shell,
  .workspace,
  .sidebar,
  .main-panel,
  .topbar,
  .topbar-actions,
  .topbar-brand,
  .topbar-login-row {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .workspace {
    min-height: calc(100vh - 20px);
    grid-template-columns: minmax(0, 1fr);
    overflow-x: hidden;
  }

  .main-panel {
    grid-template-columns: minmax(0, 1fr);
    overflow-x: hidden;
  }

  .main-panel > *,
  .toolbox-panel,
  .voice-assessment-panel,
  .sampler-heading,
  .voice-layer-grid,
  .voice-layer-card,
  .voice-layer-card > *,
  .voice-diary-form,
  .voice-diary-form > *,
  .voice-diary-form label,
  .voice-diary-form span,
  .voice-record-row,
  .voice-parameter-grid {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .rsst-workflow-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .swallow-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .pt-head-neck-grid,
  .pt-baseline-field-grid,
  .audience-mode-strip,
  .pt-guided-flow-card,
  .pt-guided-flow-list,
  .pt-service-direction-grid,
  .pt-general-msk-grid,
  .pt-post-op-orthopedic-grid,
  .pt-neuro-balance-grid,
  .pt-cardio-frailty-grid,
  .pt-return-activity-grid,
  .pt-movement-quest-grid,
  .pt-movement-quest-selected,
  .pt-head-neck-journal-grid,
  .pt-consult-routing-grid,
  .pt-consult-routing-choice-grid,
  .pt-consult-routing-lanes,
  .pt-support-faq-grid,
  .pt-support-faq-urgent-grid,
  .pt-support-faq-lanes,
  .pt-report-output-v2-controls,
  .pt-professional-review-grid,
  .pt-professional-review-decision-grid,
  .pt-professional-review-issue-grid,
  .pt-professional-review-lanes,
  .pt-template-ugc-grid,
  .pt-template-ugc-lanes,
  .pt-head-neck-check-list {
    grid-template-columns: minmax(0, 1fr);
  }

  .pt-general-msk-grid .swallow-question:last-child,
  .pt-functional-baseline-card,
  .pt-movement-quest-safety {
    grid-column: auto;
  }

  .pt-guided-flow-card {
    grid-template-columns: minmax(0, 1fr);
  }

  .pt-guided-flow-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pt-guide-dismiss {
    justify-self: stretch;
  }

  .pt-guided-next-action {
    position: sticky;
    bottom: 12px;
    z-index: 60;
    width: 100%;
  }

  .swallow-grid > .swallow-card:first-child,
  .swallow-grid > .swallow-card:nth-child(2),
  .swallow-grid > .mna-card {
    grid-column: auto;
    grid-row: auto;
  }

  .rsst-position-card,
  .rsst-measure-card,
  .rsst-timer-control,
  .articulation-paid-markup,
  .articulation-paid-markup > *,
  .articulation-markup-grid,
  .articulation-markup-grid label,
  .articulation-markup-note {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .articulation-markup-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .articulation-paid-markup-header {
    flex-wrap: wrap;
  }

  .voice-diary-form span {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .voice-diary-form input,
  .voice-diary-form select,
  .voice-diary-form textarea {
    max-width: 100%;
    min-width: 0;
  }

  .voice-diary-checklist {
    grid-template-columns: 1fr;
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .voice-diary-checklist label {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .sampler-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .sidebar,
  .main-panel,
  .practice-card {
    padding: 16px;
  }

  .topbar,
  .phrase-header {
    display: grid;
  }

  .topbar {
    grid-template-columns: 1fr;
    grid-template-areas:
      "hero"
      "actions";
  }

  body.is-pt-tool .topbar {
    align-items: flex-start;
  }

  .topbar h2 {
    font-size: 1.55rem;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .stats,
  .communication-branch-gate,
  .branch-intro-track,
  .generation-tier-strip,
  .scenario-function-toggles,
  .articulation-level-strip,
  .sampler-controls,
  .sampler-mode-row,
  .sampler-recording-row,
  .voice-layer-grid,
  .voice-record-row,
  .voice-parameter-grid,
  .voice-diary-form,
  .language-dialogue-controls,
  .language-flow-steps,
  .language-mode-selector,
  .language-studio-rail,
  .language-picture-description-card,
  .language-story-focus-card,
  .quest-demo-disclosure summary,
  .quest-demo-stage,
  .quest-demo-controls,
  .language-dialogue-detail-grid,
  .language-dialogue-turns li,
  .fluency-control-grid,
  .fluency-edge-grid,
  .fluency-mark-buttons,
  .auditory-control-row,
  .auditory-source-strip,
  .articulation-step-actions,
  .articulation-sample-card,
  .articulation-current-sample,
  .scenario-composer-controls,
  .scenario-plan-output,
  .demo-comic-panel,
  .line-feedback-blueprint,
  .advanced-material-bank,
  .material-quality-toolbar,
  .material-quality-summary,
  .material-quality-grid,
  .material-quality-row,
  .material-layered-quality-toolbar,
  .material-layered-quality-branches,
  .material-layered-quality-layer-grid,
  .quality-maintenance-toolbar,
  .quality-maintenance-summary,
  .quality-maintenance-gate,
  .quality-maintenance-actions,
  .quest-control-grid,
  .quest-workflow-grid,
  .quest-feedback-row,
  .service-outcome-grid,
  .service-outcome-risk-row,
  .service-moat-grid,
  .control-plane-toolbar,
  .control-plane-summary,
  .control-plane-grid,
  .daily-note-workflow-steps,
  .daily-note-template-controls,
  .daily-note-template-feedback-row,
  .report-intent-cards,
  .daily-note-form,
  .daily-note-output-grid,
  .peer-review-steps,
  .material-peer-review-form,
  .peer-review-dashboard-grid,
  .generated-read-aloud,
  .generated-function-grid,
  .style-backstage-content,
  .toolbox-pack-grid,
  .history-heading-row,
  .topbar-actions,
  .topbar-brand,
  .topbar-login-row,
  .professional-grid,
  .domain-tabs,
  .lesson-grid,
  .billing-grid,
  .auth-grid,
  .client-workflow,
  .client-list,
  .agent-grid,
  .plan-output,
  .system-check-copy,
  .system-check-grid,
  .practice-flow,
  .model-panel,
  .edge-agent-panel,
  .edge-advice,
  .controls,
  .speech-check,
  .assessment,
  .compare-text,
  .line-grid {
    grid-template-columns: 1fr;
  }

  .language-story-progress {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .articulation-visual-card {
    justify-self: stretch;
    width: 100%;
  }

  .topbar-login-row {
    grid-template-columns: 1fr;
  }

  .addon-panel,
  .material-peer-review-panel,
  .topbar-service-panel,
  .professional-panel {
    position: fixed;
    inset: 12px 14px;
    width: auto;
    max-height: none;
    overflow: auto;
    overscroll-behavior: contain;
    z-index: 120;
  }

  .professional-menu summary,
  .material-peer-review-menu summary,
  .topbar-service-menu summary,
  .addon-menu summary {
    position: relative;
    z-index: 130;
  }

  .professional-menu[open] summary,
  .material-peer-review-menu[open] summary,
  .topbar-service-menu[open] summary,
  .addon-menu[open] summary {
    z-index: 110;
  }

  .communication-branch-gate,
  .sidebar-mode-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sidebar-mode-nav button {
    grid-template-columns: 1fr;
  }

  .pt-sidebar-mode-nav button {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .pt-sidebar-mode-nav .rehab-flow-step {
    grid-template-columns: 34px minmax(0, 1fr);
  }

  .pt-sidebar-mode-nav small {
    display: none;
  }

  .branch-intro-track article {
    min-height: 132px;
  }

  .articulation-mark-buttons {
    justify-self: start;
  }

  .articulation-mark-button-list {
    justify-content: flex-start;
  }

  .history-heading-row {
    display: grid;
  }

  .history-stats {
    width: 100%;
  }

  .usage-policy,
  .usage-consent {
    grid-template-columns: 1fr;
  }

  .generated-read-aloud h4,
  .generated-read-aloud p,
  .generated-read-aloud button {
    grid-column: 1;
    grid-row: auto;
  }

  .topbar-actions {
    justify-content: stretch;
    justify-items: stretch;
    min-width: 0;
  }

  .topbar-brand {
    grid-template-columns: 44px minmax(0, 1fr);
    align-items: center;
  }

  .rehab-home-link,
  .topbar-login-row {
    width: 100%;
  }

  .professional-menu,
  .topbar-service-menu {
    min-width: 0;
  }

  .professional-panel {
    margin-top: 0;
  }

  .upgrade-nudge {
    right: 12px;
    bottom: 12px;
    left: 12px;
    width: auto;
    padding: 14px;
  }

  .upgrade-nudge-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .lesson-card {
    min-height: auto;
  }
}

@media print {
  body {
    background: #fff;
  }

  .lesson-grid,
  .controls,
  .speech-check,
  .history,
  .line-panel,
  .secondary-action,
  .primary-action {
    display: none;
  }

  .workspace,
  .practice-area {
    display: block;
    border: 0;
    box-shadow: none;
  }

  .sidebar {
    border: 0;
  }
}

@media print {
  @page { margin: 14mm; }

  body.printing-share-summary {
    background: #fff !important;
  }

  body.printing-share-summary * {
    visibility: hidden !important;
  }

  body.printing-share-summary .st-share-summary-panel,
  body.printing-share-summary .st-share-summary-panel * {
    visibility: visible !important;
  }

  body.printing-share-summary .st-share-summary-panel {
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    max-width: 720px;
    margin: 0;
    padding: 28px;
    border: 1px solid #d6ebe7;
    border-radius: 20px;
    background: #fff !important;
    box-shadow: none;
  }

  body.printing-share-summary .st-share-summary-actions,
  body.printing-share-summary .st-share-summary-text,
  body.printing-share-summary .st-share-summary-panel > div:first-child p {
    display: none !important;
  }

  body.printing-share-summary .st-share-summary-print-card {
    break-inside: avoid;
    box-shadow: none;
  }

  body.printing-pt-head-neck-summary {
    background: #fff !important;
  }

  body.printing-pt-head-neck-summary > :not(#ptHeadNeckPrintOnly) {
    display: none !important;
  }

  body.printing-pt-head-neck-summary #ptHeadNeckPrintOnly,
  body.printing-pt-head-neck-summary #ptHeadNeckPrintOnly * {
    visibility: visible !important;
  }

  body.printing-pt-head-neck-summary #ptHeadNeckPrintOnly {
    display: block !important;
    width: 100%;
    max-width: 760px;
    margin: 0;
    padding: 28px;
    border: 1px solid #d6ebe7;
    border-radius: 20px;
    background: #fff !important;
    box-shadow: none;
  }

  body.printing-pt-head-neck-summary #ptHeadNeckPrintOnly .pt-head-neck-report-card {
    break-inside: avoid;
    box-shadow: none;
  }

  body.printing-swallow-summary {
    background: #fff !important;
  }

  body.printing-swallow-summary > :not(#swallowPrintOnly) {
    display: none !important;
  }

  body.printing-swallow-summary #swallowPrintOnly,
  body.printing-swallow-summary #swallowPrintOnly * {
    visibility: visible !important;
  }

  body.printing-swallow-summary #swallowPrintOnly {
    display: block !important;
    width: 100%;
    max-width: 760px;
    margin: 0;
    padding: 28px;
    border: 1px solid #d6ebe7;
    border-radius: 20px;
    background: #fff !important;
    box-shadow: none;
  }

  body.printing-swallow-summary #swallowPrintOnly .swallow-print-card {
    display: grid;
    gap: 14px;
    color: #102421;
    break-inside: avoid;
  }

  body.printing-swallow-summary #swallowPrintOnly h2,
  body.printing-swallow-summary #swallowPrintOnly h3,
  body.printing-swallow-summary #swallowPrintOnly p {
    margin: 0;
  }

  body.printing-swallow-summary #swallowPrintOnly header,
  body.printing-swallow-summary #swallowPrintOnly section {
    display: grid;
    gap: 6px;
  }

  body.printing-pt-report-summary {
    background: #fff !important;
  }

  body.printing-pt-report-summary * {
    visibility: hidden !important;
  }

  body.printing-pt-report-summary .pt-report-output-v2-share-panel,
  body.printing-pt-report-summary .pt-report-output-v2-share-panel * {
    visibility: visible !important;
  }

  body.printing-pt-report-summary .pt-report-output-v2-share-panel {
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    max-width: 720px;
    margin: 0;
    padding: 28px;
    border: 1px solid #d6ebe7;
    border-radius: 20px;
    background: #fff !important;
    box-shadow: none;
  }

  body.printing-pt-report-summary .st-share-summary-actions,
  body.printing-pt-report-summary .st-share-summary-text,
  body.printing-pt-report-summary .pt-report-output-v2-share-panel > div:first-child p {
    display: none !important;
  }

  body.printing-pt-report-summary .pt-report-output-v2-share-card {
    break-inside: avoid;
    box-shadow: none;
  }
}