@import"https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap";.app{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;min-height:100vh}.app a{color:var(--color-neutral-100);text-decoration:none;border:1px solid var(--color-neutral-700);border-radius:8px;padding:.75rem 2rem;min-width:220px;text-align:center;transition:border-color .15s,color .15s}.app a:hover{border-color:var(--color-primary-500);color:var(--color-primary-400)}*,*:before,*:after{box-sizing:border-box}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd,hr{margin:0}ul[role=list],ol[role=list]{list-style:none}html:focus-within{scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}a:not([class]){text-decoration-skip-ink:auto}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit;color:inherit}@media(prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}:root{--color-pure-white: #ffffff;--color-pure-black: #000000;--color-primary-50: #edfdf4;--color-primary-100: #a3f3c9;--color-primary-200: #7eeeb3;--color-primary-300: #59e99e;--color-primary-400: #47e793;--color-primary-500: #39b976;--color-primary-600: #2b8b58;--color-primary-700: #1c5c3b;--color-primary-800: #15452c;--color-primary-900: #0e2e1d;--color-neutral-50: #fafafa;--color-neutral-100: #f5f5f5;--color-neutral-200: #e5e5e5;--color-neutral-300: #d4d4d4;--color-neutral-400: #a3a3a3;--color-neutral-500: #737373;--color-neutral-600: #525252;--color-neutral-700: #404040;--color-neutral-800: #262626;--color-neutral-900: #171717;--color-teal-50: #f0fdfa;--color-teal-100: #ccfbf1;--color-teal-200: #99f6e4;--color-teal-300: #5eead4;--color-teal-400: #2dd4bf;--color-teal-500: #14b8a6;--color-teal-600: #0d9488;--color-teal-700: #0f766e;--color-teal-800: #115e59;--color-teal-900: #134e4a;--color-cyan-50: #ecfeff;--color-cyan-100: #cffafe;--color-cyan-200: #a5f3fc;--color-cyan-300: #67e8f9;--color-cyan-400: #22d3ee;--color-cyan-500: #06b6d4;--color-cyan-600: #0891b2;--color-cyan-700: #0e7490;--color-cyan-800: #155e75;--color-cyan-900: #164e63;--color-sky-50: #f0f9ff;--color-sky-100: #e0f2fe;--color-sky-200: #bae6fd;--color-sky-300: #7dd3fc;--color-sky-400: #38bdf8;--color-sky-500: #0ea5e9;--color-sky-600: #0284c7;--color-sky-700: #0369a1;--color-sky-800: #075985;--color-sky-900: #0c4a6e;--color-blue-50: #eff6ff;--color-blue-100: #dbeafe;--color-blue-200: #bfdbfe;--color-blue-300: #93c5fd;--color-blue-400: #60a5fa;--color-blue-500: #3b82f6;--color-blue-600: #2563eb;--color-blue-700: #1d4ed8;--color-blue-800: #1e40af;--color-blue-900: #1e3a8a;--color-indigo-50: #eef2ff;--color-indigo-100: #e0e7ff;--color-indigo-200: #c7d2fe;--color-indigo-300: #a5b4fc;--color-indigo-400: #818cf8;--color-indigo-500: #6366f1;--color-indigo-600: #4f46e5;--color-indigo-700: #4338ca;--color-indigo-800: #3730a3;--color-indigo-900: #312e81;--color-violet-50: #f5f3ff;--color-violet-100: #ede9fe;--color-violet-200: #ddd6fe;--color-violet-300: #c4b5fd;--color-violet-400: #a78bfa;--color-violet-500: #8b5cf6;--color-violet-600: #7c3aed;--color-violet-700: #6d28d9;--color-violet-800: #5b21b6;--color-violet-900: #4c1d95;--color-purple-50: #faf5ff;--color-purple-100: #f3e8ff;--color-purple-200: #e9d5ff;--color-purple-300: #d8b4fe;--color-purple-400: #c084fc;--color-purple-500: #a855f7;--color-purple-600: #9333ea;--color-purple-700: #7e22ce;--color-purple-800: #6b21a8;--color-purple-900: #581c87;--color-fuchsia-50: #fdf4ff;--color-fuchsia-100: #fae8ff;--color-fuchsia-200: #f5d0fe;--color-fuchsia-300: #f0abfc;--color-fuchsia-400: #e879f9;--color-fuchsia-500: #d946ef;--color-fuchsia-600: #c026d3;--color-fuchsia-700: #a21caf;--color-fuchsia-800: #86198f;--color-fuchsia-900: #701a75;--color-pink-50: #fdf2f8;--color-pink-100: #fce7f3;--color-pink-200: #fbcfe8;--color-pink-300: #f9a8d4;--color-pink-400: #f472b6;--color-pink-500: #ec4899;--color-pink-600: #db2777;--color-pink-700: #be185d;--color-pink-800: #9d174d;--color-pink-900: #831843;--color-rose-50: #fff1f2;--color-rose-100: #ffe4e6;--color-rose-200: #fecdd3;--color-rose-300: #fda4af;--color-rose-400: #fb7185;--color-rose-500: #f43f5e;--color-rose-600: #e11d48;--color-rose-700: #be123c;--color-rose-800: #9f1239;--color-rose-900: #881337;--color-red-50: #fef2f2;--color-red-100: #fee2e2;--color-red-200: #fecaca;--color-red-300: #fca5a5;--color-red-400: #f87171;--color-red-500: #ef4444;--color-red-600: #dc2626;--color-red-700: #b91c1c;--color-red-800: #991b1b;--color-red-900: #7f1d1d;--color-orange-50: #fff7ed;--color-orange-100: #ffedd5;--color-orange-200: #fed7aa;--color-orange-300: #fdba74;--color-orange-400: #fb923c;--color-orange-500: #f97316;--color-orange-600: #ea580c;--color-orange-700: #c2410c;--color-orange-800: #9a3412;--color-orange-900: #7c2d12;--color-yellow-50: #fefce8;--color-yellow-100: #fef9c3;--color-yellow-200: #fef08a;--color-yellow-300: #fde047;--color-yellow-400: #facc15;--color-yellow-500: #eab308;--color-yellow-600: #ca8a04;--color-yellow-700: #a16207;--color-yellow-800: #854d0e;--color-yellow-900: #713f12}body{font-family:Ubuntu,sans-serif;background-color:var(--color-neutral-800);color:var(--color-neutral-100)}button{background-color:var(--color-neutral-700);color:var(--color-neutral-100);border:none;border-radius:6px;padding:.35rem .7rem;cursor:pointer;font-family:inherit;font-size:.875rem}button:hover:not(:disabled){background-color:var(--color-neutral-600)}button:disabled{opacity:.4;cursor:not-allowed}input{background-color:var(--color-neutral-900);border:1px solid var(--color-neutral-700);border-radius:6px;padding:.35rem .6rem;color:var(--color-neutral-100);font-family:inherit;font-size:.875rem}input:focus{outline:none;border-color:var(--color-primary-500)}.pong{min-height:100vh;padding:1.5rem}.pong .topbar{display:flex;align-items:center;gap:1rem}.pong .topbar a{color:var(--color-neutral-400);text-decoration:none}.pong .topbar a:hover{color:var(--color-neutral-100)}.pong .topbar h1{margin:0;font-size:1.25rem}.pong .game{display:flex;flex-direction:column;align-items:center;gap:1rem;max-width:800px;margin:0 auto}.pong .scoreboard{display:flex;align-items:center;justify-content:center;gap:2rem;width:100%}.pong .scoreboard .score{display:flex;flex-direction:column;align-items:center;gap:.15rem;min-width:5rem}.pong .scoreboard .score span{font-size:.8rem;color:var(--color-neutral-500)}.pong .scoreboard .score strong{font-size:2rem;line-height:1}.pong .scoreboard .score--player strong{color:var(--color-primary-400)}.pong .scoreboard .score--bot strong{color:var(--color-rose-500)}.pong .scoreboard .divider{color:var(--color-neutral-700)}.pong canvas{display:block;width:100%;height:auto;background-color:var(--color-neutral-900);border:1px solid var(--color-neutral-700);border-radius:10px;cursor:none;touch-action:none}.pong .controls{display:flex;gap:.5rem}.pong .controls button{padding:.5rem 1.25rem}.pong .controls .primary{background-color:var(--color-primary-500);color:var(--color-neutral-900);font-weight:500}.pong .controls .primary:hover:not(:disabled){background-color:var(--color-primary-400)}.pong .hint{margin:0;text-align:center;font-size:.875rem;color:var(--color-neutral-500)}.pong .hint .player{color:var(--color-primary-400)}.pong .hint .bot{color:var(--color-rose-500)}.kanban{min-height:100vh;padding:1.5rem}.kanban .topbar{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}.kanban .topbar a{color:var(--color-neutral-400);text-decoration:none}.kanban .topbar a:hover{color:var(--color-neutral-100)}.kanban .topbar h1{margin:0;font-size:1.25rem}.kanban .topbar .account{display:flex;align-items:center;gap:.75rem;margin-left:auto;font-size:.875rem;color:var(--color-neutral-400)}.kanban .status{color:var(--color-neutral-400)}.kanban .error{background-color:var(--color-red-900);border:1px solid var(--color-red-700);border-radius:8px;padding:.6rem .9rem;margin-bottom:1rem;font-size:.875rem}.kanban .signin{display:flex;flex-direction:column;align-items:center;gap:1rem;margin-top:20vh;color:var(--color-neutral-400)}.kanban .signin button{background-color:var(--color-primary-500);color:var(--color-neutral-900);font-weight:500;padding:.6rem 1.25rem}.kanban input{flex:1;min-width:0}.board{display:flex;align-items:flex-start;gap:1rem;overflow-x:auto;padding-bottom:1rem}.column{flex:0 0 260px;min-width:0;background-color:var(--color-neutral-900);border:1px solid var(--color-neutral-700);border-radius:10px;padding:.75rem}.column header{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}.column header h2{margin:0;font-size:.95rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.column header .count{color:var(--color-neutral-500);font-size:.8rem}.column header .delete{margin-left:auto;background:none;padding:.25rem;color:var(--color-neutral-500)}.column header .delete:hover{background:none;color:var(--color-red-400)}.column .cards{display:flex;flex-direction:column;gap:.5rem;min-height:60px;border-radius:8px;padding:.25rem;transition:background-color .15s}.column .cards.is-over{background-color:var(--color-neutral-800)}.column .empty{margin:.5rem 0;text-align:center;color:var(--color-neutral-600);font-size:.8rem}.add-column{flex:0 0 auto}.add-column .add-form{margin-top:0;width:240px}.card{display:flex;align-items:center;gap:.4rem;background-color:var(--color-neutral-800);border:1px solid var(--color-neutral-700);border-radius:8px;padding:.5rem;font-size:.875rem;cursor:grab;touch-action:none}.card:hover .grip{color:var(--color-neutral-300)}.card span{flex:1;word-break:break-word}.card .grip{flex-shrink:0;color:var(--color-neutral-500)}.card .delete{cursor:pointer;background:none;padding:0;color:var(--color-neutral-600)}.card .delete:hover{background:none;color:var(--color-red-400)}.card.is-dragging{opacity:.35}.card.is-preview{border-color:var(--color-primary-500);cursor:grabbing;box-shadow:0 8px 20px #00000059}.add-form{display:flex;gap:.4rem;margin-top:.75rem;width:100%}.add-trigger{display:flex;align-items:center;justify-content:center;gap:.35rem;margin-top:.75rem;padding:.4rem;background:none;border:1px dashed var(--color-neutral-700);color:var(--color-neutral-500)}.add-trigger:hover:not(:disabled){background:none;border-color:var(--color-primary-500);color:var(--color-primary-400)}.column>.add-trigger{width:100%}.add-column>.add-trigger{width:40px;height:40px;margin-top:0;border-radius:10px}@keyframes pulse{0%{box-shadow:0 0 #39b976b3}to{box-shadow:0 0 0 12px #39b97600}}.music-grid{min-height:100vh;padding:1.5rem}.music-grid .topbar{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}.music-grid .topbar a{color:var(--color-neutral-400);text-decoration:none}.music-grid .topbar a:hover{color:var(--color-neutral-100)}.music-grid .topbar h1{margin:0;font-size:1.25rem}.music-grid .controls{position:sticky;top:0;z-index:1;display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin-bottom:1.5rem;padding:.75rem;background-color:var(--color-neutral-900);border:1px solid var(--color-neutral-700);border-radius:10px}.music-grid .controls label{display:flex;align-items:center;gap:.5rem;font-size:.875rem;color:var(--color-neutral-400)}.music-grid .controls label>span{min-width:2.5ch;color:var(--color-neutral-100)}.music-grid .controls input[type=range]{width:120px;accent-color:var(--color-primary-500);padding:0;border:none;background:none}.music-grid .controls select{background-color:var(--color-neutral-800);border:1px solid var(--color-neutral-700);border-radius:6px;padding:.3rem .5rem;color:var(--color-neutral-100);font-family:inherit;font-size:.875rem}.music-grid .controls .buttons{display:flex;align-items:center;gap:.4rem;margin-left:auto}.music-grid .controls .buttons button{display:flex;padding:.45rem}.music-grid .controls .buttons .play{background-color:var(--color-primary-500);color:var(--color-neutral-900)}.music-grid .controls .buttons .play:hover{background-color:var(--color-primary-400)}.music-grid .controls .buttons .play.is-idle{animation:pulse 1.8s ease-out infinite}.music-grid .labels{display:flex;align-items:flex-end;gap:.2rem;margin-bottom:.4rem;width:fit-content}.music-grid .labels span{width:1.5rem;writing-mode:vertical-rl;transform:rotate(180deg);font-size:.7rem;white-space:nowrap;color:var(--color-neutral-500);-webkit-user-select:none;user-select:none}.music-grid .grid{display:flex;flex-direction:column;gap:.2rem;width:fit-content}.music-grid .row{display:flex;gap:.2rem;transition:transform .1s ease-in}.music-grid .row.is-playing{transform:scale(.95)}.music-grid .cell{width:1.5rem;height:1.5rem;background-color:var(--color-neutral-700);border-radius:3px;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .06s ease-in}.music-grid .cell:hover{background-color:var(--color-neutral-600)}.music-grid .cell.is-on{background-color:var(--color-primary-400);box-shadow:0 0 8px 2px #47e79366}
