/* ==========================================================================
   AH SOLUTION — ai.css
   SOLUTION AI: activation core, holographic chat panel, mobile sheet.
   Complements styles.css + device.css (shares the same design tokens).
   ========================================================================== */

.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* ---------- Activation core (exact centre of the holographic construct) ---------- */
.ai-core{
  position:absolute;left:50%;top:50%;width:clamp(58px,13%,92px);aspect-ratio:1;
  transform:translate(-50%,-50%);z-index:4;
  border:0;padding:0;background:transparent;cursor:pointer;
  display:grid;place-items:center;border-radius:50%;
  -webkit-tap-highlight-color:transparent;
}
.ai-core:focus-visible{outline:2px solid var(--c-highlight);outline-offset:6px}
.ai-core__dot{
  width:24%;height:24%;border-radius:50%;
  background:radial-gradient(circle at 50% 40%,#ffffff 0%,#eafcff 32%,#48e5ff 70%,rgba(0,168,255,0) 100%);
  box-shadow:0 0 16px rgba(216,248,255,.92),0 0 40px rgba(72,229,255,.60),0 0 78px rgba(0,168,255,.40);
  animation:aiCorePulse 3.6s ease-in-out infinite;
  transition:transform .35s ease,filter .35s ease;
}
.ai-core__ring{
  position:absolute;inset:6%;border-radius:50%;
  border:1.5px solid transparent;
  border-top-color:rgba(72,229,255,.85);border-right-color:rgba(0,168,255,.55);
  box-shadow:0 0 22px rgba(72,229,255,.30);
  animation:aiCoreRing 6.5s linear infinite;
  transition:opacity .35s ease;
}
.ai-core__ripple{
  position:absolute;inset:0;border-radius:50%;border:2px solid rgba(72,229,255,.70);
  opacity:0;pointer-events:none;
}
.hero-core.is-activating .ai-core__ripple{animation:aiRipple .75s ease-out}
.hero-core.is-activating .ai-core__dot{transform:scale(1.35);filter:brightness(1.45)}
.ai-core[aria-expanded="true"] .ai-core__dot{transform:scale(1.2);filter:brightness(1.3)}
.ai-core:hover .ai-core__dot{transform:scale(1.15)}

.ai-core-label{
  position:absolute;left:50%;top:66%;transform:translateX(-50%);z-index:4;
  text-align:center;pointer-events:none;display:grid;gap:3px;
  transition:opacity .3s ease;
}
.ai-core-label b{
  font-family:var(--font-display);font-weight:700;font-size:12px;
  letter-spacing:.24em;color:#eafcff;text-shadow:0 0 14px rgba(72,229,255,.7);
}
.ai-core-label i{font-style:normal;font-size:10.5px;letter-spacing:.06em;color:var(--muted)}
.ai-core[aria-expanded="true"]~.ai-core-label{opacity:0}

@keyframes aiCorePulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@keyframes aiCoreRing{to{transform:rotate(360deg)}}
@keyframes aiRipple{
  0%{opacity:.85;transform:scale(.35)}
  100%{opacity:0;transform:scale(2.1)}
}

/* ---------- Holographic panel ---------- */
.ai-panel{
  position:absolute;right:-6px;bottom:44px;z-index:20;
  width:min(372px,90vw);max-height:min(544px,68vh);
  display:flex;flex-direction:column;overflow:hidden;
  background:linear-gradient(165deg,rgba(19,21,29,.97),rgba(9,10,15,.98));
  border:1px solid var(--line-2);border-radius:18px;
  box-shadow:0 34px 90px rgba(0,0,0,.66),inset 0 1px 0 rgba(255,255,255,.08),
             inset 0 0 46px rgba(159,176,200,.06);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  opacity:0;transform:translateY(16px) scale(.95);transform-origin:82% 100%;
  transition:opacity .26s ease,transform .34s cubic-bezier(.22,1,.36,1);
  pointer-events:none;
}
.ai-panel[hidden]{display:none}
.ai-panel.open{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}

.ai-panel__head{display:flex;align-items:center;gap:11px;padding:13px 14px;border-bottom:1px solid var(--line);flex:0 0 auto}
.ai-panel__spark{
  width:10px;height:10px;border-radius:50%;flex:0 0 auto;
  background:radial-gradient(circle,#ffffff,#d8f8ff 60%,#48e5ff);
  box-shadow:0 0 12px rgba(72,229,255,.9);
}
.ai-panel__id{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.ai-panel__id strong{font-family:var(--font-display);font-size:13.5px;letter-spacing:.14em}
.ai-panel__status{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.ai-panel__status[data-mode="ai"],
.ai-panel__status[data-mode="cloud"]{color:var(--c-highlight)}
.ai-panel__status[data-mode="local"]{color:var(--c-success)}
.ai-panel__status[data-mode="knowledge"]{color:#ffcf8a}
.ai-panel__status[data-mode="connecting"]{color:var(--c-info);animation:aiStatusPulse 1.2s ease-in-out infinite}
.ai-panel__status[data-mode="offline"]{color:var(--muted)}
.ai-panel__status[data-mode="error"]{color:var(--c-danger)}
.ai-agent-chip{display:inline-flex;align-items:center;gap:5px;margin-top:4px;padding:2px 8px;border:1px solid rgba(255,255,255,.14);border-radius:999px;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.ai-agent-chip[hidden]{display:none}
.ai-agent-chip__dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex:0 0 auto}
.ai-agent-chip[data-agent-state="online"]{color:var(--c-success);border-color:rgba(120,255,180,.35)}
.ai-agent-chip[data-agent-state="offline"]{color:var(--muted);opacity:.85}

.ai-icon-btn{
  display:grid;place-items:center;width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--muted);cursor:pointer;
  transition:color .2s,border-color .2s,background .2s;
}
.ai-icon-btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ai-icon-btn:hover{color:var(--text);border-color:var(--line-2);background:rgba(255,255,255,.06)}
.ai-icon-btn:focus-visible{outline:2px solid var(--c-highlight);outline-offset:2px}
.ai-icon-btn[aria-pressed="true"]{color:#fff;border-color:rgba(223,231,244,.6);background:rgba(159,176,200,.16);box-shadow:0 0 14px rgba(159,176,200,.3)}
.ai-icon-btn[data-ai-mic][aria-pressed="true"]{color:#fff;border-color:rgba(245,34,69,.7);background:rgba(245,34,69,.18);box-shadow:0 0 14px rgba(245,34,69,.4);animation:aiMicPulse 1.1s ease-in-out infinite}
.ai-icon-btn--voice[aria-pressed="true"]{color:#fff;border-color:rgba(72,229,255,.75);background:rgba(72,229,255,.18);box-shadow:0 0 16px rgba(72,229,255,.45);animation:aiVoicePulse 1.6s ease-in-out infinite}
.ai-icon-btn--voice:disabled{opacity:.6;cursor:progress}

/* Live voice state badge (only visible while a real session is active) */
.ai-voice-state{
  font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  padding:3px 8px;border-radius:999px;border:1px solid var(--line);
  background:rgba(255,255,255,.03);white-space:nowrap;flex:0 0 auto;
}
.ai-voice-state[data-state="connecting"]{color:var(--c-info);animation:aiStatusPulse 1.2s ease-in-out infinite}
.ai-voice-state[data-state="listening"]{color:var(--c-success)}
.ai-voice-state[data-state="processing"]{color:var(--c-highlight)}
.ai-voice-state[data-state="speaking"]{color:#eafcff;box-shadow:0 0 14px rgba(72,229,255,.35)}
.ai-voice-state[data-state="error"]{color:var(--c-danger)}
.ai-voice-audio{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}

/* Holographic state accents (driven from ai.js on state change only) */
.hero-core[data-holo-state="listening"] .ai-core__ring{border-top-color:rgba(72,229,255,.95);box-shadow:0 0 26px rgba(72,229,255,.5)}
.hero-core[data-holo-state="processing"] .ai-core__dot{animation-duration:1.6s}
.hero-core[data-holo-state="speaking"] .ai-core__dot{box-shadow:0 0 22px rgba(216,248,255,.95),0 0 54px rgba(72,229,255,.7),0 0 96px rgba(0,168,255,.5)}
.hero-core[data-holo-state="error"] .ai-core__ring{border-top-color:rgba(245,34,69,.9);border-right-color:rgba(245,34,69,.5);box-shadow:0 0 22px rgba(245,34,69,.4)}

.ai-panel__body{
  flex:1 1 auto;overflow-y:auto;padding:14px;
  display:flex;flex-direction:column;gap:12px;scrollbar-width:thin;
}
.ai-panel__body::-webkit-scrollbar{width:8px}
.ai-panel__body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:99px}

.ai-msg{display:flex;gap:9px;max-width:100%}
.ai-msg--user{justify-content:flex-end}
.ai-msg__avatar{
  width:24px;height:24px;border-radius:50%;flex:0 0 auto;margin-top:2px;
  background:radial-gradient(circle at 50% 40%,#d8f8ff,#48e5ff 70%);
  box-shadow:0 0 12px rgba(72,229,255,.6);
}
.ai-msg__bubble{
  padding:10px 13px;border-radius:14px;font-size:13.5px;line-height:1.55;
  max-width:85%;overflow-wrap:anywhere;
}
.ai-msg--ai .ai-msg__bubble{background:rgba(255,255,255,.045);border:1px solid var(--line);color:var(--text);border-bottom-left-radius:5px}
.ai-msg--user .ai-msg__bubble{background:linear-gradient(160deg,rgba(245,34,69,.92),rgba(157,16,42,.9));color:#fff;border-bottom-right-radius:5px}
.ai-msg--error .ai-msg__bubble{border-color:rgba(245,34,69,.5);background:rgba(245,34,69,.1)}
.ai-msg__bubble p{margin:0 0 7px}
.ai-msg__bubble p:last-child{margin-bottom:0}
.ai-msg__bubble a{color:var(--c-highlight)}
.ai-msg__bubble strong{color:#fff}
.ai-msg__actions{display:flex;gap:6px;margin-top:8px}

.ai-sources{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.ai-source{
  display:inline-flex;align-items:center;gap:5px;font-size:11px;padding:5px 9px;border-radius:999px;
  border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--muted);text-decoration:none;
}
.ai-source:hover{color:var(--c-highlight);border-color:rgba(223,231,244,.4)}
.ai-source svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

.ai-cards{display:grid;gap:8px;margin-top:10px}
.ai-card{
  display:flex;gap:10px;align-items:center;padding:8px;border-radius:12px;
  border:1px solid var(--line);background:rgba(255,255,255,.03);text-decoration:none;color:var(--text);
  transition:border-color .2s,background .2s;
}
.ai-card:hover{border-color:var(--line-2);background:rgba(255,255,255,.06)}
.ai-card__thumb{position:relative;width:92px;aspect-ratio:16/9;border-radius:8px;overflow:hidden;background:#05060a;flex:0 0 auto}
.ai-card--short .ai-card__thumb{width:52px;aspect-ratio:9/16}
.ai-card__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.ai-card__meta{min-width:0;display:flex;flex-direction:column;gap:3px}
.ai-card__meta strong{
  font-size:12.5px;font-weight:600;line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.ai-card__meta span{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

.ai-typing{display:inline-flex;gap:4px;align-items:center;height:18px}
.ai-typing i{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:aiTyping 1s infinite}
.ai-typing i:nth-child(2){animation-delay:.15s}
.ai-typing i:nth-child(3){animation-delay:.3s}

.ai-quick{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 10px}
.ai-quick button{
  font-size:11.5px;padding:6px 10px;border-radius:999px;cursor:pointer;
  border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--muted);
  transition:color .2s,border-color .2s;
}
.ai-quick button:hover{color:var(--c-highlight);border-color:rgba(223,231,244,.4)}

.ai-composer{border-top:1px solid var(--line);padding:10px 12px 8px;flex:0 0 auto;background:rgba(255,255,255,.015)}
.ai-composer__input{
  width:100%;resize:none;border:0;outline:0;background:transparent;color:var(--text);
  font-family:var(--font-body);font-size:13.5px;line-height:1.5;
  min-height:24px;max-height:96px;padding:4px 2px;overflow-y:auto;
}
.ai-composer__input::placeholder{color:var(--muted-2)}
.ai-composer__bar{display:flex;align-items:center;gap:6px;margin-top:6px}
.ai-composer__spacer{flex:1}
.ai-lang select{
  background:rgba(255,255,255,.04);color:var(--muted);border:1px solid var(--line);
  border-radius:9px;height:34px;padding:0 6px;font-size:12px;cursor:pointer;
}
.ai-lang select:focus-visible{outline:2px solid var(--c-highlight);outline-offset:2px}
.ai-send{
  width:36px;height:36px;border-radius:11px;border:0;cursor:pointer;display:grid;place-items:center;
  background:linear-gradient(160deg,var(--red-hot),var(--red-deep));color:#fff;
  box-shadow:0 8px 22px rgba(245,34,69,.4);transition:filter .2s,transform .15s;
}
.ai-send svg{width:18px;height:18px;fill:currentColor;stroke:none}
.ai-send:hover{filter:brightness(1.1)}
.ai-send:active{transform:scale(.94)}
.ai-send:disabled{opacity:.5;cursor:not-allowed;filter:none}
.ai-send:focus-visible{outline:2px solid var(--c-highlight);outline-offset:2px}

.ai-panel__foot{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:8px 14px;border-top:1px solid var(--line);font-size:10.5px;color:var(--muted-2);
}
.ai-text-btn{background:none;border:0;color:var(--muted);cursor:pointer;font-size:11px;text-decoration:underline;text-underline-offset:2px}
.ai-text-btn:hover{color:var(--red-2)}
.ai-text-btn:disabled{opacity:.55;cursor:default;text-decoration:none}
.ai-msg--error .ai-text-btn{color:var(--c-danger)}

@keyframes aiTyping{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-2px)}}
@keyframes aiMicPulse{0%,100%{box-shadow:0 0 10px rgba(245,34,69,.35)}50%{box-shadow:0 0 22px rgba(245,34,69,.65)}}
@keyframes aiVoicePulse{0%,100%{box-shadow:0 0 10px rgba(72,229,255,.35)}50%{box-shadow:0 0 22px rgba(72,229,255,.7)}}
@keyframes aiStatusPulse{0%,100%{opacity:.55}50%{opacity:1}}

/* ---------- Scroll lock while the panel is open ---------- */
@media(min-width:768px){
  html.ai-locked .device-screen{overflow:hidden}
  html.ai-locked.device-wide,html.ai-locked.device-wide body{overflow:hidden}
}

/* ---------- Tablet ---------- */
@media(max-width:1024px) and (min-width:768px){
  .ai-panel{width:min(330px,80vw);max-height:min(500px,62vh)}
}

/* ---------- Mobile: bottom sheet ---------- */
@media(max-width:767px){
  .ai-core-label{display:none}
  .ai-panel{
    position:fixed;left:0;right:0;bottom:0;top:auto;width:100%;
    max-height:82vh;border-radius:20px 20px 0 0;border-bottom:0;
    transform:translateY(100%);transform-origin:center bottom;
    box-shadow:0 -24px 70px rgba(0,0,0,.7);
  }
  .ai-panel.open{transform:translateY(0)}
  .ai-panel__body{padding:16px}
  .ai-panel__head::before{
    content:"";position:absolute;left:50%;top:7px;width:38px;height:4px;margin-left:-19px;
    border-radius:99px;background:rgba(255,255,255,.22);
  }
  .ai-panel__head{position:relative;padding-top:16px}
  .ai-card__thumb{width:84px}
  html.ai-locked,html.ai-locked body{overflow:hidden}
}

/* ---------- Reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
  .ai-core__dot,.ai-core__ring,.ai-icon-btn[data-ai-mic][aria-pressed="true"],.ai-icon-btn--voice[aria-pressed="true"]{animation:none}
  .ai-panel{transition:opacity .01s}
  .hero-core.is-activating .ai-core__ripple{animation:none;opacity:.45}
  .ai-typing i{animation:none;opacity:.6}
  .ai-panel__status[data-mode="connecting"],.ai-voice-state[data-state="connecting"]{animation:none}
}