@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-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-font-weight:initial;--tw-tracking: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-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-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0}}}@layer theme{:root,:host{--font-sans:"Poppins", "Inter", sans-serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-yellow-200:oklch(94.5% .129 101.54);--color-yellow-300:oklch(90.5% .182 98.111);--color-yellow-400:oklch(85.2% .199 91.936);--color-pink-400:oklch(71.8% .202 349.761);--color-slate-100:oklch(96.8% .007 247.896);--color-slate-500:oklch(55.4% .046 257.417);--color-slate-900:oklch(20.8% .042 265.755);--color-white:#fff;--spacing:.25rem;--container-lg:32rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--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-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--font-weight-medium:500;--font-weight-bold:700;--font-weight-extrabold:800;--font-weight-black:900;--tracking-tight:-.025em;--tracking-widest:.1em;--leading-tight:1.25;--leading-snug:1.375;--leading-relaxed:1.625;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--drop-shadow-md:0 3px 3px #0000001f;--blur-md:12px;--blur-xl:24px;--blur-3xl:64px;--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);--color-brand-accent:#cf0}}@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}}@layer components;@layer utilities{.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.-inset-1{inset:calc(var(--spacing) * -1)}.top-0{top:calc(var(--spacing) * 0)}.top-20{top:calc(var(--spacing) * 20)}.right-0{right:calc(var(--spacing) * 0)}.bottom-0{bottom:calc(var(--spacing) * 0)}.-left-4{left:calc(var(--spacing) * -4)}.left-20{left:calc(var(--spacing) * 20)}.z-10{z-index:10}.col-span-4{grid-column:span 4/span 4}.row-span-2{grid-row:span 2/span 2}.mx-auto{margin-inline:auto}.\!mt-0{margin-top:calc(var(--spacing) * 0)!important}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-12{margin-top:calc(var(--spacing) * 12)}.mt-20{margin-top:calc(var(--spacing) * 20)}.mb-1{margin-bottom:calc(var(--spacing) * 1)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.mb-8{margin-bottom:calc(var(--spacing) * 8)}.mb-10{margin-bottom:calc(var(--spacing) * 10)}.mb-12{margin-bottom:calc(var(--spacing) * 12)}.ml-2{margin-left:calc(var(--spacing) * 2)}.flex{display:flex}.grid{display:grid}.h-9{height:calc(var(--spacing) * 9)}.h-12{height:calc(var(--spacing) * 12)}.h-20{height:calc(var(--spacing) * 20)}.h-28{height:calc(var(--spacing) * 28)}.h-64{height:calc(var(--spacing) * 64)}.h-72{height:calc(var(--spacing) * 72)}.h-80{height:calc(var(--spacing) * 80)}.h-full{height:100%}.\!min-h-0{min-height:calc(var(--spacing) * 0)!important}.min-h-screen{min-height:100vh}.w-9{width:calc(var(--spacing) * 9)}.w-12{width:calc(var(--spacing) * 12)}.w-20{width:calc(var(--spacing) * 20)}.w-28{width:calc(var(--spacing) * 28)}.w-64{width:calc(var(--spacing) * 64)}.w-72{width:calc(var(--spacing) * 72)}.w-80{width:calc(var(--spacing) * 80)}.w-full{width:100%}.max-w-\[240px\]{max-width:240px}.max-w-lg{max-width:var(--container-lg)}.flex-shrink-0{flex-shrink:0}.cursor-pointer{cursor:pointer}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.\!flex-row{flex-direction:row!important}.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}.gap-1{gap:calc(var(--spacing) * 1)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-6{gap:calc(var(--spacing) * 6)}.overflow-hidden{overflow:hidden}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-3xl{border-radius:var(--radius-3xl)}.rounded-full{border-radius:3.40282e38px}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-white\/10{border-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.border-white\/10{border-color:color-mix(in oklab,var(--color-white) 10%,transparent)}}.border-white\/20{border-color:#fff3}@supports (color:color-mix(in lab,red,red)){.border-white\/20{border-color:color-mix(in oklab,var(--color-white) 20%,transparent)}}.border-white\/50{border-color:#ffffff80}@supports (color:color-mix(in lab,red,red)){.border-white\/50{border-color:color-mix(in oklab,var(--color-white) 50%,transparent)}}.bg-\[\#000000\]{background-color:#000}.bg-\[\#FF0000\]{background-color:red}.bg-pink-400\/20{background-color:#fb64b633}@supports (color:color-mix(in lab,red,red)){.bg-pink-400\/20{background-color:color-mix(in oklab,var(--color-pink-400) 20%,transparent)}}.bg-slate-100{background-color:var(--color-slate-100)}.bg-white{background-color:var(--color-white)}.bg-white\/5{background-color:#ffffff0d}@supports (color:color-mix(in lab,red,red)){.bg-white\/5{background-color:color-mix(in oklab,var(--color-white) 5%,transparent)}}.bg-white\/20{background-color:#fff3}@supports (color:color-mix(in lab,red,red)){.bg-white\/20{background-color:color-mix(in oklab,var(--color-white) 20%,transparent)}}.bg-yellow-300\/20{background-color:#ffe02a33}@supports (color:color-mix(in lab,red,red)){.bg-yellow-300\/20{background-color:color-mix(in oklab,var(--color-yellow-300) 20%,transparent)}}.bg-gradient-to-r{--tw-gradient-position:to right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.bg-gradient-to-tr{--tw-gradient-position:to top right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.from-\[\#312e81\]{--tw-gradient-from:#312e81;--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-\[\#833ab4\]{--tw-gradient-from:#833ab4;--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-white{--tw-gradient-from:var(--color-white);--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-yellow-400{--tw-gradient-from:var(--color-yellow-400);--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))}.via-\[\#fd1d1d\]{--tw-gradient-via:#fd1d1d;--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-\[\#1e1b4b\]{--tw-gradient-to:#1e1b4b;--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-\[\#fcb045\]{--tw-gradient-to:#fcb045;--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-white\/30{--tw-gradient-to:#ffffff4d}@supports (color:color-mix(in lab,red,red)){.to-white\/30{--tw-gradient-to:color-mix(in oklab, var(--color-white) 30%, transparent)}}.to-white\/30{--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))}.bg-clip-text{-webkit-background-clip:text;background-clip:text}.object-cover{object-fit:cover}.p-1{padding:calc(var(--spacing) * 1)}.p-4{padding:calc(var(--spacing) * 4)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-6{padding-inline:calc(var(--spacing) * 6)}.\!py-4{padding-block:calc(var(--spacing) * 4)!important}.py-1{padding-block:calc(var(--spacing) * 1)}.py-16{padding-block:calc(var(--spacing) * 16)}.pt-4{padding-top:calc(var(--spacing) * 4)}.text-center{text-align:center}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--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-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[9px\]{font-size:9px}.text-\[10px\]{font-size:10px}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.leading-tight{--tw-leading:var(--leading-tight);line-height:var(--leading-tight)}.font-black{--tw-font-weight:var(--font-weight-black);font-weight:var(--font-weight-black)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-extrabold{--tw-font-weight:var(--font-weight-extrabold);font-weight:var(--font-weight-extrabold)}.tracking-\[0\.3em\]{--tw-tracking:.3em;letter-spacing:.3em}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-widest{--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest)}.text-slate-500{color:var(--color-slate-500)}.text-slate-900{color:var(--color-slate-900)}.text-transparent{color:#0000}.text-white{color:var(--color-white)}.text-white\/20{color:#fff3}@supports (color:color-mix(in lab,red,red)){.text-white\/20{color:color-mix(in oklab,var(--color-white) 20%,transparent)}}.text-white\/40{color:#fff6}@supports (color:color-mix(in lab,red,red)){.text-white\/40{color:color-mix(in oklab,var(--color-white) 40%,transparent)}}.text-white\/50{color:#ffffff80}@supports (color:color-mix(in lab,red,red)){.text-white\/50{color:color-mix(in oklab,var(--color-white) 50%,transparent)}}.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)}}.text-white\/80{color:#fffc}@supports (color:color-mix(in lab,red,red)){.text-white\/80{color:color-mix(in oklab,var(--color-white) 80%,transparent)}}.text-white\/90{color:#ffffffe6}@supports (color:color-mix(in lab,red,red)){.text-white\/90{color:color-mix(in oklab,var(--color-white) 90%,transparent)}}.text-yellow-200{color:var(--color-yellow-200)}.uppercase{text-transform:uppercase}.opacity-40{opacity:.4}.shadow-inner{--tw-shadow:inset 0 2px 4px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.blur{--tw-blur:blur(8px);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,)}.blur-3xl{--tw-blur:blur(var(--blur-3xl));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,)}.blur-md{--tw-blur:blur(var(--blur-md));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,)}.drop-shadow-md{--tw-drop-shadow-size:drop-shadow(0 3px 3px var(--tw-drop-shadow-color,#0000001f));--tw-drop-shadow:drop-shadow(var(--drop-shadow-md));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,)}.filter{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,)}.backdrop-blur-md{--tw-backdrop-blur:blur(var(--blur-md));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.backdrop-blur-xl{--tw-backdrop-blur:blur(var(--blur-xl));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.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-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-1000{--tw-duration:1s;transition-duration:1s}@media(hover:hover){.group-hover\:text-white:is(:where(.group):hover *){color:var(--color-white)}.group-hover\:opacity-60:is(:where(.group):hover *){opacity:.6}.hover\:scale-\[1\.01\]:hover{scale:1.01}.hover\:underline:hover{text-decoration-line:underline}}@media(min-width:40rem){.sm\:col-span-2{grid-column:span 2/span 2}.sm\:py-24{padding-block:calc(var(--spacing) * 24)}}}html{will-change:background-position;overscroll-behavior:none;background:linear-gradient(-45deg,#0d1121,#1e1b4b,#312e81,#1e1b4b) 0 0/400% 400% fixed;min-height:100dvh;animation:25s ease-in-out infinite mesh-gradient}html[style*=margin-top]{background-attachment:scroll!important}body{font-family:var(--font-sans);color:#f2f2f2;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior:none;min-height:100dvh;margin:0;position:relative;overflow-x:hidden;background:0 0!important}body:before{content:"";pointer-events:none;opacity:.04;z-index:50;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");position:fixed;inset:0}.bento-grid{gap:calc(var(--spacing) * 5);width:100%;max-width:540px;padding-inline:calc(var(--spacing) * 5);padding-block:calc(var(--spacing) * 16);grid-template-columns:repeat(4,minmax(0,1fr));margin-inline:auto;display:grid}.frosted-bento{cursor:pointer;flex-direction:column;transition:transform .6s cubic-bezier(.34,1.56,.64,1),background-color .4s,border-color .4s,box-shadow .4s;display:flex;position:relative;overflow:hidden;box-shadow:0 20px 50px -15px #0009;-webkit-backdrop-filter:blur(50px)!important;background:#0d1121e0!important;border:1px solid #ffffff2e!important;border-radius:28px!important;text-decoration:none!important}.bento-glow{will-change:box-shadow,border-color;animation:4s ease-in-out infinite ambient-glow;box-shadow:0 0 50px -5px #ccff0040,0 20px 50px -15px #0009;border-color:#ccff0073!important}@keyframes ambient-glow{0%,to{box-shadow:0 0 50px -5px #cf03,0 20px 50px -15px #0009;border-color:#cf06!important}50%{box-shadow:0 0 75px 5px #cf06,0 25px 60px -10px #000000b3;border-color:#ccff00b3!important}}.frosted-bento:hover{transform:translateY(-8px)scale(1.03);box-shadow:0 40px 80px -20px #000c,inset 0 0 30px #ffffff0d;background:#161c33f2!important;border-color:#fff6!important}.frosted-bento:active{transition:transform .2s cubic-bezier(.34,1.56,.64,1);transform:translateY(-2px)scale(.95)}.gumroad-button{line-height:normal!important;font-size:inherit!important;color:inherit!important;padding:0!important}.gumroad-button>:not(.bento-content){opacity:0!important;visibility:hidden!important;pointer-events:none!important;display:none!important;position:absolute!important}.gumroad-button:before,.gumroad-button:after{content:none!important;display:none!important}.bento-content{z-index:10;height:100%;padding:calc(var(--spacing) * 7);pointer-events:auto;flex-direction:column;display:flex;position:relative}h1{margin-bottom:calc(var(--spacing) * 2);font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height));--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold);--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight);color:var(--color-white)}h2{margin-bottom:calc(var(--spacing) * 2);font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height));--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold);color:var(--color-white);font-family:var(--font-sans)}.text-description{text-align:center;font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium);--tw-tracking:.2em;letter-spacing:.2em;color:#ffffff80}@supports (color:color-mix(in lab,red,red)){.text-description{color:color-mix(in oklab,var(--color-white) 50%,transparent)}}.text-description{text-transform:uppercase}.tag-store{--tw-font-weight:var(--font-weight-black);font-size:10px;font-weight:var(--font-weight-black);--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest);color:#ffffff4d}@supports (color:color-mix(in lab,red,red)){.tag-store{color:color-mix(in oklab,var(--color-white) 30%,transparent)}}.tag-store{text-transform:uppercase}.store-cta{--tw-font-weight:var(--font-weight-bold);font-size:10px;font-weight:var(--font-weight-bold);color:#ffffffb3;align-items:center;margin-top:auto;display:flex}@supports (color:color-mix(in lab,red,red)){.store-cta{color:color-mix(in oklab,var(--color-white) 70%,transparent)}}.store-cta{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration));--tw-duration:.3s;transition-duration:.3s}.frosted-bento:hover .store-cta{--tw-translate-x:calc(var(--spacing) * 1);translate:var(--tw-translate-x) var(--tw-translate-y);color:var(--color-white)}.col-span-4{grid-column:span 4/span 4}.row-span-2{grid-row:span 2/span 2}.grid-cols-3{grid-template-columns:repeat(3,1fr)}@media(min-width:640px){.sm\:col-span-2{grid-column:span 2/span 2}}@keyframes mesh-gradient{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}a{text-decoration:none!important}ul,ol{margin:0;padding:0;list-style:none}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.text-accent{color:var(--color-brand-accent);opacity:.8}@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-font-weight{syntax:"*";inherits:false}@property --tw-tracking{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-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-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{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}

/* ══════════════════════════════════════════════════════════════════════════
   APPLE-DESIGN POLISH LAYER — theme v3.6.1 "Calamansi"

   Hand-written, NOT Tailwind output. Everything below intentionally sits
   after the compiled utilities so it wins on source order.

   ⚠️ If you ever rebuild this theme with Vite/Tailwind, paste this whole
   block at the END of src/style.css first, or the build will erase it.
   ══════════════════════════════════════════════════════════════════════════ */

/* Declare the page dark before a single pixel paints. Without this the
   browser paints its default white canvas first, so the page flashes white
   on every cold load. One line, measurable perceived-speed win. */
:root{color-scheme:dark}

/* ── MATERIAL ──────────────────────────────────────────────────────────────
   Was: blur(50px) sitting behind an 88%-opaque background. At that opacity
   the blur is almost invisible, but the browser still runs a full backdrop
   pass on all ~15 cards, every frame they move. It was also -webkit-
   prefixed only, so Firefox showed no glass at all.
   Now: less blur, more translucency, and a lit top edge. It reads more like
   a real material and costs less to paint. */
.frosted-bento{
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,0) 42%),rgba(13,17,33,.74)!important;
  -webkit-backdrop-filter:blur(26px) saturate(165%)!important;
          backdrop-filter:blur(26px) saturate(165%)!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:26px!important;
  box-shadow:0 14px 34px -14px rgba(0,0,0,.6);
  transition:transform .32s cubic-bezier(.22,1,.36,1),
             background .25s ease,
             border-color .25s ease,
             box-shadow .32s ease;
}

