html.tp-touch,html.tp-touch body{overscroll-behavior:none;-webkit-text-size-adjust:100%;-webkit-touch-callout:none}html.tp-touch canvas{touch-action:none}.tp-pad{--ink:#4a3a35;--sl:env(safe-area-inset-left,0px);--sr:env(safe-area-inset-right,0px);--sb:env(safe-area-inset-bottom,0px);--st:env(safe-area-inset-top,0px);--stick:136px;--act:78px;position:fixed;inset:0;z-index:4;pointer-events:none;font-family:Fredoka,sans-serif;color:var(--ink);-webkit-user-select:none;user-select:none}.tp-pad *{-webkit-tap-highlight-color:transparent}.tp-stick{position:absolute;left:calc(var(--sl) + 18px);bottom:calc(var(--sb) + 18px);width:var(--stick);height:var(--stick);border-radius:50%;pointer-events:auto;touch-action:none;background:radial-gradient(60% 55% at 38% 34%,#fffaf0f0 0,#fbf1dcd8 45%,#efdcb6c4 78%,#e6cfa0a8);box-shadow:0 3px #4a3a3526,0 10px 24px #3a2a2026,inset 0 0 0 2.4px #4a3a35cc;transition:transform .15s}.tp-stick:before{content:"";position:absolute;inset:-7px;border-radius:47% 53% 50% 50%/52% 48% 53% 47%;background:radial-gradient(closest-side,#b9de8644,#9cc46a22 70%,transparent);z-index:-1;filter:blur(1px)}.tp-stick .ring{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#4a3a3555;stroke-width:1.4;stroke-dasharray:3 4}.tp-stick .ring path{fill:#4a3a3566;stroke:none}.tp-stick .knob{position:absolute;left:50%;top:50%;width:46%;height:46%;margin:-23% 0 0 -23%;border-radius:48% 52% 46% 54%/53% 47%;border:2.6px solid var(--ink);background:radial-gradient(70% 60% at 35% 30%,#fffaf0 0,#cfe6b0 40%,#9cc46a);box-shadow:0 3px #4a3a3555;will-change:transform;transition:background .2s}.tp-stick.on .knob{transition:none}.tp-stick.on{transform:scale(1.03)}.tp-stick.run .knob{background:radial-gradient(70% 60% at 35% 30%,#fffaf0 0,#ffd9a0 40%,#e8a24a)}.tp-acts{position:absolute;right:calc(var(--sr) + 16px);bottom:calc(var(--sb) + 16px);width:176px;height:176px;pointer-events:none}.tp-pad .tp-btn{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:0;min-width:0;min-height:0;border-radius:50%;pointer-events:auto;touch-action:none;font:500 12px Fredoka,sans-serif;color:var(--ink);cursor:pointer;transition:transform .08s}.tp-pad .tp-btn:after{border-radius:50%}.tp-pad .tp-btn.down{transform:scale(.92) rotate(-2deg);filter:brightness(.97)}.tp-pad .tp-btn svg{width:30px;height:30px;fill:none;stroke:var(--ink);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.tp-pad .tp-btn .lb{line-height:1;margin-top:1px}.tp-act{right:0;bottom:0;width:var(--act);height:var(--act);background:radial-gradient(70% 60% at 35% 30%,#fffaf0 0,#ffe7b0 55%,#f2c879)!important}.tp-act svg{width:36px!important;height:36px!important}.tp-jump{right:calc(var(--act) + 14px);bottom:4px;width:62px;height:62px;background:radial-gradient(70% 60% at 35% 30%,#fffaf0 0,#dcecf6 55%,#a9cde3)!important}.tp-rotate{position:absolute;left:50%;top:calc(var(--st) + 92px);transform:translate(-50%);pointer-events:auto;display:none;align-items:center;gap:8px;padding:8px 14px;font:500 14px Fredoka,sans-serif;color:var(--ink);white-space:nowrap;animation:tp-drop .4s ease-out}.tp-rotate span{font-size:20px}.tp-rotate small{opacity:.6;font-size:11px}html.tp-touch .tp-btns{bottom:auto;top:calc(env(safe-area-inset-top,0px) + 8px);right:calc(env(safe-area-inset-right,0px) + 8px);left:auto;flex-direction:row;gap:8px;z-index:7}html.tp-touch .tp-btns .tp-btn{width:48px;height:48px;min-width:48px;min-height:48px;padding:0;border-radius:50%;justify-content:center}html.tp-touch .tp-btns .tp-btn span{display:none}html.tp-touch .tp-btns .tp-btn svg{width:26px;height:26px}html.tp-touch .tp-clock{top:calc(env(safe-area-inset-top,0px) + 8px);left:calc(env(safe-area-inset-left,0px) + 10px);right:auto;pointer-events:none;gap:4px;padding:4px 12px 8px 6px;border-radius:999px}html.tp-touch .tp-prompt{bottom:calc(env(safe-area-inset-bottom,0px) + 178px);max-width:calc(100vw - 24px);font-size:16px}html.tp-touch .tp-placebar{bottom:calc(env(safe-area-inset-bottom,0px) + 178px);max-width:calc(100vw - 16px);flex-wrap:wrap;justify-content:center}html.tp-touch .tp-fish{bottom:calc(env(safe-area-inset-bottom,0px) + 178px);width:min(520px,calc(100vw - 24px))}html.tp-touch .tp-toasts{top:calc(env(safe-area-inset-top,0px) + 58px);max-width:min(240px,calc(100vw - 24px))}html.tp-touch .tp-panel{max-height:calc(100dvh - 24px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));width:min(560px,calc(100vw - 20px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px)))}html.tp-touch .tp-panel.wide{width:min(820px,calc(100vw - 20px))}html.tp-touch .tp-scroll{touch-action:pan-y;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}html.tp-touch .tp-title{display:none!important}@media (max-height:500px){.tp-pad{--stick:118px;--act:70px}.tp-acts{width:160px;height:160px}html.tp-touch .tp-prompt,html.tp-touch .tp-placebar,html.tp-touch .tp-fish{bottom:calc(env(safe-area-inset-bottom,0px) + 14px)}html.tp-touch .tp-fish{width:min(420px,calc(100vw - 340px));padding:8px 12px}html.tp-touch .tp-prompt,html.tp-touch .tp-chips{max-width:calc(100vw - 420px)}}@keyframes tp-drop{0%{opacity:0;transform:translate(-50%,-12px)}}@media (prefers-reduced-motion:reduce){.tp-stick,.tp-pad .tp-btn,.tp-rotate{transition:none;animation:none}}.tp-pad .tp-btn:hover{transform:none}.tp-pad .tp-btn.down:hover{transform:scale(.92) rotate(-2deg)}html.tp-touch .tp-panel{box-sizing:border-box}html.tp-touch .tp-panel .tp-scroll{min-height:0;flex:1 1 auto}html.tp-touch .tp-prompt{white-space:nowrap}html.tp-touch .tp-prompt .key,html.tp-touch .tp-fish .key,html.tp-touch .tp-placebar .key,html.tp-touch .tp-ride .key{display:none}@media (max-height:500px){html.tp-touch .tp-panel{padding:8px 14px}html.tp-touch .tp-head{padding-bottom:4px;margin-bottom:2px}html.tp-touch .tp-head h3{font-size:22px}html.tp-touch .tp-prompt{white-space:normal}}.tp-pad{--ink:#3b2f22;--paper:#f4ead2;--leaf:#7fa36b;font-family:TPSerif,Cormorant Garamond,Garamond,Georgia,serif}.tp-stick{background:radial-gradient(45% 40% at 70% 72%,#d9c49a40,transparent 70%),radial-gradient(60% 55% at 36% 32%,#fffaf0e6 0,#f4ead2d9 48%,#ead9b3c7 80%,#dcc493b3);box-shadow:inset 0 0 0 2px #3b2f22d9,inset .6px -.8px 0 2.6px #3b2f2238,inset 0 0 14px #a88a5a33,0 0 0 1px #3b2f2214,0 3px #3b2f2224,0 9px 20px #3a2a1a2e}.tp-stick:before{background:radial-gradient(closest-side,#7fa36b38,#7fa36b18 70%,transparent)}.tp-stick .ring{stroke:#3b2f2250}.tp-stick .ring path{fill:#3b2f2260}.tp-stick .knob{border:2px solid #3b2f22;background:radial-gradient(40% 35% at 66% 70%,#5f8a4d40,transparent 70%),radial-gradient(70% 60% at 34% 28%,#fffaf0 0,#dfeccb 38%,#a9c58f 72%,#7fa36b);box-shadow:inset .6px -.8px 0 1px #3b2f2230,inset 0 -4px 8px #4f74402e,0 3px #3b2f2240,0 6px 10px #3a2a1a26}.tp-stick.on .knob{background:radial-gradient(40% 35% at 66% 70%,#4f744050,transparent 70%),radial-gradient(70% 60% at 34% 28%,#f6fbe9 0,#c8e0ab 38%,#8fb878 72%,#6a9258)}.tp-stick.run .knob{background:radial-gradient(70% 60% at 34% 28%,#fffaf0 0,#f8deb0 40%,#e2a95e)}.tp-pad .tp-btn{border:0;font:italic 500 14px/1 TPSerif,Cormorant Garamond,Georgia,serif;letter-spacing:.02em;color:#3b2f22;background:radial-gradient(45% 40% at 70% 74%,#d9c49a3d,transparent 70%),radial-gradient(70% 60% at 34% 28%,#fffaf0f0 0,#f4ead2e6 55%,#e6d3aad9);box-shadow:inset 0 0 0 2px #3b2f22e0,inset .7px -.9px 0 2.5px #3b2f2236,inset 0 -5px 10px #a88a5a2e,0 3px #3b2f2230,0 7px 14px #3a2a1a2e;text-shadow:0 1px 0 #fffaf0b0;transition:transform .09s ease-out,background .15s,box-shadow .15s}.tp-pad .tp-btn svg{stroke:#3b2f22}.tp-act{background:radial-gradient(45% 40% at 70% 74%,#d8a85a33,transparent 70%),radial-gradient(70% 60% at 34% 28%,#fffaf0 0,#f7e6bd 55%,#ecc98a)!important}.tp-jump{background:radial-gradient(45% 40% at 70% 74%,#7aa3bd33,transparent 70%),radial-gradient(70% 60% at 34% 28%,#fffaf0 0,#e6eee6 55%,#bcd3d6)!important}.tp-pad .tp-btn.down,.tp-pad .tp-btn.down:hover{transform:scale(.94) rotate(-1.5deg);filter:none;background:radial-gradient(45% 40% at 68% 72%,#4f744040,transparent 70%),radial-gradient(70% 60% at 34% 28%,#f6fbe9 0,#d3e6bd,#9cbf86)!important;box-shadow:inset 0 0 0 2px #3b2f22,inset .7px -.9px 0 2.5px #3b2f2240,inset 0 2px 8px #3f5f3240,0 1px #3b2f2230,0 3px 6px #3a2a1a26}.tp-pad .tp-stick,.tp-pad .tp-acts{transition:opacity .7s ease,transform .15s}.tp-pad.tp-idle .tp-stick,.tp-pad.tp-idle .tp-acts{opacity:0;transition:opacity 1.2s ease .1s}.tp-stick{background:radial-gradient(62% 58% at 38% 34%,#fffaf05c 0,#f4ead238 55%,#e9d9b324);-webkit-backdrop-filter:blur(3px) saturate(1.1);backdrop-filter:blur(3px) saturate(1.1);box-shadow:0 6px 18px #2a1e1426,inset 0 0 22px #fffaf03a}.tp-stick:before{inset:-10px;background:radial-gradient(closest-side,#9cc46a22,#7fa36b10 70%,transparent);filter:blur(2px)}.tp-stick .ring{overflow:visible}.tp-stick .ring .wob{fill:none;stroke:#3b2f22b8;stroke-width:2.1;stroke-dasharray:none;stroke-linecap:round}.tp-stick .ring .wob2{fill:none;stroke:#3b2f2255;stroke-width:1.2;stroke-dasharray:none;stroke-linecap:round}.tp-stick .ring .nib{fill:none;stroke:#3b2f2280;stroke-width:1.8;stroke-dasharray:none;stroke-linecap:round}.tp-stick .knob{width:42%;height:42%;margin:-21% 0 0 -21%;border:1.8px solid #3b2f22cc;background:radial-gradient(38% 34% at 66% 70%,#5f8a4d38,transparent 70%),radial-gradient(70% 62% at 34% 28%,#fffaf0f2 0,#e4efd2e0 40%,#b4cf98d0 76%,#88ad73c8);box-shadow:inset 0 -3px 7px #4f74402a,inset 0 2px 3px #fffaf0aa,0 4px 10px #2a1e1433}.tp-stick.on{transform:scale(1.02)}.tp-stick.on .knob{background:radial-gradient(38% 34% at 66% 70%,#4f744048,transparent 70%),radial-gradient(70% 62% at 34% 28%,#f6fbe9 0,#cfe4b4 40%,#97bd80 76%,#6f985d)}.tp-stick.run .knob{background:radial-gradient(70% 62% at 34% 28%,#fffaf0 0,#f8e2bc 42%,#e3b06a)}.tp-pad .tp-btn{background:radial-gradient(64% 58% at 36% 30%,#fffaf0c8 0,#f4ead29e 60%,#e6d3aa86);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);box-shadow:inset 0 0 0 1.6px #3b2f22b0,inset .8px -1px 0 2.4px #3b2f221c,inset 0 2px 4px #fffaf0b0,0 5px 14px #2a1e142e}.tp-pad .tp-btn .ic{display:flex;align-items:center;justify-content:center}.tp-pad .tp-btn svg{fill:none;stroke:#3b2f22;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.tp-pad .tp-btn svg .soft{stroke-width:1.5;opacity:.6}.tp-act{background:radial-gradient(40% 36% at 70% 74%,#e2b46a2e,transparent 70%),radial-gradient(64% 58% at 36% 30%,#fffaf0d6 0,#f7e8c4b0 60%,#ecd19a96)!important}.tp-jump{background:radial-gradient(40% 36% at 70% 74%,#7aa3bd2a,transparent 70%),radial-gradient(64% 58% at 36% 30%,#fffaf0d6 0,#e8efe8b0 60%,#c3d8db96)!important}.tp-act svg{width:40px!important;height:40px!important}.tp-jump svg{width:32px!important;height:32px!important}.tp-pad .tp-btn.down,.tp-pad .tp-btn.down:hover{transform:scale(.93);background:radial-gradient(64% 58% at 36% 30%,#f6fbe9e0 0,#d3e6bdc0 55%,#9cbf86a8)!important;box-shadow:inset 0 0 0 1.8px #3b2f22,inset 0 2px 8px #3f5f3240,0 2px 6px #2a1e1426}@media (prefers-reduced-motion:reduce){.tp-pad .tp-stick,.tp-pad .tp-acts{transition:none}}html.tp-touch .tp-chips{bottom:calc(env(safe-area-inset-bottom,0px) + 178px)}html.tp-touch .tp-chip .key{display:none}html.tp-touch .tp-chip,html.tp-touch .tp-chip-alt{min-height:44px;font-size:14px;padding:6px 14px 6px 8px}@media (orientation:landscape) and (max-height:520px){html.tp-touch .tp-chips{bottom:calc(env(safe-area-inset-bottom,0px) + 14px);max-width:calc(100vw - 420px)}}