:root{--font-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "SF Mono", Monaco, "Cascadia Code", monospace;--header-height: 56px;--panel-width: 360px;--stats-bar-height: 48px;--transition-speed: .2s;--color-bg: #0a0a0a;--color-bg-elevated: #141414;--color-text: #ffffff;--color-muted: rgba(255, 255, 255, .5);--color-border: rgba(255, 255, 255, .12);--color-border-strong: rgba(255, 255, 255, .2);--color-hover: rgba(255, 255, 255, .08);--color-active: rgba(255, 255, 255, .12);--color-overlay: rgba(0, 0, 0, .6);--color-panel: #1a1a1a;--color-danger: #ef4444;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .5);--shadow-panel: -4px 0 24px rgba(0, 0, 0, .5);--face-front: #16a34a;--face-back: #2563eb;--face-up: #fafafa;--face-down: #fbbf24;--face-right: #dc2626;--face-left: #ea580c;--color-bg-start: #0a0a0a;--color-bg-end: #0a0a0a;--color-button-bg: transparent;--color-button-text: #ffffff;--color-panel-bg: rgba(0, 0, 0, .35);--color-panel-bg-soft: rgba(0, 0, 0, .2);--color-modal-bg: #1a1a1a;--color-hover-bg: rgba(255, 255, 255, .08);--part-border-color: #000000;--part-border-width: 2px;--part-size: 26px}:root[data-theme=light]{--color-bg: #f5f5f5;--color-bg-elevated: #ffffff;--color-text: #171717;--color-muted: rgba(0, 0, 0, .5);--color-border: rgba(0, 0, 0, .1);--color-border-strong: rgba(0, 0, 0, .2);--color-hover: rgba(0, 0, 0, .05);--color-active: rgba(0, 0, 0, .1);--color-overlay: rgba(0, 0, 0, .4);--color-panel: #ffffff;--shadow-panel: -4px 0 24px rgba(0, 0, 0, .15);--color-bg-start: #f5f5f5;--color-bg-end: #f5f5f5;--color-button-bg: rgba(255, 255, 255, .6);--color-button-text: #171717;--color-panel-bg: rgba(255, 255, 255, .75);--color-panel-bg-soft: rgba(255, 255, 255, .6);--color-modal-bg: #ffffff;--color-hover-bg: rgba(0, 0, 0, .08)}@media (max-width: 480px){:root{--part-size: 20px;--part-border-width: 1.5px}}@media (max-width: 360px){:root{--part-size: 16px;--part-border-width: 1px}}#tutorial-modal.hide,#onboarding.hide{display:none!important}.part{width:var(--part-size);height:var(--part-size);border:var(--part-border-width) solid var(--part-border-color);position:absolute;border-radius:.01px}.front>div{background-color:var(--face-front)}.back>div{background-color:var(--face-back)}.up>div{background-color:var(--face-up)}.down>div{background-color:var(--face-down)}.right>div{background-color:var(--face-right)}.left>div{background-color:var(--face-left)}.cube{transform-style:preserve-3d;transform-origin:center;margin:0 auto;width:90px;height:90px}.cube>div{transform-style:preserve-3d;-moz-transform-style:preserve-3d}#f1{transform:translateZ(45px)}#f2{transform:translate3d(30px,0,45px)}#f3{transform:translate3d(60px,0,45px)}#f4{transform:translate3d(0,30px,45px)}#f5{transform:translate3d(30px,30px,45px)}#f6{transform:translate3d(60px,30px,45px)}#f7{transform:translate3d(0,60px,45px)}#f8{transform:translate3d(30px,60px,45px)}#f9{transform:translate3d(60px,60px,45px)}#b1{transform:translate3d(60px,0,-45px)}#b2{transform:translate3d(30px,0,-45px)}#b3{transform:translateZ(-45px)}#b4{transform:translate3d(60px,30px,-45px)}#b5{transform:translate3d(30px,30px,-45px)}#b6{transform:translate3d(0,30px,-45px)}#b7{transform:translate3d(60px,60px,-45px)}#b8{transform:translate3d(30px,60px,-45px)}#b9{transform:translate3d(0,60px,-45px)}#r1{transform:rotateY(90deg) translate3d(-30px,0,75px)}#r2{transform:rotateY(90deg) translateZ(75px)}#r3{transform:rotateY(90deg) translate3d(30px,0,75px)}#r4{transform:rotateY(90deg) translate3d(-30px,30px,75px)}#r5{transform:rotateY(90deg) translate3d(0,30px,75px)}#r6{transform:rotateY(90deg) translate3d(30px,30px,75px)}#r7{transform:rotateY(90deg) translate3d(-30px,60px,75px)}#r8{transform:rotateY(90deg) translate3d(0,60px,75px)}#r9{transform:rotateY(90deg) translate3d(30px,60px,75px)}#l1{transform:rotateY(90deg) translate3d(30px,0,-15px)}#l2{transform:rotateY(90deg) translateZ(-15px)}#l3{transform:rotateY(90deg) translate3d(-30px,0,-15px)}#l4{transform:rotateY(90deg) translate3d(30px,30px,-15px)}#l5{transform:rotateY(90deg) translate3d(0,30px,-15px)}#l6{transform:rotateY(90deg) translate3d(-30px,30px,-15px)}#l7{transform:rotateY(90deg) translate3d(30px,60px,-15px)}#l8{transform:rotateY(90deg) translate3d(0,60px,-15px)}#l9{transform:rotateY(90deg) translate3d(-30px,60px,-15px)}#u1{transform:rotateX(90deg) translate3d(0,-30px,15px)}#u2{transform:rotateX(90deg) translate3d(30px,-30px,15px)}#u3{transform:rotateX(90deg) translate3d(60px,-30px,15px)}#u4{transform:rotateX(90deg) translateZ(15px)}#u5{transform:rotateX(90deg) translate3d(30px,0,15px)}#u6{transform:rotateX(90deg) translate3d(60px,0,15px)}#u7{transform:rotateX(90deg) translate3d(0,30px,15px)}#u8{transform:rotateX(90deg) translate3d(30px,30px,15px)}#u9{transform:rotateX(90deg) translate3d(60px,30px,15px)}#d1{transform:rotateX(90deg) translate3d(0,30px,-75px)}#d2{transform:rotateX(90deg) translate3d(30px,30px,-75px)}#d3{transform:rotateX(90deg) translate3d(60px,30px,-75px)}#d4{transform:rotateX(90deg) translateZ(-75px)}#d5{transform:rotateX(90deg) translate3d(30px,0,-75px)}#d6{transform:rotateX(90deg) translate3d(60px,0,-75px)}#d7{transform:rotateX(90deg) translate3d(0,-30px,-75px)}#d8{transform:rotateX(90deg) translate3d(30px,-30px,-75px)}#d9{transform:rotateX(90deg) translate3d(60px,-30px,-75px)}@media screen and (max-width:1000px){.cube{margin:24vh auto 0}}.plane-cube{transform:scaleZ(1);transform-style:preserve-3d;transform-origin:center;margin:0 auto;width:80px;height:90px}#xf1{transform:translate(-30px,-30px)}#xf2{transform:translateY(-30px)}#xf3{transform:translate(30px,-30px)}#xf4{transform:translate(-30px)}#xf5{transform:translate(0)}#xf6{transform:translate(30px)}#xf7{transform:translate(-30px,30px)}#xf8{transform:translateY(30px)}#xf9{transform:translate(30px,30px)}#xu1{transform:translate(-30px,-120px)}#xu2{transform:translateY(-120px)}#xu3{transform:translate(30px,-120px)}#xu4{transform:translate(-30px,-90px)}#xu5{transform:translateY(-90px)}#xu6{transform:translate(30px,-90px)}#xu7{transform:translate(-30px,-60px)}#xu8{transform:translateY(-60px)}#xu9{transform:translate(30px,-60px)}#xd1{transform:translate(-30px,60px)}#xd2{transform:translateY(60px)}#xd3{transform:translate(30px,60px)}#xd4{transform:translate(-30px,90px)}#xd5{transform:translateY(90px)}#xd6{transform:translate(30px,90px)}#xd7{transform:translate(-30px,120px)}#xd8{transform:translateY(120px)}#xd9{transform:translate(30px,120px)}#xl1{transform:translate(-120px,-30px)}#xl2{transform:translate(-90px,-30px)}#xl3{transform:translate(-60px,-30px)}#xl4{transform:translate(-120px)}#xl5{transform:translate(-90px)}#xl6{transform:translate(-60px)}#xl7{transform:translate(-120px,30px)}#xl8{transform:translate(-90px,30px)}#xl9{transform:translate(-60px,30px)}#xr1{transform:translate(60px,-30px)}#xr2{transform:translate(90px,-30px)}#xr3{transform:translate(120px,-30px)}#xr4{transform:translate(60px)}#xr5{transform:translate(90px)}#xr6{transform:translate(120px)}#xr7{transform:translate(60px,30px)}#xr8{transform:translate(90px,30px)}#xr9{transform:translate(120px,30px)}#xb1{transform:translate(150px,-30px)}#xb2{transform:translate(180px,-30px)}#xb3{transform:translate(210px,-30px)}#xb4{transform:translate(150px)}#xb5{transform:translate(180px)}#xb6{transform:translate(210px)}#xb7{transform:translate(150px,30px)}#xb8{transform:translate(180px,30px)}#xb9{transform:translate(210px,30px)}@media screen and (max-width:1000px){.plane-cube{margin:24vh auto 0;transform:scale3d(.8,.8,.8)}}.cube{animation-timing-function:linear;animation-fill-mode:forwards;animation-duration:.2s}:root{--dt: rotateX(-17deg) rotateY(-30deg) scale3d(1.8, 1.8, 1.8)}.s11{animation-name:s11}@keyframes s11{0%{transform:var(--dt) rotateX(0)}to{transform:var(--dt) rotateX(0) rotateY(-90deg)}}.s12{animation-name:s12}@keyframes s12{0%{transform:var(--dt) rotateX(0)}to{transform:var(--dt) rotateX(0) rotateX(90deg)}}.s13{animation-name:s13}@keyframes s13{0%{transform:var(--dt) rotateX(0)}to{transform:var(--dt) rotateX(0) rotateY(90deg)}}.s14{animation-name:s14}@keyframes s14{0%{transform:var(--dt) rotateX(0)}to{transform:var(--dt) rotateX(0) rotateX(-90deg)}}.s21{animation-name:s21}@keyframes s21{0%{transform:var(--dt) rotateY(-90deg)}to{transform:var(--dt) rotateY(-90deg) rotateY(-90deg)}}.s22{animation-name:s22}@keyframes s22{0%{transform:var(--dt) rotateY(-90deg)}to{transform:var(--dt) rotateY(-90deg) rotate(-90deg)}}.s23{animation-name:s23}@keyframes s23{0%{transform:var(--dt) rotateY(-90deg)}to{transform:var(--dt) rotateY(-90deg) rotateY(90deg)}}.s24{animation-name:s24}@keyframes s24{0%{transform:var(--dt) rotateY(-90deg)}to{transform:var(--dt) rotateY(-90deg) rotate(90deg)}}.s31{animation-name:s31}@keyframes s31{0%{transform:var(--dt) rotateY(-180deg)}to{transform:var(--dt) rotateY(-180deg) rotateY(-90deg)}}.s32{animation-name:s32}@keyframes s32{0%{transform:var(--dt) rotateY(-180deg)}to{transform:var(--dt) rotateY(-180deg) rotateX(-90deg)}}.s33{animation-name:s33}@keyframes s33{0%{transform:var(--dt) rotateY(-180deg)}to{transform:var(--dt) rotateY(-180deg) rotateY(90deg)}}.s34{animation-name:s34}@keyframes s34{0%{transform:var(--dt) rotateY(-180deg)}to{transform:var(--dt) rotateY(-180deg) rotateX(90deg)}}.s41{animation-name:s41}@keyframes s41{0%{transform:var(--dt) rotateY(90deg)}to{transform:var(--dt) rotateY(90deg) rotateY(-90deg)}}.s42{animation-name:s42}@keyframes s42{0%{transform:var(--dt) rotateY(90deg)}to{transform:var(--dt) rotateY(90deg) rotate(90deg)}}.s43{animation-name:s43}@keyframes s43{0%{transform:var(--dt) rotateY(90deg)}to{transform:var(--dt) rotateY(90deg) rotateY(90deg)}}.s44{animation-name:s44}@keyframes s44{0%{transform:var(--dt) rotateY(90deg)}to{transform:var(--dt) rotateY(90deg) rotate(-90deg)}}.s51{animation-name:s51}@keyframes s51{0%{transform:var(--dt) rotateX(90deg)}to{transform:var(--dt) rotateX(90deg) rotate(90deg)}}.s52{animation-name:s52}@keyframes s52{0%{transform:var(--dt) rotateX(90deg)}to{transform:var(--dt) rotateX(90deg) rotateX(90deg)}}.s53{animation-name:s53}@keyframes s53{0%{transform:var(--dt) rotateX(90deg)}to{transform:var(--dt) rotateX(90deg) rotate(-90deg)}}.s54{animation-name:s54}@keyframes s54{0%{transform:var(--dt) rotateX(90deg)}to{transform:var(--dt) rotateX(90deg) rotateX(-90deg)}}.s61{animation-name:s61}@keyframes s61{0%{transform:var(--dt) rotateX(90deg) rotate(90deg)}to{transform:var(--dt) rotateX(90deg) rotate(90deg) rotate(90deg)}}.s62{animation-name:s62}@keyframes s62{0%{transform:var(--dt) rotateX(90deg) rotate(90deg)}to{transform:var(--dt) rotateX(90deg) rotate(90deg) rotateY(-90deg)}}.s63{animation-name:s63}@keyframes s63{0%{transform:var(--dt) rotateX(90deg) rotate(90deg)}to{transform:var(--dt) rotateX(90deg) rotate(90deg) rotate(-90deg)}}.s64{animation-name:s64}@keyframes s64{0%{transform:var(--dt) rotateX(90deg) rotate(90deg)}to{transform:var(--dt) rotateX(90deg) rotate(90deg) rotateY(90deg)}}.s71{animation-name:s71}@keyframes s71{0%{transform:var(--dt) rotateX(90deg) rotate(180deg)}to{transform:var(--dt) rotateX(90deg) rotate(180deg) rotate(90deg)}}.s72{animation-name:s72}@keyframes s72{0%{transform:var(--dt) rotateX(90deg) rotate(180deg)}to{transform:var(--dt) rotateX(90deg) rotate(180deg) rotateX(-90deg)}}.s73{animation-name:s73}@keyframes s73{0%{transform:var(--dt) rotateX(90deg) rotate(180deg)}to{transform:var(--dt) rotateX(90deg) rotate(180deg) rotate(-90deg)}}.s74{animation-name:s74}@keyframes s74{0%{transform:var(--dt) rotateX(90deg) rotate(180deg)}to{transform:var(--dt) rotateX(90deg) rotate(180deg) rotateX(90deg)}}.s81{animation-name:s81}@keyframes s81{0%{transform:var(--dt) rotateX(90deg) rotate(-90deg)}to{transform:var(--dt) rotateX(90deg) rotate(-90deg) rotate(90deg)}}.s82{animation-name:s82}@keyframes s82{0%{transform:var(--dt) rotateX(90deg) rotate(-90deg)}to{transform:var(--dt) rotateX(90deg) rotate(-90deg) rotateY(90deg)}}.s83{animation-name:s83}@keyframes s83{0%{transform:var(--dt) rotateX(90deg) rotate(-90deg)}to{transform:var(--dt) rotateX(90deg) rotate(-90deg) rotate(-90deg)}}.s84{animation-name:s84}@keyframes s84{0%{transform:var(--dt) rotateX(90deg) rotate(-90deg)}to{transform:var(--dt) rotateX(90deg) rotate(-90deg) rotateY(-90deg)}}.s91{animation-name:s91}@keyframes s91{0%{transform:var(--dt) rotate(90deg) rotateX(90deg)}to{transform:var(--dt) rotate(90deg) rotateX(90deg) rotateX(-90deg)}}.s92{animation-name:s92}@keyframes s92{0%{transform:var(--dt) rotate(90deg) rotateX(90deg)}to{transform:var(--dt) rotate(90deg) rotateX(90deg) rotate(90deg)}}.s93{animation-name:s93}@keyframes s93{0%{transform:var(--dt) rotate(90deg) rotateX(90deg)}to{transform:var(--dt) rotate(90deg) rotateX(90deg) rotateX(90deg)}}.s94{animation-name:s94}@keyframes s94{0%{transform:var(--dt) rotate(90deg) rotateX(90deg)}to{transform:var(--dt) rotate(90deg) rotateX(90deg) rotate(-90deg)}}.s101{animation-name:s101}@keyframes s101{0%{transform:var(--dt) rotate(90deg)}to{transform:var(--dt) rotate(90deg) rotateX(-90deg)}}.s102{animation-name:s102}@keyframes s102{0%{transform:var(--dt) rotate(90deg)}to{transform:var(--dt) rotate(90deg) rotateY(-90deg)}}.s103{animation-name:s103}@keyframes s103{0%{transform:var(--dt) rotate(90deg)}to{transform:var(--dt) rotate(90deg) rotateX(90deg)}}.s104{animation-name:s104}@keyframes s104{0%{transform:var(--dt) rotate(90deg)}to{transform:var(--dt) rotate(90deg) rotateY(90deg)}}.s111{animation-name:s111}@keyframes s111{0%{transform:var(--dt) rotate(90deg) rotateX(-90deg)}to{transform:var(--dt) rotate(90deg) rotateX(-90deg) rotateX(-90deg)}}.s112{animation-name:s112}@keyframes s112{0%{transform:var(--dt) rotate(90deg) rotateX(-90deg)}to{transform:var(--dt) rotate(90deg) rotateX(-90deg) rotate(-90deg)}}.s113{animation-name:s113}@keyframes s113{0%{transform:var(--dt) rotate(90deg) rotateX(-90deg)}to{transform:var(--dt) rotate(90deg) rotateX(-90deg) rotateX(90deg)}}.s114{animation-name:s114}@keyframes s114{0%{transform:var(--dt) rotate(90deg) rotateX(-90deg)}to{transform:var(--dt) rotate(90deg) rotateX(-90deg) rotate(90deg)}}.s121{animation-name:s121}@keyframes s121{0%{transform:var(--dt) rotate(90deg) rotateX(180deg)}to{transform:var(--dt) rotate(90deg) rotateX(180deg) rotateX(-90deg)}}.s122{animation-name:s122}@keyframes s122{0%{transform:var(--dt) rotate(90deg) rotateX(180deg)}to{transform:var(--dt) rotate(90deg) rotateX(180deg) rotateY(90deg)}}.s123{animation-name:s123}@keyframes s123{0%{transform:var(--dt) rotate(90deg) rotateX(180deg)}to{transform:var(--dt) rotate(90deg) rotateX(180deg) rotateX(90deg)}}.s124{animation-name:s124}@keyframes s124{0%{transform:var(--dt) rotate(90deg) rotateX(180deg)}to{transform:var(--dt) rotate(90deg) rotateX(180deg) rotateY(-90deg)}}.s131{animation-name:s131}@keyframes s131{0%{transform:var(--dt) rotateX(-90deg)}to{transform:var(--dt) rotateX(-90deg) rotate(-90deg)}}.s132{animation-name:s132}@keyframes s132{0%{transform:var(--dt) rotateX(-90deg)}to{transform:var(--dt) rotateX(-90deg) rotateX(90deg)}}.s133{animation-name:s133}@keyframes s133{0%{transform:var(--dt) rotateX(-90deg)}to{transform:var(--dt) rotateX(-90deg) rotate(90deg)}}.s134{animation-name:s134}@keyframes s134{0%{transform:var(--dt) rotateX(-90deg)}to{transform:var(--dt) rotateX(-90deg) rotateX(-90deg)}}.s141{animation-name:s141}@keyframes s141{0%{transform:var(--dt) rotateX(-90deg) rotate(-90deg)}to{transform:var(--dt) rotateX(-90deg) rotate(-90deg) rotate(-90deg)}}.s142{animation-name:s142}@keyframes s142{0%{transform:var(--dt) rotateX(-90deg) rotate(-90deg)}to{transform:var(--dt) rotateX(-90deg) rotate(-90deg) rotateY(90deg)}}.s143{animation-name:s143}@keyframes s143{0%{transform:var(--dt) rotateX(-90deg) rotate(-90deg)}to{transform:var(--dt) rotateX(-90deg) rotate(-90deg) rotate(90deg)}}.s144{animation-name:s144}@keyframes s144{0%{transform:var(--dt) rotateX(-90deg) rotate(-90deg)}to{transform:var(--dt) rotateX(-90deg) rotate(-90deg) rotateY(-90deg)}}.s151{animation-name:s151}@keyframes s151{0%{transform:var(--dt) rotateX(-90deg) rotate(180deg)}to{transform:var(--dt) rotateX(-90deg) rotate(180deg) rotate(-90deg)}}.s152{animation-name:s152}@keyframes s152{0%{transform:var(--dt) rotateX(-90deg) rotate(180deg)}to{transform:var(--dt) rotateX(-90deg) rotate(180deg) rotateX(-90deg)}}.s153{animation-name:s153}@keyframes s153{0%{transform:var(--dt) rotateX(-90deg) rotate(180deg)}to{transform:var(--dt) rotateX(-90deg) rotate(180deg) rotate(90deg)}}.s154{animation-name:s154}@keyframes s154{0%{transform:var(--dt) rotateX(-90deg) rotate(180deg)}to{transform:var(--dt) rotateX(-90deg) rotate(180deg) rotateX(90deg)}}.s161{animation-name:s161}@keyframes s161{0%{transform:var(--dt) rotateX(-90deg) rotate(90deg)}to{transform:var(--dt) rotateX(-90deg) rotate(90deg) rotate(-90deg)}}.s162{animation-name:s162}@keyframes s162{0%{transform:var(--dt) rotateX(-90deg) rotate(90deg)}to{transform:var(--dt) rotateX(-90deg) rotate(90deg) rotateY(-90deg)}}.s163{animation-name:s163}@keyframes s163{0%{transform:var(--dt) rotateX(-90deg) rotate(90deg)}to{transform:var(--dt) rotateX(-90deg) rotate(90deg) rotate(90deg)}}.s164{animation-name:s164}@keyframes s164{0%{transform:var(--dt) rotateX(-90deg) rotate(90deg)}to{transform:var(--dt) rotateX(-90deg) rotate(90deg) rotateY(90deg)}}.s171{animation-name:s171}@keyframes s171{0%{transform:var(--dt) rotate(-90deg) rotateX(-90deg)}to{transform:var(--dt) rotate(-90deg) rotateX(-90deg) rotateX(90deg)}}.s172{animation-name:s172}@keyframes s172{0%{transform:var(--dt) rotate(-90deg) rotateX(-90deg)}to{transform:var(--dt) rotate(-90deg) rotateX(-90deg) rotate(90deg)}}.s173{animation-name:s173}@keyframes s173{0%{transform:var(--dt) rotate(-90deg) rotateX(-90deg)}to{transform:var(--dt) rotate(-90deg) rotateX(-90deg) rotateX(-90deg)}}.s174{animation-name:s174}@keyframes s174{0%{transform:var(--dt) rotate(-90deg) rotateX(-90deg)}to{transform:var(--dt) rotate(-90deg) rotateX(-90deg) rotate(-90deg)}}.s181{animation-name:s181}@keyframes s181{0%{transform:var(--dt) rotate(-90deg)}to{transform:var(--dt) rotate(-90deg) rotateX(90deg)}}.s182{animation-name:s182}@keyframes s182{0%{transform:var(--dt) rotate(-90deg)}to{transform:var(--dt) rotate(-90deg) rotateY(90deg)}}.s183{animation-name:s183}@keyframes s183{0%{transform:var(--dt) rotate(-90deg)}to{transform:var(--dt) rotate(-90deg) rotateX(-90deg)}}.s184{animation-name:s184}@keyframes s184{0%{transform:var(--dt) rotate(-90deg)}to{transform:var(--dt) rotate(-90deg) rotateY(-90deg)}}.s191{animation-name:s191}@keyframes s191{0%{transform:var(--dt) rotate(-90deg) rotateX(90deg)}to{transform:var(--dt) rotate(-90deg) rotateX(90deg) rotateX(90deg)}}.s192{animation-name:s192}@keyframes s192{0%{transform:var(--dt) rotate(-90deg) rotateX(90deg)}to{transform:var(--dt) rotate(-90deg) rotateX(90deg) rotate(-90deg)}}.s193{animation-name:s193}@keyframes s193{0%{transform:var(--dt) rotate(-90deg) rotateX(90deg)}to{transform:var(--dt) rotate(-90deg) rotateX(90deg) rotateX(-90deg)}}.s194{animation-name:s194}@keyframes s194{0%{transform:var(--dt) rotate(-90deg) rotateX(90deg)}to{transform:var(--dt) rotate(-90deg) rotateX(90deg) rotate(90deg)}}.s201{animation-name:s201}@keyframes s201{0%{transform:var(--dt) rotate(-90deg) rotateX(180deg)}to{transform:var(--dt) rotate(-90deg) rotateX(180deg) rotateX(90deg)}}.s202{animation-name:s202}@keyframes s202{0%{transform:var(--dt) rotate(-90deg) rotateX(180deg)}to{transform:var(--dt) rotate(-90deg) rotateX(180deg) rotateY(-90deg)}}.s203{animation-name:s203}@keyframes s203{0%{transform:var(--dt) rotate(-90deg) rotateX(180deg)}to{transform:var(--dt) rotate(-90deg) rotateX(180deg) rotateX(-90deg)}}.s204{animation-name:s204}@keyframes s204{0%{transform:var(--dt) rotate(-90deg) rotateX(180deg)}to{transform:var(--dt) rotate(-90deg) rotateX(180deg) rotateY(90deg)}}.s211{animation-name:s211}@keyframes s211{0%{transform:var(--dt) rotateX(180deg)}to{transform:var(--dt) rotateX(180deg) rotateY(90deg)}}.s212{animation-name:s212}@keyframes s212{0%{transform:var(--dt) rotateX(180deg)}to{transform:var(--dt) rotateX(180deg) rotateX(90deg)}}.s213{animation-name:s213}@keyframes s213{0%{transform:var(--dt) rotateX(180deg)}to{transform:var(--dt) rotateX(180deg) rotateY(-90deg)}}.s214{animation-name:s214}@keyframes s214{0%{transform:var(--dt) rotateX(180deg)}to{transform:var(--dt) rotateX(180deg) rotateX(-90deg)}}.s221{animation-name:s221}@keyframes s221{0%{transform:var(--dt) rotateX(180deg) rotateY(90deg)}to{transform:var(--dt) rotateX(180deg) rotateY(90deg) rotateY(90deg)}}.s222{animation-name:s222}@keyframes s222{0%{transform:var(--dt) rotateX(180deg) rotateY(90deg)}to{transform:var(--dt) rotateX(180deg) rotateY(90deg) rotate(90deg)}}.s223{animation-name:s223}@keyframes s223{0%{transform:var(--dt) rotateX(180deg) rotateY(90deg)}to{transform:var(--dt) rotateX(180deg) rotateY(90deg) rotateY(-90deg)}}.s224{animation-name:s224}@keyframes s224{0%{transform:var(--dt) rotateX(180deg) rotateY(90deg)}to{transform:var(--dt) rotateX(180deg) rotateY(90deg) rotate(-90deg)}}.s231{animation-name:s231}@keyframes s231{0%{transform:var(--dt) rotate(180deg)}to{transform:var(--dt) rotate(180deg) rotateY(90deg)}}.s232{animation-name:s232}@keyframes s232{0%{transform:var(--dt) rotate(180deg)}to{transform:var(--dt) rotate(180deg) rotateX(-90deg)}}.s233{animation-name:s233}@keyframes s233{0%{transform:var(--dt) rotate(180deg)}to{transform:var(--dt) rotate(180deg) rotateY(-90deg)}}.s234{animation-name:s234}@keyframes s234{0%{transform:var(--dt) rotate(180deg)}to{transform:var(--dt) rotate(180deg) rotateX(90deg)}}.s241{animation-name:s241}@keyframes s241{0%{transform:var(--dt) rotateX(180deg) rotateY(-90deg)}to{transform:var(--dt) rotateX(180deg) rotateY(-90deg) rotateY(90deg)}}.s242{animation-name:s242}@keyframes s242{0%{transform:var(--dt) rotateX(180deg) rotateY(-90deg)}to{transform:var(--dt) rotateX(180deg) rotateY(-90deg) rotate(-90deg)}}.s243{animation-name:s243}@keyframes s243{0%{transform:var(--dt) rotateX(180deg) rotateY(-90deg)}to{transform:var(--dt) rotateX(180deg) rotateY(-90deg) rotateY(-90deg)}}.s244{animation-name:s244}@keyframes s244{0%{transform:var(--dt) rotateX(180deg) rotateY(-90deg)}to{transform:var(--dt) rotateX(180deg) rotateY(-90deg) rotate(90deg)}}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}body{font-family:var(--font-base);background:var(--color-bg);color:var(--color-text);display:flex;flex-direction:column;overflow-x:hidden}a{color:inherit;text-decoration:none}.splash{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-bg);display:grid;place-items:center;z-index:1000;transition:opacity .3s ease,visibility .3s ease}.splash.hide{opacity:0;visibility:hidden;pointer-events:none}.splash-card{text-align:center}.splash-title{font-size:1.5rem;font-weight:600;margin-bottom:.25rem}.splash-subtitle{font-size:.875rem;color:var(--color-muted);margin-bottom:1rem}.splash-grid{display:grid;grid-template-columns:repeat(3,16px);gap:4px;justify-content:center}.splash-grid span{width:16px;height:16px;border-radius:3px;background:var(--color-border);animation:splashPulse 1.2s ease-in-out infinite}.splash-grid span:nth-child(2){animation-delay:.1s}.splash-grid span:nth-child(3){animation-delay:.2s}.splash-grid span:nth-child(4){animation-delay:.3s}.splash-grid span:nth-child(5){animation-delay:.4s}.splash-grid span:nth-child(6){animation-delay:.5s}.splash-grid span:nth-child(7){animation-delay:.6s}.splash-grid span:nth-child(8){animation-delay:.7s}.splash-grid span:nth-child(9){animation-delay:.8s}@keyframes splashPulse{0%,to{opacity:.4;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}.header{height:var(--header-height);padding:0 1rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-border);background:var(--color-bg);position:relative;z-index:100}.header-left,.header-right{display:flex;align-items:center;gap:.5rem}.header-center{position:absolute;left:50%;transform:translate(-50%)}.header-title{font-size:1rem;font-weight:600;letter-spacing:-.01em}.header-btn{width:40px;height:40px;display:grid;place-items:center;background:transparent;border:none;border-radius:8px;color:var(--color-text);cursor:pointer;transition:background var(--transition-speed)}.header-btn:hover{background:var(--color-hover)}.header-btn svg{display:block}.cube-selector{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:8px;color:var(--color-text);padding:.5rem .75rem;font-size:.875rem;font-weight:500;cursor:pointer;min-width:80px;text-align:center}.cube-selector:focus{outline:none;border-color:var(--color-border-strong)}.menu-btn{display:none}@media (max-width: 700px){.menu-btn{display:grid}.header-title{display:none}}.hero{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem;gap:1rem;min-height:0}.scramble-bar{display:flex;align-items:center;gap:.75rem;max-width:600px;width:100%}.scramble-btn{flex-shrink:0;width:36px;height:36px;display:grid;place-items:center;background:transparent;border:1px solid var(--color-border);border-radius:8px;color:var(--color-text);cursor:pointer;transition:background var(--transition-speed)}.scramble-btn:hover{background:var(--color-hover)}.scramble-text{font-family:var(--font-mono);font-size:.9rem;line-height:1.5;color:var(--color-text);word-break:break-word;text-align:center;flex:1}.cube-area{display:flex;align-items:center;justify-content:center;width:100%;max-width:400px}.three-cube-container{width:280px;height:280px;overflow:visible;background:transparent}.three-cube-container canvas{display:block;width:100%;height:100%}@media (min-width: 700px){.three-cube-container{width:320px;height:320px}}.timer-area{display:flex;flex-direction:column;align-items:center;gap:.25rem}.timer-display{font-family:var(--font-mono);font-size:clamp(3rem,12vw,5rem);font-weight:600;letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums}.timer-hint{font-size:.75rem;color:var(--color-muted);text-transform:uppercase;letter-spacing:.05em}.inspection-display{font-size:1.25rem;font-weight:600;color:var(--color-muted)}.inspection-display.inspection-over{color:#f59e0b}.stats-bar{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:12px}.stat-pill{display:flex;flex-direction:column;align-items:center;gap:.125rem;padding:0 .75rem}.stat-pill .stat-label{font-size:.625rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-muted)}.stat-pill .stat-value{font-family:var(--font-mono);font-size:.875rem;font-weight:600}.stat-more{background:transparent;border:1px solid var(--color-border);border-radius:6px;color:var(--color-text);padding:.375rem .75rem;font-size:.75rem;cursor:pointer;transition:background var(--transition-speed)}.stat-more:hover{background:var(--color-hover)}.slide-panel{position:fixed;top:0;right:0;width:min(var(--panel-width),100vw);height:100%;background:var(--color-panel);border-left:1px solid var(--color-border);box-shadow:var(--shadow-panel);z-index:200;display:flex;flex-direction:column;transform:translate(100%);transition:transform var(--transition-speed) ease}.slide-panel.slide-left{left:0;right:auto;border-left:none;border-right:1px solid var(--color-border);box-shadow:4px 0 24px #00000080;transform:translate(-100%)}.slide-panel:not(.hide){transform:translate(0)}.panel-header{height:var(--header-height);padding:0 1rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-border);flex-shrink:0}.panel-title{font-size:1rem;font-weight:600}.panel-close{width:36px;height:36px;display:grid;place-items:center;background:transparent;border:none;border-radius:8px;color:var(--color-text);font-size:1.5rem;cursor:pointer;transition:background var(--transition-speed)}.panel-close:hover{background:var(--color-hover)}.panel-tabs{display:flex;border-bottom:1px solid var(--color-border);padding:0 1rem;flex-shrink:0}.tab-btn{flex:1;padding:.75rem .5rem;background:transparent;border:none;border-bottom:2px solid transparent;color:var(--color-muted);font-size:.875rem;cursor:pointer;transition:color var(--transition-speed),border-color var(--transition-speed)}.tab-btn:hover{color:var(--color-text)}.tab-btn.active{color:var(--color-text);border-bottom-color:var(--color-text)}.panel-content{flex:1;overflow-y:auto;padding:1rem}.tab-content{display:none}.tab-content.active{display:block}.panel-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-overlay);z-index:150;opacity:0;visibility:hidden;transition:opacity var(--transition-speed),visibility var(--transition-speed)}.panel-overlay:not(.hide){opacity:1;visibility:visible}.setting-group{padding:1rem 0;border-bottom:1px solid var(--color-border)}.setting-group:first-child{padding-top:0}.setting-group:last-child{border-bottom:none}.setting-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-muted);margin-bottom:.75rem}.setting-row{display:flex;align-items:center;justify-content:space-between;padding:.5rem 0;font-size:.875rem}.setting-row select,.setting-row input[type=checkbox]{accent-color:var(--color-text)}.setting-row select{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:6px;color:var(--color-text);padding:.375rem .5rem;font-size:.875rem}.session-select{width:100%;background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:6px;color:var(--color-text);padding:.5rem;font-size:.875rem;margin-bottom:.5rem}.session-actions{display:flex;gap:.5rem}.session-actions button{flex:1}.io-actions{display:flex;gap:.5rem}.io-actions button{flex:1}.btn-full{width:100%}.stats-grid-full{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;margin-bottom:1.5rem}.stat-card{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:10px;padding:.75rem;display:flex;flex-direction:column;gap:.25rem;text-align:center}.stat-card .stat-label{font-size:.625rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-muted)}.stat-value-lg{font-family:var(--font-mono);font-size:1.125rem;font-weight:600}.section-title{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-muted);margin-bottom:.75rem}.pb-section{margin-top:0}.pb-list{list-style:none;display:flex;flex-direction:column;gap:.5rem;max-height:200px;overflow-y:auto}.pb-item{display:flex;justify-content:space-between;align-items:center;padding:.5rem .75rem;background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:8px;font-size:.875rem}.pb-time{font-family:var(--font-mono);font-weight:600}.pb-meta{font-size:.75rem;color:var(--color-muted)}.solve-list{list-style:none;display:flex;flex-direction:column;gap:.5rem;max-height:400px;overflow-y:auto}.solve-item{padding:.75rem;background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:10px}.solve-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.solve-index{font-size:.75rem;color:var(--color-muted);min-width:24px}.solve-time{font-family:var(--font-mono);font-weight:600;font-size:1rem}.solve-actions{display:flex;gap:.25rem}.solve-penalty{background:transparent;border:1px solid var(--color-border);color:var(--color-text);border-radius:4px;padding:.125rem .375rem;font-size:.75rem;cursor:pointer}.solve-penalty:hover{background:var(--color-hover)}.solve-meta{margin-top:.375rem;font-size:.75rem;color:var(--color-muted);word-break:break-word}.btn-danger{width:100%;margin-top:1rem;background:transparent;border:1px solid var(--color-danger);color:var(--color-danger)}.btn-danger:hover{background:#ef44441a}.empty-state{text-align:center;padding:2rem 1rem;color:var(--color-muted);font-size:.875rem}.chart-card{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:10px;padding:1rem;margin-bottom:1rem;height:200px;display:flex;flex-direction:column}.chart-card:last-child{margin-bottom:0}.chart-title{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-muted);margin-bottom:.75rem}.chart-card canvas{flex:1;width:100%}.menu-nav{display:flex;flex-direction:column;gap:.25rem}.menu-item{display:flex;align-items:center;gap:.75rem;width:100%;padding:.875rem 1rem;background:transparent;border:none;border-radius:8px;color:var(--color-text);font-size:.9375rem;text-align:left;cursor:pointer;transition:background var(--transition-speed)}.menu-item:hover{background:var(--color-hover)}.menu-item svg{flex-shrink:0;color:var(--color-muted)}.menu-footer{margin-top:auto;padding:1rem 0;text-align:center;font-size:.75rem;color:var(--color-muted)}button{background:transparent;border:1px solid var(--color-border);border-radius:8px;color:var(--color-text);padding:.5rem 1rem;font-size:.875rem;cursor:pointer;transition:background var(--transition-speed)}button:hover{background:var(--color-hover)}button:focus-visible{outline:2px solid var(--color-text);outline-offset:2px}select:focus-visible,input:focus-visible{outline:2px solid var(--color-text);outline-offset:2px}.install-banner{position:fixed;left:50%;bottom:1.5rem;transform:translate(-50%);background:var(--color-panel);border:1px solid var(--color-border);border-radius:12px;padding:.75rem 1rem;display:flex;align-items:center;gap:1rem;z-index:300;max-width:min(90vw,400px);box-shadow:var(--shadow-lg);font-size:.875rem}.install-actions{display:flex;gap:.5rem;flex-shrink:0}#install-dismiss{width:32px;height:32px;padding:0;display:grid;place-items:center;font-size:1.25rem}.onboarding{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-overlay);display:grid;place-items:center;z-index:400;padding:1.5rem}.onboarding-card{background:var(--color-panel);border:1px solid var(--color-border);border-radius:16px;padding:1.5rem;width:min(380px,90vw);text-align:center}.onboarding-title{font-size:1.25rem;font-weight:600;margin-bottom:.5rem}.onboarding-text{font-size:.9375rem;color:var(--color-text);line-height:1.5;margin-bottom:1.25rem}.onboarding-actions{display:flex;gap:.75rem;justify-content:center}.tutorial-modal{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-overlay);display:grid;place-items:center;z-index:500;padding:1rem}.tutorial-card{background:var(--color-panel);border:1px solid var(--color-border);border-radius:16px;width:min(860px,95vw);max-height:85vh;display:flex;flex-direction:column;overflow:hidden}.tutorial-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;border-bottom:1px solid var(--color-border);flex-shrink:0}.tutorial-title{font-size:1.125rem;font-weight:600}.tutorial-step{font-size:.75rem;color:var(--color-muted)}.tutorial-close{width:36px;height:36px;font-size:1.5rem;padding:0}.tutorial-body{display:grid;grid-template-columns:200px 1fr;flex:1;min-height:0;overflow:hidden}.tutorial-sidebar{border-right:1px solid var(--color-border);padding:.75rem;overflow-y:auto}.tutorial-list{display:flex;flex-direction:column;gap:.25rem}.tutorial-item{padding:.625rem .75rem;border-radius:6px;cursor:pointer;font-size:.8125rem;color:var(--color-muted);transition:background var(--transition-speed),color var(--transition-speed)}.tutorial-item:hover{background:var(--color-hover);color:var(--color-text)}.tutorial-item.active{background:var(--color-active);color:var(--color-text)}.tutorial-item.completed{text-decoration:line-through}.tutorial-content{padding:1.25rem;display:flex;flex-direction:column;gap:.75rem;overflow-y:auto}.tutorial-step-title{font-size:1rem;font-weight:600}.tutorial-step-text{font-size:.9375rem;line-height:1.6;color:var(--color-text)}.tutorial-moves{margin-top:auto;padding-top:.75rem;border-top:1px solid var(--color-border);display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}.tutorial-moves-label{font-size:.6875rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-muted)}.tutorial-moves-text{font-family:var(--font-mono);font-weight:600}.tutorial-play{margin-left:auto}.tutorial-footer{display:flex;justify-content:space-between;gap:.5rem;padding:.875rem 1.25rem;border-top:1px solid var(--color-border);flex-shrink:0}@media (max-width: 700px){.tutorial-body{grid-template-columns:1fr}.tutorial-sidebar{border-right:none;border-bottom:1px solid var(--color-border);max-height:120px}}.hidden-compat,.hide{display:none!important}.hud,.hud-panel,.panel,.history-panel,.stats-panel,.charts-panel,.leaderboard-panel,.preview-panel,.solver-panel,.io-panel,.buttons,.layout,.cube-stage{display:none}.preview-net{--preview-cell-size: 14px;--preview-size: 3;display:grid;grid-template-columns:repeat(4,max-content);grid-template-rows:repeat(3,max-content);gap:6px;justify-content:center}.preview-face{display:grid;grid-template-columns:repeat(var(--preview-size, 3),var(--preview-cell-size));grid-template-rows:repeat(var(--preview-size, 3),var(--preview-cell-size));gap:2px;padding:2px;border:1px solid var(--color-border);border-radius:4px;background:var(--color-bg-elevated)}.preview-face span{width:var(--preview-cell-size);height:var(--preview-cell-size);border-radius:2px;border:1px solid rgba(0,0,0,.3)}.preview-up{grid-column:2;grid-row:1}.preview-left{grid-column:1;grid-row:2}.preview-front{grid-column:2;grid-row:2}.preview-right{grid-column:3;grid-row:2}.preview-back{grid-column:4;grid-row:2}.preview-down{grid-column:2;grid-row:3}.cube,.plane-cube{display:none}table,th,td{border:1px solid var(--color-border);border-collapse:collapse;text-align:center}table{width:100%;font-size:.8125rem;display:none}th,td{padding:.375rem}.leaderboard-controls{display:flex;gap:.5rem;align-items:center;margin-bottom:.5rem}.leaderboard-list{list-style:none;display:flex;flex-direction:column;gap:.375rem;max-height:220px;overflow-y:auto}.leaderboard-item{display:flex;justify-content:space-between;gap:.5rem;padding:.5rem .625rem;background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:8px;font-size:.8125rem}.leaderboard-name{font-weight:600}.leaderboard-meta{color:var(--color-muted);font-size:.6875rem;text-align:right}.leaderboard-empty,.leaderboard-note{font-size:.75rem;color:var(--color-muted)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:.5rem}.stat-item{border:1px solid var(--color-border);border-radius:8px;padding:.5rem;background:var(--color-bg-elevated);display:flex;flex-direction:column;gap:.25rem;font-size:.75rem;text-align:center}.copyright{display:none}
