/* ===== Ask Ansal: AI education assistant ===== */
.aiav{flex:none;display:inline-grid;place-items:center;width:38px;height:38px;border-radius:12px;color:#fff;background:linear-gradient(135deg,var(--mint),var(--sky));box-shadow:0 8px 18px -10px rgba(var(--accrgb),.8)}
.aiav .ic2{width:20px;height:20px;margin:0}
.aiav.lg{width:64px;height:64px;border-radius:20px}.aiav.lg .ic2{width:32px;height:32px}
.aichat{display:flex;flex-direction:column;min-height:0;background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden}
.aipage .aichat{height:min(760px,calc(100vh - 200px));min-height:520px}
.aihd{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,var(--card2),var(--card))}
.aihd>div{flex:1;min-width:0;display:flex;flex-direction:column}.aihd b{font-size:15.5px}.aihd small{color:var(--muted);font-size:12px;line-height:1.35}
.aihd .pill{border:1px solid var(--line2);background:var(--bg2);border-radius:999px;padding:4px 10px;font-size:12px;cursor:pointer;color:var(--ink);white-space:nowrap}
.iconbtn.sm{width:34px;height:34px;border-radius:10px}.iconbtn.sm .ic2{margin:0;width:17px;height:17px}
.aidisc{display:flex;gap:8px;align-items:flex-start;margin:0;padding:8px 14px;font-size:12.5px;line-height:1.45;color:var(--text2);background:rgba(var(--sandrgb),.12);border-bottom:1px solid rgba(var(--sandrgb),.25)}
.aidisc .ic2{flex:none;width:15px;height:15px;margin:2px 0 0;color:var(--sand)}
.aiaud{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:8px 14px;border-bottom:1px solid var(--line)}
.aiaud .seg{margin:0;flex-wrap:wrap}.aiaud .seg button{font-size:12.5px;padding:5px 10px}
.ailog>*{flex-shrink:0}
.ailog{flex:1;min-height:0;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:12px;scroll-behavior:smooth;overscroll-behavior:contain}
.aimsg{max-width:92%;font-size:14.5px;line-height:1.6}.aimsg p{margin:0 0 8px}.aimsg p:last-child{margin-bottom:0}
.aimsg.u{align-self:flex-end;background:var(--mint);color:var(--mintink);padding:9px 14px;border-radius:16px 16px 4px 16px}
[dir=rtl] .aimsg.u{border-radius:16px 16px 16px 4px}
.aimsg.u small{display:block;margin-top:6px;opacity:.85;font-size:12px}
.aimsg.a{align-self:flex-start;background:var(--card2);border:1px solid var(--line);padding:12px 14px;border-radius:16px 16px 16px 4px;width:100%}
[dir=rtl] .aimsg.a{border-radius:16px 16px 4px 16px}
.aimsg h4{margin:0 0 6px;font-size:15.5px}.aimsg .eyebrow{margin:0 0 6px}
.aiguard{display:flex;gap:8px;align-items:flex-start;padding:9px 11px;border-radius:12px;background:rgba(var(--sandrgb),.13);border:1px solid rgba(var(--sandrgb),.35);font-size:13.5px}
.aiguard .ic2{flex:none;width:16px;height:16px;margin:3px 0 0;color:var(--sand)}
.ailist{margin:8px 0}.ailist b{font-size:13px}.ailist ul{margin:4px 0 0;padding-inline-start:20px}.ailist li{margin-bottom:3px}.ailist li::marker{color:var(--mint)}
.ailist.doc li::marker{color:var(--coral)}
.aimyth{margin:10px 0;padding:9px 11px;border-radius:12px;background:var(--card);border:1px dashed var(--line2);font-size:13.5px}.aimyth p{margin:3px 0}
.aisrc{display:flex;flex-direction:column;gap:6px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.aisrc>b{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}[dir=rtl] .aisrc>b{letter-spacing:0}
.aisrc a{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink);font-size:13px;padding:7px 9px;border-radius:10px;background:var(--card);border:1px solid var(--line);transition:border-color .2s,transform .2s}
.aisrc a:hover{border-color:var(--mint);transform:translateY(-1px)}
.aisrc a>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column}.aisrc small{color:var(--muted);font-size:11.5px}
.aisrc a .ic2{flex:none;width:14px;height:14px;color:var(--muted)}[dir=rtl] .aisrc a .ic2{transform:scaleX(-1)}
.tier{flex:none;display:inline-block;font-size:10.5px;font-weight:600;padding:2px 7px;border-radius:999px;white-space:nowrap}
.tier.b{background:rgba(var(--accrgb),.14);color:var(--mint)}.tier.v{background:rgba(var(--sandrgb),.18);color:var(--sand)}
.aiacts{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:10px}
.aiacts .iconbtn.on{background:var(--mint);color:var(--mintink);border-color:var(--mint)}
.aiacts .iconbtn.down .ic2{transform:rotate(180deg)}.aiacts .iconbtn.down.on{background:var(--rose);border-color:var(--rose)}
.aiacts .btn .ic2,.aihand .btn .ic2{width:15px;height:15px}
.aihand{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.aisug{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.aisug .chip{min-height:34px;padding:6px 12px;font-size:13px;text-align:start;transition:border-color .2s,transform .2s,background .2s}
.aisug .chip:hover{border-color:var(--mint);transform:translateY(-1px)}
.aiem{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:12px;background:rgba(var(--rosergb),.1);border:1px solid rgba(var(--rosergb),.45)}
.aiem>.ic2{flex:none;width:20px;height:20px;color:var(--rose);margin:2px 0 0}.aiem p{color:var(--ink);font-weight:500}
.aiembtn{margin-top:8px}
.aiprof{display:flex;flex-direction:column;gap:6px;padding:12px 14px;border-radius:16px;border:1px solid var(--line);background:var(--card)}
.aiprof p{margin:0 0 4px;font-size:14px}.aiprof .aisug{margin:0 0 6px}.aiprof .btn{align-self:flex-start}
.aiprof .btn[disabled]{opacity:.5;cursor:not-allowed}
.aiform{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line);background:var(--card)}
.aiform input{flex:1;min-width:0;min-height:44px;border-radius:12px;border:1px solid var(--line2);background:var(--bg);color:var(--ink);padding:0 14px;font:inherit;font-size:15px}
.aiform input:focus{outline:2px solid var(--mint);outline-offset:1px}
.aiform .btn{min-width:46px;min-height:44px;justify-content:center}.aiform .btn .ic2{margin:0}[dir=rtl] .aiform .btn .ic2{transform:scaleX(-1)}
.aiform .btn[disabled],.aiform input[disabled]{opacity:.55;cursor:not-allowed}
.aifoot{margin:0;padding:0 14px 10px;font-size:11.5px;line-height:1.45;color:var(--muted);background:var(--card)}
/* thinking */
.aimsg.think{display:flex;align-items:center;justify-content:space-between;gap:12px}
.aisteps{margin:0;padding:0;list-style:none;font-size:13px;color:var(--muted)}
.aisteps li{opacity:0;animation:aiStep .35s forwards}.aisteps li::before{content:'✓ ';color:var(--mint)}
.aisteps li:nth-child(2){animation-delay:.3s}.aisteps li:nth-child(3){animation-delay:.6s}
.aidots{display:inline-flex;gap:4px}.aidots i{width:7px;height:7px;border-radius:50%;background:var(--mint);animation:aiDot 1s infinite}
.aidots i:nth-child(2){animation-delay:.15s}.aidots i:nth-child(3){animation-delay:.3s}
@keyframes aiStep{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes aiDot{0%,80%,100%{opacity:.25;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}
.aimsg.fresh>*{animation:aiIn .45s both}
.aimsg.fresh>*:nth-child(2){animation-delay:.08s}.aimsg.fresh>*:nth-child(3){animation-delay:.16s}.aimsg.fresh>*:nth-child(4){animation-delay:.24s}
.aimsg.fresh>*:nth-child(5){animation-delay:.32s}.aimsg.fresh>*:nth-child(n+6){animation-delay:.4s}
@keyframes aiIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* in-app page */
.aipage{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}
.aiside{display:flex;flex-direction:column;gap:16px;min-width:0}
@media (max-width:1100px){.aipage{grid-template-columns:minmax(0,1fr)}.aiside{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}
/* public site: floating button and panel */
.aifab{position:fixed;z-index:80;bottom:22px;inset-inline-end:22px;display:inline-flex;align-items:center;gap:8px;height:52px;padding:0 20px 0 16px;border:none;border-radius:999px;cursor:pointer;
  color:#fff;font:600 15px/1 inherit;font-family:inherit;background:linear-gradient(135deg,var(--mint),var(--sky));box-shadow:0 16px 32px -14px rgba(var(--accrgb),.9);transition:transform .25s,box-shadow .25s}
.aifab:hover{transform:translateY(-2px);box-shadow:0 20px 36px -14px rgba(var(--accrgb),1)}
.aifab .ic2{width:20px;height:20px;margin:0}
.aifab:not(.open)::before{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 rgba(var(--accrgb),.55);animation:aiPulse 2.6s infinite}
.aifab.open{width:52px;padding:0;justify-content:center}
@keyframes aiPulse{0%{box-shadow:0 0 0 0 rgba(var(--accrgb),.5)}70%,100%{box-shadow:0 0 0 16px rgba(var(--accrgb),0)}}
body.has-aifab #totop{bottom:88px}
.aipanel{position:fixed;z-index:79;bottom:86px;inset-inline-end:22px;width:min(410px,calc(100vw - 44px));height:min(660px,calc(100vh - 120px));display:flex;
  filter:drop-shadow(0 24px 40px rgba(15,34,51,.28));transform-origin:bottom right;animation:aiPop .28s cubic-bezier(.2,.8,.2,1.1)}
[dir=rtl] .aipanel{transform-origin:bottom left}
.aipanel .aichat{flex:1}
@keyframes aiPop{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
@media (max-width:560px){
  .aipanel{inset:0;width:auto;height:auto;bottom:0;filter:none;animation-name:aiUp;z-index:90}
  .aipanel .aichat{border-radius:0;border:none;height:100%;height:100dvh}
  .aifab.open{display:none}
  .aifab{bottom:16px;inset-inline-end:16px;height:48px;padding:0 16px 0 13px;font-size:14px}
  body.has-aifab #totop{bottom:76px;inset-inline-end:16px}
  .aimsg{max-width:100%}
  .aipage .aichat{height:calc(100vh - 170px);height:calc(100dvh - 170px);min-height:440px}
}
@keyframes aiUp{from{transform:translateY(30px);opacity:0}to{transform:none;opacity:1}}
/* home page band */
.aiband{margin-top:8px}
.aibandx{display:flex;gap:20px;align-items:flex-start;padding:26px;border-radius:24px;border:1px solid var(--line);
  background:radial-gradient(120% 140% at 100% 0%,rgba(var(--accrgb),.12),transparent 55%),radial-gradient(90% 120% at 0% 100%,rgba(var(--sandrgb),.14),transparent 60%),var(--card)}
.aibandx h2{margin:2px 0 6px}.aibandx .lead{max-width:62ch}.aibandx .btn{margin-top:14px}.aibandx .btn .ic2{width:18px;height:18px}
@media (max-width:640px){.aibandx{flex-direction:column;padding:20px;gap:12px}.aiav.lg{width:52px;height:52px}}
@media (prefers-reduced-motion:reduce){.aifab::before,.aimsg.fresh>*,.aisteps li,.aidots i,.aipanel{animation:none!important;opacity:1}}
@media print{.aifab,.aipanel{display:none!important}}
