.subject-lab-page{position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;background:radial-gradient(ellipse at 10% 0,#123356 0,transparent 55%),#07111e;color:#eaf4ff;overflow:auto;font-family:inherit;box-sizing:border-box}.subject-lab-page::backdrop{background:#07111e}.subject-lab-page *{box-sizing:border-box}.sl-header{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px max(16px,calc((100% - 1200px)/2));background:#091522ed;border-bottom:1px solid #9acfff26;backdrop-filter:blur(16px)}.sl-brand,.sl-eyebrow{font-size:12px;letter-spacing:.13em;color:#83c7ff}.sl-main{max-width:1240px;margin:auto;padding:28px 20px 48px}.sl-main h1{font-size:clamp(25px,4vw,42px);margin:12px 0 28px}.sl-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:24px}.sl-visual,.sl-info{min-width:0;border:1px solid #91bcff25;border-radius:24px;padding:24px;background:linear-gradient(145deg,#122844b3,#0a1524)}.sl-info{line-height:1.9}.sl-info h2{font-size:19px;margin:18px 0 8px}.sl-button{font:inherit;font-size:14px;padding:11px 16px;border:1px solid #8fbaff44;color:#eaf5ff;border-radius:12px;background:#193657;cursor:pointer;transition:transform .2s,background .2s;min-height:44px}.sl-button:hover{transform:translateY(-2px);background:#22517b}.sl-button[aria-pressed=true]{outline:2px solid #80d5ff;outline-offset:2px}.sl-back{background:#1c4164}.sl-back:before{content:'↩';margin-inline-end:8px}.sl-scene{height:380px;min-height:240px;overflow:hidden;border-radius:18px;background:radial-gradient(ellipse,#21456c66,transparent 65%)}.sl-scene canvas{max-width:100%;display:block}.sl-readout{font-size:28px;font-weight:800;text-align:center}.sl-label{display:grid;gap:12px;margin:20px 0;color:#b9d8f1}.sl-label input{width:100%;accent-color:#55c3ff;min-height:32px}.sl-scale{display:grid;grid-template-columns:repeat(15,minmax(0,1fr));gap:3px;direction:ltr}.sl-scale button{padding:10px 0;min-height:44px;font-size:11px;color:#06111a;border:0;border-radius:5px}.sl-samples{display:flex;gap:9px;flex-wrap:wrap}.sl-note,.sl-explanation{padding:15px;border-radius:14px;background:#61bdff0c;border:1px solid #78bfff26}.sl-explanation{border-inline-start:3px solid #59c8ff}.sl-muted,.sl-footnote{color:#9ab3cb;font-size:13px}.sl-footnote{text-align:center;margin-top:25px}.sl-book-space{height:340px;display:grid;place-items:center;perspective:850px;touch-action:pan-y;overflow:hidden}.sl-book{--book-y:-12deg;position:relative;width:85%;max-width:390px;height:220px;transform-style:preserve-3d;transform:rotateX(22deg) rotateY(var(--book-y));transition:transform .2s}.sl-book-cover{position:absolute;inset:-10px;background:linear-gradient(120deg,#198fcc,#643ed5);border-radius:10px;transform:translateZ(-13px);box-shadow:0 35px 30px #0009}.sl-book-leaf{position:absolute;top:0;width:50%;height:100%;border:0;background:repeating-linear-gradient(0deg,#eef0ef 0 28px,#c5d8e7 29px,#eef0ef 30px);color:#144775;font-size:clamp(22px,4vw,38px);font-weight:800;cursor:pointer;transform-style:preserve-3d;transition:transform .35s,box-shadow .35s}.sl-book-leaf.first{right:0;border-radius:0 14px 14px 0;transform-origin:left;transform:rotateY(-8deg);border-left:3px solid #aac3d2}.sl-book-leaf.second{left:0;border-radius:14px 0 0 14px;transform-origin:right;transform:rotateY(8deg)}.sl-book-leaf[aria-pressed=true]{box-shadow:inset 0 0 0 4px #39a9ea;transform:rotateY(0deg) translateZ(20px);color:#6730b2}.sl-sentence{text-align:center;font-size:34px;color:#9ae4ff}.sl-beaker-space{height:100%;display:grid;place-items:center;perspective:700px;--solution:#36c98d}.sl-beaker{position:relative;width:165px;height:230px;border:3px solid #b8e5fa88;border-top:5px solid #d7f4ffb3;border-radius:45% 45% 30% 30% / 10% 10% 12% 12%;transform:rotateX(-12deg) rotateY(-15deg);transform-style:preserve-3d;box-shadow:inset 20px 0 25px #c0ffff1a,12px 30px 40px #0006;background:#b2e6ff0a}.sl-liquid{position:absolute;inset:33% 5px 6px;border-radius:50% 50% 25% 25% / 10% 10% 10% 10%;background:var(--solution);box-shadow:inset 15px 0 20px #fff4;transition:background .4s}.sl-beaker i{position:absolute;width:10px;height:10px;border:1px solid #fffc;border-radius:50%;bottom:20%;left:35%;animation:slBubble 3s infinite}.sl-beaker i:nth-child(3){left:65%;animation-delay:1s}.sl-beaker i:nth-child(4){left:50%;animation-delay:2s}@keyframes slBubble{to{transform:translateY(-85px);opacity:0}}@media(max-width:700px){.sl-main{padding:20px 12px}.sl-grid{grid-template-columns:1fr;gap:16px}.sl-visual,.sl-info{padding:18px}.sl-scene{height:300px}.sl-header{padding:12px}.sl-book-space{height:300px}.sl-brand{font-size:10px}.sl-scale{gap:2px}.sl-scale button{font-size:10px}}@media(prefers-reduced-motion:reduce){.subject-lab-page *{animation:none!important;transition:none!important}}

.sl-mode-toolbar{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;margin:8px 0 16px}.sl-mode-toolbar .sl-button[aria-pressed=true]{background:#265f8f;box-shadow:0 0 0 2px #78d6ff66}.sl-word-picker{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;min-height:92px;padding:18px;border-radius:18px;background:#07142299;border:1px solid #78bfff24}.sl-word-chip{font:inherit;font-size:clamp(18px,3.2vw,30px);font-weight:800;min-width:78px;min-height:54px;padding:10px 14px;border-radius:14px;border:1px solid #9acfff42;background:#102842;color:#eef8ff;cursor:pointer;transition:transform .16s,background .16s,box-shadow .16s}.sl-word-chip:hover{transform:translateY(-2px)}.sl-word-chip.is-selected,.sl-word-chip[aria-pressed=true]{background:#1d5b91;box-shadow:0 0 0 2px #75d4ff66}.sl-word-chip.is-correct{background:#14624c;box-shadow:0 0 0 2px #64efbd88}.sl-pair-feedback{min-height:28px;text-align:center;font-weight:800;margin:10px 0 4px}.sl-pair-feedback[data-state=correct]{color:#7ff0c0}.sl-pair-feedback[data-state=wrong]{color:#ffb3b3}@media(max-width:700px){.sl-word-picker{padding:13px;gap:8px}.sl-word-chip{min-width:66px;min-height:48px;font-size:20px}.sl-mode-toolbar .sl-button{flex:1 1 auto}}

/* Classora V99 native-language translation toggle */
.sl-translation-toggle[aria-pressed="true"]{background:rgba(116,93,220,.18)!important;border-color:rgba(169,143,255,.38)!important;color:#eadfff!important}
.sl-translation-box{margin:14px 0;padding:14px;border-radius:14px;border:1px solid rgba(173,139,255,.20);background:rgba(121,82,190,.07);text-align:left;direction:ltr}
.sl-translation-box[hidden]{display:none!important}
.sl-translation-box h2{margin:0 0 8px;font-size:15px;color:#d9c8ff}
.sl-translation-box p{margin:6px 0}
