/* NERI UI v8.4 — identitas visual: violet NERI, satu momen utama (splash + sapaan), sisanya tenang */
:root{--neri-rgb:139 92 246;--neri-violet:rgb(var(--neri-rgb));--neri-violet-soft:rgb(var(--neri-rgb) / .16);--neri-violet-line:rgb(var(--neri-rgb) / .32);--neri-ease:cubic-bezier(.2,.8,.2,1)}
@keyframes neriPop{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}
@keyframes neriFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes neriAura{0%,100%{opacity:.7;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.12)}}
@keyframes neriMsgIn{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}

/* Layar kosong: satu rangkaian masuk — maskot, sapaan, sub, kutipan, lalu chip */
.welcome-center{position:relative;isolation:isolate}
.welcome-center::before{content:"";position:absolute;left:50%;top:40%;width:300px;height:300px;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgb(var(--neri-rgb) / .26),transparent);filter:blur(6px);transform:translate(-50%,-50%);animation:neriAura 6s ease-in-out infinite}
[data-theme="light"] .welcome-center::before{background:radial-gradient(closest-side,rgb(var(--neri-rgb) / .16),transparent)}
.welcome-sprite-row{animation:neriPop .7s var(--neri-ease) both}
.welcome-sprite-row>*{animation:neriFloat 5s ease-in-out 1s infinite}
.welcome-greeting{font-size:clamp(28px,8vw,36px);letter-spacing:-.02em;line-height:1.15;animation:neriRise .6s .15s var(--neri-ease) both}
.welcome-sub{animation:neriRise .6s .3s var(--neri-ease) both}
.welcome-quote{animation:neriRise .6s .45s var(--neri-ease) both}
#promptChipsWrapper .chip-btn{animation:neriRise .5s var(--neri-ease) both}
#promptChipsWrapper .chip-btn:nth-child(1){animation-delay:.55s}#promptChipsWrapper .chip-btn:nth-child(2){animation-delay:.62s}#promptChipsWrapper .chip-btn:nth-child(3){animation-delay:.69s}#promptChipsWrapper .chip-btn:nth-child(4){animation-delay:.76s}#promptChipsWrapper .chip-btn:nth-child(n+5){animation-delay:.83s}
.chip-btn:active{transform:scale(.96)}
.chip-btn:hover{border-color:var(--neri-violet-line)}

/* Layar chat: pesan masuk menjawab aksi pengguna */
.message-wrapper{animation-name:neriMsgIn;animation-duration:.32s;animation-timing-function:var(--neri-ease)}
.message-wrapper.user{transform-origin:100% 100%}
body:not([data-bubble="pink-love"]):not([data-bubble="blue-ocean"]) .message-wrapper.user .message-content{background:var(--neri-violet-soft);border:1px solid var(--neri-violet-line);border-radius:20px 20px 6px 20px}
[data-theme="light"] body:not([data-bubble="pink-love"]):not([data-bubble="blue-ocean"]) .message-wrapper.user .message-content{background:rgb(var(--neri-rgb) / .12);border-color:rgb(var(--neri-rgb) / .3)}
.message-content{line-height:1.65}
.input-wrapper{border-radius:26px}
.input-wrapper:focus-within{border-color:var(--neri-violet-line);box-shadow:0 0 0 3px var(--neri-violet-soft),0 8px 30px rgba(0,0,0,.18)}
button:focus-visible,a:focus-visible{outline:2px solid var(--neri-violet);outline-offset:2px}

@media(prefers-reduced-motion:reduce){
  .welcome-center::before,.welcome-sprite-row,.welcome-sprite-row>*,.welcome-greeting,.welcome-sub,.welcome-quote,#promptChipsWrapper .chip-btn,.message-wrapper{animation:none!important}
}

/* Personalisasi: warna aksen & tingkat animasi (diatur di Pengaturan) */
html[data-accent="blue"]{--neri-rgb:59 130 246}
html[data-accent="green"]{--neri-rgb:34 197 94}
html[data-accent="orange"]{--neri-rgb:249 115 22}
html[data-accent="pink"]{--neri-rgb:236 72 153}
html[data-motion="lite"] .welcome-center::before,html[data-motion="lite"] .welcome-sprite-row>*,html[data-motion="lite"] .splash-mark{animation:none!important}
html[data-motion="off"] *,html[data-motion="off"] *::before,html[data-motion="off"] *::after{animation-duration:.001ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}

