@property --ring{syntax:"<percentage>";inherits:false;initial-value:100%}@layer components{.ctl{--pc:var(--player,#a66cff);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);color:var(--ink);font-family:var(--font-ui);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;flex-direction:column;display:flex;position:fixed;inset:0;overflow:hidden}.ctl-scroll{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;overflow-y:auto}.ctl-btn{font-family:var(--font-display);border:3px solid var(--ink);box-shadow:0 6px 0 var(--ink);background:var(--cream);color:var(--ink);touch-action:manipulation;-webkit-tap-highlight-color:transparent;cursor:pointer;border-radius:22px;font-weight:700;transition:transform 90ms,box-shadow 90ms,filter .12s,background-color .12s;position:relative}.ctl-btn[data-pressed=true]{box-shadow:0 2px 0 var(--ink);transform:translateY(4px)scale(.94)}.ctl-btn:disabled,.ctl-btn[aria-disabled=true]{filter:grayscale(.75)opacity(.5);cursor:default}.ctl-btn:focus-visible{outline:4px solid var(--sky-blue);outline-offset:3px}.ctl-card{background:var(--cream);border:3px solid var(--ink);box-shadow:0 6px 0 var(--ink);border-radius:24px}.ctl-chip{border:3px solid var(--ink);box-shadow:0 3px 0 var(--ink);background:var(--cream);font-family:var(--font-display);border-radius:999px;font-weight:700}.ctl-outline-default{outline:4px dashed var(--ink);outline-offset:5px}.ctl-ring{background:conic-gradient(from 0deg, var(--ring-color,var(--ink)) var(--ring), #2b1f3a1f 0);border-radius:28px;padding:6px;animation-name:ctl-ring;animation-timing-function:linear;animation-fill-mode:forwards;position:relative}@keyframes ctl-ring{0%{--ring:100%}to{--ring:0%}}.ctl-ring-dot{border-radius:999px;place-items:center;width:64px;height:64px;display:grid}.ctl-ring-dot>span{background:var(--cream);border:3px solid var(--ink);border-radius:999px;place-items:center;width:50px;height:50px;display:grid}.ctl-input{background:var(--cream);border:3px solid var(--ink);width:100%;font-family:var(--font-display);-webkit-user-select:text;user-select:text;border-radius:20px;outline:none;padding:14px 18px;font-size:26px;font-weight:700;box-shadow:inset 0 3px #2b1f3a1f}.ctl-input:focus{border-color:var(--pc);box-shadow:0 0 0 4px color-mix(in srgb, var(--pc) 35%, transparent)}.ctl-input::placeholder{color:color-mix(in srgb, var(--slate) 70%, transparent)}.ctl-stripes{background-image:repeating-linear-gradient(-45deg,#ffffff2e 0 14px,#0000 14px 28px)}}.ctl-flash{pointer-events:none;background:var(--pc);opacity:0;z-index:60;animation:80ms ease-out ctl-flash;position:fixed;inset:0}@keyframes ctl-flash{0%{opacity:.35}to{opacity:0}}@keyframes ctl-pulse{0%,to{filter:brightness();transform:scale(1)}50%{filter:brightness(1.12);transform:scale(1.06)}}@keyframes ctl-bob{0%,to{transform:translateY(0)rotate(-2deg)}50%{transform:translateY(-10px)rotate(2deg)}}@keyframes ctl-pop{0%{opacity:0;transform:scale(.5)}65%{opacity:1;transform:scale(1.1)}to{transform:scale(1)}}@keyframes ctl-rise{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes ctl-spin{to{transform:rotate(360deg)}}@keyframes ctl-wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-6deg)}75%{transform:rotate(6deg)}}@keyframes ctl-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes ctl-confetti{0%{opacity:1;transform:translateY(-20vh)rotate(0)}to{transform:translate3d(var(--dx,0), 110vh, 0) rotate(720deg);opacity:1}}@keyframes ctl-ripple{0%{opacity:.55;transform:translate(-50%,-50%)scale(.2)}to{opacity:0;transform:translate(-50%,-50%)scale(2.4)}}@keyframes ctl-dice{0%{transform:rotate(-8deg)scale(.9)}50%{transform:rotate(8deg)scale(1.05)}to{transform:rotate(-8deg)scale(.9)}}.ctl-anim-pulse{animation:1s ease-in-out infinite ctl-pulse}.ctl-anim-bob{animation:2.2s ease-in-out infinite ctl-bob}.ctl-anim-pop{animation:.36s cubic-bezier(.2,.9,.3,1.3) both ctl-pop}.ctl-anim-rise{animation:.32s cubic-bezier(.2,.9,.3,1.2) both ctl-rise}.ctl-anim-spin{animation:.9s linear infinite ctl-spin}.ctl-anim-wiggle{animation:.6s ease-in-out infinite ctl-wiggle}.ctl-anim-dice{animation:.5s ease-in-out infinite ctl-dice}.ctl-ripple{pointer-events:none;background:#ffffffe6;border-radius:999px;width:120px;height:120px;animation:.42s ease-out forwards ctl-ripple;position:absolute}.ctl-shimmer{background:linear-gradient(90deg,#fff0 0%,#ffffffa6 50%,#fff0 100%) 0 0/200% 100%;animation:1.4s linear infinite ctl-shimmer}.ctl[data-reduced=true] .ctl-anim-pulse,.ctl[data-reduced=true] .ctl-anim-bob,.ctl[data-reduced=true] .ctl-anim-wiggle,.ctl[data-reduced=true] .ctl-anim-dice,.ctl[data-reduced=true] .ctl-shimmer,.ctl[data-reduced=true] .ctl-confetti-bit{animation:none!important}.ctl[data-reduced=true] .ctl-confetti-bit{display:none}