/* ── RESPONSE & PRESS FEEDBACK ─────────────────────────────────────────────
   Hover was translateY(-8px) scale(1.03) over 600ms on a bouncy curve: a
   big, slow, expensive move on a translucent surface. Press was scale(.95),
   a 5% collapse that reads as the card buckling.
   Apple's rule is restraint plus immediacy — small move, ~300ms response,
   and feedback the instant the pointer goes DOWN, not on release. */
@media (hover:hover) and (pointer:fine){
  .frosted-bento:hover{
    transform:translateY(-2px) scale(1.006);
    background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,0) 42%),rgba(22,28,51,.8)!important;
    border-color:rgba(255,255,255,.27)!important;
    box-shadow:0 22px 48px -18px rgba(0,0,0,.7);
  }
}
.frosted-bento:active{
  transform:translateY(0) scale(.985);
  transition:transform .09s ease-out;   /* fast in, spring out */
}

/* Accordions don't navigate anywhere, so they shouldn't lift toward you.
   Their directional hint is the chevron, which points where the panel goes. */
details.frosted-bento{cursor:default}
details.frosted-bento:hover,
details.frosted-bento:active{transform:none}

/* ── FOCUS ─────────────────────────────────────────────────────────────────
   There was no visible focus state anywhere, and the My Kit button actively
   set outline:none. Keyboard users had no idea where they were. */
