.tetris-page{min-height:100vh;color:var(--color-text);background:radial-gradient(circle at top,#020617,#020617);justify-content:center;align-items:center;padding:1rem .75rem 6.75rem;display:flex}@supports (min-height:100dvh){.tetris-page{min-height:100dvh}}.tetris-wrapper{justify-content:center;align-items:flex-start;width:100%;display:flex}.tetris-card{background:0 0;border:none;border-radius:1rem;width:100%;max-width:480px;padding:0}.tetris-header{justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.75rem;display:flex}.tetris-header h1{font-size:1rem}.tetris-hud{z-index:20;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(#0f172aeb,#0f172afa);border-top:1px solid #94a3b859;justify-content:space-between;align-items:center;gap:.75rem;height:2.75rem;padding:0 1rem;font-size:.85rem;display:flex;position:fixed;bottom:0;left:0;right:0}.tetris-hud-left{align-items:center;gap:.5rem;display:flex}.tetris-hud code{background:0 0;border-radius:999px;padding:.25rem .75rem}.tetris-pause-btn{border:1px solid color-mix(in srgb-linear, var(--color-accent) 60%, var(--color-danger) 20%);width:35px;height:28px;color:var(--color-accent);border-radius:.4rem;place-items:center;font-size:1rem;line-height:1;transition:all .4s ease-in-out;display:grid}.tetris-pause-btn>svg{display:block}.tetris-canvas-wrap{justify-content:center;display:flex}#tetris{border:1px solid color-mix(in srgb-linear, var(--color-accent) 60%, var(--color-danger) 30%);aspect-ratio:300/525;touch-action:none;background:#020617;border-radius:1.25rem 1.25rem .2rem .2rem;width:auto;max-width:100%;height:calc(100vh - 10rem);max-height:500px;display:block}@supports (height:100dvh){#tetris{height:calc(100dvh - 10rem)}}.tetris-next{background:#0f172a99;border:1px solid #94a3b833;border-radius:.55rem;flex-direction:column;align-items:center;gap:2px;padding:.25rem .45rem;display:flex}.tetris-next-label{text-transform:uppercase;letter-spacing:.08em;color:var(--color-muted,#94a3b8);font-size:.58rem}.tetris-next canvas{display:block}.tetris-controls{z-index:25;touch-action:none;background:linear-gradient(#0f172aeb,#0f172afa);border-top:1px solid #94a3b82e;align-items:stretch;gap:.4rem;height:3.5rem;padding:.35rem .6rem;display:flex;position:fixed;bottom:2.75rem;left:0;right:0}.tetris-ctrl{border:1px solid color-mix(in srgb-linear, var(--color-accent) 45%, transparent);color:var(--color-accent);-webkit-user-select:none;user-select:none;touch-action:none;background:#ffffff0a;border-radius:.6rem;flex:1;place-items:center;font-size:1.6rem;display:grid}.tetris-ctrl:active{background:#00c7ff2e}.tetris-ctrl-hard{color:#0b1120;background:linear-gradient(135deg,#00cfff,#682aba);border:none}.tetris-overlay{z-index:999;background:radial-gradient(circle at top,#0f172ae6,#020617);justify-content:center;align-items:center;padding:1.5rem 1.25rem 3.25rem;display:none;position:fixed;inset:0}.tetris-overlay.visible{display:flex}.tetris-overlay-inner{background:#0f172afa;border:1px solid #94a3b859;border-radius:1.25rem;width:100%;max-width:420px;padding:1.5rem;box-shadow:0 24px 60px #000000bf}.tetris-leaderboard{background:#0a0f17;border:1px solid #ffffff0f;border-radius:14px;margin-top:1.5rem;padding:1rem 1.25rem;display:none;box-shadow:0 0 18px #00c7ff0d}.tetris-leaderboard-list{margin-top:.25rem;padding-left:0;list-style:none}.tetris-leaderboard-item{font-family:"JetBrains Mono", var(--font-mono);background:#ffffff08;border-left:4px solid #0000;border-radius:10px;grid-template-columns:40px 60px 1fr 60px;align-items:center;margin-bottom:.4rem;padding:.45rem .5rem;font-size:.85rem;transition:all .2s;display:grid}.tetris-leaderboard-item:hover{background:#00c7ff14;border-left-color:#00cfff;transform:translate(4px);box-shadow:0 0 10px #00c7ff4d}.tetris-leaderboard-item:first-child{background:#ffd7001f;border-left-color:gold}.tetris-leaderboard-item:first-child:before{content:"👑";margin-right:6px}.tetris-leaderboard-item:nth-child(2){border-left-color:silver}.tetris-leaderboard-item:nth-child(3){border-left-color:#cd7f32}.tetris-rank{opacity:.7;font-size:.8rem}.tetris-name{text-transform:uppercase;color:#00cfff;font-weight:700}.tetris-score{text-align:right;font-weight:700}.tetris-level{text-align:right;color:#8bc6ff}.tetris-ranking-trigger{z-index:30;color:#0b1120;background:linear-gradient(135deg,#00cfff,#682aba);border:none;border-radius:999px;align-items:center;gap:.4rem;padding:.5rem .85rem;font-size:.8rem;font-weight:600;display:inline-flex;position:fixed;bottom:6.9rem;right:1rem;box-shadow:0 0 18px #00c7ff99}.tetris-ranking-modal{z-index:1200;background:radial-gradient(circle at top,#0f172af5,#020617);justify-content:center;align-items:center;padding:1.5rem 1.25rem 3.25rem;display:none;position:fixed;inset:0}.tetris-ranking-modal.visible{display:flex}.tetris-ranking-modal-inner{background:#0f172afa;border:1px solid #94a3b859;border-radius:1.25rem;width:100%;max-width:420px;padding:1.25rem 1.25rem 1rem;box-shadow:0 24px 60px #000000d9}.tetris-ranking-modal-header{justify-content:space-between;align-items:center;margin-bottom:.75rem;display:flex}@media (min-width:768px){.tetris-page{margin-top:0}.tetris-wrapper{gap:2rem}.tetris-card{background:#0b1623f2;border:1px solid #94a3b840;border-radius:1.25rem;max-width:440px;padding:1.5rem;box-shadow:0 24px 60px #0009}.tetris-hud{-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border-top:none;height:auto;margin-bottom:1rem;padding:0;position:static}.tetris-hud code{background:#0f172ad9}#tetris{aspect-ratio:auto;width:300px;height:525px}.tetris-leaderboard{max-width:280px;margin-top:0;display:block}.tetris-ranking-trigger,.tetris-ranking-modal,.tetris-controls{display:none!important}}
