:root {
  --voice-blue: #78afd3;
  --voice-blue-deep: #3f779d;
  --voice-blue-wash: rgba(120, 175, 211, .13);
  --voice-mint: #79bfa9;
  --voice-surface: color-mix(in srgb, var(--panel) 92%, transparent);
  --voice-card: color-mix(in srgb, var(--card) 88%, transparent);
  --voice-shadow: 0 16px 42px rgba(67, 72, 78, .09);
}

#voiceSheet { z-index: 56; }
#voiceSheet > .sheet { overflow: hidden; }
body:has(#voiceSheet.open) #pet, body:has(#voiceSheet.open) #petBubble { opacity: 0; pointer-events: none; }
.voice-settings-sheet { background: color-mix(in srgb, var(--bg) 94%, transparent) !important; }
.voice-settings-head { border-bottom: 1px solid color-mix(in srgb, var(--line) 58%, transparent); }
#voiceSheet .voice-settings-head .hbtn { width: 44px; height: 44px; }
.voice-settings-body {
  box-sizing: border-box;
  width: min(100%, 720px);
  margin: 0 auto;
  padding: 12px 18px calc(44px + env(safe-area-inset-bottom));
  overflow-x: hidden;
}

.voice-hero {
  position: relative;
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr);
  gap: 16px;
  padding: 22px 20px 18px;
  border: 1px solid color-mix(in srgb, var(--line) 64%, transparent);
  border-radius: 24px;
  overflow: hidden;
  background:
    radial-gradient(circle at 15% 28%, rgba(147,195,225,.25), transparent 32%),
    linear-gradient(145deg, color-mix(in srgb, var(--panel) 95%, transparent), color-mix(in srgb, var(--voice-blue-wash) 52%, var(--panel)));
  box-shadow: var(--voice-shadow);
}
.voice-hero::after { content: ''; position: absolute; right: -34px; bottom: -46px; width: 130px; height: 130px; border-radius: 50%; border: 1px solid rgba(120,175,211,.18); box-shadow: 0 0 0 15px rgba(120,175,211,.04), 0 0 0 30px rgba(120,175,211,.025); }
.voice-hero-mark { position: relative; display: grid; place-items: center; width: 62px; height: 62px; border-radius: 50%; background: rgba(255,255,255,.78); color: var(--voice-blue-deep); box-shadow: 0 9px 24px rgba(82,125,154,.13), inset 0 0 0 1px rgba(255,255,255,.82); }
.voice-hero-mark .ic { width: 26px; height: 26px; }
.voice-hero-mark > i { position: absolute; left: calc(50% - 1px); bottom: 8px; width: 2px; height: 5px; border-radius: 2px; background: var(--voice-blue); opacity: .45; }
.voice-hero-mark > i:nth-of-type(1) { transform: translateX(-11px); height: 3px; }
.voice-hero-mark > i:nth-of-type(3) { transform: translateX(11px); height: 3px; }
.voice-hero-copy { position: relative; z-index: 1; min-width: 0; }
.voice-eyebrow { margin: 1px 0 4px; color: var(--voice-blue-deep); font-size: 10px; font-weight: 700; letter-spacing: .22em; }
.voice-hero h1 { margin: 0; font-family: var(--serif); font-size: clamp(22px, 5.7vw, 30px); font-weight: 560; line-height: 1.22; letter-spacing: .02em; }
.voice-hero-copy > p:last-child { max-width: 33em; margin: 9px 0 0; color: var(--dim); font-size: 12.5px; line-height: 1.65; }
.voice-summary { position: relative; z-index: 1; grid-column: 1 / -1; display: grid; grid-template-columns: auto 1fr auto 1fr; align-items: baseline; gap: 4px 7px; padding-top: 15px; border-top: 1px solid color-mix(in srgb, var(--line) 60%, transparent); }
.voice-summary b { color: var(--voice-blue-deep); font-family: var(--serif); font-size: 20px; font-variant-numeric: tabular-nums; }
.voice-summary span { color: var(--dim); font-size: 11.5px; }