.frosted-bento:focus-visible,
summary:focus-visible,
.footer-links a:focus-visible,
.kit-body a:focus-visible,
.social-row a:focus-visible{
  outline:2px solid rgba(204,255,0,.85);
  outline-offset:3px;
}

/* ── HERO GLOW ─────────────────────────────────────────────────────────────
   Animating box-shadow repaints the card and everything behind its blur on
   every frame, forever. Kept because it earns attention on the bundle, but
   at roughly half amplitude, slowed to 6s, with the border-color channel
   dropped (a second repaint source) and the will-change hint removed —
   box-shadow can't be composited, so that hint only burned memory.
   If you want the single biggest paint win left on this page, delete the
   `animation` line here and keep the static shadow. */
.bento-glow{
  will-change:auto;
  animation:6s ease-in-out infinite ambient-glow;
  box-shadow:0 0 60px -8px rgba(204,255,0,.4),0 14px 34px -14px rgba(0,0,0,.6);
  border-color:rgba(204,255,0,.42)!important;
}
@keyframes ambient-glow{
  0%,to{box-shadow:0 0 55px -10px rgba(204,255,0,.32),0 14px 34px -14px rgba(0,0,0,.6)}
  50%  {box-shadow:0 0 80px 0 rgba(204,255,0,.5),0 18px 40px -12px rgba(0,0,0,.68)}
}

