/* Crème 2.2 — Voice Kitchen: explicit microphone, beautiful command reference and tactile fallback. */
.voice-assistant {
  margin: 23px 0 0;
  padding: clamp(18px,2.8vw,27px);
  border-radius: 23px;
  border: 1px solid #d9c6b2;
  background:
    radial-gradient(circle at 100% 0%,rgba(244,220,201,.65),transparent 38%),
    linear-gradient(145deg,#f9f1e5,#fffaf3 65%);
  box-shadow:0 12px 25px rgba(80,50,32,.07),inset 0 1px 0 rgba(255,255,255,.8);
}
.voice-assistant .guided-eyebrow {margin-bottom:6px;}
.voice-head {display:flex;align-items:start;justify-content:space-between;gap:12px;}
.voice-head h3 {font:600 clamp(22px,2.9vw,28px)/1.16 var(--font-book); margin:0; color:#423126;}
.voice-caption {font-size:14px;line-height:1.55;color:#745f50;margin:12px 0 18px;max-width:55ch;}
.voice-live-dot {display:block;width:13px;height:13px;flex:none;border-radius:50%;background:#c6b4a0;margin-top:12px;border:2px solid #fff7ee;box-shadow:0 0 0 1px #c9b69f;}
.voice-live-dot.listening {background:#b74d42;box-shadow:0 0 0 4px rgba(183,77,66,.14);animation:voiceListening 1.5s ease-in-out infinite;}
.voice-main-controls {display:flex;flex-wrap:wrap;gap:9px;}
.voice-main-controls .btn {min-height:51px;border-radius:14px;justify-content:center;font-weight:700;}
.voice-mic-btn {flex:1 1 175px;}
.voice-read-btn {flex:1 1 146px;}
.voice-status {min-height:48px;display:flex;align-items:center;margin:12px 0 13px;padding:11px 14px;border:1px solid #e4d7c7;border-radius:13px;background:rgba(255,255,255,.7);font:600 13px/1.5 var(--font-ui);color:#665040;overflow-wrap:anywhere;}
.voice-pref-row {display:flex;align-items:center;flex-wrap:wrap;gap:12px;justify-content:space-between;}
.voice-handsfree {display:inline-flex;align-items:center;gap:8px;padding:8px 10px;background:#fffaf5;border:1px solid #d9c7b4;border-radius:12px;cursor:pointer;min-height:42px;font-size:13px;font-weight:750;color:#634a3e;}
.voice-handsfree[aria-pressed="true"] {background:#eaf0e5;border-color:#95a38b;color:#405538;}
.voice-handsfree small {font-size:11px;font-weight:500;color:#897366;}
.voice-toggle-mark {width:25px;height:15px;display:inline-flex;align-items:center;border-radius:999px;background:#d1c3b5;padding:2px;transition:background .2s;}
.voice-toggle-mark::after {content:'';display:block;width:11px;height:11px;border-radius:50%;background:white;box-shadow:0 1px 3px #0002;transition:transform .2s;}
.voice-handsfree[aria-pressed="true"] .voice-toggle-mark {background:#6b8661;}
.voice-handsfree[aria-pressed="true"] .voice-toggle-mark::after {transform:translateX(10px);}
.voice-rate {display:flex;gap:9px;align-items:center;font-size:12px;font-weight:650;color:#6d584c;}
.voice-rate select {min-height:42px;padding:8px 27px 8px 10px;background:#fffaf5;border:1px solid #d7c5b1;border-radius:10px;color:#4f3b2d;font:600 12px var(--font-ui);}
.voice-privacy {margin:9px 0 15px;font-size:11px;line-height:1.5;color:#8b7669;}
.voice-shortcuts {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;padding:12px 0 17px;}
.voice-shortcuts button {border:1px solid #ddcbb9;border-radius:11px;background:#fffcf8;min-height:43px;padding:8px 5px;color:#715143;font:700 12px/1.2 var(--font-ui);cursor:pointer;transition:background .15s,transform .15s;}
.voice-shortcuts button:hover {background:#f4e7d8;transform:translateY(-1px);}
.voice-assistant button:focus-visible,.voice-assistant select:focus-visible,.voice-help summary:focus-visible {outline:3px solid #b47455;outline-offset:3px;}
.voice-assistant button:disabled {opacity:.55;cursor:not-allowed;}
.voice-help {border-top:1px solid #deccb9;padding-top:13px;}
.voice-help summary {display:flex;align-items:center;gap:8px;list-style:none;cursor:pointer;font:750 14px/1.4 var(--font-ui);color:#62483d;padding:4px 0;}
.voice-help summary::-webkit-details-marker {display:none;}
.voice-help summary svg {width:19px;height:19px;}
.voice-help summary span {margin-left:auto;font:600 11px var(--font-ui);color:#937c6b;}
.voice-help[open] summary {padding-bottom:12px;}
.voice-commands {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.voice-command-group {padding:13px 14px;border-radius:13px;background:rgba(255,255,255,.74);border:1px solid #e7d8c8;}
.voice-command-group h4 {margin:0 0 10px;font:650 16px/1.25 var(--font-book);color:#4e382e;}
.voice-command-group p {display:flex;flex-wrap:wrap;gap:6px;margin:0;}
.voice-command-group code {display:inline-block;padding:7px 9px;border-radius:10px;border:1px solid #e5d8c9;background:#fffdf8;color:#6f5447;font:600 12px/1.4 var(--font-ui);white-space:normal;}
.voice-help-tip {margin:14px 2px 3px;font:13px/1.55 var(--font-ui);color:#7c6759;}
@keyframes voiceListening {0%,100%{box-shadow:0 0 0 4px rgba(183,77,66,.12);}50%{box-shadow:0 0 0 9px rgba(183,77,66,.05);}}
@media(max-width:640px) {
  .voice-assistant {padding:17px 15px;border-radius:19px;}
  .voice-shortcuts {grid-template-columns:repeat(2,minmax(0,1fr));}
  .voice-commands {grid-template-columns:1fr;}
  .voice-main-controls .btn {flex:1 1 100%;}
  .voice-pref-row {align-items:stretch;}
  .voice-handsfree {flex:1;justify-content:center;}
  .voice-rate {flex:1;justify-content:space-between;}
}
@media(prefers-reduced-motion:reduce){.voice-live-dot.listening{animation:none}.voice-shortcuts button:hover{transform:none}.voice-toggle-mark,.voice-toggle-mark::after{transition:none}}
@media print {.voice-assistant{display:none!important}}
.voice-heard {font:12px/1.45 var(--font-ui);color:#7d6657;margin:-5px 4px 12px;overflow-wrap:anywhere;}
.voice-heard span {font-weight:700;color:#6a4b3c;}
.voice-heard[hidden] {display:none;}
