/* THE DESK — shared modal, chat, and presence indicator.
   Verbatim across Florida, Buyers, and the Listing Partnership. Page-specific copy,
   schema fields, and endpoints are supplied by each page's own inline script/config, not here.

   Stage 2 rebuild: retired the mode picker, the "get comfortable" palette/voice step, and
   the standalone language screen (design-direction.md: "drop the option-chooser entirely").
   The desk opens straight into step-chat. */

/* MODAL */
.modal-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.72);z-index:9999;overflow-y:auto;padding:1.25rem}
.modal-overlay.open{display:block}
.modal-box{background:var(--surface);max-width:720px;margin:36px auto;border-radius:16px;padding:2.25rem;position:relative;border:1px solid rgba(233,240,86,.15);animation:modalIn .3s cubic-bezier(.22,.8,.35,1)}
@keyframes modalIn{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
.modal-close{position:absolute;top:1rem;right:1.25rem;background:none;border:none;color:var(--muted);font-size:1.5rem;cursor:pointer;line-height:1;transition:color .2s;z-index:2}
.modal-close:hover{color:var(--text)}
.modal-title{font-family:var(--serif);font-size:1.6rem;color:var(--accent);margin-bottom:.4rem}
.modal-subtitle{font-size:.82rem;color:var(--muted);margin-bottom:1.6rem;line-height:1.6}

/* FULL-SCREEN TAKEOVER */
.modal-overlay.stage-full{padding:0}
.stage-full .modal-box{max-width:100%;width:100%;min-height:100vh;margin:0;border-radius:0;padding:2rem clamp(1.25rem,6vw,7rem) 3rem;border:none;animation:none}
.stage-full .modal-close{display:none}
.stage-back{display:none;align-items:center;gap:.5rem;background:none;border:none;color:var(--muted);font-size:.78rem;font-family:var(--sans);cursor:pointer;margin-bottom:1.5rem;transition:color .2s}
.stage-back:hover{color:var(--accent)}
.stage-full .chat-wrap{max-width:640px;margin:0 auto}
.stage-full .chat-pane{height:min(52vh,460px)}

.rtl #chatpane{direction:rtl}
.rtl .msg.ai{align-self:flex-end;border-bottom-left-radius:12px;border-bottom-right-radius:3px}
.rtl .msg.me{align-self:flex-start;border-bottom-right-radius:12px;border-bottom-left-radius:3px}

/* CHAT */
.chat-wrap{display:none}
.progress-rail{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:1rem}
.p-step{font-size:.6rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:.22rem .6rem;border-radius:60px;border:1px solid var(--border);color:var(--muted);transition:all .3s}
.p-step.done{background:rgba(233,240,86,.12);border-color:rgba(233,240,86,.3);color:var(--accent)}
.p-step.now{border-color:var(--accent);color:var(--accent);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.chat-pane{background:var(--caviar);border:1px solid var(--border);border-radius:12px;height:380px;overflow-y:auto;padding:1.25rem;display:flex;flex-direction:column;gap:.9rem;scroll-behavior:smooth}
.msg{max-width:85%;padding:.7rem 1rem;border-radius:12px;font-size:.88rem;line-height:1.65;animation:msgIn .3s cubic-bezier(.22,.8,.35,1)}
@keyframes msgIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.msg.ai{background:var(--surface);border:1px solid rgba(233,240,86,.22);align-self:flex-start;border-bottom-left-radius:3px}
.msg.me{background:rgba(233,240,86,.14);align-self:flex-end;border-bottom-right-radius:3px}
.msg .who{display:block;font-size:.58rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:.3rem}
.typing{display:inline-flex;gap:4px;padding:.85rem 1rem;background:var(--surface);border:1px solid rgba(233,240,86,.22);border-radius:12px;border-bottom-left-radius:3px;align-self:flex-start}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:tp 1.2s infinite}
.typing i:nth-child(2){animation-delay:.15s}
.typing i:nth-child(3){animation-delay:.3s}
@keyframes tp{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}
.ui-block{align-self:flex-start;display:flex;flex-wrap:wrap;gap:.45rem;max-width:92%;animation:msgIn .35s .1s both cubic-bezier(.22,.8,.35,1)}
.ui-chip{background:var(--caviar);border:1.5px solid rgba(233,240,86,.4);color:var(--text);font-size:.8rem;font-weight:600;padding:.45rem .95rem;border-radius:60px;cursor:pointer;font-family:var(--sans);transition:all .2s}
.ui-chip:hover,.ui-chip.on{background:var(--accent);color:var(--caviar);border-color:var(--accent)}
.ui-done{background:var(--accent);color:var(--caviar);border:none;font-size:.8rem;font-weight:700;padding:.45rem 1.1rem;border-radius:60px;cursor:pointer;font-family:var(--sans)}

.composer{display:flex;gap:.6rem;margin-top:1rem;align-items:flex-end}
.composer textarea{flex:1;resize:none;padding:.7rem .9rem;background:var(--caviar);border:1px solid rgba(233,240,86,.18);border-radius:10px;color:var(--text);font-size:.9rem;font-family:var(--sans);min-height:46px;max-height:120px;transition:border-color .2s}
.composer textarea:focus{outline:none;border-color:rgba(233,240,86,.5)}
.icon-btn{width:46px;height:46px;flex-shrink:0;border-radius:10px;background:var(--caviar);border:1px solid rgba(233,240,86,.25);color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
.icon-btn:hover{border-color:var(--accent);color:var(--accent)}
.icon-btn.rec{background:var(--accent);color:var(--caviar);border-color:var(--accent);animation:pulse 1.4s infinite}
.icon-btn.send{background:var(--accent);color:var(--caviar);border-color:var(--accent)}
.icon-btn.send:hover{background:#d4f060;color:var(--caviar)}
.chat-foot{display:flex;justify-content:space-between;align-items:center;margin-top:.8rem;gap:1rem;flex-wrap:wrap}
.voice-toggle{display:flex;align-items:center;gap:.45rem;font-size:.72rem;color:var(--muted);cursor:pointer;user-select:none}
.voice-toggle input{accent-color:var(--accent)}
.interim{font-size:.75rem;color:var(--accent);min-height:1.1em;margin-top:.4rem;font-style:italic}
.chat-switch{font-size:.72rem;color:var(--muted);background:none;border:none;text-decoration:underline;cursor:pointer;font-family:var(--sans)}
.chat-switch:hover{color:var(--accent)}

/* ===== Desk presence indicator — a small pixel grid, not an orb.
   Reference: the Gemini/Antigravity understated live-motion glyph (design-direction.md).
   Nine pixels arranged in a cross; at rest they sit dim and still. Listening scans them in
   sequence, speaking pulses the center. Pure CSS, no extra markup, on the existing
   #chatorb.orb-wrap > .orb element pair. ===== */
.orb-wrap{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.orb-mini{--px:3px;--gap:6px}
.orb-large{--px:8px;--gap:15px}
.orb{position:relative;width:0;height:0}
.orb::before{
  content:'';position:absolute;width:var(--px);height:var(--px);border-radius:1px;background:var(--muted);opacity:.55;
  box-shadow:
    calc(var(--gap) * -1) calc(var(--gap) * -1) 0 var(--muted),
    0 calc(var(--gap) * -1) 0 var(--muted),
    var(--gap) calc(var(--gap) * -1) 0 var(--muted),
    calc(var(--gap) * -1) 0 0 var(--muted),
    var(--gap) 0 0 var(--muted),
    calc(var(--gap) * -1) var(--gap) 0 var(--muted),
    0 var(--gap) 0 var(--muted),
    var(--gap) var(--gap) 0 var(--muted);
  transition:opacity .6s ease,background .6s ease;
}
.orb-wrap .ring{display:none}
.orb-aura-1,.orb-aura-2,.orb-aura-3{display:none}

.orb-wrap.listening .orb::before{background:var(--accent);opacity:.85}
.orb-wrap.speaking .orb::before{background:var(--accent);opacity:.9}
@media (prefers-reduced-motion: no-preference){
  .orb-wrap.listening .orb{animation:pixelScan 1.8s steps(9) infinite}
  .orb-wrap.speaking .orb{animation:pixelPulse 1.1s ease-in-out infinite}
}
@keyframes pixelScan{
  0%,100%{filter:brightness(1)}
  50%{filter:brightness(1.6)}
}
@keyframes pixelPulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.18)}
}

@media(max-width:900px){
  .modal-box{padding:1.5rem}
}