/* will-change:background-position promoted a compositor layer for a property
   that cannot be composited. Pure memory cost, zero benefit. */
html{will-change:auto}

/* ── TYPOGRAPHY ────────────────────────────────────────────────────────────
   Tracking is size-specific: large text tightens as it grows, small text
   opens up. Sizes move to rem so the layout scales with the reader's text
   size setting instead of ignoring it. */
h1{font-size:clamp(1.75rem,1.3rem + 1.9vw,2.35rem);line-height:1.06;letter-spacing:-.028em;margin-bottom:.5rem}
h2{font-size:clamp(1.125rem,1.06rem + .32vw,1.3rem);line-height:1.22;letter-spacing:-.016em}
.text-description{font-size:.8125rem;font-weight:600;letter-spacing:.15em;line-height:1.5;color:rgba(255,255,255,.62)}
.tag-store{font-size:.625rem;font-weight:800;letter-spacing:.12em;color:rgba(255,255,255,.45)}
.store-cta{font-size:.6875rem;font-weight:700;letter-spacing:.06em;color:rgba(255,255,255,.82)}
.frosted-bento:hover .store-cta{color:#fff}
/* Poppins ships no 900 on Google Fonts, so every .font-black element was
   being faked by the browser. Map it to the 800 we actually load. */
.font-black{--tw-font-weight:800;font-weight:800}
/* px-locked micro-labels move to rem so they scale with the reader's text
   size setting. 9px uppercase at 0.3em tracking was below any legibility
   floor worth defending. */
.text-\[9px\]{font-size:.625rem}
.text-\[10px\]{font-size:.625rem}

/* ── ENTRANCE ──────────────────────────────────────────────────────────────
   Was ten classes with 100ms steps, up to a 1000ms delay. The last card
   arrived a full second after paint, and every card sat at opacity:0 until
   its turn — which also pushes out Largest Contentful Paint, because the
   LCP element literally cannot paint until its delay elapses.
   Now: one class, 45ms steps, capped, shorter travel. */
.stagger{opacity:0;animation:fadeInUp .42s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--i,0) * 45ms)}
@keyframes fadeInUp{from{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:none}}

