.drag-source-problem{min-height:5.8rem;gap:clamp(.7rem,2.6vw,1.5rem);margin-bottom:1.35rem}.draggable-operand{display:inline-flex;align-items:baseline;gap:.32rem;white-space:nowrap;color:var(--ink);font-size:clamp(1.35rem,3.4vw,2rem);font-weight:900}.draggable-operand sup{align-self:flex-start;margin-left:-.22rem;font-size:.62em;line-height:1}.source-times{color:var(--purple)}.source-math-piece{min-width:2.7rem;min-height:2.65rem;padding:.18rem .42rem;border:2px solid transparent;border-radius:.7rem;background:transparent;color:var(--ink);font:inherit;font-weight:900;cursor:grab;transition:background .14s ease,border-color .14s ease,transform .14s ease}.source-math-piece.exponent{min-width:1.85rem;min-height:1.85rem;padding:.05rem .25rem;border-radius:999px}.source-math-piece:hover,.source-math-piece:focus-visible{border-color:var(--teal-dark);background:var(--white)}.source-math-piece:active{cursor:grabbing;transform:scale(.96)}.source-piece-placeholder{display:inline-block;width:3.2rem;height:2.65rem;border:2px dashed rgba(53,62,91,.22);border-radius:.7rem;background:#ffffff73}.source-piece-placeholder.exponent{width:1.85rem;height:1.85rem;border-radius:999px}.drag-source-problem .problem-operation{color:var(--purple);font-size:1.7rem}@media (max-width: 480px){.drag-source-problem{gap:.35rem;padding-inline:.45rem}.draggable-operand{gap:.12rem;font-size:1.12rem}.source-math-piece{min-width:2.25rem;padding-inline:.22rem}}.app-shell{background:var(--page)}.lesson-stage .app-header .eyebrow,.lesson-stage .operation-tab>span,.operation-tab small,.question-status,.lock-pill,.workspace-tip,.feedback.neutral{display:none!important}.operation-tab{display:flex;align-items:center;justify-content:center;grid-template-columns:none}:root{--teal: #43c6c5;--teal-dark: #2aaeb0;--teal-pale: #e5f8f8;--ink: #353e5b;--ink-soft: #6b7598;--purple: #2f236d;--green: #a8e98e;--coral: #ed7780;--yellow: #ffd166;--page: #dceff1;--white: #ffffff;--line: #dfe7ec;--panel-shadow: #c7dbe3;font-family:Trebuchet MS,Avenir Next,Segoe UI,sans-serif;color:var(--ink);background:var(--page);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100%}body{margin:0;background:var(--page)}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:4px solid var(--yellow);outline-offset:3px}button:disabled{cursor:not-allowed}h1,h2,p{margin-top:0}.app-shell{min-height:100vh;padding:clamp(1rem,3vw,2.5rem);background:radial-gradient(circle at 12% 15%,rgba(255,255,255,.42) 0 5rem,transparent 5.1rem),radial-gradient(circle at 88% 78%,rgba(255,255,255,.28) 0 7rem,transparent 7.1rem),var(--page)}.lesson-stage{position:relative;width:min(78rem,100%);min-height:calc(100vh - 5rem);margin:0 auto;overflow:hidden}.app-header{text-align:center;padding:.2rem 1rem 1.2rem}.eyebrow{display:block;margin-bottom:.4rem;color:var(--ink-soft);font-size:.82rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.app-header h1{margin-bottom:.45rem;font-size:clamp(2rem,5vw,3.4rem);line-height:1.05;letter-spacing:-.035em}.app-header p{margin-bottom:0;color:var(--ink-soft);font-size:clamp(.95rem,2vw,1.08rem);font-weight:700}.operation-tabs{display:flex;align-items:stretch;justify-content:center;gap:.65rem;margin:0 auto 1.2rem;padding:.35rem .2rem .6rem;overflow-x:auto;scrollbar-width:thin}.operation-tab{flex:0 0 auto;min-width:9.8rem;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem;min-height:3.5rem;padding:.75rem .85rem;border:0;border-radius:1rem;background:#edf0f4;color:var(--purple);font-weight:900;box-shadow:0 6px #2f236d1f;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.operation-tab>span{width:1.75rem;height:1.75rem;display:grid;place-items:center;border-radius:.55rem;background:#ffffffb8;font-size:1.2rem}.operation-tab small{padding:.22rem .4rem;border-radius:999px;background:#ffffffbf;color:var(--ink-soft);font-size:.72rem}.operation-tab.active{background:linear-gradient(180deg,#c3f3af,var(--green));box-shadow:0 6px #83cf68}.operation-tab:hover:not(:disabled){transform:translateY(-2px)}.question-status{width:min(69rem,100%);display:flex;justify-content:space-between;margin:0 auto .65rem;padding:0 .7rem;color:var(--ink-soft);font-size:.88rem;font-weight:900;letter-spacing:.045em;text-transform:uppercase}.question-status strong{color:var(--ink)}.activity-layout{width:min(69rem,100%);display:grid;grid-template-columns:minmax(0,1.45fr) minmax(18rem,.72fr);gap:1rem;align-items:stretch;margin:0 auto 1.25rem}.alignment-workspace,.assembly-workspace,.answer-panel,.completion-panel{border:1px solid rgba(255,255,255,.95);border-radius:1.6rem;background:#fffffff7;box-shadow:0 8px 0 var(--panel-shadow)}.alignment-workspace,.assembly-workspace{min-height:31rem;padding:clamp(1.15rem,2.5vw,1.8rem)}.workspace-heading,.answer-heading-row{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.workspace-heading h2,.answer-heading-row h2{margin-bottom:0;font-size:clamp(1.15rem,2.8vw,1.55rem)}.step-label{display:block;margin-bottom:.28rem;color:var(--teal-dark);font-size:.76rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.alignment-badge,.lock-pill,.ready-pill{flex:0 0 auto;padding:.55rem .72rem;border-radius:999px;background:#eef1f4;color:var(--ink-soft);font-size:.76rem;font-weight:900}.alignment-badge.complete,.ready-pill{background:#e5f7dd;color:#34772a}.alignment-stack{width:min(39rem,calc(100% - 1rem));margin:2.1rem auto 1rem}.slider-row{display:grid;grid-template-columns:2rem minmax(0,1fr);align-items:center;min-height:7.7rem}.row-operation{align-self:end;padding-bottom:1.65rem;color:var(--purple);font-size:2.1rem;font-weight:900}.notation-rail{position:relative;height:7rem;margin:0 4rem}.rail-line{position:absolute;left:0;right:0;top:3.15rem;height:.55rem;border-radius:999px;background:repeating-linear-gradient(90deg,transparent 0 calc(25% - 1px),rgba(53,62,91,.2) calc(25% - 1px) calc(25% + 1px),transparent calc(25% + 1px) 25%),#dce8ec}.moving-number{position:absolute;z-index:2;top:.7rem;min-width:8rem;min-height:4.45rem;display:grid;place-items:center;transform:translate(-50%);padding:.75rem .85rem;border:2px solid var(--purple);border-radius:1rem;background:var(--white);box-shadow:0 6px #2f236d33;pointer-events:none}.exponent-slider{position:absolute;z-index:3;inset:1.1rem 0 auto;width:100%;height:4.4rem;margin:0;opacity:.001;cursor:grab;direction:rtl}.exponent-slider:active{cursor:grabbing}.exponent-slider:disabled{cursor:default}.rail-end{position:absolute;top:5rem;color:var(--ink-soft);font-size:.78rem;font-weight:800}.rail-left{left:0;transform:translate(-50%)}.rail-right{right:0;transform:translate(50%)}.operation-line{width:calc(100% - 5rem);height:3px;margin:-.2rem 0 0 auto;background:var(--purple);border-radius:999px}.workspace-tip{max-width:42rem;margin:1.05rem auto 0;color:var(--ink-soft);font-size:.9rem;font-weight:700;line-height:1.45;text-align:center}.scientific-number{white-space:nowrap;color:var(--ink);font-size:clamp(1.25rem,3.4vw,2rem);font-weight:900}.scientific-number sup{position:relative;top:-.3em;margin-left:.05em;font-size:.62em;line-height:0}.times-symbol{color:var(--purple)}.original-problem{display:flex;align-items:center;justify-content:center;gap:clamp(1rem,4vw,2rem);margin:1.25rem auto .85rem;padding:.8rem 1rem;border-radius:1.05rem;background:var(--teal-pale)}.original-problem strong{color:var(--purple);font-size:1.7rem}.token-bank{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem;margin-bottom:1.2rem}.piece-token{min-width:0;min-height:4rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.15rem;border:1px solid var(--line);border-radius:.9rem;background:var(--white);color:var(--ink);box-shadow:0 5px #dfe5e9;font-weight:900;cursor:grab}.piece-token.exponent{border-radius:999px;background:#f1edff}.piece-token small{color:var(--ink-soft);font-size:.62rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.piece-token.placed{opacity:.28;box-shadow:none}.piece-token:not(:disabled):active{cursor:grabbing;transform:translateY(3px);box-shadow:0 2px #dfe5e9}.assembly-equation{position:relative;width:min(36rem,100%);display:flex;align-items:center;justify-content:center;gap:.9rem;min-height:8rem;margin:0 auto;padding:2.2rem 1rem 1rem}.coefficient-board{display:flex;align-items:center;gap:.45rem;padding:.55rem;border:2px solid #aeb9c6;border-radius:.95rem;background:#f7fbfc}.coefficient-board>strong{color:var(--purple);font-size:1.35rem}.notation-times{color:var(--ink);font-size:1.45rem;font-weight:900;white-space:nowrap}.exponent-capsule{position:absolute;top:.1rem;right:2rem;display:flex;align-items:center;gap:.25rem;min-height:3.25rem;padding:.35rem .45rem;border:2px solid #b9aede;border-radius:999px;background:#f4f0ff}.exponent-capsule>strong{color:var(--purple)}.assembly-slot{min-width:4.35rem;min-height:3.35rem;display:grid;place-items:center;border:2px dashed #aeb9c6;border-radius:.7rem;background:var(--white);color:#8b94aa;font-size:.72rem;font-weight:900}.assembly-slot.exponent{min-width:2.7rem;min-height:2.35rem;border-radius:999px}.assembly-slot.occupied{border-style:solid;border-color:var(--teal-dark);background:var(--teal-pale)}.assembly-slot button{width:100%;min-height:inherit;border:0;background:transparent;color:var(--ink);font-weight:900}.answer-panel{min-height:31rem;display:flex;flex-direction:column;padding:clamp(1.15rem,2.5vw,1.55rem)}.answer-panel.locked{background:#f7f9faf5}.lock-pill{max-width:9rem;text-align:center}.answer-equation{display:flex;align-items:center;justify-content:center;gap:.45rem;margin:auto 0;color:var(--ink);font-size:clamp(1.4rem,3vw,2rem);font-weight:900}.answer-equation input{width:7.5rem;min-height:4rem;border:3px solid rgba(47,35,109,.16);border-radius:1rem;background:var(--white);color:var(--purple);font-size:1.35rem;font-weight:900;text-align:center}.answer-equation input:disabled{background:#eceff1;color:#9aa1b1}.answer-equation input::placeholder{color:#a4aaba;font-size:.78rem}.exponent-input-label{align-self:flex-start;margin-top:-1.65rem}.exponent-input-label input{width:4rem;min-height:3.1rem;border-radius:999px;font-size:1.1rem}.answer-actions{display:flex;flex-direction:column;gap:.8rem}.feedback{min-height:2.8rem;margin:0;color:var(--ink-soft);font-size:.9rem;font-weight:800;line-height:1.45;text-align:center}.feedback.incorrect{color:#b9444e}.feedback.correct{color:#2f7e34}.primary-button{min-height:3.3rem;padding:.75rem 1.25rem;border:0;border-radius:1rem;background:var(--teal);color:var(--white);font-weight:900;box-shadow:0 5px 0 var(--teal-dark)}.primary-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 0 var(--teal-dark)}.primary-button:active:not(:disabled){transform:translateY(3px);box-shadow:0 2px 0 var(--teal-dark)}.primary-button:disabled{opacity:.38;box-shadow:none}.progress-rack{width:min(46rem,calc(100% - 1rem));min-height:4.7rem;display:flex;align-items:flex-end;justify-content:center;gap:clamp(.2rem,1vw,.5rem);margin:0 auto 1rem;padding:.55rem clamp(.45rem,2vw,1rem) .7rem;border:1px solid rgba(255,255,255,.94);border-radius:1.45rem;background:#ffffff73;box-shadow:0 7px 0 var(--panel-shadow)}.test-tube{position:relative;width:clamp(1.25rem,4vw,2rem);height:clamp(2.7rem,7vw,3.8rem);display:flex;align-items:flex-end;justify-content:center}.test-tube-rim{position:absolute;z-index:2;top:0;width:86%;height:.48rem;border:2px solid #8f9abb;border-radius:999px;background:var(--white)}.test-tube-glass{position:relative;width:68%;height:calc(100% - .2rem);overflow:hidden;border:2px solid #8f9abb;border-top:0;border-radius:0 0 .8rem .8rem;background:#ffffffad}.test-tube.filled .test-tube-glass{background:linear-gradient(180deg,#ffffffd6,#43c6c533)}.completion-panel{width:min(52rem,100%);min-height:31rem;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 auto 1.3rem;padding:2rem;text-align:center}.completion-mark,.success-check{width:7rem;aspect-ratio:1;display:grid;place-items:center;margin-bottom:1rem;border:4px solid var(--purple);border-radius:50%;background:var(--white);color:var(--purple);font-size:4.2rem;font-weight:900;box-shadow:0 6px #2f236d2e}.completion-panel h2{margin-bottom:.5rem;font-size:clamp(1.8rem,5vw,3rem)}.completion-panel p{margin-bottom:1.5rem;color:var(--ink-soft)}.replay-button{min-width:15rem}.success-overlay{position:fixed;z-index:20;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;overflow:hidden;background:#43c6c5f7;color:var(--white)}.success-copy{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:.55rem;text-align:center}.success-copy strong{font-size:clamp(2rem,7vw,4rem);line-height:1;text-shadow:0 .2rem 0 rgba(53,62,91,.24)}.success-copy span{font-size:clamp(1rem,3vw,1.3rem);font-weight:900}.hint-backdrop{position:fixed;z-index:30;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:1rem;background:#2f236d6b}.format-hint{width:min(31rem,100%);padding:1.7rem;border-radius:1.5rem;background:var(--white);box-shadow:0 12px #2f236d2e;text-align:center}.hint-icon{width:4rem;aspect-ratio:1;display:grid;place-items:center;margin:0 auto .9rem;border-radius:50%;background:var(--yellow);color:var(--purple);font-size:2rem;font-weight:900}.format-hint h2{margin-bottom:.65rem}.format-hint p{color:var(--ink-soft);line-height:1.55}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}@media (max-width: 900px){.activity-layout{grid-template-columns:1fr}.answer-panel{min-height:18rem}.answer-equation{margin:2rem 0}}@media (max-width: 660px){.app-shell{padding:.9rem .65rem 1.5rem}.lesson-stage{min-height:calc(100vh - 2rem)}.app-header{padding-bottom:.75rem}.operation-tabs{justify-content:flex-start;margin-inline:-.2rem}.operation-tab{min-width:8.7rem}.workspace-heading,.answer-heading-row{flex-direction:column;gap:.65rem}.alignment-workspace,.assembly-workspace,.answer-panel{border-radius:1.25rem}.notation-rail{margin:0 3.2rem}.moving-number{min-width:6.8rem;padding-inline:.45rem}.scientific-number{font-size:1.22rem}.token-bank{grid-template-columns:repeat(2,minmax(0,1fr))}.original-problem{gap:.7rem}.assembly-equation{padding-inline:0}.exponent-capsule{right:.15rem}.answer-equation input{width:6.6rem}.progress-rack{width:100%}}@media (max-width: 390px){.app-header p{display:none}.alignment-workspace,.assembly-workspace{padding-inline:.7rem}.notation-rail{margin-inline:2.6rem}.row-operation{width:1.4rem}.slider-row{grid-template-columns:1.4rem minmax(0,1fr)}.coefficient-board{gap:.2rem;padding:.3rem}.assembly-slot{min-width:3.6rem}.notation-times{font-size:1.2rem}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.molecule:nth-child(n+31){display:none}}.test-tube-molecules{position:absolute;inset:auto .08rem .08rem;height:68%}.mini-molecule{position:absolute;width:.82rem;height:.82rem;animation:tube-pop .48s ease-out both}.mini-molecule .cluster{width:.32rem;height:.32rem;box-shadow:inset -.08rem -.08rem .14rem #0000001f,inset .08rem .08rem .12rem #ffffff73}.mini-molecule .cluster-a{left:.05rem;top:.3rem}.mini-molecule .cluster-b{left:.24rem;top:.1rem}.mini-molecule .cluster-c{left:.43rem;top:.31rem}.mini-molecule:nth-child(1){left:2%;bottom:2%}.mini-molecule:nth-child(2){left:22%;bottom:30%}.mini-molecule:nth-child(3){left:4%;bottom:58%}.cluster{position:absolute;width:.95rem;height:.95rem;border-radius:999px;box-shadow:inset -.18rem -.18rem .28rem #0000001f,inset .16rem .16rem .26rem #ffffff73}.cluster-a{left:.45rem;top:1.15rem}.cluster-b{left:1.15rem;top:.55rem}.cluster-c{left:1.7rem;top:1.2rem}.molecule-0 .cluster-a{background:#f3d20d}.molecule-0 .cluster-b,.molecule-0 .cluster-c{background:#f3f7ff}.molecule-1 .cluster-a,.molecule-1 .cluster-c{background:#f3d20d}.molecule-1 .cluster-b{background:#f0fffa}.molecule-2 .cluster-a{background:#5e7be8}.molecule-2 .cluster-b,.molecule-2 .cluster-c{background:#7fa2ff}.molecule-3 .cluster-a,.molecule-3 .cluster-c{background:#a7c900}.molecule-3 .cluster-b{background:#6d85f2}.molecule-burst{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.molecule{position:absolute;width:3.1rem;height:3.1rem;animation:float-molecule 3.4s cubic-bezier(.16,.84,.18,1) infinite;pointer-events:none;will-change:transform,opacity}@keyframes float-molecule{0%{opacity:0;transform:translate(-50%,-50%) translate(0) rotate(0) scale(.55)}15%,70%{opacity:1}to{opacity:.98;transform:translate(-50%,-50%) translate(var(--offset-x),var(--offset-y)) rotate(var(--rotation)) scale(calc(var(--scale) * 1.18))}}@keyframes tube-pop{0%{opacity:0;transform:translateY(-1rem) scale(.6)}to{opacity:1}}
