#sound-toggle{justify-content:center;align-items:center;min-width:40px;padding:8px;display:flex}#sound-toggle .sound-icon{width:20px;height:20px}#sound-toggle .sound-icon.hidden{display:none}.sort-puzzle #game-container{-webkit-overflow-scrolling:touch;justify-content:center;align-items:flex-start;width:100%;min-height:60vh;padding:20px 0;display:flex;overflow:visible}.sort-puzzle.immersive-mode #game-container{align-items:flex-start;min-height:calc(100vh - 140px);max-height:calc(100vh - 140px);padding-top:20px;height:auto!important;overflow:visible auto!important}#sort-puzzle-container{justify-content:center;align-items:flex-start;width:100%;max-width:100%;margin:0 auto;padding:20px 20px 10px;display:flex}.containers-grid{flex-flow:wrap;justify-content:center;align-items:flex-start;gap:16px;width:100%;margin:0 auto;padding:0;display:flex}.puzzle-container{cursor:pointer;flex-shrink:0;transition:transform .2s,box-shadow .2s;position:relative}.puzzle-container.hovering{transform:translateY(-4px)}.puzzle-container.hovering .container-tube{border-color:#d8c3a5;box-shadow:0 4px 16px #d8c3a566}.puzzle-container.selected{transform:translateY(-8px)scale(1.05)}.puzzle-container.valid-target{transform:translateY(-4px)}.puzzle-container.valid-target .container-tube{border-color:#10b981;animation:1s ease-in-out infinite validPulse;box-shadow:0 4px 16px #10b98166}@keyframes validPulse{0%,to{box-shadow:0 4px 16px #10b98166}50%{box-shadow:0 6px 24px #10b98199}}.puzzle-container.invalid-target{transform:translateY(-2px)}.puzzle-container.invalid-target .container-tube{border-color:#ef4444;animation:.4s ease-in-out shake;box-shadow:0 4px 16px #ef44444d}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.container-tube{background:#fff9;border:3px solid #eadfce;border-radius:8px 8px 12px 12px;gap:2px;width:80px;height:200px;padding:4px;position:relative;overflow:hidden;box-shadow:0 4px 12px #0000001a,inset 0 2px 8px #fffc;flex-flow:column-reverse!important;display:flex!important}.puzzle-container.selected .container-tube{border-color:#e0603a;animation:.5s ease-in-out pulse;box-shadow:0 6px 20px #e0603a4d,inset 0 2px 8px #fffc}@keyframes pulse{0%,to{box-shadow:0 8px 32px #e0603a66}50%{box-shadow:0 8px 40px #e0603a99}}.color-segment{border-radius:6px;flex-shrink:0;width:100%;min-width:100%;height:44px;min-height:44px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:inset 0 2px 6px #ffffff80,inset 0 -2px 6px #0003,0 3px 6px #00000026}.color-segment.empty{box-shadow:none;background:0 0}.color-segment:not(.empty){animation:.3s ease-out fillUp}.color-segment:not(.empty):before{content:"";pointer-events:none;background:linear-gradient(135deg,#fff6 0%,#ffffff1a 40%,#0000 50%,#0000001a 60%,#00000040 100%);border-radius:6px;position:absolute;inset:0}.color-segment.pattern-striped{background-image:repeating-linear-gradient(45deg,#0000,#0000 3px,#fff3 3px 6px)}.color-segment.pattern-dotted{background-image:radial-gradient(circle,#ffffff4d 1.5px,#0000 1.5px);background-size:8px 8px}.color-segment.pattern-gradient:after{content:"";pointer-events:none;background:linear-gradient(#ffffff40 0%,#0000 40% 60%,#00000026 100%);border-radius:6px;position:absolute;inset:0}@keyframes fillUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.completion-stats{margin:20px 0;padding:20px 0}.stat-row{border-bottom:1px solid #cbd5e080;justify-content:space-between;align-items:center;padding:12px 0;display:flex}.stat-row:last-child{border-bottom:none}.stat-row .stat-label{color:#6a5f52;font-weight:500}.stat-row .stat-value{color:#241f1a;font-size:1.25rem;font-weight:700}.modal-actions{justify-content:center;gap:12px;margin-top:20px;display:flex}.modal-actions button{flex:1;max-width:200px}@media (width<=768px){.containers-grid{justify-content:center;gap:12px;padding-top:0}#sort-puzzle-container{width:100%;padding:20px 16px 10px}.container-tube{width:70px;height:200px}.color-segment{height:46px}.sort-puzzle #game-container{min-height:auto;padding:10px 8px}.sort-puzzle.immersive-mode #game-container{padding-top:10px}}@media (width<=480px){.containers-grid{justify-content:center;gap:8px}#sort-puzzle-container{width:100%;padding:20px 10px 8px}.container-tube{width:calc(20vw - 12px);min-width:50px;max-width:65px}.color-segment{height:40px}.stat-row .stat-value{font-size:1.1rem}.sort-puzzle #game-container{padding:10px 4px 8px}.sort-puzzle.immersive-mode #game-container{padding-top:10px!important}}@media (width<=360px){.container-tube{width:calc(20vw - 10px);min-width:45px;max-width:58px;height:160px}.color-segment{height:36px}.containers-grid{gap:6px}}@keyframes celebrate{0%,to{transform:scale(1)rotate(0)}25%{transform:scale(1.1)rotate(-5deg)}75%{transform:scale(1.1)rotate(5deg)}}.puzzle-container.complete .container-tube{border-color:#10b981;animation:.6s ease-in-out celebrate;box-shadow:0 6px 20px #10b98166}.puzzle-container.loading .container-tube{opacity:.6;pointer-events:none}.floating-next-level{z-index:9999;padding:16px 32px;font-size:1.2rem;animation:.5s ease-out floatIn,2s ease-in-out infinite pulse;position:fixed;bottom:100px;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #e0603a66}@keyframes floatIn{0%{opacity:0;transform:translate(-50%)translateY(20px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.level-selector-grid{grid-template-columns:repeat(auto-fill,minmax(60px,1fr));gap:8px;max-width:600px;max-height:400px;margin:0 auto;padding:10px;display:grid;overflow-y:auto}.level-tile{cursor:pointer;background:#fff;border:2px solid #eadfce;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;width:60px;height:60px;font-weight:600;transition:all .2s;display:flex;position:relative}.level-tile:hover:not(.level-tile-locked){border-color:#e0603a;transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.level-tile-number{color:#241f1a;font-size:1.25rem}.level-tile-completed{color:#fff;background:#10b981;border-color:#059669}.level-tile-completed .level-tile-number{color:#fff}.level-tile-completed .level-tile-check{color:#fff;font-size:.875rem;position:absolute;top:2px;right:2px}.level-tile-current{border-width:3px;border-color:#e0603a;box-shadow:0 0 0 2px #e0603a33}.level-tile-locked{cursor:not-allowed;opacity:.5;background:#f3f4f6;border-color:#e5e7eb}.level-tile-locked .level-tile-number{color:#9ca3af}.level-tile-locked .level-tile-lock{font-size:1rem;position:absolute}.level-tile-continue,.level-tile-start{color:#fff;background:linear-gradient(135deg,#e0603a 0%,#c9482a 100%);border:none;grid-column:span 2;width:auto;height:70px}.level-tile-start{background:linear-gradient(135deg,#f093fb 0%,#f5576c 100%)}.level-tile-continue:hover,.level-tile-start:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0003}.level-tile-icon{margin-bottom:4px;font-size:1.5rem}.level-tile-label{font-size:.875rem;font-weight:700}.level-tile-sublabel{opacity:.9;font-size:.75rem}@media (prefers-color-scheme:dark){.level-tile{background:#1f2937;border-color:#374151}.level-tile-number{color:#f3f4f6}.level-tile-locked{background:#111827}}
