body {
      background: #000;
      color: var(--parchment);
      font-family: 'Cormorant Garamond', serif;
      font-weight: 300;
      min-height: 100vh; min-height: 100dvh;
      display: flex; flex-direction: column;
      cursor: default;
    }
    body::before { opacity: 0.05; }
    .nav-logo { font-size: 0.65rem; letter-spacing: 0.35em; text-transform: uppercase; color: var(--mist); text-decoration: none; transition: color 0.3s ease; }
    .nav-logo:hover { color: var(--gold); }
    .speak-wrap { flex: 1; display: flex; flex-direction: column; max-width: 44rem; width: 100%; margin: 0 auto; padding: calc(5rem + env(safe-area-inset-top)) 5vw 2rem; }
    .speak-eyebrow { font-size: 0.58rem; letter-spacing: 0.55em; text-transform: uppercase; color: var(--gold); opacity: 0.85; margin-bottom: 0.8rem; text-align: center; }
    .speak-title { font-size: clamp(1.8rem,4vw,3rem); font-weight: 300; color: var(--cream); text-align: center; line-height: 1.2; margin-bottom: 0.6rem; }
    .speak-sub { font-size: 0.9rem; font-style: italic; color: var(--mist); text-align: center; opacity: 0.7; margin-bottom: 2.5rem; line-height: 1.7; }
    #chat-window { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 1.5rem; padding: 1.5rem 0; min-height: 280px; max-height: 52vh; border-top: 1px solid rgba(212,168,67,0.28); border-bottom: 1px solid rgba(212,168,67,0.28); margin-bottom: 1.5rem; scrollbar-width: thin; scrollbar-color: rgba(212,168,67,0.3) transparent; }
    #chat-window::-webkit-scrollbar { width: 3px; }
    #chat-window::-webkit-scrollbar-thumb { background: rgba(212,168,67,0.3); }
    .msg { display: flex; flex-direction: column; gap: 0.3rem; opacity: 0; animation: msg-appear 0.6s ease forwards; }
    @keyframes msg-appear { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
    .msg-label { font-size: 0.55rem; letter-spacing: 0.4em; text-transform: uppercase; }
    .msg.user .msg-label { color: rgba(212,168,67,0.7); text-align: right; }
    .msg.assistant .msg-label { color: rgba(168,159,140,0.55); }
    .msg-bubble { font-size: 1rem; font-style: italic; line-height: 1.8; padding: 1rem 1.4rem; }
    .msg.user .msg-bubble { background: rgba(212,168,67,0.06); border: 1px solid rgba(212,168,67,0.22); color: var(--parchment); align-self: flex-end; max-width: 85%; text-align: right; }
    .msg.assistant .msg-bubble { background: rgba(255,255,255,0.025); border: 1px solid rgba(168,159,140,0.18); color: var(--parchment); align-self: flex-start; max-width: 85%; }
    .typing-dots { display: flex; gap: 5px; align-items: center; height: 1.1rem; }
    .typing-dots span { width: 4px; height: 4px; background: #d4a843; border-radius: 50%; animation: dot-bounce 1.2s ease-in-out infinite; }
    .typing-dots span:nth-child(2) { animation-delay: 0.2s; }
    .typing-dots span:nth-child(3) { animation-delay: 0.4s; }
    @keyframes dot-bounce { 0%,60%,100%{transform:translateY(0);opacity:0.4} 30%{transform:translateY(-5px);opacity:1} }
    .speak-input-row { display: flex; gap: 0.8rem; align-items: flex-end; }
    #speak-input { flex: 1; background: rgba(255,255,255,0.03); border: 1px solid rgba(212,168,67,0.28); color: var(--parchment); font-family: 'Cormorant Garamond',serif; font-size: 1rem; font-style: italic; font-weight: 300; padding: 0.85rem 1.1rem; resize: none; outline: none; line-height: 1.6; min-height: 3rem; max-height: 8rem; overflow-y: auto; transition: border-color 0.4s ease, background 0.4s ease; border-radius: 0; -webkit-appearance: none; }
    #speak-input::placeholder { color: rgba(168,159,140,0.35); }
    #speak-input:focus { border-color: rgba(212,168,67,0.6); background: rgba(212,168,67,0.03); }
    #speak-send { flex-shrink: 0; width: 3rem; height: 3rem; background: none; border: 1px solid rgba(212,168,67,0.5); color: var(--gold); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background 0.4s ease, border-color 0.4s ease, color 0.4s ease; position: relative; overflow: hidden; }
    #speak-send::before { content: ''; position: absolute; inset: 0; background: var(--gold); transform: translateY(101%); transition: transform 0.4s ease; }
    #speak-send:hover { color: #000; }
    #speak-send:hover::before { transform: translateY(0); }
    #speak-send:disabled { opacity: 0.3; cursor: default; pointer-events: none; }
    .send-arrow { position: relative; z-index: 1; width: 0; height: 0; border-left: 6px solid currentColor; border-top: 5px solid transparent; border-bottom: 5px solid transparent; }
    .speak-hint { font-size: 0.58rem; letter-spacing: 0.25em; text-transform: uppercase; color: rgba(168,159,140,0.3); text-align: center; margin-top: 1rem; }
    #error-msg { display: none; font-size: 0.8rem; font-style: italic; color: rgba(212,168,67,0.7); text-align: center; padding: 1rem; border: 1px solid rgba(212,168,67,0.2); margin-top: 1rem; }
    .speak-footer { padding: 1.5rem 5vw; padding-bottom: calc(1.5rem + env(safe-area-inset-bottom)); }
    @media (max-width: 480px) { .speak-wrap { padding-top: calc(4.5rem + env(safe-area-inset-top)); } #chat-window { max-height: 44vh; } }