.player{display:flex;flex-direction:column;gap:12px}.player canvas{display:block;width:100%;aspect-ratio:4 / 5}.player.against .figures{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}.player.against canvas{background:#17171a;border:1px solid var(--goldline)}.player.against .lane{margin:0;min-width:0}.player.against .lane-title{margin:0 0 8px;text-align:center;color:var(--mist);opacity:.65;font-size:.86rem;line-height:1.25}.player.against .fail{aspect-ratio:8 / 5}.player .phrases{margin:12px 0 0}.player .phrases li[role=button]{cursor:pointer}.player .phrases li.now{border:1px solid var(--white)}.player .phrases li:focus-visible{outline:2px solid var(--gold);outline-offset:2px}@media(max-width:700px){.player.against .figures{gap:12px}}.player .row,.clipbar{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;height:36px;padding:0 8px}.player .rail{display:flex;align-items:center;gap:8px;padding:0 8px}.player.against .rail,.player.against .row{padding:0}.player .btn,.clipbar .btn{margin:0;min-height:28px;padding:0 10px;font-size:.8rem;color:var(--body)}.player .btn:hover,.clipbar .btn:hover{border-color:var(--gold);box-shadow:var(--shadow-raise);transform:none}.player .btn.play,.clipbar .btn.play{width:28px;height:28px;min-height:28px;padding:0}.player .rates{display:flex;align-items:center}.player .rates .btn+.btn{margin-left:-1px}.player .rates .btn.on{position:relative;z-index:1}.player .btn.on{border-color:color-mix(in srgb,var(--gold) 70%,transparent);background-image:none;background-color:color-mix(in srgb,var(--gold) 10%,transparent);color:var(--gold)}.player .btn.on:hover{border-color:var(--gold);background-color:color-mix(in srgb,var(--gold) 16%,transparent)}.player .clock,.clipbar .clock{flex:0 0 auto;width:40px;text-align:right;font-family:var(--sans);font-size:10px;color:var(--mist);font-variant-numeric:tabular-nums;white-space:nowrap}.player .fail{margin:0;aspect-ratio:4 / 5;display:grid;place-items:center;color:var(--mist);font-family:var(--sans);font-size:12px;text-align:center}.player .scrub,.clipbar .scrub{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:16px;margin:0;background:transparent;cursor:pointer;flex:1 1 auto;min-width:40px}.player .scrub:focus-visible,.clipbar .scrub:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.player .scrub::-webkit-slider-runnable-track,.clipbar .scrub::-webkit-slider-runnable-track{height:2px;border-radius:0;background:linear-gradient(to right,var(--gold) var(--p, 0%),color-mix(in srgb,var(--white) 15%,transparent) var(--p, 0%))}.player .scrub::-webkit-slider-thumb,.clipbar .scrub::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:10px;height:16px;margin-top:-7px;border:0;border-radius:0;background:var(--gold);box-shadow:var(--shadow-raise)}.player .scrub::-moz-range-track,.clipbar .scrub::-moz-range-track{height:2px;border:0;border-radius:0;background:color-mix(in srgb,var(--white) 15%,transparent)}.player .scrub::-moz-range-progress,.clipbar .scrub::-moz-range-progress{height:2px;background:var(--gold)}.player .scrub::-moz-range-thumb,.clipbar .scrub::-moz-range-thumb{width:10px;height:16px;border:0;border-radius:0;background:var(--gold);box-shadow:var(--shadow-raise)}.player .scrub[style*=--a]::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--gold) var(--p, 0%),transparent var(--p, 0%)),linear-gradient(to right,transparent var(--a, 0%),color-mix(in srgb,var(--gold) 35%,transparent) var(--a, 0%),color-mix(in srgb,var(--gold) 35%,transparent) var(--b, 100%),transparent var(--b, 100%)),linear-gradient(to right,color-mix(in srgb,var(--white) 15%,transparent),color-mix(in srgb,var(--white) 15%,transparent))}.player .scrub[style*=--a]::-moz-range-track{background:linear-gradient(to right,transparent var(--a, 0%),color-mix(in srgb,var(--gold) 35%,transparent) var(--a, 0%),color-mix(in srgb,var(--gold) 35%,transparent) var(--b, 100%),transparent var(--b, 100%)),linear-gradient(to right,color-mix(in srgb,var(--white) 15%,transparent),color-mix(in srgb,var(--white) 15%,transparent))}.clipbar .btn.ghost{width:28px;height:28px;min-height:28px;padding:0;border-color:color-mix(in srgb,var(--goldline) 40%,transparent);background-image:none;background-color:transparent;box-shadow:none;color:color-mix(in srgb,var(--body) 78%,transparent)}.clipbar .btn.ghost:hover{border-color:var(--gold);color:var(--gold);box-shadow:none;transform:none}.take-root,.publish-root,.take,.publish{--rose: color-mix(in srgb, #e07a8a 85%, var(--white))}.take .socket,.publish .socket{margin-top:0;padding:16px;border:1px solid transparent}.take .socket.drag,.publish .socket.drag{border-color:var(--gold)}.take .socket .row,.publish .socket .row{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;align-items:center;gap:8px;width:fit-content;margin:0 auto}.take .socket .btn,.publish .socket .btn{margin:0}.take .btn.gold,.publish .btn.gold{border-color:color-mix(in srgb,var(--gold) 70%,transparent);background-image:none;background-color:color-mix(in srgb,var(--gold) 10%,transparent);color:var(--gold)}.take .btn.gold:hover,.publish .btn.gold:hover{border-color:var(--gold);background-color:color-mix(in srgb,var(--gold) 16%,transparent)}.take .socket .btn[disabled],.take .socket .btn[aria-disabled=true],.publish .socket .btn[disabled],.publish .socket .btn[aria-disabled=true]{opacity:.5;cursor:default;pointer-events:none}.take .socket .btn[disabled]:hover,.take .socket .btn[aria-disabled=true]:hover,.publish .socket .btn[disabled]:hover,.publish .socket .btn[aria-disabled=true]:hover{transform:none}.take .note,.publish .note{margin:8px 0 0;color:var(--mist);font-family:var(--sans);font-size:.86rem;font-variant-numeric:tabular-nums}.take .note.rose,.publish .note.rose{color:var(--rose)}.take .vh,.publish .vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;white-space:nowrap;border:0;clip-path:inset(50%)}.take .vh:focus-visible+.btn,.publish .vh:focus-visible+.btn{outline:2px solid var(--gold);outline-offset:2px}.publish-root .rail{display:block}.publish-root .say{margin:0 0 10px;color:var(--mist);font-family:var(--sans);font-size:.86rem;letter-spacing:normal;text-transform:none}.publish-root .named{display:flex;align-items:flex-start;gap:10px}.publish-root .still{flex:0 0 auto;width:40px;height:50px;object-fit:cover;display:block;border:1px solid var(--goldline)}.publish-root .press{flex:1 1 auto;min-width:0}.publish-root .flex{display:flex}.publish-root .inline-flex{display:inline-flex}.publish-root .flex-col{flex-direction:column}.publish-root .items-center{align-items:center}.publish-root .items-stretch{align-items:stretch}.publish-root .justify-center{justify-content:center}.publish-root .gap-1{gap:.25rem}.publish-root .gap-2{gap:.5rem}.publish-root .flex-1{flex:1 1 0%}.publish-root .shrink-0{flex-shrink:0}.publish-root .min-w-0{min-width:0}.publish-root .w-full{width:100%}.publish-root .min-h-10{min-height:36px}.publish-root .px-2{padding-left:.5rem;padding-right:.5rem}.publish-root .px-3{padding-left:.75rem;padding-right:.75rem}.publish-root .py-2{padding-top:.5rem;padding-bottom:.5rem}.publish-root .rounded-none{border-radius:0}.publish-root .bg-transparent{background:transparent}.publish-root .leading-snug{line-height:1.375}.publish-root .text-xs{font-size:.75rem;line-height:1rem}.publish-root .text-\[13px\]{font-size:13px}.publish-root .text-\[10px\]{font-size:10px}.publish-root .text-gold{color:var(--gold)}.publish-root .text-ink{color:var(--body)}.publish-root .text-ink\/40{color:color-mix(in srgb,var(--body) 40%,transparent)}.publish-root .text-rose-300{color:var(--rose)}.publish-root .text-rose-300\/60{color:color-mix(in srgb,var(--rose) 60%,transparent)}.publish-root .disabled\:opacity-40:disabled{opacity:.4}.publish-root :where(.btn-primary,.btn-ghost){display:inline-flex;align-items:center;justify-content:center;gap:.5rem;box-sizing:border-box;border-radius:0;border:1px solid transparent;cursor:pointer;padding:.5rem .9rem;white-space:normal;text-align:center;font-family:var(--sans);font-size:.875rem;font-weight:500;line-height:1.2;letter-spacing:.04em;text-decoration:none;transition:border-color .15s ease,box-shadow .15s ease,transform .12s ease,background-color .15s ease,color .15s ease}.publish-root :where(.btn-primary,.btn-ghost):disabled{opacity:.5;cursor:default}.publish-root :where(.btn-primary,.btn-ghost):focus-visible{outline:2px solid var(--gold);outline-offset:2px}.publish-root .btn-primary{border-color:var(--gold);color:var(--gold);background-color:color-mix(in srgb,var(--gold) 16%,transparent);box-shadow:var(--shadow-raise)}.publish-root .btn-primary:hover:not(:disabled){background-color:color-mix(in srgb,var(--gold) 26%,transparent);box-shadow:var(--shadow-lift);transform:translateY(-1px)}.publish-root .btn-ghost{border-color:color-mix(in srgb,var(--goldline) 40%,transparent);background:transparent;color:color-mix(in srgb,var(--body) 78%,transparent)}.publish-root .btn-ghost:hover:not(:disabled){border-color:var(--gold);color:var(--white);box-shadow:var(--shadow-lift);transform:translateY(-1px)}.publish-root .press input[type=text]{box-sizing:border-box;min-height:36px;min-width:0;border:1px solid color-mix(in srgb,var(--goldline) 40%,transparent);background:transparent;color:var(--white);font-family:var(--sans);font-size:.75rem;letter-spacing:.02em}.publish-root .press input[type=text]::placeholder{color:color-mix(in srgb,var(--body) 25%,transparent)}.publish-root .press input[type=text]:focus{border-color:var(--gold);outline:none}@keyframes challenge-reveal{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes challenge-reveal-out{0%{opacity:1;transform:none}to{opacity:0;transform:translateY(6px)}}.player .reveal,.publish-root .reveal{animation:challenge-reveal .2s ease-out both}.player .reveal-out,.publish-root .reveal-out{animation:challenge-reveal-out .15s ease-in both;pointer-events:none}@keyframes challenge-fade{0%{opacity:0}to{opacity:1}}.take .reveal{animation:challenge-reveal .2s ease-out both}.stage .pane.reveal{animation:challenge-fade .2s ease-out both}@media(prefers-reduced-motion:reduce){.player .reveal,.player .reveal-out,.publish-root .reveal,.publish-root .reveal-out,.take .reveal,.stage .pane.reveal{animation:none}}.take .socket{display:flex;flex-direction:column;align-items:center;gap:16px;padding:16px;border:1px solid color-mix(in srgb,#a88433 60%,transparent);background:linear-gradient(to bottom,var(--surfacetop),var(--surface));box-shadow:var(--shadow-raise);transition:box-shadow .3s ease}@media(min-width:640px){.take .socket{padding:20px}}.take .socket:hover{box-shadow:0 0 0 1px #c79a3f80,0 0 24px 2px #c79a3f38}.take .socket.drag{border-color:color-mix(in srgb,#a88433 60%,transparent)}.take .gem{position:relative;display:flex;align-items:center;justify-content:center;width:128px;height:128px;margin:0;padding:0;box-sizing:border-box;border-radius:50%;border:2px solid color-mix(in srgb,#a88433 50%,transparent);background:radial-gradient(circle at 50% 38%,#17171a,#0b0b0d 68%,#060607);box-shadow:inset 0 2px 4px #0000000d;color:color-mix(in srgb,var(--gold) 40%,transparent);cursor:pointer;text-decoration:none;transition:border-color .2s ease,box-shadow .2s ease,color .2s ease}.take .gem:hover{border-color:var(--gold);color:color-mix(in srgb,var(--gold) 70%,transparent);box-shadow:0 0 0 1px #c79a3f80,0 0 24px 2px #c79a3f38}.take .socket.drag .gem{border-color:var(--gold);color:color-mix(in srgb,var(--gold) 80%,transparent);box-shadow:0 0 0 1px #c79a3f80,0 0 24px 2px #c79a3f38}.take .gem.lit{border-color:var(--gold);color:var(--gold);box-shadow:0 0 0 1px #c79a3f80,0 0 24px 2px #c79a3f38}.take .gem[aria-disabled=true]{cursor:default;pointer-events:none}.take .gem .glyph{display:block}.take .gem .ring{position:absolute;top:8px;right:8px;bottom:8px;left:8px;border-radius:50%;pointer-events:none;box-shadow:0 0 0 1px #ffffff0d}.take .vh:focus-visible+.gem{outline:2px solid var(--gold);outline-offset:2px}.take .socket .note{margin:0;text-align:center}.take .socket .row{margin:0 auto}@media(max-width:420px){.publish-root .press .text-\[13px\]{font-size:11px}}.take .two,.publish .two{display:flex;flex-direction:column;align-items:center;margin:0}.publish .two{margin-top:12px}.take .two-box,.publish .two-box{display:inline-flex;align-items:center;gap:10px;min-height:36px;margin:0;padding:0 4px;border:0;background:none;box-shadow:none;cursor:pointer;color:var(--body);font-family:var(--sans);font-size:.86rem;line-height:1.2;font-weight:inherit;font-size-adjust:inherit}.take .two-box .tick,.publish .two-box .tick{flex:0 0 auto;width:20px;height:20px;box-sizing:border-box;border:1px solid var(--goldline);background:linear-gradient(to bottom,var(--surfacetop),var(--surface));box-shadow:var(--shadow-raise);transition:background .15s ease,border-color .15s ease}.take .two-box:hover .tick,.publish .two-box:hover .tick{border-color:var(--gold)}.take .two-box[aria-checked=true] .tick,.publish .two-box[aria-checked=true] .tick{border-color:var(--gold);background:var(--gold)}.take .two-box:focus-visible,.publish .two-box:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.take .two-box[disabled],.publish .two-box[disabled]{opacity:.5;cursor:default}.take .two-side,.publish .two-side{margin-top:8px}.take .two-pick,.publish .two-pick{display:flex;align-items:center;justify-content:center;gap:10px}.take .two-say,.publish .two-say{color:var(--body);font-family:var(--sans);font-size:.86rem;white-space:nowrap}.take .two-plates,.publish .two-plates{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px}.take .two .btn,.publish .two .btn{margin:0}.take .two .btn[disabled],.publish .two .btn[disabled]{opacity:.5;cursor:default;pointer-events:none}.take .two-yes,.publish .two-yes{margin:8px 0 0;color:var(--mist);opacity:.65;font-family:var(--sans);font-size:.8rem;text-align:center;text-wrap:balance}.publish .row.send .btn[disabled]{opacity:.5;cursor:default;pointer-events:none}.take .reveal-out{animation:challenge-reveal-out .15s ease-in both;pointer-events:none}@media(prefers-reduced-motion:reduce){.take .reveal-out{animation:none}}
