:root{--paper:#faf9f6;--surface:#fff;--on-ink:#fff;--on-ink-2:#ffffffb3;--on-ink-hair:#ffffff40;--ink:#191919;--muted:#4d4d49;--hair:#d4d4cd;--quiet:#ebe9e1;--blue:#3155ff;--error:#d12b1e;--success:#0f7a45;--red:#f04435;--yellow:#ffda28;--green:#24b970;--orange:#ff8b19;--line:2px solid var(--ink);--hairline:1px solid var(--hair);--fs-1:12px;--fs-2:14px;--fs-3:16px;--fs-4:20px;--fs-5:28px;--fs-6:40px;--fs-7:clamp(40px,4.4vw,56px);--tight:-.02em;--track:.08em;--s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:24px;--s-6:32px;--s-7:48px;--s-8:64px;--s-9:96px;--r-1:8px;--r-2:12px;--radius:var(--r-2);--shadow:3px 3px 0 var(--ink);--shadow-hover:5px 5px 0 var(--ink)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{background:var(--paper);color:var(--ink);font-family:var(--font-body);font-size:var(--fs-2);-webkit-font-smoothing:antialiased;margin:0}button,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a,summary{touch-action:manipulation}button{color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button{border:0}button:disabled{cursor:wait;opacity:.55}button:focus-visible,a:focus-visible,summary:focus-visible,canvas:focus-visible{outline:3px solid var(--blue);outline-offset:5px}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:700}p{line-height:1.8}canvas{max-width:100%;display:block}.wrap{width:min(1240px,100% - 96px);margin-inline:auto}.header{border-bottom:var(--line);background:var(--paper);z-index:10;position:sticky;top:0}.nav{justify-content:space-between;align-items:center;gap:var(--s-5);height:80px;display:flex}.brand{font-size:var(--fs-5);letter-spacing:var(--tight);align-items:center;font-weight:700;display:flex}.brand-period{color:var(--blue)}.brand-mark{background:var(--ink);border:2px solid var(--ink);width:29px;height:29px;margin-right:var(--s-3);border-radius:4px;grid-template-columns:repeat(3,1fr);gap:2px;display:grid}.brand-mark i{background:var(--blue)}.brand-mark i:nth-child(3n){background:var(--yellow)}.brand-mark i:nth-child(3n+1){background:var(--green)}.brand-mark i:nth-child(2),.brand-mark i:nth-child(7){background:var(--red)}nav{gap:var(--s-6);font-weight:600;font-size:var(--fs-2);display:flex}nav a:hover{color:var(--blue)}.nav-actions{gap:var(--s-5);align-items:center;display:flex}.language{font-size:var(--fs-1);gap:var(--s-3);background:0 0;align-items:center;font-weight:700;display:flex}.language span{color:var(--muted)}.button{min-height:54px;padding:var(--s-4) var(--s-5);border:var(--line);border-radius:var(--r-1);font-size:var(--fs-2);justify-content:center;align-items:center;gap:var(--s-5);white-space:nowrap;box-shadow:var(--shadow);font-weight:700;transition:transform .2s,box-shadow .2s;display:inline-flex}.button:hover{box-shadow:var(--shadow-hover);transform:translate(-2px,-2px)}.button:active{box-shadow:0 0 0 var(--ink);transform:translate(2px,2px)}.small{min-height:42px;padding:var(--s-3) var(--s-4);font-size:var(--fs-1)}.yellow,.green,.red{background:var(--surface)}.black{background:var(--ink);color:var(--on-ink)}.white{background:var(--paper);color:var(--ink)}.hero{align-items:center;gap:var(--s-8);padding-block:var(--s-8);grid-template-columns:1.1fr 1fr;display:grid}.eyebrow{font-size:var(--fs-1);letter-spacing:var(--track);align-items:center;gap:var(--s-2);font-weight:700;line-height:1.5;display:flex}.mini-grid{font-size:var(--fs-4);color:var(--ink)}h1{font-size:var(--fs-7);letter-spacing:var(--tight);margin:var(--s-5) 0;line-height:1.2}.highlight{z-index:0;white-space:nowrap;display:inline-block;position:relative}.highlight:before{content:"";background:var(--blue);z-index:-1;height:3px;position:absolute;inset:auto 0 -4px}.hero-description{max-width:430px;font-size:var(--fs-2);color:var(--muted);margin-top:var(--s-6)}.hero-actions{align-items:center;gap:var(--s-5);margin-top:var(--s-6);display:flex}.text-link{font-size:var(--fs-1);gap:var(--s-3);padding:var(--s-2) 0;text-underline-offset:5px;background:0 0;align-items:center;font-weight:700;text-decoration:underline;display:inline-flex}.text-link:hover{color:var(--blue)}.hero-facts{gap:var(--s-4);font-size:var(--fs-1);color:var(--muted);margin-top:var(--s-5);display:flex}.hero-art{background:var(--surface);border:var(--line);border-radius:var(--r-2);box-shadow:var(--shadow);isolation:isolate;height:470px;position:relative;overflow:hidden}.art-top{padding:var(--s-5);color:var(--ink);border-bottom:var(--hairline);justify-content:space-between;align-items:center;display:flex}.live-label{font-size:var(--fs-1);letter-spacing:var(--track);font-weight:700}.art-grid{font-size:var(--fs-5)}.bauhaus-circle{display:none}.hero-cube{cursor:grab;touch-action:pan-y;width:100%;height:302px;margin-top:-16px}.hero-cube:active{cursor:grabbing}.cube-hint{color:var(--muted);font-size:var(--fs-1);gap:var(--s-2);margin:1px 0 var(--s-4);justify-content:center;align-items:center;display:flex}.cube-hint>span:first-child{font-size:var(--fs-3)}.cube-controls{background:var(--paper);border-top:var(--line);width:100%;padding:var(--s-4) var(--s-5);justify-content:space-between;align-items:center;gap:var(--s-3);display:flex;position:absolute;bottom:0}.cube-controls span{font-size:var(--fs-1);color:var(--muted);margin-bottom:var(--s-2);display:block}.cube-controls strong{font-size:var(--fs-1)}.moves{gap:var(--s-2);display:flex}.moves button{background:var(--surface);border:var(--line);border-radius:var(--r-1);width:36px;height:36px;font-weight:700;transition:transform .15s}.moves button:hover{transform:translateY(-2px)}.moves .reset{font-size:var(--fs-4);background:0 0}.how{background:var(--ink);color:var(--on-ink);border-radius:var(--radius);padding:var(--s-6);grid-template-columns:1.2fr 1fr 1fr 1fr;display:grid}.how-intro{padding-right:var(--s-5);position:relative}.how-intro .eyebrow{color:var(--on-ink-2);font-size:var(--fs-1);letter-spacing:var(--track)}.how h2{font-size:var(--fs-5);letter-spacing:var(--tight);margin-top:var(--s-4);line-height:1.25}.how-arrow{font-size:var(--fs-6);color:var(--on-ink);position:absolute;bottom:0;right:28px}.how-item{padding:0 var(--s-6);border-left:1px solid var(--on-ink-hair)}.step-number{width:36px;height:36px;color:var(--ink);background:var(--paper);font-size:var(--fs-2);margin-bottom:var(--s-4);border-radius:50%;justify-content:center;align-items:center;font-weight:700;display:inline-flex}.how-item h3{font-size:var(--fs-2);letter-spacing:var(--tight);margin-bottom:var(--s-2)}.how-item p{font-size:var(--fs-1);color:var(--on-ink-2);line-height:1.8}.section{padding-block:var(--s-8)}.section-heading{margin-bottom:var(--s-6);justify-content:space-between;align-items:center;gap:var(--s-5);display:flex}.blue-text{color:var(--blue)}h2{font-size:var(--fs-6);letter-spacing:var(--tight);line-height:1.3}.section-heading h2{margin-top:var(--s-3)}.section-heading p{font-size:var(--fs-1);color:var(--muted);margin-top:var(--s-3)}.round-link{border:var(--line);background:var(--surface);width:49px;height:49px;font-size:var(--fs-4);border-radius:50%;flex-shrink:0;transition:border-color .2s,color .2s}.round-link:hover{transform:none}.lesson-grid{gap:var(--s-4);grid-template-columns:repeat(4,1fr);display:grid}.lesson-card{border:var(--line);border-radius:var(--r-2);background:var(--paper);text-align:left;box-shadow:var(--shadow);flex-direction:column;padding:0;transition:transform .2s,box-shadow .2s;display:flex;overflow:hidden}.lesson-card:hover{box-shadow:var(--shadow-hover);transform:translateY(-2px)}.lesson-image{border-bottom:var(--line);width:100%;height:158px;position:relative}.lesson-image canvas{width:100%;height:158px}.lesson-number{font-size:var(--fs-4);letter-spacing:var(--tight);font-weight:700;position:absolute;top:14px;left:15px}.lesson-duration{font-size:var(--fs-1);font-weight:600;position:absolute;top:18px;right:12px}.lesson-info{padding:var(--s-4) var(--s-4) var(--s-4);flex-direction:column;flex:1;display:flex}.lesson-info h3{font-size:var(--fs-2);letter-spacing:var(--tight);margin-bottom:var(--s-2)}.lesson-info p{font-size:var(--fs-1);color:var(--muted);flex:1;min-height:34px;line-height:1.7}.lesson-bottom{font-size:var(--fs-1);margin-top:var(--s-4);justify-content:space-between;align-items:center;font-weight:700;display:flex}.lesson-bottom span:last-child{font-size:var(--fs-3)}.advanced{background:var(--ink);color:var(--paper);padding:var(--s-5);position:relative}.advanced .eyebrow{color:var(--on-ink-2);font-size:var(--fs-1)}.advanced h3{font-size:var(--fs-5);letter-spacing:var(--tight);margin-top:var(--s-5);line-height:1.25}.advanced p{font-size:var(--fs-1);color:var(--on-ink-2);max-width:160px;margin-top:var(--s-4)}.advanced .text-link{color:var(--paper);font-size:var(--fs-1);margin-top:auto}.advanced-shape{display:none}.course-note{margin-top:var(--s-5);font-size:var(--fs-1);color:var(--muted);justify-content:space-between;align-items:center;display:flex}.course-note>span:last-child{color:var(--ink);font-size:var(--fs-4)}.notation-caption{font-size:var(--fs-5);text-align:center;min-height:50px;font-weight:700}.notation-caption span{font-size:var(--fs-1);margin-top:var(--s-2);font-weight:600;display:block}.store-icon{font-size:var(--fs-5)}.faq{gap:var(--s-8);padding-bottom:var(--s-8);grid-template-columns:1fr 1.3fr;display:grid}.faq h2{font-size:var(--fs-5)}.faq details{border-bottom:var(--hairline);padding:var(--s-4) 0}.faq details:first-child{padding-top:0}.faq summary{cursor:pointer;font-size:var(--fs-1);justify-content:space-between;align-items:center;gap:var(--s-5);font-weight:600;list-style:none;display:flex}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"+";font-size:var(--fs-4);font-weight:400}.faq details[open] summary:after{content:"−"}.faq details p{font-size:var(--fs-1);color:var(--muted);padding-top:var(--s-4);max-width:480px}.footer{border-top:var(--line);justify-content:space-between;align-items:center;gap:var(--s-5);min-height:96px;display:flex}.footer .brand{font-size:var(--fs-5)}.footer>span{font-size:var(--fs-1);color:var(--muted)}.skip{top:-60px;left:var(--s-4);background:var(--ink);color:var(--on-ink);padding:var(--s-3);z-index:20;position:fixed}.skip:focus{top:10px}dialog{border:var(--line);border-radius:var(--r-2);background:var(--paper);color:var(--ink);width:min(820px,100% - 32px);max-height:90dvh;box-shadow:var(--shadow);padding:0}dialog::backdrop{backdrop-filter:blur(5px);background:#191919b3}.dialog-head{padding:var(--s-4) var(--s-5);border-bottom:var(--line);justify-content:space-between;align-items:center;display:flex}.close-dialog{font-size:var(--fs-4);border:var(--line);background:var(--surface);border-radius:50%;width:36px;height:36px;line-height:1}.dialog-content{grid-template-columns:1fr 1fr;display:grid}.lesson-visual{background:var(--surface);border-right:var(--line);align-items:center;min-height:340px;display:flex}.lesson-visual canvas{width:100%;height:320px}.lesson-detail{padding:var(--s-6)}.lesson-detail h2{font-size:var(--fs-5);margin:var(--s-3) 0}.lesson-detail p{font-size:var(--fs-1);color:var(--muted)}.lesson-index{font-size:var(--fs-1);color:var(--blue);font-weight:700}.formula{gap:var(--s-2);margin:var(--s-5) 0 var(--s-4);flex-wrap:wrap;display:flex}.formula button{border:var(--line);border-radius:var(--r-1);background:var(--surface);width:36px;height:36px;font-weight:700}.lesson-detail .demo-note{font-size:var(--fs-1);margin-bottom:var(--s-5)}.lesson-detail .button{font-size:var(--fs-1);min-height:44px}.lesson-status{font-size:var(--fs-1);margin-top:var(--s-4);min-height:16px;display:block}.dialog-footer{border-top:var(--line);padding:var(--s-4) var(--s-5);justify-content:space-between;display:flex}.store-content{padding:var(--s-6)}.store-content h2{font-size:var(--fs-5);margin:var(--s-5) 0}.store-content p{max-width:440px;color:var(--muted);margin-bottom:var(--s-5)}.store-deco{background:var(--surface);color:var(--ink);border:var(--line);width:64px;height:64px;font-size:var(--fs-6);border-radius:50%;justify-content:center;align-items:center;display:inline-flex}#store-dialog,#cfop-dialog{max-width:550px}@media (width>=1440px){h1{font-size:var(--fs-7)}.hero{gap:var(--s-8);padding-block:var(--s-8)}.hero-art{height:480px}.hero-cube{height:310px}}@media (width<=1100px){.wrap{width:calc(100% - 64px)}.hero{gap:var(--s-6)}h1{font-size:var(--fs-6);letter-spacing:var(--tight)}.hero-actions{gap:var(--s-5);flex-wrap:wrap}.hero-art{height:440px}.hero-cube{height:270px}.how{padding:var(--s-6) var(--s-5)}.how-item{padding:0 var(--s-4)}.how h2{font-size:var(--fs-5)}.how-arrow{display:none}.lesson-grid{gap:var(--s-4)}.lesson-info h3{font-size:var(--fs-1)}.hero-facts{font-size:var(--fs-1);gap:var(--s-3)}}@media (width<=767px){.wrap{width:calc(100% - 48px)}.nav{gap:var(--s-4);height:72px}.brand{font-size:var(--fs-5)}nav{display:none}.nav-actions{gap:var(--s-3)}.language{font-size:var(--fs-1);gap:var(--s-2)}.nav-actions .button{padding:var(--s-2) var(--s-3);font-size:var(--fs-1);min-height:38px}.hero{gap:var(--s-6);padding-block:var(--s-7);grid-template-columns:1fr}.hero-copy{max-width:560px}h1{font-size:var(--fs-7);letter-spacing:var(--tight);margin-block:var(--s-5)}.hero-description{font-size:var(--fs-2);max-width:360px;margin-top:var(--s-5)}.eyebrow{font-size:var(--fs-1);letter-spacing:var(--track)}.hero-actions{gap:var(--s-5);margin-top:var(--s-5)}.hero-actions .button{font-size:var(--fs-1);min-height:49px;padding:var(--s-4) var(--s-4)}.text-link{font-size:var(--fs-1)}.hero-facts{font-size:var(--fs-1);margin-top:var(--s-4);gap:var(--s-5)}.hero-art{width:100%;max-width:560px;height:430px}.hero-cube{height:264px}.art-top{padding-top:var(--s-4)}.how{padding:var(--s-5);gap:var(--s-5);grid-template-columns:1fr}.how-intro{padding-bottom:var(--s-2)}.how h2{font-size:var(--fs-5)}.how h2 br{display:none}.how-item{border-left:0;border-top:1px solid var(--on-ink-hair);padding:var(--s-5) 0 0;gap:var(--s-1) var(--s-4);grid-template-columns:42px 1fr;display:grid}.how-item .step-number{grid-row:span 2;margin:0}.how-item h3{font-size:var(--fs-2);margin:0}.how-item p{font-size:var(--fs-1);max-width:310px}.section{padding-block:var(--s-7)}.section-heading{margin-bottom:var(--s-5)}.section-heading h2{font-size:var(--fs-5);letter-spacing:var(--tight);max-width:290px}.section-heading p{font-size:var(--fs-1);max-width:300px}.round-link{width:40px;height:40px;font-size:var(--fs-5)}.lesson-grid{gap:var(--s-4);grid-template-columns:repeat(2,1fr)}.lesson-image,.lesson-image canvas{height:137px}.lesson-duration{display:none}.lesson-number{font-size:var(--fs-4);top:10px;left:12px}.lesson-info{padding:var(--s-4) var(--s-3) var(--s-3)}.lesson-info h3{font-size:var(--fs-1)}.lesson-info p{font-size:var(--fs-1);min-height:43px}.lesson-bottom{font-size:var(--fs-1);margin-top:var(--s-3)}.advanced{padding:var(--s-4)}.advanced h3{font-size:var(--fs-4);margin-top:var(--s-5)}.advanced p{font-size:var(--fs-1)}.advanced-shape{display:none}.advanced .text-link{font-size:var(--fs-1)}.course-note{font-size:var(--fs-1);gap:var(--s-5);line-height:1.7}.notation-caption{font-size:var(--fs-4)}.notation-caption span{font-size:var(--fs-1)}.faq{gap:var(--s-5);padding-bottom:var(--s-7);grid-template-columns:1fr}.faq h2{font-size:var(--fs-5)}.faq summary{font-size:var(--fs-1)}.footer{gap:var(--s-3);min-height:96px;padding-block:var(--s-5);flex-wrap:wrap;justify-content:space-between}.footer>span{font-size:var(--fs-1)}.footer>span:nth-child(2){order:3;width:100%}.dialog-content{grid-template-columns:1fr}.lesson-visual{border-right:0;border-bottom:var(--line);min-height:200px}.lesson-visual canvas{height:210px}.lesson-detail{padding:var(--s-5)}.lesson-detail h2{font-size:var(--fs-5)}.dialog-head,.dialog-footer{padding:var(--s-3) var(--s-4)}.store-content{padding:var(--s-5)}.store-content h2{font-size:var(--fs-5)}}@media (prefers-reduced-motion:no-preference){.hero-copy{animation:.65s both enter}.hero-art{animation:.65s .12s both enter}@keyframes enter{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition:none!important;animation:none!important}}:root{--cube-line:#5c5c5c;--cube-line-k:.5;--cube-filter:saturate(1.3) contrast(1.06);--move-font:var(--font-mono,ui-monospace),ui-monospace,SFMono-Regular,Menlo,monospace;--move-bg:var(--quiet,#f4f4f5);--move-border:1px solid var(--hair,#e5e5e5);--move-radius:4px;--move-pad:3px 9px;--move-size:16px;--move-bracket:22px}:is(canvas,.top-view){filter:var(--cube-filter)}svg[role=img]:not(.flat-top) polygon[stroke=\#191919]{stroke:var(--cube-line);stroke-width:calc(.06px * var(--cube-line-k))}svg.flat-top rect[stroke=\#191919],.alg b svg path:not(.arrow){stroke:var(--cube-line);stroke-width:calc(1px * var(--cube-line-k))}.move-seq{align-items:center;gap:var(--s-2,8px) var(--s-4,16px);font-family:var(--move-font);font-size:var(--move-size);flex-wrap:wrap;margin:0;line-height:1.4;display:inline-flex}.move-seq .alg-group,.move-seq .combo{flex-wrap:wrap;align-items:center;gap:4px;display:inline-flex;position:static}.move-seq b{min-width:0;padding:var(--move-pad);border:var(--move-border);border-radius:var(--move-radius);background:var(--move-bg);color:var(--ink);font-family:var(--move-font);font-size:var(--move-size);box-shadow:none;font-weight:600;line-height:1.4;display:inline-flex}.move-seq .combo:before,.move-seq .combo:after{font-family:var(--move-font);font-size:var(--move-bracket);color:var(--ink);margin:0;font-weight:400;line-height:1}.move-seq .combo:before{content:"("}.move-seq .combo:after{content:")"}.case-moves{font-size:inherit;background:0 0;border:0;margin:0;padding:0;display:block}.case-moves .move-seq{display:flex}