/* JDRC_AI_COACHING_COMPUTER_UI_V1
   Shared presentation layer for AI-only surfaces:
   Race Setup Coach, PIT OS Race Engineer, Track Advisor.
   No membership, rewards, sweepstakes, advertiser, backend or API behavior.
*/
.jdrc-ai-computer{
  --jdrc-ai-line:rgba(99,230,255,.46);
  --jdrc-ai-line-soft:rgba(99,230,255,.16);
  --jdrc-ai-glow:rgba(99,230,255,.12);
  --jdrc-ai-green:#7ef0a8;
  --jdrc-ai-amber:#ffd166;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-color:var(--jdrc-ai-line)!important;
  background:
    linear-gradient(rgba(99,230,255,.026) 1px,transparent 1px),
    linear-gradient(90deg,rgba(99,230,255,.026) 1px,transparent 1px),
    radial-gradient(circle at 84% 8%,rgba(99,230,255,.10),transparent 28%),
    linear-gradient(180deg,rgba(8,18,24,.97),rgba(6,10,14,.985))!important;
  background-size:24px 24px,24px 24px,auto,auto;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02),0 18px 48px rgba(0,0,0,.26);
}
.jdrc-ai-computer::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:linear-gradient(110deg,transparent 0 45%,rgba(99,230,255,.025) 50%,transparent 55% 100%);
  background-size:220% 100%;
}
.jdrc-ai-computer>*{position:relative;z-index:2}
.jdrc-ai-computer .jdrc-ai-hud{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:0 0 14px;
  padding:9px 11px;
  border:1px solid rgba(99,230,255,.22);
  background:rgba(3,10,14,.72);
  font-size:10px;
  font-weight:900;
  letter-spacing:.13em;
  text-transform:uppercase;
  line-height:1.3;
}
.jdrc-ai-hud-left,.jdrc-ai-hud-right{display:flex;align-items:center;gap:8px;min-width:0}
.jdrc-ai-hud-label{color:#bfefff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jdrc-ai-hud-status{color:#9caeb8;white-space:nowrap}
.jdrc-ai-led{
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:50%;
  background:var(--jdrc-ai-green);
  box-shadow:0 0 0 3px rgba(126,240,168,.08),0 0 12px rgba(126,240,168,.55);
}
.jdrc-ai-computer.is-processing .jdrc-ai-led{
  background:var(--jdrc-ai-amber);
  box-shadow:0 0 0 3px rgba(255,209,102,.08),0 0 14px rgba(255,209,102,.58);
}
.jdrc-ai-computer.is-response .jdrc-ai-led{
  background:#63e6ff;
  box-shadow:0 0 0 3px rgba(99,230,255,.09),0 0 15px rgba(99,230,255,.65);
}
.jdrc-ai-corner{
  position:absolute!important;
  z-index:4!important;
  width:28px;
  height:28px;
  pointer-events:none;
  opacity:.78;
}
.jdrc-ai-corner::after{
  content:"";
  position:absolute;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#63e6ff;
  box-shadow:0 0 12px rgba(99,230,255,.85);
}
.jdrc-ai-corner.tl{top:7px;left:7px;border-top:2px solid #63e6ff;border-left:2px solid #63e6ff}
.jdrc-ai-corner.tr{top:7px;right:7px;border-top:2px solid #63e6ff;border-right:2px solid #63e6ff}
.jdrc-ai-corner.bl{bottom:7px;left:7px;border-bottom:2px solid #63e6ff;border-left:2px solid #63e6ff}
.jdrc-ai-corner.br{bottom:7px;right:7px;border-bottom:2px solid #63e6ff;border-right:2px solid #63e6ff}
.jdrc-ai-corner.tl::after{top:-3px;left:18px}
.jdrc-ai-corner.tr::after{top:-3px;right:18px}
.jdrc-ai-corner.bl::after{bottom:-3px;left:18px}
.jdrc-ai-corner.br::after{bottom:-3px;right:18px}
.jdrc-ai-scanline{
  position:absolute!important;
  z-index:3!important;
  left:0;
  right:0;
  top:-8%;
  height:2px;
  opacity:0;
  pointer-events:none;
  background:linear-gradient(90deg,transparent 4%,rgba(99,230,255,.18) 14%,#63e6ff 50%,rgba(99,230,255,.18) 86%,transparent 96%);
  box-shadow:0 0 14px rgba(99,230,255,.38);
}
.jdrc-ai-computer.is-processing .jdrc-ai-scanline{
  opacity:.85;
  animation:jdrcAiScanV1 1.35s linear infinite;
}
.jdrc-ai-computer.is-processing::after{animation:jdrcAiSweepV1 1.8s linear infinite}
.jdrc-ai-computer.is-processing .jdrc-ai-corner{animation:jdrcAiCornerPulseV1 .9s ease-in-out infinite alternate}
.jdrc-ai-computer textarea:focus,
.jdrc-ai-computer select:focus,
.jdrc-ai-computer input:focus{
  border-color:rgba(99,230,255,.68)!important;
  outline:2px solid rgba(99,230,255,.14)!important;
  outline-offset:1px;
}
.jdrc-ai-computer .button.primary{
  border-color:rgba(99,230,255,.5)!important;
  box-shadow:inset 0 0 0 1px rgba(99,230,255,.05);
}
.jdrc-ai-computer.is-processing .button.primary:disabled{cursor:progress}
.jdrc-ai-answer-reveal{
  animation:jdrcAiAnswerRevealV1 .42s ease-out both;
}
.jdrc-ai-computer #memberSetupCoachAiOutput,
.jdrc-ai-computer #pitOsEngineerResult,
.jdrc-ai-computer #trackAdvisorOutput{
  border-color:rgba(99,230,255,.24)!important;
}
.jdrc-ai-computer.is-response #memberSetupCoachAiOutput,
.jdrc-ai-computer.is-response #pitOsEngineerResult,
.jdrc-ai-computer.is-response #trackAdvisorOutput{
  box-shadow:inset 3px 0 0 rgba(99,230,255,.52);
}
@keyframes jdrcAiScanV1{
  0%{top:-8%}
  100%{top:108%}
}
@keyframes jdrcAiSweepV1{
  0%{background-position:220% 0}
  100%{background-position:-120% 0}
}
@keyframes jdrcAiCornerPulseV1{
  from{opacity:.48;transform:translate3d(0,0,0)}
  to{opacity:1;transform:translate3d(0,-1px,0)}
}
@keyframes jdrcAiAnswerRevealV1{
  from{opacity:.18;transform:translateY(7px);filter:blur(2px)}
  to{opacity:1;transform:translateY(0);filter:blur(0)}
}
@media(max-width:700px){
  .jdrc-ai-computer .jdrc-ai-hud{align-items:flex-start}
  .jdrc-ai-hud-status{font-size:9px}
  .jdrc-ai-corner{width:22px;height:22px}
}
@media(prefers-reduced-motion:reduce){
  .jdrc-ai-computer::after,
  .jdrc-ai-computer.is-processing::after,
  .jdrc-ai-computer.is-processing .jdrc-ai-scanline,
  .jdrc-ai-computer.is-processing .jdrc-ai-corner,
  .jdrc-ai-answer-reveal{
    animation:none!important;
    transition:none!important;
  }
  .jdrc-ai-computer.is-processing .jdrc-ai-scanline{
    top:50%;
    opacity:.38;
  }
}