.voice-section { margin-top: 27px; }
.voice-section-title { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin: 0 2px 11px; }
.voice-section-title p { margin: 0 0 2px; color: var(--voice-blue-deep); font-size: 10px; font-weight: 650; letter-spacing: .14em; text-transform: uppercase; }
.voice-section-title h2 { margin: 0; font-size: 16px; font-weight: 680; letter-spacing: .03em; }
.voice-section-title > span { color: var(--dim); font-size: 11px; }
.voice-text-action { display: flex; align-items: center; min-height: 44px; margin: -10px -8px -10px 0; padding: 0 9px; border: 0; background: transparent; color: var(--voice-blue-deep); font: inherit; font-size: 12px; font-weight: 650; cursor: pointer; }
.voice-text-action[hidden] { display: none; }
.voice-range[hidden] { display: none; }
.voice-text-action .ic { width: 15px; height: 15px; margin-right: 4px; }

.voice-provider-grid { display: grid; gap: 10px; }
.voice-provider-card {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 78px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--line) 72%, transparent);
  border-radius: 19px;
  background: var(--voice-card);
  color: var(--text);
  box-shadow: 0 9px 28px rgba(60,58,54,.055);
  text-align: left;
  cursor: pointer;
  touch-action: manipulation;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.voice-provider-card:hover { border-color: color-mix(in srgb, var(--voice-blue) 48%, var(--line)); box-shadow: 0 12px 32px rgba(66,92,110,.085); }
