*{margin:0;padding:0;box-sizing:border-box}:root{font-family:Philosopher,sans-serif}html,body{margin:0;padding:0;width:100vw;height:100vh;overflow:hidden;overscroll-behavior:none;touch-action:none;position:fixed;font-family:Philosopher,sans-serif}#game-container{width:100%;height:100%;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;overscroll-behavior:none;position:relative}.desktop-panel{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;height:60px;padding:15px 20px;background:linear-gradient(to bottom,#000c,#0000)}.desktop-panel .level-title{padding-left:20px}.desktop-panel .score-wrapper{padding-right:20px}.mobile-panel{display:none;flex-direction:column;gap:12px;padding:12px 16px;background:linear-gradient(to bottom,#000c,#0000)}.mobile-panel .header-row{padding:0 20px}.mobile-panel .stats-row{display:flex;justify-content:center;align-items:center;gap:12px;margin:4px 0}.mobile-panel .connection-row{display:flex;justify-content:center;margin:4px 0}@media screen and (max-width: 768px){.desktop-panel{display:none}.mobile-panel{display:flex}}@media screen and (min-width: 769px){.desktop-panel{display:grid}.mobile-panel{display:none}}.top-panel{position:fixed;top:0;left:0;right:0;width:100%;color:#fff;font-family:Philosopher,sans-serif;z-index:2000;pointer-events:none;padding:15px 0;background:linear-gradient(to bottom,#000c,#0000)}.header-row{display:flex;justify-content:space-between;align-items:center;width:100%;pointer-events:none}.stats-row{display:flex;align-items:center;gap:20px;pointer-events:none}.connection-row{display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}.level-title{font-size:24px;font-weight:700;text-shadow:0 0 10px rgba(255,255,255,.3);pointer-events:auto;white-space:nowrap}.score-wrapper{text-align:right;font-size:16px;pointer-events:auto;white-space:nowrap}.total-score-display{font-size:16px;font-weight:700;margin-bottom:4px}.score-display{opacity:.8}.stats-item{display:flex;align-items:center;gap:8px;font-size:18px;padding:5px 12px;background:#ffffff1a;border-radius:20px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);pointer-events:auto;height:32px;font-family:Philosopher,sans-serif}.energy-goal i{color:gold}.crystal-goal{box-shadow:0 0 10px #fff3}.crystal-goal i{color:#1a1a1a;text-shadow:0 0 5px rgba(255,255,255,.5)}.connection-guidance{font-size:clamp(14px,3vw,16px);opacity:.8;text-shadow:0 0 10px rgba(255,255,255,.3);margin-bottom:4px;font-family:Philosopher,sans-serif}@keyframes guidancePulse{0%{opacity:.8;text-shadow:0 0 10px rgba(255,255,255,.3)}50%{opacity:1;text-shadow:0 0 20px rgba(255,215,0,.8)}to{opacity:.8;text-shadow:0 0 10px rgba(255,255,255,.3)}}@keyframes goalPulse{0%{background:#ffffff1a;box-shadow:0 0 10px #ffd7001a}50%{background:#ffffff26;box-shadow:0 0 20px #ffd7004d}to{background:#ffffff1a;box-shadow:0 0 10px #ffd7001a}}.connection-row:has(.tutorial-gesture.animate) .connection-guidance{animation:guidancePulse 1s ease-in-out infinite}.connection-row:has(.tutorial-gesture.animate) .connection-goal{animation:goalPulse 1s ease-in-out infinite}.connection-goal{font-size:18px;padding:5px 12px;background:#ffffff1a;border-radius:20px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);pointer-events:auto;height:32px;display:flex;align-items:center;gap:8px;font-family:Philosopher,sans-serif}.connection-goal i{font-size:clamp(16px,4vw,24px)}.connection-display{display:flex;align-items:center;gap:8px;height:100%;font-family:Philosopher,sans-serif}.connection-display i{font-size:clamp(16px,4vw,24px)}.game-controls{position:fixed;bottom:20px;right:20px;display:flex;gap:10px;z-index:1000}.control-button{width:40px;height:40px;border-radius:50%;border:none;background:#fff3;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);transition:all .3s ease;-webkit-tap-highlight-color:transparent;outline:none;font-family:Philosopher,sans-serif}.control-button:hover{background:#ffffff4d;transform:scale(1.1)}.control-button:active{transform:scale(.95)}.control-button.disabled{opacity:.5;cursor:not-allowed}.score-container{position:fixed;top:20px;right:20px;background:#00000080;padding:15px;border-radius:10px;color:#fff;font-family:Philosopher,sans-serif;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;flex-direction:column;gap:5px;z-index:1000}.score-container>div{font-size:18px;text-shadow:0 0 10px rgba(255,255,255,.3)}.score-container>div:first-child{font-size:20px;font-weight:700}.level-indicator{position:fixed;top:20px;left:20px;background:#00000080;padding:15px;border-radius:15px;color:#fff;font-family:Philosopher,sans-serif;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);min-width:200px;display:flex;flex-direction:column;gap:8px;z-index:1000}.level-title{font-size:24px;font-weight:700}.goals-display{line-height:1.5}.bottom-controls{position:fixed;bottom:20px;left:20px;display:flex;flex-direction:row;gap:10px;z-index:1000;height:40px;align-items:center}.game-button{background:#fff3;border:none;border-radius:8px;color:#fff;padding:8px 12px;cursor:pointer;font-size:16px;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:8px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);height:40px;-webkit-tap-highlight-color:transparent;outline:none;font-family:Philosopher,sans-serif}.game-button:hover{background:#ffffff4d;transform:scale(1.02)}.game-button i{font-size:18px}.hints-button{background:#ffd70033}.hints-button:hover{background:#ffd7004d}.skip-button{background:#ff450033}.skip-button:hover{background:#ff45004d}.tutorial-gesture{position:absolute;top:100%;left:50%;transform:translate(-50%);color:#fffc;font-size:28px;pointer-events:none;opacity:0;margin-top:5px;z-index:1001}@keyframes gestureSwipe{0%{opacity:0;transform:translate(-60px,-15px)}20%{opacity:1;transform:translate(-60px,-15px)}40%{opacity:1;transform:translateY(-15px)}60%{opacity:1;transform:translate(60px,-15px)}80%{opacity:0;transform:translate(60px,-15px)}to{opacity:0;transform:translate(60px,-15px)}}.tutorial-gesture.animate{animation:gestureSwipe 2s ease-in-out;animation-iteration-count:3;opacity:1}.dialog{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;display:none;justify-content:center;align-items:center;z-index:2000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);font-family:Philosopher,sans-serif}.dialog.show{display:flex;animation:dialogFadeIn .4s ease-out forwards}.dialog-content{background:#1e1e1ef2;padding:30px;border-radius:15px;color:#fff;min-width:300px;max-width:90vw;box-shadow:0 0 20px #00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transform:scale(.9);opacity:0;animation:contentScaleIn .4s ease-out forwards;animation-delay:.1s}@keyframes dialogFadeIn{0%{opacity:0}to{opacity:1}}@keyframes contentScaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}#help-dialog .dialog-content{padding-top:20px}#help-dialog .help-content{margin-top:0}.dialog h2{margin:0 0 20px;font-size:24px;text-align:center;font-weight:700;text-shadow:0 0 10px rgba(255,255,255,.3)}.settings-group{margin:20px 0;background:#ffffff0d;padding:15px;border-radius:10px}.settings-group label{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:16px;cursor:pointer}.settings-group input[type=checkbox]{width:18px;height:18px;cursor:pointer}.settings-group input[type=range]{width:100%;margin:10px 0;cursor:pointer;-webkit-appearance:none;background:#fff3;height:6px;border-radius:3px}.settings-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;background:#fff;border-radius:50%;cursor:pointer;transition:transform .1s ease}.settings-group input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.1)}.help-content{margin:20px 0;line-height:1.6;font-size:16px;background:#ffffff0d;padding:15px;border-radius:10px;max-height:70vh;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,215,0,.3) rgba(255,255,255,.05)}.help-content::-webkit-scrollbar{width:8px}.help-content::-webkit-scrollbar-track{background:#ffffff0d;border-radius:4px}.help-content::-webkit-scrollbar-thumb{background:#ffd7004d;border-radius:4px;transition:background .3s ease}.help-content::-webkit-scrollbar-thumb:hover{background:#ffd70080}.help-content p{margin:10px 0;opacity:.9}.help-section:nth-child(1) p,.help-section:nth-child(2) p{display:flex;align-items:center;gap:10px}.help-section:nth-child(3) p,.help-section:nth-child(4) p{display:block;line-height:1.5}.help-section:last-child p{display:block}.help-section:last-child p i{margin-right:10px}.no-space{font-size:0;line-height:0;display:inline-block}.credit-line{margin:10px 0;opacity:.9;line-height:1.5}.credits-text{margin:10px 0;opacity:.9;line-height:1.5;display:block}.credits-text a{display:inline}.help-section{margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid rgba(255,255,255,.1)}.help-section:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}.help-section h3{margin-bottom:10px;font-size:18px;color:gold;text-shadow:0 0 10px rgba(255,215,0,.3)}.help-section i{min-width:20px;text-align:center}.help-section a{color:#4fc3f7;text-decoration:none;transition:color .2s ease;margin:0;padding:0}.help-section a:hover{color:#81d4fa;text-decoration:underline}.help-section p a{display:inline;white-space:nowrap}.credits-note{font-family:Philosopher,monospace;background:#0003;padding:10px;border-radius:5px;font-size:14px;color:#aaa;margin-top:10px!important;white-space:pre-line;display:block!important}.close-dialog{display:block;width:100%;padding:12px;background:#fff3;border:none;border-radius:8px;color:#fff;cursor:pointer;margin-top:25px;transition:all .3s ease;font-size:16px;font-weight:700;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.close-dialog:hover{background:#ffffff4d;transform:scale(1.02)}@keyframes tutorialFadeIn{0%{opacity:0;transform:translate(-50%,-40%)}to{opacity:1;transform:translate(-50%,-50%)}}@keyframes tutorialFadeOut{0%{opacity:1;transform:translate(-50%,-50%)}to{opacity:0;transform:translate(-50%,-40%)}}@keyframes highlightPulse{0%{box-shadow:0 0 5px #ffd70080}50%{box-shadow:0 0 20px #ffd700cc}to{box-shadow:0 0 5px #ffd70080}}.tutorial-highlight{position:absolute;border-radius:5px;pointer-events:none;animation:highlightPulse 1.5s infinite}.tutorial-message{font-family:Philosopher,sans-serif;color:#fff;text-shadow:0 0 10px rgba(255,255,255,.5)}.tutorial-button{background:gold;color:#000;border:none;padding:10px 30px;border-radius:25px;font-size:16px;cursor:pointer;transition:all .3s ease}.tutorial-button:hover{transform:scale(1.1);box-shadow:0 0 15px #ffd70080}@media (max-width: 768px){.tutorial-message{font-size:14px;padding:15px}.tutorial-button{padding:8px 20px;font-size:14px}}
