.prepi-showcase{background:radial-gradient(at 50% 70%,#edf3ff,#fff 70%);scroll-margin-top:96px;position:relative}.prepi-intro-label{color:#4263a2;justify-content:center;align-items:center;gap:8px;font-size:12px;font-weight:600;display:flex}.prepi-demo-frame{color:#0f172a;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;background:#fff;border:1px solid #dbe4f3;border-radius:24px;overflow:clip;box-shadow:0 30px 80px -35px #31569a45}.prepi-demo-stage{position:relative;overflow:clip}.prepi-demo-screen{pointer-events:none;-webkit-user-select:none;user-select:none}.prepi-demo-app-header{color:#64748b;border-bottom:3px solid #edf2fa;justify-content:space-between;align-items:center;gap:20px;height:62px;padding-inline:24px;font-size:11px;display:flex}.prepi-demo-app-header>span:first-child{align-items:center;gap:7px;font-weight:600;display:flex}.prepi-demo-app-header>div{text-align:center;gap:4px;display:grid}.prepi-demo-app-header strong{color:#1e293b;font-size:13px;font-weight:650}.prepi-demo-app-header>div>span{font-size:10px}.prepi-demo-workspace{grid-template-columns:minmax(0,1fr);min-height:660px;display:grid}[data-panel-open=true]>.prepi-demo-screen>.prepi-demo-workspace{grid-template-columns:minmax(0,1fr) 355px}.prepi-demo-main{flex-direction:column;min-width:0;display:flex}.prepi-demo-breadcrumb{color:#7587a1;padding:16px 24px 4px;font-size:11px}.prepi-demo-question{flex:1;padding:12px 20px 24px}.prepi-demo-question>div{max-width:100%}.prepi-demo-practice-toolbar{border-top:1px solid #e2e8f0;justify-content:center;align-items:center;gap:12px;min-height:62px;padding:10px 15px;font-size:11px;display:flex}.prepi-demo-practice-toolbar>span{color:#64748b;align-items:center;gap:6px;display:flex}.prepi-demo-practice-toolbar>span:first-child{color:#fff;background:#0f172a;border-radius:10px;margin-right:auto;padding:9px 12px}.prepi-demo-ask{color:#fff;background:#2563eb;border-radius:10px;align-items:center;gap:7px;padding:10px 15px;font-weight:600;display:flex}.prepi-demo-chat{background:#fff;border-left:1px solid #e2e8f0;flex-direction:column;min-width:0;height:660px;display:flex;box-shadow:-8px 0 25px #0f172a04}.prepi-demo-tabs{color:#7788a1;border-bottom:1px solid #e2e8f0;flex:0 0 49px;justify-content:space-between;align-items:center;gap:10px;padding-inline:16px;font-size:11px;display:flex}.prepi-demo-tabs>span{align-items:center;gap:6px;height:49px;display:flex}.prepi-demo-tabs>span:first-child{color:#2563eb;border-bottom:2px solid #2563eb;font-weight:700}.prepi-demo-chat-content{flex:1;min-height:0;padding:9px}.prepi-demo-cursor{z-index:5;pointer-events:none;opacity:0;filter:drop-shadow(0 2px 2px #17255430);transition:transform .3s cubic-bezier(.22,1,.36,1),opacity .16s ease-out;position:absolute;top:0;left:0}.prepi-demo-cursor>svg{transform-origin:3px 2px;transition:transform 80ms ease-out;position:relative}.prepi-demo-cursor>span{opacity:0;border:2px solid #2563eb;border-radius:50%;width:32px;height:32px;transition:transform .13s ease-out,opacity .13s ease-out;position:absolute;top:-12px;left:-12px;transform:scale(.6)}.prepi-demo-cursor[data-clicking=true]>svg{transform:scale(.83)}.prepi-demo-cursor[data-clicking=true]>span{opacity:.55;transform:scale(1.2)}.dark .prepi-showcase{background:radial-gradient(at 50% 70%,#142847,#020617 70%)}@media (prefers-reduced-motion:no-preference){.prepi-demo-chat{animation:.25s ease-out prepi-panel-enter}@keyframes prepi-panel-enter{0%{opacity:0;transform:translate(12px)}to{opacity:1;transform:translate(0)}}}@media (max-width:1023px){[data-panel-open=true]>.prepi-demo-screen>.prepi-demo-workspace{grid-template-columns:minmax(0,1fr) 320px}.prepi-demo-question{padding:8px 12px 16px}}@media (max-width:767px){.prepi-demo-frame{border-radius:18px}.prepi-demo-app-header{gap:12px;height:57px;padding-inline:14px}.prepi-demo-app-header>span:last-child{display:none}.prepi-demo-app-header>span:first-child{font-size:10px}.prepi-demo-app-header strong{font-size:11px}.prepi-demo-workspace,[data-panel-open=true]>.prepi-demo-screen>.prepi-demo-workspace{grid-template-columns:minmax(0,1fr)}.prepi-demo-workspace{min-height:640px}.prepi-demo-stage[data-panel-open=true][data-highlight=false] .prepi-demo-main,.prepi-demo-stage[data-highlight=true] .prepi-demo-chat{display:none}.prepi-demo-chat{border-top:1px solid #e2e8f0;border-left:0;height:640px}.prepi-demo-practice-toolbar{gap:9px;font-size:10px}.prepi-demo-ask{padding:10px}}@media (prefers-reduced-motion:reduce){.prepi-showcase *,.prepi-showcase :before,.prepi-showcase :after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.dark .hero-demo{--demo-idle-border:#334155;--demo-idle-background:#0f172a;--demo-idle-text:#94a3b8;--demo-selected-background:#172554;--demo-selected-text:#93c5fd;--demo-correct-background:#052e16;--demo-correct-text:#86efac}@keyframes demo-answer{0%,28%{border-color:var(--demo-idle-border,#e2e8f0);background:var(--demo-idle-background,white);color:var(--demo-idle-text,#64748b)}42%,58%{background:var(--demo-selected-background,#eff6ff);color:var(--demo-selected-text,#1d4ed8);border-color:#3b82f6}72%,to{background:var(--demo-correct-background,#f0fdf4);color:var(--demo-correct-text,#166534);border-color:#22c55e}}@keyframes demo-confirm{0%,60%{opacity:0;transform:translateY(5px)}78%,to{opacity:1;transform:translateY(0)}}@keyframes demo-progress{0%,72%{transform:scaleX(.6)}to{transform:scaleX(1)}}.hero-demo-answer{background:var(--demo-correct-background,#f0fdf4);color:var(--demo-correct-text,#166534);border-color:#22c55e}.hero-demo-progress,.study-path-connector{transform-origin:0}@media (prefers-reduced-motion:no-preference){.hero-demo-answer{animation:3.6s both demo-answer}.hero-demo-check,.hero-demo-feedback{animation:3.6s both demo-confirm}.hero-demo-progress{animation:3.6s both demo-progress}.hero-demo:not([data-playing=true]) .hero-demo-answer,.hero-demo:not([data-playing=true]) .hero-demo-check,.hero-demo:not([data-playing=true]) .hero-demo-feedback,.hero-demo:not([data-playing=true]) .hero-demo-progress{animation-play-state:paused}.study-path-connector{transform:scaleX(0)}.reveal.is-visible .study-path-connector{animation:.26s ease-out both fill-topic-bar}}@media (prefers-reduced-motion:reduce){.study-path-step,.study-path-panel,.study-path-task,.study-path-progress-fill{opacity:1;animation:none;transform:none}}
