.agk12w-root{border:1px solid #e5e7eb;border-radius:12px;padding:14px;background:#fff;max-width:900px}
.agk12w-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:10px}
.agk12w-brand{font-weight:700;font-size:16px}
.agk12w-tabs{display:flex;gap:6px;flex-wrap:wrap}
.agk12w-tab{border:1px solid #d1d5db;background:#f9fafb;border-radius:10px;padding:6px 10px;font-size:13px;cursor:pointer}
.agk12w-tab.is-active{background:#111827;color:#fff;border-color:#111827}
.agk12w-status{border-radius:10px;padding:10px;background:#f3f4f6;margin-bottom:10px}
.agk12w-status.is-ok{background:#ecfdf5}
.agk12w-status.is-bad{background:#fef2f2}
.agk12w-status-title{font-weight:700;font-size:13px;margin-bottom:4px}
.agk12w-status-body{font-size:13px;color:#111827}
.agk12w-warn{border-radius:10px;padding:10px;background:#fffbeb;margin-bottom:10px;border:1px solid #fde68a}
.agk12w-warn-title{font-weight:700;font-size:13px;margin-bottom:4px}
.agk12w-warn-body{font-size:13px;color:#92400e}
.agk12w-panel{padding:8px}
.agk12w-h3{margin:0 0 6px 0;font-size:15px}
.agk12w-h4{margin:14px 0 6px 0;font-size:14px}
.agk12w-p{margin:0 0 10px 0;font-size:13px;color:#374151}
.agk12w-btn{border:1px solid #111827;background:#111827;color:#fff;border-radius:10px;padding:8px 12px;font-size:13px;cursor:pointer;margin-right:8px;margin-bottom:8px}
.agk12w-btn:disabled{opacity:.6;cursor:not-allowed}
.agk12w-btn-lite{background:#0f172a;border-color:#0f172a}
.agk12w-btn-ghost{background:#fff;color:#111827;border-color:#d1d5db}
.agk12w-pre{background:#0b1020;color:#5CFF8F;border-radius:10px;padding:10px;font-size:12px;overflow:auto;max-height:260px;white-space:pre-wrap;margin-top:10px}

.agk12w-controls{display:flex;gap:8px;align-items:center;margin:6px 0 6px 0;flex-wrap:wrap}
.agk12w-label{font-size:13px;color:#111827}
.agk12w-rules{font-size:13px;color:#374151;margin:4px 0 10px 0}

.agk12w-demo-grid{display:grid;grid-template-columns: 1fr 1fr;gap:10px;align-items:start;margin-top:8px}
@media (max-width: 880px){.agk12w-demo-grid{grid-template-columns:1fr}}

.agk12w-board{border:1px solid #111827;border-radius:12px;background:#0b1a0f;color:#e7ffe7;padding:12px}
.agk12w-board-title{font-weight:800;margin-bottom:8px}
.agk12w-board-list{margin:0;padding-left:18px}
.agk12w-board-line{margin-bottom:6px}

.agk12w-chat{border:1px solid #e5e7eb;border-radius:12px;background:#f9fafb;padding:10px;display:flex;flex-direction:column;gap:8px;max-height:360px;overflow:auto}
.agk12w-bubble{border:none;border-radius:12px;padding:10px 10px;text-align:left;cursor:pointer}
.agk12w-bubble-role{font-size:11px;font-weight:800;opacity:.8;margin-bottom:4px}
.agk12w-bubble-text{font-size:13px;color:#111827;white-space:pre-wrap}
.agk12w-bubble.is-student{background:#e0f2fe}
.agk12w-bubble.is-guardian{background:#ede9fe}
.agk12w-bubble.is-dexi{background:#ecfdf5}

.agk12w-badge{border:1px solid #d1d5db;border-radius:12px;background:#fff;padding:12px}
.agk12w-badge-title{font-weight:800;margin-bottom:6px}
.agk12w-badge-row{font-size:13px;color:#111827;margin-bottom:4px}
.agk12w-badge-foot{font-size:12px;color:#6b7280;margin-top:8px}

/* Avatar */
.agk12w-avatar{border:1px solid #e5e7eb;border-radius:14px;padding:12px;background:#fff;margin:8px 0 10px 0;display:grid;grid-template-columns: 90px 1fr;grid-template-rows:auto auto auto;gap:8px;align-items:start}
.agk12w-avatar-head{grid-row:1 / span 3;grid-column:1}
.agk12w-avatar-face{width:84px;height:84px;border-radius:24px;background:linear-gradient(135deg,#0f172a,#1f2937);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.agk12w-avatar-eyes{position:absolute;top:26px;display:flex;gap:14px}
.agk12w-eye{width:10px;height:10px;border-radius:50%;background:#fff;opacity:.95}
.agk12w-avatar-mouth{position:absolute;bottom:22px;width:26px;height:8px;border-radius:20px;background:#fff;opacity:.9;transform-origin:center}
.agk12w-avatar.is-speaking .agk12w-avatar-mouth{animation:agk12wTalk .16s infinite alternate}
@keyframes agk12wTalk{from{transform:scaleY(0.6)}to{transform:scaleY(1.6)}}
.agk12w-avatar-label{grid-column:2;font-weight:800}
.agk12w-avatar-sub{grid-column:2;font-size:12px;color:#6b7280}
.agk12w-avatar-bubble{grid-column:2;font-size:13px;background:#f9fafb;border:1px solid #e5e7eb;border-radius:12px;padding:10px}
.agk12w-avatar-controls{grid-column:2;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.agk12w-voice{border:1px solid #d1d5db;border-radius:10px;padding:6px;font-size:13px}
.agk12w-rate{width:160px}
.agk12w-rate-lbl{font-size:12px;color:#6b7280}

/* Voice Pack */
.agk12w-vp{border:1px dashed #d1d5db;border-radius:12px;padding:10px;background:#fafafa;margin:8px 0 12px 0}
.agk12w-vp-gate{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.agk12w-input{border:1px solid #d1d5db;border-radius:10px;padding:8px 10px;font-size:13px}
.agk12w-vp-status{font-size:12px;color:#6b7280}
.agk12w-vp-list{display:flex;flex-direction:column;gap:8px}
.agk12w-vp-row{display:flex;justify-content:space-between;gap:10px;border:1px solid #e5e7eb;border-radius:12px;background:#fff;padding:10px}
.agk12w-vp-meta{flex:1}
.agk12w-vp-title{font-weight:800;font-size:13px;margin-bottom:4px}
.agk12w-vp-script{font-size:13px;color:#374151}
.agk12w-vp-actions{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.agk12w-vp-footer{display:flex;justify-content:space-between;align-items:center;margin-top:10px;gap:10px;flex-wrap:wrap}
.agk12w-vp-count{font-size:12px;color:#6b7280}
.agk12w-btn.is-rec{outline:2px solid #ef4444}

/* Live chat */
.agk12w-livechat{border:1px solid #e5e7eb;border-radius:12px;padding:10px;background:#fff;margin:8px 0 10px 0}
.agk12w-livechat-title{font-weight:800;margin-bottom:6px}
.agk12w-livechat-mode{font-size:12px;color:#6b7280;margin-bottom:6px}
.agk12w-livechat-log{border:1px solid #e5e7eb;border-radius:12px;background:#f9fafb;padding:8px;max-height:220px;overflow:auto;display:flex;flex-direction:column;gap:8px}
.agk12w-livechat-row{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}
.agk12w-livechat-input{flex:1;min-width:240px}
.agk12w-livechat-bubble{border-radius:12px;padding:8px}
.agk12w-livechat-bubble.is-student{background:#e0f2fe}
.agk12w-livechat-bubble.is-dexi{background:#ecfdf5}
.agk12w-livechat-role{font-size:11px;font-weight:800;opacity:.8;margin-bottom:3px}
.agk12w-livechat-text{font-size:13px;color:#111827;white-space:pre-wrap}

/* Wallet hint */
.agk12w-wallethint{border:1px solid #c7d2fe;background:#eef2ff;border-radius:12px;padding:12px;margin-bottom:10px}
.agk12w-wallethint-title{font-weight:800;margin-bottom:6px}
.agk12w-wallethint-body{font-size:13px;color:#1f2937}
.agk12w-wallethint-line{margin-bottom:8px}
.agk12w-wallethint-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* Grade selector */
.agk12w-grade{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:6px 0 8px 0}
.agk12w-grade-select{border:1px solid #d1d5db;border-radius:10px;padding:6px 10px;font-size:13px}
.agk12w-grade-note{font-size:12px;color:#6b7280;margin-bottom:8px}

/* Avatar maturity skins */
.agk12w-root.dexi-skin-kid .agk12w-avatar-face{border-radius:28px}
.agk12w-root.dexi-skin-kid .agk12w-eye{width:11px;height:11px}
.agk12w-root.dexi-skin-kid .agk12w-avatar-mouth{width:28px}
.agk12w-root.dexi-skin-kid .agk12w-avatar.is-speaking .agk12w-avatar-mouth{animation-duration:.14s}

.agk12w-root.dexi-skin-mature .agk12w-avatar-face{border-radius:18px}
.agk12w-root.dexi-skin-mature .agk12w-eye{width:9px;height:9px;opacity:.9}
.agk12w-root.dexi-skin-mature .agk12w-avatar-mouth{width:22px;opacity:.85}
.agk12w-root.dexi-skin-mature .agk12w-avatar.is-speaking .agk12w-avatar-mouth{animation-duration:.20s}

/* Guardian verification gate */
.agk12w-guardian-gate{border:1px solid #e5e7eb;border-radius:12px;background:#f8fafc;padding:10px;margin:10px 0}
.agk12w-guardian-gate-title{font-weight:800;margin-bottom:4px}
.agk12w-guardian-gate-desc{font-size:12px;color:#6b7280;margin-bottom:8px}
.agk12w-guardian-gate-status{font-size:13px;margin-bottom:8px}
.agk12w-guardian-gate.is-verified .agk12w-guardian-gate-status{font-weight:800}
.agk12w-guardian-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:8px}
.agk12w-guardian-note{font-size:12px;color:#6b7280;margin-bottom:6px}

/* Guardian lock notes */
.agk12w-locknote{font-size:12px;color:#6b7280;margin:6px 0 10px 0}

/* Stronger "talking" animation + idle life */
.agk12w-avatar-face{transform-origin:center; position:relative}
.agk12w-avatar.is-speaking .agk12w-avatar-face{animation:agk12wBob .28s infinite alternate}
@keyframes agk12wBob{from{transform:translateY(0px)}to{transform:translateY(-1.5px)}}
.agk12w-avatar.is-speaking .agk12w-eye{animation:agk12wBlink 2.6s infinite}
@keyframes agk12wBlink{0%,92%,100%{transform:scaleY(1)}94%{transform:scaleY(0.1)}}
.agk12w-avatar.is-speaking .agk12w-avatar-mouth{animation:agk12wTalkStrong .09s infinite alternate}
@keyframes agk12wTalkStrong{from{transform:scaleY(0.45) scaleX(0.95)}to{transform:scaleY(2.2) scaleX(1.08)}}

/* Skin tiers (noticeable differences) */
.agk12w-root.dexi-skin-kid .agk12w-avatar-face{border-radius:30px}
.agk12w-root.dexi-skin-kid .agk12w-eye{width:12px;height:12px}
.agk12w-root.dexi-skin-kid .agk12w-avatar-mouth{width:30px;height:9px}

.agk12w-root.dexi-skin-tween .agk12w-avatar-face{border-radius:22px}
.agk12w-root.dexi-skin-tween .agk12w-eye{width:10px;height:10px}
.agk12w-root.dexi-skin-tween .agk12w-avatar-mouth{width:26px;height:8px}

.agk12w-root.dexi-skin-teen .agk12w-avatar-face{border-radius:16px}
.agk12w-root.dexi-skin-teen .agk12w-eye{width:9px;height:9px;opacity:.9}
.agk12w-root.dexi-skin-teen .agk12w-avatar-mouth{width:22px;height:7px;opacity:.85}

.agk12w-root.dexi-skin-mentor .agk12w-avatar-face{border-radius:14px}
.agk12w-root.dexi-skin-mentor .agk12w-eye{width:8px;height:8px;opacity:.85}
.agk12w-root.dexi-skin-mentor .agk12w-avatar-mouth{width:20px;height:6px;opacity:.82}

/* Add "brows" for teen/mentor via pseudo-elements */
.agk12w-avatar-face::before,
.agk12w-avatar-face::after{content:""; position:absolute; top:18px; width:18px; height:3px; border-radius:10px; background:#fff; opacity:0; transform:skewX(-10deg)}
.agk12w-avatar-face::before{left:18px}
.agk12w-avatar-face::after{right:18px; transform:skewX(10deg)}
.agk12w-root.dexi-skin-teen .agk12w-avatar-face::before,
.agk12w-root.dexi-skin-teen .agk12w-avatar-face::after{opacity:.55}
.agk12w-root.dexi-skin-mentor .agk12w-avatar-face::before,
.agk12w-root.dexi-skin-mentor .agk12w-avatar-face::after{opacity:.7}

/* Add "cheek dots" for kid */
.agk12w-avatar-eyes::after{content:""; position:absolute; left:50%; top:22px; width:44px; height:12px; transform:translateX(-50%); opacity:0; border-radius:999px; background:rgba(255,255,255,.22)}
.agk12w-root.dexi-skin-kid .agk12w-avatar-eyes::after{opacity:1}

/* Avatar modernization + gender variants */
.agk12w-avatar{position:relative}
.agk12w-avatar-ring{position:absolute; inset:-10px; border-radius:999px; border:2px solid rgba(255,255,255,.25)}
.agk12w-avatar-glow{position:absolute; inset:-18px; border-radius:999px; background:radial-gradient(circle, rgba(255,255,255,.18), rgba(255,255,255,0) 60%)}
.agk12w-avatar-shoulders{position:absolute; left:50%; top:64px; width:92px; height:44px; transform:translateX(-50%); border-radius:999px; background:rgba(255,255,255,.14)}
.agk12w-avatar-face{box-shadow:0 10px 30px rgba(0,0,0,.18); background:rgba(255,255,255,.18); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px)}
.agk12w-avatar-hair{position:absolute; left:50%; top:-10px; width:70px; height:34px; transform:translateX(-50%); border-radius:22px 22px 18px 18px; background:rgba(255,255,255,.35); opacity:.9}
.agk12w-avatar.gender-female .agk12w-avatar-hair{width:78px; height:40px; border-radius:26px 26px 20px 20px; opacity:.95}
.agk12w-avatar.gender-male .agk12w-avatar-hair{width:66px; height:28px; border-radius:18px 18px 16px 16px; opacity:.85}
.agk12w-avatar.gender-neutral .agk12w-avatar-hair{opacity:.6}

.agk12w-avatar.gender-female .agk12w-avatar-mouth{border-radius:999px}
.agk12w-avatar.gender-male .agk12w-avatar-mouth{border-radius:10px}
.agk12w-avatar.gender-neutral .agk12w-avatar-mouth{border-radius:12px}

.agk12w-root.dexi-gender-female .agk12w-avatar-ring{border-color: rgba(255,255,255,.32)}
.agk12w-root.dexi-gender-male .agk12w-avatar-ring{border-color: rgba(255,255,255,.28)}
.agk12w-root.dexi-gender-neutral .agk12w-avatar-ring{border-color: rgba(255,255,255,.22)}


/* --- Baseline + Progress + Chalkboard --- */
.agk12w-card{border:1px solid #e5e7eb;border-radius:14px;padding:10px;background:#f9fafb;margin:10px 0}
.agk12w-card-title{font-weight:800;font-size:13px;margin-bottom:8px}
.agk12w-card-body{font-size:13px;color:#111827}
.agk12w-baseline-line{margin-bottom:8px}
.agk12w-baseline-actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.agk12w-baseline-run{border:1px dashed #e5e7eb;border-radius:14px;background:#fff;padding:10px}
.agk12w-baseline-progress{font-size:12px;color:#6b7280;margin-bottom:6px}
.agk12w-baseline-q{font-size:14px;font-weight:700;margin-bottom:8px}
.agk12w-baseline-choices{display:flex;gap:8px;flex-wrap:wrap}
.agk12w-baseline-feedback{margin-top:10px;font-weight:800}
.agk12w-baseline-feedback.ok{color:#065f46}
.agk12w-baseline-feedback.bad{color:#991b1b}
.agk12w-baseline-result{font-size:14px;margin-top:6px}
.agk12w-baseline-result-note{font-size:12px;color:#6b7280;margin-top:6px}

.agk12w-progress-line{font-size:13px}
.agk12w-progress-wota{margin-top:8px;font-weight:800}
.agk12w-bar{height:10px;border-radius:999px;background:#e5e7eb;overflow:hidden;margin-top:8px}
.agk12w-bar-fill{height:100%;width:0;background:#111827}

.agk12w-details{border:1px solid #e5e7eb;border-radius:14px;background:#f9fafb;padding:8px;margin:10px 0}
.agk12w-details > summary{cursor:pointer;font-weight:800;font-size:13px;list-style:none}
.agk12w-details > summary::-webkit-details-marker{display:none}

.agk12w-whiteboard{margin-top:10px}
.agk12w-whiteboard-title{font-weight:800;font-size:12px;color:#111827;margin-bottom:6px}
.agk12w-whiteboard-canvas{width:100%;height:auto;border-radius:14px;border:1px solid #e5e7eb;display:block;background:#111827}
.agk12w-whiteboard-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}


/* --- Buttons-first agent UX --- */
.agk12w-actionbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.agk12w-boost{display:flex;gap:8px;align-items:center;margin-top:10px;font-size:12px;color:#111827}
.agk12w-boost input{transform:scale(1.05)}
.agk12w-livechat-actions{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
.agk12w-livechat-choices{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}


/* --- Session timeline (card-based agent UI) --- */
.agk12w-timeline{max-height:360px; overflow:auto; padding:6px 2px}
.agk12w-timeline-title{font-weight:900;font-size:13px;margin:2px 4px 10px 4px}
.agk12w-stepcard{border:1px solid #e5e7eb;border-radius:16px;background:#ffffff;padding:10px;margin:8px 4px; box-shadow: 0 8px 24px rgba(0,0,0,0.06)}
.agk12w-stephead{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.agk12w-badge{font-size:11px;font-weight:900;padding:4px 10px;border-radius:999px;background:#f3f4f6}
.agk12w-steptitle{font-weight:900;font-size:13px}
.agk12w-stepbody{font-size:13px;color:#111827;line-height:1.35}
.agk12w-stepactions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.agk12w-stepcard.kind-lesson .agk12w-badge{background:#eef2ff}
.agk12w-stepcard.kind-question .agk12w-badge{background:#ecfeff}
.agk12w-stepcard.kind-result .agk12w-badge{background:#f0fdf4}
.agk12w-stepcard.kind-test .agk12w-badge{background:#fff7ed}
.agk12w-stepcard.kind-progress .agk12w-badge{background:#fdf2f8}


/* --- Micro-animations + thinking + confetti --- */
.agk12w-root{position:relative}
.agk12w-animate-in{animation:agk12wFadeUp .28s ease-out both}
@keyframes agk12wFadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

.agk12w-thinking{display:flex;gap:10px;align-items:center;font-weight:700}
.agk12w-spinner{width:14px;height:14px;border:2px solid #e5e7eb;border-top-color:#111827;border-radius:999px;display:inline-block;animation:agk12wSpin .8s linear infinite}
@keyframes agk12wSpin{to{transform:rotate(360deg)}}

.agk12w-confetti-layer{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:20}
.agk12w-confetti-wrap{position:absolute;inset:0}
.agk12w-confetti{position:absolute;top:-12px;width:8px;height:10px;border-radius:2px;opacity:.95;animation:agk12wConfettiFall 1.2s ease-in both}
@keyframes agk12wConfettiFall{to{transform:translateY(110%) rotate(720deg);opacity:0}}


/* --- Wallet / marketplace inputs --- */
.agk12w-pill{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:#f3f4f6;font-size:12px;font-weight:800;margin:8px 0}
.agk12w-row{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.agk12w-label{font-size:12px;font-weight:800;color:#111827}
.agk12w-input{border:1px solid #e5e7eb;border-radius:12px;padding:10px 12px;font-size:14px}