@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-leading:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-ease:initial;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-content:"";--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-tracking:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-gray-200:oklch(92.8% .006 264.531);--color-black:#000;--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-base:1rem;--text-base--line-height: 1.5 ;--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75/1.25);--text-3xl:1.875rem;--text-3xl--line-height: 1.2 ;--text-5xl:3rem;--text-5xl--line-height:1;--text-8xl:6rem;--text-8xl--line-height:1;--tracking-tighter:-.05em;--tracking-wide:.025em;--leading-tight:1.25;--leading-snug:1.375;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--ease-in-out:cubic-bezier(.4,0,.2,1);--aspect-video:16/9;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--font-display:"Terminal Grotesque Open","sans-serif";--font-primary:"Source Code Pro","monospace";--color-fore-primary:#000;--color-back-primary:#dbff00;--color-green-primary:#dbff00;--color-negative:#d2291b;--color-negative-light:#d2291b;--color-negative-dark:#ea4335;--color-overlay-light:#fff;--color-overlay-light-66:#ffffffa8;--color-overlay-light-95:#fffffff2;--color-overlay-dark:#333;--color-overlay-dark-66:#333333a8;--color-overlay-dark-95:#333333f2;--text-display:2.5rem;--text-h1:6rem;--text-h2:3.25rem;--text-h3:3rem;--text-h4:1.5rem;--text-h5:1.125rem;--text-h6:1rem}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}*,:after,:before,::backdrop{border-color:var(--color-gray-200,currentColor)}::file-selector-button{border-color:var(--color-gray-200,currentColor)}}@layer components;@layer utilities{.\@container\/activity{container:activity/inline-size}.\@container\/followers{container:followers/inline-size}.\@container\/listening{container:listening/inline-size}.\@container\/mba{container:mba/inline-size}.\@container\/playlists{container:playlists/inline-size}.collapse{visibility:collapse}.absolute{position:absolute}.relative{position:relative}.top-0{top:calc(var(--spacing)*0)}.left-0{left:calc(var(--spacing)*0)}.container{width:100%}@media (min-width:1200px){.container{max-width:1200px}}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.mx-auto{margin-inline:auto}.mt-8{margin-top:calc(var(--spacing)*8)}.mr-1{margin-right:calc(var(--spacing)*1)}.mr-4{margin-right:calc(var(--spacing)*4)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.ml-\[0\%\]{margin-left:0%}.ml-\[100\%\]{margin-left:100%}.contents{display:contents}.flex{display:flex}.hidden{display:none}.inline-flex{display:inline-flex}.aspect-square{aspect-ratio:1}.aspect-video{aspect-ratio:var(--aspect-video)}.h-8{height:calc(var(--spacing)*8)}.h-12{height:calc(var(--spacing)*12)}.h-16{height:calc(var(--spacing)*16)}.h-\[2rem\]{height:2rem}.h-\[15\.25rem\]{height:15.25rem}.h-\[15rem\]{height:15rem}.h-\[128px\]{height:128px}.h-\[200px\]{height:200px}.h-\[288px\]{height:288px}.h-\[352px\]{height:352px}.h-\[421px\]{height:421px}.h-full{height:100%}.max-h-\[30rem\]{max-height:30rem}.w-8{width:calc(var(--spacing)*8)}.w-12{width:calc(var(--spacing)*12)}.w-\[7rem\]{width:7rem}.w-\[10rem\]{width:10rem}.w-\[224px\]{width:224px}.w-full{width:100%}.max-w-\[448px\]{max-width:448px}.grow{flex-grow:1}.scale-250{--tw-scale-x:250%;--tw-scale-y:250%;--tw-scale-z:250%;scale:var(--tw-scale-x)var(--tw-scale-y)}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-start{justify-content:flex-start}.gap-1{gap:calc(var(--spacing)*1)}.gap-2{gap:calc(var(--spacing)*2)}.gap-2\.5{gap:calc(var(--spacing)*2.5)}.gap-3{gap:calc(var(--spacing)*3)}.gap-4{gap:calc(var(--spacing)*4)}.gap-6{gap:calc(var(--spacing)*6)}.gap-8{gap:calc(var(--spacing)*8)}.gap-12{gap:calc(var(--spacing)*12)}.self-stretch{align-self:stretch}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-y-scroll{overflow-y:scroll}.rounded-3xl{border-radius:var(--radius-3xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.border-1{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-global{border-color:var(--color-fore-primary)}.border-global:where(.dark,.dark *){border-color:var(--color-back-primary)}.border-fore-primary{border-color:var(--color-fore-primary)}.bg-overlay-light-66{background-color:var(--color-overlay-light-66)}.bg-overlay-light-95{background-color:var(--color-overlay-light-95)}.bg-radial{--tw-gradient-position:in oklab;background-image:radial-gradient(var(--tw-gradient-stops))}.from-overlay-light\/66{--tw-gradient-from:#ffffffa8}@supports (color:color-mix(in lab,red,red)){.from-overlay-light\/66{--tw-gradient-from:color-mix(in oklab,var(--color-overlay-light)66%,transparent)}}.from-overlay-light\/66{--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.from-70\%{--tw-gradient-from-position:70%}.via-back-primary{--tw-gradient-via:var(--color-back-primary);--tw-gradient-via-stops:var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-via)var(--tw-gradient-via-position),var(--tw-gradient-to)var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-via-stops)}.to-back-primary{--tw-gradient-to:var(--color-back-primary);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.to-100\%{--tw-gradient-to-position:100%}.bg-center{background-position:50%}.object-cover{object-fit:cover}.p-2{padding:calc(var(--spacing)*2)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.py-1{padding-block:calc(var(--spacing)*1)}.py-2{padding-block:calc(var(--spacing)*2)}.py-3{padding-block:calc(var(--spacing)*3)}.py-4{padding-block:calc(var(--spacing)*4)}.py-6{padding-block:calc(var(--spacing)*6)}.py-10{padding-block:calc(var(--spacing)*10)}.pt-3{padding-top:calc(var(--spacing)*3)}.pt-16{padding-top:calc(var(--spacing)*16)}.pr-3{padding-right:calc(var(--spacing)*3)}.pb-0\.5{padding-bottom:calc(var(--spacing)*.5)}.pb-8{padding-bottom:calc(var(--spacing)*8)}.pl-1{padding-left:calc(var(--spacing)*1)}.pl-2{padding-left:calc(var(--spacing)*2)}.font-display{font-family:var(--font-display)}.font-primary{font-family:var(--font-primary)}.text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-display{font-size:var(--text-display)}.leading-4{--tw-leading:calc(var(--spacing)*4);line-height:calc(var(--spacing)*4)}.text-negative:where(.dark,.dark *){color:var(--color-negative-light)}.text-negative{color:var(--color-negative)}.text-white\/70{color:#ffffffb3}@supports (color:color-mix(in lab,red,red)){.text-white\/70{color:color-mix(in oklab,var(--color-white)70%,transparent)}}.uppercase{text-transform:uppercase}.italic{font-style:italic}.underline{text-decoration-line:underline}.opacity-50{opacity:.5}.opacity-70{opacity:.7}.shadow-back-primary{--tw-shadow-color:#dbff00}@supports (color:color-mix(in lab,red,red)){.shadow-back-primary{--tw-shadow-color:color-mix(in oklab,var(--color-back-primary)var(--tw-shadow-alpha),transparent)}}.outline,.outline-1{outline-style:var(--tw-outline-style);outline-width:1px}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.group-not-data-expanded\:hidden:is(:where(.group):not([data-expanded]) *){display:none}.group-data-expanded\:flex:is(:where(.group)[data-expanded] *){display:flex}.group-data-expanded\:hidden:is(:where(.group)[data-expanded] *){display:none}.group-data-open\:shadow-\[0px_0px_64px_16px\]:is(:where(.group)[data-open] *){--tw-shadow:0px 0px 64px 16px var(--tw-shadow-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.group-data-\[experience\=code\]\:-ml-\[101\%\]:is(:where(.group)[data-experience=code] *){margin-left:-101%}.group-data-\[experience\=code\]\:ml-\[0\%\]:is(:where(.group)[data-experience=code] *){margin-left:0%}.group-data-\[experience\=editor\]\:translate-x-\[0\%\]:is(:where(.group)[data-experience=editor] *){--tw-translate-x:0%;translate:var(--tw-translate-x)var(--tw-translate-y)}.group-data-\[experience\=preview\]\:translate-x-\[-100\%\]:is(:where(.group)[data-experience=preview] *){--tw-translate-x:-100%;translate:var(--tw-translate-x)var(--tw-translate-y)}.data-display\:opacity-100[data-display]{opacity:1}.data-display\:before\:content-\[attr\(data-display\)\][data-display]:before{--tw-content:attr(data-display);content:var(--tw-content)}.data-signup\:hidden[data-signup]{display:none}.data-\[display\=\'\'\]\:opacity-50[data-display=""]{opacity:.5}.data-\[display\=\'\'\]\:before\:content-\[\'Display_Name\'\][data-display=""]:before{--tw-content:"Display Name";content:var(--tw-content)}.data-\[experience\=code\]\:h-\[20rem\][data-experience=code]{height:20rem}@media (min-width:800px){.min-\[800px\]\:text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}}@media (min-width:1200px){.desktop\:justify-start{justify-content:flex-start}.desktop\:text-8xl{font-size:var(--text-8xl);line-height:var(--tw-leading,var(--text-8xl--line-height))}}.dark\:border-back-primary:where(.dark,.dark *){border-color:var(--color-back-primary)}.dark\:bg-overlay-dark-66:where(.dark,.dark *){background-color:var(--color-overlay-dark-66)}.dark\:bg-overlay-dark-95:where(.dark,.dark *){background-color:var(--color-overlay-dark-95)}.dark\:from-overlay-dark\/66:where(.dark,.dark *){--tw-gradient-from:#333333a8}@supports (color:color-mix(in lab,red,red)){.dark\:from-overlay-dark\/66:where(.dark,.dark *){--tw-gradient-from:color-mix(in oklab,var(--color-overlay-dark)66%,transparent)}}.dark\:from-overlay-dark\/66:where(.dark,.dark *){--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.dark\:via-fore-primary:where(.dark,.dark *){--tw-gradient-via:var(--color-fore-primary);--tw-gradient-via-stops:var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-via)var(--tw-gradient-via-position),var(--tw-gradient-to)var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-via-stops)}.dark\:to-fore-primary:where(.dark,.dark *){--tw-gradient-to:var(--color-fore-primary);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}@font-face{font-family:Terminal Grotesque Open;src:url(/assets/terminal-grotesque-open.otf);font-weight:400;font-style:normal}@font-face{font-family:Source Code Pro;src:url(/assets/source-code-pro-regular.woff2);font-weight:400;font-style:normal}@font-face{font-family:GT America Mono;src:url(/assets/gt-america-mono.woff2);font-weight:400;font-style:normal}.scrollbar::-webkit-scrollbar{width:.5rem}.scrollbar::-webkit-scrollbar-track{background:0 0}.scrollbar::-webkit-scrollbar-thumb{background:var(--color-fore-primary)}}.hide-arrows::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.hide-arrows::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.hide-arrows[type=number]{-moz-appearance:textfield}.qn-avatar-input{aspect-ratio:1;width:100%;position:relative}.qn-avatar-input figure{aspect-ratio:1;outline-style:var(--tw-outline-style);outline-offset:-2px;background-size:cover;border-radius:3.40282e38px;outline-width:2px;justify-content:center;align-items:center;width:100%;display:flex;position:relative;overflow:hidden}.qn-avatar-input figure:hover{background-color:#ffffffa8}@supports (color:color-mix(in lab,red,red)){.qn-avatar-input figure:hover{background-color:color-mix(in oklab,var(--color-overlay-light)66%,transparent)}}.qn-avatar-input figure[style*=background-image] span{display:none}.qn-avatar-input:has(figure[style*=background-image]) .controls{display:flex}.qn-avatar-input figure input{top:calc(var(--spacing)*0);left:calc(var(--spacing)*0);aspect-ratio:1;cursor:pointer;opacity:0;border-radius:3.40282e38px;width:100%;position:absolute}.qn-avatar-input .controls{pointer-events:none;top:calc(var(--spacing)*0);left:calc(var(--spacing)*0);justify-content:space-between;align-items:flex-end;width:100%;height:100%;display:none;position:absolute}.qn-avatar-input .controls button{pointer-events:auto;height:calc(var(--spacing)*12);width:calc(var(--spacing)*12);cursor:pointer;background-color:#ffffffa8;border-radius:3.40282e38px;justify-content:center;align-items:center;display:flex}@supports (color:color-mix(in lab,red,red)){.qn-avatar-input .controls button{background-color:color-mix(in oklab,var(--color-overlay-light)66%,transparent)}}.qn-avatar-input .controls button{outline-style:var(--tw-outline-style);outline-offset:-2px;outline-width:2px}.qn-avatar-input .controls button:hover{background-color:#fffffff2}@supports (color:color-mix(in lab,red,red)){.qn-avatar-input .controls button:hover{background-color:color-mix(in oklab,var(--color-overlay-light)95%,transparent)}}.qn-avatar-input .controls button:last-of-type:hover{fill:var(--color-negative-dark)}.qn-avatar-input .controls button:last-of-type:hover:where(.dark,.dark *){fill:var(--color-negative-light)}.qn-avatar-input .controls button:last-of-type:hover{fill:var(--color-negative);outline-color:var(--color-negative)}.qn-button{cursor:pointer;border-radius:var(--radius-3xl);background-color:var(--color-back-primary);fill:var(--color-fore-primary);color:var(--color-fore-primary);text-transform:lowercase;outline-style:var(--tw-outline-style);outline-width:2px;outline-color:var(--color-fore-primary);display:inline-flex;position:relative;overflow:hidden}.qn-button:where(.dark,.dark *){background-color:var(--color-fore-primary);color:var(--color-back-primary)}.qn-button:disabled{cursor:not-allowed;opacity:.5;--tw-grayscale:grayscale(100%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.qn-button-overlay{inset:calc(var(--spacing)*0);z-index:1;width:100%;height:100%;position:absolute}.qn-button-content{z-index:2;justify-content:center;align-items:center;width:100%;display:inline-flex}.qn-button-end-adornment,.qn-button-start-adornment{justify-content:center;align-items:center;display:flex}.qn-button-start-adornment{height:calc(var(--spacing)*8);width:calc(var(--spacing)*8)}.qn-button-end-adornment{height:calc(var(--spacing)*6);width:calc(var(--spacing)*6)}.qn-button[data-variant=primary]{background-color:var(--color-back-primary);fill:var(--color-fore-primary);color:var(--color-fore-primary);outline-color:var(--color-fore-primary)}.qn-button[data-variant=primary]:where(.dark,.dark *){background-color:var(--color-fore-primary);fill:var(--color-back-primary);color:var(--color-back-primary);outline-color:var(--color-back-primary)}.qn-button[data-variant=primary]:hover .qn-button-overlay{background-color:#ffffffb3}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=primary]:hover .qn-button-overlay{background-color:color-mix(in oklab,var(--color-overlay-light)70%,transparent)}}.qn-button[data-variant=primary]:hover .qn-button-overlay:where(.dark,.dark *){background-color:#333333b3}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=primary]:hover .qn-button-overlay:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-overlay-dark)70%,transparent)}}.qn-button[data-variant=primary]:active .qn-button-overlay{background-color:#fffffff2}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=primary]:active .qn-button-overlay{background-color:color-mix(in oklab,var(--color-white)95%,transparent)}}.qn-button[data-variant=primary]:active .qn-button-overlay:where(.dark,.dark *){background-color:#000000f2}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=primary]:active .qn-button-overlay:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-black)95%,transparent)}}.qn-button[data-variant=secondary]{background-color:var(--color-fore-primary);fill:var(--color-back-primary);color:var(--color-back-primary);outline-color:var(--color-fore-primary)}.qn-button[data-variant=secondary]:where(.dark,.dark *){background-color:var(--color-back-primary);fill:var(--color-fore-primary);color:var(--color-fore-primary);outline-color:var(--color-back-primary)}.qn-button[data-variant=secondary]:hover .qn-button-overlay{background-color:#33333326}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=secondary]:hover .qn-button-overlay{background-color:color-mix(in oklab,var(--color-overlay-dark)15%,transparent)}}.qn-button[data-variant=secondary]:hover .qn-button-overlay:where(.dark,.dark *){background-color:#ffffff26}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=secondary]:hover .qn-button-overlay:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-overlay-light)15%,transparent)}}.qn-button[data-variant=secondary]:active .qn-button-overlay{background-color:#33333340}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=secondary]:active .qn-button-overlay{background-color:color-mix(in oklab,var(--color-overlay-dark)25%,transparent)}}.qn-button[data-variant=secondary]:active .qn-button-overlay:where(.dark,.dark *){background-color:#ffffff40}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=secondary]:active .qn-button-overlay:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-overlay-light)25%,transparent)}}.qn-button[data-variant=tertiary]{background-color:var(--color-overlay-light);fill:var(--color-fore-primary);color:var(--color-fore-primary);outline-color:var(--color-fore-primary)}.qn-button[data-variant=tertiary]:where(.dark,.dark *){background-color:var(--color-overlay-dark);fill:var(--color-back-primary);color:var(--color-back-primary);outline-color:var(--color-back-primary)}.qn-button[data-variant=tertiary]:hover .qn-button-overlay{background-color:#ffffff80}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=tertiary]:hover .qn-button-overlay{background-color:color-mix(in oklab,var(--color-overlay-light)50%,transparent)}}.qn-button[data-variant=tertiary]:hover .qn-button-overlay:where(.dark,.dark *){background-color:#33333380}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=tertiary]:hover .qn-button-overlay:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-overlay-dark)50%,transparent)}}.qn-button[data-variant=tertiary]:active .qn-button-overlay{background-color:#ffffffe6}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=tertiary]:active .qn-button-overlay{background-color:color-mix(in oklab,var(--color-white)90%,transparent)}}.qn-button[data-variant=tertiary]:active .qn-button-overlay:where(.dark,.dark *){background-color:#000000e6}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=tertiary]:active .qn-button-overlay:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-black)90%,transparent)}}.qn-button[data-variant=icon]{background-color:inherit;fill:var(--color-fore-primary);color:inherit}.qn-button[data-variant=icon]:where(.dark,.dark *){fill:var(--color-back-primary)}.qn-button[data-variant=icon]:hover .qn-button-overlay,.qn-button[data-variant=icon]:active .qn-button-overlay{background-color:inherit}.qn-button[data-variant=semi-subtle]{background-color:#ffffffb3}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=semi-subtle]{background-color:color-mix(in oklab,var(--color-white)70%,transparent)}}.qn-button[data-variant=semi-subtle]{--tw-outline-style:none;outline-style:none}.qn-button[data-variant=semi-subtle]:where(.dark,.dark *){background-color:#000000b3}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=semi-subtle]:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-black)70%,transparent)}}.qn-button[data-variant=semi-subtle-backed]{outline-style:var(--tw-outline-style);outline-offset:-1px;outline-width:1px;outline-color:var(--color-back-primary)}.qn-button[data-variant=semi-subtle-backed]:where(.dark,.dark *){outline-color:var(--color-fore-primary)}.qn-button[data-variant=semi-subtle-backed] .qn-button-overlay{background-color:#ffffff4d}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=semi-subtle-backed] .qn-button-overlay{background-color:color-mix(in oklab,var(--color-overlay-light)30%,transparent)}}.qn-button[data-variant=semi-subtle-backed] .qn-button-overlay:where(.dark,.dark *){background-color:#3333334d}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=semi-subtle-backed] .qn-button-overlay:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-overlay-dark)30%,transparent)}}.qn-button[data-variant=semi-subtle-backed]:hover .qn-button-overlay{background-color:#ffffffa8}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=semi-subtle-backed]:hover .qn-button-overlay{background-color:color-mix(in oklab,var(--color-overlay-light)66%,transparent)}}.qn-button[data-variant=semi-subtle-backed]:hover .qn-button-overlay:where(.dark,.dark *){background-color:#333333a8}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=semi-subtle-backed]:hover .qn-button-overlay:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-overlay-dark)66%,transparent)}}.qn-button[data-variant=semi-subtle-backed]:active.qn-button-overlay{background-color:#fffffff2}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=semi-subtle-backed]:active.qn-button-overlay{background-color:color-mix(in oklab,var(--color-overlay-light)95%,transparent)}}.qn-button[data-variant=semi-subtle-backed]:active.qn-button-overlay:where(.dark,.dark *){background-color:#333333f2}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=semi-subtle-backed]:active.qn-button-overlay:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-overlay-dark)95%,transparent)}}.qn-button[data-variant=subtle]{--tw-outline-style:none;background-color:#0000;outline-style:none}.qn-button[data-variant=subtle]:hover{background-color:#ffffffa8}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=subtle]:hover{background-color:color-mix(in oklab,var(--color-overlay-light)66%,transparent)}}.qn-button[data-variant=subtle]:hover{--tw-outline-style:none;outline-style:none}.qn-button[data-variant=subtle]:hover:where(.dark,.dark *){background-color:#333333a8}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=subtle]:hover:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-overlay-dark)66%,transparent)}}.qn-button[data-variant=subtle]:active{background-color:#fffffff2}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=subtle]:active{background-color:color-mix(in oklab,var(--color-overlay-light)95%,transparent)}}.qn-button[data-variant=subtle]:active{--tw-outline-style:none;outline-style:none}.qn-button[data-variant=subtle]:active:where(.dark,.dark *){background-color:#333333f2}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=subtle]:active:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-overlay-dark)95%,transparent)}}.qn-button[data-variant=subtle-backed]{background-color:var(--color-back-primary);outline-style:var(--tw-outline-style);outline-offset:-1px;outline-width:1px;outline-color:var(--color-back-primary)}.qn-button[data-variant=subtle-backed]:where(.dark,.dark *){background-color:var(--color-fore-primary);outline-color:var(--color-fore-primary)}.qn-button[data-variant=subtle-backed]:hover .qn-button-overlay{background-color:#ffffffa8}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=subtle-backed]:hover .qn-button-overlay{background-color:color-mix(in oklab,var(--color-overlay-light)66%,transparent)}}.qn-button[data-variant=subtle-backed]:hover .qn-button-overlay:where(.dark,.dark *){background-color:#333333a8}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=subtle-backed]:hover .qn-button-overlay:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-overlay-dark)66%,transparent)}}.qn-button[data-variant=subtle-backed]:active .qn-button-overlay{background-color:#fffffff2}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=subtle-backed]:active .qn-button-overlay{background-color:color-mix(in oklab,var(--color-overlay-light)95%,transparent)}}.qn-button[data-variant=subtle-backed]:active .qn-button-overlay:where(.dark,.dark *){background-color:#333333f2}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=subtle-backed]:active .qn-button-overlay:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-overlay-dark)95%,transparent)}}.qn-button[data-variant=destructive]{background-color:#fffffff2}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=destructive]{background-color:color-mix(in oklab,var(--color-overlay-light)95%,transparent)}}.qn-button[data-variant=destructive]{fill:var(--color-negative-dark)}.qn-button[data-variant=destructive]:where(.dark,.dark *){fill:var(--color-negative-light)}.qn-button[data-variant=destructive]{fill:var(--color-negative);color:var(--color-negative-dark)}.qn-button[data-variant=destructive]:where(.dark,.dark *){color:var(--color-negative-light)}.qn-button[data-variant=destructive]{color:var(--color-negative);outline-color:var(--color-negative)}.qn-button[data-variant=destructive]:where(.dark,.dark *){background-color:#333333f2}@supports (color:color-mix(in lab,red,red)){.qn-button[data-variant=destructive]:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-overlay-dark)95%,transparent)}}.qn-button[data-size=xs]{height:calc(var(--spacing)*7);border-radius:var(--radius-xl);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));--tw-leading:1;--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide);text-transform:uppercase;outline-style:var(--tw-outline-style);outline-width:2px;line-height:1}.qn-button[data-size=xs] .qn-button-content,.qn-button[data-size=sm] .qn-button-content{padding-right:calc(var(--spacing)*3);padding-left:calc(var(--spacing)*2)}.qn-button[data-size=xs] .qn-button-start-adornment,.qn-button[data-size=sm] .qn-button-start-adornment{margin-right:calc(var(--spacing)*1)}.qn-button[data-size=xs] .qn-button-end-adornment,.qn-button[data-size=sm] .qn-button-end-adornment{margin-left:calc(var(--spacing)*.5)}.qn-button[data-size=sm]{height:calc(var(--spacing)*9);font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.qn-button[data-size=sm] .qn-button-text{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height));white-space:nowrap}.qn-button[data-size=md]{height:calc(var(--spacing)*11);font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.qn-button[data-size=md] .qn-button-content{padding-right:calc(var(--spacing)*4);padding-left:calc(var(--spacing)*3)}.qn-button[data-size=lg]{height:calc(var(--spacing)*15);padding:calc(var(--spacing)*2);font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height));border-radius:32px}.qn-button[data-size=lg] .qn-button-content{border-radius:var(--radius-3xl);padding-right:calc(var(--spacing)*4);padding-left:calc(var(--spacing)*3);outline-style:var(--tw-outline-style);outline-width:2px}.qn-button[data-square=true]{aspect-ratio:1;border-radius:var(--radius-lg);justify-content:center;align-items:center;display:flex}.qn-button[data-square=true] .qn-button-content,.qn-button[data-square=true] .qn-button-start-adornment{margin:calc(var(--spacing)*0);padding:calc(var(--spacing)*0);outline-style:var(--tw-outline-style);outline-width:0}.qn-checkbox{align-items:center;gap:calc(var(--spacing)*2);padding:calc(var(--spacing)*1);display:flex}.qn-checkbox span{height:calc(var(--spacing)*8);width:calc(var(--spacing)*8);border-radius:var(--radius-xl);background-color:#fffffff2;justify-content:center;align-items:center;display:flex}@supports (color:color-mix(in lab,red,red)){.qn-checkbox span{background-color:color-mix(in oklab,var(--color-overlay-light)95%,transparent)}}.qn-checkbox span{outline-style:var(--tw-outline-style);outline-offset:-2px;outline-width:2px;outline-color:var(--color-fore-primary)}.qn-checkbox span:active{background-color:#333333f2}@supports (color:color-mix(in lab,red,red)){.qn-checkbox span:active{background-color:color-mix(in oklab,var(--color-overlay-dark)95%,transparent)}}.qn-checkbox input{cursor:pointer;opacity:0;width:100%;height:100%}.qn-color-picker{height:calc(var(--spacing)*12);border-radius:var(--radius-3xl);width:100%;padding-inline:calc(var(--spacing)*3);outline-style:var(--tw-outline-style);outline-offset:-2px;outline-width:2px;outline-color:var(--color-fore-primary);align-items:center;display:flex}.qn-color-picker:hover{background-color:#ffffffa8}@supports (color:color-mix(in lab,red,red)){.qn-color-picker:hover{background-color:color-mix(in oklab,var(--color-overlay-light)66%,transparent)}}.qn-color-picker:has(input:focus){--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.qn-color-picker input:focus{outline-style:var(--tw-outline-style);outline-width:0}.qn-color-picker figure{margin-right:calc(var(--spacing)*2);height:calc(var(--spacing)*8);width:calc(var(--spacing)*8);border-style:var(--tw-border-style);border-width:1px;border-color:#000000b3;border-radius:3.40282e38px;overflow:hidden}@supports (color:color-mix(in lab,red,red)){.qn-color-picker figure{border-color:color-mix(in oklab,var(--color-fore-primary)70%,transparent)}}.qn-color-picker figure{background-color:var(--picked-color)}.qn-color-picker figure input{cursor:pointer;opacity:0;width:100%;height:100%}.qn-color-picker span{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.qn-color-picker input{width:100%;font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.qn-input-text{height:calc(var(--spacing)*12);cursor:text;border-radius:var(--radius-3xl);background-color:var(--color-fore-primary);width:100%;fill:var(--color-back-primary);padding-block:calc(var(--spacing)*2);padding-right:calc(var(--spacing)*1.5);padding-left:calc(var(--spacing)*3);font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height));color:var(--color-back-primary);outline-style:var(--tw-outline-style);outline-offset:-2px;outline-width:2px;outline-color:var(--color-back-primary);align-items:center;display:flex}.qn-input-text:has(:focus){--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.qn-input-text:has(:disabled){opacity:.5;--tw-grayscale:grayscale(100%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.qn-input-text:has(:disabled),.qn-input-text:has(:disabled) *{cursor:not-allowed}.qn-input-text:has(input:user-invalid){outline-color:var(--color-negative)}.qn-input-text:has(label){height:calc(var(--spacing)*16);border-radius:var(--radius-xl)}.qn-input-text:has(textarea){height:auto}.qn-input-text-start-adornment{margin-right:calc(var(--spacing)*2);height:calc(var(--spacing)*8);width:calc(var(--spacing)*8)}.qn-input-text:has(textarea) .qn-input-text-start-adornment{display:none}.qn-input-text-container{align-items:center;width:100%;display:flex}.qn-input-text-container:has(label){flex-direction:column;align-items:flex-start}.qn-input-text-container:has(label) .qn-input-text-header{order:0;width:100%}.qn-input-text-header{gap:calc(var(--spacing)*2);order:2;display:flex}.qn-input-text-header label{width:100%;font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));--tw-leading:var(--leading-tight);line-height:var(--leading-tight);color:#ffffffb3}@supports (color:color-mix(in lab,red,red)){.qn-input-text-header label{color:color-mix(in oklab,var(--color-overlay-light)70%,transparent)}}.qn-input-text-header label{text-transform:uppercase}.qn-input-text .input-container{align-items:center;gap:calc(var(--spacing)*.25);width:100%;display:flex}.qn-input-text .input-container div{height:calc(var(--spacing)*6);align-items:center;width:100%;display:flex;position:relative;overflow-x:hidden}.qn-input-text input,.qn-input-text textarea{margin-right:calc(var(--spacing)*1.5);font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height));outline-style:var(--tw-outline-style);outline-width:0;flex-grow:1}:is(.qn-input-text input,.qn-input-text textarea)::placeholder{color:#ffffffb3}@supports (color:color-mix(in lab,red,red)){:is(.qn-input-text input,.qn-input-text textarea)::placeholder{color:color-mix(in oklab,var(--color-overlay-light)70%,transparent)}}.qn-input-text textarea{width:100%}.qn-input-text input{height:calc(var(--spacing)*6);width:100%;position:absolute}.qn-input-text:has(label) input{flex-grow:1;width:100%}.qn-input-text[data-variant=secondary]{fill:var(--color-fore-primary);color:var(--color-fore-primary);outline-color:var(--color-fore-primary);background-color:#0000}.qn-input-text[data-variant=secondary]:hover,.qn-input-text[data-variant=secondary]:focus{background-color:var(--color-overlay-light-66)}.qn-input-text[data-variant=secondary] label{color:#000000b3}@supports (color:color-mix(in lab,red,red)){.qn-input-text[data-variant=secondary] label{color:color-mix(in oklab,var(--color-fore-primary)70%,transparent)}}.qn-input-text[data-variant=secondary] input,.qn-input-text[data-variant=secondary] textarea{color:var(--color-fore-primary)}:is(.qn-input-text[data-variant=secondary] input,.qn-input-text[data-variant=secondary] textarea)::placeholder{color:#000000b3}@supports (color:color-mix(in lab,red,red)){:is(.qn-input-text[data-variant=secondary] input,.qn-input-text[data-variant=secondary] textarea)::placeholder{color:color-mix(in oklab,var(--color-fore-primary)70%,transparent)}}.qn-input-text[data-variant=tertiary]{background-color:#ffffff54}@supports (color:color-mix(in lab,red,red)){.qn-input-text[data-variant=tertiary]{background-color:color-mix(in oklab,var(--color-overlay-light)33%,transparent)}}.qn-input-text[data-variant=tertiary]{fill:var(--color-fore-primary);color:var(--color-fore-primary);outline-color:var(--color-fore-primary)}.qn-input-text[data-variant=tertiary]:hover,.qn-input-text[data-variant=tertiary]:focus{background-color:var(--color-overlay-light-66)}.qn-input-text[data-variant=tertiary] label{color:#000000b3}@supports (color:color-mix(in lab,red,red)){.qn-input-text[data-variant=tertiary] label{color:color-mix(in oklab,var(--color-fore-primary)70%,transparent)}}.qn-input-text[data-variant=tertiary] input,.qn-input-text[data-variant=tertiary] textarea{color:var(--color-fore-primary)}:is(.qn-input-text[data-variant=tertiary] input,.qn-input-text[data-variant=tertiary] textarea)::placeholder{color:#000000b3}@supports (color:color-mix(in lab,red,red)){:is(.qn-input-text[data-variant=tertiary] input,.qn-input-text[data-variant=tertiary] textarea)::placeholder{color:color-mix(in oklab,var(--color-fore-primary)70%,transparent)}}.qn-chip{height:calc(var(--spacing)*10);min-width:calc(var(--spacing)*12);justify-content:center;align-items:center;gap:calc(var(--spacing)*.5);border-radius:var(--radius-lg);background-color:var(--color-back-primary);padding-right:calc(var(--spacing)*1);padding-left:calc(var(--spacing)*1.5);white-space:nowrap;outline-width:1px;outline-style:var(--tw-outline-style);outline-offset:-2px;outline-width:2px;display:inline-flex;overflow:hidden}.qn-chip[data-size=sm]{height:calc(var(--spacing)*8);min-width:calc(var(--spacing)*12);border-radius:var(--radius-2xl);padding-inline:calc(var(--spacing)*3);outline-style:var(--tw-outline-style);outline-width:1px;gap:-.5rem}.qn-chip[data-size=sm][data-variant=avatar]{padding-left:calc(var(--spacing)*0)}.qn-contextual-menu{max-height:calc(var(--spacing)*56);width:100%;max-width:calc(var(--spacing)*96);border-radius:var(--radius-xl);outline-width:1px;outline-style:var(--tw-outline-style);outline-offset:-2px;outline-width:2px;outline-color:var(--color-fore-primary);flex-direction:column;display:inline-flex;position:relative;overflow:hidden}.qn-contextual-menu .footer{bottom:calc(var(--spacing)*0);left:calc(var(--spacing)*0);width:100%;padding:calc(var(--spacing)*2);align-items:center;display:flex;position:absolute}.qn-message{align-items:center;gap:calc(var(--spacing)*2);display:flex}.qn-message p{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.qn-message start-adornment{height:calc(var(--spacing)*4);width:calc(var(--spacing)*4)}.qn-select-container{gap:calc(var(--spacing)*1);flex-direction:column;display:flex}.qn-select-container * ::selection{background-image:none}.qn-select-container ::selection{background-image:none}.qn-select-container select{display:none}.qn-select{cursor:pointer;border-radius:var(--radius-xl);border-style:var(--tw-border-style);border-width:2px;border-color:var(--color-fore-primary);width:100%;padding-inline:calc(var(--spacing)*2);padding-block:calc(var(--spacing)*1.5);justify-content:space-between;align-items:center;display:flex}@media (hover:hover){.qn-select:hover{background-color:var(--color-overlay-light-66)}}.qn-select:where(.dark,.dark *){border-color:var(--color-back-primary)}@media (hover:hover){.qn-select:where(.dark,.dark *):hover{background-color:var(--color-overlay-dark-66)}}.qn-select:active{background-color:var(--color-overlay-light-95)}.qn-select:active:where(.dark,.dark *):active{background-color:var(--color-overlay-dark-95)}.qn-select:disabled{cursor:not-allowed;opacity:.66}.qn-select-container .menu{z-index:8000;width:100%;display:none}.qn-select-container .menu.open{display:block;position:relative}.qn-select-container .menu .qn-contextual-menu{top:calc(var(--spacing)*0);left:calc(var(--spacing)*0);width:100%;position:absolute}.qn-tab-bar{justify-content:center;align-items:center;gap:calc(var(--spacing)*2);background-color:var(--color-fore-primary);padding:calc(var(--spacing)*2);color:var(--color-back-primary);outline-width:1px;outline-style:var(--tw-outline-style);outline-offset:-2px;border-radius:3.40282e38px;outline-width:2px;display:inline-flex}.qn-tab-bar-item{min-height:calc(var(--spacing)*12);min-width:calc(var(--spacing)*12);cursor:pointer;border-radius:var(--radius-xl);padding-inline:calc(var(--spacing)*1);align-items:center;display:flex}.qn-tab-bar-item:first-of-type{border-top-left-radius:var(--radius-3xl);border-bottom-left-radius:var(--radius-3xl)}.qn-tab-bar-item:last-of-type{border-top-right-radius:var(--radius-3xl);border-bottom-right-radius:var(--radius-3xl);padding-right:calc(var(--spacing)*2);padding-left:calc(var(--spacing)*1)}.qn-tab-bar-item:hover,.qn-tab-bar-item.selected{background-color:var(--color-back-primary);color:var(--color-fore-primary)}body{background-color:var(--color-back-primary);width:100%;max-width:1728px;height:100vh;fill:var(--color-fore-primary);font-family:var(--font-primary);color:var(--color-fore-primary);flex-direction:column;grid-template-rows:4rem 1fr;grid-template-columns:8rem auto;margin:auto;display:flex;position:relative}body:has([data-expanded]){grid-template-columns:22% auto}@media (min-width:1200px){body{gap:calc(var(--spacing)*2);padding:calc(var(--spacing)*2);display:grid}}main{width:100%;padding:calc(var(--spacing)*3);grid-row-start:2;grid-column-start:2;padding-bottom:4rem}@media (min-width:1200px){main{min-height:calc(var(--spacing)*0);padding-inline:calc(var(--spacing)*0);padding-bottom:calc(var(--spacing)*0);overflow-y:auto}}#toolbar{pointer-events:none;bottom:calc(var(--spacing)*0);left:calc(var(--spacing)*0);z-index:500;width:100%;fill:var(--color-back-primary);padding-inline:calc(var(--spacing)*1);flex-direction:column;justify-content:flex-end;align-self:flex-end;display:flex;position:fixed;overflow-y:hidden}#toolbar[data-open]{pointer-events:auto}@media (min-width:1200px){#toolbar{display:none;position:static}}#toolbar{margin-bottom:calc(.25rem + env(safe-area-inset-bottom))}#toolbar-content{z-index:501;--tw-translate-y:100%;width:100%;translate:var(--tw-translate-x)var(--tw-translate-y);background-color:var(--color-fore-primary);padding-inline:calc(var(--spacing)*2);padding-top:calc(var(--spacing)*3);padding-bottom:calc(var(--spacing)*5);color:var(--color-back-primary);transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration));--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out);border-top-left-radius:28px;border-top-right-radius:28px;flex-direction:column;margin-bottom:-4rem;display:flex}#toolbar-content:is(:where(.group)[data-open] *){--tw-translate-y:calc(var(--spacing)*0);translate:var(--tw-translate-x)var(--tw-translate-y);margin-bottom:-1.5rem}.toolbar-menu{flex-direction:column;display:flex}.toolbar-menu li{width:100%}.toolbar-menu li a{justify-content:space-between;align-items:center;gap:calc(var(--spacing)*2);padding:calc(var(--spacing)*3);display:flex}.toolbar-menu li a .adornment{height:calc(var(--spacing)*8);width:calc(var(--spacing)*8);justify-content:center;align-items:center;display:flex}.toolbar-menu li a .display{width:100%;padding-left:calc(var(--spacing)*1)}#toolbar-screen{z-index:502;background-color:var(--color-back-primary);width:100%;height:2rem;display:block;position:absolute}#toolbar-nav{pointer-events:auto;z-index:503;background-color:var(--color-fore-primary);width:100%;padding:calc(var(--spacing)*1);color:var(--color-back-primary);border-radius:28px;justify-content:space-between;align-items:center;display:flex}.toolbar-nav-item button{min-height:calc(var(--spacing)*12);min-width:calc(var(--spacing)*12);cursor:pointer;justify-content:center;align-items:center;gap:calc(var(--spacing)*1.5);padding:calc(var(--spacing)*2);transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration));--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out);display:flex}.toolbar-nav-item.selected button{border-radius:var(--radius-xl)}.toolbar-nav-item.selected button:is(:where(.group)[data-open] *){background-color:var(--color-back-primary);fill:var(--color-fore-primary);color:var(--color-fore-primary)}.toolbar-nav-item button .display{display:none}@media (min-width:600px){.toolbar-nav-item button .display{display:block}}.toolbar-nav-item:last-of-type button .display{display:block}.toolbar-nav-item:first-of-type.selected button{border-top-left-radius:var(--radius-xl);border-top-right-radius:var(--radius-xl);border-bottom-right-radius:var(--radius-xl);border-bottom-left-radius:var(--radius-3xl)}.toolbar-nav-item:last-of-type.selected button{border-top-left-radius:var(--radius-xl);border-top-right-radius:var(--radius-xl);border-bottom-right-radius:var(--radius-3xl);border-bottom-left-radius:var(--radius-xl)}#player{z-index:5000}#player:where(.dark,.dark *){color:var(--color-back-primary)}#player .container{border-radius:var(--radius-xl);border-style:var(--tw-border-style);border-width:2px;border-color:var(--color-fore-primary);background-color:var(--color-fore-primary);flex-direction:column;width:100%;display:none}@media (min-width:1200px){#player .container{display:flex}}#player .container:where(.dark,.dark *){fill:var(--color-back-primary)}#player .main{align-items:center;gap:calc(var(--spacing)*2);width:100%;height:64px;padding-left:calc(var(--spacing)*2);display:flex}#player .main .controls{padding-inline:calc(var(--spacing)*2);display:flex}:is(#player .main .controls .shuffle,.main .controls .repeat):is(:where(.group):has([data-open]) *){opacity:0}#player .main .controls li button{height:calc(var(--spacing)*12);width:calc(var(--spacing)*12);justify-content:center;align-items:center;display:flex}#player .main .track-info{opacity:.25;flex-grow:1;display:flex}#player .main .endcap{margin-inline:calc(var(--spacing)*4);align-items:center;gap:calc(var(--spacing)*3);display:flex}#player .main .account-button{height:calc(var(--spacing)*8);width:calc(var(--spacing)*8);border-style:var(--tw-border-style);border-width:1px;border-radius:3.40282e38px;justify-content:center;align-items:center;display:flex;overflow:hidden}#player .main .account-button:where(.dark,.dark *){border-color:var(--color-back-primary);background-color:var(--color-back-primary);fill:#00000080}@supports (color:color-mix(in lab,red,red)){#player .main .account-button:where(.dark,.dark *){fill:color-mix(in oklab,var(--color-fore-primary)50%,transparent)}}#player .main .account-experience{z-index:5000;margin-top:calc(var(--spacing)*14);margin-right:calc(var(--spacing)*-4);width:calc(var(--spacing)*90);border-radius:var(--radius-3xl);padding:calc(var(--spacing)*3);align-self:flex-end;display:none;position:absolute}#player .main .account-experience:is(:where(.group)[data-open] *){display:block}#player .main .account-experience:where(.dark,.dark *){background-color:var(--color-fore-primary);color:var(--color-back-primary)}#player .info{height:calc(var(--spacing)*0);width:100%;display:flex;overflow:hidden}#player .info[data-open]{height:500px}#player .info .experience{gap:calc(var(--spacing)*2);width:100%;height:100%;padding:calc(var(--spacing)*3);flex-direction:column;display:flex}#player .info .experience ul{justify-content:space-between;align-items:center;width:100%;display:flex}#player .info .experience{display:flex}#player .info .experience .visualizer{justify-content:center;align-items:center;height:100%;display:flex}#player .info .experience .queue{border-radius:var(--radius-xl);background-color:#dbff0033;flex-direction:column;width:100%;height:100%;display:flex}@supports (color:color-mix(in lab,red,red)){#player .info .experience .queue{background-color:color-mix(in oklab,var(--color-back-primary)20%,transparent)}}#player .info .experience .queue{padding:calc(var(--spacing)*2)}#player .info .experience .queue .heading{justify-content:space-between;display:flex}#player .info .art{width:100%;padding:calc(var(--spacing)*3);justify-content:center;align-items:center;display:flex}#sidebar{border-radius:var(--radius-xl);outline-style:var(--tw-outline-style);outline-offset:-1px;outline-width:1px;flex-direction:column;grid-row:1/-1;justify-content:flex-start;align-items:center;height:100%;display:none;overflow-y:scroll}@media (min-width:1200px){#sidebar{display:flex}}#sidebar header{width:100%;height:64px;padding-inline:calc(var(--spacing)*6);align-items:center;display:flex}#sidebar nav{gap:calc(var(--spacing)*3);flex-direction:column;flex-grow:1;width:100%;display:flex}#sidebar nav li{list-style-type:none}#sidebar .sidebar-item h6{padding-inline:calc(var(--spacing)*4);padding-block:calc(var(--spacing)*2)}#sidebar .sidebar-item .minimized{cursor:pointer;justify-content:center;align-items:center;gap:calc(var(--spacing)*3);padding:calc(var(--spacing)*4);flex-direction:column;display:flex}#sidebar .sidebar-item .minimized:is(:where(.group)[data-expanded] *){display:none}#sidebar .sidebar-item section{width:100%;display:none}#sidebar .sidebar-item section:is(:where(.group)[data-expanded] *){display:flex}#sidebar .sidebar-item .section-menu-item{align-items:center;gap:calc(var(--spacing)*2);width:100%;padding:calc(var(--spacing)*3);display:flex}#sidebar footer{flex-direction:column;align-items:center;width:100%;display:flex}#sidebar footer .expand{padding-inline:calc(var(--spacing)*6);padding-block:calc(var(--spacing)*4)}#sidebar footer .expand button{height:calc(var(--spacing)*12);width:calc(var(--spacing)*12);cursor:pointer;background-color:var(--color-fore-primary);border-radius:3.40282e38px;justify-content:center;align-items:center;display:flex}#sidebar footer .expand button:is(:where(.group):not([data-expanded]) *){fill:var(--color-back-primary)}#sidebar footer .expand button:is(:where(.group)[data-expanded] *){background-color:#ffffff80;width:auto}@supports (color:color-mix(in lab,red,red)){#sidebar footer .expand button:is(:where(.group)[data-expanded] *){background-color:color-mix(in oklab,var(--color-white)50%,transparent)}}#sidebar footer .expand button:is(:where(.group)[data-expanded] *){padding-block:calc(var(--spacing)*2);padding-right:calc(var(--spacing)*4);padding-left:calc(var(--spacing)*3)}.account-preview{gap:calc(var(--spacing)*6);border-radius:var(--radius-3xl);background-color:var(--color-green-primary);width:100%;padding:calc(var(--spacing)*8);color:var(--color-black);outline-style:var(--tw-outline-style);outline-offset:-2px;outline-width:2px;flex-direction:column;display:flex}.account-preview p{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.account-preview .pill{height:calc(var(--spacing)*12);align-items:center;gap:calc(var(--spacing)*1);border-radius:var(--radius-xl);background-color:var(--color-back-primary);padding:calc(var(--spacing)*2);color:var(--color-fore-primary);outline-style:var(--tw-outline-style);outline-offset:-2px;outline-width:2px;display:inline-flex}.account-preview .avatar{background-size:cover}.account-preview .avatar[style*=background-image] svg{display:none}.theme-picker{align-items:center;gap:calc(var(--spacing)*3);border-radius:var(--radius-3xl);padding:calc(var(--spacing)*4);outline-style:var(--tw-outline-style);outline-offset:-2px;outline-width:2px;flex-direction:column;display:flex}@media (prefers-color-scheme:dark){html{color-scheme:dark}}input,textarea{font-family:var(--font-sans)}h1{font-family:var(--font-display);font-size:var(--text-h1);--tw-leading:84px;text-transform:lowercase;line-height:84px}h2{font-family:var(--font-primary);font-size:var(--text-h2);--tw-tracking:var(--tracking-tighter);letter-spacing:var(--tracking-tighter);text-transform:lowercase}h3{font-family:var(--font-display);font-size:var(--text-h3);text-transform:lowercase}h4{font-size:var(--text-h4);text-transform:lowercase}h5{font-size:var(--text-h5);text-transform:uppercase}h6{font-size:var(--text-h6)}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-leading{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-ease{syntax:"*";inherits:false}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-content{syntax:"*";inherits:false;initial-value:""}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}