:root{color-scheme:dark;font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif;line-height:1.5;--bg-deep: #050510;--bg-primary: #0a0a1a;--bg-card: #141428;--bg-cell: #1a1a35;--bg-cell-hover: #22224a;--text-primary: #eeeef8;--text-secondary: #8888aa;--text-muted: #555570;--cell-size: 56px;--grid-gap: 3px;--endpoint-size: 30px}@media(max-width:600px){:root{--cell-size: 44px;--endpoint-size: 24px;--grid-gap: 2px}}@media(max-width:400px){:root{--cell-size: 38px;--endpoint-size: 20px}}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;background:var(--bg-deep);color:var(--text-primary)}.app{min-height:100vh;display:flex;flex-direction:column}.screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.home-screen{background:radial-gradient(ellipse at 50% 30%,#1a1a40 0%,var(--bg-deep) 70%);gap:1rem}.home-logo{text-align:center;margin-bottom:1rem}.home-cords{display:flex;justify-content:center;gap:6px;margin-bottom:1.5rem}.home-cord{width:8px;height:60px;border-radius:4px;animation:cordWave 2s ease-in-out infinite}.home-cord:nth-child(1){background:#f36;animation-delay:0s}.home-cord:nth-child(2){background:#3b82f6;animation-delay:.15s}.home-cord:nth-child(3){background:#22c55e;animation-delay:.3s}.home-cord:nth-child(4){background:#eab308;animation-delay:.45s}.home-cord:nth-child(5){background:#a855f7;animation-delay:.6s}.home-cord:nth-child(6){background:#06b6d4;animation-delay:.75s}@keyframes cordWave{0%,to{transform:scaleY(1)}50%{transform:scaleY(1.4)}}.game-title{font-size:2.8rem;font-weight:900;letter-spacing:-.03em;background:linear-gradient(135deg,#f36,#3b82f6,#22c55e,#eab308,#a855f7);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 4s ease infinite;line-height:1.1}@keyframes gradientShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.subtitle{color:var(--text-secondary);font-size:1rem;margin-top:.5rem}.home-buttons{width:100%;max-width:280px;margin-top:1rem}.btn{display:block;width:100%;padding:.85rem 2rem;border:none;border-radius:12px;font-size:1.05rem;font-weight:600;cursor:pointer;transition:all .2s ease;margin-bottom:.7rem;font-family:inherit}.btn:active{transform:scale(.97)}.btn-primary{background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;box-shadow:0 4px 20px #6366f14d}.btn-primary:hover{box-shadow:0 6px 25px #6366f173;transform:translateY(-1px)}.btn-secondary{background:var(--bg-card);color:var(--text-primary);border:1px solid rgba(255,255,255,.08)}.btn-secondary:hover{background:#1e1e3a;border-color:#ffffff26}.btn-small{padding:.5rem 1rem;font-size:.85rem;width:auto;display:inline-flex;align-items:center;gap:.4rem}.btn-icon{background:var(--bg-card);color:var(--text-primary);border:1px solid rgba(255,255,255,.08);width:40px;height:40px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:10px;font-size:1.1rem;cursor:pointer;transition:all .2s}.btn-icon:hover{background:#1e1e3a}.level-select-screen{background:var(--bg-deep);gap:1.5rem}.screen-header{text-align:center}.screen-title{font-size:1.6rem;font-weight:700}.screen-subtitle{color:var(--text-secondary);font-size:.9rem;margin-top:.25rem}.level-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.75rem;max-width:420px;width:100%}@media(max-width:500px){.level-grid{grid-template-columns:repeat(4,1fr)}}.level-card{background:var(--bg-card);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:.75rem .5rem;text-align:center;cursor:pointer;transition:all .2s ease;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem}.level-card:hover:not(.locked){transform:translateY(-2px);border-color:#ffffff26;background:#1a1a3a}.level-card.locked{opacity:.35;cursor:not-allowed}.level-number{font-size:1.4rem;font-weight:700}.level-name{font-size:.6rem;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.level-stars-display{font-size:.7rem;letter-spacing:1px}.level-difficulty{font-size:.5rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em}.game-screen{background:var(--bg-deep);padding:2rem 1rem 1rem;gap:1rem;justify-content:flex-start}.game-header{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:500px}.game-info{text-align:center;flex:1}.game-level-label{font-size:.7rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.15em}.game-level-name{font-size:1.15rem;font-weight:700}.game-stats{display:flex;gap:1.5rem;justify-content:center;width:100%;max-width:500px}.stat{display:flex;flex-direction:column;align-items:center;gap:.1rem}.stat-value{font-size:1.2rem;font-weight:700;font-variant-numeric:tabular-nums}.stat-label{font-size:.65rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em}.grid-wrapper{display:flex;flex-direction:column;align-items:center}.grid{display:grid;gap:var(--grid-gap);background:#ffffff08;padding:var(--grid-gap);border-radius:14px;touch-action:none;user-select:none;-webkit-user-select:none;position:relative}.cell{width:var(--cell-size);height:var(--cell-size);background:var(--bg-cell);border-radius:6px;position:relative;transition:background-color .1s ease;cursor:pointer;overflow:hidden}.cell:hover{background:var(--bg-cell-hover)}.cell.path-cell{transition:background-color .08s ease}.cell.endpoint-cell{display:flex;align-items:center;justify-content:center}.endpoint-dot{width:var(--endpoint-size);height:var(--endpoint-size);border-radius:50%;animation:pulse 2s ease-in-out infinite;position:relative;z-index:2}@keyframes pulse{0%,to{transform:scale(1);box-shadow:0 0 10px currentColor}50%{transform:scale(1.12);box-shadow:0 0 20px currentColor}}.cell.path-cell.solid{filter:none}.cell.path-cell.neon{box-shadow:inset 0 0 12px #ffffff40}.cell.path-cell.gradient-style{background-image:linear-gradient(135deg,rgba(255,255,255,.15) 0%,transparent 50%)}.game-controls{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap}.control-btn{padding:.5rem 1rem;background:var(--bg-card);border:1px solid rgba(255,255,255,.08);border-radius:10px;color:var(--text-primary);font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s;font-family:inherit;display:flex;align-items:center;gap:.35rem}.control-btn:hover{background:#1e1e3a;border-color:#ffffff26}.control-btn:active{transform:scale(.95)}.control-btn.danger{border-color:#ff323233}.control-btn.danger:hover{background:#ff32321a}.hint-banner{background:var(--bg-card);border:1px solid rgba(255,255,255,.06);border-radius:10px;padding:.6rem 1rem;font-size:.8rem;color:var(--text-secondary);text-align:center;max-width:400px;line-height:1.4}.color-legend{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap}.legend-item{display:flex;align-items:center;gap:.3rem;font-size:.75rem;color:var(--text-secondary)}.legend-dot{width:12px;height:12px;border-radius:50%}.legend-item.connected .legend-dot{box-shadow:0 0 8px currentColor}.legend-item.connected{color:var(--text-primary)}.victory-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;display:flex;align-items:center;justify-content:center;z-index:100;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:fadeIn .2s ease}.victory-modal{background:var(--bg-card);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:2rem 2.5rem;text-align:center;max-width:340px;width:90%;animation:slideUp .35s ease;position:relative;overflow:hidden}@keyframes slideUp{0%{transform:translateY(40px);opacity:0}to{transform:translateY(0);opacity:1}}.victory-title{font-size:1.8rem;font-weight:800;margin-bottom:.25rem}.victory-subtitle{color:var(--text-secondary);font-size:.9rem;margin-bottom:1rem}.victory-stars{font-size:2.8rem;margin:.75rem 0;letter-spacing:4px}.star-filled{color:#eab308;text-shadow:0 0 15px rgba(234,179,8,.5)}.star-empty{color:#333350}.victory-stats{display:flex;justify-content:center;gap:2.5rem;margin:1rem 0 1.5rem}.victory-stat-value{font-size:1.4rem;font-weight:700}.victory-stat-label{font-size:.7rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em}.victory-buttons{display:flex;gap:.75rem}.victory-buttons .btn{flex:1;margin-bottom:0}.confetti-piece{position:fixed;top:-10px;z-index:101;pointer-events:none;animation:confettiFall var(--fall-duration, 3s) linear forwards;animation-delay:var(--fall-delay, 0s);opacity:.9}@keyframes confettiFall{0%{transform:translateY(0) rotate(0) scale(1);opacity:.9}to{transform:translateY(100vh) rotate(var(--fall-rotation, 720deg)) scale(.5);opacity:0}}.styles-screen{background:var(--bg-deep);gap:1.5rem}.styles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;max-width:380px;width:100%}.style-option{background:var(--bg-card);border:2px solid rgba(255,255,255,.06);border-radius:14px;padding:1rem;text-align:center;cursor:pointer;transition:all .2s}.style-option:hover{border-color:#ffffff26}.style-option.active{border-color:#6366f1;box-shadow:0 0 20px #6366f133}.style-name{font-size:.85rem;font-weight:600;margin-bottom:.5rem}.style-preview{height:30px;border-radius:6px;margin-bottom:.3rem}.style-desc{font-size:.65rem;color:var(--text-muted)}.top-bar{width:100%;max-width:500px;display:flex;align-items:center}.top-bar .btn-icon{margin-right:auto}.progress-bar{width:100%;max-width:400px;height:4px;background:#ffffff0d;border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#6366f1,#8b5cf6);border-radius:2px;transition:width .3s ease}