/* AI Campaigner — the conversation-to-campaign flow.
   Everything here is built on the CRM's own tokens, so it inherits the theme rather
   than restating it. Motion is short and purposeful: it marks progress through the
   pipeline, and it steps aside for anyone who asks for reduced motion. */

.ca-shell{display:grid;grid-template-columns:1fr;gap:18px}
.ca-main{min-width:0}
.ca-studio-tabs{display:flex;gap:6px;margin-bottom:20px;padding:5px;border:1px solid var(--line);border-radius:13px;width:fit-content;background:var(--card)}
.ca-studio-tabs button,.ca-network-tabs button{display:flex;align-items:center;gap:8px;border:0;border-radius:9px;padding:11px 18px;background:transparent;color:var(--muted);font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.ca-studio-tabs button.selected{background:#091d42;color:white;box-shadow:0 3px 8px #091d4220}
.ca-network-tabs{display:flex;gap:8px;margin-bottom:14px}.ca-network-tabs button{border:1px solid var(--line);background:var(--card);color:var(--ink)}
.ca-network-tabs button.selected{color:var(--blue);background:var(--blue-soft);border-color:#aeb1ff}
/* --- welcome: the first screen ------------------------------------------- */
/* White, on the CRM's own tokens. A faint blue-violet wash at the top gives the starting
   point some weight without the dark slab that broke from the rest of the app. */
.ca-welcome{position:relative;overflow:hidden;isolation:isolate;border-radius:24px;padding:40px 32px 24px;text-align:center;
  background:var(--card);border:1px solid var(--line);box-shadow:0 18px 50px -26px rgba(9,29,66,.3);animation:ca-rise .4s cubic-bezier(.22,1,.36,1) both}
.ca-welcome-glow{position:absolute;inset:0 0 auto;height:340px;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse 55% 75% at 50% 0%,rgba(124,58,237,.11),transparent 70%),radial-gradient(ellipse 45% 65% at 18% 0%,rgba(76,76,224,.13),transparent 70%),radial-gradient(ellipse 40% 60% at 85% 0%,rgba(59,179,242,.10),transparent 70%)}
.ca-welcome::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.55;pointer-events:none;
  background-image:radial-gradient(rgba(76,76,224,.2) .8px,transparent .8px);background-size:22px 22px;
  -webkit-mask-image:linear-gradient(#000,transparent 52%);mask-image:linear-gradient(#000,transparent 52%)}
.ca-aurora{position:relative;width:104px;height:84px;margin:0 auto 2px;filter:drop-shadow(0 12px 22px rgba(76,76,224,.3))}
.ca-aurora i{position:absolute;inset:10px 16px;border-radius:48% 52% 62% 38% / 47% 40% 60% 53%;
  background:radial-gradient(at 25% 15%,#c6f3ff,#3bb3f2 28%,#5b5ce6 55%,#c47aed 80%);
  box-shadow:inset 3px 3px 7px rgba(255,255,255,.75),inset -4px -4px 11px rgba(40,30,120,.25);transform:rotate(-35deg);animation:ca-orbit 8s ease-in-out infinite}
.ca-aurora i:nth-child(2){inset:22px 3px 16px 42px;border-radius:70% 30% 62% 38%;background:linear-gradient(130deg,rgba(88,224,255,.5),#4c4ce0,rgba(191,125,255,.35));transform:rotate(42deg);animation-delay:-3s}
.ca-aurora i:nth-child(3){inset:4px 42px 32px 18px;background:linear-gradient(110deg,#2cc4fa,rgba(141,138,250,.25));border:1px solid rgba(255,255,255,.7);transform:rotate(27deg);animation-delay:-5s}
@keyframes ca-orbit{50%{transform:rotate(18deg) scale(1.06);border-radius:65% 35% 36% 64% / 54% 63% 37% 46%}}
.ca-welcome-label{display:block;color:var(--blue);font-size:10.5px;letter-spacing:2.4px;font-weight:700;margin:12px 0 4px}
.ca-welcome h2{font-size:clamp(28px,3.3vw,42px);color:var(--ink);line-height:1.13;letter-spacing:-1.4px;margin:6px auto 12px;font-weight:700}
.ca-welcome h2 span{background:linear-gradient(90deg,var(--blue) 10%,var(--cyan-deep,#0e9e9a) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.ca-welcome-lead{color:#5b6779;font-size:14.5px;line-height:1.7;margin:0 auto 26px;max-width:640px}

/* Where it runs and what it is for, numbered, so the order of the first screen is obvious. */
.ca-setup{display:flex;justify-content:center;align-items:flex-end;gap:16px;flex-wrap:wrap;margin:0 auto 20px;max-width:760px}
.ca-setup-field{display:grid;gap:8px;justify-items:start;text-align:left}
.ca-setup-label{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--ink)}
.ca-setup-label b{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--blue-soft);color:var(--blue);font-size:11px}
.ca-segment{display:inline-flex;padding:4px;gap:4px;background:var(--canvas);border:1px solid var(--line);border-radius:13px}
.ca-segment button{display:inline-flex;align-items:center;gap:7px;border:0;border-radius:9px;padding:9px 16px;background:transparent;
  color:#5b6779;font:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:background .16s,color .16s,box-shadow .16s}
.ca-segment button:hover{color:var(--ink)}
.ca-segment button.selected{background:var(--card);color:var(--blue);box-shadow:0 1px 2px rgba(9,29,66,.08),0 4px 12px -3px rgba(76,76,224,.28)}
select.ca-goal{height:44px;min-width:250px;border-radius:12px;font-size:13.5px;font-weight:500;color:var(--ink)}
.ca-step3{display:flex;justify-content:center;margin:2px 0 10px}
.ca-welcome .ca-composer{max-width:720px;margin:0 auto;text-align:left;box-shadow:0 12px 30px -16px rgba(9,29,66,.25)}

/* Examples and the two other ways in stay quiet, so the composer is the first action. */
.ca-examples{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:7px;max-width:780px;margin:14px auto 0}
.ca-examples>span{font-size:12px;color:var(--muted);margin-right:2px}
.ca-example{max-width:260px;padding:7px 13px;border:1px solid var(--line);border-radius:999px;background:var(--card);
  color:#4a5568;font:inherit;font-size:12px;line-height:1.35;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  transition:border-color .16s,color .16s,background .16s,transform .16s}
.ca-example:hover{border-color:var(--blue);color:var(--blue);background:var(--blue-soft);transform:translateY(-1px)}
.ca-alt{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:6px 9px;margin:18px auto 0;font-size:12.5px;color:var(--muted)}
.ca-alt i{font-style:normal;color:#c7d2e0}
.ca-link{border:0;background:none;padding:2px 0;font:inherit;font-weight:600;color:var(--blue);cursor:pointer;
  text-decoration:underline;text-decoration-color:rgba(76,76,224,.3);text-underline-offset:3px;transition:text-decoration-color .16s}
.ca-link:hover{text-decoration-color:var(--blue)}
.ca-trust{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 24px;list-style:none;margin:24px 0 0;padding:18px 0 0;border-top:1px solid var(--line)}
.ca-trust li{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--muted)}
.ca-trust li svg{color:var(--blue);opacity:.75}
.ca-trust li.on{color:#147a52}.ca-trust li.on svg{color:var(--green);opacity:1}

/* The short form, light, for owners who would rather fill fields than chat. */
.ca-quick{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:760px;margin:20px auto 0;padding:22px;border:1px solid var(--line);
  border-radius:16px;background:var(--canvas);text-align:left;animation:ca-rise .3s both}
.ca-quick-title{grid-column:1/-1;display:grid;gap:4px}.ca-quick-title strong{font-size:16px;color:var(--ink)}.ca-quick-title span{font-size:12.5px;color:var(--muted)}
.ca-quick-field{display:grid;gap:7px;align-content:start;font-size:13px;font-weight:500;color:var(--ink)}
.ca-quick .input,.ca-quick .textarea{width:100%;resize:vertical;background:var(--card)}
.ca-quick>button{grid-column:1/-1;justify-self:end}
.ca-asset-panel{display:grid;grid-template-columns:minmax(200px,320px) 1fr;gap:24px;padding:24px;margin:0 0 24px;background:var(--card);border:1px solid var(--line);border-radius:18px}.ca-selected-asset{width:100%;aspect-ratio:1;object-fit:contain;border-radius:12px;background:#edf1f7}.ca-upload-placeholder{display:grid;align-content:center;justify-items:center;gap:12px;aspect-ratio:1;border:2px dashed var(--line);border-radius:12px;color:var(--muted);text-align:center}.ca-upload-placeholder strong{color:var(--ink)}.ca-upload-placeholder span{font-size:12px}.ca-asset-tools{display:grid;align-content:center;gap:16px}.ca-asset-tools>small{font-size:12px;color:var(--muted);line-height:1.6}.ca-upload{cursor:pointer;width:fit-content}.ca-meta-art img{width:100%;height:100%;object-fit:contain}
.ca-voice-active{display:flex;align-items:center;flex-wrap:wrap;gap:9px;border:1px solid #b4b6fe;background:#eeefff;color:#3b3bc4;padding:12px 15px;border-radius:10px;margin-bottom:15px;font-size:12px}.ca-voice-active i{height:8px;width:8px;border-radius:50%;background:#4c4ce0;animation:ca-breathe 1s infinite}.ca-voice-active button{margin-left:auto;border:0;background:transparent;color:#4c4ce0;text-decoration:underline;cursor:pointer}
#caPublishError{color:#c93a44;font-size:13px;line-height:1.6}
.ca-loading{display:flex;align-items:center;gap:10px;color:var(--muted);padding:40px 0;font-size:13.5px}
.ca-empty{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:28px;color:var(--muted);text-align:center;font-size:13.5px}
.ca-empty.error{border-color:#f3c9c9;background:#fff6f6;color:#9a3030}
.ca-eyebrow{font-size:10.5px;font-weight:700;letter-spacing:1px;color:var(--blue)}
.ca-note{display:flex;gap:7px;align-items:flex-start;margin:16px 0 0;font-size:12.5px;color:var(--muted);line-height:1.6}
.ca-note svg{flex:none;margin-top:2px}

/* --- the pipeline, as a stepper across the top ---------------------------- */
/* Across the top rather than down the side: the stages are one line of progress, and the
   conversation gets the width it needs. Each connector turns blue as its stage is reached. */
.ca-rail{list-style:none;margin:0;padding:16px 10px 13px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));
  background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:0 1px 2px rgba(9,29,66,.03)}
.ca-rail-step{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:0 6px;min-width:0}
.ca-rail-step::before{content:"";position:absolute;top:13px;left:calc(-50% + 20px);right:calc(50% + 20px);height:2px;border-radius:2px;background:var(--line);transition:background .35s}
.ca-rail-step:first-child::before{display:none}
.ca-rail-step.done::before,.ca-rail-step.now::before{background:var(--blue)}
.ca-rail-dot{position:relative;z-index:1;flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;
  background:var(--card);border:2px solid var(--line);color:var(--muted);font-size:12px;font-weight:700;transition:all .25s}
.ca-rail-text{min-width:0;max-width:100%}
.ca-rail-text strong{display:block;font-size:12.5px;font-weight:600;color:var(--muted);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ca-rail-text small{display:block;font-size:11px;color:var(--muted);opacity:.8;line-height:1.35;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ca-rail-step.done{cursor:pointer}
.ca-rail-step.done .ca-rail-dot{background:var(--blue);border-color:var(--blue);color:#fff}
.ca-rail-step.done:hover .ca-rail-dot{box-shadow:0 0 0 4px rgba(76,76,224,.16)}
.ca-rail-step.done .ca-rail-text strong{color:var(--ink)}
.ca-rail-step.now .ca-rail-dot{border-color:var(--blue);color:var(--blue);background:var(--blue-soft);box-shadow:0 0 0 5px rgba(76,76,224,.12);animation:ca-breathe 2.4s ease-in-out infinite}
.ca-rail-step.now .ca-rail-text strong{color:var(--blue)}

/* --- launchpad ------------------------------------------------------------ */
.ca-launch h2{font-size:23px;letter-spacing:-.4px;margin:6px 0 16px;color:var(--ink)}
.ca-launch h3{font-size:16px;margin:0 0 12px;color:var(--ink)}
.ca-picks{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:11px}
.ca-picks.tight{grid-template-columns:repeat(auto-fit,minmax(185px,1fr))}
.ca-pick{position:relative;text-align:left;padding:16px 17px;border:1.5px solid var(--line);border-radius:14px;background:var(--card);
  cursor:pointer;font:inherit;transition:border-color .16s,background .16s,transform .16s,box-shadow .16s}
.ca-pick:hover{border-color:var(--blue);background:var(--blue-soft);transform:translateY(-2px);box-shadow:var(--shadow)}
.ca-pick.active{border-color:var(--blue);background:var(--blue-soft);box-shadow:0 0 0 3px rgba(76,76,224,.12)}
.ca-pick strong{display:block;font-size:14.5px;margin-bottom:3px;color:var(--ink)}
.ca-pick small{color:var(--muted);font-size:12.5px;line-height:1.5}
.ca-pick-mark{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--blue-soft);color:var(--blue);margin-bottom:10px}
.ca-reveal{margin-top:26px;animation:ca-rise .34s cubic-bezier(.22,1,.36,1) both}

/* --- saved campaigns ------------------------------------------------------ */
.ca-saved{margin-top:34px}
.ca-saved h3{font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:0 0 12px}
.ca-saved-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:11px}
.ca-saved-card{display:grid;gap:6px;text-align:left;padding:15px 16px;border:1px solid var(--line);border-radius:14px;
  background:var(--card);cursor:pointer;font:inherit;transition:border-color .16s,transform .16s,box-shadow .16s;
  animation:ca-rise .32s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--i,0) * 50ms)}
.ca-saved-card:hover{border-color:var(--blue);transform:translateY(-2px);box-shadow:var(--shadow)}
.ca-saved-card strong{font-size:14px;color:var(--ink);line-height:1.4}
.ca-saved-card small{font-size:12px;color:var(--muted)}
.ca-saved-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.ca-badge{font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px;background:var(--blue-soft);color:var(--blue)}
.ca-badge.google{background:#e3f8ec;color:var(--green)}
.ca-saved-status{font-size:11px;color:var(--muted)}

/* --- conversation --------------------------------------------------------- */
/* The conversation and the brief it fills sit side by side, so every answer can be seen
   landing in its field. Below 1180px they stack, brief underneath. */
.ca-talk-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:start}
.ca-talk-layout .ca-brief{position:sticky;top:18px}

/* One panel, chat-app style: a header saying who you are talking to, a thread that scrolls,
   and the composer docked at the bottom. A fixed height means a short conversation never
   leaves an empty void under the box. */
.ca-chat{display:flex;flex-direction:column;height:clamp(460px,calc(100vh - 340px),720px);min-width:0;
  background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 16px 40px -28px rgba(9,29,66,.35);animation:ca-rise .35s both}
.ca-chat-head{display:flex;align-items:center;gap:12px;padding:13px 18px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#fbfbff,var(--card))}
.ca-chat-who{display:grid;gap:2px;min-width:0}
.ca-chat-who strong{font-size:14px;color:var(--ink)}
.ca-chat-who small{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--muted)}
.ca-chat-who small i{width:7px;height:7px;border-radius:50%;background:var(--amber)}
.ca-chat-who small.on i{background:var(--green);box-shadow:0 0 0 3px rgba(16,185,129,.18)}
.ca-chat-context{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.ca-pill{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border-radius:999px;background:var(--canvas);border:1px solid var(--line);
  font-size:11.5px;font-weight:600;color:#4a5568;white-space:nowrap}
.ca-pill svg{color:var(--blue)}

/* No smooth scrolling: the thread is rebuilt on every message, so a smooth scroll replayed
   the whole conversation from the top each time. An instant jump lands on the newest line. */
.ca-thread{flex:1;min-height:0;display:flex;flex-direction:column;gap:12px;overflow-y:auto;padding:22px 20px;
  background:linear-gradient(180deg,var(--card),#f9f9fe)}
.ca-opening{display:flex;gap:13px;padding:18px;margin:auto 0;background:var(--canvas);border:1px dashed #cfdae8;border-radius:16px;animation:ca-rise .3s both}
.ca-opening strong{display:block;font-size:15px;color:var(--ink);margin-bottom:5px}
.ca-opening p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.6}
.ca-avatar{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:12px;
  background:linear-gradient(140deg,var(--blue),var(--cyan-deep,#0e9e9a));color:#fff;box-shadow:0 6px 14px -6px rgba(76,76,224,.6)}
.ca-avatar.sm{width:28px;height:28px;border-radius:9px;box-shadow:none}
.ca-msg{display:flex;gap:9px;align-items:flex-end;animation:ca-rise .26s cubic-bezier(.22,1,.36,1) both}
.ca-msg p{margin:0;padding:11px 15px;border-radius:18px;font-size:13.5px;line-height:1.6;max-width:min(76%,620px);white-space:pre-wrap;overflow-wrap:anywhere}
.ca-msg.bot p{background:var(--card);border:1px solid var(--line);border-bottom-left-radius:6px;color:var(--ink);box-shadow:0 1px 2px rgba(9,29,66,.04)}
.ca-msg.me{justify-content:flex-end}
.ca-msg.me p{background:linear-gradient(135deg,var(--blue),#4c4ce0);color:#fff;border-bottom-right-radius:6px;box-shadow:0 6px 16px -8px rgba(76,76,224,.6)}
.ca-typing{display:flex!important;gap:4px;align-items:center;min-height:22px}
.ca-typing i{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:ca-bounce 1.1s ease-in-out infinite}
.ca-typing i:nth-child(2){animation-delay:.16s}
.ca-typing i:nth-child(3){animation-delay:.32s}

.ca-chat-foot{padding:12px 16px 14px;border-top:1px solid var(--line);background:var(--card)}
.ca-guided-note{margin:8px 2px 0;font-size:11.5px;color:var(--muted);line-height:1.5}

/* --- composer ------------------------------------------------------------- */
.ca-composer{background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:12px 12px 10px 14px;transition:border-color .2s,box-shadow .2s}
.ca-composer:focus-within{border-color:var(--blue);box-shadow:0 0 0 4px rgba(76,76,224,.1)}
.ca-composer.hot{border-color:var(--red);box-shadow:0 0 0 4px rgba(239,68,68,.1)}
.ca-composer textarea{width:100%;border:0;outline:0;resize:none;font:inherit;font-size:14.5px;line-height:1.55;color:var(--ink);background:transparent;max-height:160px;min-height:46px}
.ca-composer textarea::placeholder{color:#a3adbd}
.ca-composer-tools{display:flex;align-items:center;gap:8px;margin-top:8px;flex-wrap:wrap}
.ca-spacer{flex:1}
/* Dictation and a live voice call are different things, so they look different: the call is
   the violet one, dictation is a plain tool. */
.ca-tool{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;border:1px solid var(--line);border-radius:10px;
  background:var(--card);color:#4a5568;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:border-color .16s,color .16s,background .16s}
.ca-tool:hover{border-color:var(--blue);color:var(--blue);background:var(--blue-soft)}
.ca-tool.on{border-color:var(--red);color:var(--red);background:#fff1f1;animation:ca-pulse 1.3s ease-in-out infinite}
.ca-tool:disabled{opacity:.6;cursor:default}
.ca-tool-live{background:linear-gradient(135deg,#f4f1ff,#eaebff);border-color:#ddd6fc;color:#5b45d6}
.ca-tool-live:hover{border-color:#7c66f0;color:#4a33c9;background:linear-gradient(135deg,#ece7ff,#e2e3ff)}
.ca-tool-live.on{background:#fff1f1;border-color:var(--red);color:var(--red)}
.ca-live-dot{width:8px;height:8px;border-radius:50%;background:var(--red);animation:ca-breathe 1s infinite}
select.ca-lang{height:34px;width:auto;min-width:104px;border-radius:10px;font-size:12.5px;padding-top:0;padding-bottom:0}
.ca-mic-off{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.ca-hint{font-size:11px;color:#a3adbd}
.ca-send{display:grid;place-items:center;flex:none;width:40px;height:40px;border:0;border-radius:12px;background:var(--ink);color:#fff;cursor:pointer;
  box-shadow:0 6px 16px -6px rgba(9,29,66,.55);transition:transform .16s,background .16s}
.ca-send:hover{background:var(--blue);transform:translateY(-1px)}
.ca-send:disabled{opacity:.4;cursor:default;transform:none}

.ca-ready{display:flex;align-items:center;gap:12px;margin:0 16px 12px;padding:12px 14px;background:linear-gradient(135deg,#ecfbf3,#f2fbff);
  border:1px solid #bfe8cf;border-radius:14px;animation:ca-rise .3s both}
.ca-ready-mark{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:var(--green);color:#fff;box-shadow:0 0 0 5px rgba(16,185,129,.15)}
.ca-ready>div{flex:1;min-width:0}
.ca-ready strong{display:block;font-size:14px;color:#146b43}
.ca-ready small{color:#3c8b64;font-size:12.5px}

/* --- the brief ------------------------------------------------------------ */
.ca-brief{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:18px;align-self:start;box-shadow:0 16px 40px -30px rgba(9,29,66,.35)}
.ca-brief header{display:flex;align-items:center;gap:12px;margin-bottom:12px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.ca-brief header strong{display:block;font-size:14px;color:var(--ink)}
.ca-brief header small{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.ca-ring{flex:none}
.ca-ring-bg{fill:none;stroke:var(--line);stroke-width:4}
.ca-ring-fg{fill:none;stroke:var(--blue);stroke-width:4;stroke-linecap:round;transform:rotate(-90deg);transform-origin:22px 22px;transition:stroke-dashoffset .6s cubic-bezier(.22,1,.36,1)}
.ca-ring text{font-size:11px;font-weight:700;fill:var(--ink)}
.ca-brief ol{list-style:none;margin:0;padding:0;display:grid;gap:3px}
.ca-brief li{display:flex;gap:10px;align-items:flex-start;padding:8px 9px;border-radius:11px;font-size:12.5px;transition:background .2s}
.ca-brief-mark{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:10.5px;font-weight:700;
  border:1.5px solid var(--line);color:var(--muted);background:var(--card);transition:all .25s}
.ca-brief li.got .ca-brief-mark{background:var(--green);border-color:var(--green);color:#fff}
.ca-brief li.next{background:var(--blue-soft)}
.ca-brief li.next .ca-brief-mark{border-color:var(--blue);color:var(--blue);box-shadow:0 0 0 3px rgba(76,76,224,.14)}
.ca-brief-text{min-width:0;padding-top:2px}
.ca-brief-text small{display:block;color:#5b6779;line-height:1.4;font-weight:500}
.ca-brief li.wait .ca-brief-text small{color:#a3adbd}
.ca-brief-text small em{font-style:normal;margin-left:6px;padding:1px 7px;border-radius:999px;background:var(--blue);color:#fff;font-size:10px;font-weight:700;letter-spacing:.2px;vertical-align:1px}
.ca-brief-text strong{display:block;color:var(--ink);font-weight:500;line-height:1.45;margin-top:3px;overflow-wrap:anywhere;animation:ca-rise .3s both}
.ca-brief-note{margin:12px 0 0;padding-top:12px;border-top:1px solid var(--line);font-size:11.5px;color:var(--muted);line-height:1.55}

/* --- brain at work -------------------------------------------------------- */
.ca-working{display:grid;justify-items:center;text-align:center;padding:64px 20px}
.ca-working strong{font-size:17px;color:var(--ink);margin-top:26px}
.ca-working p{color:var(--muted);font-size:13.5px;max-width:380px;margin:8px 0 0;line-height:1.6}
.ca-orb{position:relative;width:76px;height:76px}
.ca-orb i{position:absolute;inset:0;border-radius:50%;border:2px solid var(--blue);opacity:0;animation:ca-ripple 2s ease-out infinite}
.ca-orb i:nth-child(2){animation-delay:.66s}
.ca-orb i:nth-child(3){animation-delay:1.32s}
.ca-orb::after{content:"";position:absolute;inset:26px;border-radius:50%;background:linear-gradient(140deg,var(--blue),var(--cyan-deep,#0e9e9a));animation:ca-breathe 2s ease-in-out infinite}

/* --- the plan ------------------------------------------------------------- */
.ca-stage-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.ca-stage-head h2{font-size:22px;letter-spacing:-.4px;margin:5px 0 4px;color:var(--ink)}
.ca-stage-head p{margin:0;color:var(--muted);font-size:13px;line-height:1.55;max-width:560px}
.ca-stack{display:grid;gap:13px}
.ca-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px;
  animation:ca-rise .4s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--i,0) * 70ms)}
.ca-card h3{display:flex;align-items:center;gap:7px;font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:0 0 12px}
.ca-card.ca-summary p{margin:0;font-size:15px;line-height:1.65;color:var(--ink)}
.ca-card.warn{border-color:#f6ddb4;background:#fffaf0}
.ca-card.warn h3{color:#a96a12}
.ca-card-note{margin:11px 0 0;font-size:12.5px;color:var(--muted);line-height:1.6}
.ca-list{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.ca-list li{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;font-size:13.5px;color:var(--ink);line-height:1.55;
  padding-bottom:9px;border-bottom:1px solid var(--line)}
.ca-list li:last-child{padding-bottom:0;border-bottom:0}
.ca-list li span{flex:1;min-width:140px;color:var(--muted)}
.ca-list li b{font-weight:600}
.ca-list li small{flex-basis:100%;color:var(--muted);font-size:12px;line-height:1.5}

/* --- creative ------------------------------------------------------------- */
.ca-creatives{display:grid;grid-template-columns:repeat(auto-fit,minmax(265px,1fr));gap:14px}
.ca-creative{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  animation:ca-rise .42s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--i,0) * 90ms);transition:transform .18s,box-shadow .18s}
.ca-creative:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.ca-creative-art{position:relative;aspect-ratio:1/1;display:grid;align-content:center;gap:9px;padding:22px;color:#fff;
  background:linear-gradient(145deg,var(--tone),color-mix(in srgb,var(--tone) 55%,#091d42))}
.ca-creative-angle{font-size:10.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;opacity:.8}
.ca-creative-art strong{font-size:21px;line-height:1.25;letter-spacing:-.3px}
.ca-creative-brand{position:absolute;left:22px;bottom:18px;font-size:11.5px;opacity:.85}
.ca-creative-copy{padding:16px 18px}
.ca-creative-copy small{display:block;font-size:10px;font-weight:700;letter-spacing:.8px;color:var(--muted);margin-top:11px}
.ca-creative-copy small:first-child{margin-top:0}
.ca-creative-copy p{margin:3px 0 0;font-size:13.5px;line-height:1.55;color:var(--ink)}
.ca-cta{display:inline-block;margin-top:14px;padding:6px 13px;border-radius:9px;background:var(--blue-soft);color:var(--blue);font-size:12.5px;font-weight:600;white-space:nowrap}
.ca-cta.solid{flex:none;margin-top:0;padding:8px 14px;background:var(--blue);color:#fff}

/* --- preview -------------------------------------------------------------- */
.ca-preview{display:grid;justify-items:center;padding:8px 0;animation:ca-rise .4s both}
.ca-meta-ad{width:min(420px,100%);background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
.ca-meta-ad header{display:flex;gap:10px;align-items:center;padding:13px 14px}
.ca-meta-avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:#fff;font-weight:600}
.ca-meta-ad header strong{display:block;font-size:13.5px;color:var(--ink)}
.ca-meta-ad header small{display:flex;align-items:center;gap:4px;font-size:11.5px;color:var(--muted)}
.ca-meta-body{margin:0;padding:0 14px 12px;font-size:13.5px;line-height:1.55;color:var(--ink)}
.ca-meta-art{aspect-ratio:1.91/1;display:grid;place-items:center;padding:24px;text-align:center;color:#fff;
  background:linear-gradient(145deg,var(--tone),color-mix(in srgb,var(--tone) 55%,#091d42))}
.ca-meta-art strong{font-size:22px;line-height:1.25;letter-spacing:-.3px}
.ca-meta-ad footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;background:var(--canvas)}
.ca-meta-ad footer small{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.ca-meta-ad footer strong{display:block;font-size:13.5px;color:var(--ink);margin-top:2px}
.ca-google{width:min(560px,100%);background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 20px;box-shadow:var(--shadow)}
.ca-google-tag{font-size:12px;font-weight:700;color:var(--ink)}
.ca-google-site{font-size:12.5px;color:var(--muted);margin:3px 0 5px}
.ca-google h4{margin:0 0 5px;font-size:19px;font-weight:500;color:#1a0dab;line-height:1.3}
.ca-google p{margin:0;font-size:13.5px;line-height:1.6;color:var(--muted)}

/* --- confirmation --------------------------------------------------------- */
.ca-confirm{text-align:center;max-width:540px;margin:0 auto;padding:48px 20px;animation:ca-rise .4s both}
.ca-confirm-mark{display:inline-grid;place-items:center;width:62px;height:62px;border-radius:19px;background:var(--blue-soft);color:var(--blue)}
.ca-confirm h2{font-size:22px;letter-spacing:-.4px;margin:18px 0 8px;color:var(--ink)}
.ca-confirm p{color:var(--muted);font-size:13.5px;line-height:1.65;margin:0}
.ca-confirm-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:22px}
.ca-confirm .ca-note{justify-content:center;text-align:left;max-width:430px;margin:20px auto 0}

/* --- motion --------------------------------------------------------------- */
@keyframes ca-rise{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
@keyframes ca-bounce{0%,80%,100%{transform:translateY(0);opacity:.45}40%{transform:translateY(-5px);opacity:1}}
@keyframes ca-pulse{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,.32)}50%{box-shadow:0 0 0 7px rgba(239,68,68,0)}}
@keyframes ca-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
@keyframes ca-ripple{0%{transform:scale(.45);opacity:.65}100%{transform:scale(1);opacity:0}}

@media(max-width:1180px){
  .ca-talk-layout{grid-template-columns:1fr}
  .ca-talk-layout .ca-brief{position:static}
  .ca-chat{height:clamp(460px,62vh,640px)}
}
@media(max-width:900px){
  .ca-rail-text small,.ca-hint{display:none}
}
@media(max-width:640px){
  .ca-welcome{padding:26px 16px 20px;border-radius:18px}
  .ca-welcome-lead br{display:none}
  .ca-setup{flex-direction:column;align-items:stretch}
  .ca-setup-field{justify-items:stretch}
  .ca-segment{display:flex}.ca-segment button{flex:1;justify-content:center}
  select.ca-goal{width:100%;min-width:0}
  .ca-example{max-width:100%}
  .ca-quick{grid-template-columns:1fr;padding:16px}
  .ca-asset-panel{grid-template-columns:1fr;padding:16px}.ca-asset-tools{min-width:0}
  .ca-rail{padding:12px 4px 10px}
  .ca-rail-step:not(.now) .ca-rail-text{display:none}
  .ca-rail-step.now .ca-rail-text strong{white-space:normal}
  .ca-chat-context{display:none}
  .ca-thread{padding:16px 12px}
  .ca-msg p{max-width:86%}
  .ca-stage-head{align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){
  .ca-rail-step.now .ca-rail-dot,.ca-tool.on,.ca-live-dot,.ca-orb i,.ca-orb::after,.ca-typing i,.ca-aurora i{animation:none}
  .ca-card,.ca-creative,.ca-msg,.ca-reveal,.ca-preview,.ca-confirm,.ca-opening,.ca-ready,.ca-brief-text strong,.ca-saved-card,.ca-welcome,.ca-chat,.ca-quick{animation:none}
  .ca-pick:hover,.ca-creative:hover,.ca-saved-card:hover,.ca-example:hover,.ca-send:hover{transform:none}
}

/* Input recovery stays beside the campaign instead of stacking alerts. */
.ca-input-notice{margin:0 0 16px;padding:14px 18px;border:1px solid #cbccf6;border-radius:14px;background:#f1f1ff;color:#243957;display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:13px}
.ca-input-notice>div:first-child{display:flex;align-items:center;gap:10px}.ca-input-notice svg{flex-shrink:0}.ca-input-notice p{margin:0;line-height:1.6}
.ca-input-actions{display:flex;flex-wrap:wrap;gap:8px;flex-shrink:0}.ca-input-actions .btn{white-space:nowrap}
@media(max-width:700px){.ca-input-notice{flex-direction:column;align-items:flex-start}.ca-input-actions{flex-shrink:1}}

.ca-creative-error{padding:12px;border-radius:10px;background:#fff5e7;color:#85500d;font-size:13px;line-height:1.6;overflow-wrap:anywhere}

.ca-context{display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;align-items:center;background:var(--surface,#fff);border:1px solid #dce4ef;border-radius:18px;padding:20px 24px;margin-bottom:20px;color:#091d42}.ca-context h3{margin:6px 0}.ca-context p{margin:4px 0;color:#53657d;font-size:13px}.ca-context small{color:#62748a}.ca-profile-grid{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.ca-profile-grid label{display:grid;gap:6px;font-size:13px}.ca-asset-library{display:flex;gap:12px;flex-wrap:wrap}.ca-asset-library button{border:1px solid #ccd8ec;background:white;border-radius:12px;padding:4px;cursor:pointer}.ca-asset-library img{border-radius:8px;object-fit:cover}@media(max-width:600px){.ca-profile-grid{grid-template-columns:1fr}.ca-context{padding:16px}}

/* --- the CRM context, as a slimmer strip ---------------------------------- */
/* Useful, but it sat above every first screen and pushed the box you type in below the
   fold on a laptop. Same content, less height. */
.ca-context{padding:14px 20px;margin-bottom:16px;border-radius:16px}
.ca-context h3{margin:2px 0;font-size:16px}
.ca-context p{margin:2px 0}

/* --- stepper: stages already reached, ahead of where you are -------------- */
.ca-rail-step.go{cursor:pointer}
.ca-rail-step.go:hover .ca-rail-dot{box-shadow:0 0 0 4px rgba(76,76,224,.16)}
.ca-rail-step.go:focus-visible{outline:2px solid var(--blue);outline-offset:4px;border-radius:10px}
.ca-rail-step.ahead .ca-rail-dot{background:var(--blue-soft);border-color:#a9acf7;color:var(--blue)}
.ca-rail-step.ahead .ca-rail-text strong{color:var(--ink)}
.ca-rail-step.ahead::before{background:var(--blue);opacity:.35}

/* --- "your plan is ready" when you go back to the brief ------------------- */
.ca-resume{display:flex;align-items:center;gap:12px;margin:0 0 16px;padding:12px 14px 12px 16px;border:1px solid #bfe8cf;border-radius:14px;
  background:linear-gradient(135deg,#ecfbf3,#f2fbff);color:#146b43;animation:ca-rise .3s both}
.ca-resume>svg{flex:none;color:var(--green)}
.ca-resume>div{flex:1;min-width:0}
.ca-resume strong{display:block;font-size:14px}
.ca-resume small{color:#3c8b64;font-size:12.5px}

/* --- Talk with AI: one big button ----------------------------------------- */
.ca-voice-start{position:relative;display:grid;place-items:center;width:112px;height:112px;margin:6px auto 14px;border:0;border-radius:50%;
  background:linear-gradient(140deg,var(--blue),var(--cyan-deep,#0e9e9a));color:#fff;cursor:pointer;box-shadow:0 18px 40px -14px rgba(76,76,224,.65);
  transition:transform .18s,box-shadow .18s}
.ca-voice-start:hover{transform:scale(1.04)}
.ca-voice-start:focus-visible{outline:3px solid #b9bbf7;outline-offset:5px}
.ca-voice-ring{position:absolute;inset:0;border-radius:50%;border:2px solid rgba(76,76,224,.4);animation:ca-ring 2.4s ease-out infinite;pointer-events:none}
.ca-voice-start.on{background:linear-gradient(140deg,#ef4444,#f97316);box-shadow:0 18px 40px -14px rgba(239,68,68,.6)}
.ca-voice-start.on .ca-voice-ring{border-color:rgba(239,68,68,.5);animation-duration:1.3s}
@keyframes ca-ring{0%{transform:scale(1);opacity:.75}100%{transform:scale(1.45);opacity:0}}
.ca-voice-cta{display:block;font-size:15px;color:var(--ink);margin-bottom:6px}
.ca-voice-how{max-width:520px;margin:0 auto 22px;font-size:12.5px;line-height:1.6;color:var(--muted)}
.ca-voice-type .ca-composer{max-width:640px;margin:0 auto;text-align:left}

/* --- Quick Campaign: one card, not a grey box inside a white one ----------- */
.ca-quick-page{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:26px 28px 24px;
  box-shadow:0 18px 50px -30px rgba(9,29,66,.3);animation:ca-rise .35s both}
.ca-quick-page .ca-setup{justify-content:flex-start;margin:0 0 22px;max-width:none}
.ca-quick-page .ca-quick{max-width:none;margin:0;padding:22px 0 0;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;animation:none}

/* --- AI Creative Studio ---------------------------------------------------- */
.ca-studio-empty{display:grid;justify-items:center;text-align:center;gap:8px;padding:48px 24px;background:var(--card);
  border:1px dashed #cfdae8;border-radius:22px;animation:ca-rise .35s both}
.ca-studio-mark{display:grid;place-items:center;width:64px;height:64px;border-radius:20px;background:var(--blue-soft);color:var(--blue);margin-bottom:6px}
.ca-studio-empty h3{margin:0;font-size:18px;color:var(--ink)}
.ca-studio-empty p{margin:0 0 12px;max-width:440px;font-size:13.5px;line-height:1.6;color:var(--muted)}
.ca-studio-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.ca-studio{display:grid;gap:14px}
.ca-studio-head h3{margin:0 0 4px;font-size:16px;color:var(--ink)}
.ca-studio-head p{margin:0;font-size:13px;color:var(--muted)}
.ca-saved-card small{display:inline-flex;align-items:center;gap:4px}

@media(max-width:640px){
  .ca-quick-page{padding:18px 16px}
  .ca-resume{flex-wrap:wrap}
  .ca-voice-start{width:96px;height:96px}
}
@media(prefers-reduced-motion:reduce){
  .ca-voice-ring{animation:none}
  .ca-resume,.ca-quick-page,.ca-studio-empty{animation:none}
  .ca-voice-start:hover{transform:none}
}

/* Publishing to Meta: names, the paused/live choice, and the result of a stopped attempt. */
.ca-names,.ca-delivery{border:1px solid var(--line);border-radius:14px;padding:12px 14px 14px;margin:14px 0;background:var(--card)}
.ca-names legend,.ca-delivery legend{padding:0 6px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.ca-field-hint{display:block;margin-top:4px;font-size:11.5px;color:var(--muted);font-weight:400}
.ca-kept{display:flex;flex-direction:column;gap:3px;padding:10px 12px;border:1px dashed var(--line);border-radius:12px;background:var(--blue-soft)}
.ca-kept span{font-size:12px;color:var(--muted)}
.ca-kept strong{display:inline-flex;align-items:center;gap:6px;color:var(--blue);font-size:13.5px}
.ca-kept small{font-size:11.5px;color:var(--muted);word-break:break-all}
.ca-delivery{display:grid;gap:8px}
.ca-delivery-opt{display:flex;align-items:flex-start;gap:10px;padding:11px 12px;border:1.5px solid var(--line);border-radius:12px;cursor:pointer;transition:border-color .15s,background .15s}
.ca-delivery-opt input{margin-top:3px;accent-color:var(--blue)}
.ca-delivery-opt span{display:flex;flex-direction:column;gap:2px}
.ca-delivery-opt strong{font-size:14px;color:var(--ink)}
.ca-delivery-opt small{font-size:12px;color:var(--muted);line-height:1.45}
.ca-delivery-opt.on{border-color:var(--blue);background:var(--blue-soft)}
.ca-delivery-opt.live.on{border-color:#d97706;background:#fff8eb}
.ca-publication a.btn{text-decoration:none;color:var(--ink)}
.ca-live-confirm{padding:9px 12px;border-radius:10px;background:#fff8eb;color:#7a4a05;font-size:12.5px}
.ca-live-confirm[hidden]{display:none}
.cm-note-box.live{background:#fff4e5;border-color:#f5c98a;color:#7a4a05}
.ca-go-live{background:#d97706;border-color:#d97706}
.ca-go-live:hover{background:#b45309;border-color:#b45309}
.ca-publication.stopped{border-color:#f5c98a}
.ca-publication dd em{font-style:normal;color:var(--muted)}
.ca-pub-error{margin:12px 0;padding:11px 13px;border-radius:12px;background:#fff4f2;border:1px solid #f8c9c1;color:#7f1d1d}
.ca-pub-error strong{display:block;font-size:12px;letter-spacing:.04em;text-transform:uppercase;margin-bottom:4px}
.ca-pub-error p{margin:0;font-size:13px;line-height:1.5;word-break:break-word}
.ca-suggest{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:4px 0 6px 38px}
.ca-suggest>span{font-size:12px;color:var(--muted)}
.ca-suggest-btn{display:inline-flex;align-items:center;gap:6px;border-color:var(--blue);color:var(--blue);background:var(--blue-soft);max-width:100%}
@media(max-width:640px){.ca-suggest{margin-left:0}}
/* Business profile: filling from Facebook. Filled values are tinted until the owner edits or saves them. */
.ca-profile-actions{display:flex;gap:10px;align-items:center}
.ca-profile-actions .btn{flex:1;justify-content:center}
.ca-profile-actions .btn.primary{flex:1.4}
.ca-profile-note{align-self:center;margin:0;font-size:12.5px;line-height:1.5;color:var(--muted)}
.ca-profile-grid .input.ca-from-meta{background:#ecfbfa;border-color:#8fe0dd}
@media(max-width:600px){.ca-profile-actions{flex-direction:column;align-items:stretch}}
/* ================================================================ 5-question Chat / Talk, and the Meta builder */
.cm-page-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.ca-rail.meta{grid-template-columns:repeat(4,minmax(0,1fr))}

/* Compact platform + goal row inside the chat and talk screens. */
.ca-setup.compact{justify-content:flex-start;margin:0;gap:12px;max-width:none}
.ca-setup.compact .ca-setup-label{font-size:11.5px;color:var(--muted)}
.ca-setup.compact .ca-setup-label b{display:none}
.ca-setup.compact .ca-segment button{padding:7px 12px;font-size:13px}
.ca-setup.compact .ca-goal{min-height:38px;padding:6px 10px;font-size:13px}
.ca-chat-setup{padding:10px 18px;border-bottom:1px solid var(--line);background:var(--card)}

/* "Question 2 of 5" with a bar that fills. */
.ca-qprogress{display:grid;gap:6px;min-width:160px;margin-left:auto;font-size:12.5px;font-weight:600;color:var(--blue)}
.ca-qprogress span{display:inline-flex;align-items:center;gap:6px;justify-content:flex-end}
.ca-qprogress i{display:block;height:6px;border-radius:999px;background:var(--blue-soft);overflow:hidden}
.ca-qprogress b{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--blue),var(--cyan-deep,#0e9e9a));transition:width .4s ease}
.ca-qprogress.done{color:#0f7a4f}

/* Tap-to-answer chips. */
.ca-chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 18px 12px;animation:ca-rise .3s both}
.ca-chips>span{width:100%;font-size:12px;color:var(--muted)}
.ca-chip{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:9px 15px;border:1.5px solid #c9cbf7;border-radius:999px;
  background:var(--card);color:var(--blue);font:600 13.5px/1.25 inherit;cursor:pointer;text-align:left;transition:background .15s,border-color .15s,transform .15s}
.ca-chip:hover{background:var(--blue-soft);border-color:var(--blue);transform:translateY(-1px)}
.ca-chip.on{background:var(--blue);border-color:var(--blue);color:#fff}
.ca-chips.mini{padding:6px 0 0;gap:6px;animation:none}
.ca-chips.mini .ca-chip{padding:6px 11px;font-size:12.5px;border-width:1px}

/* Talk with AI: one screen, voice first. */
.ca-talk2{max-width:760px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;
  padding:26px 22px 22px;background:var(--card);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow)}
.ca-talk2 .ca-setup.compact{justify-content:center}
.ca-talk2 .ca-qprogress{margin:0;width:min(320px,100%)}
.ca-talk2 .ca-qprogress span{justify-content:center}
.ca-talk-question{margin:6px 0 0;max-width:620px;font-size:clamp(20px,2.6vw,26px);line-height:1.35;font-weight:700;color:var(--ink);letter-spacing:-.3px}
.ca-talk2 .ca-chips{justify-content:center;padding:0}
.ca-talk2 .ca-chips>span{text-align:center}
.ca-talk2 .ca-voice-start{margin:10px auto 2px;width:128px;height:128px}
.ca-heard{min-height:22px;margin:0;font-size:15px;color:var(--muted);font-style:italic}
.ca-talk-lang{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted)}
.ca-talk-lang .select{min-height:34px;padding:4px 8px}
.ca-talk2 .ca-ready{margin:0;width:100%;text-align:left}
.ca-transcript{width:100%;text-align:left;border-top:1px solid var(--line);padding-top:10px}
.ca-transcript summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--blue)}
.ca-transcript .ca-thread{max-height:280px}

/* The builder: Campaign › Ad set › Ad, with a live preview. */
.cb{display:grid;gap:16px}
.cb-head h2{margin:4px 0 4px;font-size:clamp(20px,2.4vw,26px);letter-spacing:-.4px}
.cb-head h2 i{font-style:normal;color:var(--blue);margin:0 4px}
.cb-head p{margin:0;color:var(--muted);font-size:14px}
.cb-alert{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:14px;background:#fff6ec;border:1px solid #f5c98a;color:#7a4a05}
.cb-alert strong{display:block;font-size:14px}
.cb-alert small{font-size:12.5px;line-height:1.5}
.cb-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:18px;align-items:start}
.cb-steps{display:grid;gap:16px;min-width:0}
.cb-card{display:grid;gap:14px;padding:18px 20px 20px;background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);animation:ca-rise .35s both}
.cb-card header{display:flex;align-items:center;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.cb-card h3{margin:0;font-size:17px;color:var(--ink)}
.cb-card header small{font-size:12.5px;color:var(--muted)}
.cb-num{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:10px;background:var(--blue);color:#fff;font-weight:700;font-size:15px}
.cb-field{display:grid;gap:6px;font-size:13px;font-weight:600;color:var(--ink);min-width:0}
.cb-field>small,.cb-field small{font-weight:400;font-size:11.5px;color:var(--muted)}
.cb-field .input:disabled{background:var(--canvas);color:var(--muted)}
.cb-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cb-row.three{grid-template-columns:110px 110px minmax(0,1fr)}
.cb-cities{display:flex;flex-wrap:wrap;gap:6px;min-height:34px;align-items:center}
.cb-city{display:inline-flex;align-items:center;gap:5px;padding:6px 6px 6px 11px;border-radius:999px;background:var(--blue-soft);color:var(--blue);font-size:13px;font-weight:600}
.cb-city button{display:grid;place-items:center;width:20px;height:20px;border:0;border-radius:50%;background:#fff;color:var(--blue);cursor:pointer;font-size:14px;line-height:1}
.cb-city-find{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:8px}
.cb-country{text-transform:uppercase;text-align:center}
.cb-city-results{display:flex;flex-wrap:wrap;gap:6px}
.cb-media{display:grid;place-items:center;aspect-ratio:1.91/1;max-width:420px;border-radius:14px;overflow:hidden;background:var(--canvas);border:1px dashed #c9cbf7;color:var(--muted)}
.cb-media img{width:100%;height:100%;object-fit:cover}
.cb-media span{display:grid;justify-items:center;gap:6px}
.cb-media-tools{display:flex;flex-wrap:wrap;gap:8px}
.cb-copy-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:4px}
.cb-copy-head strong{font-size:14px;color:var(--ink)}
.cb-side{position:sticky;top:18px;display:grid;gap:10px;justify-items:center}
.cb-preview-label{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.cb-side .ca-meta-ad{width:100%}
.ca-meta-body{white-space:pre-line}
.ca-meta-body em{color:var(--muted)}
.ca-meta-art img{width:100%;height:100%;object-fit:cover}
.ca-meta-ad footer>div{min-width:0}
.ca-meta-ad footer>div small+strong+small{text-transform:none;letter-spacing:0;font-size:12px}
.cb-err{color:#b42318;font-size:12.5px;font-weight:600}
.cb-publish{position:sticky;bottom:12px;z-index:5;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 14px;align-items:center;
  padding:14px 16px;background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:18px;box-shadow:0 12px 32px -12px rgba(9,29,66,.28);backdrop-filter:blur(8px)}
.cb-delivery{display:flex;gap:8px;flex-wrap:wrap}
.cb-delivery button{display:grid;gap:2px;text-align:left;padding:9px 14px;border:1.5px solid var(--line);border-radius:12px;background:var(--card);cursor:pointer;font:inherit}
.cb-delivery strong{font-size:13.5px;color:var(--ink)}
.cb-delivery small{font-size:11.5px;color:var(--muted)}
.cb-delivery button.selected{border-color:var(--blue);background:var(--blue-soft)}
.cb-delivery button.live.selected{border-color:#d97706;background:#fff8eb}
.cb-go{grid-row:1/span 3;grid-column:2;min-height:48px;padding:0 22px;font-size:15px}
.cb-live-ok{grid-column:1;font-size:12.5px;color:#7a4a05}
.cb-publish .cb-err{grid-column:1}
.cb-publish .cb-err:empty{display:none}
.cb-strategy{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px 16px}
.cb-strategy summary{cursor:pointer;font-weight:600;color:var(--blue);font-size:13.5px}
.cb-strategy[open] summary{margin-bottom:12px}

/* Choose from Instagram. */
.ca-ig-head{display:flex;gap:12px;align-items:center;margin-bottom:14px}
.ca-ig-head img{width:44px;height:44px;border-radius:50%;object-fit:cover}
.ca-ig-head strong{display:block;font-size:15px;color:var(--ink)}
.ca-ig-head small{font-size:12.5px;color:var(--muted)}
.ca-ig-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;max-height:60vh;overflow:auto}
.ca-ig-item{position:relative;aspect-ratio:1;padding:0;border:2px solid transparent;border-radius:12px;overflow:hidden;background:var(--canvas);cursor:pointer}
.ca-ig-item img{width:100%;height:100%;object-fit:cover;display:block}
.ca-ig-item span{position:absolute;left:6px;bottom:6px;padding:2px 8px;border-radius:999px;background:rgba(9,29,66,.75);color:#fff;font-size:11px}
.ca-ig-item:hover{border-color:var(--blue)}
.ca-ig-item.busy{border-color:var(--blue);opacity:.6}
.ca-ig-loading{display:flex;align-items:center;gap:10px;color:var(--muted)}

@media(max-width:1100px){.cb-grid{grid-template-columns:1fr}.cb-side{position:static}}
@media(max-width:640px){
  .ca-rail.meta{grid-template-columns:repeat(4,minmax(64px,1fr))}
  .cb-row,.cb-row.three{grid-template-columns:1fr 1fr}
  .cb-row.three .cb-field:last-child{grid-column:1/-1}
  .cb-card{padding:16px}
  .cb-publish{grid-template-columns:1fr}
  .cb-go{grid-row:auto;grid-column:auto;width:100%}
  .ca-qprogress{min-width:120px}
  .ca-chat-head{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){.ca-chips,.cb-card{animation:none}.ca-chip:hover{transform:none}}
/* Builder polish: fields in a row line up at the top; the floating assistant never covers Publish. */
.cb-row{align-items:start}
.cb-field small.cb-ok{display:inline-flex;align-items:center;gap:4px;color:#0f7a4f;font-weight:600}
.cb-publish{margin-right:86px}
.cb-side .ca-meta-art{background:linear-gradient(135deg,var(--blue),var(--cyan-deep,#0e9e9a))}
.cb-side .ca-meta-art:has(img){padding:0;background:var(--canvas)}
@media(max-width:640px){.cb-publish{margin-right:0;bottom:86px}}

.cb-name-save{display:flex;gap:10px;align-items:center;margin-bottom:12px}.cb-field>.cb-field{margin-top:8px}.cb-city-results{max-height:220px;overflow-y:auto;padding:6px 0}

/* ---------------------------------------------------------------- adding to a campaign already in Meta */
/* The chat's first question: three cards right under it. Each says what it makes, what stays
   yours, and how long it takes — the little Campaign › Ad set › Ad map does the teaching. */
.ca-thread{position:relative}
.ca-start{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:2px 0 4px 37px;animation:ca-rise .32s both}
.ca-start-tile{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0;padding:16px 16px 14px;border:1.5px solid #d6d8f6;border-radius:16px;
  background:var(--card);color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:border-color .16s,box-shadow .16s,transform .16s}
.ca-start-tile:hover:not(:disabled){border-color:var(--blue);box-shadow:0 16px 32px -20px rgba(76,76,224,.6);transform:translateY(-2px)}
.ca-start-tile:focus-visible{outline:3px solid rgba(76,76,224,.28);outline-offset:2px;border-color:var(--blue)}
.ca-start-tile:disabled{cursor:not-allowed;background:#fafbfd;border-color:var(--line)}
.ca-start-tile:disabled .ca-start-icon{background:#eef0f4;color:#98a2b3}
.ca-start-tile:disabled .ca-tree{opacity:.55}
.ca-start-icon{display:grid;place-items:center;width:38px;height:38px;margin-bottom:4px;border-radius:11px;background:var(--blue-soft);color:var(--blue)}
.ca-start-title{font-size:15px;font-weight:700;line-height:1.3}
.ca-start-text{min-height:3em;font-size:12.5px;line-height:1.5;color:var(--muted)}
.ca-tree{list-style:none;display:grid;gap:5px;width:100%;margin:6px 0 2px;padding:10px;border-radius:12px;background:#f6f7fb}
.ca-tree li{position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;margin-left:calc(var(--lvl) * 14px);padding:5px 6px 5px 9px;
  border-radius:8px;font-size:12px;font-weight:600;color:#7a8597}
.ca-tree li+li::before{content:"";position:absolute;left:-9px;top:-6px;width:7px;height:calc(50% + 6px);border-left:1.5px solid #c9cdd8;border-bottom:1.5px solid #c9cdd8;border-bottom-left-radius:5px}
.ca-tree li.new{background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px #d6d8f6}
.ca-tree b{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;border-radius:999px;font-size:10.5px;font-weight:700;white-space:nowrap}
.ca-tree li.new b{background:var(--blue);color:#fff}
.ca-tree li.yours b{background:#e7f8f0;color:#0f7a4f}
.ca-start-foot{display:flex;align-items:center;gap:5px;width:100%;margin-top:auto;padding-top:6px;font-size:12px;font-weight:600;color:var(--muted)}
.ca-start-foot i{display:grid;place-items:center;width:30px;height:30px;margin-left:auto;border-radius:50%;background:var(--blue-soft);color:var(--blue);transition:background .16s,color .16s}
.ca-start-tile:hover:not(:disabled) .ca-start-foot i{background:var(--blue);color:#fff}
.ca-start-note{display:flex;align-items:center;gap:6px;margin:0 0 0 37px;font-size:12.5px;color:var(--muted)}
.ca-start-note svg{flex:none;color:var(--blue)}

/* Then the campaign, then the ad set: rows under the question, part of the conversation. */
.ca-picker{display:grid;gap:10px;margin:2px 0 4px 37px;animation:ca-rise .3s both}
.ca-pick-list{display:grid;gap:8px}
.ca-pick-item{display:flex;align-items:center;gap:12px;width:100%;min-height:58px;padding:11px 12px 11px 14px;border:1.5px solid #d6d8f6;border-radius:14px;
  background:var(--card);color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s}
.ca-pick-item:hover:not(:disabled){border-color:var(--blue);box-shadow:0 12px 26px -18px rgba(76,76,224,.6);transform:translateY(-1px)}
.ca-pick-item:focus-visible{outline:3px solid rgba(76,76,224,.28);outline-offset:2px;border-color:var(--blue)}
.ca-pick-item:disabled{cursor:not-allowed;border-color:var(--line);background:#fafbfd}
.ca-pick-item:disabled strong{color:#7a8597}
.ca-pick-item:disabled small{color:#8a6116}
.ca-pick-main{display:grid;gap:2px;flex:1;min-width:0}
.ca-pick-main strong{font-size:14px;font-weight:600;overflow-wrap:anywhere}
.ca-pick-main small{font-size:12.5px;line-height:1.45;color:var(--muted);overflow-wrap:anywhere}
.ca-pick-main small svg{vertical-align:-2px}
.ca-pick-dot{flex:none;width:9px;height:9px;border-radius:50%;background:#c3c9d4}
.ca-pick-dot.on{background:var(--green);box-shadow:0 0 0 3px rgba(16,185,129,.16)}
.ca-pick-state{flex:none;padding:3px 9px;border-radius:999px;background:#f0f2f6;color:#5b6779;font-size:11.5px;font-weight:600;white-space:nowrap}
.ca-pick-state.on{background:#e7f8f0;color:#0f7a4f}
.ca-pick-go{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:var(--blue-soft);color:var(--blue);transition:background .15s,color .15s}
.ca-pick-item:hover:not(:disabled) .ca-pick-go{background:var(--blue);color:#fff}
.ca-pick-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ca-pick-account{display:flex;align-items:center;gap:7px;color:var(--muted)}
.ca-pick-account .select{min-height:38px;max-width:260px;padding:6px 10px;font-size:13px}
.ca-pick-search{display:flex;align-items:center;gap:7px;flex:1;min-width:180px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--muted)}
.ca-pick-search input{flex:1;min-width:0;min-height:38px;border:0;outline:0;background:transparent;font:inherit;font-size:13.5px;color:var(--ink)}
.ca-pick-search:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px rgba(76,76,224,.14)}
.ca-pick-note{display:flex;align-items:center;gap:10px;margin:0;font-size:13px;color:var(--muted);line-height:1.5}
.ca-pick-off{padding-top:4px;border-top:1px dashed var(--line)}
.ca-pick-off summary{display:inline-flex;align-items:center;gap:6px;padding:6px 2px;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;list-style:none}
.ca-pick-off summary::-webkit-details-marker{display:none}
.ca-pick-off summary:hover{color:var(--blue)}
.ca-pick-off summary svg{transition:transform .2s}
.ca-pick-off[open] summary svg{transform:rotate(180deg)}
.ca-pick-off .ca-pick-item{margin-top:8px}

/* While the chat waits for a tap, the message box gives way to one helpful line. */
.ca-chat-foot.slim{display:flex;align-items:center;gap:12px;padding:12px 18px;background:#fbfbff}
.ca-foot-hint{display:flex;align-items:center;gap:7px;flex:1;margin:0;font-size:12.5px;line-height:1.45;color:#5b6779}
.ca-foot-hint svg{flex:none;color:var(--blue)}
.ca-foot-hint strong{color:var(--ink)}

/* "How it works" — the right-hand panel before the first question. */
.ca-guide-mark{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:12px;background:var(--blue-soft);color:var(--blue)}
.ca-glossary{display:grid;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.ca-glossary>span{font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--muted)}
.ca-glossary div{display:flex;gap:10px;align-items:flex-start}
.ca-glossary i{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:8px;background:#f2f4f8;color:var(--blue)}
.ca-glossary p{margin:0;font-size:12.5px;line-height:1.5;color:#5b6779}
.ca-glossary strong{display:block;font-size:13px;color:var(--ink)}

/* Where the new ad set or ad goes — replaces the platform and goal row once it is chosen. */
.ca-parent{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 14px;border:1px solid #c9cbf7;border-radius:14px;background:var(--blue-soft)}
.ca-parent-icon{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:10px;background:var(--blue);color:#fff}
.ca-parent-text{display:grid;gap:1px;flex:1;min-width:180px}
.ca-parent-text small{font-size:11.5px;font-weight:600;color:var(--blue);letter-spacing:.2px}
.ca-parent-text strong{font-size:14px;color:var(--ink);overflow-wrap:anywhere}
.ca-parent-text i{font-style:normal;margin:0 7px;color:var(--muted)}
.ca-parent-goal{padding:5px 11px;border-radius:999px;background:var(--card);color:var(--ink);font-size:12.5px;font-weight:600}
.ca-parent .ca-goal{min-height:36px;padding:5px 10px;font-size:13px;max-width:220px}
.ca-quick-page .ca-parent{max-width:760px;margin:0 auto 20px}
.ca-talk2 .ca-parent{width:100%;max-width:640px}
.ca-brief-into{display:flex;align-items:baseline;gap:5px;flex-wrap:wrap;margin:-2px 0 12px;padding:9px 11px;border-radius:11px;background:var(--blue-soft);font-size:12px;color:#5b6779;line-height:1.45}
.ca-brief-into svg{flex:none;align-self:center;color:var(--blue)}
.ca-brief-into strong{color:var(--ink);font-weight:600;overflow-wrap:anywhere}
.ca-brief-text small em.from-meta{background:#e7f8f0;color:#0f7a4f}

/* The builder: what already exists is shown locked; only the new part can be edited. */
.cb-existing{background:#fbfcfe;border-style:dashed}
.cb-existing .cb-num{background:#c3c9d4}
.cb-badge{display:inline-flex;align-items:center;gap:5px;margin-left:auto;padding:4px 10px;border-radius:999px;background:#e7f8f0;color:#0f7a4f;font-size:11.5px;font-weight:700;white-space:nowrap}
.cb-badge.new{background:var(--blue-soft);color:var(--blue)}
.cb-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px 16px;margin:0}
.cb-facts div{min-width:0}
.cb-facts dt{font-size:11.5px;color:var(--muted);font-weight:600}
.cb-facts dd{margin:2px 0 0;font-size:13.5px;color:var(--ink);overflow-wrap:anywhere}
.cb-shared{display:flex;align-items:flex-start;gap:7px;margin:4px 0 0;padding:9px 12px;border-radius:10px;background:var(--blue-soft);color:#3d4a60;font-size:12.5px;line-height:1.5}
.cb-shared svg{flex:none;margin-top:2px;color:var(--blue)}
.cb-child-note{display:flex;align-items:flex-start;gap:9px;margin:0;font-size:13px;color:#3d4a60;line-height:1.5}
.cb-child-note svg{flex:none;margin-top:2px;color:var(--blue)}
.ca-again{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:14px 0 4px;padding:12px 14px;border-radius:14px;background:var(--blue-soft)}
.ca-again>span{font-size:12.5px;font-weight:600;color:var(--blue)}
@media(max-width:640px){
  .ca-start,.ca-picker,.ca-start-note{margin-left:0}
  .ca-start{grid-template-columns:1fr}
  .ca-start-text{min-height:0}
  .ca-pick-item{align-items:flex-start}
  .ca-pick-state{display:none}
  .ca-pick-account{flex:1 1 100%}
  .ca-pick-account .select{max-width:none;flex:1}
  .ca-chat-foot.slim{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){
  .ca-start,.ca-picker{animation:none}
  .ca-start-tile:hover:not(:disabled),.ca-pick-item:hover:not(:disabled){transform:none}
}

/* How it works reads as steps, not as faint labels. */
.ca-guide .ca-brief-text small{font-size:12.5px;color:#3d4a60}
.ca-guide li.wait .ca-brief-text small{color:#7a8597}
.ca-guide header small{line-height:1.4}

/* ---------------------------------------------------------------- loading: the page's own shape, in soft grey */
.ca-sk .sk{display:block;height:12px;border-radius:999px}
.ca-sk-rail{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding:18px 22px;background:var(--card);border:1px solid var(--line);border-radius:18px}
.ca-sk-rail>div{display:grid;justify-items:center;gap:9px}
.ca-sk-dot{flex:none;width:26px!important;height:26px!important;border-radius:50%!important}
.ca-sk-status{display:flex;align-items:center;gap:10px;margin:0;font-size:13px;color:var(--muted)}
.ca-sk-status .loader{width:16px;height:16px}
.ca-sk-slow{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:-8px 0 0;padding:10px 14px;border-radius:12px;background:#fff8eb;color:#7a4a05;font-size:13px}
.ca-sk-slow[hidden]{display:none}
.ca-sk-card{display:grid;gap:14px;align-content:start;padding:18px;background:var(--card);border:1px solid var(--line);border-radius:20px}
.ca-sk-chat{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:start}
.ca-sk-chat>.ca-sk-card:first-child{min-height:420px}
.ca-sk-head{display:flex;align-items:center;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.ca-sk-head>div{display:grid;gap:7px;flex:1}
.ca-sk-avatar{flex:none;width:38px!important;height:38px!important;border-radius:11px!important}
.ca-sk-bubble{padding-left:37px}
.ca-sk-msg{height:40px!important;border-radius:16px!important;max-width:420px}
.ca-sk-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;padding-left:37px}
.ca-sk-choice{height:190px!important;border-radius:16px!important}
.ca-sk-row{display:flex;align-items:center;gap:10px}
.ca-sk-row .ca-sk-dot{width:22px!important;height:22px!important}
.ca-sk-h{height:20px!important}
.ca-sk-pill{height:28px!important}
.ca-sk-field{display:grid;gap:8px}
.ca-sk-input{height:42px!important;border-radius:12px!important}
.ca-sk-button{height:44px!important;border-radius:12px!important}
.ca-sk-talk{display:grid;justify-items:center;gap:18px;padding:36px 18px;background:var(--card);border:1px solid var(--line);border-radius:20px}
.ca-sk-orb{width:120px!important;height:120px!important;border-radius:50%!important}
.ca-sk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.ca-sk-tile{height:150px!important;border-radius:14px!important}
.ca-sk-item{cursor:default;border-color:var(--line)}
.ca-sk-item .ca-pick-main{gap:8px}
.ca-sk-item .sk{display:block;height:11px}
.ca-sk-badge{flex:none;width:58px!important;height:22px!important}
.ca-sk-square{display:block;aspect-ratio:1;border-radius:12px}
/* Could not load: what happened, that nothing is lost, and one way forward. */
.ca-load-error{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:22px 24px;background:var(--card);border:1px solid #f3c9c9;border-radius:18px}
.ca-load-error-icon{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:14px;background:#fff1f1;color:#b42318}
.ca-load-error>div{flex:1;min-width:220px}
.ca-load-error h2{margin:0 0 4px;font-size:16px;color:var(--ink)}
.ca-load-error p{margin:0 0 4px;font-size:13.5px;color:#9a3030;overflow-wrap:anywhere}
.ca-load-error small{font-size:12.5px;color:var(--muted)}
@media(max-width:1100px){.ca-sk-chat{grid-template-columns:1fr}.ca-sk-chat>.ca-sk-card:last-child{display:none}}
@media(max-width:640px){.ca-sk-rail{gap:8px;padding:14px}.ca-sk-rail .sk:not(.ca-sk-dot){display:none}.ca-sk-tiles,.ca-sk-bubble{padding-left:0}}
/* ---------------------------------------------------------------- changing an answer for this campaign */
.ca-chip.keep{border-color:#9fd9bd;background:#effaf4;color:#0f6a44;font-weight:600}
.ca-chip.keep:hover{border-color:#0f7a4f;background:#e2f6ec}
.ca-profile-used{display:flex;align-items:flex-start;gap:10px;margin:0 16px 10px;padding:11px 12px 11px 14px;border:1px solid #c9cbf7;border-radius:14px;background:var(--blue-soft);animation:ca-rise .3s both}
.ca-profile-used>svg{flex:none;margin-top:2px;color:var(--blue)}
.ca-profile-used>div{display:grid;gap:7px;flex:1;min-width:0}
.ca-profile-used strong{font-size:13px;color:var(--ink)}
.ca-profile-used>div>span{display:flex;flex-wrap:wrap;gap:6px}
.ca-profile-used small{font-size:12px;color:#5b6779;line-height:1.45}
.ca-profile-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border:1px solid #c9cbf7;border-radius:999px;background:var(--card);color:var(--blue);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:border-color .15s,background .15s}
.ca-profile-chip:hover,.ca-profile-chip:focus-visible{border-color:var(--blue);background:#fff}
.ca-profile-x{flex:none;width:28px;height:28px;border:0;border-radius:8px;background:transparent;color:var(--muted);font-size:18px;line-height:1;cursor:pointer}
.ca-profile-x:hover{background:rgba(255,255,255,.7);color:var(--ink)}
.ca-talk2 .ca-profile-used{width:100%;max-width:640px;margin:0;text-align:left}
.ca-brief-text small em.from-profile{background:#eef0ff;color:var(--blue)}
.ca-brief-change{display:inline-flex;align-items:center;gap:4px;margin-top:5px;padding:3px 9px;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--blue);font:inherit;font-size:11.5px;font-weight:600;cursor:pointer;opacity:.8;transition:opacity .15s,border-color .15s}
.ca-brief li:hover .ca-brief-change,.ca-brief-change:focus-visible{opacity:1;border-color:#c9cbf7}
.ca-answers{width:100%;max-width:640px;border:1px solid var(--line);border-radius:14px;background:var(--card);text-align:left}
.ca-answers summary{padding:11px 14px;font-size:13px;font-weight:600;color:var(--blue);cursor:pointer}
.ca-answers ul{list-style:none;margin:0;padding:0 14px 8px}
.ca-answers li{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--line)}
.ca-answers li>span{display:grid;gap:2px;flex:1;min-width:0}
.ca-answers small{font-size:11.5px;color:var(--muted)}
.ca-answers strong{font-size:13px;font-weight:500;color:var(--ink);overflow-wrap:anywhere}
.ca-answers em{font-size:12.5px;color:#a3adbd}
@media(max-width:640px){.ca-profile-used{margin:0 10px 10px}}
@media(prefers-reduced-motion:reduce){.ca-profile-used{animation:none}}

/* ---------------------------------------------------------------- Meta app in Development mode: the fix */
.ca-fix{margin:16px 0 4px;border:1px solid #d9dcf7;background:#f8f8ff;border-radius:14px;padding:16px 18px;color:var(--ink);text-align:left}
.ca-fix-lead{margin:0 0 10px;font-size:13.5px;line-height:1.6}
.ca-fix-steps{margin:0;padding-left:22px;display:grid;gap:14px}
.ca-fix-steps>li{font-size:13px;line-height:1.6;padding-left:4px}
.ca-fix-steps>li::marker{font-weight:700;color:var(--brand,#4c4ce0)}
.ca-fix-steps .btn{margin-top:8px;text-decoration:none}
.ca-fix-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;align-items:center;background:#fff;border:1px solid #e2e5f4;border-radius:10px;padding:8px 10px;margin-top:8px}
.ca-fix-copy span{grid-column:1/-1;font-size:11.5px;font-weight:600;color:var(--muted)}
.ca-fix-copy code{font-size:12.5px;color:var(--ink);overflow-wrap:anywhere;font-family:ui-monospace,Consolas,monospace}
.ca-fix-note{display:flex;gap:6px;align-items:flex-start;margin:8px 0 0;font-size:12px;line-height:1.55;color:#7a4a05;background:#fff6e8;border-radius:8px;padding:8px 10px}
.ca-fix-note svg{flex-shrink:0;margin-top:2px}
.ca-fix-details{margin-top:8px}
.ca-fix-details>summary{cursor:pointer;font-weight:700;font-size:12.5px;color:var(--brand,#4c4ce0)}
.ca-fix-details .ca-fix{margin-top:8px}
.cm-note-box.warn{background:#fff4e5;border-color:#f5c98a;color:#7a4a05}
.cm-note-box.warn>strong{display:flex;gap:6px;align-items:flex-start;font-size:13px;line-height:1.5}
.cm-note-box.warn>strong svg{flex-shrink:0;margin-top:2px}
@media(max-width:640px){.ca-fix{padding:14px}.ca-fix-copy{grid-template-columns:minmax(0,1fr)}.ca-fix-copy .btn{justify-self:start}}
/* ================================================================ Chat with AI, the ChatGPT way
   One white panel that fills the window: a slim header, the conversation centred in a 780px
   column, and one rounded message box that stays at the bottom. The agent writes plain text
   beside its mark; the owner's words sit in soft grey bubbles. The brief lives in a pop-up. */
#app:has(#campaignAiHost .ca-shell.gpt)>.cm-page-head,#app:has(#campaignAiHost .ca-shell.siri)>.cm-page-head{display:none}
.ca-shell.gpt,.ca-shell.siri{display:block}
.cg{display:flex;flex-direction:column;height:var(--fit,calc(100vh - 150px));min-height:480px;background:#fff;border:1px solid var(--line);border-radius:22px;
  box-shadow:0 1px 2px rgba(9,29,66,.04),0 18px 40px -26px rgba(9,29,66,.25);overflow:hidden;position:relative}
.cg-top{display:flex;align-items:center;gap:6px;padding:10px 12px 8px;position:relative;z-index:5;background:#fff}
.cg-spacer{flex:1}
.cg-pop-wrap{position:relative;min-width:0}
.cg-model{display:flex;align-items:center;gap:10px;min-width:0;max-width:100%;padding:6px 10px 6px 6px;border:0;border-radius:14px;background:transparent;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:background .15s}
.cg-model:hover,.cg-model[aria-expanded="true"]{background:#f3f4fb}
.cg-model>span:nth-child(2){display:grid;min-width:0}
.cg-model strong{font-size:15px;font-weight:700;line-height:1.2}
.cg-model small{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cg-model>svg{flex:none;color:var(--muted)}
.cg-model-mark,.cg-mark,.cg-hero-mark{display:grid;place-items:center;flex:none;border-radius:50%;color:#fff;background:linear-gradient(135deg,#4c4ce0 0%,#7c5cf0 55%,#19c7c3 120%);box-shadow:0 6px 14px -6px rgba(76,76,224,.6)}
.cg-model-mark{width:32px;height:32px}
.cg-live{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;background:#f3f4f8;color:var(--muted);font-size:11.5px;font-weight:600;white-space:nowrap}
.cg-live i{width:7px;height:7px;border-radius:50%;background:#b8bfcc}
.cg-live.on{background:#e9f9f1;color:#0f7a4f}.cg-live.on i{background:#10b981;box-shadow:0 0 0 3px rgba(16,185,129,.18)}
.cg-pill{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 13px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap;transition:border-color .15s,background .15s}
.cg-pill:hover,.cg-pill[aria-expanded="true"]{border-color:#c9cbf7;background:var(--blue-soft)}
.cg-pill.done{border-color:#bfe8cf;background:#effaf4;color:#0f6a44}
.cg-icon{display:grid;place-items:center;width:38px;height:38px;border:0;border-radius:12px;background:transparent;color:#4b5670;cursor:pointer;transition:background .15s,color .15s}
.cg-icon:hover{background:#f3f4fb;color:var(--blue)}
.cg-pop{position:absolute;top:calc(100% + 8px);left:0;z-index:40;min-width:330px;max-width:min(560px,calc(100vw - 40px));max-height:min(70vh,560px);overflow:auto;padding:14px;
  background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 24px 48px -16px rgba(9,29,66,.32);animation:ca-rise .18s both}
.cg-pop.right{left:auto;right:0}
.cg-pop .ca-setup{flex-direction:column;align-items:stretch;gap:14px;margin:0;max-width:none}
.cg-pop .ca-setup-field{justify-items:stretch}
.cg-pop .ca-segment{display:flex}.cg-pop .ca-segment button{flex:1;justify-content:center}
.cg-pop select.ca-goal{width:100%;min-width:0}
.cg-pop .ca-brief{border:0;box-shadow:none;padding:2px;border-radius:0}
.cg-pop .ca-parent{border:0;padding:4px;background:transparent}
.cg-scroll{flex:1;min-height:0;overflow-y:auto;position:relative;overscroll-behavior:contain}
.cg-col{width:100%;max-width:800px;margin:0 auto;padding:0 22px}
.cg-msg{display:flex;gap:14px;margin:20px 0}
.cg-msg.me{justify-content:flex-end}
.cg-mark{width:30px;height:30px;margin-top:1px}
.cg-bubble{max-width:min(75%,560px);padding:10px 16px;border-radius:20px;background:#f1f2f7;color:var(--ink);font-size:15px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}
.cg-photo{width:180px;max-width:60%;aspect-ratio:1;object-fit:cover;border-radius:18px;border:1px solid var(--line)}
.cg-text{flex:1;min-width:0;padding-top:4px;font-size:15px;line-height:1.7;color:#1d2840;overflow-wrap:anywhere}
.cg-text p{margin:0 0 10px}.cg-text p:last-child{margin-bottom:0}
.cg-text ul,.cg-text ol{margin:0 0 10px;padding-left:22px}.cg-text li{margin:3px 0}
.cg-text strong{color:var(--ink)}
.cg-typing{display:flex;gap:5px;align-items:center;height:30px}
.cg-typing i{width:7px;height:7px;border-radius:50%;background:#b9bdd6;animation:cg-dot 1.2s infinite ease-in-out}
.cg-typing i:nth-child(2){animation-delay:.15s}.cg-typing i:nth-child(3){animation-delay:.3s}
@keyframes cg-dot{0%,80%,100%{transform:translateY(0);opacity:.5}40%{transform:translateY(-5px);opacity:1}}
.cg-choices{margin:-6px 0 18px 44px}
.cg-choices .ca-start,.cg-choices .ca-picker{margin:0}
.cg-stack{flex:1;min-width:0;display:grid;gap:12px}
.cg-stack .ca-ready,.cg-stack .ca-resume{margin:0}
/* Cards the agent puts in the conversation: what it knows, what it noticed, the picture. */
.cg-card{flex:1;min-width:0;padding:14px 16px;border:1px solid var(--line);border-radius:18px;background:#fff}
.cg-card header{display:flex;align-items:center;gap:11px;margin-bottom:10px}
.cg-card header>div{flex:1;min-width:0}
.cg-card header strong{display:block;font-size:14.5px;color:var(--ink)}
.cg-card header small{display:block;font-size:12px;color:var(--muted);margin-top:1px}
.cg-card-mark{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:11px;background:var(--blue-soft);color:var(--blue)}
.cg-card-mark.cyan{background:var(--cyan-soft);color:var(--cyan-deep)}
.cg-card-act{display:inline-flex;align-items:center;gap:5px;padding:6px 11px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--blue);font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.cg-card-act:hover{border-color:#c9cbf7;background:var(--blue-soft)}
.cg-biz dl{display:grid;gap:8px;margin:0}
.cg-biz dl>div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:10px;align-items:baseline}
.cg-biz dt{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.cg-biz dt svg{color:var(--blue);flex:none}
.cg-biz dd{margin:0;font-size:13.5px;line-height:1.5;color:var(--ink)}
.cg-biz em{display:inline-flex;align-items:center;gap:3px;margin-left:6px;padding:1px 7px;border-radius:999px;background:#eef3ff;color:#2f5fd0;font-size:10.5px;font-style:normal;font-weight:700;vertical-align:1px}
.cg-sk{display:grid;gap:9px}.cg-sk .sk{height:12px;border-radius:6px}
.cg-insights ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.cg-insights li{position:relative;padding:8px 10px 8px 30px;border-radius:12px;background:#f7f8fc;font-size:13.5px;line-height:1.5;color:#26324d}
.cg-insights li::before{content:"";position:absolute;left:12px;top:15px;width:7px;height:7px;border-radius:50%;background:var(--cyan)}
.cg-card-note{margin:8px 0 0;font-size:12.5px;line-height:1.5;color:var(--muted)}
.cg-pic-row{display:flex;gap:10px;overflow-x:auto;padding:4px 2px 8px;scroll-snap-type:x proximity}
.cg-pic{position:relative;flex:none;display:block;width:118px;padding:0;border:2px solid transparent;border-radius:16px;background:#f1f2f7;overflow:hidden;cursor:pointer;scroll-snap-align:start;font:inherit;text-align:left;transition:border-color .15s,transform .15s,box-shadow .15s}
.cg-pic:hover{transform:translateY(-2px);box-shadow:0 10px 22px -14px rgba(9,29,66,.5)}
.cg-pic img{display:block;width:100%;aspect-ratio:1;object-fit:cover;background:#e8eaf3}
.cg-pic span{display:block;padding:6px 8px 7px;font-size:11.5px;font-weight:600;color:#3b4660;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cg-pic b{position:absolute;top:6px;left:6px;display:inline-flex;align-items:center;gap:3px;padding:2px 7px;border-radius:999px;background:#fff6db;color:#8a5a00;font-size:10.5px;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.cg-pic-n{position:absolute;top:6px;right:6px;display:grid;place-items:center;min-width:22px;height:22px;padding:0 5px;border-radius:999px;background:rgba(9,29,66,.78);color:#fff;font-size:11.5px;font-style:normal;font-weight:700}
.cg-pic.on{border-color:var(--blue);box-shadow:0 0 0 3px rgba(76,76,224,.2)}
.cg-pic.busy{opacity:.55;pointer-events:none}
.cg-pic.sk{height:148px;cursor:default;border:0}
.cg-pic.add{display:grid;place-content:center;justify-items:center;gap:6px;height:148px;border:2px dashed #cdd1e6;background:#fafbff;color:var(--blue)}
.cg-pic.add span{padding:0;color:var(--blue)}
.cg-pic.add:hover{border-color:var(--blue)}
/* The bottom of the panel: suggested answers, the box, and one quiet line of reassurance. */
.cg-foot{padding:6px 0 12px;background:linear-gradient(rgba(255,255,255,0),#fff 22px)}
.cg-chips{padding:0 0 8px;gap:7px}
.cg-chips>span{width:auto;margin-right:2px}
.cg-chips .ca-chip{padding:7px 14px;border-width:1px;font-size:13px}
.cg-composer{display:flex;align-items:flex-end;gap:4px;padding:7px 7px 7px 8px;border:1px solid #d7dbea;border-radius:28px;background:#fff;
  box-shadow:0 2px 6px rgba(9,29,66,.05),0 14px 30px -18px rgba(9,29,66,.35);transition:border-color .15s,box-shadow .15s}
.cg-composer:focus-within{border-color:#b9bcf4;box-shadow:0 0 0 4px rgba(76,76,224,.08),0 14px 30px -18px rgba(9,29,66,.35)}
.cg-composer textarea{flex:1;min-width:0;max-height:200px;padding:9px 6px;border:0;outline:0;resize:none;background:transparent;color:var(--ink);font:inherit;font-size:15px;line-height:1.5}
.cg-composer textarea::placeholder{color:#8f97ad}
.cg-tool,.cg-send{display:grid;place-items:center;flex:none;width:38px;height:38px;border:0;border-radius:50%;cursor:pointer;transition:background .15s,color .15s,transform .15s}
.cg-tool{background:transparent;color:#4b5670}
.cg-tool:hover{background:#f1f2f7;color:var(--ink)}
.cg-tool.on{background:#e5484d;color:#fff;animation:cg-pulse 1.6s ease-in-out infinite}
.cg-send{background:var(--navy);color:#fff}
.cg-send:hover:not(:disabled){transform:scale(1.05)}
.cg-send.voice{background:linear-gradient(135deg,#4c4ce0,#7c5cf0)}
.cg-send:disabled,.cg-tool:disabled{opacity:.4;cursor:not-allowed;transform:none}
.cg-composer.dictating{border-color:#f3b6b8;box-shadow:0 0 0 4px rgba(229,72,77,.08)}
.cg-fine{display:flex;justify-content:center;align-items:center;gap:5px;margin:8px 0 0;font-size:11.5px;color:var(--muted);text-align:center}
.cg-foot .ca-input-notice{margin:0 0 10px}
.cg-stepnote{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;border:1px solid var(--line);border-radius:18px;background:#fafbff}
/* A new chat: one question in the middle, the box under it, and the three ways in. */
.cg.cg-new .cg-scroll{display:flex;align-items:center}
.cg-hero{padding:5vh 0 28px;text-align:center}
.cg-hero-mark{width:56px;height:56px;margin:0 auto 14px}
.cg-hero h2{margin:0 0 8px;font-size:clamp(26px,3vw,34px);line-height:1.15;letter-spacing:-.8px;color:var(--ink)}
.cg-hero>p{max-width:560px;margin:0 auto 12px;font-size:14.5px;line-height:1.6;color:#5b6779}
.cg-known{display:inline-flex;align-items:center;gap:6px;margin:0 0 16px;padding:5px 12px;border-radius:999px;background:var(--blue-soft);color:var(--blue);font-size:12.5px;font-weight:600}
.cg-hero .cg-composer{margin:4px 0 18px;text-align:left}
.cg-hero .ca-start{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0;text-align:left}
.cg-hero .ca-start-tile{padding:14px;border-width:1px;border-radius:16px;gap:4px}
.cg-hero .ca-start-icon{width:32px;height:32px;border-radius:10px}
.cg-hero .ca-start-title{font-size:14px}
.cg-hero .ca-start-text{min-height:0;font-size:12px}
.cg-hero .ca-tree{display:none}
.cg-hero .ca-start-foot{padding-top:8px}
.cg-hero .ca-start-note{margin:10px 0 0;justify-content:center}
@media(max-width:760px){
  .cg{border-radius:18px;height:var(--fit,calc(100vh - 120px))}
  .cg-col{padding:0 14px}
  .cg-model small{max-width:46vw}
  .cg-live{display:none}
  .cg-hero .ca-start{grid-template-columns:1fr}
  .cg-biz dl>div{grid-template-columns:1fr;gap:2px}
  .cg-bubble{max-width:85%}
  .cg-choices{margin-left:0}
  .cg-msg{gap:10px}
}

/* ================================================================ Talk with AI, the Siri way
   A dark stage with one glowing orb. It breathes while idle, swirls while thinking, swells with
   the owner's voice and glows with the AI's (both read from the live audio), and everything the
   agent makes rises underneath as white cards that can also be tapped. */
.ca-talk2.cv{max-width:none;gap:0;padding:14px 18px 22px;border:0;border-radius:24px;box-shadow:none;text-align:center;background:radial-gradient(900px 520px at 50% 22%,#232a78 0%,#0d1238 52%,#070a1f 100%)}
.cv{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;min-height:var(--fit,calc(100vh - 150px));overflow:hidden;color:#e8ecff;
  background:#0d1238}
.cv::before{content:"";position:absolute;inset:-20%;z-index:-1;pointer-events:none;opacity:.55;
  background:radial-gradient(closest-side at 30% 30%,rgba(124,92,240,.35),transparent),radial-gradient(closest-side at 72% 64%,rgba(25,199,195,.22),transparent);animation:cv-drift 18s ease-in-out infinite alternate}
@keyframes cv-drift{to{transform:translate(4%,-3%) rotate(8deg)}}
.cv-top{align-self:stretch;display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.cv-brand{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:#d8ddff;letter-spacing:.2px}
.cv-status{display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(255,255,255,.07);color:#e8ecff;font-size:12.5px;font-weight:600}
.cv-status i{width:8px;height:8px;border-radius:50%;background:#8e98c4}
.cv[data-state=listening] .cv-status i{background:#34d399;box-shadow:0 0 0 3px rgba(52,211,153,.25);animation:ca-breathe 1.4s infinite}
.cv[data-state=speaking] .cv-status i{background:#c084fc;box-shadow:0 0 0 3px rgba(192,132,252,.25)}
.cv[data-state=thinking] .cv-status i,.cv[data-state=connecting] .cv-status i{background:#fbbf24;animation:ca-breathe .9s infinite}
.cv[data-state=muted] .cv-status i{background:#f87171}
.cv-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.08);color:#eef1ff;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;text-decoration:none;transition:background .15s}
.cv-chip:hover{background:rgba(255,255,255,.16)}
.cv-card .cv-chip{border-color:var(--line);background:#f4f5fb;color:var(--ink)}
.cv-card .cv-chip:hover{background:var(--blue-soft);color:var(--blue)}
.cv-center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;width:100%;max-width:720px;padding:26px 0 10px}
/* The orb. --mic and --ai are the live sound levels (0–1), --t keeps the swirl continuous across redraws. */
.cv-orb{--mic:0;--ai:0;--t:0;position:relative;width:min(240px,56vw);aspect-ratio:1;padding:0;border:0;border-radius:50%;background:radial-gradient(circle at 50% 50%,rgba(40,30,110,.9),rgba(10,12,40,.2) 70%);cursor:pointer;
  transform:scale(calc(1 + var(--ai) * .2 + var(--mic) * .1));transition:transform .12s ease-out,filter .3s;filter:drop-shadow(0 0 calc(26px + var(--ai) * 70px) rgba(124,92,255,.55))}
.cv-orb i{position:absolute;inset:0;border-radius:50%;mix-blend-mode:screen;filter:blur(14px);animation:cv-spin 9s linear infinite;animation-delay:calc(var(--t) * -1s)}
.cv-orb i:nth-child(1){background:radial-gradient(circle at 30% 34%,#ff5fa2 0,rgba(255,95,162,0) 58%)}
.cv-orb i:nth-child(2){background:radial-gradient(circle at 72% 30%,#5b8cff 0,rgba(91,140,255,0) 58%);animation-duration:11s;animation-direction:reverse}
.cv-orb i:nth-child(3){background:radial-gradient(circle at 56% 76%,#19c7c3 0,rgba(25,199,195,0) 60%);animation-duration:13s}
.cv-orb i:nth-child(4){background:radial-gradient(circle at 34% 70%,#a855f7 0,rgba(168,85,247,0) 60%);animation-duration:7s;animation-direction:reverse}
.cv-orb::before{content:"";position:absolute;inset:15%;border-radius:50%;background:radial-gradient(circle at 36% 30%,rgba(255,255,255,.9),rgba(255,255,255,.18) 30%,rgba(255,255,255,0) 62%);mix-blend-mode:screen;opacity:.5;pointer-events:none}
.cv-orb::after{content:"";position:absolute;inset:-9%;border-radius:50%;border:2px solid rgba(160,240,255,.5);pointer-events:none;opacity:calc(var(--mic) * 1.6);transform:scale(calc(1 + var(--mic) * .25));transition:opacity .1s,transform .1s}
.cv-orb-core{position:absolute;inset:0;display:grid;place-items:center;color:#fff;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}
.cv-orb:focus-visible{outline:3px solid rgba(160,240,255,.7);outline-offset:8px}
@keyframes cv-spin{to{transform:rotate(360deg)}}
@keyframes cv-breathe{50%{filter:brightness(1.2) saturate(1.15) drop-shadow(0 0 56px rgba(124,92,255,.75))}}
.cv[data-state=idle] .cv-orb{animation:cv-breathe 4.5s ease-in-out infinite}
.cv[data-state=idle] .cv-orb i{animation-duration:18s}
.cv[data-state=connecting] .cv-orb{opacity:.8;animation:cv-breathe 1.2s ease-in-out infinite}
.cv[data-state=thinking] .cv-orb{scale:.92}
.cv[data-state=thinking] .cv-orb i{animation-duration:2.4s}
.cv[data-state=speaking] .cv-orb{filter:saturate(1.35) drop-shadow(0 0 calc(40px + var(--ai) * 80px) rgba(168,85,247,.65))}
.cv[data-state=muted] .cv-orb{filter:grayscale(.75) brightness(.8)}
.cv-caption{max-width:640px;margin:0;font-size:clamp(18px,2.1vw,23px);font-weight:500;line-height:1.45;color:#f5f7ff;text-wrap:balance;min-height:1.45em}
.cv-heard{min-height:22px;margin:0;font-size:14.5px;font-style:italic;color:#9ea9da}
.cv-steps{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:6px 0 10px;padding:0;list-style:none}
.cv-steps li{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.06);color:#aab3dc;font-size:12px;font-weight:600}
.cv-steps li i{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.6}
.cv-steps li.now{background:rgba(255,255,255,.14);color:#fff}
.cv-steps li.done{background:rgba(25,199,195,.18);color:#9ff1ee}
.cv .ca-chips{justify-content:center;padding:0 0 10px;max-width:720px}
.cv .ca-chips>span{width:100%;text-align:center;color:#9ea9da}
.cv .ca-chip{border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#eef1ff}
.cv .ca-chip:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.3)}
.cv-cards{display:grid;gap:10px;width:100%;max-width:720px;margin:4px 0 6px;text-align:left}
.cv-card{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.96);color:var(--ink);box-shadow:0 14px 34px -16px rgba(0,0,0,.55)}
@keyframes cv-rise{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
.cv-card>div{flex:1;min-width:0}
.cv-card strong{display:block;font-size:14.5px;color:var(--ink)}
.cv-card small{display:block;margin-top:2px;font-size:12.5px;line-height:1.5;color:var(--muted)}
.cv-card .loader{flex:none;margin-top:4px}
.cv-card-mark{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:11px;background:var(--blue-soft);color:var(--blue)}
.cv-card-mark.ok{background:#e7f8f0;color:#0f7a4f}.cv-card-mark.warn{background:#fff4e5;color:#b45309}
.cv-card-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px}
.cv-card-actions .btn{text-decoration:none}
.cv-facts{display:flex;flex-wrap:wrap;gap:6px 14px;margin:8px 0 0;padding:0;list-style:none;font-size:12.5px;color:#3b4660}
.cv-facts li{display:inline-flex;align-items:center;gap:5px}.cv-facts svg{color:var(--blue)}
.cv-pic img{flex:none;width:96px;height:96px;object-fit:cover;border-radius:14px;border:1px solid var(--line)}
.cv-pic-empty{align-items:center}
.cv .ca-ready{margin:0;text-align:left}
.cv-cards .cg-pic-row{padding:2px 2px 6px}
.cv-count{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:50%;background:var(--blue);color:#fff;font-size:20px;font-weight:700;box-shadow:0 0 0 6px rgba(76,76,224,.18);animation:ca-breathe 1s infinite}
.cv-publish.counting{align-items:center}
.cv-live-ok{margin-top:10px;font-size:12.5px}
.cv-done{border:1px solid #bfe8cf}
.cv-stop .ca-fix{margin-top:10px}
.cv-controls{display:flex;justify-content:center;gap:14px;margin:12px 0 6px}
.cv-ctl{display:grid;place-items:center;width:56px;height:56px;border:1px solid rgba(255,255,255,.16);border-radius:50%;background:rgba(255,255,255,.1);color:#fff;cursor:pointer;transition:background .15s,transform .15s}
.cv-ctl:hover{background:rgba(255,255,255,.2);transform:translateY(-1px)}
.cv-ctl.off{background:#fff;color:#e5484d}
.cv-ctl.on{background:#fff;color:var(--blue)}
.cv-ctl.end{background:#e5484d;border-color:#e5484d}
.cv-ctl.end:hover{background:#d13438}
.cv-type{width:100%;max-width:640px;margin:8px 0 2px;text-align:left}
.cv-lang{display:inline-flex;align-items:center;gap:8px;margin-top:6px;font-size:12.5px;color:#aab3dc}
.cv-lang .select{min-height:34px;padding:4px 8px}
.cv-fine{max-width:560px;margin:10px 0 0;font-size:11.5px;line-height:1.5;color:#8f9bc9}
.cv .ca-input-notice{width:100%;max-width:720px;margin:12px 0 0;text-align:left}
.cv .ca-answers,.cv-transcript{width:100%;max-width:720px;margin-top:10px;border:0;border-radius:16px;background:rgba(255,255,255,.95);color:var(--ink);text-align:left}
.cv-transcript{padding:10px 14px}
.cv-transcript summary{color:var(--blue)}
.cv-transcript .cg-thread{max-height:320px;overflow:auto;padding-right:6px}
.cv-transcript .cg-msg{margin:12px 0}
.cv-transcript .cg-bubble,.cv-transcript .cg-text{font-size:14px}
.cv-editor-bar{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:0 0 14px}
.cv-editor-bar .ca-voice-active{margin:0}
@media(max-width:640px){
  .ca-talk2.cv{padding:12px 12px 18px;border-radius:18px}
  .cv-orb{width:min(200px,60vw)}
  .cv-card{padding:12px 13px}
  .cv-pic img{width:72px;height:72px}
  .cv-ctl{width:50px;height:50px}
}
@media(prefers-reduced-motion:reduce){
  .cv-orb,.cv-orb i,.cv::before,.cv-card.cv-in,.cg-msg.cg-in,.cg-typing i,.cv-count,.cg-tool.on{animation:none !important}
  .cv-orb{transition:none}
}