/* Sidebar: grup riwayat berdasarkan tanggal */
.history-group{font-size:11.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted);padding:14px 12px 4px}
.history-group:first-child{padding-top:2px}
.history-item.active{box-shadow:inset 3px 0 0 var(--neri-violet)}

/* Tombol ke pesan terbawah */
.scroll-bottom-btn{position:fixed;left:50%;bottom:calc(var(--input-height,150px) + 8px);z-index:39;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--border-modal);background:var(--bg-body);color:var(--text-main);box-shadow:0 4px 16px rgba(0,0,0,.28);cursor:pointer;opacity:0;pointer-events:none;transform:translate(-50%,8px) scale(.9);transition:opacity .2s,transform .25s var(--neri-ease)}
.scroll-bottom-btn.show{opacity:1;pointer-events:auto;transform:translate(-50%,0) scale(1)}
.scroll-bottom-btn:active{transform:translate(-50%,0) scale(.94)}
.scroll-bottom-btn .sb-dot{display:none;position:absolute;top:2px;right:2px;width:9px;height:9px;border-radius:50%;background:var(--neri-violet);box-shadow:0 0 0 2px var(--bg-body)}
.scroll-bottom-btn.has-new .sb-dot{display:block}

/* NERI For Students: hasil unit & badge */
@keyframes neriConfetti{0%{transform:translate(0,0) rotate(0);opacity:1}100%{transform:translate(var(--x),var(--y)) rotate(var(--r));opacity:0}}
@keyframes neriBump{0%{transform:scale(1)}40%{transform:scale(1.28)}100%{transform:scale(1)}}
.fx-confetti{position:fixed;inset:0;z-index:600;pointer-events:none;overflow:hidden}
.fx-confetti i{position:absolute;left:50%;top:36%;width:8px;height:12px;border-radius:2px;background:var(--c);animation:neriConfetti 1.5s cubic-bezier(.15,.7,.3,1) forwards}
.fx-bump{animation:neriBump .5s var(--neri-ease)}
#studentsScreenResults .students-results-card{animation:neriPop .55s cubic-bezier(.34,1.56,.64,1) both}
#studentsScreenResults .students-results-icon{display:inline-block;animation:neriBump .8s .3s ease both}
.students-results-xp{font-variant-numeric:tabular-nums;color:var(--neri-violet)}