/* ── ACCORDIONS ────────────────────────────────────────────────────────────
   Native <details>/<summary>. No JavaScript, works before scripts run,
   keyboard and screen-reader correct for free. The height transition is
   progressive enhancement — browsers without ::details-content simply open
   instantly, which is a perfectly good reduced-motion-ish fallback. */
summary{display:block;list-style:none;cursor:pointer;min-height:44px}
summary::-webkit-details-marker{display:none}
summary::marker{content:""}
.chev{transition:transform .3s cubic-bezier(.22,1,.36,1);flex-shrink:0}
details[open]>summary .chev{transform:rotate(180deg)}
@supports (interpolate-size:allow-keywords){
  :root{interpolate-size:allow-keywords}
  details::details-content{
    height:0;min-height:0;overflow:hidden;opacity:0;content-visibility:hidden;
    transition:height .34s cubic-bezier(.22,1,.36,1),
               opacity .24s ease,
               content-visibility .34s allow-discrete;
  }
  details[open]::details-content{height:auto;opacity:1;content-visibility:visible}
}

/* ── ACCESSIBILITY PREFERENCES ─────────────────────────────────────────────
   Reduced motion doesn't mean no feedback — it means a gentler, non-
   vestibular equivalent. Colour and opacity changes stay; travel, springs,
   the full-viewport gradient drift and the ambient pulses go. */
@media (prefers-reduced-motion:reduce){
  html{animation:none!important;background-position:0% 50%!important}
  .stagger{opacity:1!important;animation:none!important}
  .bento-glow,.profile-avatar-glow{animation:none!important}
  .frosted-bento,
  .frosted-bento:hover,
  .frosted-bento:active,
  .profile-avatar-wrapper:hover{transform:none!important}
  .frosted-bento{transition:background .2s ease,border-color .2s ease,box-shadow .2s ease!important}
  details::details-content{transition:opacity .15s ease!important}
  .chev{transition:none!important}
}
@media (prefers-reduced-transparency:reduce){
  .frosted-bento{
    background:#12162a!important;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  }
  .footer-links a{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(255,255,255,.1)}
  .kit-body{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:#12162a!important}
  body:before{display:none}
}
@media (prefers-contrast:more){
  .frosted-bento{
    background:#0a0e1c!important;
    border-color:rgba(255,255,255,.5)!important;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  }
  .tag-store,.store-cta,.text-description{color:#fff}
  .text-white\/40,.text-white\/50,.text-white\/20{color:rgba(255,255,255,.88)!important}
}
