/* Pneuma - the SharpShooter built-in AI (Kinsley and Kane's voices) - chat page. Uses the site's palette (style.css): earth, gold, paper. */
.ai-wrap{max-width:1240px}
section:has(.ai-app){padding-top:14px;padding-bottom:14px}
.ai-app{display:flex;flex-direction:column;height:calc(100dvh - 150px);min-height:480px;background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);overflow:hidden}
.ai-head{flex:none;display:flex;flex-wrap:wrap;align-items:center;gap:10px;justify-content:space-between;padding:8px 12px;background:var(--earth);color:#f3e2bd}
.ai-brand{display:flex;align-items:center;gap:8px;font-family:var(--display);font-size:18px;letter-spacing:.04em;color:var(--gold)}
.ai-brand img{border-radius:9px}
.ai-who{display:flex;gap:4px;background:#241a13;border-radius:12px;padding:3px}
.ai-persona{display:flex;align-items:center;gap:7px;border:0;background:transparent;color:#d9c9ad;padding:4px 11px 4px 4px;border-radius:10px;cursor:pointer;font:inherit;text-align:left}
.ai-persona img{border-radius:50%;flex:none}
.ai-persona b{display:block;font-family:var(--display);font-size:14.5px;line-height:1.1;color:inherit}
.ai-persona.on{background:var(--gold);color:var(--earth)}
.ai-persona.on[data-persona="kinsley"]{background:#f2a3cb}
.ai-persona.on[data-persona="kane"]{background:#a9c1ee}
.ai-persona:focus-visible{outline:2px solid var(--gold-soft);outline-offset:2px}
.ai-tools{display:flex;flex-wrap:wrap;gap:6px}
.ai-btn{display:inline-flex;align-items:center;border:1px solid #5a4533;background:transparent;color:#f3e2bd;border-radius:10px;padding:6px 11px;font:600 13px var(--display);cursor:pointer;text-decoration:none!important}
.ai-btn:hover{border-color:var(--gold);color:var(--gold)}
.ai-btn.on{background:var(--gold);color:var(--earth);border-color:var(--gold)}
.ai-btn[hidden]{display:none}
.ai-body{flex:1 1 auto;min-height:0;display:flex;position:relative}
.ai-main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column}
/* your chats (26 Sep 2026: "set the window up the same as yours with the side bar chat history") */
.ai-side{flex:none;width:260px;display:flex;flex-direction:column;gap:6px;padding:12px 10px;background:#211811;color:#e9dcc4;border-right:1px solid #3a2b1f;overflow-y:auto}
.ai-side.shut{display:none}
.ai-side-btn{display:grid;place-items:center;width:36px;height:36px;border:1px solid #5a4533;border-radius:10px;background:transparent;color:#f3e2bd;cursor:pointer}
.ai-side-btn:hover{border-color:var(--gold);color:var(--gold)}
.ai-new-chat{border:0;border-radius:11px;background:var(--gold);color:var(--earth);font:700 14px var(--display);padding:10px 12px;cursor:pointer;text-align:left}
.ai-new-chat:hover{filter:brightness(1.06)}
.ai-side-hi{margin:6px 4px 0;font:600 13px var(--display);color:#f3e2bd}
.ai-side-note,.ai-side-empty{margin:6px 4px;font-size:12px;color:#a8977e;line-height:1.35}
.ai-chats{display:flex;flex-direction:column;flex-wrap:nowrap;gap:1px;margin:0;align-self:stretch;min-width:0}
.ai-day{margin:12px 6px 3px;font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:#a8977e}
.ai-chat{position:relative;display:flex;flex-wrap:wrap;align-items:center;border-radius:9px}
.ai-chat:hover,.ai-chat.on{background:#33261b}
.ai-chat.on{box-shadow:inset 3px 0 0 var(--gold)}
.ai-chat-open{flex:1;min-width:0;border:0;background:transparent;color:#e9dcc4;font:14px var(--body);text-align:left;padding:8px 6px 8px 10px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ai-chat-del{flex:none;width:28px;height:28px;border:0;border-radius:7px;background:transparent;color:#a8977e;font-size:18px;line-height:1;cursor:pointer;opacity:0}
.ai-chat:hover .ai-chat-del,.ai-chat.on .ai-chat-del,.ai-chat-del:focus-visible{opacity:1}
.ai-chat-del:hover{color:#f6dcd6;background:#4a2a22}
.ai-chat-sure{flex-basis:100%;display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:4px 8px 8px 10px;font-size:12.5px;color:#f3e2bd}
.ai-chat-sure button{border:1px solid #5a4533;background:transparent;color:#f3e2bd;border-radius:7px;padding:3px 9px;font:600 12px var(--display);cursor:pointer}
.ai-chat-sure button:first-of-type{background:#8f1f1f;border-color:#8f1f1f;color:#fff}
.ai-log{flex:1 1 auto;min-height:0;overflow-y:auto;padding:14px 14px 8px;display:flex;flex-direction:column;gap:12px;background:var(--paper)}
.ai-msg{max-width:88%;border-radius:16px;padding:10px 14px;line-height:1.5;font-size:15.5px;overflow-wrap:anywhere}
.ai-me{align-self:flex-end;background:var(--earth-2);color:#f6ecdb;border-bottom-right-radius:6px;white-space:pre-wrap}
.ai-her{align-self:flex-start;background:var(--card);border:1px solid var(--line);border-bottom-left-radius:6px;box-shadow:0 1px 2px rgba(33,27,22,.05)}
.ai-her.ai-kane{border-left:4px solid #6f8fd0}
.ai-her.ai-kinsley{border-left:4px solid #e57fb4}
.ai-name{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:4px}
.ai-name b{font-family:var(--display);font-size:14px}
.ai-face{border-radius:50%}
.ai-tag{font-size:11.5px;background:var(--paper-2);border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:1px 8px}
.ai-text p{margin:.35em 0}.ai-text ul,.ai-text ol{margin:.35em 0 .35em 1.2em;padding:0}.ai-text li{margin:.15em 0}
.ai-text h4{margin:.6em 0 .2em;font-size:15px}
.ai-table-wrap{overflow-x:auto;margin:.45em 0}.ai-text table{border-collapse:collapse;font-size:13.5px;min-width:60%}
.ai-text th,.ai-text td{border:1px solid #d8cbb4;padding:5px 8px;text-align:left;vertical-align:top}.ai-text th{background:#f3ead9;font-weight:600}
.ai-text code{font-size:14px}
.ai-text pre{position:relative;background:#1d1611;color:#f3e2bd;border-radius:10px;padding:12px;overflow-x:auto;margin:.5em 0}
.ai-text pre code{background:none;color:inherit;padding:0;word-break:normal;white-space:pre}
.ai-copy{position:absolute;top:6px;right:6px;font:inherit;font-size:.78em;padding:2px 9px;border-radius:7px;border:1px solid #6b5a45;background:#2b2119;color:#f3e2bd;cursor:pointer;opacity:.85}
.ai-copy:hover,.ai-copy:focus{opacity:1}
.ai-card,.ai-calc{margin-top:8px;border:1px solid var(--line);border-radius:12px;background:var(--paper);padding:6px 10px}
.ai-card summary,.ai-calc summary{cursor:pointer;font:600 13.5px var(--display);color:var(--ink)}
.ai-card .ai-text{font-size:14.5px;max-height:360px;overflow-y:auto}
.ai-source{margin:.4em 0 0;font-size:12.5px;color:var(--muted)}
.ai-calc-form{margin-top:8px}
.ai-calc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px}
.ai-calc-grid label{display:flex;flex-direction:column;gap:3px;font-size:12.5px;color:var(--muted)}
.ai-calc-grid label.req span::after{content:" *";color:var(--gold-deep)}
.ai-calc-grid input{font:15px var(--body);padding:7px 9px;border:1px solid var(--line);border-radius:9px;background:var(--card);color:var(--ink);min-width:0}
.ai-calc-grid input.need{border-color:var(--gold-deep);box-shadow:0 0 0 2px rgba(200,150,40,.18)}
.ai-calc-row{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}
.ai-calc-row select{font:14px var(--body);padding:8px;border:1px solid var(--line);border-radius:9px;background:var(--card);color:var(--ink)}
.ai-calc-row .ai-send{height:40px}
.ai-calc-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.ai-calc-list button{font:13px var(--body);border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:999px;padding:5px 11px;cursor:pointer}
.ai-calc-list button:hover{border-color:var(--gold-deep)}
.ai-rate{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;font-size:13px;color:var(--muted)}
.ai-rate button{font:600 12.5px var(--display);border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:8px;padding:4px 10px;cursor:pointer}
.ai-rate button:hover{border-color:var(--gold-deep)}
.ai-note{align-self:center;font-size:13.5px;color:var(--muted);background:var(--paper-2);border-radius:10px;padding:6px 12px}
.ai-note.bad{color:#7a1a1a;background:#f6dcd6}
.ai-note.ai-qr{display:flex;flex-direction:column;align-items:center;gap:6px;max-width:360px;text-align:center}
.ai-note.ai-qr img{background:#fff;padding:8px;border-radius:12px}
.ai-note.ai-qr p{margin:0}
.ai-wait{animation:ai-pulse 1.4s ease-in-out infinite}
@keyframes ai-pulse{50%{opacity:.45}}
.ai-try{flex:none;display:flex;flex-wrap:wrap;gap:6px;padding:8px 12px 0;background:var(--card)}
.ai-try[hidden]{display:none}
.ai-chip{font:13.5px var(--body);border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:999px;padding:6px 12px;cursor:pointer;text-align:left}
.ai-chip:hover{border-color:var(--gold-deep)}
.ai-chip[data-calcs]{background:var(--gold);border-color:var(--gold);color:var(--earth);font-weight:600}
.ai-ask{flex:none;display:flex;align-items:flex-end;gap:8px;padding:10px 12px 6px;background:var(--card);border-top:1px solid var(--line)}
.ai-ask textarea{flex:1;resize:none;min-height:44px;max-height:160px;border:1px solid var(--line);border-radius:14px;padding:10px 14px;font:16px/1.4 var(--body);background:var(--paper);color:var(--ink)}
.ai-ask textarea:focus{outline:2px solid var(--gold);border-color:var(--gold)}
.ai-mic{flex:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--earth);cursor:pointer;display:grid;place-items:center}
.ai-mic:hover{border-color:var(--gold-deep)}
.ai-mic.live{background:#8f1f1f;color:#fff;border-color:#8f1f1f;animation:ai-pulse 1.1s ease-in-out infinite}
.ai-mic.off{opacity:.55}
/* 29 Sep 2026: attach a file, take a photo */
.ai-attach,.ai-cam{flex:none;width:40px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--earth);cursor:pointer;display:grid;place-items:center}
.ai-attach:hover,.ai-cam:hover{border-color:var(--gold-deep)}
.ai-attach:focus-visible,.ai-cam:focus-visible{outline:2px solid var(--gold)}
.ai-file{display:flex;align-items:center;gap:10px;margin:6px 12px 0;padding:6px 8px 6px 14px;border:1px dashed var(--gold-deep);border-radius:12px;background:var(--paper);color:var(--ink);font-size:14px}
.ai-file span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ai-file button,.ai-webcam button{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:10px;padding:6px 12px;cursor:pointer;font:inherit}
.ai-webcam{margin:6px 12px 0;padding:8px;border:1px solid var(--line);border-radius:14px;background:var(--card);display:grid;gap:8px}
.ai-webcam video{width:100%;max-height:48vh;border-radius:10px;background:#000}
.ai-webcam div{display:flex;gap:8px;justify-content:flex-end}
.ai-webcam .ai-snap{background:var(--gold);border-color:var(--gold-deep);color:#1b130c;font-weight:600}
.ai-file[hidden],.ai-webcam[hidden]{display:none}
.ai-thumb{display:block;max-width:160px;max-height:160px;border-radius:8px;margin-top:6px}
.ai-att{font-size:13px;opacity:.8;margin-top:4px}
@media (max-width:420px){.ai-ask{gap:6px;padding-left:8px;padding-right:8px}.ai-attach,.ai-cam,.ai-mic{width:38px;height:40px}}
.ai-send{flex:none;height:44px;border:0;border-radius:14px;background:var(--gold);color:var(--earth);font:700 15px var(--display);padding:0 18px;cursor:pointer}
.ai-send:disabled{opacity:.6;cursor:wait}
.ai-send.ai-stop{background:#8f1f1f;color:#fff}
.ai-her.ai-stopped{opacity:.8}
.ai-small{flex:none;margin:0;padding:0 14px 4px;font-size:11.5px;line-height:1.35;color:var(--muted);background:var(--card)}
.ai-voices{flex:none;padding:0 14px 8px;background:var(--card);font-size:12.5px;color:var(--muted)}
.ai-voices summary{cursor:pointer}
.ai-voice-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.ai-voice-row label{display:flex;flex-direction:column;gap:3px;font-size:12.5px}
.ai-voice-row select{max-width:280px;font:13px var(--body);padding:4px}
.ai-gate{max-width:680px;margin:30px auto}
.ai-notice{max-height:52vh;overflow-y:auto;border:1px solid var(--line);border-radius:12px;background:var(--paper);padding:10px 16px;margin:12px 0;font-size:14.5px;line-height:1.5}
.ai-notice h2{font-size:18px;margin:.4em 0}.ai-notice h3{font-size:15px;margin:.9em 0 .2em}.ai-notice ul{margin:.2em 0 .2em 1.2em;padding:0}
@media (max-width:900px){
  .ai-side{position:absolute;top:0;bottom:0;left:0;z-index:6;width:min(290px,86%);box-shadow:8px 0 24px rgba(0,0,0,.35)}
  .ai-side:not(.open){display:none}
}
@media (max-width:640px){
  body:has(.ai-app) header.top nav,body:has(.ai-app) footer{display:none}
  section:has(.ai-app){padding:6px 0}
  .ai-app{height:calc(100dvh - 80px);min-height:400px;border-radius:12px}
  .ai-msg{max-width:94%}
  .ai-brand b{display:none}
  .ai-head{padding:6px 8px;gap:6px}
  .ai-tools .ai-btn{padding:5px 8px;font-size:12px}
  .ai-tools a.ai-btn{display:none}
  .ai-try{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px}
  .ai-chip{white-space:nowrap}
}
/* installed as its own app: the chat fills the whole window, whatever its size */
@media (display-mode: standalone){
  header.top,footer{display:none}
  body:has(.ai-app){overflow:hidden}
  .ai-app{position:fixed;inset:0;height:auto;min-height:0;border-radius:0;border:0;box-shadow:none;z-index:50}
  .ai-log{padding-left:max(14px,calc((100% - 900px)/2));padding-right:max(14px,calc((100% - 900px)/2))}
}
@media (prefers-reduced-motion: reduce){.ai-wait,.ai-mic.live{animation:none}}
.ai-side-btn:focus-visible,.ai-chat-open:focus-visible,.ai-new-chat:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
/* 29 Sep 2026: the program brief box */
.ai-brief{margin-top:10px;border:1px solid var(--line);border-radius:12px;background:var(--paper);padding:10px 12px;display:grid;gap:8px}
.ai-brief-title{font:600 13.5px var(--display);color:var(--ink)}
.ai-brief-row{display:grid;gap:3px}
.ai-brief-row span{font-size:12.5px;font-weight:600;color:var(--ink)}
.ai-brief-row textarea{width:100%;box-sizing:border-box;font:inherit;font-size:14px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;resize:vertical;min-height:34px;background:#fff;color:#1c1510}
.ai-brief-go{justify-self:start;font:600 13px var(--display);border:1px solid var(--gold-deep);background:var(--gold);color:#1c1510;border-radius:8px;padding:6px 12px;cursor:pointer}
.ai-brief-go:disabled{opacity:.55;cursor:default}
/* 29 Sep 2026: Pneuma search results */
.ai-results{margin-top:10px;border:1px solid var(--line);border-radius:12px;background:var(--paper);padding:10px 12px}
.ai-results-title{font:600 13.5px var(--display);color:var(--ink);margin-bottom:6px}
.ai-results-list{margin:0;padding-left:1.4em;display:grid;gap:8px}
.ai-results-list li{font-size:14px;line-height:1.4;overflow-wrap:anywhere}
.ai-results-link{font-weight:600;color:var(--gold-deep);text-decoration:underline;text-underline-offset:2px}
.ai-results-link:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.ai-results-meta{font-size:12.5px;color:var(--muted)}
.ai-results-snippet{font-size:13px;color:var(--ink)}
.ai-results-note,.ai-results-credit{margin:.5em 0 0;font-size:12.5px;color:var(--muted)}
.ai-results-credit a{color:var(--muted)}
/* 29 Sep 2026: her thinking line shimmers while she works on a question */
.ai-thinking{background:linear-gradient(90deg,var(--muted) 0%,var(--muted) 35%,var(--ink) 50%,var(--muted) 65%,var(--muted) 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:ai-shimmer 1.8s linear infinite}
@keyframes ai-shimmer{from{background-position:100% 0}to{background-position:0 0}}
@media (prefers-reduced-motion: reduce){.ai-thinking{animation:none;background:none;color:var(--muted)}}
/* 29 Sep 2026: while she talks, the chosen voice's picture fades, then pulses brighter, like a heartbeat */
.ai-persona[data-persona="kinsley"]{--ai-beat:#f0a2e6}
.ai-persona[data-persona="kane"]{--ai-beat:#9ccbff}
.ai-talking .ai-persona.on img{animation:ai-heartbeat 1.15s ease-in-out infinite;will-change:transform,opacity,filter}
@keyframes ai-heartbeat{
0%{opacity:1;transform:scale(1);filter:brightness(1) drop-shadow(0 0 0 var(--ai-beat))}
30%{opacity:.45;transform:scale(.95);filter:brightness(.8) drop-shadow(0 0 0 var(--ai-beat))}
41%{opacity:1;transform:scale(1.24);filter:brightness(1.6) drop-shadow(0 0 8px var(--ai-beat))}
52%{opacity:.9;transform:scale(1.03);filter:brightness(1.15) drop-shadow(0 0 3px var(--ai-beat))}
63%{opacity:1;transform:scale(1.14);filter:brightness(1.4) drop-shadow(0 0 6px var(--ai-beat))}
87%,100%{opacity:1;transform:scale(1);filter:brightness(1) drop-shadow(0 0 0 var(--ai-beat))}}
@keyframes ai-heartbeat-soft{0%,100%{opacity:1;filter:brightness(1)}30%{opacity:.55;filter:brightness(.85)}45%{opacity:1;filter:brightness(1.5)}}
@media (prefers-reduced-motion: reduce){.ai-talking .ai-persona.on img{animation:ai-heartbeat-soft 2.3s ease-in-out infinite}}
