:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#ffffffde;background-color:#0a0a0f;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--cursor-wand: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cdefs%3E%3CradialGradient id='glow' cx='50%25' cy='50%25' r='50%25'%3E%3Cstop offset='0%25' stop-color='%23ffffff'/%3E%3Cstop offset='40%25' stop-color='%2300ffff'/%3E%3Cstop offset='100%25' stop-color='%234dabf7' stop-opacity='0'/%3E%3C/radialGradient%3E%3ClinearGradient id='wand' x1='100%25' y1='0%25' x2='0%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%23D2691E'/%3E%3Cstop offset='50%25' stop-color='%238B4513'/%3E%3Cstop offset='100%25' stop-color='%235C3317'/%3E%3C/linearGradient%3E%3C/defs%3E%3Ccircle cx='8' cy='8' r='12' fill='url(%23glow)' opacity='0.5'/%3E%3Cpath d='M44 44L12 12' stroke='url(%23wand)' stroke-width='4' stroke-linecap='round'/%3E%3Cpath d='M44 44L12 12' stroke='%23ffd700' stroke-width='1' stroke-linecap='round' opacity='0.3'/%3E%3Cellipse cx='8' cy='8' rx='5' ry='5' fill='%234dabf7'/%3E%3Cellipse cx='8' cy='8' rx='3' ry='3' fill='%2300ffff'/%3E%3Cellipse cx='7' cy='7' rx='1.5' ry='1.5' fill='%23ffffff'/%3E%3Ccircle cx='2' cy='4' r='1.2' fill='%23fff' opacity='0.9'/%3E%3Ccircle cx='12' cy='2' r='1' fill='%23fff' opacity='0.7'/%3E%3Ccircle cx='4' cy='14' r='0.8' fill='%2300ffff' opacity='0.8'/%3E%3Ccircle cx='14' cy='12' r='0.6' fill='%23fff' opacity='0.6'/%3E%3Ccircle cx='1' cy='10' r='0.7' fill='%234dabf7' opacity='0.7'/%3E%3C/svg%3E") 8 8, auto}html,body,*,*:before,*:after{cursor:var(--cursor-wand)!important}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}html{height:100%}body{margin:0;min-width:320px;min-height:100%;height:100%;overflow-x:auto;background-color:#050508;position:relative}body:before,body:after{content:"";position:fixed;inset:0;pointer-events:none}body:before{background-image:radial-gradient(1px 1px at 2% 8%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 5% 23%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 7% 45%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 4% 67%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 6% 89%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 12% 12%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 14% 34%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 11% 56%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 16% 78%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 13% 95%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 22% 5%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 24% 27%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 21% 49%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 26% 71%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 23% 93%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 32% 18%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 34% 40%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 31% 62%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 36% 84%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 33% 3%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 42% 15%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 44% 37%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 41% 59%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 46% 81%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 43% 97%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 52% 9%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 54% 31%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 51% 53%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 56% 75%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 53% 92%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 62% 4%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 64% 26%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 61% 48%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 66% 70%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 63% 88%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 72% 17%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 74% 39%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 71% 61%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 76% 83%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 73% 2%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 82% 14%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 84% 36%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 81% 58%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 86% 80%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 83% 96%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 92% 7%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 94% 29%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 91% 51%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 96% 73%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 93% 91%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 1% 33%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 9% 77%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 17% 22%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 27% 66%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 37% 11%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 47% 55%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 57% 99%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 67% 44%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 77% 88%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 87% 33%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 97% 77%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 3% 19%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 19% 41%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 29% 85%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 39% 29%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 49% 73%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 59% 17%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 69% 61%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 79% 5%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 89% 49%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 99% 93%,rgba(255,255,255,.6),transparent),radial-gradient(1.5px 1.5px at 5% 50%,rgba(255,135,135,.8),transparent),radial-gradient(1.5px 1.5px at 15% 20%,rgba(255,192,120,.75),transparent),radial-gradient(1.5px 1.5px at 25% 80%,rgba(116,192,252,.8),transparent),radial-gradient(1.5px 1.5px at 35% 40%,rgba(140,233,154,.75),transparent),radial-gradient(1.5px 1.5px at 45% 90%,rgba(192,235,117,.8),transparent),radial-gradient(1.5px 1.5px at 55% 30%,rgba(105,219,124,.75),transparent),radial-gradient(1.5px 1.5px at 65% 70%,rgba(56,217,169,.8),transparent),radial-gradient(1.5px 1.5px at 75% 10%,rgba(218,119,242,.75),transparent),radial-gradient(1.5px 1.5px at 85% 60%,rgba(250,162,193,.8),transparent),radial-gradient(1.5px 1.5px at 95% 95%,rgba(238,190,250,.75),transparent),radial-gradient(1.5px 1.5px at 10% 35%,rgba(116,192,252,.7),transparent),radial-gradient(1.5px 1.5px at 30% 65%,rgba(255,135,135,.75),transparent),radial-gradient(1.5px 1.5px at 50% 5%,rgba(218,119,242,.7),transparent),radial-gradient(1.5px 1.5px at 70% 45%,rgba(56,217,169,.75),transparent),radial-gradient(1.5px 1.5px at 90% 85%,rgba(255,192,120,.7),transparent),radial-gradient(1.5px 1.5px at 20% 55%,rgba(250,162,193,.75),transparent),radial-gradient(1.5px 1.5px at 40% 15%,rgba(140,233,154,.7),transparent),radial-gradient(1.5px 1.5px at 60% 75%,rgba(238,190,250,.75),transparent),radial-gradient(1.5px 1.5px at 80% 25%,rgba(192,235,117,.7),transparent),radial-gradient(2px 2px at 8% 42%,rgba(218,119,242,.7),transparent),radial-gradient(2px 2px at 18% 87%,rgba(116,192,252,.75),transparent),radial-gradient(2px 2px at 28% 32%,rgba(255,135,135,.7),transparent),radial-gradient(2px 2px at 38% 77%,rgba(56,217,169,.75),transparent),radial-gradient(2px 2px at 48% 22%,rgba(250,162,193,.7),transparent),radial-gradient(2px 2px at 58% 67%,rgba(140,233,154,.75),transparent),radial-gradient(2px 2px at 68% 12%,rgba(255,192,120,.7),transparent),radial-gradient(2px 2px at 78% 57%,rgba(238,190,250,.75),transparent),radial-gradient(2px 2px at 88% 2%,rgba(192,235,117,.7),transparent),radial-gradient(2px 2px at 98% 47%,rgba(105,219,124,.75),transparent),radial-gradient(2px 2px at 3% 72%,rgba(116,192,252,.7),transparent),radial-gradient(2px 2px at 13% 17%,rgba(218,119,242,.75),transparent),radial-gradient(2px 2px at 23% 62%,rgba(255,135,135,.7),transparent),radial-gradient(2px 2px at 33% 7%,rgba(56,217,169,.75),transparent),radial-gradient(2px 2px at 43% 52%,rgba(250,162,193,.7),transparent),radial-gradient(2px 2px at 53% 97%,rgba(140,233,154,.75),transparent),radial-gradient(.5px .5px at 7% 3%,rgba(255,255,255,.3),transparent),radial-gradient(.5px .5px at 94% 11%,rgba(255,255,255,.25),transparent),radial-gradient(.5px .5px at 31% 94%,rgba(255,255,255,.35),transparent),radial-gradient(.5px .5px at 67% 7%,rgba(255,255,255,.3),transparent),radial-gradient(.5px .5px at 23% 51%,rgba(255,255,255,.25),transparent),radial-gradient(.5px .5px at 81% 38%,rgba(255,255,255,.35),transparent),radial-gradient(.5px .5px at 44% 82%,rgba(255,255,255,.3),transparent),radial-gradient(.5px .5px at 12% 29%,rgba(255,255,255,.25),transparent),radial-gradient(.5px .5px at 56% 63%,rgba(255,255,255,.35),transparent),radial-gradient(.5px .5px at 89% 91%,rgba(255,255,255,.3),transparent),radial-gradient(.5px .5px at 38% 17%,rgba(255,255,255,.25),transparent),radial-gradient(.5px .5px at 71% 46%,rgba(255,255,255,.35),transparent),radial-gradient(.5px .5px at 3% 74%,rgba(255,255,255,.3),transparent),radial-gradient(.5px .5px at 59% 21%,rgba(255,255,255,.25),transparent),radial-gradient(.5px .5px at 26% 68%,rgba(255,255,255,.35),transparent),radial-gradient(1px 1px at 84% 4%,rgba(255,255,255,.45),transparent),radial-gradient(1px 1px at 17% 86%,rgba(255,255,255,.4),transparent),radial-gradient(1px 1px at 46% 13%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 73% 59%,rgba(255,255,255,.45),transparent),radial-gradient(1px 1px at 8% 37%,rgba(255,255,255,.4),transparent),radial-gradient(1px 1px at 61% 84%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 34% 26%,rgba(255,255,255,.45),transparent),radial-gradient(1px 1px at 91% 71%,rgba(255,255,255,.4),transparent),radial-gradient(1px 1px at 52% 43%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 19% 9%,rgba(255,255,255,.45),transparent),radial-gradient(.5px .5px at 76% 97%,rgba(255,255,255,.28),transparent),radial-gradient(.5px .5px at 41% 54%,rgba(255,255,255,.32),transparent),radial-gradient(.5px .5px at 14% 19%,rgba(255,255,255,.27),transparent),radial-gradient(.5px .5px at 87% 66%,rgba(255,255,255,.33),transparent),radial-gradient(.5px .5px at 29% 31%,rgba(255,255,255,.28),transparent),radial-gradient(.5px .5px at 64% 78%,rgba(255,255,255,.32),transparent),radial-gradient(.5px .5px at 96% 24%,rgba(255,255,255,.27),transparent),radial-gradient(.5px .5px at 48% 89%,rgba(255,255,255,.33),transparent),radial-gradient(.5px .5px at 6% 56%,rgba(255,255,255,.28),transparent),radial-gradient(.5px .5px at 79% 13%,rgba(255,255,255,.32),transparent),radial-gradient(1.5px 1.5px at 22% 73%,rgba(255,250,240,.55),transparent),radial-gradient(1.5px 1.5px at 57% 36%,rgba(240,245,255,.5),transparent),radial-gradient(1.5px 1.5px at 83% 81%,rgba(255,240,250,.55),transparent),radial-gradient(1.5px 1.5px at 11% 48%,rgba(245,255,250,.5),transparent),radial-gradient(1.5px 1.5px at 69% 2%,rgba(250,245,255,.55),transparent),radial-gradient(2px 2px at 36% 91%,rgba(255,255,255,.5),transparent),radial-gradient(2px 2px at 93% 34%,rgba(240,250,255,.55),transparent),radial-gradient(2px 2px at 4% 62%,rgba(255,245,240,.5),transparent),radial-gradient(2px 2px at 51% 8%,rgba(245,255,255,.55),transparent),radial-gradient(2px 2px at 77% 53%,rgba(255,255,245,.5),transparent),radial-gradient(.5px .5px at 33% 41%,rgba(255,255,255,.22),transparent),radial-gradient(.5px .5px at 66% 87%,rgba(255,255,255,.26),transparent),radial-gradient(.5px .5px at 2% 16%,rgba(255,255,255,.24),transparent),radial-gradient(.5px .5px at 88% 58%,rgba(255,255,255,.22),transparent),radial-gradient(.5px .5px at 47% 69%,rgba(255,255,255,.26),transparent),radial-gradient(2.5px 2.5px at 7% 23%,rgba(255,135,135,.75),transparent),radial-gradient(2.5px 2.5px at 94% 67%,rgba(116,192,252,.8),transparent),radial-gradient(2.5px 2.5px at 31% 8%,rgba(218,119,242,.75),transparent),radial-gradient(2.5px 2.5px at 68% 91%,rgba(56,217,169,.8),transparent),radial-gradient(2.5px 2.5px at 19% 54%,rgba(250,162,193,.75),transparent),radial-gradient(2px 2px at 83% 19%,rgba(255,192,120,.7),transparent),radial-gradient(2px 2px at 42% 76%,rgba(140,233,154,.75),transparent),radial-gradient(2px 2px at 11% 89%,rgba(238,190,250,.7),transparent),radial-gradient(2px 2px at 76% 34%,rgba(192,235,117,.75),transparent),radial-gradient(2px 2px at 54% 51%,rgba(105,219,124,.7),transparent),radial-gradient(2.5px 2.5px at 27% 39%,rgba(116,192,252,.8),transparent),radial-gradient(2.5px 2.5px at 89% 82%,rgba(255,135,135,.75),transparent),radial-gradient(2.5px 2.5px at 46% 14%,rgba(56,217,169,.8),transparent),radial-gradient(2.5px 2.5px at 63% 63%,rgba(218,119,242,.75),transparent),radial-gradient(2.5px 2.5px at 5% 71%,rgba(250,162,193,.8),transparent),radial-gradient(2px 2px at 72% 6%,rgba(140,233,154,.7),transparent),radial-gradient(2px 2px at 38% 97%,rgba(255,192,120,.75),transparent),radial-gradient(2px 2px at 16% 43%,rgba(238,190,250,.7),transparent),radial-gradient(2px 2px at 91% 28%,rgba(192,235,117,.75),transparent),radial-gradient(2px 2px at 59% 79%,rgba(105,219,124,.7),transparent),radial-gradient(2.5px 2.5px at 33% 61%,rgba(218,119,242,.78),transparent),radial-gradient(2.5px 2.5px at 81% 47%,rgba(116,192,252,.82),transparent),radial-gradient(2.5px 2.5px at 24% 16%,rgba(255,135,135,.78),transparent),radial-gradient(2.5px 2.5px at 97% 93%,rgba(56,217,169,.82),transparent),radial-gradient(2.5px 2.5px at 49% 32%,rgba(250,162,193,.78),transparent);background-size:100% 100%;will-change:transform;animation:drift-stars 45s ease-in-out infinite}body:after{background:radial-gradient(ellipse at 75% 15%,rgba(60,20,100,.15) 0%,transparent 50%),radial-gradient(ellipse at 25% 85%,rgba(20,50,100,.12) 0%,transparent 50%),radial-gradient(ellipse at 50% 50%,rgba(30,30,60,.1) 0%,transparent 70%);background-size:100% 100%;will-change:transform;animation:drift-nebula 68s ease-in-out infinite}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@keyframes drift-stars{0%{transform:translate(0)}25%{transform:translate(-66px,34px)}50%{transform:translate(-111px)}75%{transform:translate(-45px,-34px)}to{transform:translate(0)}}@keyframes drift-nebula{0%{transform:translate(0) scale(1)}33%{transform:translate(88px,-55px) scale(1.06)}66%{transform:translate(-66px,45px) scale(.94)}to{transform:translate(0) scale(1)}}@media(prefers-reduced-motion:reduce){body:before,body:after{animation:none!important}}#root{margin:0;padding:0;min-height:100vh;display:flex;justify-content:center;align-items:center;overflow:hidden}.container{position:relative;perspective:1000px;transform-style:preserve-3d;display:flex;justify-content:center;align-items:center;background:transparent}.ui-overlay{position:absolute;top:10px;left:50%;transform:translate(-50%) translateZ(200px);display:flex;flex-direction:column;align-items:center;gap:.5rem;z-index:100;pointer-events:auto}.word-input{padding:.75rem 1rem;font-size:1.25rem;border:2px solid #444;border-radius:8px;background-color:#1a1a1af2;color:inherit;width:300px;text-align:center;transition:border-color .25s;text-transform:uppercase;cursor:var(--cursor-wand)!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.word-input:focus{outline:none;border-color:#646cff;cursor:var(--cursor-wand)!important;caret-color:#646cff}.word-input::placeholder{color:#666;text-transform:none}.word-input--error{border-color:#f44}.word-input--error::placeholder{color:#f44}.word-input--error:focus{border-color:#f44}.error-message{color:#f44;font-size:1rem;text-shadow:0 0 10px rgba(255,68,68,.5)}.spell-message{color:#4dabf7;font-size:1rem;text-shadow:0 0 10px rgba(77,171,247,.5);animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.game-status{display:flex;align-items:center;gap:1rem;padding:.5rem 1rem;background:#00000080;border:1px solid rgba(100,108,255,.3);border-radius:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.game-status__group{color:#ffffffe6;font-size:.9rem;text-shadow:0 0 8px rgba(100,108,255,.5)}.game-status__reset{padding:.25rem .75rem;font-size:.75rem;background:#f443;border:1px solid rgba(255,68,68,.5);border-radius:4px;color:#f66;transition:all .2s}.game-status__reset:hover{background:#ff44444d;border-color:#ff4444b3}.game-status__tutorial{padding:.25rem .75rem;font-size:.75rem;background:#4facfe33;border:1px solid rgba(79,172,254,.5);border-radius:4px;color:#4facfe;transition:all .2s;cursor:pointer}.game-status__tutorial:hover{background:#4facfe4d;border-color:#4facfeb3}.game-status__mute{padding:.25rem .5rem;font-size:1rem;background:#646cff33;border:1px solid rgba(100,108,255,.5);border-radius:4px;color:#88f;transition:all .2s;cursor:pointer;line-height:1}.game-status__mute:hover{background:#646cff4d;border-color:#646cffb3}.audio-hint{font-size:.75rem;color:#c8b4ffcc;text-shadow:0 0 8px rgba(150,100,255,.5);font-style:italic;animation:pulse-hint 2s ease-in-out infinite;cursor:pointer}.audio-hint:hover{color:#dcc8ff}@keyframes pulse-hint{0%,to{opacity:.7}50%{opacity:1}}.scene-3d{transform-style:preserve-3d;background:transparent}.output-3d{display:flex;gap:8px;pointer-events:none}@media(prefers-color-scheme:light){.word-input{background-color:#fff;border-color:#ccc}.word-input:focus{border-color:#646cff}}.github-link{position:fixed;top:1.5rem;right:1.5rem;z-index:1000;color:#ffffff80;transition:all .4s ease;display:flex;align-items:center;justify-content:center;border-radius:50%;padding:10px;background:#0003;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.1);box-shadow:0 0 10px #0000004d}.github-link svg{width:32px;height:32px;filter:drop-shadow(0 0 2px rgba(0,0,0,.3));transition:all .4s ease}.github-link:hover{color:#fff;background:#4facfe26;border-color:#4facfe99;box-shadow:0 0 10px #4facfe40,0 0 20px #4facfe26}@keyframes starPulse{0%,to{transform:scale(1);box-shadow:0 0 6px #00000080}50%{transform:scale(1.05);box-shadow:0 0 10px #ffffff14}}.github-link:not(:hover){animation:starPulse 3s infinite ease-in-out}.tesseract{--outer-size: 75px;--inner-size: 35px;--glow-color: #4dabf7;--edge-length: 28px;--spin-duration: 4s;width:var(--outer-size);height:var(--outer-size);perspective:400px}.tesseract__hypercube{width:100%;height:100%;position:relative;transform-style:preserve-3d;transform:rotateX(0) rotateY(0);transition:transform .6s ease}.tesseract:hover .tesseract__hypercube{animation:tesseract-spin var(--spin-duration) linear infinite}@keyframes tesseract-spin{0%{transform:rotateX(0) rotateY(0)}to{transform:rotateX(360deg) rotateY(360deg)}}.tesseract--active .tesseract__hypercube{animation:tesseract-spin var(--spin-duration) linear infinite}.tesseract__cube{position:absolute;transform-style:preserve-3d}.tesseract__cube--outer{width:var(--outer-size);height:var(--outer-size);top:0;left:0}.tesseract__cube--outer .tesseract__face{position:absolute;width:var(--outer-size);height:var(--outer-size);background:transparent;border:1px solid var(--glow-color);opacity:.4;box-shadow:inset 0 0 5px #ffffff05,0 0 3px var(--glow-color)}.tesseract__cube--outer .tesseract__face--front{transform:translateZ(calc(var(--outer-size) / 2))}.tesseract__cube--outer .tesseract__face--back{transform:rotateY(180deg) translateZ(calc(var(--outer-size) / 2))}.tesseract__cube--outer .tesseract__face--right{transform:rotateY(90deg) translateZ(calc(var(--outer-size) / 2))}.tesseract__cube--outer .tesseract__face--left{transform:rotateY(-90deg) translateZ(calc(var(--outer-size) / 2))}.tesseract__cube--outer .tesseract__face--top{transform:rotateX(90deg) translateZ(calc(var(--outer-size) / 2))}.tesseract__cube--outer .tesseract__face--bottom{transform:rotateX(-90deg) translateZ(calc(var(--outer-size) / 2))}.tesseract__cube--inner{width:var(--inner-size);height:var(--inner-size);top:calc((var(--outer-size) - var(--inner-size)) / 2);left:calc((var(--outer-size) - var(--inner-size)) / 2)}.tesseract__cube--inner .tesseract__face{position:absolute;width:var(--inner-size);height:var(--inner-size);background:#0000004d;border:1px solid var(--glow-color);box-shadow:inset 0 0 12px #ffffff12,0 0 10px var(--glow-color);display:flex;flex-direction:column;align-items:center;justify-content:center;backface-visibility:hidden}.tesseract__cube--inner .tesseract__face--front{transform:translateZ(calc(var(--inner-size) / 2))}.tesseract__cube--inner .tesseract__face--back{transform:rotateY(180deg) translateZ(calc(var(--inner-size) / 2))}.tesseract__cube--inner .tesseract__face--right{transform:rotateY(90deg) translateZ(calc(var(--inner-size) / 2))}.tesseract__cube--inner .tesseract__face--left{transform:rotateY(-90deg) translateZ(calc(var(--inner-size) / 2))}.tesseract__cube--inner .tesseract__face--top{transform:rotateX(90deg) translateZ(calc(var(--inner-size) / 2))}.tesseract__cube--inner .tesseract__face--bottom{transform:rotateX(-90deg) translateZ(calc(var(--inner-size) / 2))}.tesseract__edge{position:absolute;width:1px;height:34.64px;background:var(--glow-color);opacity:.5;box-shadow:0 0 4px var(--glow-color);top:50%;left:50%;margin-left:-.5px;transform-origin:top center}.tesseract__edge--1{transform:translate3d(-37.5px,-37.5px,37.5px) rotate3d(-1,0,-1,54.74deg)}.tesseract__edge--2{transform:translate3d(37.5px,-37.5px,37.5px) rotate3d(-1,0,1,54.74deg)}.tesseract__edge--3{transform:translate3d(-37.5px,37.5px,37.5px) rotate3d(-1,0,-1,125.26deg)}.tesseract__edge--4{transform:translate3d(37.5px,37.5px,37.5px) rotate3d(-1,0,1,125.26deg)}.tesseract__edge--5{transform:translate3d(-37.5px,-37.5px,-37.5px) rotate3d(1,0,-1,54.74deg)}.tesseract__edge--6{transform:translate3d(37.5px,-37.5px,-37.5px) rotate3d(1,0,1,54.74deg)}.tesseract__edge--7{transform:translate3d(-37.5px,37.5px,-37.5px) rotate3d(1,0,-1,125.26deg)}.tesseract__edge--8{transform:translate3d(37.5px,37.5px,-37.5px) rotate3d(1,0,1,125.26deg)}.tesseract__number{font-size:8px;color:var(--glow-color);opacity:.8;line-height:1}.tesseract__symbol{font-size:14px;font-weight:700;color:var(--glow-color);text-shadow:0 0 5px var(--glow-color);line-height:1}.tesseract:hover .tesseract__cube--outer .tesseract__face{opacity:.6;box-shadow:inset 0 0 8px #ffffff0d,0 0 10px var(--glow-color)}.tesseract:hover .tesseract__cube--inner .tesseract__face{backface-visibility:visible;box-shadow:inset 0 0 15px #ffffff1a,0 0 15px var(--glow-color),0 0 25px var(--glow-color)}.tesseract:hover .tesseract__edge{opacity:.8;box-shadow:0 0 8px var(--glow-color)}.tesseract--active .tesseract__cube--outer .tesseract__face{opacity:.6;box-shadow:inset 0 0 8px #ffffff0d,0 0 10px var(--glow-color)}.tesseract--active .tesseract__cube--inner .tesseract__face{backface-visibility:visible;box-shadow:inset 0 0 15px #ffffff1a,0 0 15px var(--glow-color),0 0 25px var(--glow-color)}.tesseract--active .tesseract__edge{opacity:.8;box-shadow:0 0 8px var(--glow-color)}.tesseract--locked{--glow-color: #777777 !important;opacity:.4;filter:saturate(0)}.tesseract--locked .tesseract__cube--outer .tesseract__face{opacity:.27}.tesseract--locked .tesseract__cube--inner .tesseract__face{background:#23232373;box-shadow:inset 0 0 6px #ffffff08,0 0 3px var(--glow-color)}.tesseract--locked .tesseract__edge{opacity:.22}.tesseract--active-group{opacity:.55}.tesseract--active-group .tesseract__cube--outer .tesseract__face{opacity:.38;box-shadow:inset 0 0 6px #ffffff0a,0 0 6px var(--glow-color)}.tesseract--active-group .tesseract__cube--inner .tesseract__face{box-shadow:inset 0 0 10px #ffffff0d,0 0 8px var(--glow-color)}.tesseract--active-group .tesseract__edge{opacity:.35;box-shadow:0 0 5px var(--glow-color)}.tesseract--group-unlocked{opacity:.4}.tesseract--group-unlocked .tesseract__cube--outer .tesseract__face{opacity:.25}.tesseract--group-unlocked .tesseract__cube--inner .tesseract__face{box-shadow:inset 0 0 4px #ffffff05,0 0 3px var(--glow-color)}.tesseract--group-unlocked .tesseract__edge{opacity:.25}.tesseract--element-unlocked{opacity:1}.tesseract--element-unlocked .tesseract__cube--outer .tesseract__face{opacity:.47;box-shadow:inset 0 0 5px #ffffff08,0 0 5px var(--glow-color)}.tesseract--element-unlocked .tesseract__cube--inner .tesseract__face{box-shadow:inset 0 0 10px #ffffff0d,0 0 8px var(--glow-color)}.tesseract--element-unlocked .tesseract__edge{opacity:.5;box-shadow:0 0 4px var(--glow-color)}.tesseract:hover .tesseract__cube--outer .tesseract__face,.tesseract--active .tesseract__cube--outer .tesseract__face{opacity:.6!important;box-shadow:inset 0 0 8px #ffffff0d,0 0 10px var(--glow-color)!important}.tesseract:hover .tesseract__cube--inner .tesseract__face,.tesseract--active .tesseract__cube--inner .tesseract__face{backface-visibility:visible!important;box-shadow:inset 0 0 15px #ffffff1a,0 0 15px var(--glow-color),0 0 25px var(--glow-color)!important}.tesseract:hover .tesseract__edge,.tesseract--active .tesseract__edge{opacity:.8!important;box-shadow:0 0 8px var(--glow-color)!important}.periodic-table{padding:20px;background:transparent}.periodic-table__grid{display:grid;grid-template-columns:repeat(18,80px);grid-template-rows:repeat(9,80px);gap:4px;perspective:1000px}.periodic-table__cell{display:flex;align-items:center;justify-content:center}.periodic-table__cell[style*="grid-row: 8"],.periodic-table__cell[style*="grid-row: 9"]{margin-top:10px}.tesseract-2d{--size: 35px;--glow-color: #4dabf7;width:var(--size);height:var(--size);background:#00000026;border:1px solid rgba(0,0,0,.6);outline:1px solid var(--glow-color);box-shadow:0 0 4px var(--glow-color);display:flex;flex-direction:column;align-items:center;justify-content:center}.tesseract-2d__number{font-size:.5rem;color:#ffffffb3;text-shadow:0 0 5px var(--glow-color)}.tesseract-2d__symbol{font-size:.9rem;font-weight:700;color:#fffffff2;text-shadow:0 0 8px var(--glow-color)}.tutorial-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0006;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;justify-content:center;align-items:center;z-index:2000;animation:fadeIn .3s ease-out}.tutorial-modal{background:#14141ef2;border:1px solid rgba(255,255,255,.1);box-shadow:0 0 40px #0096ff26,inset 0 0 0 1px #ffffff0d;border-radius:16px;width:90%;max-width:600px;padding:2rem;position:relative;color:#fff;display:flex;flex-direction:column;gap:1.5rem;animation:slideIn .3s ease-out}.tutorial-close{position:absolute;top:1rem;right:1rem;background:none;border:none;color:#ffffff80;font-size:1.5rem;cursor:pointer;transition:color .2s;padding:.5rem;line-height:1}.tutorial-close:hover{color:#fff}.tutorial-progress{display:flex;gap:.5rem;margin-bottom:.5rem}.tutorial-progress-dot{width:8px;height:8px;border-radius:50%;background:#fff3;transition:background .3s}.tutorial-progress-dot.active{background:#4facfe;box-shadow:0 0 8px #4facfe}.tutorial-content{flex:1}.tutorial-content h2{font-family:Outfit,sans-serif;font-size:1.8rem;margin-bottom:1rem;background:linear-gradient(135deg,#fff,#a5b4fc);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.tutorial-content p{font-family:Inter,sans-serif;line-height:1.6;color:#ffffffe6;margin-bottom:1rem}.tutorial-content ul{list-style-type:none;padding-left:0}.tutorial-content li{margin-bottom:.8rem;padding-left:1.5rem;position:relative}.tutorial-content li:before{content:"•";color:#4facfe;position:absolute;left:0;font-weight:700}.tutorial-content strong{color:#a5b4fc}.tutorial-controls{display:flex;justify-content:space-between;align-items:center;margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.1)}.tutorial-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.1);color:#fff;padding:.6rem 1.2rem;border-radius:8px;cursor:pointer;font-family:Outfit,sans-serif;font-weight:500;transition:all .2s}.tutorial-btn:hover:not(:disabled){background:#fff3;transform:translateY(-1px)}.tutorial-btn:disabled{opacity:.3;cursor:not-allowed}.tutorial-btn.primary{background:linear-gradient(135deg,#4facfe,#00f2fe);border:none;color:#000;font-weight:600}.tutorial-btn.primary:hover{opacity:.9;box-shadow:0 0 15px #4facfe66}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.tutorial-example{background:#0000004d;padding:1rem;border-radius:8px;border-left:3px solid #4facfe;margin:1rem 0;font-family:monospace}