/* Preset palettes are applied as variables; none of these rules changes cube state. */
body[data-design]{background-color:var(--bg);background-image:linear-gradient(var(--theme-wash),var(--theme-wash)),url('assets/subtle.webp');color:var(--text)}
body[data-design]:before{background:radial-gradient(ellipse at 90% 0,var(--theme-glow),transparent 70%);opacity:calc(var(--decor-opacity)*.2);animation:none}
body[data-design] aside{background:var(--bg);border-color:var(--line);backdrop-filter:none}body[data-design] header{background:linear-gradient(var(--bg),transparent)}body[data-design] header button{background:var(--panel2);color:var(--text)}body[data-design] .card,body[data-design] .stat,body[data-design] .cubePanel,body[data-design] .filterPanel,body[data-design] .pathCard,body[data-design] .timer,body[data-design] .replayDialog{background:var(--panel);border-color:var(--line);color:var(--text);backdrop-filter:none;box-shadow:0 12px 35px #00000012}
body[data-design] .pageBanner,body[data-design] .cinematic{background-image:linear-gradient(90deg,var(--theme-wash),var(--theme-wash)),url('assets/subtle.webp');border-color:var(--line);color:var(--text)}body[data-design] .pageBanner{position:relative;overflow:hidden}body[data-design] .cinematic button:not(.primary){background:var(--panel2);color:var(--text)}body[data-design] .green,body[data-design] .eyebrow,body[data-design] nav a.active,body[data-design] .turnArrow,body[data-design] .brand .logo{color:var(--accent-link,var(--green))}body[data-design] .brand .logo{text-shadow:none}body[data-design] .gradientText{background:linear-gradient(110deg,var(--accent-link),var(--text));background-clip:text;color:transparent}body[data-design] .primary,body[data-design] .pill.active{background:var(--green);color:var(--ink);border-color:var(--green);box-shadow:none}body[data-design] nav a.active{background:var(--panel2)}body[data-design] button,body[data-design] input,body[data-design] select,body[data-design] textarea{border-color:var(--line)}body[data-design] input,body[data-design] select,body[data-design] textarea{background:var(--bg);color:var(--text)}body[data-design] input[type="checkbox"]{accent-color:var(--green)}body[data-design] .tag{background:var(--panel2);border-color:var(--line);color:var(--muted)}body[data-design] .callout,body[data-design] .turnCue,body[data-design] .variantWorkspace,body[data-design] .scrambleViewerDetails #scrambleCube{background:var(--panel2);color:var(--text);border-color:var(--line)}body[data-design] .algorithmCard .notation{color:var(--text)}body[data-design] .alg span.current,body[data-design] .alg button.current{background:var(--green);color:var(--ink)}body[data-design] .handGrid article{background:var(--panel)}.handDiagram{background:#101820;border-radius:12px}body[data-design] .muted,body[data-design] small{color:var(--muted)}body[data-design] button:focus-visible,body[data-design] a:focus-visible{outline:3px solid var(--accent-link);outline-offset:4px}body[data-design="oled"]{background-image:none}body[data-design="oled"]:before,body[data-design="oled"] .feature:before{display:none}body[data-design="oled"] .cinematic,body[data-design="oled"] .pageBanner{background:#000}body[data-design="oled"] .card,body[data-design="oled"] .cubePanel{box-shadow:none}body[data-design="classic"] .pageBanner:after{content:'';position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,#ed5954 0 16.6%,#ff9f38 16.6% 33.3%,#f5dc52 33.3% 50%,#73c580 50% 66.6%,#5798ed 66.6% 83.3%,#f2f5ef 83.3%)}body[data-design="cyber"] .cubePanel{background:radial-gradient(ellipse at center,#7046ba22,transparent 65%),var(--panel)}body[data-design="midnight"] .cubePanel{background:radial-gradient(ellipse at center,#45c3f019,transparent 65%),var(--panel)}
.appearanceSection{margin:28px 0}.appearanceSection h2{margin:10px 0 18px}.themeGallery{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.themeCard{text-align:left;padding:12px;display:flex;flex-direction:column;gap:10px;min-width:0;border:2px solid var(--line)}.themeCard.selected,.patternCard.selected{border-color:var(--green);outline:1px solid var(--green)}.themeCard strong{font-size:14px}.themeCard small{font-size:11px;line-height:1.6}.themeSelected{min-height:18px;font-size:11px;color:var(--accent-link)}.themeMini{height:100px;width:100%;background:var(--preview-bg);display:block;position:relative;border-radius:7px;border:1px solid #8b9aa433;overflow:hidden}.miniSidebar{position:absolute;left:0;top:0;bottom:0;width:20%;background:var(--preview-panel)}.miniLines{position:absolute;left:27%;top:22%;width:40%;display:grid;gap:9px}.miniLines i{display:block;height:5px;background:var(--preview-text);opacity:.5;border-radius:2px}.miniLines i:first-child{background:var(--preview-accent);opacity:1}.miniCube{position:absolute;right:11%;bottom:12%;font-size:34px;color:var(--preview-accent)}.appearanceOptions{margin-top:18px}.appearanceOptions .field{align-items:center}.appearanceOptions label{display:flex;gap:10px;align-items:center}.smallNote{font-size:12px;color:var(--muted);line-height:1.7}.patternGallery{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.patternCard{padding:10px;border:2px solid var(--line);display:flex;flex-direction:column;align-items:center;gap:8px;font-size:12px}.patternCard svg{width:100%;max-width:130px}.homePatternOptions{display:grid;grid-template-columns:1fr 1fr;margin-top:20px;align-items:center;gap:30px}.homePatternCube{height:300px}.cubeAppearanceGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:end}.cubeAppearanceGrid label,.customFaceColours label{display:flex;flex-direction:column;gap:10px}.customFaceColours{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-top:25px;font-size:12px}input[type="color"]{min-width:50px;width:64px;height:42px;padding:4px;cursor:pointer}.homePatternPicker{justify-content:center;position:relative;z-index:2;margin-top:16px}.homePatternPicker label{font-size:11px}.homePatternPicker select,.homePatternPicker button{font-size:11px;max-width:220px}.heroCubeWrap .scene{height:300px}.homePatternPicker input{width:auto}.heroCubeWrap>.tag{font-size:10px}
/* Cube-first lesson layout. Reading stays below both the cube and control panel. */
.caseTitle{font-size:34px;margin-bottom:6px}.caseSubtitle{margin-top:8px;margin-bottom:20px}.caseNavigation{margin:15px 0}.caseNavigation .field{gap:8px}.caseNavigation button{font-size:12px}.lessonStage,.playerLayout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,1fr);gap:20px;align-items:stretch}.lessonStage>.cubePanel{display:flex;flex-direction:column;justify-content:center}.lessonStage .scene{height:370px!important;min-height:300px}.caseControls{padding:22px;min-width:0;display:flex;flex-direction:column;gap:12px}.caseControls .tabs{margin:0;gap:6px}.caseControls .tabs button{font-size:12px;padding:10px 13px}.caseControls .controls{justify-content:flex-start;gap:8px;margin:0}.caseControls .controls button{min-height:44px;font-size:12px}.caseControls .field{margin:0;gap:9px}.caseControls #moves{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.caseControls #moves button{min-width:0;padding:9px 5px}.shortMoveCue{font-size:12px;line-height:1.6;margin:0}.caseAlgorithm{margin:20px 0}.caseAlgorithm h2{font-size:20px;margin:0}.caseAlgorithm .alg{justify-content:flex-start}.caseAlgorithm .variantWorkspace{margin-bottom:0}.readingBelow{margin:0!important}.readingBelow>.lessonText{margin:0!important;padding:26px}.readingSection{margin:18px 0;padding:18px 0;border-bottom:1px solid var(--line)}.readingSection>summary{font-size:19px;font-weight:600}.readingSection>p{line-height:1.8}.readingSection>.caseDiagram{max-width:160px;float:left;margin:0 22px 18px 0}.readingSection:after{content:'';display:block;clear:both}.readingSection .executionGuide{margin:16px 0 0;padding:0;border:0}.lessonText>h2{margin-bottom:16px}.focusExit{display:none!important}.playerCube{min-width:0}.playerControls{padding:18px;display:flex;flex-direction:column;gap:15px;justify-content:center;min-width:0}.playerControls .controls{justify-content:flex-start;gap:8px;margin:0}.playerControls button{min-height:44px}.playerControls .playerPreferences{display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin:0}.playerControls .turnCue{font-size:12px;padding:12px}.playerControls>.playerCameraReset{align-self:flex-start}.playerHeading{padding:12px 6px}.playerScene{height:330px!important}.playerTimeline{margin:18px 0 10px}.playerNarration{margin-top:15px}.tutorLayout{display:block!important}.tutorWorkspace{position:static!important}.tutorWorkspace>.cubePanel{margin-top:15px}.tutorReading{margin-top:24px;padding:28px}.tutorReading .readingContent{max-width:1050px}.tutorWorkspace .playerLayout{grid-template-columns:minmax(0,1.1fr) minmax(330px,1fr)}.practiceArea .playerControls .controls{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.practiceArea .playerControls .controls:not(.faceMoves){display:flex;flex-wrap:wrap}.practiceArea .playerControls .controls button{font-size:12px;padding:9px 6px}.practiceArea .playerControls .planningTools{font-size:12px}.practiceArea .playerControls .planningTools textarea{min-height:75px}.practiceArea .guidedTimeline{margin-top:16px}.setupScramble{margin-top:20px}.setupNotation,#caseScramble{overflow-wrap:anywhere;line-height:1.9;max-height:180px;overflow:auto;font-family:monospace}.setupScramble p{font-size:13px}.referenceDisclosure{margin-top:15px}.frameGuide{line-height:1.6;font-size:12px}.turnArrow{flex-shrink:0}.exampleToolbar{margin-bottom:15px}
#globalFocusExit{display:none;position:fixed;top:16px;right:18px;z-index:30;background:var(--green);color:var(--ink);border-color:var(--green)}body.training-focus #globalFocusExit{display:block}body.training-focus aside,body.training-focus main>header,body.training-focus footer{display:none}body.training-focus main{margin-left:0;max-width:1550px;padding:50px 30px 20px;margin-right:auto;margin-left:auto}body.training-focus .caseSubtitle,body.training-focus .caseNavigation,body.training-focus .lessonText,body.training-focus .tutorReading,body.training-focus .setupScramble,body.training-focus .caseSetup,body.training-focus .variantWorkspace p,body.training-focus .variantWorkspace #variantDetails,body.training-focus .variantWorkspace .field,body.training-focus .caseControls>details{display:none}body.training-focus .lessonStage .scene{height:470px!important}body.training-focus .playerScene,body.training-focus .tutorPracticeCube{height:440px!important}body.training-focus .caseAlgorithm{position:relative}body.training-focus #algorithm{visibility:visible!important}body.training-focus .guidedTimeline[hidden]{display:flex!important}body.training-focus .playerNarration{display:none}body.training-focus .cinematic{background:none}
.playgroundWorkspace{padding:24px}.playgroundTools,.playgroundAlgorithm,.playgroundHistory{margin-top:22px}.playgroundMoves{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:8px}.playgroundMoves button{min-height:46px;padding:10px}.playgroundTools .field{gap:12px;flex-wrap:wrap}.playgroundTools label{display:flex;gap:9px;align-items:center}.playgroundTools .check{flex-direction:row}.playgroundInput{width:100%;min-height:95px;font-family:monospace;font-size:17px}.playgroundHistoryText{line-height:1.9;overflow-wrap:anywhere;max-height:200px;overflow:auto}.seedDescription{overflow-wrap:anywhere;font-size:12px;line-height:1.8}.playgroundWorkspace .playerControls .controls{flex-wrap:wrap}.playgroundStatus:empty{display:none}.playgroundBanner h1{font-size:36px}.practiceTopics h3{margin-top:14px}
@media(max-width:1200px){.themeGallery{grid-template-columns:repeat(3,minmax(0,1fr))}.patternGallery{grid-template-columns:repeat(3,minmax(0,1fr))}.lessonStage,.playerLayout,.tutorWorkspace .playerLayout{grid-template-columns:minmax(0,1fr) minmax(300px,1fr)}.caseControls{padding:16px}.caseControls .tabs button{font-size:11px;padding:9px}.caseControls #moves{grid-template-columns:repeat(6,minmax(0,1fr))}.caseNavigation .field{flex-wrap:wrap}.cubeAppearanceGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.customFaceColours{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.lessonStage,.playerLayout,.tutorWorkspace .playerLayout{grid-template-columns:1fr}.lessonStage .scene{height:340px!important}.playerScene{height:310px!important}.caseControls .tabs{display:flex;flex-wrap:wrap}.caseControls .controls{display:flex;flex-wrap:wrap}.caseControls #moves{grid-template-columns:repeat(9,minmax(0,1fr))}.playerControls{padding:8px 0 16px}.playerControls .playerPreferences{flex-direction:row;flex-wrap:wrap;align-items:center}.playerControls .controls{flex-wrap:wrap}.playerCube{max-width:100%}.playerControls .turnCue{max-width:100%}.playgroundMoves{grid-template-columns:repeat(6,minmax(0,1fr))}.homePatternOptions{gap:18px}.caseNavigation{flex-wrap:wrap}}
@media(max-width:600px){.themeGallery{grid-template-columns:repeat(2,minmax(0,1fr))}.themeCard{padding:10px}.themeMini{height:80px}.themeGallery .themeCard:last-child{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.themeGallery .themeCard:last-child .themeMini{grid-row:1/4}.themeCard strong{font-size:13px}.appearanceOptions label{flex-wrap:wrap}.appearanceOptions .field{align-items:flex-start}.patternGallery{grid-template-columns:repeat(2,minmax(0,1fr))}.homePatternOptions{grid-template-columns:1fr;padding:16px}.homePatternOptions .scene{height:270px}.cubeAppearanceGrid{grid-template-columns:1fr}.customFaceColours{grid-template-columns:repeat(2,minmax(0,1fr))}.appearanceSection .row{align-items:flex-start;flex-wrap:wrap}.caseTitle{font-size:29px}.caseSubtitle{display:none}.caseNavigation{gap:8px;margin-top:14px}.caseNavigation button{font-size:11px;padding:9px;min-height:42px}.caseNavigation .familyReturn{flex:1 1 100%}.caseNavigation .compactStatus{font-size:10px}.lessonStage .scene{height:290px!important;min-height:260px}.caseControls{padding:14px;gap:12px}.caseControls #moves{grid-template-columns:repeat(6,minmax(0,1fr))}.caseControls .controls button{padding:10px;font-size:12px;min-height:44px}.caseControls .controls{gap:7px}.caseControls .tabs{gap:6px}.caseControls .tabs button{min-height:42px}.caseAlgorithm{padding:16px}.caseAlgorithm .row{flex-wrap:wrap;gap:10px}.caseAlgorithm h2{font-size:18px}.caseAlgorithm .alg{font-size:16px;gap:6px}.readingBelow>.lessonText{padding:18px}.readingSection{margin:12px 0;padding:14px 0}.readingSection summary{font-size:17px}.readingSection>.caseDiagram{max-width:115px}.caseControls>.eyebrow{font-size:9px}.caseControls .shortMoveCue{font-size:11px}.playerControls .controls button{padding:10px 12px;font-size:12px;min-height:44px}.playerControls .controls{gap:7px}.tutorWorkspace .controls button{font-size:12px;min-height:44px}.playerScene,.tutorPracticeCube{height:285px!important}.playerControls .playerPreferences{flex-direction:column;align-items:stretch}.tutorReading{padding:18px}.tutorModes button{font-size:11px;min-height:42px}.playgroundWorkspace{padding:14px}.playgroundMoves{grid-template-columns:repeat(6,minmax(0,1fr))}.playgroundMoves button{font-size:13px;padding:8px;min-height:44px}.playgroundTools{padding:16px}.playgroundTools .field{align-items:stretch}.playgroundTools label{flex-direction:column;align-items:flex-start;font-size:12px}.playgroundTools .check{flex-direction:row;align-items:center}.playgroundBanner{padding:22px}.playgroundBanner h1{font-size:30px}.homePatternPicker{gap:10px}.homePatternPicker label{display:flex;flex-direction:column;gap:8px}.homePatternPicker .check{flex-direction:row}.heroCubeWrap .scene{height:260px}.heroCubeWrap{padding-bottom:15px}body.training-focus main{padding:48px 12px 15px}body.training-focus .lessonStage .scene,body.training-focus .playerScene,body.training-focus .tutorPracticeCube{height:320px!important}#globalFocusExit{top:8px;right:10px;font-size:12px;padding:10px}.setupScramble{padding:16px}.setupScramble .field{align-items:stretch;flex-direction:column}.setupScramble button{min-height:44px}}
@media(prefers-reduced-motion:reduce){body[data-design]:before{animation:none!important}*{scroll-behavior:auto!important}}
body.ambient[data-design]:not([data-design="oled"]):before{animation:appearanceGlow 20s ease-in-out infinite alternate}@keyframes appearanceGlow{from{transform:translateY(0)}to{transform:translateY(24px)}}.emptySequence .playerControls>.controls:first-child,.emptySequence .playerFollow{display:none}.emptySequence .playerControls>.playerPreferences .check{display:none}.playgroundWorkspace .playgroundMoves{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}.playgroundWorkspace .playgroundMoves button{font-size:13px;min-height:44px;padding:8px}.playgroundWorkspace .playerControls .eyebrow{margin-top:8px;font-size:10px}@media(prefers-reduced-motion:reduce){body.ambient[data-design]:before{animation:none!important}}
body[data-design="oled"] .feature .icon{color:var(--text)}
@media(max-width:600px){body[data-page="lesson"] #app:has(.lessonStage){display:flex;flex-direction:column}.lessonStage{order:1}.caseNavigation{order:3}.caseAlgorithm{order:4}.readingBelow{order:5}}

/* V2 cube finish restored from source 0f9991a. Modern controls remain supported. */
.scene .sticker{border-width:4px;border-color:var(--cube-plastic,#11171c);border-radius:9px;background-image:none;box-shadow:inset 0 0 0 1px #ffffff16;opacity:1;filter:none}
.scene .sticker.highlight,.scene .sticker.highlight.targetCorner,.scene .sticker.highlight.targetEdge{box-shadow:0 0 20px #fff,inset 0 0 0 1px #ffffff70;border-color:#e4ffac;filter:brightness(1.06)}
/* Focus dimming is a newer optional teaching control; retain solid visible pieces. */
.scene .sticker.dimPiece{opacity:1;filter:brightness(.55) saturate(.65)}
.frontTools{border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:16px}.frontTools h3{margin-top:8px}.frontTools p,.frontTools small{font-size:12px;line-height:1.6;color:var(--muted)}.frontTools .field{gap:8px}.frontTools select{max-width:180px}.frontTools button[aria-pressed="true"]{border-color:var(--green);color:var(--green)}.scene.pickingFront,.scene.pickingFront .sticker{cursor:crosshair}.scene.pickingFront .sticker:hover{outline:2px solid #e4ffac;outline-offset:-4px}
.variantComparison{margin:22px 0;padding:24px}.variantComparison article{min-width:0;padding:16px;border:1px solid var(--line);border-radius:12px}.variantComparison label{display:block;margin:14px 0}.variantComparison select{width:100%;max-width:100%}.variantComparison .notation{overflow-wrap:anywhere}.beginnerCoach{border-bottom:1px solid var(--line);margin-bottom:28px;padding-bottom:20px}.beginnerCoach li{margin:12px 0}.beginnerCoach details{margin:20px 0}.beginnerReady{margin:14px 0}.fingerStages{flex-wrap:wrap}.variantComparison input{max-width:100%}
body.training-focus .variantComparison{display:none}@media(max-width:600px){body[data-page="lesson"] .variantComparison{order:4}}
.trainingToolLinks{margin:24px 0;grid-template-columns:repeat(2,minmax(0,1fr))}.planExercise{padding:18px 0;border-bottom:1px solid var(--line)}.planExercise p{margin-left:24px;line-height:1.7}.lookaheadTrainer .playerControls{display:none}.lookaheadTrainer .playerLayout{display:block}.trackingHidden{visibility:hidden}.lookMasked{padding:24px;text-align:center;border:1px dashed var(--line);border-radius:12px}.lookChoices .active{border-color:var(--green);background:var(--green);color:var(--ink)}.crossFeedback,.lookFeedback{line-height:1.65}.crossTrainerScene{height:330px}.statusChip{padding:7px 10px;border:1px solid var(--line);border-radius:7px;font-size:12px;white-space:nowrap}.statusChip[data-learning-state="Learning"]{border-color:#d7a841;color:var(--text)}.statusChip[data-learning-state="Learnt"]{border-color:#5196db;color:var(--text)}.statusChip[data-learning-state="Mastered"]{border-color:#68b578;color:var(--text)}.academyProgress{display:flex}.academyProgress .learntSegment{background:#5196db}.academyProgress .masteredSegment{background:#68b578}.academyLessonRow{display:flex;gap:16px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:10px 0}.academyLessonRow a{flex:1;border:0}.academyLessonRow label{font-size:11px;min-width:140px}.academyLessonRow select{display:block;width:100%;margin-top:4px}.academyTools{margin:24px 0}.buttonLink{padding:10px 15px;border-radius:9px;background:var(--green);color:var(--ink)}.academyStatusCounts{margin:15px 0}.cfopCoach{border-bottom:1px solid var(--line);padding-bottom:20px;margin-bottom:20px}.lookManualMoves{margin:16px 0}.crossExpert{border-top:1px solid var(--line);margin-top:20px;padding-top:15px}
@media(max-width:600px){.trainingToolLinks{grid-template-columns:1fr}.academyLessonRow{align-items:flex-start;flex-direction:column;gap:6px}.academyLessonRow label{width:100%}.statusChip{font-size:11px}.crossTrainerScene{height:290px}.crossExpert select{max-width:100%}.lookChoices button{width:100%}}
.lookaheadTrainer .field label{min-width:0;max-width:100%}.lookaheadTrainer .field select{width:100%;max-width:100%}
.lookaheadTrainer .playerTimeline{display:none}