:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}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;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:"Press Start 2P",cursive}.container{min-height:100vh;background-color:#836ef9;width:100vw;position:relative}.center-container{min-height:100vh;width:100vw;background-color:#836ef9;display:flex;align-items:center;justify-content:center;padding:20px;box-sizing:border-box;position:relative}.login-card,.ready-card,.game-over-card{background-color:#fff;border-radius:16px;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;padding:32px;text-align:center;max-width:min(90vw,500px);width:100%;margin:0 auto;flex-shrink:0}.icon-container{width:64px;height:64px;background-color:#836ef9;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 24px;color:#fff}.ready-icon,.game-over-icon{width:80px;height:80px;background-color:#836ef9;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 24px;color:#fff}.title{font-size:30px;font-weight:700;color:#000;margin-bottom:16px}.subtitle{color:#6c6c6c;margin-bottom:24px;line-height:1.5}.ready-title{font-size:24px;font-weight:700;color:#000;margin-bottom:8px}.ready-subtitle{color:#6c6c6c;margin-bottom:32px;line-height:1.5}.track-selected{font-size:18px;font-weight:600;color:#836ef9;margin-bottom:8px}.game-over-title{font-size:24px;font-weight:700;color:#000;margin-bottom:8px}.game-over-subtitle{color:#6c6c6c;margin-bottom:24px}.primary-button{background-color:#000;color:#fff;padding:12px 32px;border-radius:8px;font-weight:600;border:none;cursor:pointer;font-size:16px;transition:all .2s;width:100%}.primary-button:hover{background-color:#333}.secondary-button{background-color:#f8f8f8;color:#6c6c6c;padding:12px 24px;border-radius:8px;font-weight:600;border:none;cursor:pointer;font-size:14px;transition:all .2s}.secondary-button:hover{background-color:#e5e7eb}.orange-button{background-color:#836ef9;color:#fff;padding:16px 32px;border-radius:8px;font-weight:600;border:none;cursor:pointer;font-size:16px;transition:all .2s;width:100%;display:flex;align-items:center;justify-content:center;gap:8px}.orange-button:hover{background-color:#7159e6}.orange-button:disabled{opacity:.5;cursor:not-allowed}.orange-button:disabled:hover{background-color:#836ef9}.button-group{display:flex;flex-direction:column;gap:12px}.icon-button{padding:8px;border-radius:8px;border:none;background-color:transparent;cursor:pointer;transition:all .2s;color:#6c6c6c}.icon-button:hover{background-color:#f8f8f8}.end-game-button{background-color:#f8f8f8;color:#6c6c6c;padding:8px 16px;border-radius:8px;font-weight:600;border:none;cursor:pointer;font-size:14px;transition:all .2s}.end-game-button:hover{background-color:#e5e7eb}.header{background-color:#fff;box-shadow:0 1px 3px #0000001a;padding:16px 0}.header-content{max-width:1200px;margin:0 auto;padding:0 24px;display:flex;justify-content:space-between;align-items:center}.header-left,.header-right{display:flex;align-items:center;gap:16px}.header-icon{width:40px;height:40px;background-color:#836ef9;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.header-title{font-size:24px;font-weight:700;color:#000}.username{color:#6c6c6c}.main-content{max-width:1200px;margin:0 auto;padding:24px}.section-header{text-align:center;margin-bottom:32px}.section-title{font-size:32px;font-weight:700;color:#fff;margin-bottom:8px}.section-subtitle{color:#fff}.track-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,45vw),1fr));gap:clamp(12px,3vw,16px);max-width:min(1000px,95vw);margin:0 auto}.track-card{background-color:#fff;border-radius:12px;padding:24px;box-shadow:0 1px 3px #0000001a;border:2px solid transparent;cursor:pointer;text-align:center;transition:all .2s}.track-card:hover{border-color:#836ef9;box-shadow:0 4px 6px -1px #0000001a}.track-icon{width:64px;height:64px;background-color:#836ef9;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;transition:all .2s;color:#fff}.track-card:hover .track-icon{background-color:#7159e6}.track-name{font-weight:600;color:#000}.game-container{min-height:100vh;width:100vw;background-color:#836ef9;display:flex;flex-direction:column}.game-header{background-color:#fff;box-shadow:0 1px 3px #0000001a;padding:12px 0}.game-header-content{max-width:1200px;margin:0 auto;padding:0 16px;display:flex;justify-content:space-between;align-items:center}.game-stats{display:flex;align-items:center;gap:16px}.score{font-size:24px;font-weight:700;color:#000}.level{color:#6c6c6c}.game-controls{display:flex;align-items:center;gap:12px}.game-area{flex:1;display:flex;align-items:center;justify-content:center;padding:16px}.game-board{position:relative;width:min(90vw,500px);height:min(70vh,600px);background-color:#fff;border-radius:16px;box-shadow:0 20px 25px -5px #0000001a;overflow:hidden}.game-columns{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,1fr)}.game-column{border-right:1px solid #E5E7EB}.game-column:last-child{border-right:none}.clickable-column{cursor:pointer;position:relative;z-index:10}.clickable-column:hover{background-color:#836ef91a}.tile{position:absolute;width:25%;height:96px;transition:none;border:none;pointer-events:none;will-change:transform}.tile-active,.tile-active:hover{background-color:#200052}.tile-hit{background-color:#ffb3d1}.tile-inactive{background-color:#6c6c6c;cursor:not-allowed}.game-line{position:absolute;bottom:0;left:0;right:0;height:4px;background-color:#6c6c6c}.score-display{background-color:#f8f8f8;border-radius:12px;padding:24px;margin-bottom:24px}.final-score{font-size:36px;font-weight:700;color:#836ef9;margin-bottom:8px}.score-label{color:#6c6c6c;font-size:16px}.level-reached{font-size:14px;color:#6c6c6c;margin-top:8px}.submitting-message{color:#6c6c6c;margin-bottom:16px;font-style:italic}@media (max-width: 768px){.header-content{padding:0 16px}.header-title{font-size:20px}.main-content{padding:16px}.section-title{font-size:28px}.track-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}.track-card{padding:16px}.track-icon{width:48px;height:48px;margin-bottom:12px}.game-board{width:min(95vw,450px);height:min(65vh,550px)}.score{font-size:20px}.login-card,.ready-card,.game-over-card{padding:24px;margin:0 16px}}@media (max-width: 480px){.track-grid{grid-template-columns:repeat(2,1fr)}.game-board{width:min(98vw,380px);height:min(60vh,500px)}.tile{height:min(15vw,80px)}.section-title{font-size:24px}.header-left{gap:12px}.header-icon{width:32px;height:32px}.header-title{font-size:18px}.game-area{padding:8px}}