/* CPU AI Experience · visual layer built above cpu-theme.css
   Accessible, reduced-motion aware, compatible with both appearance modes */
:root{
  --ai-indigo:#6254dd;
  --ai-cyan:#018eab;
  --ai-panel:rgba(255,255,255,.88);
  --ai-inset:#f0f4fb;
  --ai-glow:rgba(61,94,202,.11);
  --ai-glass:rgba(255,255,255,.68);
  --ai-grid:rgba(61,89,140,.085);
  --ai-border:#cfdbec;
}
html[data-cpu-theme="dark"]{
  --ai-indigo:#a79cff;
  --ai-cyan:#65e4f6;
  --ai-panel:rgba(15,27,48,.91);
  --ai-inset:#101d32;
  --ai-glow:rgba(86,104,249,.23);
  --ai-glass:rgba(18,29,51,.78);
  --ai-grid:rgba(141,175,219,.07);
  --ai-border:#334a68;
}
body.cpu-ai-home,body.cpu-ai-chat,body.cpu-ai-dashboard{
  background:radial-gradient(ellipse 68% 460px at 72% 0,var(--ai-glow),transparent),
    var(--cpu-bg)!important;
}
.cpu-ai-home .hero,.cpu-ai-home .section,.cpu-ai-chat .cpu-chat-shell,.cpu-ai-dashboard .cpu-dash{position:relative}
.cpu-ai-home .hero h1{font-size:clamp(44px,5.2vw,77px)!important;line-height:1.04;letter-spacing:-.065em!important}
.cpu-ai-home .hero h1 .gradient-text,.cpu-ai-dashboard .gradient-text,.cpu-ai-chat .gradient-text{
  background:linear-gradient(105deg,var(--ai-indigo),var(--cpu-accent) 60%,var(--ai-cyan));
  -webkit-background-clip:text;background-clip:text;color:transparent!important;
}
.cpu-ai-home .hero{max-width:1260px;grid-template-columns:minmax(0,1.09fr) minmax(360px,.91fr);gap:44px;padding-top:82px;padding-bottom:70px;align-items:center}
.cpu-ai-home .hero .eyebrow,.cpu-ai-dashboard .eyebrow{font-size:11px;letter-spacing:.16em;color:var(--ai-indigo)!important}
.cpu-ai-home .hero .lead{font-size:17px;max-width:610px;line-height:1.75}
.cpu-ai-home .hero .actions{margin:19px 0}
.cpu-ai-home .hero .actions .btn{padding:12px 18px;border-radius:12px!important}
.cpu-ai-home .hero .btn.primary,.cpu-ai-dashboard .dashbtn.primary{
 background:linear-gradient(120deg,#7066ee,#278ab2)!important;color:white!important;border:0!important;
 box-shadow:0 10px 26px rgba(91,86,212,.20)
}
.cpu-ai-home .hero .ai-hero-status{display:flex;align-items:center;gap:9px;color:var(--cpu-muted);font-size:12px;margin:0 0 17px}
.cpu-ai-home .ai-live-dot,.cpu-ai-chat .ai-live-dot{width:8px;height:8px;border-radius:99px;background:var(--cpu-accent);box-shadow:0 0 0 4px rgba(63,204,168,.12);display:inline-block;flex:0 0 auto}
.cpu-ai-home .ai-hero-sub{color:var(--cpu-muted);font-size:12px;margin-top:12px}
.cpu-ai-home .ai-prompt-box{position:relative;background:var(--ai-panel);border:1px solid var(--ai-border);border-radius:21px;padding:12px;box-shadow:0 14px 40px var(--ai-glow);max-width:640px}
.cpu-ai-home .ai-prompt-box:focus-within{border-color:var(--ai-indigo);box-shadow:0 0 0 3px rgba(121,113,227,.12),0 14px 45px var(--ai-glow)}
.cpu-ai-home .ai-prompt-box label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.12em;font-weight:800;color:var(--cpu-muted)!important;padding:3px 9px}
.cpu-ai-home .ai-prompt-box textarea{background:transparent!important;color:var(--cpu-text)!important;border:0!important;box-shadow:none!important;outline:0!important;resize:vertical;min-height:68px;max-height:170px;width:100%;padding:9px;font:15px/1.55 system-ui,sans-serif}
.cpu-ai-home .ai-prompt-bottom{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:0 2px 1px 9px}
.cpu-ai-home .ai-prompt-bottom span{color:var(--cpu-muted);font-size:12px}
.cpu-ai-home .ai-send{background:linear-gradient(120deg,#7770f2,#228fae)!important;color:white!important;border:0!important;border-radius:11px!important;padding:11px 17px!important;font-size:13px;box-shadow:0 6px 22px var(--ai-glow)}
.cpu-ai-home .ai-suggestions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;max-width:650px}
.cpu-ai-home .ai-suggestions button,.cpu-ai-chat .ai-suggestions button{
 border:1px solid var(--ai-border)!important;border-radius:999px!important;background:var(--ai-glass)!important;
 color:var(--cpu-text)!important;font:600 12px/1.3 system-ui,sans-serif!important;padding:9px 12px!important;box-shadow:none!important
}
.cpu-ai-home .ai-suggestions button:hover,.cpu-ai-chat .ai-suggestions button:hover{border-color:var(--ai-indigo)!important;color:var(--ai-indigo)!important}
.cpu-ai-home .ai-orb-panel{position:relative;min-height:525px;border:1px solid var(--ai-border);border-radius:28px;background:
 radial-gradient(circle at 52% 40%,rgba(109,129,240,.12),transparent 48%),
 linear-gradient(var(--ai-grid) 1px,transparent 1px),
 linear-gradient(90deg,var(--ai-grid) 1px,transparent 1px),var(--ai-panel);
 background-size:auto,32px 32px,32px 32px,auto;overflow:hidden;box-shadow:0 30px 75px var(--ai-glow)}
.cpu-ai-home .ai-orb-panel:before{content:"";position:absolute;inset:-20%;background:radial-gradient(circle at 55% 47%,rgba(103,84,238,.18),transparent 36%);pointer-events:none}
.cpu-ai-home .ai-orb-head{position:absolute;z-index:2;top:24px;left:25px;right:25px;display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--cpu-muted);font-size:12px}
.cpu-ai-home .ai-orb-head strong{font-size:12px;color:var(--cpu-text)!important;letter-spacing:.12em}
.cpu-ai-home .ai-orb-head small{color:var(--cpu-muted);font-size:11px}
.cpu-ai-home .ai-core{position:absolute;width:278px;height:278px;left:50%;top:44%;transform:translate(-50%,-50%);display:grid;place-items:center;pointer-events:none}
.cpu-ai-home .ai-core .ai-ring{position:absolute;inset:0;border:1px solid rgba(109,126,226,.4);border-radius:50%;box-shadow:inset 0 0 40px rgba(82,91,230,.07)}
.cpu-ai-home .ai-core .ai-ring:nth-child(2){inset:25px;border-style:dashed;animation:cpu-rotate 36s linear infinite}
.cpu-ai-home .ai-core .ai-ring:nth-child(3){inset:56px;border-color:rgba(32,201,215,.40);animation:cpu-rotate 29s linear infinite reverse}
.cpu-ai-home .ai-core .ai-globe{width:132px;height:132px;display:grid;place-items:center;border-radius:38%;background:
 radial-gradient(circle at 28% 20%,rgba(255,255,255,.3),transparent 44%),
 linear-gradient(145deg,#8c7dff 1%,#354acb 55%,#0cd2c3 110%);
 box-shadow:0 0 45px rgba(93,97,229,.31),inset 0 0 35px rgba(255,255,255,.12);transform:rotate(-9deg);
 animation:cpu-breathe 6s ease-in-out infinite}
.cpu-ai-home .ai-core .ai-globe img{width:87px;height:87px;object-fit:contain;transform:rotate(9deg);filter:drop-shadow(0 8px 12px rgba(0,0,0,.22))}
.cpu-ai-home .ai-node{position:absolute;width:10px;height:10px;border:2px solid var(--ai-indigo);background:var(--cpu-surface);border-radius:50%;box-shadow:0 0 14px var(--ai-glow)}
.cpu-ai-home .ai-node.n1{top:18px;left:130px}.cpu-ai-home .ai-node.n2{top:122px;right:-5px}.cpu-ai-home .ai-node.n3{bottom:27px;left:38px}
.cpu-ai-home .ai-orb-foot{position:absolute;z-index:2;left:24px;right:24px;bottom:24px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.cpu-ai-home .ai-capability{border:1px solid var(--ai-border);background:var(--ai-glass);border-radius:12px;padding:13px 9px;min-width:0}
.cpu-ai-home .ai-capability strong{display:block;font-size:13px;margin-bottom:3px;color:var(--cpu-text)}
.cpu-ai-home .ai-capability small{display:block;font-size:11px;color:var(--cpu-muted);line-height:1.3}
.cpu-ai-home .section{border-color:var(--cpu-border)!important}
.cpu-ai-home .card{border-color:var(--ai-border)!important}
.cpu-ai-home .card:hover{box-shadow:0 16px 44px var(--ai-glow)}
.cpu-ai-home .sectionhead h2{letter-spacing:-.04em!important}
.cpu-ai-home .eyebrow{color:var(--ai-indigo)!important}
.cpu-ai-dashboard .cpu-dash{padding-top:50px}
.cpu-ai-dashboard .cpu-dash .topline{border:1px solid var(--ai-border);border-radius:23px;padding:26px 30px;margin-bottom:24px;background:var(--ai-panel);box-shadow:0 12px 32px var(--ai-glow)}
.cpu-ai-dashboard .cpu-dash .topline:before{content:"✦";color:var(--ai-indigo);font-size:25px;position:absolute;top:23px;right:28px;opacity:.24;pointer-events:none}
.cpu-ai-dashboard .cpu-dash .dashcard,.cpu-ai-dashboard .cpu-dash .tool{border-color:var(--ai-border);background:var(--ai-panel);box-shadow:0 9px 26px var(--ai-glow)}
.cpu-ai-dashboard .cpu-dash .tool{position:relative;overflow:hidden}
.cpu-ai-dashboard .cpu-dash .tool:after{content:"↗";position:absolute;top:15px;right:16px;color:var(--ai-indigo);font-size:18px}
.cpu-ai-dashboard .cpu-dash .tool span{color:var(--ai-indigo)}
.cpu-ai-dashboard .dash-prompt{padding:18px 20px!important;margin:0 0 25px;border:1px solid var(--ai-border);border-radius:18px;background:var(--ai-panel);box-shadow:0 9px 30px var(--ai-glow);display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.cpu-ai-dashboard .dash-prompt label{font-size:13px;font-weight:700;white-space:nowrap}
.cpu-ai-dashboard .dash-prompt input{flex:1;min-width:230px;background:var(--ai-inset)!important;border-radius:10px!important;padding:12px!important}
.cpu-ai-dashboard .dash-prompt button{background:var(--ai-indigo)!important;color:#fff!important;border:0!important;border-radius:10px!important;padding:11px 16px!important}
.cpu-ai-chat .cpu-chat-shell{max-width:1470px;margin:auto;padding:32px 24px 54px}
.cpu-ai-chat .cpu-chat-top{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;margin:0 0 22px}
.cpu-ai-chat .cpu-chat-top h1{font-size:clamp(29px,3.4vw,44px);margin:3px 0 4px;letter-spacing:-.045em}
.cpu-ai-chat .cpu-chat-top p{margin:0;font-size:13px;color:var(--cpu-muted)}
.cpu-ai-chat .cpu-chat-chip{padding:7px 11px;border-radius:999px;border:1px solid var(--ai-border);color:var(--ai-indigo);background:var(--ai-panel);font-size:12px;font-weight:700}
.cpu-ai-chat .cpu-chat-layout{display:grid;grid-template-columns:294px minmax(0,1fr);align-items:start;gap:17px}
.cpu-ai-chat .cpu-chat-sidebar,.cpu-ai-chat .cpu-chat-main{border:1px solid var(--ai-border);border-radius:19px;background:var(--ai-panel);box-shadow:0 15px 35px var(--ai-glow);min-width:0;overflow:hidden}
.cpu-ai-chat .cpu-chat-sidebar{padding:18px;display:flex;flex-direction:column;gap:16px}
.cpu-ai-chat .cpu-chat-sidebar h2{font-size:15px;margin:0 0 8px}
.cpu-ai-chat .cpu-chat-sidebar .panel{padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;margin:0!important}
.cpu-ai-chat .cpu-chat-sidebar #user{font-size:13px;display:block;overflow-wrap:anywhere}
.cpu-ai-chat .cpu-chat-sidebar #quota{display:inline-block;font-size:12px;margin:7px 0;color:var(--ai-indigo);font-weight:700}
.cpu-ai-chat .cpu-chat-sidebar .row{gap:8px}
.cpu-ai-chat .cpu-chat-sidebar button{font-size:12px!important;padding:9px 10px!important;border-radius:10px!important}
.cpu-ai-chat #savedChats{max-height:45vh;overflow:auto}
.cpu-ai-chat #savedChats>.row{border:1px solid var(--ai-border);border-radius:10px;padding:5px;margin:6px 0!important;align-items:center;flex-wrap:nowrap}
.cpu-ai-chat #savedChats>.row button:first-child{border:0!important;text-align:left;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:transparent!important;color:var(--cpu-text)!important}
.cpu-ai-chat #savedChats>.row button:last-child{border:1px solid var(--ai-border)!important;background:var(--ai-inset)!important;color:var(--cpu-muted)!important}
.cpu-ai-chat .cpu-chat-main{padding:0;display:flex;flex-direction:column;min-height:680px}
.cpu-ai-chat .cpu-chat-main-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 22px;border-bottom:1px solid var(--ai-border)}
.cpu-ai-chat .cpu-chat-main-top h2{margin:0;font-size:16px;letter-spacing:-.02em}
.cpu-ai-chat .cpu-chat-main-top small{color:var(--cpu-muted);font-size:12px}
.cpu-ai-chat #conversation{padding:22px 23px;max-height:none;min-height:290px;height:min(45vh,510px);overflow:auto;display:flex;flex-direction:column;gap:14px}
.cpu-ai-chat #conversation .msg{width:min(92%,790px);margin:0;box-shadow:none;border:1px solid var(--ai-border)!important;border-radius:18px!important}
.cpu-ai-chat #conversation .msg:has(strong:first-child){align-self:flex-start}
.cpu-ai-chat #conversation .msg strong{color:var(--ai-indigo)!important;font-size:12px;letter-spacing:.03em}
.cpu-ai-chat #conversation .msg:has(strong:first-child):nth-child(even){align-self:flex-start}
.cpu-ai-chat #conversation .msg:has(strong:first-child):nth-child(odd){align-self:flex-start}
.cpu-ai-chat #conversation .cpu-ai-empty{margin:auto;max-width:520px;text-align:center}
.cpu-ai-chat .cpu-ai-empty .empty-orb{display:grid;place-items:center;width:72px;height:72px;border-radius:25px;margin:0 auto 18px;background:linear-gradient(135deg,#6a59ea,#168fbc);box-shadow:0 13px 33px var(--ai-glow)}
.cpu-ai-chat .cpu-ai-empty .empty-orb img{width:54px;height:54px}
.cpu-ai-chat .cpu-ai-empty h3{font-size:23px;letter-spacing:-.04em;margin:0 0 8px}
.cpu-ai-chat .cpu-ai-empty p{line-height:1.6;font-size:14px;color:var(--cpu-muted)}
.cpu-ai-chat .cpu-chat-composer{padding:18px 22px 20px;background:var(--ai-glass);border-top:1px solid var(--ai-border);margin-top:auto}
.cpu-ai-chat .cpu-chat-composer label{font-size:12px;color:var(--cpu-muted)!important;font-weight:700}
.cpu-ai-chat .cpu-chat-composer textarea{min-height:96px;background:var(--ai-inset)!important;border:1px solid var(--ai-border)!important;border-radius:14px!important;resize:vertical;font:14px/1.6 system-ui,sans-serif!important}
.cpu-ai-chat .cpu-chat-composer textarea:focus{outline:2px solid var(--ai-indigo);outline-offset:1px}
.cpu-ai-chat .cpu-chat-composer #send{background:linear-gradient(125deg,#7269e9,#258aaa)!important;color:white!important;border:0!important;border-radius:11px!important;padding:10px 19px!important;font-weight:700}
.cpu-ai-chat .cpu-chat-composer .row{margin-top:9px}
.cpu-ai-chat .cpu-chat-composer .row button:not(#send){background:var(--ai-inset)!important;color:var(--cpu-text)!important;border:1px solid var(--ai-border)!important}
.cpu-ai-chat .cpu-chat-composer #codeFile{background:transparent!important;border:0!important;font-size:12px!important;padding:8px 0!important}
.cpu-ai-chat .cpu-chat-composer #fileStatus{margin:0 0 9px;font-size:11px;color:var(--cpu-muted)!important}
.cpu-ai-chat .cpu-chat-composer .ai-suggestions{display:flex;flex-wrap:wrap;gap:7px;margin:8px 0}
.cpu-ai-chat .cpu-chat-composer #status{font-size:12px;color:var(--ai-indigo)!important}
.cpu-ai-chat #authStatus{font-size:12px}
.cpu-ai-chat .cpu-chat-composer .ai-disclaimer{color:var(--cpu-muted)!important;font-size:11px;display:block}
.cpu-ai-chat .cpu-chat-shell .ai-link{color:var(--ai-indigo);font-weight:700;text-decoration:none}
@keyframes cpu-rotate{to{transform:rotate(360deg)}}
@keyframes cpu-breathe{50%{transform:rotate(-9deg) scale(1.04);box-shadow:0 0 72px rgba(93,97,229,.45),inset 0 0 35px rgba(255,255,255,.18)}}
@media(max-width:1030px){
 .cpu-ai-home .hero{grid-template-columns:1fr;padding-top:55px}
 .cpu-ai-home .ai-orb-panel{min-height:395px}
 .cpu-ai-home .ai-core{top:45%;transform:translate(-50%,-50%) scale(.75)}
 .cpu-ai-home .ai-orb-foot{bottom:18px}
}
@media(max-width:900px){.cpu-ai-chat .cpu-chat-layout{grid-template-columns:1fr}.cpu-ai-chat .cpu-chat-sidebar{display:grid;grid-template-columns:1fr 1fr;gap:16px}.cpu-ai-chat .cpu-chat-main{min-height:630px}.cpu-ai-chat #savedChats{max-height:230px}}
@media(max-width:600px){
 .cpu-ai-home .hero{padding-top:28px}
 .cpu-ai-home .hero h1{font-size:43px!important}
 .cpu-ai-home .ai-orb-panel{min-height:370px}
 .cpu-ai-home .ai-orb-head{top:17px;left:16px;right:16px}
 .cpu-ai-home .ai-orb-foot{left:12px;right:12px;gap:5px}
 .cpu-ai-home .ai-capability{padding:10px 5px}
 .cpu-ai-home .ai-capability strong{font-size:11px}
 .cpu-ai-home .ai-capability small{font-size:10px}
 .cpu-ai-chat .cpu-chat-shell{padding:16px 12px 80px}
 .cpu-ai-chat .cpu-chat-sidebar{grid-template-columns:1fr}
 .cpu-ai-chat #conversation{padding:14px;min-height:260px;height:44vh}
 .cpu-ai-chat .cpu-chat-composer{padding:13px}
 .cpu-ai-chat #conversation .msg{width:100%}
 .cpu-ai-dashboard .cpu-dash .topline{padding:20px}
}
@media(prefers-reduced-motion:reduce){
 .cpu-ai-home .ai-core .ai-ring,.cpu-ai-home .ai-core .ai-globe{animation:none!important}
 .cpu-ai-home *, .cpu-ai-chat *, .cpu-ai-dashboard *{transition:none!important}
}

/* Supporting tools share an AI-native surface without altering their logic */
body.cpu-ai-subpage{background:
 radial-gradient(ellipse 68% 340px at 75% 0,var(--ai-glow),transparent),
 var(--cpu-bg)!important}
.cpu-ai-subpage main{max-width:1210px;margin-inline:auto}
.cpu-ai-subpage main>h1,.cpu-ai-subpage main .wrap>h1{letter-spacing:-.055em;line-height:1.12;font-size:clamp(30px,4vw,46px)}
.cpu-ai-subpage main .panel,.cpu-ai-subpage main .box{background:var(--ai-panel)!important;border:1px solid var(--ai-border)!important;border-radius:18px!important;box-shadow:0 12px 36px var(--ai-glow)}
.cpu-ai-subpage main input,.cpu-ai-subpage main textarea,.cpu-ai-subpage main select{background:var(--ai-inset)!important;border-color:var(--ai-border)!important;border-radius:11px!important}
.cpu-ai-subpage main textarea:focus,.cpu-ai-subpage main input:focus{outline:2px solid var(--ai-indigo);outline-offset:1px}
.cpu-ai-subpage main h2{letter-spacing:-.025em}
.cpu-ai-subpage main pre{background:var(--ai-inset)!important;border-radius:12px}
.cpu-site-header .cpu-site-brand small{font-size:10px;letter-spacing:.11em}
.cpu-site-header .cpu-site-brand span{background:linear-gradient(112deg,var(--cpu-text),var(--ai-indigo));background-clip:text;-webkit-background-clip:text;color:transparent!important}
.cpu-site-header .cpu-site-nav>a[aria-current="page"]{color:var(--ai-indigo)!important}
.cpu-ai-home main .section .panel a.btn,.cpu-ai-home main .section a.btn.primary{border-radius:11px!important}
.cpu-ai-chat #conversation .msg.cpu-msg-user{align-self:flex-end!important;background:linear-gradient(150deg,var(--ai-inset),var(--ai-panel))!important}
.cpu-ai-chat #conversation .msg.cpu-msg-ai{align-self:flex-start!important;background:var(--ai-panel)!important}
.cpu-ai-chat .cpu-chat-main-top .ai-live-dot{margin-right:5px;vertical-align:middle}
@media(max-width:800px){.cpu-ai-subpage main{padding-bottom:85px}}

.cpu-ai-chat .cpu-ai-thinking{align-self:flex-start;max-width:78%;padding:12px 16px;color:var(--ai-indigo);font-size:13px;font-weight:650;border-radius:12px;border:1px solid var(--ai-border);background:var(--ai-panel);animation:cpu-thinking 1.2s ease-in-out infinite}
@keyframes cpu-thinking{50%{opacity:.60}}
@media(prefers-reduced-motion:reduce){.cpu-ai-chat .cpu-ai-thinking{animation:none}}
