@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800&family=Space+Grotesk:wght@400;600;700&display=swap";:root{font-family:Outfit,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#e0e6ed;background-color:#08090a;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--bg-deep: #050607;--bg-dark: #0c0e11;--bg-card: rgba(20, 24, 30, .6);--accent-cyan: #00e5ff;--accent-gold: #ffd600;--accent-green: #00e676;--accent-crimson: #ff1744;--border-glow: rgba(0, 229, 255, .15);--border-light: rgba(255, 255, 255, .08)}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 50% 0%,#101824,#050607 70%);background-attachment:fixed}#root{width:100%;min-height:100vh;display:flex;flex-direction:column}h1,h2,h3,h4{font-family:Space Grotesk,sans-serif;font-weight:700;letter-spacing:-.02em}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-deep)}::-webkit-scrollbar-thumb{background:var(--border-light);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--accent-cyan)}.glass-panel{background:var(--bg-card);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-light);border-radius:16px;box-shadow:0 8px 32px #0000005e;transition:all .3s cubic-bezier(.4,0,.2,1)}.glass-panel:hover{border-color:#00e5ff4d;box-shadow:0 8px 32px #00e5ff0d}.btn-primary{font-family:Space Grotesk,sans-serif;font-weight:600;background:linear-gradient(135deg,#00b0ff,#00e5ff);color:#050607;border:none;padding:12px 24px;border-radius:10px;cursor:pointer;box-shadow:0 4px 14px #00e5ff4d;transition:all .2s ease}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #00e5ff80}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{background:#20262f;color:#5d6878;box-shadow:none;cursor:not-allowed;transform:none}.btn-secondary{font-family:Space Grotesk,sans-serif;font-weight:600;background:transparent;color:var(--accent-cyan);border:1px solid rgba(0,229,255,.4);padding:12px 24px;border-radius:10px;cursor:pointer;transition:all .2s ease}.btn-secondary:hover{background:#00e5ff1a;border-color:var(--accent-cyan);box-shadow:0 0 12px #00e5ff33}.input-field{background:#0000004d;border:1px solid var(--border-light);border-radius:8px;color:#fff;padding:12px 16px;font-size:1rem;outline:none;transition:all .2s ease}.input-field:focus{border-color:var(--accent-cyan);box-shadow:0 0 8px #00e5ff33;background:#00000080}@keyframes pulseGlow{0%,to{box-shadow:0 0 8px #00e5ff33}50%{box-shadow:0 0 20px #00e5ff66}}.pulse-glow{animation:pulseGlow 2s infinite ease-in-out}.app-layout{display:flex;flex-direction:row;height:100vh;width:100vw;overflow:hidden}@media (max-width: 768px){.app-layout{flex-direction:column;height:auto;overflow:auto}}.sidebar{width:320px;background:var(--bg-dark);border-right:1px solid var(--border-light);padding:24px;display:flex;flex-direction:column;justify-content:space-between;overflow-y:auto;flex-shrink:0}@media (max-width: 768px){.sidebar{width:100%;border-right:none;border-bottom:1px solid var(--border-light);height:auto}}.main-content{flex:1;background:var(--bg-deep);overflow:auto;padding:24px;display:flex;align-items:center;justify-content:center;position:relative}.board-container{display:grid;gap:16px;padding:24px;border:1px solid rgba(255,255,255,.03);border-radius:24px;background:#ffffff03;box-shadow:inset 0 0 40px #00000080;position:relative}.board-cell{position:relative;width:110px;height:110px;display:flex;align-items:center;justify-content:center;border:2px dashed rgba(255,255,255,.04);border-radius:16px;transition:all .25s cubic-bezier(.4,0,.2,1);cursor:pointer}.board-cell.valid-placement{border-color:var(--accent-green);background:#00e67605}.board-cell.valid-placement:hover{background:#00e67614;transform:scale(1.03);box-shadow:0 0 15px #00e67626}.board-cell.placed-tile{background:#030405;border:1.5px solid var(--border-light);box-shadow:0 4px 20px #0006}.board-cell.placed-tile:hover{transform:scale(1.02);border-color:var(--accent-cyan);box-shadow:0 0 20px #00e5ff1a}.board-cell.disabled-cell{opacity:.25;cursor:not-allowed}.board-cell-coords{font-size:10px;font-family:monospace;color:#4a5568;pointer-events:none}.sidebar-section{display:flex;flex-direction:column;gap:16px}.lobby-container{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px;width:100%}.lobby-card{width:100%;max-width:440px;padding:32px}@keyframes floatEmoji{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.floating-emoji{animation:floatEmoji 2s infinite ease-in-out;pointer-events:none;z-index:10}@keyframes victoryScale{0%{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}@keyframes slowRotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes driftDown{0%{transform:translateY(-20px) translate(0) rotate(0);opacity:1}to{transform:translateY(105vh) translate(50px) rotate(360deg);opacity:0}}.victory-panel{animation:victoryScale .6s cubic-bezier(.16,1,.3,1) forwards}.victory-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:240px;height:240px;background:radial-gradient(circle,#ffd70026,#ffd70000 70%);border-radius:50%;filter:blur(10px);z-index:-1;animation:slowRotate 20s linear infinite}.confetti-particle{position:absolute;top:-20px;pointer-events:none;border-radius:50%;animation:driftDown 4s linear infinite}.kindle-spell-effect{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.caster-glow{position:absolute;width:40px;height:40px;margin-left:-20px;margin-top:-20px;border-radius:50%;background:radial-gradient(circle,#ff174499,#ff174400 70%);animation:pulse-caster .4s ease-out forwards}.kindle-projectile{position:absolute;width:12px;height:12px;margin-left:-6px;margin-top:-6px;border-radius:50%;background:#ff1744;box-shadow:0 0 12px #ff1744,0 0 24px #ffd600;animation:kindle-fly .8s cubic-bezier(.25,.46,.45,.94) forwards}.kindle-explosion{position:absolute;width:60px;height:60px;margin-left:-30px;margin-top:-30px;border-radius:50%;background:radial-gradient(circle,#ffd600 10%,#ff1744cc,#ff174400 70%);box-shadow:0 0 20px #ff1744;opacity:0;animation:kindle-explode .6s ease-out .7s forwards}.shield-effect{position:absolute;width:44px;height:44px;margin-left:-22px;margin-top:-22px;border-radius:50%;background:radial-gradient(circle,#00e5ff33 20%,#00e5ff00 70%);border:2px solid var(--accent-cyan);box-shadow:0 0 10px var(--accent-cyan);animation:shield-pulse .8s ease-out forwards}.miststep-effect{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.miststep-fadeout{position:absolute;width:40px;height:40px;margin-left:-20px;margin-top:-20px;border-radius:50%;background:radial-gradient(circle,#00e5ffb3 10%,#00e5ff00 70%);animation:mist-fade .8s ease-out forwards}.miststep-fadein{position:absolute;width:40px;height:40px;margin-left:-20px;margin-top:-20px;border-radius:50%;background:radial-gradient(circle,#00e5ffb3 10%,#00e5ff00 70%);animation:mist-fade-in .8s ease-out .4s forwards;opacity:0}.raise-stone-effect{position:absolute;width:20px;height:20px;margin-left:-10px;margin-top:-10px;border-radius:4px;background:#ff6d00;box-shadow:0 0 15px #ff6d00;animation:stone-rise .8s cubic-bezier(.175,.885,.32,1.275) forwards}.thorns-effect{position:absolute;width:60px;height:60px;margin-left:-30px;margin-top:-30px;border-radius:50%;background:radial-gradient(circle,#ff6d0066 10%,#ff6d0000 70%);border:2px solid rgba(255,109,0,.8);animation:heal-pulse 1s ease-out forwards}.don-wolf-effect{position:absolute;width:40px;height:40px;margin-left:-20px;margin-top:-20px;display:flex;align-items:center;justify-content:center;font-size:24px;animation:wolf-pulse 1.2s ease-out forwards}.deep-breath-effect{position:absolute;width:50px;height:50px;margin-left:-25px;margin-top:-25px;border-radius:50%;border:2px dashed var(--accent-green);animation:wind-spin 1.2s linear forwards}@keyframes pulse-caster{0%{transform:scale(.5);opacity:0}50%{transform:scale(1.5);opacity:1}to{transform:scale(1.8);opacity:0}}@keyframes kindle-fly{0%{transform:translate(var(--from-x),var(--from-y));opacity:1}85%{transform:translate(var(--to-x),var(--to-y));opacity:1;transform:translate(var(--to-x),var(--to-y)) scale(1)}to{transform:translate(var(--to-x),var(--to-y));opacity:0;transform:translate(var(--to-x),var(--to-y)) scale(.2)}}@keyframes kindle-explode{0%{transform:scale(.1);opacity:0}40%{transform:scale(1.2);opacity:1}to{transform:scale(1.8);opacity:0}}@keyframes shield-pulse{0%{transform:scale(.5);opacity:0}30%{transform:scale(1.2);opacity:1}70%{transform:scale(1.2);opacity:1}to{transform:scale(1.5);opacity:0}}@keyframes mist-fade{0%{transform:scale(1);opacity:1;filter:blur(0px)}to{transform:scale(2.2);opacity:0;filter:blur(4px)}}@keyframes mist-fade-in{0%{transform:scale(2.2);opacity:0;filter:blur(4px)}to{transform:scale(1);opacity:1;filter:blur(0px)}}@keyframes stone-rise{0%{transform:scale(.1);opacity:0}60%{transform:scale(1.3);opacity:1}to{transform:scale(1);opacity:.9}}@keyframes heal-pulse{0%{transform:scale(.5);opacity:1}to{transform:scale(2.5);opacity:0}}@keyframes wolf-pulse{0%{transform:translateY(0) scale(.5);opacity:0}30%{transform:translateY(-15px) scale(1.2);opacity:1}80%{transform:translateY(-15px) scale(1.2);opacity:1}to{transform:translateY(-25px) scale(.8);opacity:0}}@keyframes wind-spin{0%{transform:rotate(0) scale(.6);opacity:1}to{transform:rotate(360deg) scale(2);opacity:0}}@keyframes floatingCardReveal{0%{transform:translate(-50%,-30%) scale(.3);opacity:0}15%{transform:translate(-50%,-50%) scale(1.1);opacity:1}25%{transform:translate(-50%,-50%) scale(1);opacity:1}75%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-70%) scale(.8);opacity:0}}@keyframes normalCardReveal{0%{transform:translateY(45px) scale(.4);opacity:0}15%{transform:translateY(0) scale(1.05);opacity:1}25%{transform:translateY(0) scale(1);opacity:1}75%{transform:translateY(0) scale(1);opacity:1}to{transform:translateY(-45px) scale(.85);opacity:0}}@keyframes counteredCardReveal{0%{transform:translateY(45px) scale(.4);opacity:0}15%{transform:translateY(0) scale(1.05);opacity:1}25%{transform:translateY(0) scale(1);opacity:1}45%{transform:translateY(0) scale(1);opacity:1}60%{transform:translateY(-45px) scale(.85);opacity:0}to{transform:translateY(-45px) scale(.85);opacity:0}}@keyframes counterCardReveal{0%{transform:translateY(45px) scale(.4);opacity:0}18%{transform:translateY(45px) scale(.4);opacity:0}33%{transform:translateY(0) scale(1.05);opacity:1}43%{transform:translateY(0) scale(1);opacity:1}80%{transform:translateY(0) scale(1);opacity:1}to{transform:translateY(-45px) scale(.85);opacity:0}}