/* Blok kode */
.code-header span{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:lowercase}
.code-header span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--neri-violet)}
.action-code-btn{border-radius:999px;transition:background-color .15s,transform .15s}
.action-code-btn:active{transform:scale(.94)}
pre.code-collapsed{max-height:19em;overflow:hidden!important;-webkit-mask-image:linear-gradient(#000 72%,transparent);mask-image:linear-gradient(#000 72%,transparent)}
.code-expand{display:block;width:100%;padding:9px;border:0;border-top:1px solid var(--border-modal);background:transparent;color:var(--text-muted);font-size:12.5px;cursor:pointer}
.code-expand:hover{color:var(--text-main)}
@media(prefers-reduced-motion:reduce){.fx-confetti{display:none}.fx-bump,#studentsScreenResults .students-results-card,#studentsScreenResults .students-results-icon{animation:none!important}}

/* Ikon tombol (menggantikan emoji): ditempel lewat atribut data-ic, aman terhadap terjemahan */
[data-ic]::before{content:"";display:inline-block;flex:none;width:1.15em;height:1.15em;vertical-align:-.22em;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
[data-ic-lead]::before{margin-right:.45em}
[data-ic="x"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E")}
[data-ic="menu"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h16M4 12h16M4 18h16'/%3E%3C/svg%3E")}
[data-ic="send"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m22 2-7 20-4-9-9-4Z'/%3E%3Cpath d='M22 2 11 13'/%3E%3C/svg%3E")}
[data-ic="check"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
[data-ic="cap"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 10 12 5 2 10l10 5 10-5Z'/%3E%3Cpath d='M6 12v5c3 3 9 3 12 0v-5'/%3E%3C/svg%3E")}
[data-ic="bag"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4Z'/%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'/%3E%3C/svg%3E")}
[data-ic="trash"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6'/%3E%3Cpath d='M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3C/svg%3E")}
[data-ic="bulb"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5'/%3E%3Cpath d='M9 18h6M10 22h4'/%3E%3C/svg%3E")}
[data-ic="phone"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='2' width='14' height='20' rx='2'/%3E%3Cpath d='M12 18h.01'/%3E%3C/svg%3E")}
[data-ic="eye"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E")}
[data-ic="share"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8'/%3E%3Cpath d='m16 6-4-4-4 4'/%3E%3Cpath d='M12 2v13'/%3E%3C/svg%3E")}
[data-ic="download"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3Cpath d='M12 15V3'/%3E%3C/svg%3E")}
[data-ic="search"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E")}
[data-ic="globe"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M2 12h20'/%3E%3Cpath d='M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z'/%3E%3C/svg%3E")}
[data-ic="landmark"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 22h18'/%3E%3Cpath d='M6 18v-7M10 18v-7M14 18v-7M18 18v-7'/%3E%3Cpath d='M12 2 3 7v2h18V7Z'/%3E%3C/svg%3E")}
[data-ic="zap"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2 3 14h9l-1 8 10-12h-9l1-8z'/%3E%3C/svg%3E")}
[data-ic="file"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8Z'/%3E%3Cpath d='M14 2v6h6M8 13h8M8 17h8'/%3E%3C/svg%3E")}
[data-ic="bell"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9'/%3E%3Cpath d='M10.3 21a1.94 1.94 0 0 0 3.4 0'/%3E%3C/svg%3E")}
[data-ic="compass"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m16.2 7.8-2.1 6.3-6.3 2.1 2.1-6.3Z'/%3E%3C/svg%3E")}
[data-ic="lock"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E")}
[data-ic="up"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10v12'/%3E%3Cpath d='M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88Z'/%3E%3C/svg%3E")}
[data-ic="down"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 14V2'/%3E%3Cpath d='M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22a3.13 3.13 0 0 1-3-3.88Z'/%3E%3C/svg%3E")}
[data-ic="r1"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M16 16s-1.5-2-4-2-4 2-4 2'/%3E%3Cpath d='m7 8 3 1M17 8l-3 1'/%3E%3Cpath d='M9.5 11.5h.01M14.5 11.5h.01'/%3E%3C/svg%3E")}
[data-ic="r2"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M16 16s-1.5-2-4-2-4 2-4 2'/%3E%3Cpath d='M9 9h.01M15 9h.01'/%3E%3C/svg%3E")}
[data-ic="r3"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M8 15h8'/%3E%3Cpath d='M9 9h.01M15 9h.01'/%3E%3C/svg%3E")}
[data-ic="r4"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M8 14s1.5 2 4 2 4-2 4-2'/%3E%3Cpath d='M9 9h.01M15 9h.01'/%3E%3C/svg%3E")}
[data-ic="r5"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M7 13a5 5 0 0 0 10 0Z'/%3E%3Cpath d='M9 9h.01M15 9h.01'/%3E%3C/svg%3E")}

/* ===== Proses berpikir: kartu, timeline langkah, shimmer, buka-tutup halus ===== */
@keyframes neriShimmer{to{background-position:-200% 0}}
@keyframes neriSweep{0%{background-position:-60% 0}100%{background-position:160% 0}}
@keyframes neriSlideIn{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
@keyframes neriPulseText{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes neriWave{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}
@keyframes neriCaret{50%{opacity:0}}
@keyframes neriBadgePop{from{transform:scale(0)}to{transform:scale(1)}}

.thinking-accordion{position:relative;border-radius:14px;background:linear-gradient(180deg,rgb(var(--neri-rgb) / .08),transparent 75%),var(--bg-thinking);animation:neriRise .4s var(--neri-ease) both}
.thinking-accordion::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:rgb(var(--neri-rgb) / .75)}
.thinking-accordion-btn{padding:11px 14px 11px 18px;transition:background-color .2s}
.thinking-accordion-btn:active{background:rgb(var(--neri-rgb) / .1)}
.arrow-icon{font-size:10px;opacity:.6;transition:transform .35s var(--neri-ease)}
.thinking-accordion-content{display:block!important;visibility:hidden;max-height:0;opacity:0;padding-top:0;padding-bottom:0;overflow:hidden;border-top-color:transparent;animation:none;transition:max-height .4s var(--neri-ease),opacity .3s,padding .3s,border-color .3s,visibility 0s .4s}
.thinking-accordion.open .thinking-accordion-content{visibility:visible;max-height:min(60vh,720px);opacity:1;padding-top:12px;padding-bottom:12px;overflow:auto;border-top-color:var(--border-modal);transition-delay:0s}

/* Saat ada langkah yang sedang berjalan: judul berkilau + garis penyapu di atas kartu */
.live-trace:has(.tool-trace-item.pending) .live-trace-heading{background:linear-gradient(90deg,var(--text-muted) 0,var(--text-main) 45%,var(--text-muted) 90%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:neriShimmer 1.8s linear infinite}
.live-trace:has(.tool-trace-item.pending)::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,rgb(var(--neri-rgb)),transparent) -60% 0/45% 100% no-repeat;animation:neriSweep 1.5s linear infinite}

/* Timeline langkah */
.tool-trace-list{gap:0}
.tool-trace-item{position:relative;gap:10px;padding:5px 0}
.tool-trace-item:not(:last-child)::before{content:"";position:absolute;left:10px;top:29px;bottom:-5px;width:2px;border-radius:2px;background:var(--border-modal)}
.tool-trace-icon{position:relative;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:12px;background:rgb(var(--neri-rgb) / .14);color:rgb(var(--neri-rgb))}
.tool-trace-icon [data-ic]::before{display:block;margin:0;vertical-align:0}
.tool-trace-spinner{width:13px;height:13px;margin:0;border:2px solid rgb(var(--neri-rgb) / .25);border-top-color:rgb(var(--neri-rgb))}
.tool-trace-item.trace-item-enter{animation:neriSlideIn .35s var(--neri-ease)}
.tool-trace-item.pending .tool-trace-body{animation:neriPulseText 1.6s ease-in-out infinite}
.tool-trace-item.done .tool-trace-icon::after,.tool-trace-item.failed .tool-trace-icon::after{content:"";position:absolute;right:-3px;bottom:-3px;width:11px;height:11px;border-radius:50%;box-shadow:0 0 0 2px var(--bg-thinking);background-position:center;background-size:72%;background-repeat:no-repeat;animation:neriBadgePop .35s var(--neri-ease) both}
.tool-trace-item.done .tool-trace-icon::after{background-color:#22c55e;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.tool-trace-item.failed .tool-trace-icon::after{background-color:#ef4444;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E")}

/* Indikator memuat */
.sprite-thought-dots span{background:rgb(var(--neri-rgb));animation:neriWave 1.2s ease-in-out infinite both}
.sprite-thought-dots span:nth-child(1){animation-delay:0s}.sprite-thought-dots span:nth-child(2){animation-delay:.15s}.sprite-thought-dots span:nth-child(3){animation-delay:.3s}
.sprite-loading-label,.sprite-elapsed{font-size:12px;font-variant-numeric:tabular-nums;color:var(--text-muted)}
.sprite-loading-label{background:linear-gradient(90deg,var(--text-muted) 0,var(--text-main) 45%,var(--text-muted) 90%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:neriShimmer 1.8s linear infinite}

/* Kursor saat AI menulis */
.message-content.is-streaming>:last-child:not(pre):not(ul):not(ol):not(table):not(.thinking-accordion)::after,.message-content.is-streaming>:is(ul,ol):last-child>li:last-child::after{content:"";display:inline-block;width:7px;height:1.05em;margin-left:3px;vertical-align:-.15em;border-radius:2px;background:rgb(var(--neri-rgb));animation:neriCaret 1s steps(1) infinite}

/* Gestur: tombol hapus riwayat */
.history-item{touch-action:pan-y}
.delete-chat-btn{transition:opacity .2s,color .2s,transform .25s var(--neri-ease)}
.history-item.show-delete{box-shadow:inset 0 0 0 1px rgba(239,68,68,.35)}
.history-item.show-delete .delete-chat-btn{opacity:1;color:#ef4444;transform:scale(1.2)}
@media (hover:none){.history-item:not(.show-delete) .delete-chat-btn{pointer-events:none}}

@media(prefers-reduced-motion:reduce){
  .thinking-accordion,.live-trace .live-trace-heading,.live-trace::after,.tool-trace-item,.tool-trace-item .tool-trace-body,.tool-trace-icon::after,.sprite-thought-dots span,.sprite-loading-label,.message-content.is-streaming *::after{animation:none!important}
}

[data-ic="mail"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-10 6L2 7'/%3E%3C/svg%3E")}
[data-ic="message"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E")}
[data-ic="calendar"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E")}
[data-ic="clipboard"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='8' y='2' width='8' height='4' rx='1'/%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3Cpath d='m9 14 2 2 4-4'/%3E%3C/svg%3E")}
[data-ic="flask"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 2v7.5L4.5 19a2 2 0 0 0 1.7 3h11.6a2 2 0 0 0 1.7-3L14 9.5V2'/%3E%3Cpath d='M8.5 2h7M7 16h10'/%3E%3C/svg%3E")}
[data-ic="calc"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='2' width='16' height='20' rx='2'/%3E%3Cpath d='M8 6h8M8 11h.01M12 11h.01M16 11h.01M8 15h.01M12 15h.01M16 15h.01M8 19h.01M12 19h.01M16 19h.01'/%3E%3C/svg%3E")}
[data-ic="cog"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 2v3M12 19v3M4.9 4.9 7 7M17 17l2.1 2.1M2 12h3M19 12h3M4.9 19.1 7 17M17 7l2.1-2.1'/%3E%3C/svg%3E")}

/* ===== v8.5 Emoji picker ===== */
.emoji-wrapper{position:relative;display:flex;align-items:center}
.emoji-btn.active{opacity:1;color:var(--accent-solid,var(--text-main))}
.emoji-panel{position:absolute;bottom:calc(100% + 10px);left:0;width:min(320px,calc(100vw - 24px));background:var(--bg-sidebar);border:1px solid var(--border-modal);border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.35);padding:10px;z-index:60;animation:neriRise .18s cubic-bezier(.2,.8,.2,1)}
.emoji-panel[hidden]{display:none}
.emoji-panel-title{font-size:11.5px;font-weight:700;letter-spacing:.3px;color:var(--text-muted);padding:2px 4px 8px}
.emoji-tabs{display:flex;gap:2px;overflow-x:auto;padding-bottom:8px;margin-bottom:6px;border-bottom:1px solid var(--border-modal);scrollbar-width:none}
.emoji-tabs::-webkit-scrollbar{display:none}
.emoji-tab{flex:0 0 auto;width:34px;height:34px;border:none;background:transparent;border-radius:10px;font-size:18px;line-height:1;cursor:pointer;opacity:.6;transition:background .15s,opacity .15s}
.emoji-tab:hover{opacity:1;background:rgba(128,128,128,.14)}
.emoji-tab.active{opacity:1;background:rgba(128,128,128,.2)}
.emoji-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:2px;max-height:196px;overflow-y:auto;overscroll-behavior:contain}
.emoji-item{border:none;background:transparent;border-radius:10px;aspect-ratio:1;font-size:21px;line-height:1;cursor:pointer;padding:0;transition:transform .12s,background .12s}
.emoji-item:hover,.emoji-item:focus-visible{background:rgba(128,128,128,.18);transform:scale(1.15);outline:none}
.emoji-empty{grid-column:1/-1;padding:18px 8px;text-align:center;font-size:12.5px;line-height:1.5;color:var(--text-muted)}
@media(max-width:380px){.emoji-grid{grid-template-columns:repeat(7,1fr)}}
@media(prefers-reduced-motion:reduce){.emoji-panel{animation:none}.emoji-item{transition:none}}
html[data-motion="off"] .emoji-panel{animation:none}

