:root {
  --bg: #05040b; --card: rgba(14, 10, 30, .72); --line: rgba(124, 92, 255, .25); --text: #e6e2f6;
  --muted: #8f88ad; --accent: #a855f7; --accent2: #c4b5fd; --cyan: #67e8f9; --yes: #10b981; --no: #e11d48;
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; height: 100%; background: var(--bg); color: var(--text); overflow: hidden;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; overscroll-behavior: none; }
body { display: flex; flex-direction: column; height: 100dvh;
  padding: env(safe-area-inset-top) 14px calc(env(safe-area-inset-bottom) + 10px); }
.bg-glow { position: fixed; inset: 0; pointer-events: none;
  background: radial-gradient(70% 45% at 50% 40%, rgba(88, 28, 199, .28), transparent 70%); }
header { display: flex; align-items: center; gap: 10px; padding-top: 12px; position: relative; z-index: 2; }
.brand { flex: 1; }
.brand b { display: block; letter-spacing: 8px; font-size: 21px; color: #fff; text-shadow: 0 0 14px rgba(168, 85, 247, .6); }
.brand small { letter-spacing: 3px; font-size: 9px; color: #7c6f9b; }
.icon-btn { background: none; border: 0; color: var(--muted); font-size: 26px; padding: 4px 6px; }
.pc { display: inline-flex; align-items: center; gap: 7px; font-size: 11px; color: var(--muted); white-space: nowrap;
  background: var(--card); border: 1px solid var(--line); border-radius: 20px; padding: 5px 10px; }
.pc .dot { width: 7px; height: 7px; border-radius: 50%; background: #f43f5e; }
.pc.online .dot { background: #22c55e; box-shadow: 0 0 8px #22c55e; }

main { flex: 1; position: relative; min-height: 0; z-index: 1; }
#holo { position: absolute; inset: -10px -14px 0; width: calc(100% + 28px); height: calc(100% + 10px); display: block;
  -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 45%, #000 60%, transparent 100%);
          mask-image: radial-gradient(ellipse 70% 60% at 50% 45%, #000 60%, transparent 100%); }
.state-chip { position: absolute; top: 8px; left: 0; display: flex; align-items: center; gap: 8px;
  background: rgba(14, 10, 30, .6); border: 1px solid var(--line); border-radius: 12px; padding: 7px 11px;
  font-size: 11px; letter-spacing: 3px; color: #f5f3ff; backdrop-filter: blur(8px); }
.wave { display: flex; gap: 2px; align-items: center; height: 12px; }
.wave b { width: 2px; height: 30%; background: var(--accent2); border-radius: 2px; animation: wave 1s ease-in-out infinite; }
.wave b:nth-child(2n) { animation-delay: .15s; } .wave b:nth-child(3n) { animation-delay: .3s; }
@keyframes wave { 50% { height: 100%; } }
.step { position: absolute; left: 0; right: 0; bottom: 4px; text-align: center; font-size: 13px; color: #fda4af;
  text-shadow: 0 0 8px rgba(253, 164, 175, .6); }
.exchange { position: absolute; left: 0; right: 0; bottom: 26px; text-align: center; padding: 0 6px;
  max-height: 32%; overflow-y: auto; }
.exchange p { margin: 0; }
.you { color: var(--cyan); font-size: 13px; margin-bottom: 6px !important; opacity: .9; }
.reply { color: #fff; font-size: 16px; line-height: 1.4; text-shadow: 0 0 12px rgba(168, 85, 247, .9); }
.hidden { display: none !important; }

.chips { display: flex; gap: 8px; overflow-x: auto; padding: 8px 2px 10px; scrollbar-width: none; position: relative; z-index: 2; }
.chips::-webkit-scrollbar { display: none; }
.chips button { flex: none; background: var(--card); border: 1px solid var(--line); color: #e9d5ff;
  border-radius: 18px; padding: 8px 13px; font-size: 13px; }
.chips button:active { border-color: var(--accent); }
footer { display: flex; flex-direction: column; gap: 10px; position: relative; z-index: 2; }
.entry { display: flex; gap: 8px; }
.entry input { flex: 1; min-width: 0; background: rgba(8, 6, 18, .85); border: 1px solid var(--line); border-radius: 24px;
  color: #fff; padding: 13px 16px; font-size: 16px; }
.entry input:focus { outline: none; border-color: var(--accent); }
.send { flex: none; background: rgba(26, 21, 48, .9); border: 1px solid var(--line); color: var(--accent2); border-radius: 50%;
  width: 48px; height: 48px; font-size: 18px; }
.talk { display: flex; align-items: center; justify-content: center; gap: 10px; height: 64px; border-radius: 32px;
  border: 1px solid rgba(196, 181, 253, .5); color: #fff; font-size: 16px; font-weight: 600;
  background: radial-gradient(circle at 50% 30%, #6d28d9, #2e1065 75%);
  box-shadow: 0 0 25px rgba(168, 85, 247, .45); user-select: none; -webkit-user-select: none;
  touch-action: none; transition: transform .1s; }
.talk.recording { background: radial-gradient(circle at 50% 30%, #0891b2, #083344 75%); transform: scale(.97);
  box-shadow: 0 0 30px rgba(103, 232, 249, .6); }
.talk:disabled { opacity: .45; }
.mic { font-size: 22px; }

.sheet { position: fixed; left: 12px; right: 12px; bottom: calc(env(safe-area-inset-bottom) + 12px);
  background: rgba(20, 12, 40, .96); border: 1px solid var(--accent); border-radius: 18px; padding: 16px;
  z-index: 10; box-shadow: 0 0 40px rgba(168, 85, 247, .4); }
.sheet p { margin: 0 0 12px; font-size: 16px; line-height: 1.4; text-align: center; }
.sheet .row { display: flex; gap: 10px; }
.sheet button { flex: 1; height: 50px; border-radius: 12px; border: 0; font-size: 16px; font-weight: 600;
  color: #fff; background: #1a1530; margin-top: 8px; width: 100%; }
.sheet .yes { background: var(--yes); } .sheet .no { background: var(--no); }
.sheet .ghost { background: none; color: var(--muted); }
.toggle { display: flex; align-items: center; gap: 10px; font-size: 15px; padding: 6px 0 4px; }
.toggle input { width: 20px; height: 20px; accent-color: var(--accent); }
.hint { font-size: 12px !important; color: var(--muted); margin: 6px 0 0 !important; }
.login { position: fixed; inset: 0; background: var(--bg); display: flex; flex-direction: column;
  align-items: center; justify-content: center; padding: 32px; text-align: center; z-index: 20; }
.login b:first-child { letter-spacing: 10px; font-size: 28px; margin-bottom: 16px; }
.login p { color: var(--muted); line-height: 1.5; }

/* nenhuma parte pode esticar a tela (os atalhos rolam por dentro) */
body > * { min-width: 0; max-width: 100%; }