.voice-provider-card:active { background: color-mix(in srgb, var(--voice-blue-wash) 54%, var(--card)); }
.voice-provider-card:focus-visible, .voice-text-action:focus-visible, .voice-empty button:focus-visible, .voice-editor button:focus-visible, .voice-editor input:focus-visible, .voice-editor select:focus-visible, .voice-editor textarea:focus-visible, .voice-default-card button:focus-visible { outline: 2px solid var(--voice-blue-deep); outline-offset: 2px; }
.voice-provider-logo { display: grid; place-items: center; width: 46px; height: 46px; flex: none; border-radius: 15px; font-size: 13px; font-weight: 760; letter-spacing: -.03em; }
.voice-provider-logo-eleven { background: #262624; color: #fff; }
.voice-provider-logo-minimax { background: linear-gradient(145deg, #b8d8eb, #78afd3); color: #173b54; }
.voice-provider-logo-moss { background: linear-gradient(145deg, #dce8d8, #9bbf9a); color: #264a31; }
.voice-provider-copy { display: flex; min-width: 0; flex-direction: column; }
.voice-provider-copy b { font-size: 14px; font-weight: 680; }
.voice-provider-copy small { margin-top: 3px; overflow: hidden; color: var(--dim); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.voice-provider-copy em { width: fit-content; margin-top: 7px; padding: 3px 7px; border-radius: 999px; background: color-mix(in srgb, var(--line) 52%, transparent); color: var(--dim); font-size: 10px; font-style: normal; }
.voice-provider-copy em.connected { background: rgba(121,191,169,.13); color: color-mix(in srgb, var(--text) 72%, #2f8b70); }
.voice-provider-action { color: var(--voice-blue-deep); font-size: 11px; white-space: nowrap; }

.voice-empty { padding: 27px 18px 24px; border: 1px dashed color-mix(in srgb, var(--voice-blue) 42%, var(--line)); border-radius: 20px; background: color-mix(in srgb, var(--voice-blue-wash) 26%, var(--panel)); text-align: center; }
.voice-empty-wave { display: inline-flex; align-items: center; justify-content: center; gap: 4px; height: 24px; margin-bottom: 9px; }
.voice-empty-wave i { width: 3px; height: 8px; border-radius: 3px; background: var(--voice-blue); opacity: .68; }
.voice-empty-wave i:nth-child(2), .voice-empty-wave i:nth-child(4) { height: 16px; }
.voice-empty-wave i:nth-child(3) { height: 23px; }
.voice-empty b { display: block; font-size: 13.5px; }
.voice-empty p { margin: 6px 0 14px; color: var(--dim); font-size: 11.5px; line-height: 1.55; }
.voice-empty button { min-height: 44px; padding: 0 17px; border: 1px solid color-mix(in srgb, var(--voice-blue) 48%, var(--line)); border-radius: 999px; background: color-mix(in srgb, var(--panel) 92%, transparent); color: var(--voice-blue-deep); font: inherit; font-size: 12px; font-weight: 650; cursor: pointer; }
.voice-preset-list { display: grid; gap: 10px; }
.voice-preset-card { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 11px; padding: 14px; border: 1px solid color-mix(in srgb, var(--voice-blue) 30%, var(--line)); border-radius: 19px; background: var(--voice-card); box-shadow: 0 9px 28px rgba(60,58,54,.055); }
.voice-preset-card.managing { grid-template-columns: 44px 44px minmax(0, 1fr); cursor: pointer; }
.voice-preset-select { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.voice-preset-select span { display: grid; place-items: center; width: 22px; height: 22px; border: 1.5px solid color-mix(in srgb, var(--voice-blue) 48%, var(--line)); border-radius: 7px; color: transparent; font-size: 13px; font-weight: 800; }
.voice-preset-select.selected span { border-color: var(--voice-blue-deep); background: var(--voice-blue-deep); color: #fff; }
.voice-preset-wave { display: flex; align-items: center; justify-content: center; gap: 3px; width: 44px; height: 44px; border-radius: 50%; background: var(--voice-blue-wash); }
.voice-preset-wave i { width: 2px; height: 10px; border-radius: 2px; background: var(--voice-blue-deep); }
.voice-preset-wave i:nth-child(2), .voice-preset-wave i:nth-child(4) { height: 18px; }
.voice-preset-copy { min-width: 0; }
.voice-preset-copy b { display: block; overflow: hidden; font-size: 13.5px; text-overflow: ellipsis; white-space: nowrap; }
.voice-preset-copy small { display: block; margin-top: 4px; overflow: hidden; color: var(--dim); font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }
.voice-preset-use { display: flex; gap: 4px; margin-top: 7px; }
.voice-preset-use span { padding: 3px 6px; border-radius: 999px; background: var(--voice-blue-wash); color: var(--voice-blue-deep); font-size: 9.5px; }
.voice-preset-edit { min-width: 44px; min-height: 44px; border: 0; background: transparent; color: var(--voice-blue-deep); font: inherit; font-size: 12px; cursor: pointer; }
.voice-section-actions { display: flex; align-items: center; gap: 2px; }
.voice-preset-bulk { position: sticky; bottom: 10px; z-index: 2; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; margin-top: 10px; padding: 8px 10px; border: 1px solid color-mix(in srgb, var(--line) 72%, transparent); border-radius: 16px; background: color-mix(in srgb, var(--panel) 92%, transparent); box-shadow: 0 12px 30px rgba(38,46,50,.12); backdrop-filter: blur(14px); }
.voice-preset-bulk[hidden] { display: none; }
.voice-preset-bulk span { color: var(--dim); font-size: 11px; text-align: center; }
.voice-preset-bulk button { min-width: 58px; min-height: 44px; border: 0; border-radius: 12px; background: transparent; color: var(--voice-blue-deep); font: inherit; font-size: 12px; cursor: pointer; }
.voice-preset-bulk button:last-child { color: #b64a43; }
.voice-preset-bulk button:disabled { opacity: .38; cursor: default; }
.voice-danger-button { width: 100%; min-height: 48px; margin-top: 18px; border: 1px solid rgba(182,74,67,.28); border-radius: 14px; background: rgba(182,74,67,.055); color: #a4433d; font: inherit; font-size: 13px; cursor: pointer; }

.voice-default-card { overflow: hidden; border: 1px solid color-mix(in srgb, var(--line) 72%, transparent); border-radius: 19px; background: var(--voice-card); box-shadow: 0 9px 28px rgba(60,58,54,.05); }
.voice-default-card button { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto 10px; align-items: center; gap: 10px; width: 100%; min-height: 70px; padding: 11px 14px; border: 0; background: transparent; color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.voice-default-card button + button { border-top: 1px solid color-mix(in srgb, var(--line) 62%, transparent); }
.voice-default-card button:disabled { cursor: default; opacity: .58; }
.voice-default-card button > .ic { display: grid; place-items: center; width: 36px; height: 36px; padding: 8px; box-sizing: border-box; border-radius: 12px; background: var(--voice-blue-wash); color: var(--voice-blue-deep); }
.voice-default-card button b, .voice-default-card button small { display: block; }
.voice-default-card button b { font-size: 12.5px; }
.voice-default-card button small { margin-top: 3px; color: var(--dim); font-size: 10.5px; }
.voice-default-card button em { color: var(--dim); font-size: 10.5px; font-style: normal; white-space: nowrap; }
.voice-default-card.voice-display-card button { grid-template-columns: 36px minmax(0,1fr) auto 38px; }
.voice-setting-switch { position: relative; width: 38px; height: 22px; border: 1px solid color-mix(in srgb,var(--dim) 38%,transparent); border-radius: 999px; background: color-mix(in srgb,var(--line) 66%,transparent); transition: background .18s ease,border-color .18s ease; }
.voice-setting-switch i { position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: var(--panel); box-shadow: 0 1px 4px rgba(40,50,56,.22); transition: transform .18s ease; }
.voice-display-card button.enabled .voice-setting-switch { border-color: color-mix(in srgb,var(--voice-blue-deep) 60%,transparent); background: var(--voice-blue-deep); }
.voice-display-card button.enabled .voice-setting-switch i { transform: translateX(16px); }
.voice-display-card button:active { background: color-mix(in srgb,var(--voice-blue-wash) 45%,transparent); }
.voice-coming { padding: 4px 8px; border-radius: 999px; background: color-mix(in srgb, var(--line) 52%, transparent); }
.voice-note-card { display: flex; gap: 12px; padding: 16px; border: 1px solid color-mix(in srgb, var(--line) 64%, transparent); border-radius: 18px; background: color-mix(in srgb, var(--panel) 78%, transparent); }
.voice-note-card > .ic { width: 20px; height: 20px; flex: none; color: var(--voice-blue-deep); }
.voice-note-card b { display: block; font-size: 12.5px; }
.voice-note-card p { margin: 5px 0 0; color: var(--dim); font-size: 11px; line-height: 1.6; }
.voice-asr-card { width: 100%; align-items: center; color: inherit; text-align: left; font: inherit; cursor: pointer; }
.voice-asr-card > div { min-width: 0; flex: 1; }
.voice-asr-card > span:last-child { color: var(--dim); font-size: 20px; }
.voice-asr-card:focus-visible { outline: 2px solid var(--voice-blue-deep); outline-offset: 2px; }

.voice-editor { position: absolute; inset: 0; z-index: 6; display: none; align-items: flex-end; justify-content: center; }
.voice-editor.open { display: flex; }
.voice-editor-shade { position: absolute; inset: 0; width: 100%; border: 0; background: rgba(30,30,29,.24); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); cursor: default; }
.voice-editor-card { position: relative; display: flex; flex-direction: column; width: min(100%, 640px); max-height: min(88dvh, 820px); border: 1px solid color-mix(in srgb, var(--line) 70%, rgba(255,255,255,.7)); border-radius: 26px 26px 0 0; overflow: hidden; background: color-mix(in srgb, var(--bg) 97%, transparent); box-shadow: 0 -18px 60px rgba(40,42,44,.14); }
.voice-editor-grabber { width: 40px; height: 4px; margin: 9px auto 2px; border-radius: 99px; background: color-mix(in srgb, var(--dim) 38%, transparent); }
.voice-editor-header { display: grid; grid-template-columns: 64px 1fr 64px; align-items: center; min-height: 54px; padding: 0 8px; border-bottom: 1px solid color-mix(in srgb, var(--line) 62%, transparent); }
.voice-editor-header h2 { margin: 0; font-size: 15px; font-weight: 680; text-align: center; }
.voice-editor-header button { min-height: 44px; border: 0; background: transparent; color: var(--dim); font: inherit; font-size: 12.5px; cursor: pointer; }
.voice-editor-header button:last-child { color: var(--voice-blue-deep); font-weight: 680; }
.voice-editor-header button[hidden] { visibility: hidden; pointer-events: none; }
.voice-editor-header button:disabled { opacity: .5; cursor: default; }
.voice-editor-content { padding: 18px 18px calc(26px + env(safe-area-inset-bottom)); overflow-y: auto; overscroll-behavior: contain; }
.voice-editor-content form { display: grid; gap: 17px; }
.voice-editor-content form[hidden] { display: none !important; }
.voice-provider-heading { display: flex; align-items: center; gap: 12px; padding-bottom: 3px; }
.voice-provider-heading b, .voice-provider-heading small { display: block; }
.voice-provider-heading b { font-size: 16px; }
.voice-provider-heading small { margin-top: 3px; color: var(--dim); font-size: 11px; }
.voice-field { display: grid; gap: 7px; color: var(--text); font-size: 12px; }
.voice-field[hidden] { display: none !important; }
.voice-field > span:first-child, .voice-purpose legend, .voice-range > span:first-child { font-weight: 650; }
.voice-field em { margin-left: 3px; color: var(--voice-blue-deep); font-size: 9px; font-style: normal; }
.voice-field input, .voice-field select, .voice-field textarea { box-sizing: border-box; width: 100%; min-height: 48px; padding: 11px 13px; border: 1px solid color-mix(in srgb, var(--line) 85%, transparent); border-radius: 14px; outline: 0; background: color-mix(in srgb, var(--panel) 94%, transparent); color: var(--text); font: inherit; font-size: 16px; line-height: 1.45; }
.voice-field textarea { min-height: 76px; resize: vertical; }
.voice-field input:focus, .voice-field select:focus, .voice-field textarea:focus { border-color: var(--voice-blue); box-shadow: 0 0 0 3px var(--voice-blue-wash); }
.voice-field > small { color: var(--dim); font-size: 10.5px; line-height: 1.5; }
.voice-secret-input { position: relative; display: block; }
.voice-secret-input input { padding-right: 52px; }
.voice-secret-input button { position: absolute; top: 2px; right: 2px; display: grid; place-items: center; width: 44px; height: 44px; border: 0; background: transparent; color: var(--dim); cursor: pointer; }
.voice-secret-input .ic { width: 18px; height: 18px; }
.voice-field-error { display: none; color: #a44747; font-size: 10.5px; font-style: normal; }
.voice-field.has-error input { border-color: #b65e5e; }
.voice-field.has-error .voice-field-error { display: block; }
.voice-security-note { display: flex; gap: 10px; padding: 13px; border-radius: 15px; background: rgba(121,191,169,.11); color: color-mix(in srgb, var(--text) 80%, #26725d); }
.voice-security-note .ic { width: 18px; height: 18px; flex: none; }
.voice-security-note b, .voice-security-note small { display: block; }
.voice-security-note b { font-size: 11.5px; }
.voice-security-note small { margin-top: 3px; font-size: 10.5px; line-height: 1.55; }
.voice-default-heading b, .voice-default-heading small { display: block; }
.voice-default-heading b { font-size: 14px; }
.voice-default-heading small { margin-top: 5px; color: var(--dim); font-size: 11px; }
.voice-default-options { display: grid; gap: 9px; }
.voice-default-option { display: grid; grid-template-columns: 44px minmax(0, 1fr) 22px; align-items: center; gap: 11px; width: 100%; min-height: 70px; padding: 12px; border: 1px solid color-mix(in srgb, var(--line) 78%, transparent); border-radius: 18px; background: var(--voice-card); color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.voice-default-option > span:nth-child(2) { min-width: 0; }
.voice-default-option b, .voice-default-option small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.voice-default-option b { font-size: 13px; }
.voice-default-option small { margin-top: 4px; color: var(--dim); font-size: 10.5px; }
.voice-default-option > i { width: 18px; height: 18px; border: 1.5px solid color-mix(in srgb, var(--dim) 55%, transparent); border-radius: 50%; }
.voice-default-option.selected { border-color: color-mix(in srgb, var(--voice-blue) 62%, var(--line)); background: color-mix(in srgb, var(--voice-blue-wash) 42%, var(--voice-card)); }
.voice-default-option.selected > i { border: 5px solid var(--voice-blue-deep); }
.voice-default-option:disabled { cursor: wait; opacity: .62; }
.voice-default-option:focus-visible { outline: 2px solid var(--voice-blue-deep); outline-offset: 2px; }
.voice-purpose { display: flex; gap: 8px; margin: 0; padding: 0; border: 0; }
.voice-purpose legend { margin-bottom: 8px; font-size: 12px; }
.voice-purpose label { position: relative; flex: 1; }
.voice-purpose input { position: absolute; opacity: 0; pointer-events: none; }
.voice-purpose span { display: grid; place-items: center; min-height: 44px; padding: 0 10px; border: 1px solid var(--line); border-radius: 13px; color: var(--dim); font-size: 11.5px; cursor: pointer; }
.voice-purpose input:checked + span { border-color: rgba(120,175,211,.55); background: var(--voice-blue-wash); color: var(--voice-blue-deep); font-weight: 650; }
.voice-range { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }
.voice-range > span { grid-column: 1 / -1; display: flex; justify-content: space-between; font-size: 12px; }
.voice-range output { color: var(--voice-blue-deep); font-variant-numeric: tabular-nums; }
.voice-range input { grid-column: 1 / -1; width: 100%; accent-color: var(--voice-blue-deep); }
.voice-range small { color: var(--dim); font-size: 9.5px; text-align: center; }
.voice-range small:first-of-type { text-align: left; }.voice-range small:last-child { text-align: right; }
.voice-advanced { border: 1px solid color-mix(in srgb, var(--line) 76%, transparent); border-radius: 15px; overflow: hidden; }
.voice-advanced summary { display: flex; align-items: center; justify-content: space-between; min-height: 46px; padding: 0 13px; list-style: none; font-size: 11.5px; font-weight: 650; cursor: pointer; }
.voice-advanced summary::-webkit-details-marker { display: none; }
.voice-advanced[open] summary span { transform: rotate(180deg); }
#voiceAdvancedFields { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px; padding: 2px 13px 14px; }
#voiceAdvancedFields .voice-field span { font-size: 10.5px; }
#voiceAdvancedFields .voice-field input, #voiceAdvancedFields .voice-field select { min-height: 44px; font-size: 14px; }
.voice-test-button { display: flex; align-items: center; gap: 11px; min-height: 56px; padding: 8px 12px; border: 1px solid color-mix(in srgb, var(--voice-blue) 42%, var(--line)); border-radius: 16px; background: var(--voice-blue-wash); color: var(--voice-blue-deep); font: inherit; text-align: left; cursor: pointer; }
.voice-test-button .ic { display: grid; place-items: center; width: 38px; height: 38px; padding: 9px; box-sizing: border-box; border-radius: 50%; background: color-mix(in srgb, var(--panel) 86%, transparent); }
.voice-test-button b, .voice-test-button small { display: block; }.voice-test-button b { font-size: 12px; }.voice-test-button small { margin-top: 2px; color: var(--dim); font-size: 10px; }
.voice-test-button:disabled { cursor: wait; opacity: .68; }
.voice-test-button.is-playing .ic { animation: voicePreviewPulse 1.1s ease-in-out infinite alternate; }
@keyframes voicePreviewPulse { to { box-shadow: 0 0 0 7px color-mix(in srgb, var(--voice-blue) 15%, transparent); } }
.voice-help-modal { position: absolute; inset: 0; z-index: 14; display: none; place-items: center; padding: 24px; box-sizing: border-box; }
.voice-help-modal.open { display: grid; }
.voice-help-shade { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: rgba(41,47,50,.28); backdrop-filter: blur(4px); cursor: default; }
.voice-help-card { position: relative; width: min(100%, 410px); padding: 24px 24px 20px; box-sizing: border-box; border: 1px solid color-mix(in srgb, var(--line) 74%, transparent); border-radius: 24px; background: color-mix(in srgb, var(--panel) 97%, white); box-shadow: 0 24px 70px rgba(35,45,50,.2); color: var(--text); animation: voiceHelpIn .18s ease both; }
.voice-help-card h2 { margin: 0 0 20px; font-size: 21px; line-height: 1.25; letter-spacing: -.02em; }
.voice-help-list { display: grid; gap: 17px; }
.voice-help-list > div { display: grid; grid-template-columns: 10px 70px minmax(0,1fr); align-items: start; gap: 10px; font-size: 12px; line-height: 1.55; }
.voice-help-list i { width: 9px; height: 9px; margin-top: 5px; border-radius: 50%; background: var(--voice-blue); box-shadow: 0 0 0 4px var(--voice-blue-wash); }
.voice-help-list i.preset { background: #79bfa9; box-shadow: 0 0 0 4px rgba(121,191,169,.12); }
.voice-help-list i.default { background: #d49b35; box-shadow: 0 0 0 4px rgba(212,155,53,.12); }
.voice-help-list b { font-size: 12.5px; }
.voice-help-list span { color: var(--dim); }
.voice-help-card > p { margin: 22px 0 16px; padding-top: 17px; border-top: 1px solid color-mix(in srgb, var(--line) 78%, transparent); color: var(--dim); font-size: 11.5px; line-height: 1.65; }
.voice-help-close { width: 100%; min-height: 48px; border: 1px solid color-mix(in srgb, var(--voice-blue) 38%, var(--line)); border-radius: 13px; background: transparent; color: var(--voice-blue-deep); font: inherit; font-size: 14px; font-weight: 650; cursor: pointer; }
.voice-help-close:focus-visible { outline: 3px solid var(--voice-blue-wash); outline-offset: 2px; }
@keyframes voiceHelpIn { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
.voice-toast { position: absolute; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom)); z-index: 12; display: none; width: max-content; max-width: calc(100% - 40px); padding: 10px 14px; border: 1px solid color-mix(in srgb, var(--line) 70%, transparent); border-radius: 999px; background: color-mix(in srgb, var(--text) 90%, transparent); color: var(--bg); box-shadow: 0 12px 34px rgba(0,0,0,.16); font-size: 11.5px; transform: translateX(-50%); }
.voice-toast.show { display: block; animation: voiceToastIn .18s ease both; }
@keyframes voiceToastIn { from { opacity: 0; transform: translate(-50%, 6px); } to { opacity: 1; transform: translate(-50%, 0); } }

@media (min-width: 700px) {
  .voice-settings-sheet { width: min(760px, calc(100vw - 48px)) !important; height: min(900px, calc(100dvh - 48px)) !important; border-radius: 28px !important; }
  .voice-provider-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .voice-editor { align-items: center; }
  .voice-editor-card { border-radius: 26px; }
}
@media (max-width: 374px) {
  .voice-settings-body { padding-left: 13px; padding-right: 13px; }
  .voice-hero { grid-template-columns: 52px minmax(0,1fr); gap: 12px; padding: 18px 15px 16px; }
  .voice-hero-mark { width: 52px; height: 52px; }
  .voice-provider-card { grid-template-columns: 42px minmax(0,1fr); padding: 12px; }
  .voice-provider-logo { width: 42px; height: 42px; }
  .voice-provider-action { grid-column: 2; justify-self: start; margin-top: -4px; }
  .voice-default-card button { grid-template-columns: 34px minmax(0,1fr) 8px; }
  .voice-default-card button em { display: none; }
}
@media (orientation: landscape) and (max-height: 520px) {
  .voice-settings-body { padding-bottom: 24px; }
  .voice-hero { grid-template-columns: 50px minmax(0,1fr) 150px; padding: 14px 16px; }
  .voice-hero-mark { width: 50px; height: 50px; }.voice-summary { grid-column: 3; grid-row: 1; align-self: center; padding: 0; border: 0; }
  .voice-editor-card { max-height: 96dvh; }
}
@media (prefers-reduced-motion: reduce) {
  .voice-provider-card, .voice-help-card, .voice-toast, .voice-setting-switch, .voice-setting-switch i { transition: none !important; animation: none !important; }
}

[data-theme="dark"] .voice-hero-mark, [data-theme="dark"] .voice-test-button .ic { background: rgba(46,49,50,.9); }
[data-theme="dark"] .voice-editor-shade, [data-theme="dark"] .voice-help-shade { background: rgba(0,0,0,.5); }
